/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___3PdYf {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___3PdYf {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__card___16ovJ {
  background: #fbfbfc;
  border: 1px solid #e0e4e7;
  border-radius: 2px;
  padding: 32px;
}
.styles__newDesign___1bl2t {
  background: #ffffff;
  margin-bottom: 12px;
}
.styles__newDesign___1bl2t .styles__title___2cl7H {
    margin-bottom: 24px;
    font-size: 18px;
    line-height: 24px;
  }
.styles__warn___3C1Xn {
  background: #fffbdd;
  border: 1px solid #ffe881;
  padding: 32px;
}
.styles__title___2cl7H {
  margin: 0;
  margin-bottom: 12px;
  display: inline-block;
  font-size: 22px;
  font-weight: 600;
}
.styles__titleWithLabel___1VOFq {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
}
.styles__label___13A5g {
  display: inline-block;
  margin-left: 20px;
}
.styles__card___16ovJ.styles__disabled___9JZtT {
  opacity: 0.5;
  min-height: 200px;
}
.styles__defaultText___3Rw-A {
  text-align: center;
  font-style: italic;
  margin-top: 20px;
}
.styles__card___16ovJ.styles__shy___15ciY {
  padding: 16px;
}
.styles__card___16ovJ.styles__shy___15ciY .styles__title___2cl7H {
    margin-bottom: 20px;
    text-transform: uppercase;

    font-size: 14px;

    line-height: 20px;

    font-weight: 400;

    letter-spacing: normal;
  }
.styles__titleLabel___2Ubs2 {
  background: #d4c8ed;
  border-radius: 20px;
  min-width: 74px;
  padding: 5px 10px;
  font-size: 14px;
  margin-left: 21px;
  color: #270869;
  text-transform: uppercase;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin-bottom: 12px;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___3ruCp {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___3ruCp {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__wrapper___2N-O6 {
  max-width: 100%;
  margin: 12px 0;
}
.styles__cardContainer___1Gq9h {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
}
.styles__icon___1XcHn {
  -ms-flex-negative: 0;
      flex-shrink: 0;
}
.styles__cardBody___1xEWi {
  margin-left: 16px;
}
.styles__cardText___2Cqzk {
  font-size: 14px;
  line-height: 20px;
  color: #27343b;
}
.styles__cardLink___1itwQ {
  color: #254356;
  display: block;
  font-size: 12px;
  margin-top: 12px;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___2luDk {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___2luDk {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__button___21omF {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  position: relative;
  outline: 0;
  display: inline-block;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-style: solid;
  white-space: nowrap;
  text-align: center;
  font-weight: 700;
  font-style: inherit;
  -webkit-font-feature-settings: inherit;
          font-feature-settings: inherit;
  font-variant: inherit;
  font-family: inherit;
  text-decoration: none;
  overflow: hidden;
  -webkit-transition: background-color 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), border-color 0.6s cubic-bezier(0.25, 0.8, 0.25, 1);
  transition: background-color 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), border-color 0.6s cubic-bezier(0.25, 0.8, 0.25, 1);

  padding: 0 10px;
  margin: 6px 8px;
  min-width: 88px;
  line-height: 32px;
  min-height: 32px;
  border-width: 2px;
  border-radius: 3px;
  font-size: 14px;
  color: white;
  cursor: pointer
}
.styles__button___21omF::first-letter {
  text-transform: uppercase;
}
.styles__button___21omF:disabled {
  pointer-events: none;
  opacity: 0.4;
}
.styles__button___21omF .styles__svg___18qMP {
  fill: white;
  position: relative;
  top: 4px;
}
.styles__icon___5cDE6 {
  min-width: auto;
}
.styles__iconLeft___3AK-D .styles__svg___18qMP, .styles__iconRight___3UG0s .styles__svg___18qMP {
    position: absolute;
  }
.styles__iconLeft___3AK-D::before {
  content: " ";
  display: inline-block;
  margin-right: 8px;
  width: 24px;
}
.styles__iconLeft___3AK-D .styles__svg___18qMP {
    left: 6px;
}
.styles__iconRight___3UG0s::after {
  content: " ";
  display: inline-block;
  margin-left: 8px;
  width: 24px;
}
.styles__iconRight___3UG0s .styles__svg___18qMP {
    right: 6px;
}
.styles__primary___3hMhy {
  /* stylelint-disable function-whitespace-after */
}
.styles__primary___3hMhy:not(.styles__inverted___1iL73) {
  background-color: #099cec;
  border-color: #099cec;
}
.styles__primary___3hMhy:not(.styles__inverted___1iL73):hover {
  background-color: #066da5;
  border-color: #066da5;
}
.styles__primary___3hMhy:not(.styles__inverted___1iL73).styles__text___2HSqd,
    .styles__primary___3hMhy:not(.styles__inverted___1iL73).styles__outlined___kDaBj {
  color: #099cec;
}
.styles__primary___3hMhy:not(.styles__inverted___1iL73).styles__text___2HSqd:hover, .styles__primary___3hMhy:not(.styles__inverted___1iL73).styles__outlined___kDaBj:hover {
  color: #066da5;
}
.styles__primary___3hMhy:not(.styles__inverted___1iL73).styles__outlined___kDaBj.styles__iconRight___3UG0s .styles__svg___18qMP,
    .styles__primary___3hMhy:not(.styles__inverted___1iL73).styles__outlined___kDaBj.styles__iconLeft___3AK-D .styles__svg___18qMP,
    .styles__primary___3hMhy:not(.styles__inverted___1iL73).styles__icon___5cDE6 .styles__svg___18qMP {
  fill: #099cec;
}
.styles__primary___3hMhy:not(.styles__inverted___1iL73).styles__outlined___kDaBj.styles__iconRight___3UG0s:hover .styles__svg___18qMP,
    .styles__primary___3hMhy:not(.styles__inverted___1iL73).styles__outlined___kDaBj.styles__iconLeft___3AK-D:hover .styles__svg___18qMP,
    .styles__primary___3hMhy:not(.styles__inverted___1iL73).styles__icon___5cDE6:hover .styles__svg___18qMP {
  fill: #066da5;
}
.styles__primary___3hMhy {/* stylelint-enable */
}
.styles__primary-consolidated___3wafe {
  /* stylelint-disable function-whitespace-after */
}
.styles__primary-consolidated___3wafe:not(.styles__inverted___1iL73) {
  background-color: #007bff;
  border-color: #007bff;
}
.styles__primary-consolidated___3wafe:not(.styles__inverted___1iL73):hover {
  background-color: #287cf9;
  border-color: #287cf9;
}
.styles__primary-consolidated___3wafe:not(.styles__inverted___1iL73).styles__text___2HSqd,
    .styles__primary-consolidated___3wafe:not(.styles__inverted___1iL73).styles__outlined___kDaBj {
  color: #007bff;
}
.styles__primary-consolidated___3wafe:not(.styles__inverted___1iL73).styles__text___2HSqd:hover, .styles__primary-consolidated___3wafe:not(.styles__inverted___1iL73).styles__outlined___kDaBj:hover {
  color: #287cf9;
}
.styles__primary-consolidated___3wafe:not(.styles__inverted___1iL73).styles__outlined___kDaBj.styles__iconRight___3UG0s .styles__svg___18qMP,
    .styles__primary-consolidated___3wafe:not(.styles__inverted___1iL73).styles__outlined___kDaBj.styles__iconLeft___3AK-D .styles__svg___18qMP,
    .styles__primary-consolidated___3wafe:not(.styles__inverted___1iL73).styles__icon___5cDE6 .styles__svg___18qMP {
  fill: #007bff;
}
.styles__primary-consolidated___3wafe:not(.styles__inverted___1iL73).styles__outlined___kDaBj.styles__iconRight___3UG0s:hover .styles__svg___18qMP,
    .styles__primary-consolidated___3wafe:not(.styles__inverted___1iL73).styles__outlined___kDaBj.styles__iconLeft___3AK-D:hover .styles__svg___18qMP,
    .styles__primary-consolidated___3wafe:not(.styles__inverted___1iL73).styles__icon___5cDE6:hover .styles__svg___18qMP {
  fill: #287cf9;
}
.styles__primary-consolidated___3wafe {/* stylelint-enable */
}
.styles__secondary___2JxIU {
  /* stylelint-disable function-whitespace-after */
}
.styles__secondary___2JxIU:not(.styles__inverted___1iL73) {
  background-color: #70c9a0;
  border-color: #70c9a0;
}
.styles__secondary___2JxIU:not(.styles__inverted___1iL73):hover {
  background-color: #00a2a1;
  border-color: #00a2a1;
}
.styles__secondary___2JxIU:not(.styles__inverted___1iL73).styles__text___2HSqd,
    .styles__secondary___2JxIU:not(.styles__inverted___1iL73).styles__outlined___kDaBj {
  color: #70c9a0;
}
.styles__secondary___2JxIU:not(.styles__inverted___1iL73).styles__text___2HSqd:hover, .styles__secondary___2JxIU:not(.styles__inverted___1iL73).styles__outlined___kDaBj:hover {
  color: #00a2a1;
}
.styles__secondary___2JxIU:not(.styles__inverted___1iL73).styles__outlined___kDaBj.styles__iconRight___3UG0s .styles__svg___18qMP,
    .styles__secondary___2JxIU:not(.styles__inverted___1iL73).styles__outlined___kDaBj.styles__iconLeft___3AK-D .styles__svg___18qMP,
    .styles__secondary___2JxIU:not(.styles__inverted___1iL73).styles__icon___5cDE6 .styles__svg___18qMP {
  fill: #70c9a0;
}
.styles__secondary___2JxIU:not(.styles__inverted___1iL73).styles__outlined___kDaBj.styles__iconRight___3UG0s:hover .styles__svg___18qMP,
    .styles__secondary___2JxIU:not(.styles__inverted___1iL73).styles__outlined___kDaBj.styles__iconLeft___3AK-D:hover .styles__svg___18qMP,
    .styles__secondary___2JxIU:not(.styles__inverted___1iL73).styles__icon___5cDE6:hover .styles__svg___18qMP {
  fill: #00a2a1;
}
.styles__secondary___2JxIU {/* stylelint-enable */
}
.styles__warn___23MWn {
  /* stylelint-disable function-whitespace-after */
}
.styles__warn___23MWn:not(.styles__inverted___1iL73) {
  background-color: #f7d933;
  border-color: #f7d933;
}
.styles__warn___23MWn:not(.styles__inverted___1iL73):hover {
  background-color: #ceaf00;
  border-color: #ceaf00;
}
.styles__warn___23MWn:not(.styles__inverted___1iL73).styles__text___2HSqd,
    .styles__warn___23MWn:not(.styles__inverted___1iL73).styles__outlined___kDaBj {
  color: #f7d933;
}
.styles__warn___23MWn:not(.styles__inverted___1iL73).styles__text___2HSqd:hover, .styles__warn___23MWn:not(.styles__inverted___1iL73).styles__outlined___kDaBj:hover {
  color: #ceaf00;
}
.styles__warn___23MWn:not(.styles__inverted___1iL73).styles__outlined___kDaBj.styles__iconRight___3UG0s .styles__svg___18qMP,
    .styles__warn___23MWn:not(.styles__inverted___1iL73).styles__outlined___kDaBj.styles__iconLeft___3AK-D .styles__svg___18qMP,
    .styles__warn___23MWn:not(.styles__inverted___1iL73).styles__icon___5cDE6 .styles__svg___18qMP {
  fill: #f7d933;
}
.styles__warn___23MWn:not(.styles__inverted___1iL73).styles__outlined___kDaBj.styles__iconRight___3UG0s:hover .styles__svg___18qMP,
    .styles__warn___23MWn:not(.styles__inverted___1iL73).styles__outlined___kDaBj.styles__iconLeft___3AK-D:hover .styles__svg___18qMP,
    .styles__warn___23MWn:not(.styles__inverted___1iL73).styles__icon___5cDE6:hover .styles__svg___18qMP {
  fill: #ceaf00;
}
.styles__warn___23MWn {/* stylelint-enable */
}
.styles__panic___ofWYo {
  /* stylelint-disable function-whitespace-after */
}
.styles__panic___ofWYo:not(.styles__inverted___1iL73) {
  background-color: #e12b0c;
  border-color: #e12b0c;
}
.styles__panic___ofWYo:not(.styles__inverted___1iL73):hover {
  background-color: #bf3b42;
  border-color: #bf3b42;
}
.styles__panic___ofWYo:not(.styles__inverted___1iL73).styles__text___2HSqd,
    .styles__panic___ofWYo:not(.styles__inverted___1iL73).styles__outlined___kDaBj {
  color: #e12b0c;
}
.styles__panic___ofWYo:not(.styles__inverted___1iL73).styles__text___2HSqd:hover, .styles__panic___ofWYo:not(.styles__inverted___1iL73).styles__outlined___kDaBj:hover {
  color: #bf3b42;
}
.styles__panic___ofWYo:not(.styles__inverted___1iL73).styles__outlined___kDaBj.styles__iconRight___3UG0s .styles__svg___18qMP,
    .styles__panic___ofWYo:not(.styles__inverted___1iL73).styles__outlined___kDaBj.styles__iconLeft___3AK-D .styles__svg___18qMP,
    .styles__panic___ofWYo:not(.styles__inverted___1iL73).styles__icon___5cDE6 .styles__svg___18qMP {
  fill: #e12b0c;
}
.styles__panic___ofWYo:not(.styles__inverted___1iL73).styles__outlined___kDaBj.styles__iconRight___3UG0s:hover .styles__svg___18qMP,
    .styles__panic___ofWYo:not(.styles__inverted___1iL73).styles__outlined___kDaBj.styles__iconLeft___3AK-D:hover .styles__svg___18qMP,
    .styles__panic___ofWYo:not(.styles__inverted___1iL73).styles__icon___5cDE6:hover .styles__svg___18qMP {
  fill: #bf3b42;
}
.styles__panic___ofWYo {/* stylelint-enable */
}
.styles__dull___9eEnn {
  /* stylelint-disable function-whitespace-after */
}
.styles__dull___9eEnn:not(.styles__inverted___1iL73) {
  background-color: #8f9ea8;
  border-color: #8f9ea8;
}
.styles__dull___9eEnn:not(.styles__inverted___1iL73):hover {
  background-color: #445d6e;
  border-color: #445d6e;
}
.styles__dull___9eEnn:not(.styles__inverted___1iL73).styles__text___2HSqd,
    .styles__dull___9eEnn:not(.styles__inverted___1iL73).styles__outlined___kDaBj {
  color: #8f9ea8;
}
.styles__dull___9eEnn:not(.styles__inverted___1iL73).styles__text___2HSqd:hover, .styles__dull___9eEnn:not(.styles__inverted___1iL73).styles__outlined___kDaBj:hover {
  color: #445d6e;
}
.styles__dull___9eEnn:not(.styles__inverted___1iL73).styles__outlined___kDaBj.styles__iconRight___3UG0s .styles__svg___18qMP,
    .styles__dull___9eEnn:not(.styles__inverted___1iL73).styles__outlined___kDaBj.styles__iconLeft___3AK-D .styles__svg___18qMP,
    .styles__dull___9eEnn:not(.styles__inverted___1iL73).styles__icon___5cDE6 .styles__svg___18qMP {
  fill: #8f9ea8;
}
.styles__dull___9eEnn:not(.styles__inverted___1iL73).styles__outlined___kDaBj.styles__iconRight___3UG0s:hover .styles__svg___18qMP,
    .styles__dull___9eEnn:not(.styles__inverted___1iL73).styles__outlined___kDaBj.styles__iconLeft___3AK-D:hover .styles__svg___18qMP,
    .styles__dull___9eEnn:not(.styles__inverted___1iL73).styles__icon___5cDE6:hover .styles__svg___18qMP {
  fill: #445d6e;
}
.styles__dull___9eEnn {/* stylelint-enable */
}
.styles__icon___5cDE6,
  .styles__icon___5cDE6:hover,
  .styles__text___2HSqd,
  .styles__text___2HSqd:hover,
  .styles__outlined___kDaBj,
  .styles__outlined___kDaBj:hover {
  background: none !important;
}
.styles__text___2HSqd,
  .styles__text___2HSqd:hover,
  .styles__icon___5cDE6,
  .styles__icon___5cDE6:hover {
  border: none !important;
}
.styles__inverted___1iL73 {
  border-color: white;
  background-color: white;
  color: #099cec
}
.styles__inverted___1iL73:hover {
  background-color: rgba(255, 255, 255, .85);
  border-color: rgba(255, 255, 255, .85);
}
.styles__inverted___1iL73.styles__outlined___kDaBj .styles__svg___18qMP, .styles__inverted___1iL73.styles__text___2HSqd .styles__svg___18qMP {
  fill: white;
}
.styles__inverted___1iL73.styles__outlined___kDaBj,
  .styles__inverted___1iL73.styles__text___2HSqd {
  color: white;
}
.styles__inverted___1iL73.styles__text___2HSqd:hover {
  color: rgba(255, 255, 255, .85);
}
.styles__skinny___2pkOs {
  /* Adjust for the skinnier border by adding more padding inside so the size is the same */
  padding: 1px 11px;
  border-width: 1px;
  font-weight: 600;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___1eVBn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___1eVBn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__tab___ztJkZ {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  line-height: 40px;
  min-width: 100px;
  font-weight: normal;
  margin: 0;
  padding-left: 12px;
  padding-right: 12px;
  border-radius: 0;
  color: #445d6e
}
.styles__tab___ztJkZ:hover {
  color: #099cec;
}
/* vertical tab */
.styles__vtabMuted___3swyE {
  text-align: left;
  font-size: 14px;
  line-height: 44px;
  color: #637986 !important;
  border-bottom: none !important;
  border-left: 4px solid transparent !important;
  margin-top: 2px;
  margin-bottom: 2px;
}
.styles__vtab___3Nxbc {
}
.styles__vtab___3Nxbc:hover {
  border: none !important;
  border-bottom: none !important;
  border-left: 4px solid #099cec !important;
}
/* vertical selected state */
.styles__vselected___I8P3c,
  .styles__vselected___I8P3c:hover {
  border-left: 4px solid #099cec !important;
}
/* We need to override default button styles */
.styles__tab___ztJkZ.styles__button___3ufQz,
  .styles__tab___ztJkZ.styles__button___3ufQz:hover {
  border: none;
  border-bottom: 2px solid transparent;
  background: none;
}
.styles__tab___ztJkZ.styles__selected___1p-n4,
  .styles__tab___ztJkZ.styles__selected___1p-n4:hover {
  font-weight: 600;
  color: #099cec;
  border-bottom-color: #099cec;
}
@media only screen and (max-height: 800px) {
  .styles__vtab___3Nxbc {
    line-height: 10px;
  }
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___O10mt {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___O10mt {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__selected___BAPxg {
  pointer-events: none;
}
.styles__vtabs___mbgSA {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-flow: column nowrap;
          flex-flow: column nowrap;
  width: 200px;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___1w9xN {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___1w9xN {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__breadcrumbs___18Yr8 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 100%;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.styles__breadcrumb___9YQZc {
  position: relative;
  color: rgba(37, 67, 86, .7);
  padding: 11px 11px 11px 22px;
}
.styles__breadcrumbLink___29y-D {
  text-decoration: none
}
.styles__breadcrumbLink___29y-D:hover {
  color: #099cec;
}
/* First breadcrumb does not need as much left padding */
.styles__breadcrumb___9YQZc:first-child {
  padding: 11px 5.5px 11px 11px;
}
.styles__breadcrumb___9YQZc:last-child {
  color: #099cec;
}
/* Arrow background */
.styles__breadcrumb___9YQZc::after {
  content: " ";
  display: block;
  width: 0;
  height: 0;
  border-top: 21px solid transparent;
  border-bottom: 21px solid transparent;
  border-left: 10px solid white;
  position: absolute;
  top: 50%;
  margin-top: -21px;
  left: 100%;
  z-index: 3;
}
/* Arrow border */
.styles__breadcrumb___9YQZc::before {
  content: " ";
  display: block;
  width: 0;
  height: 0;
  border-top: 21px solid transparent;
  border-bottom: 21px solid transparent;
  border-left: 10px solid rgba(187, 187, 187, .3);
  position: absolute;
  top: 50%;
  margin-top: -21px;
  margin-left: 1px;
  left: 100%;
  z-index: 3;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___3hU_B {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___3hU_B {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__repoUsage___1GVBC {
  font-size: 14px;
  line-height: 20px;
  color: #27343b;
  padding-bottom: 20px;
}
.styles__repoUsage___1GVBC a {
    color: #1aaaf8;
  }
.styles__warn___3UyH6 {
  color: #bf3b42;
}
.styles__warn___3UyH6 a {
    color: inherit;
  }

.styles__contextNav___3mWj8 {
  height: 42px;
  background: white;
  border-bottom: 1px solid #e0e4e7;
}

.styles__breadcrumbs___sHnKr {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___310Wd {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___310Wd {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__modalClass___30qQ1 {
  -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .26);
          box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .26);
  padding: 32px
}
.styles__modalClass___30qQ1:focus {
  outline-width: 0;
}

.styles__wrapper___3ncPM {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 180px;
  height: 180px;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes circle__fadein___2Db8K {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes circle__fadein___2Db8K {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.circle__circle___36Myc {
  -webkit-transform: rotate(-90deg);
          transform: rotate(-90deg);
  -webkit-transform-origin: 50%;
          transform-origin: 50%;
  fill: none;
  stroke-width: 8;
  stroke-dashoffset: 0;
  stroke-linecap: round;
  stroke-miterlimit: 10;
  -webkit-transition: 0.3s all linear 0ms;
  transition: 0.3s all linear 0ms;
}
.circle__label___37DQi {
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
  letter-spacing: normal;
  text-transform: uppercase;
  fill: #8f9ea8;
}
.circle__displayValue____8Nt5 {
  font-size: 28px;
  line-height: 40px;
  font-weight: 400;
  letter-spacing: normal;
  fill: #254356;
}

/* stylelint-disable */
 {

  @-webkit-keyframes slider__rcSliderTooltipZoomDownIn___2dglr {
    0% {
      opacity: 0;
      -webkit-transform-origin: 50% 100%;
      transform-origin: 50% 100%;
      -webkit-transform: scale(0, 0);
      transform: scale(0, 0);
    }
    100% {
      -webkit-transform-origin: 50% 100%;
      transform-origin: 50% 100%;
      -webkit-transform: scale(1, 1);
      transform: scale(1, 1);
    }
  }

  @-webkit-keyframes slider__rcSliderTooltipZoomDownOut___3RbHW {
    0% {
      -webkit-transform-origin: 50% 100%;
      transform-origin: 50% 100%;
      -webkit-transform: scale(1, 1);
      transform: scale(1, 1);
    }
    100% {
      opacity: 0;
      -webkit-transform-origin: 50% 100%;
      transform-origin: 50% 100%;
      -webkit-transform: scale(0, 0);
      transform: scale(0, 0);
    }
  }
}
.rc-slider {
    position: relative;
    height: 4px;
    width: 100%;
    border-radius: 6px;
    background-color: #e9e9e9;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }
.rc-slider * {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }
.rc-slider-track {
    position: absolute;
    left: 0;
    height: 4px;
    border-radius: 6px;
    background-color: #abe2fb;
    z-index: 1;
  }
.rc-slider-handle {
    position: absolute;
    margin-left: -7px;
    margin-top: -5px;
    width: 14px;
    height: 14px;
    cursor: pointer;
    border-radius: 50%;
    border: solid 2px #96dbfa;
    background-color: #ffffff;
    z-index: 2;
  }
.rc-slider-handle:hover {
    border-color: #57c5f7;
  }
.rc-slider-handle-active:active {
    border-color: #57c5f7;
    -webkit-box-shadow: 0 0 5px #57c5f7;
            box-shadow: 0 0 5px #57c5f7;
  }
.rc-slider-mark {
    position: absolute;
    top: 10px;
    left: 0;
    width: 100%;
    font-size: 12px;
    z-index: 3;
  }
.rc-slider-mark-text {
    position: absolute;
    display: inline-block;
    vertical-align: middle;
    text-align: center;
    cursor: pointer;
    color: #999999;
  }
.rc-slider-mark-text-active {
    color: #666666;
  }
.rc-slider-step {
    position: absolute;
    width: 100%;
    height: 4px;
    background: transparent;
    z-index: 1;
  }
.rc-slider-dot {
    position: absolute;
    bottom: -2px;
    margin-left: -4px;
    width: 8px;
    height: 8px;
    border: 2px solid #e9e9e9;
    background-color: #ffffff;
    cursor: pointer;
    border-radius: 50%;
    vertical-align: middle;
  }
.rc-slider-dot:first-child {
    margin-left: -4px;
  }
.rc-slider-dot:last-child {
    margin-left: -4px;
  }
.rc-slider-dot-active {
    border-color: #96dbfa;
  }
.rc-slider-disabled {
    background-color: #e9e9e9;
  }
.rc-slider-disabled .rc-slider-track {
    background-color: #cccccc;
  }
.rc-slider-disabled .rc-slider-handle, .rc-slider-disabled .rc-slider-dot {
    border-color: #cccccc;
    background-color: #ffffff;
    cursor: not-allowed;
  }
.rc-slider-disabled .rc-slider-mark-text, .rc-slider-disabled .rc-slider-dot {
    cursor: not-allowed !important;
  }
.rc-slider-vertical {
    width: 4px;
    height: 100%;
  }
.rc-slider-vertical .rc-slider-track {
    bottom: 0;
    width: 4px;
  }
.rc-slider-vertical .rc-slider-handle {
    position: absolute;
    margin-left: -5px;
    margin-bottom: -7px;
  }
.rc-slider-vertical .rc-slider-mark {
    top: 0;
    left: 10px;
    height: 100%;
  }
.rc-slider-vertical .rc-slider-step {
    height: 100%;
    width: 4px;
  }
.rc-slider-vertical .rc-slider-dot {
    left: 2px;
    margin-bottom: -4px;
  }
.rc-slider-vertical .rc-slider-dot:first-child {
    margin-bottom: -4px;
  }
.rc-slider-vertical .rc-slider-dot:last-child {
    margin-bottom: -4px;
  }
.rc-slider-tooltip-zoom-down-enter, .rc-slider-tooltip-zoom-down-appear {
    -webkit-animation-duration: 0.3s;
    animation-duration: 0.3s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    display: block !important;
    -webkit-animation-play-state: paused;
    animation-play-state: paused;
  }
.rc-slider-tooltip-zoom-down-leave {
    -webkit-animation-duration: 0.3s;
    animation-duration: 0.3s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    display: block !important;
    -webkit-animation-play-state: paused;
    animation-play-state: paused;
  }
.rc-slider-tooltip-zoom-down-enter.rc-slider-tooltip-zoom-down-enter-active, .rc-slider-tooltip-zoom-down-appear.rc-slider-tooltip-zoom-down-appear-active {
    -webkit-animation-name: rcSliderTooltipZoomDownIn;
    animation-name: rcSliderTooltipZoomDownIn;
    -webkit-animation-play-state: running;
    animation-play-state: running;
  }
.rc-slider-tooltip-zoom-down-leave.rc-slider-tooltip-zoom-down-leave-active {
    -webkit-animation-name: rcSliderTooltipZoomDownOut;
    animation-name: rcSliderTooltipZoomDownOut;
    -webkit-animation-play-state: running;
    animation-play-state: running;
  }
.rc-slider-tooltip-zoom-down-enter, .rc-slider-tooltip-zoom-down-appear {
    -webkit-transform: scale(0, 0);
    transform: scale(0, 0);
    -webkit-animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
    animation-timing-function: cubic-bezier(0.23, 1, 0.32, 1);
  }
.rc-slider-tooltip-zoom-down-leave {
    -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
  }
@keyframes slider__rcSliderTooltipZoomDownIn___2dglr {
    0% {
      opacity: 0;
      -webkit-transform-origin: 50% 100%;
      transform-origin: 50% 100%;
      -webkit-transform: scale(0, 0);
      transform: scale(0, 0);
    }
    100% {
      -webkit-transform-origin: 50% 100%;
      transform-origin: 50% 100%;
      -webkit-transform: scale(1, 1);
      transform: scale(1, 1);
    }
  }
@keyframes slider__rcSliderTooltipZoomDownOut___3RbHW {
    0% {
      -webkit-transform-origin: 50% 100%;
      transform-origin: 50% 100%;
      -webkit-transform: scale(1, 1);
      transform: scale(1, 1);
    }
    100% {
      opacity: 0;
      -webkit-transform-origin: 50% 100%;
      transform-origin: 50% 100%;
      -webkit-transform: scale(0, 0);
      transform: scale(0, 0);
    }
  }
.rc-slider-tooltip {
    position: absolute;
    left: -9999px;
    top: -9999px;
    z-index: 4;
    visibility: visible;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }
.rc-slider-tooltip * {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  }
.rc-slider-tooltip-hidden {
    display: none;
  }
.rc-slider-tooltip-placement-top {
    padding: 4px 0 8px 0;
  }
.rc-slider-tooltip-inner {
    padding: 6px 2px;
    min-width: 24px;
    height: 24px;
    font-size: 12px;
    line-height: 1;
    color: #ffffff;
    text-align: center;
    text-decoration: none;
    background-color: #6c6c6c;
    border-radius: 6px;
    -webkit-box-shadow: 0 0 4px #d9d9d9;
            box-shadow: 0 0 4px #d9d9d9;
  }
.rc-slider-tooltip-arrow {
    position: absolute;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
  }
.rc-slider-tooltip-placement-top .rc-slider-tooltip-arrow {
    bottom: 4px;
    left: 50%;
    margin-left: -4px;
    border-width: 4px 4px 0;
    border-top-color: #6c6c6c;
  }

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___1LcQ0 {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___1LcQ0 {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.rc-slider {
    height: 7px !important;
    border-radius: 3px;
    background-color: #d4dadf;
  }
.rc-slider-track {
    height: 7px !important;
    background-color: #099cec;
  }
.rc-slider-handle {
    margin-top: -6px;
    width: 20px;
    height: 20px;
    background: #ffffff;
    border-width: 1px;
    border-color: #d4dadf
  }
.rc-slider-handle:hover {
  border-color: #099cec;
  background-color: #f3f9ff;
}
.rc-slider-tooltip-placement-top {
    padding: 0;
  }
.rc-slider-tooltip-inner {
    font-size: 13px;
    line-height: 18px;
    font-weight: 400;
    letter-spacing: normal;
    background: #099cec;
    border-color: #099cec;
    visibility: visible;
    border-radius: 3px;
    padding: 4px 2px;
    min-width: 32px;
    font-weight: 600;
  }
.rc-slider-tooltip-inner span {
    display: inline-block;
  }
.rc-slider-tooltip-arrow {
    border: none;
  }

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___3I4xd {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___3I4xd {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__main___2b7eu {
  font-family: 'Open Sans', sans-serif !important;
  font-size: 14px !important;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___31Jbg {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___31Jbg {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
/*
@francisco 2017/03/20
NOTE: This should be moved to @docker/core or @docker/css
cloud shouldn't set/mutate any global classnames
*/
.Select-control {
    border-radius: 2px;
    border-color: #e0e4e7 !important;
  }
.Select-menu-outer {
    border-bottom-right-radius: 2px;
    border-bottom-left-radius: 2px;
    border: 1px solid #e0e4e7;
    -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .1);
            box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .1);
  }
.Select--multi .Select-value {
    background-color: #e0e4e7;
    border-radius: 2px;
    border: none;
    color: #445d6e;
    display: inline-block;
    font-size: 12px;
    line-height: 1.4;
    margin-left: 5px;
    margin-top: 5px;
    vertical-align: top;
  }
.Select--multi a.Select-value-label {
    color: #445d6e;
    cursor: pointer;
    text-decoration: none;
  }
.Select--multi .Select-value-icon {
    cursor: pointer;
    border-bottom-left-radius: 2px;
    border-top-left-radius: 2px;
    border-right: none;
    padding: 3px 0 1px 5px;
  }
.Select--multi .Select-value-icon:hover, .Select--multi .Select-value-icon:focus {
    background-color: #e0e4e7;
    color: #445d6e;
  }
.Select--multi .Select-value-icon:active {
    background-color: #445d6e;
  }
.Select-option {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    background-color: #ffffff;
    cursor: pointer;
    display: block;
    padding: 8px 10px
  }
.Select-option:last-child {
  border-bottom-right-radius: 2px;
  border-bottom-left-radius: 2px;
}
.Select-option.is-focused {
  background: #f7f7f8;
}
.styles__errorText___1hHbe {
  display: none;
  color: #ef4a53;
  font-size: 12px;
  height: 16px;
  margin-top: 4px
}
.styles__errorText___1hHbe.styles__visible___1iv5a {
  display: block;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___8MEBs {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___8MEBs {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
/* billing */
.styles__billingDates___3HZHv {
  display: inline-block;
  width: 100%;
}
.styles__billingRow___1_kb0 {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}
.styles__billingRow___1_kb0 > * {
  lost-column-cycle: 2;
}
.styles__billingRow___1_kb0 > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(49.95% - 6px);
  max-width: calc(49.95% - 6px);
  width: calc(49.95% - 6px);
}
.styles__billingRow___1_kb0 > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__billingRow___1_kb0 > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__billingRow___1_kb0 > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__billingRow___1_kb0 > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(49.95% - 6px);
  max-width: calc(49.95% - 6px);
  width: calc(49.95% - 6px);
}
.styles__billingRow___1_kb0 > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__billingRow___1_kb0 > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__billingRow___1_kb0 > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__billingRow___1_kb0 {
  min-height: 64px;
}
.styles__billingRowCVVExpiration___1NyFh {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}
.styles__billingRowCVVExpiration___1NyFh > * {
  lost-column-cycle: 2;
}
.styles__billingRowCVVExpiration___1NyFh > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(33.3% - 8px);
  max-width: calc(33.3% - 8px);
  width: calc(33.3% - 8px);
}
.styles__billingRowCVVExpiration___1NyFh > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__billingRowCVVExpiration___1NyFh > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__billingRowCVVExpiration___1NyFh > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__billingRowCVVExpiration___1NyFh > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(66.6% - 4px);
  max-width: calc(66.6% - 4px);
  width: calc(66.6% - 4px);
}
.styles__billingRowCVVExpiration___1NyFh > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__billingRowCVVExpiration___1NyFh > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__billingRowCVVExpiration___1NyFh > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__billingZipCountry___3RoON {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}
.styles__billingZipCountry___3RoON > * {
  lost-column-cycle: 3;
}
.styles__billingZipCountry___3RoON > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(16.65% - 10px);
  max-width: calc(16.65% - 10px);
  width: calc(16.65% - 10px);
}
.styles__billingZipCountry___3RoON > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__billingZipCountry___3RoON > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__billingZipCountry___3RoON > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__billingZipCountry___3RoON > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(49.95% - 6px);
  max-width: calc(49.95% - 6px);
  width: calc(49.95% - 6px);
}
.styles__billingZipCountry___3RoON > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__billingZipCountry___3RoON > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__billingZipCountry___3RoON > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__billingZipCountry___3RoON > *:nth-child(3) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(33.3% - 8px);
  max-width: calc(33.3% - 8px);
  width: calc(33.3% - 8px);
}
.styles__billingZipCountry___3RoON > *:nth-child(3):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__billingZipCountry___3RoON > *:nth-child(3):last-child {
  margin-right: 0;
}
.styles__billingZipCountry___3RoON > *:nth-child(3):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__billingZipCountry___3RoON {
  min-height: 64px;
}
.styles__billingFormContent___1azKJ {
  margin: 0 20px;
}
.styles__billingHeader___1CWsw {
  font-size: 13px;
  line-height: 18px;
  font-weight: 400;
  letter-spacing: normal;
  font-weight: bolder;
  color: #c0c9ce;
  padding-bottom: 16px;
}
.styles__billingOrgHeader___1f92K {
  font-size: 13px;
  line-height: 18px;
  font-weight: 400;
  letter-spacing: normal;
  font-weight: bolder;
  color: #c0c9ce;
  margin-top: -20px;
}
.styles__billingNote___v3FjJ {
  margin: 4px 0 20px;
}
.styles__billingHeaderInner___uCuPZ {
  font-size: 13px;
  line-height: 18px;
  font-weight: 400;
  letter-spacing: normal;
  font-weight: bolder;
  color: #c0c9ce;
  padding: 32px 16px 16px 0;
}
.styles__billingCountry___20XXq {
  margin-top: 4px;
}
.styles__billingExpiration___1ADfy {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}
.styles__billingExpiration___1ADfy > * {
  lost-column-cycle: 2;
}
.styles__billingExpiration___1ADfy > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(49.95% - 6px);
  max-width: calc(49.95% - 6px);
  width: calc(49.95% - 6px);
}
.styles__billingExpiration___1ADfy > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__billingExpiration___1ADfy > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__billingExpiration___1ADfy > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__billingExpiration___1ADfy > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(49.95% - 6px);
  max-width: calc(49.95% - 6px);
  width: calc(49.95% - 6px);
}
.styles__billingExpiration___1ADfy > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__billingExpiration___1ADfy > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__billingExpiration___1ADfy > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__billingExpiration___1ADfy {
  margin-top: 8px;
}
.styles__billingFooter___1Ftxb {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-left: 40px;
}
@-webkit-keyframes styles__progress___2-Xsv {
  from {
    width: 137px;
  }
  to {
    width: 275px;
  }
}
@keyframes styles__progress___2-Xsv {
  from {
    width: 137px;
  }
  to {
    width: 275px;
  }
}
.styles__billingProgressBar___8Fqy8 {
  width: 275px;
  border-bottom: solid 2px #e0e4e7;
}
.styles__billingProgressBar___8Fqy8 > * {
    width: 275px;
    -webkit-animation-name: styles__progress___2-Xsv;
            animation-name: styles__progress___2-Xsv;
    -webkit-animation-duration: 1s;
            animation-duration: 1s;
    -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in;
    position: absolute;
    border-bottom: solid 2px #099cec;
  }
/* end billing */
.styles__card___1g8eC {
  height: 100%;
}
.styles__descriptionText___2j5IG {
  margin-bottom: 16px;
}
.styles__modalBottom___Ac1Bi {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 12px;
  margin-right: 0;
}
.styles__errorMsg___1AM8Y {
  -ms-flex-item-align: center;
      align-self: center;
  color: #ef4a53;
}
.styles__errorMsg___1AM8Y svg {
    margin-bottom: -4px;
    margin-right: 8px;
  }
.styles__buttonRow___2G7O2 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  margin-top: 50px;
}
.styles__copyAccess___2BUBn {
  margin-top: 20px;
}
.styles__removeMarginFromButton___BmMhV button:last-child {
  margin: 6px 0;
}
.styles__alignFirstButtonLeft___1HTfV {
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between
}
.styles__alignFirstButtonLeft___1HTfV button:nth-child(1) {
  margin: 6px 0;
}
.styles__alignFirstButtonLeft___1HTfV button:nth-child(2) {
  margin-left: 50%;
}
.styles__alignFirstButtonLeft___1HTfV button:last-child {
  margin: 6px 0;
}
.styles__editDeleteButton___1vT18:hover {
  background-color: #bf3b42 !important;
  color: #ffffff !important;
}
.styles__planSelectionForm___1EzXl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.styles__icon___1kcpp {
  fill: #8f9ea8;
  margin-right: 8px;
}
.styles__useCreditCard___2vnIh {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-item-align: center;
      align-self: center;
}
.styles__useCreditCard___2vnIh .styles__title___1TnmU {
    margin-bottom: 8px;
  }
.styles__useCreditCard___2vnIh .styles__icon___1kcpp {
    margin-bottom: -3px;
  }
.styles__useCreditCard___2vnIh .styles__creditCard___3RiXL {
    font-size: 14px;
  }
.styles__useCreditCard___2vnIh .styles__expires___1ImiR {
    color: #445d6e;
  }
.styles__error___1cp4c {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 350px;
  color: #ef4a53
}
.styles__error___1cp4c::first-letter {
  text-transform: uppercase;
}
.styles__error___1cp4c > svg {
    margin-right: 8px;
}
.styles__use___2csI4 {
  font-size: 16px;
  line-height: 22px;
  font-weight: 400;
  letter-spacing: normal;
  color: #254356;
}
.styles__expires___1ImiR {
  font-size: 13px;
  line-height: 18px;
  font-weight: 400;
  letter-spacing: normal;
  color: #c0c9ce;
}
.styles__changeBillingInfo___3A-dp {
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
  letter-spacing: normal;
  color: #8f9ea8;
}
.styles__planSelector___1JCBg {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap
}
.styles__planSelector___1JCBg > * {
  lost-column-cycle: 2;
}
.styles__planSelector___1JCBg > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(58.275% - 5px);
  max-width: calc(58.275% - 5px);
  width: calc(58.275% - 5px);
}
.styles__planSelector___1JCBg > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__planSelector___1JCBg > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__planSelector___1JCBg > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__planSelector___1JCBg > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(41.625% - 7px);
  max-width: calc(41.625% - 7px);
  width: calc(41.625% - 7px);
}
.styles__planSelector___1JCBg > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__planSelector___1JCBg > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__planSelector___1JCBg > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__planSelector___1JCBg {
  margin: space-sm;
  height: 386px;
}
.styles__planSelector___1JCBg .styles__planDetails___1RZDh {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    background-color: #f7f7f8;
    padding: 16px;
    text-align: center;
    color: #8f9ea8;
    border-radius: 2px;
    border-color: transparent;
}
.styles__planSelector___1JCBg .styles__planDetails___1RZDh > p {
      margin: 0 0 12px 0;
    }
.styles__planSelector___1JCBg .styles__priceText___2_2zV {
    font-size: 16px;
    line-height: 22px;
    font-weight: 400;
    letter-spacing: normal;
    color: #099cec;
    margin-bottom: 20px;
}
.styles__planSelector___1JCBg .styles__price___2gdMI {
    font-size: 38px;
    line-height: 44px;
    font-weight: 700;
    color: #099cec;
}
.styles__planSelector___1JCBg .styles__checkboxes___1IcVZ {
    height: 80px;
}
.styles__planSelector___1JCBg .styles__planSlider___1Myk5 {
    width: 90%;
}
.styles__planSelector___1JCBg .styles__nautilusCancellation___16ZTy {
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
    letter-spacing: normal;
    color: #ef4a53;
}
.styles__planSelector___1JCBg .styles__nautilusDetails___1fCid {
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
    letter-spacing: normal;
    color: #8f9ea8;
}
.styles__planSelector___1JCBg .styles__nautilusText___ZFz-W {
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    letter-spacing: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 8px;
    color: #8f9ea8;
}
.styles__accessTokenForm___pppBX {
  min-height: 400px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.styles__accessTokenForm___pppBX .styles__secretLabel___3FrKT {
    color: #27343b;
    font-size: 14px;
    margin-left: 20px;
  }
.styles__removeAPIKeyRowSubmitting___3nral {
  opacity: 0.5;
  pointer-events: none;
}
.styles__accessTokenRowParent___1fCC0 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.styles__accessTokenAction___f0Ikr {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  cursor: pointer;
  fill: #8f9ea8;
  margin-right: 12px
}
.styles__accessTokenAction___f0Ikr :hover {
  fill: #2596ec;
}
.styles__editAccessTokenDescriptionHeader___3TEoW {
  font-size: 12px;
  color: #70787d;
  margin-top: 38px;
  margin-bottom: 6px;
}
.styles__editAccessTokenFormHeader___2TvbJ {
  color: #6f777c;
  font-size: 14px;
  line-height: 19px;
  text-transform: uppercase;
}
.styles__editAccessTokenFormHeader___2TvbJ .styles__editAccessTokenInfo___3ZGFN {
    margin-top: 4px;
    color: #27343b;
    text-transform: none;
  }
.styles__editAccessTokenGrid___1QnZG {
  display: grid;
  grid-template-columns: 35% 50%;
  grid-gap: 24px;
  margin: 24px 0;
}
.styles__emailNotificationForm___3Nrym .styles__radioGroup___3HD0Y, .styles__slackNotificationLevelForm___1j22Y .styles__radioGroup___3HD0Y {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0 -20px;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-align: top;
        -ms-flex-align: top;
            align-items: top
  }
.styles__emailNotificationForm___3Nrym .styles__radioGroup___3HD0Y > *, .styles__slackNotificationLevelForm___1j22Y .styles__radioGroup___3HD0Y > * {
  display: block;
  margin: 0 20px;
  white-space: nowrap;
}
.styles__notificationMessage___PpWoL {
  /* @mixin tertiary; */
  margin-top: 24px;
}
.styles__notificationMessage___PpWoL svg {
    fill: #8f9ea8;
    width: 18px;
    margin-bottom: -8px;
    margin-right: 4px;
  }
.styles__slackNotificationLevelForm___1j22Y {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}
.styles__slackNotificationLevelForm___1j22Y > * {
  lost-column-cycle: 2;
}
.styles__slackNotificationLevelForm___1j22Y > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(83.25% - 2px);
  max-width: calc(83.25% - 2px);
  width: calc(83.25% - 2px);
}
.styles__slackNotificationLevelForm___1j22Y > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__slackNotificationLevelForm___1j22Y > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__slackNotificationLevelForm___1j22Y > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__slackNotificationLevelForm___1j22Y > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(16.65% - 10px);
  max-width: calc(16.65% - 10px);
  width: calc(16.65% - 10px);
}
.styles__slackNotificationLevelForm___1j22Y > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__slackNotificationLevelForm___1j22Y > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__slackNotificationLevelForm___1j22Y > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__slackNotificationLevelForm___1j22Y {
  margin-top: 20px;
}
.styles__emailNotificationForm___3Nrym .styles__address___2p8NQ {
  margin-bottom: 16px;
}
.styles__slackNotificationForm___9GdOA.styles__slackNotificationFormDeleting___qkV74 {
  opacity: 0.5;
  pointer-events: none;
}
.styles__slackNotificationsCreateForm___3pfmj {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 0 -16px;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.styles__slackNotificationsCreateForm___3pfmj .styles__inputContainer___ERTsT {
    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
  }
.styles__slackNotificationsCreateForm___3pfmj > * {
  display: block;
  margin: 0 8px;
  white-space: nowrap;
}
.styles__slackNotificationsCreateForm___3pfmj .styles__deleteIcon___WzRSl {
    cursor: pointer;
    fill: #8f9ea8;
}
.styles__slackNotificationsCreateForm___3pfmj .styles__deleteIcon___WzRSl:hover {
  fill: #ef4a53;
}
.styles__slackNotificationsCreateForm___3pfmj .styles__deleteIcon___WzRSl svg {
      position: relative;
      top: 12px;
}
.styles__slackNotificationsCreateForm___3pfmj .styles__slackCreateBtn___pt1Ed {
    position: relative;
    top: 10px;
}
.styles__successMessage___3qUZM {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 12px;
  color: #00cbca;
}
.styles__successMessage___3qUZM .styles__iconWrapper___e6GuO {
    margin-right: 8px;
  }
.styles__emailError___1DOvf {
  margin-bottom: 20px;
}
.styles__azureCertificateDownloadButton___2PAKU .styles__buttonLabel___1QVyp {
    margin-left: 8px;
  }
.styles__link___a86zt {
  text-decoration: none;
  cursor: pointer;
  color: #2596ec;
}
.styles__link___a86zt a {
    text-decoration: none;
  }
.styles__accessForm___2TGuO {
  min-height: 250px;
}
.styles__newAccessTokenModalBody___2YrIj {
  max-width: 590px;
  margin: 0 auto;
}
.styles__addAccessTokenSubheader___2_5ll {
  margin-bottom: 40px;
}
.styles__resultDescription___1xCTg {
  text-transform: uppercase;
  color: #6f777c;
  margin-top: 30px;
  line-height: 19px;
}
.styles__resultToken___1-m3K {
  margin-top: 6px;
  margin-bottom: 30px;
  word-wrap: break-word;
}
.styles__copyCommand___2NCUP textarea:focus,
  .styles__copyCommand___2NCUP input:focus {
    outline: none;
  }
.styles__resultExample___33FM_ {
  margin: 15px 0;
}
.styles__resultExample___33FM_ .styles__firstCommand___2rGOT {
    margin: 5px 0;
  }
.styles__warningBox___MFWhd {
  margin: 15px 0;
  height: 80px;
  background: #fafafb;
}
.styles__warningBox___MFWhd .styles__yellowBar___1sfrE {
    position: absolute;
    width: 4px;
    height: 80px;
    background: #f7d933;
    margin-right: 10px;
  }
.styles__warningBox___MFWhd .styles__warningMessage___1OWHe {
    padding: 25px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
.styles__warningBox___MFWhd .styles__warningMessage___1OWHe .styles__warningText___1TX44 {
      margin: 20px;
    }
.styles__warningBox___MFWhd .styles__secretLabel___3FrKT {
    color: #27343b;
    font-size: 14px;
    margin-left: 20px;
  }
@media (max-width: 960px) {
  .styles__accessForm___2TGuO {
    max-width: 600px;
  }
}
@media (max-width: 600px) {
  .styles__accessForm___2TGuO {
    max-width: 500px;
    padding: 16px;
  }
  .styles__warningBox___MFWhd {
    height: 100px;
    margin-right: 16px;
  }
    .styles__warningBox___MFWhd .styles__yellowBar___1sfrE {
      height: 100px;
    }
    .styles__warningBox___MFWhd .styles__secretLabel___3FrKT {
      margin-right: 20px;
    }
  .styles__alignFirstButtonLeft___1HTfV {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center
  }
  .styles__alignFirstButtonLeft___1HTfV button:nth-child(2) {
    margin-left: 10px;
  }
}
@media (max-width: 480px) {
  .styles__accessForm___2TGuO {
    max-width: 325px;
    padding: 16px;
  }
  .styles__warningBox___MFWhd {
    margin-right: 16px;
    height: 150px;
  }
    .styles__warningBox___MFWhd .styles__yellowBar___1sfrE {
      height: 150px;
    }
}
.styles__button___2xXN9 button {
    margin: 6px 0 !important;
  }
.styles__selectAction___58ZcV {
  -webkit-box-flex: 0;
      -ms-flex: 0 0 auto;
          flex: 0 0 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 40px;
  font-size: 12px !important;
}
.styles__selectAction___58ZcV .styles__checkboxParent___VTuv9 {
    width: 14px;
    height: 14px;
  }
.styles__selectAction___58ZcV .styles__checkbox___3tIqJ {
    opacity: 0.5;
  }
.styles__selectAction___58ZcV .styles__checkbox___3tIqJ.styles__checked___2mpJL {
    opacity: 1;
  }
.styles__selectAction___58ZcV .styles__checkboxIcon___13grt {
    width: 14px;
    height: 14px;
  }
.styles__asterisk___28jAX {
  color: #e12b0c;
}
.styles__code___3tuDe {
  background-color: #f3f4f4;
  display: inline-block;
  padding: 5px 10px;
  font-family: 'Courier New', Courier, monospace;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___3MJaY {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___3MJaY {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
/* stylelint-disable block-no-empty */
.dbutton {
}
/* stylelint-enable */
.styles__button___349c4 {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
  position: relative;
  outline: 0;
  display: inline-block;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-style: solid;
  white-space: nowrap;
  text-align: center;
  font-weight: 700;
  font-style: inherit;
  -webkit-font-feature-settings: inherit;
          font-feature-settings: inherit;
  font-variant: inherit;
  font-family: inherit;
  text-decoration: none;
  overflow: hidden;
  -webkit-transition: background-color 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), border-color 0.6s cubic-bezier(0.25, 0.8, 0.25, 1);
  transition: background-color 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), border-color 0.6s cubic-bezier(0.25, 0.8, 0.25, 1);

  padding: 0 10px;
  margin: 6px 6px;
  min-width: 88px;
  line-height: 32px;
  min-height: 32px;
  border-width: 2px;
  border-radius: 3px;
  font-size: 14px;
  color: white;
  cursor: pointer
}
.styles__button___349c4::first-letter {
  text-transform: uppercase;
}
.styles__button___349c4:disabled {
  pointer-events: none;
  opacity: 0.4;
}
.styles__button___349c4 .dicon {
  fill: white;
  position: relative;
  top: 4px;
}
.styles__icon___32G-S {
  min-width: auto;
}
.styles__iconLeft___17zOQ .dicon, .styles__iconRight___hvX_a .dicon {
    position: absolute;
  }
.styles__iconLeft___17zOQ::before {
  content: ' ';
  display: block;
  float: left;
  margin-right: 10px;
}
.styles__iconLeft___17zOQ::before {
  width: 24px;
  height: 24px;
}
.styles__iconLeft___17zOQ .dicon {
    left: 10px;
}
.styles__iconRight___hvX_a::after {
  content: ' ';
  display: block;
  float: right;
  margin-left: 10px;
}
.styles__iconRight___hvX_a::after {
  width: 24px;
  height: 24px;
}
.styles__iconRight___hvX_a .dicon {
    right: 10px;
}
.styles__primary___3MhKY {
  /* stylelint-disable function-whitespace-after */
}
.styles__primary___3MhKY:not(.styles__inverted___MX3NH) {
  background-color: #099cec;
  border-color: #099cec;
}
.styles__primary___3MhKY:not(.styles__inverted___MX3NH):hover {
  background-color: #066da5;
  border-color: #066da5;
}
.styles__primary___3MhKY:not(.styles__inverted___MX3NH).styles__text___1kh-4,
    .styles__primary___3MhKY:not(.styles__inverted___MX3NH).styles__outlined___XFGp7 {
  color: #099cec;
}
.styles__primary___3MhKY:not(.styles__inverted___MX3NH).styles__text___1kh-4:hover, .styles__primary___3MhKY:not(.styles__inverted___MX3NH).styles__outlined___XFGp7:hover {
  color: #066da5;
}
.styles__primary___3MhKY:not(.styles__inverted___MX3NH).styles__outlined___XFGp7.styles__iconRight___hvX_a .dicon,
    .styles__primary___3MhKY:not(.styles__inverted___MX3NH).styles__outlined___XFGp7.styles__iconLeft___17zOQ .dicon,
    .styles__primary___3MhKY:not(.styles__inverted___MX3NH).styles__icon___32G-S .dicon {
  fill: #099cec;
}
.styles__primary___3MhKY:not(.styles__inverted___MX3NH).styles__outlined___XFGp7.styles__iconRight___hvX_a:hover .dicon,
    .styles__primary___3MhKY:not(.styles__inverted___MX3NH).styles__outlined___XFGp7.styles__iconLeft___17zOQ:hover .dicon,
    .styles__primary___3MhKY:not(.styles__inverted___MX3NH).styles__icon___32G-S:hover .dicon {
  fill: #066da5;
}
.styles__primary___3MhKY {/* stylelint-enable */
}
.styles__secondary___2l8lN {
  /* stylelint-disable function-whitespace-after */
}
.styles__secondary___2l8lN:not(.styles__inverted___MX3NH) {
  background-color: #70c9a0;
  border-color: #70c9a0;
}
.styles__secondary___2l8lN:not(.styles__inverted___MX3NH):hover {
  background-color: #00a2a1;
  border-color: #00a2a1;
}
.styles__secondary___2l8lN:not(.styles__inverted___MX3NH).styles__text___1kh-4,
    .styles__secondary___2l8lN:not(.styles__inverted___MX3NH).styles__outlined___XFGp7 {
  color: #70c9a0;
}
.styles__secondary___2l8lN:not(.styles__inverted___MX3NH).styles__text___1kh-4:hover, .styles__secondary___2l8lN:not(.styles__inverted___MX3NH).styles__outlined___XFGp7:hover {
  color: #00a2a1;
}
.styles__secondary___2l8lN:not(.styles__inverted___MX3NH).styles__outlined___XFGp7.styles__iconRight___hvX_a .dicon,
    .styles__secondary___2l8lN:not(.styles__inverted___MX3NH).styles__outlined___XFGp7.styles__iconLeft___17zOQ .dicon,
    .styles__secondary___2l8lN:not(.styles__inverted___MX3NH).styles__icon___32G-S .dicon {
  fill: #70c9a0;
}
.styles__secondary___2l8lN:not(.styles__inverted___MX3NH).styles__outlined___XFGp7.styles__iconRight___hvX_a:hover .dicon,
    .styles__secondary___2l8lN:not(.styles__inverted___MX3NH).styles__outlined___XFGp7.styles__iconLeft___17zOQ:hover .dicon,
    .styles__secondary___2l8lN:not(.styles__inverted___MX3NH).styles__icon___32G-S:hover .dicon {
  fill: #00a2a1;
}
.styles__secondary___2l8lN {/* stylelint-enable */
}
.styles__warn___3tWBu {
  /* stylelint-disable function-whitespace-after */
}
.styles__warn___3tWBu:not(.styles__inverted___MX3NH) {
  background-color: #f7d933;
  border-color: #f7d933;
}
.styles__warn___3tWBu:not(.styles__inverted___MX3NH):hover {
  background-color: #ceaf00;
  border-color: #ceaf00;
}
.styles__warn___3tWBu:not(.styles__inverted___MX3NH).styles__text___1kh-4,
    .styles__warn___3tWBu:not(.styles__inverted___MX3NH).styles__outlined___XFGp7 {
  color: #f7d933;
}
.styles__warn___3tWBu:not(.styles__inverted___MX3NH).styles__text___1kh-4:hover, .styles__warn___3tWBu:not(.styles__inverted___MX3NH).styles__outlined___XFGp7:hover {
  color: #ceaf00;
}
.styles__warn___3tWBu:not(.styles__inverted___MX3NH).styles__outlined___XFGp7.styles__iconRight___hvX_a .dicon,
    .styles__warn___3tWBu:not(.styles__inverted___MX3NH).styles__outlined___XFGp7.styles__iconLeft___17zOQ .dicon,
    .styles__warn___3tWBu:not(.styles__inverted___MX3NH).styles__icon___32G-S .dicon {
  fill: #f7d933;
}
.styles__warn___3tWBu:not(.styles__inverted___MX3NH).styles__outlined___XFGp7.styles__iconRight___hvX_a:hover .dicon,
    .styles__warn___3tWBu:not(.styles__inverted___MX3NH).styles__outlined___XFGp7.styles__iconLeft___17zOQ:hover .dicon,
    .styles__warn___3tWBu:not(.styles__inverted___MX3NH).styles__icon___32G-S:hover .dicon {
  fill: #ceaf00;
}
.styles__warn___3tWBu {/* stylelint-enable */
}
.styles__panic___3QTsj {
  /* stylelint-disable function-whitespace-after */
}
.styles__panic___3QTsj:not(.styles__inverted___MX3NH) {
  background-color: #e12b0c;
  border-color: #e12b0c;
}
.styles__panic___3QTsj:not(.styles__inverted___MX3NH):hover {
  background-color: #bf3b42;
  border-color: #bf3b42;
}
.styles__panic___3QTsj:not(.styles__inverted___MX3NH).styles__text___1kh-4,
    .styles__panic___3QTsj:not(.styles__inverted___MX3NH).styles__outlined___XFGp7 {
  color: #e12b0c;
}
.styles__panic___3QTsj:not(.styles__inverted___MX3NH).styles__text___1kh-4:hover, .styles__panic___3QTsj:not(.styles__inverted___MX3NH).styles__outlined___XFGp7:hover {
  color: #bf3b42;
}
.styles__panic___3QTsj:not(.styles__inverted___MX3NH).styles__outlined___XFGp7.styles__iconRight___hvX_a .dicon,
    .styles__panic___3QTsj:not(.styles__inverted___MX3NH).styles__outlined___XFGp7.styles__iconLeft___17zOQ .dicon,
    .styles__panic___3QTsj:not(.styles__inverted___MX3NH).styles__icon___32G-S .dicon {
  fill: #e12b0c;
}
.styles__panic___3QTsj:not(.styles__inverted___MX3NH).styles__outlined___XFGp7.styles__iconRight___hvX_a:hover .dicon,
    .styles__panic___3QTsj:not(.styles__inverted___MX3NH).styles__outlined___XFGp7.styles__iconLeft___17zOQ:hover .dicon,
    .styles__panic___3QTsj:not(.styles__inverted___MX3NH).styles__icon___32G-S:hover .dicon {
  fill: #bf3b42;
}
.styles__panic___3QTsj {/* stylelint-enable */
}
.styles__dull___5FU0B {
  /* stylelint-disable function-whitespace-after */
}
.styles__dull___5FU0B:not(.styles__inverted___MX3NH) {
  background-color: #8f9ea8;
  border-color: #8f9ea8;
}
.styles__dull___5FU0B:not(.styles__inverted___MX3NH):hover {
  background-color: #445d6e;
  border-color: #445d6e;
}
.styles__dull___5FU0B:not(.styles__inverted___MX3NH).styles__text___1kh-4,
    .styles__dull___5FU0B:not(.styles__inverted___MX3NH).styles__outlined___XFGp7 {
  color: #8f9ea8;
}
.styles__dull___5FU0B:not(.styles__inverted___MX3NH).styles__text___1kh-4:hover, .styles__dull___5FU0B:not(.styles__inverted___MX3NH).styles__outlined___XFGp7:hover {
  color: #445d6e;
}
.styles__dull___5FU0B:not(.styles__inverted___MX3NH).styles__outlined___XFGp7.styles__iconRight___hvX_a .dicon,
    .styles__dull___5FU0B:not(.styles__inverted___MX3NH).styles__outlined___XFGp7.styles__iconLeft___17zOQ .dicon,
    .styles__dull___5FU0B:not(.styles__inverted___MX3NH).styles__icon___32G-S .dicon {
  fill: #8f9ea8;
}
.styles__dull___5FU0B:not(.styles__inverted___MX3NH).styles__outlined___XFGp7.styles__iconRight___hvX_a:hover .dicon,
    .styles__dull___5FU0B:not(.styles__inverted___MX3NH).styles__outlined___XFGp7.styles__iconLeft___17zOQ:hover .dicon,
    .styles__dull___5FU0B:not(.styles__inverted___MX3NH).styles__icon___32G-S:hover .dicon {
  fill: #445d6e;
}
.styles__dull___5FU0B {/* stylelint-enable */
}
.styles__icon___32G-S,
  .styles__icon___32G-S:hover,
  .styles__text___1kh-4,
  .styles__text___1kh-4:hover,
  .styles__outlined___XFGp7,
  .styles__outlined___XFGp7:hover {
  background: none !important;
}
.styles__text___1kh-4,
  .styles__text___1kh-4:hover,
  .styles__icon___32G-S,
  .styles__icon___32G-S:hover {
  border: none !important;
}
.styles__inverted___MX3NH {
  border-color: white;
  background-color: white;
  color: #099cec
}
.styles__inverted___MX3NH:hover {
  background-color: rgba(255, 255, 255, .85);
  border-color: rgba(255, 255, 255, .85);
}
.styles__inverted___MX3NH.styles__outlined___XFGp7 .dicon, .styles__inverted___MX3NH.styles__text___1kh-4 .dicon {
  fill: white;
}
.styles__inverted___MX3NH.styles__outlined___XFGp7,
  .styles__inverted___MX3NH.styles__text___1kh-4 {
  color: white;
}
.styles__inverted___MX3NH.styles__text___1kh-4:hover {
  color: rgba(255, 255, 255, .85);
}
.styles__inverted___MX3NH.styles__outlined___XFGp7:hover {
  color: #099cec;
}
.styles__fullWidth___1IydQ {
  width: 100%;
}
.styles__skinny___3loaZ {
  /* Adjust for the skinnier border by adding more padding inside so the size is the same */
  padding: 1px 11px;
  border-width: 1px;
  font-weight: 600;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___1NI3B {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___1NI3B {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__skip___2fwil {
  height: 32px;
  position: relative;
}
.styles__skip___2fwil span {
    line-height: 24px;
    position: absolute;
    right: 8px;
    top: 8px;
    text-decoration: underline;
    cursor: pointer;
  }
.styles__wrapper___1UqO4 {
  width: 65%;
  height: 540px;
  margin-left: 15%;
}
.styles__wrapper___1UqO4 .styles__title___rLRWx {
    font-size: 18px;
    line-height: 28px;
    font-weight: 500;
    letter-spacing: 0.005em;
    font-weight: 600;

    margin-bottom: 32px;
  }
.styles__wrapper___1UqO4 .styles__checkbox___kUOKL {
    margin-bottom: 16px;
    font-weight: 500;
  }
.styles__wrapper___1UqO4 .styles__comment___3th6g {
    margin-top: 32px;
    margin-bottom: 20px;
  }
.styles__wrapper___1UqO4 .styles__comment___3th6g .styles__textarea___1qxl6 {
      background: #f7f8f9;
      border: solid 1px #e0e4e7;
      width: 100% !important;
      min-height: 100px;
      margin-top: 8px;
      padding: 8px;
      border-radius: 2px;
    }
.styles__wrapper___1UqO4 .styles__submit___158_d {
    text-align: center;
  }
.styles__submittedWrapper___1YSW8 {
  text-align: center;
  height: 540px;
}
.styles__submittedWrapper___1YSW8 .styles__title___rLRWx {
    padding-top: 160px;
    margin-bottom: 20px;
    font-weight: bold;
    font-style: italic;
    font-size: 64px;
    line-height: 90px;
  }
.styles__submittedWrapper___1YSW8 .styles__subtitle___1bJBN {
    color: #b7bbbe;
    height: 240px;
  }

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___12Ry1 {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___12Ry1 {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
/* module account */
.styles__wrapper___1NKRy {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-top: 24px;
  overflow: hidden;
  background: #f7f8f9;
}
.styles__wrapper___1NKRy .styles__card___U4-oB {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column nowrap;
            flex-flow: column nowrap;
  }
.styles__wrapper___1NKRy .styles__card___U4-oB h3 {
      margin-bottom: 36px;
    }
.styles__wrapper___1NKRy .styles__card___U4-oB .styles__errorHeader___HMNBU {
      margin: 20px 0;
      font-size: 14px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: start;
          -ms-flex-pack: start;
              justify-content: flex-start;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      margin-bottom: 10px;
    }
.styles__wrapper___1NKRy .styles__card___U4-oB .styles__errorHeader___HMNBU .styles__text___32owj {
        margin-left: 20px;
      }
.styles__wrapper___1NKRy .styles__card___U4-oB > input {
    margin-bottom: 10px;
  }
.styles__accessTokenRetrievalError___e9vfO {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.styles__accessTokenRetrievalError___e9vfO > :first-child {
    margin-right: 12px;
  }
.styles__settingsInfoSection___2MD3x {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  max-width: 1000px;
}
.styles__settingsInfoCard___3xLza {
  margin-bottom: 32px;
  background-color: #ffffff;
}
.styles__header___3YvnA {
  background-color: #ffffff;
}
.styles__title___PuG2H {
  font-size: 16px;
  font-weight: 600;
  margin: 0 0 24px;
  line-height: 16px;
}
.styles__boldItalic___s_ftG {
  font-weight: 600;
  font-style: italic;
}
.styles__buttonWrapper___21Euj {
  text-align: right;
}
.styles__promoCode___1fCGB {
  text-align: center;
  width: 100%;
}
.styles__promoCodeInfoCard___2-Tr2 {
  background-color: #d1eefd;
  border-color: #a3ddfc;
  color: color-curious-blue;
  margin-bottom: 20px;
}
.styles__loadingCard___2DGgI {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  min-height: 200px;
}
.styles__largeLoadingCard___1kFRx {
  min-height: 400px;
}
.styles__promoCodeWrapper___seUUj {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  min-height: 52px;
  top: -1px;
}
/* account nav and cards */
.styles__accountLeftNav___2CsZB {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.styles__accountCardsContainer___39c3X {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  width: 1050px;
  margin-bottom: 20px;
}
.styles__accountCardsContainer___39c3X .styles__card___U4-oB {
    margin-bottom: 20px;
  }
.styles__changePasswordAndEmails___3dpLP .styles__emails___2oY6n,
  .styles__changePasswordAndEmails___3dpLP .styles__password___3W6s_ {
    margin-top: 40px;
    margin-bottom: 48px;
  }
.styles__changePasswordAndEmails___3dpLP .styles__accountInfo___3v3Ne {
    margin-top: 40px;
  }
.styles__changePasswordAndEmails___3dpLP .styles__header___3YvnA {
    font-size: 13px;
    line-height: 18px;
    font-weight: 400;
    letter-spacing: normal;
    font-weight: bolder;
    color: #c0c9ce;
    margin-bottom: 20px;
  }
.styles__changePasswordAndEmails___3dpLP .styles__inputField___1J6Pb {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-flow: row wrap;
            flex-flow: row wrap;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    margin-top: 24px;
  }
.styles__changePasswordAndEmails___3dpLP .styles__setAsPrimaryBtn___22k73 {
    color: #c0c9ce;
    background-color: #fbfbfc;
    border-color: #fbfbfc;
  }
.styles__changePasswordAndEmails___3dpLP .styles__primaryEmail___3P06S {
    margin: 4px;
    padding: 0 4px;
    min-width: 88px;
    height: 36px;
    display: inline-block;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    white-space: nowrap;
    text-decoration: none;
    font-weight: 700;
    font-size: 14px;
    line-height: 32px;
    color: #fbfbfc;
    background-color: #c0c9ce;
    border: 2px solid #c0c9ce;
    border-radius: 3px;
  }
.styles__changePasswordAndEmails___3dpLP .styles__checkedIcon___2YGYW {
    margin: 8px 4px 4px 4px;
    padding: 0 4px;
  }
.styles__changePasswordAndEmails___3dpLP .styles__checkedIcon___2YGYW svg {
      position: relative;
      top: 4px;
    }
.styles__changePasswordAndEmails___3dpLP .styles__button___3R8C5 {
    margin: 4px;
    padding: 0 4px;
  }
.styles__changePasswordAndEmails___3dpLP .styles__passError___2svnQ {
    margin-top: 24px;
  }
.styles__saveBtn___1hZj5 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 20px;
}
.styles__justifyCenter___yTeCL {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
.styles__recoveryCode___3yQen {
  margin-right: 40px;
}
.styles__recoveryCode___3yQen .styles__recoveryCodeBtn___K7N-5 {
    width: 190px;
    height: 33px;
    margin: 25px 0;
    border-radius: 4px;
    text-align: center;
  }
.styles__disableBtn___2vr2q {
  color: #e12b0c;
  width: 180px;
  height: 33px;
  border: 1px solid #e12b0c;
  border-radius: 4px;
  font-weight: 800;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: 25px 0
}
.styles__disableBtn___2vr2q:hover {
  border: 1px solid #e12b0c;
}
.styles__saveBtnWithTokens___1eOT0 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.styles__saveBtnWithTokens___1eOT0 button {
    margin: 0;
  }
.styles__saveBtnWithTokens___1eOT0 .styles__twoButtons___36r4q button:nth-child(1) {
  margin-right: 18px;
}
.styles__invertedPanicButton___1MzBr:hover {
  background-color: #871907 !important;
  color: #ffffff !important;
  border-color: #871907 !important;
}
.styles__invertedRegularButton___iJhxE:hover {
  background-color: #2596ec !important;
  color: #ffffff !important;
  border-color: #2596ec !important;
}
.styles__apiCodeBlock___2uBVH {
  word-wrap: break-word;
}
/* cloud providers card */
.styles__cloudProviderRow___kDSuU {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap
}
.styles__cloudProviderRow___kDSuU > * {
  lost-column-cycle: 6;
}
.styles__cloudProviderRow___kDSuU > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(20.8125% - 9.5px);
  max-width: calc(20.8125% - 9.5px);
  width: calc(20.8125% - 9.5px);
}
.styles__cloudProviderRow___kDSuU > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__cloudProviderRow___kDSuU > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__cloudProviderRow___kDSuU > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__cloudProviderRow___kDSuU > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(41.625% - 7px);
  max-width: calc(41.625% - 7px);
  width: calc(41.625% - 7px);
}
.styles__cloudProviderRow___kDSuU > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__cloudProviderRow___kDSuU > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__cloudProviderRow___kDSuU > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__cloudProviderRow___kDSuU > *:nth-child(3) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(8.325% - 11px);
  max-width: calc(8.325% - 11px);
  width: calc(8.325% - 11px);
}
.styles__cloudProviderRow___kDSuU > *:nth-child(3):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__cloudProviderRow___kDSuU > *:nth-child(3):last-child {
  margin-right: 0;
}
.styles__cloudProviderRow___kDSuU > *:nth-child(3):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__cloudProviderRow___kDSuU > *:nth-child(4) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(8.325% - 11px);
  max-width: calc(8.325% - 11px);
  width: calc(8.325% - 11px);
}
.styles__cloudProviderRow___kDSuU > *:nth-child(4):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__cloudProviderRow___kDSuU > *:nth-child(4):last-child {
  margin-right: 0;
}
.styles__cloudProviderRow___kDSuU > *:nth-child(4):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__cloudProviderRow___kDSuU > *:nth-child(5) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(14.985% - 10.2px);
  max-width: calc(14.985% - 10.2px);
  width: calc(14.985% - 10.2px);
}
.styles__cloudProviderRow___kDSuU > *:nth-child(5):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__cloudProviderRow___kDSuU > *:nth-child(5):last-child {
  margin-right: 0;
}
.styles__cloudProviderRow___kDSuU > *:nth-child(5):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__cloudProviderRow___kDSuU > *:nth-child(6) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(14.1525% - 10.3px);
  max-width: calc(14.1525% - 10.3px);
  width: calc(14.1525% - 10.3px);
}
.styles__cloudProviderRow___kDSuU > *:nth-child(6):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__cloudProviderRow___kDSuU > *:nth-child(6):last-child {
  margin-right: 0;
}
.styles__cloudProviderRow___kDSuU > *:nth-child(6):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__cloudProviderRow___kDSuU {
  border-top: 1px solid #e0e4e7;
  border-bottom: 1px solid #e0e4e7;
  margin-top: -1px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.styles__cloudProviderRow___kDSuU .styles__noMargin___1o_Np {
    margin: 0;
}
/* Fix overflow issue in safari */
.styles__cloudProviderRow___kDSuU > * {
    -ms-flex-negative: 1 !important;
        flex-shrink: 1 !important;
}
.styles__providerKey___2Glcj {
  word-wrap: break-word;
}
.styles__linkedProviderName___12SuI {
  font-weight: 700;
  color: #254356;
}
.styles__providerName___1urWB {
  font-weight: 700;
  color: #c0c9ce;
}
.styles__addCredentials___3bauZ {
  color: #c0c9ce;
}
/* source providers card */
.styles__sourceProviderRow___bUdWd,
.styles__sourceProviderHeader___1AW4k {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap
}
.styles__sourceProviderRow___bUdWd > *, .styles__sourceProviderHeader___1AW4k > * {
  lost-column-cycle: 5;
}
.styles__sourceProviderRow___bUdWd > *:nth-child(1), .styles__sourceProviderHeader___1AW4k > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(33.3% - 8px);
  max-width: calc(33.3% - 8px);
  width: calc(33.3% - 8px);
}
.styles__sourceProviderRow___bUdWd > *:nth-child(1):nth-child(1n), .styles__sourceProviderHeader___1AW4k > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__sourceProviderRow___bUdWd > *:nth-child(1):last-child, .styles__sourceProviderHeader___1AW4k > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__sourceProviderRow___bUdWd > *:nth-child(1):nth-child(12n), .styles__sourceProviderHeader___1AW4k > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__sourceProviderRow___bUdWd > *:nth-child(2), .styles__sourceProviderHeader___1AW4k > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(24.975% - 9px);
  max-width: calc(24.975% - 9px);
  width: calc(24.975% - 9px);
}
.styles__sourceProviderRow___bUdWd > *:nth-child(2):nth-child(1n), .styles__sourceProviderHeader___1AW4k > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__sourceProviderRow___bUdWd > *:nth-child(2):last-child, .styles__sourceProviderHeader___1AW4k > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__sourceProviderRow___bUdWd > *:nth-child(2):nth-child(12n), .styles__sourceProviderHeader___1AW4k > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__sourceProviderRow___bUdWd > *:nth-child(3), .styles__sourceProviderHeader___1AW4k > *:nth-child(3) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(8.325% - 11px);
  max-width: calc(8.325% - 11px);
  width: calc(8.325% - 11px);
}
.styles__sourceProviderRow___bUdWd > *:nth-child(3):nth-child(1n), .styles__sourceProviderHeader___1AW4k > *:nth-child(3):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__sourceProviderRow___bUdWd > *:nth-child(3):last-child, .styles__sourceProviderHeader___1AW4k > *:nth-child(3):last-child {
  margin-right: 0;
}
.styles__sourceProviderRow___bUdWd > *:nth-child(3):nth-child(12n), .styles__sourceProviderHeader___1AW4k > *:nth-child(3):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__sourceProviderRow___bUdWd > *:nth-child(4), .styles__sourceProviderHeader___1AW4k > *:nth-child(4) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(8.325% - 11px);
  max-width: calc(8.325% - 11px);
  width: calc(8.325% - 11px);
}
.styles__sourceProviderRow___bUdWd > *:nth-child(4):nth-child(1n), .styles__sourceProviderHeader___1AW4k > *:nth-child(4):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__sourceProviderRow___bUdWd > *:nth-child(4):last-child, .styles__sourceProviderHeader___1AW4k > *:nth-child(4):last-child {
  margin-right: 0;
}
.styles__sourceProviderRow___bUdWd > *:nth-child(4):nth-child(12n), .styles__sourceProviderHeader___1AW4k > *:nth-child(4):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__sourceProviderRow___bUdWd > *:nth-child(5), .styles__sourceProviderHeader___1AW4k > *:nth-child(5) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: -12px;
  max-width: -12px;
  width: -12px;
}
.styles__sourceProviderRow___bUdWd > *:nth-child(5):nth-child(1n), .styles__sourceProviderHeader___1AW4k > *:nth-child(5):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__sourceProviderRow___bUdWd > *:nth-child(5):last-child, .styles__sourceProviderHeader___1AW4k > *:nth-child(5):last-child {
  margin-right: 0;
}
.styles__sourceProviderRow___bUdWd > *:nth-child(5):nth-child(12n), .styles__sourceProviderHeader___1AW4k > *:nth-child(5):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__sourceProviderRow___bUdWd,
.styles__sourceProviderHeader___1AW4k {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.styles__sourceProviderRow___bUdWd .styles__noMargin___1o_Np, .styles__sourceProviderHeader___1AW4k .styles__noMargin___1o_Np {
    margin: 0;
}
.styles__info___QTxDY {
  margin-bottom: 20px;
  background-color: #f7f7f8;
  padding: 16px;
  border-radius: 3px;
}
.styles__sourceProviderMessage___28_6j {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  margin-top: -12px;
}
.styles__sourceProviderMessage___28_6j svg {
    fill: #8f9ea8;
    width: 18px;
    margin-bottom: -12px;
    margin-right: 12px;
  }
.styles__sourceProviderMessage___28_6j p {
    /* @mixin tertiary; */
  }
.styles__sourceProviderHeader___1AW4k {
  font-size: 13px;
  line-height: 18px;
  letter-spacing: normal;
  font-weight: bolder;
  color: #c0c9ce;
  margin-top: 12px;
}
/* access tokens */
.styles__accessTokensView___2t7Ka {
  lost-container: column
}
.styles__accessTokensView___2t7Ka > *:nth-child(1) {
  width: 100%;
  height: calc(33.3% - 8px);
  margin-bottom: 12px;
}
.styles__accessTokensView___2t7Ka > *:nth-child(1):last-child {
  margin-bottom: 0;
}
.styles__accessTokensView___2t7Ka > *:nth-child(2) {
  width: 100%;
  height: calc(33.3% - 8px);
  margin-bottom: 12px;
}
.styles__accessTokensView___2t7Ka > *:nth-child(2):last-child {
  margin-bottom: 0;
}
.styles__accessTokensView___2t7Ka > *:nth-child(3) {
  width: 100%;
  height: calc(33.3% - 8px);
  margin-bottom: 12px;
}
.styles__accessTokensView___2t7Ka > *:nth-child(3):last-child {
  margin-bottom: 0;
}
.styles__accessTokensView___2t7Ka .styles__expandible___3Sa58 {
    overflow: hidden;
    -webkit-transition: max-height 0.5s ease-in-out;
    transition: max-height 0.5s ease-in-out;
}
.styles__accessTokensView___2t7Ka .styles__collapsed___ruDzZ {
    max-height: 392px !important;
}
.styles__accessTokensView___2t7Ka .styles__expanded___2vlwG {
    max-height: 1960px !important;
}
.styles__showMoreOrLess___2fM0e {
  text-align: center;
}
.styles__showMoreOrLess___2fM0e .styles__link___3cdFL {
    text-decoration: none;
    cursor: pointer;
  }
.styles__showMoreOrLess___2fM0e .styles__link___3cdFL span,
    .styles__showMoreOrLess___2fM0e .styles__link___3cdFL svg {
      vertical-align: middle;
    }
.styles__showMoreOrLess___2fM0e .styles__icon___31E_r {
    -webkit-transition: rotate 0.5s ease-in-out;
    transition: rotate 0.5s ease-in-out;
  }
.styles__showMoreOrLess___2fM0e .styles__rotateIcon___XYwmQ {
    -webkit-transform: rotate(180deg);
            transform: rotate(180deg);
  }
/* notifications email, slack and announcements */
.styles__notifications___1WBfi .styles__emailRadiogroup___2-kTl {
    display: -webkit-inline-box !important;
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
    -webkit-box-align: center !important;
        -ms-flex-align: center !important;
            align-items: center !important;
  }
.styles__notifications___1WBfi .styles__slackNotifications___3SAst {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-flow: row nowrap;
            flex-flow: row nowrap;
  }
/* billing card */
.styles__billing___vjTiK {
  margin-left: 16px;
}
/* plans */
.styles__planDetails___3W3-j {
  height: 180px;
}
.styles__planDetails___3W3-j .styles__planContent___1AlZ- {
    margin: 0 80px;
  }
.styles__planDetails___3W3-j .styles__icon___31E_r {
    fill: #8f9ea8;
    margin-right: 8px;
  }
.styles__planDetails___3W3-j .styles__nodeCost___2Zz98,
  .styles__planDetails___3W3-j .styles__privateReposAvailable___3Jo09 {
    font-size: 14px;
    line-height: 20px;
    color: #27343b;
    margin-bottom: 4px;
  }
.styles__planDetails___3W3-j .styles__privateReposUsed___w3w_y {
    font-size: 14px;
    line-height: 20px;
    color: #27343b;
    color: #00cbca;
    margin-bottom: 4px;
  }
.styles__planDetails___3W3-j .styles__bigNumber___367vs {
    font-size: 28px;
    line-height: 40px;
    font-weight: 400;
    letter-spacing: normal;
    color: #254356;
    margin-right: 12px;
  }
.styles__planDetails___3W3-j .styles__priceText___2Fj1G {
    font-size: 16px;
    line-height: 22px;
    font-weight: 400;
    letter-spacing: normal;
    color: #254356;
    margin-bottom: 4px;
  }
.styles__planDetails___3W3-j .styles__priceText___2Fj1G .styles__bigNumber___367vs {
      margin-right: 8px;
      margin-left: 8px;
    }
.styles__planDetails___3W3-j .styles__usageDescription___BKgbr {
    font-size: 14px;
    line-height: 20px;
    color: #27343b;
    text-transform: uppercase;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
.styles__planDetails___3W3-j .styles__usageText___2e39k {
    -ms-flex-item-align: center;
        align-self: center;
  }
.styles__planDetails___3W3-j .styles__splitPanels___1wU64 {
    display: flex;
    flex-flow: row wrap;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
  }
.styles__planDetails___3W3-j .styles__splitPanels___1wU64 > * {
  lost-column-cycle: 2;
}
.styles__planDetails___3W3-j .styles__splitPanels___1wU64 > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(58.275% - 5px);
  max-width: calc(58.275% - 5px);
  width: calc(58.275% - 5px);
}
.styles__planDetails___3W3-j .styles__splitPanels___1wU64 > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__planDetails___3W3-j .styles__splitPanels___1wU64 > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__planDetails___3W3-j .styles__splitPanels___1wU64 > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__planDetails___3W3-j .styles__splitPanels___1wU64 > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(41.625% - 7px);
  max-width: calc(41.625% - 7px);
  width: calc(41.625% - 7px);
}
.styles__planDetails___3W3-j .styles__splitPanels___1wU64 > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__planDetails___3W3-j .styles__splitPanels___1wU64 > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__planDetails___3W3-j .styles__splitPanels___1wU64 > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__planDetails___3W3-j .styles__splitPanels___1wU64 {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.styles__planDetails___3W3-j .styles__monitoredWithNautilus___1OQGN {
    font-size: 13px;
    line-height: 18px;
    font-weight: 400;
    letter-spacing: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    color: #8f9ea8;
  }
.styles__planDetails___3W3-j .styles__nautilusUpsell___1HR38 {
    background-color: #ffffff;
    border: solid 1px #e0e4e7;
    padding: 12px;
    border-radius: 2px;
    margin-top: 32px;
  }
.styles__planDetails___3W3-j .styles__nautilusLink___2S1em {
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
    letter-spacing: normal;
    margin-left: 12px;
  }
.styles__planDetails___3W3-j button {
    margin: 0;
  }
.styles__planDetails___3W3-j .styles__planButton___2dlbK {
    margin-top: 20px;
  }
/* coupon codes */
.styles__couponCodes___4Sy1q {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap
}
.styles__couponCodes___4Sy1q > * {
  lost-column-cycle: 3;
}
.styles__couponCodes___4Sy1q > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(49.95% - 6px);
  max-width: calc(49.95% - 6px);
  width: calc(49.95% - 6px);
}
.styles__couponCodes___4Sy1q > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__couponCodes___4Sy1q > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__couponCodes___4Sy1q > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__couponCodes___4Sy1q > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(8.325% - 11px);
  max-width: calc(8.325% - 11px);
  width: calc(8.325% - 11px);
}
.styles__couponCodes___4Sy1q > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__couponCodes___4Sy1q > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__couponCodes___4Sy1q > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__couponCodes___4Sy1q > *:nth-child(3) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(41.625% - 7px);
  max-width: calc(41.625% - 7px);
  width: calc(41.625% - 7px);
}
.styles__couponCodes___4Sy1q > *:nth-child(3):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__couponCodes___4Sy1q > *:nth-child(3):last-child {
  margin-right: 0;
}
.styles__couponCodes___4Sy1q > *:nth-child(3):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__couponCodes___4Sy1q .styles__button___3R8C5 {
    min-width: 40px;
    margin: 0 0 0 16px;
    padding: 0;
}
.styles__couponCodes___4Sy1q .styles__name___1rtj6 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.styles__couponCodesTitle___liYnv {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.styles__couponCodesTitle___liYnv .styles__infoTooltip___1OjEf {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-left: 16px;
  }
/* quotas */
.styles__quotasContainer___1IpUK .styles__quotas___3n0ni {
    display: flex;
    flex-flow: row wrap;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap
  }
.styles__quotasContainer___1IpUK .styles__quotas___3n0ni > * {
  lost-column-cycle: 2;
}
.styles__quotasContainer___1IpUK .styles__quotas___3n0ni > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(49.95% - 6px);
  max-width: calc(49.95% - 6px);
  width: calc(49.95% - 6px);
}
.styles__quotasContainer___1IpUK .styles__quotas___3n0ni > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__quotasContainer___1IpUK .styles__quotas___3n0ni > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__quotasContainer___1IpUK .styles__quotas___3n0ni > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__quotasContainer___1IpUK .styles__quotas___3n0ni > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(49.95% - 6px);
  max-width: calc(49.95% - 6px);
  width: calc(49.95% - 6px);
}
.styles__quotasContainer___1IpUK .styles__quotas___3n0ni > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__quotasContainer___1IpUK .styles__quotas___3n0ni > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__quotasContainer___1IpUK .styles__quotas___3n0ni > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__quotasContainer___1IpUK .styles__quotas___3n0ni ul {
      list-style: none;
      padding: 0;
}
.styles__quotasContainer___1IpUK .styles__quotas___3n0ni ul::before,
  .styles__quotasContainer___1IpUK .styles__quotas___3n0ni ul::after {
  content: ' ';
  display: table;
}
.styles__quotasContainer___1IpUK .styles__quotas___3n0ni ul::after {
  clear: both;
}
.styles__quotasContainer___1IpUK .styles__quotas___3n0ni ul {
  padding-left: 16px;
}
.styles__quotasContainer___1IpUK .styles__quotas___3n0ni li {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      margin: 0 -4px 12px -4px;
}
.styles__quotasContainer___1IpUK .styles__quotas___3n0ni li .styles__quotaField___2hzgq:first-child {
        -webkit-box-flex: 1;
            -ms-flex-positive: 1;
                flex-grow: 1;
      }
.styles__quotasContainer___1IpUK .styles__quotas___3n0ni li > * {
  margin: 0 4px;
}
/* delete account card */
.styles__deleteAccount___12-so {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-flow: row nowrap;
          flex-flow: row nowrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.styles__deleteAccount___12-so > div > p {
      color: #ef4a53;
    }
.styles__deleteAccount___12-so button {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 200px;
            flex: 0 0 200px;
  }
.styles__accessTokensTable___3kmBf {
  margin-top: 32px;
  min-height: 220px
}
.styles__accessTokensTable___3kmBf > * {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}
.styles__accessTokensTable___3kmBf > * > * {
  lost-column-cycle: 6;
}
.styles__accessTokensTable___3kmBf > * > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(4.1625% - 11.5px);
  max-width: calc(4.1625% - 11.5px);
  width: calc(4.1625% - 11.5px);
}
.styles__accessTokensTable___3kmBf > * > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__accessTokensTable___3kmBf > * > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__accessTokensTable___3kmBf > * > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__accessTokensTable___3kmBf > * > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(41.625% - 7px);
  max-width: calc(41.625% - 7px);
  width: calc(41.625% - 7px);
}
.styles__accessTokensTable___3kmBf > * > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__accessTokensTable___3kmBf > * > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__accessTokensTable___3kmBf > * > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__accessTokensTable___3kmBf > * > *:nth-child(3) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(20.8125% - 9.5px);
  max-width: calc(20.8125% - 9.5px);
  width: calc(20.8125% - 9.5px);
}
.styles__accessTokensTable___3kmBf > * > *:nth-child(3):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__accessTokensTable___3kmBf > * > *:nth-child(3):last-child {
  margin-right: 0;
}
.styles__accessTokensTable___3kmBf > * > *:nth-child(3):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__accessTokensTable___3kmBf > * > *:nth-child(4) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(20.8125% - 9.5px);
  max-width: calc(20.8125% - 9.5px);
  width: calc(20.8125% - 9.5px);
}
.styles__accessTokensTable___3kmBf > * > *:nth-child(4):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__accessTokensTable___3kmBf > * > *:nth-child(4):last-child {
  margin-right: 0;
}
.styles__accessTokensTable___3kmBf > * > *:nth-child(4):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__accessTokensTable___3kmBf > * > *:nth-child(5) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(8.325% - 11px);
  max-width: calc(8.325% - 11px);
  width: calc(8.325% - 11px);
}
.styles__accessTokensTable___3kmBf > * > *:nth-child(5):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__accessTokensTable___3kmBf > * > *:nth-child(5):last-child {
  margin-right: 0;
}
.styles__accessTokensTable___3kmBf > * > *:nth-child(5):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__accessTokensTable___3kmBf > * > *:nth-child(6) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(8.325% - 11px);
  max-width: calc(8.325% - 11px);
  width: calc(8.325% - 11px);
}
.styles__accessTokensTable___3kmBf > * > *:nth-child(6):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__accessTokensTable___3kmBf > * > *:nth-child(6):last-child {
  margin-right: 0;
}
.styles__accessTokensTable___3kmBf > * > *:nth-child(6):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__accessTokensTable___3kmBf > * {
  margin: 12px 0;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.styles__accessTokensTable___3kmBf .styles__accessTokensHeader___4L78l {
    color: #6f777c;
    font-weight: 500;
    margin-bottom: 12px;
    text-transform: uppercase;
}
.styles__accessTokensTable___3kmBf .styles__selectAction___18_J8 {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 40px;
    font-size: 12px !important;
}
.styles__accessTokensTable___3kmBf .styles__selectAction___18_J8 .styles__checkboxParent___tbOwa {
      width: 14px;
      height: 14px;
    }
.styles__accessTokensTable___3kmBf .styles__selectAction___18_J8 .styles__checkbox___1vhuq {
      opacity: 0.5;
    }
.styles__accessTokensTable___3kmBf .styles__selectAction___18_J8 .styles__checkbox___1vhuq.styles__checked___2bxGl {
      opacity: 1;
    }
.styles__accessTokensTable___3kmBf .styles__selectAction___18_J8 .styles__checkboxIcon___1eFm1 {
      width: 14px;
      height: 14px;
    }
/* cloudProviderError */
.styles__errorField___2v1Tx {
  display: none;
  color: #ef4a53
}
.styles__errorField___2v1Tx.styles__visible___1uC04 {
  display: block;
}
.styles__errorField___2v1Tx > * {
  vertical-align: middle;
}
.styles__errorField___2v1Tx .styles__errorText___1UwVF {
    margin-left: 8px;
}
/* convert account to organization */
.styles__convertAccount___pLU6T {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap
}
.styles__convertAccount___pLU6T > * {
  lost-column-cycle: 2;
}
.styles__convertAccount___pLU6T > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(70.7625% - 3.5px);
  max-width: calc(70.7625% - 3.5px);
  width: calc(70.7625% - 3.5px);
}
.styles__convertAccount___pLU6T > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__convertAccount___pLU6T > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__convertAccount___pLU6T > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__convertAccount___pLU6T > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(29.1375% - 8.5px);
  max-width: calc(29.1375% - 8.5px);
  width: calc(29.1375% - 8.5px);
}
.styles__convertAccount___pLU6T > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__convertAccount___pLU6T > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__convertAccount___pLU6T > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__convertAccount___pLU6T {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.styles__convertAccount___pLU6T .styles__title___PuG2H {
    font-size: 18px;
    line-height: 28px;
    font-weight: 500;
    letter-spacing: 0.005em;
}
.styles__convertAccount___pLU6T .styles__semiBold___1QPX1 {
    font-weight: 600;
}
.styles__convertAccount___pLU6T .styles__button___3R8C5 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    height: 48px;
}
.styles__successMessage___2HIVq {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 12px;
  color: #00cbca;
}
.styles__successMessage___2HIVq .styles__iconWrapper___1Dola {
    margin-right: 8px;
  }
.styles__accountSwitcher___3s4BO {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  margin-bottom: 20px;
}
.styles__accountSwitcher___3s4BO span {
    margin-right: 12px;
  }
.styles__linkedCTA___2mp0h {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-weight: bold;
  -webkit-box-align: left;
      -ms-flex-align: left;
          align-items: left;
  color: #2596ec;
  cursor: pointer;
}
.styles__profileHeaderBar___3gMGH {
  height: 100%;
  background: white;
  border-bottom: 1px solid #e0e4e7;
}
.styles__profileHeader___mrpdW {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.styles__contextNav___c6gvH {
  border-bottom: 1px solid #ffffff;
}
.styles__twoFactor___1SpoA {
  text-align: center;
  margin: 0 auto;
  width: 511px;
  margin-top: 20px;
}
.styles__twoFactor___1SpoA .styles__twoFactorDescription___2Me-E {
    line-height: 19px;
  }
.styles__twoFactor___1SpoA .styles__twoFactorDescription___2Me-E .styles__subheader___3RmNV {
      font-weight: 600;
    }
.styles__warning___2AQQE {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  margin: 12px 0;
}
.styles__warning___2AQQE .styles__emphasis___EO1My {
    margin-left: 10px;
    color: #e12b0c;
  }
.styles__twoFactorLoading___3y3Iu {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  min-height: 125px;
}
.styles__link___3cdFL {
  text-decoration: none;
  cursor: pointer;
  color: #2596ec;
}
.styles__link___3cdFL a {
    text-decoration: none;
  }
.styles__disableModal___FiJzR {
  max-width: 460px !important;
  max-height: 490px !important;
}
.styles__cardTitle___1M7Wl {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  font-size: 16px;
  font-weight: 600;
}
.styles__hr___15KLn {
  -ms-flex-item-align: start;
      align-self: flex-start;
  -webkit-box-flex: 99;
      -ms-flex-positive: 99;
          flex-grow: 99;
}
.styles__horizontalLine___135CW {
  height: 1px;
  border: 0;
  border-top: 1px solid #e0e4e7;
  margin: 0 35px;
}
.styles__failureModal___2bxg7 {
  border-top: 8px solid #e12b0c;
}
@media (max-width: 1200px) {
  .styles__convertAccount___pLU6T {
    display: flex;
    flex-flow: row wrap;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
  }
  .styles__convertAccount___pLU6T > * {
    lost-column-cycle: 2;
  }
  .styles__convertAccount___pLU6T > *:nth-child(1) {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: 99.9%;
    max-width: 99.9%;
    width: 99.9%;
  }
  .styles__convertAccount___pLU6T > *:nth-child(1):nth-child(1n) {
    margin-right: 12px;
    margin-left: 0;
  }
  .styles__convertAccount___pLU6T > *:nth-child(1):last-child {
    margin-right: 0;
  }
  .styles__convertAccount___pLU6T > *:nth-child(1):nth-child(12n) {
    margin-right: 0;
    margin-left: auto;
  }
  .styles__convertAccount___pLU6T > *:nth-child(2) {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: 99.9%;
    max-width: 99.9%;
    width: 99.9%;
  }
  .styles__convertAccount___pLU6T > *:nth-child(2):nth-child(1n) {
    margin-right: 12px;
    margin-left: 0;
  }
  .styles__convertAccount___pLU6T > *:nth-child(2):last-child {
    margin-right: 0;
  }
  .styles__convertAccount___pLU6T > *:nth-child(2):nth-child(12n) {
    margin-right: 0;
    margin-left: auto;
  }
  .styles__convertAccount___pLU6T {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
}
@media (min-width: 601px) and (max-width: 960px) {
  .styles__accountCardsContainer___39c3X {
    width: 600px;
  }
    .styles__wrapper___1NKRy .styles__card___U4-oB {
      width: 600px;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-flow: column wrap;
              flex-flow: column wrap;
    }
  .styles__twoFactor___1SpoA {
    max-width: 600px;
  }
    .styles__twoFactor___1SpoA .styles__twoFactorDescription___2Me-E {
      min-height: 57px;
    }
}
@media (max-width: 820px) {
  .styles__accountCardsContainer___39c3X {
    width: 1000px;
    height: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
  }
  .styles__settingsInfoCard___3xLza {
    width: 820px;
    height: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
  }
    .styles__wrapper___1NKRy .styles__card___U4-oB {
      width: 820px;
      height: 100%;
      overflow-x: scroll;
      overflow-y: hidden;
    }
  .styles__twoFactor___1SpoA {
    width: 820px;
    height: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
  }
    .styles__twoFactor___1SpoA .styles__twoFactorDescription___2Me-E {
      min-height: 57px;
    }
}
.styles__marginSpacing___1D38_ {
  margin-top: 40px;
}
.styles__accessTitle___3Rf99 {
  font-size: 18px;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___LavPu {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___LavPu {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
/* stylelint-disable block-no-empty */
.dcard {
}
/* stylelint-enable */
.styles__card___gktOa {
  background: #ffffff;
  border: 1px solid #e0e4e7;
  border-radius: 2px;
  padding: 28px;
}
.styles__title___1sf66 {
  font-size: 18px;
  line-height: 28px;
  font-weight: 500;
  letter-spacing: 0.005em;
  margin: 0;
  margin-bottom: 24px;
}
.styles__shadowCard___3t4U8 {
  background-color: #ffffff;
  padding: 28px;
  -webkit-box-shadow: inset -1px 0 0 0 rgba(224, 227, 231, .6),
  inset 0 -1px 0 0 #e0e4e7, inset 1px 0 0 0 rgba(224, 227, 231, .6);
          box-shadow: inset -1px 0 0 0 rgba(224, 227, 231, .6),
  inset 0 -1px 0 0 #e0e4e7, inset 1px 0 0 0 rgba(224, 227, 231, .6);
}
@media only screen and (max-width: 600px) {
  .styles__shadowCard___3t4U8 {
    padding: 12px;
  }
}
.styles__shadowCardHover___2e0Y4:hover {
  -webkit-box-shadow: 0 2px 6px 0 #e0e4e7,
  inset -1px 0 0 0 rgba(224, 227, 231, .3), inset 0 -1px 0 0 #e0e4e7,
  inset 1px 0 0 0 rgba(224, 227, 231, .2);
          box-shadow: 0 2px 6px 0 #e0e4e7,
  inset -1px 0 0 0 rgba(224, 227, 231, .3), inset 0 -1px 0 0 #e0e4e7,
  inset 1px 0 0 0 rgba(224, 227, 231, .2);
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___2_JtC {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___2_JtC {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.dicon {
  width: 24px;
  height: 24px;
}
/*
lib/constants/sizes
**************/
.styles__supertiny___piMs- {
  width: 8px;
  height: 8px;
}
.styles__tiny___16fk0 {
  width: 12px;
  height: 12px;
}
.styles__small___3FOEa {
  width: 18px;
  height: 18px;
}
.styles__regular___2wAxR {
  width: 24px;
  height: 24px;
}
.styles__large___2556i {
  width: 40px;
  height: 40px;
}
.styles__xlarge___5Q5Wk {
  width: 60px;
  height: 60px;
}
/*
lib/constants/variants
**************/
.styles__primary___2D4qw {
  fill: #099cec;
}
.styles__secondary___11gMY {
  fill: #70c9a0;
}
.styles__warn___3tokU {
  fill: #f7d933;
}
.styles__panic___2ngky {
  fill: #e12b0c;
}
.styles__dull___cV3u9 {
  fill: #8f9ea8;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___q0DN6 {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___q0DN6 {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__icon___-_xEN {
  margin-right: 12px;
}
.styles__content___txUvx {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___jfw3l {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___jfw3l {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__supertinyLoader___3qdxe {
  font-size: 10px;
  position: relative;
  text-indent: -9999em;
  border-top: 1px solid transparent;
  border-right: 1px solid #099cec;
  border-bottom: 1px solid #099cec;
  border-left: 1px solid #099cec;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: styles__load8___3gOcW 1.1s infinite linear;
  animation: styles__load8___3gOcW 1.1s infinite linear;
  border-radius: 50%;
  width: 16px;
  height: 16px;
  margin: 0 auto;
}
.styles__supertinyLoader___3qdxe::after {
  border-radius: 50%;
  width: 16px;
  height: 16px;
}
.styles__tinyLoader___5Y80i {
  font-size: 10px;
  position: relative;
  text-indent: -9999em;
  border-top: 1.5px solid transparent;
  border-right: 1.5px solid #099cec;
  border-bottom: 1.5px solid #099cec;
  border-left: 1.5px solid #099cec;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: styles__load8___3gOcW 1.1s infinite linear;
  animation: styles__load8___3gOcW 1.1s infinite linear;
  border-radius: 50%;
  width: 24px;
  height: 24px;
  margin: 0 auto;
}
.styles__tinyLoader___5Y80i::after {
  border-radius: 50%;
  width: 24px;
  height: 24px;
}
.styles__smallLoader___3xNUE {
  font-size: 10px;
  position: relative;
  text-indent: -9999em;
  border-top: 2.25px solid transparent;
  border-right: 2.25px solid #099cec;
  border-bottom: 2.25px solid #099cec;
  border-left: 2.25px solid #099cec;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: styles__load8___3gOcW 1.1s infinite linear;
  animation: styles__load8___3gOcW 1.1s infinite linear;
  border-radius: 50%;
  width: 36px;
  height: 36px;
  margin: 0 auto;
}
.styles__smallLoader___3xNUE::after {
  border-radius: 50%;
  width: 36px;
  height: 36px;
}
.styles__regularLoader___1CSnD {
  font-size: 10px;
  position: relative;
  text-indent: -9999em;
  border-top: 3px solid transparent;
  border-right: 3px solid #099cec;
  border-bottom: 3px solid #099cec;
  border-left: 3px solid #099cec;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: styles__load8___3gOcW 1.1s infinite linear;
  animation: styles__load8___3gOcW 1.1s infinite linear;
  border-radius: 50%;
  width: 48px;
  height: 48px;
  margin: 0 auto;
}
.styles__regularLoader___1CSnD::after {
  border-radius: 50%;
  width: 48px;
  height: 48px;
}
.styles__largeLoader___2Fnsd {
  font-size: 10px;
  position: relative;
  text-indent: -9999em;
  border-top: 5px solid transparent;
  border-right: 5px solid #099cec;
  border-bottom: 5px solid #099cec;
  border-left: 5px solid #099cec;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: styles__load8___3gOcW 1.1s infinite linear;
  animation: styles__load8___3gOcW 1.1s infinite linear;
  border-radius: 50%;
  width: 80px;
  height: 80px;
  margin: 0 auto;
}
.styles__largeLoader___2Fnsd::after {
  border-radius: 50%;
  width: 80px;
  height: 80px;
}
.styles__xlargeLoader___3f1Am {
  font-size: 10px;
  position: relative;
  text-indent: -9999em;
  border-top: 7.5px solid transparent;
  border-right: 7.5px solid #099cec;
  border-bottom: 7.5px solid #099cec;
  border-left: 7.5px solid #099cec;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-animation: styles__load8___3gOcW 1.1s infinite linear;
  animation: styles__load8___3gOcW 1.1s infinite linear;
  border-radius: 50%;
  width: 120px;
  height: 120px;
  margin: 0 auto;
}
.styles__xlargeLoader___3f1Am::after {
  border-radius: 50%;
  width: 120px;
  height: 120px;
}
@-webkit-keyframes styles__load8___3gOcW {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes styles__load8___3gOcW {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___16qPL {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___16qPL {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__table___Ql4N1 .styles__row___3Cs_i {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
.styles__table___Ql4N1 .styles__row___3Cs_i + .styles__row___3Cs_i {
    margin-top: 32px;
  }
.styles__table___Ql4N1 .styles__head___2leHz {
    font-weight: bold;
    color: #8f9ea8;
    margin: 12px 0;
  }
@media only screen and (min-width: 601px) {
  .styles__head___2leHz,
  .styles__row___3Cs_i {
    display: flex;
    flex-flow: row wrap;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
  }
  .styles__head___2leHz > *, .styles__row___3Cs_i > * {
    lost-column-cycle: 4;
  }
  .styles__head___2leHz > *:nth-child(1), .styles__row___3Cs_i > *:nth-child(1) {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(16.65% - 10px);
    max-width: calc(16.65% - 10px);
    width: calc(16.65% - 10px);
  }
  .styles__head___2leHz > *:nth-child(1):nth-child(1n), .styles__row___3Cs_i > *:nth-child(1):nth-child(1n) {
    margin-right: 12px;
    margin-left: 0;
  }
  .styles__head___2leHz > *:nth-child(1):last-child, .styles__row___3Cs_i > *:nth-child(1):last-child {
    margin-right: 0;
  }
  .styles__head___2leHz > *:nth-child(1):nth-child(12n), .styles__row___3Cs_i > *:nth-child(1):nth-child(12n) {
    margin-right: 0;
    margin-left: auto;
  }
  .styles__head___2leHz > *:nth-child(2), .styles__row___3Cs_i > *:nth-child(2) {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(37.4625% - 7.5px);
    max-width: calc(37.4625% - 7.5px);
    width: calc(37.4625% - 7.5px);
  }
  .styles__head___2leHz > *:nth-child(2):nth-child(1n), .styles__row___3Cs_i > *:nth-child(2):nth-child(1n) {
    margin-right: 12px;
    margin-left: 0;
  }
  .styles__head___2leHz > *:nth-child(2):last-child, .styles__row___3Cs_i > *:nth-child(2):last-child {
    margin-right: 0;
  }
  .styles__head___2leHz > *:nth-child(2):nth-child(12n), .styles__row___3Cs_i > *:nth-child(2):nth-child(12n) {
    margin-right: 0;
    margin-left: auto;
  }
  .styles__head___2leHz > *:nth-child(3), .styles__row___3Cs_i > *:nth-child(3) {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(16.65% - 10px);
    max-width: calc(16.65% - 10px);
    width: calc(16.65% - 10px);
  }
  .styles__head___2leHz > *:nth-child(3):nth-child(1n), .styles__row___3Cs_i > *:nth-child(3):nth-child(1n) {
    margin-right: 12px;
    margin-left: 0;
  }
  .styles__head___2leHz > *:nth-child(3):last-child, .styles__row___3Cs_i > *:nth-child(3):last-child {
    margin-right: 0;
  }
  .styles__head___2leHz > *:nth-child(3):nth-child(12n), .styles__row___3Cs_i > *:nth-child(3):nth-child(12n) {
    margin-right: 0;
    margin-left: auto;
  }
  .styles__head___2leHz > *:nth-child(4), .styles__row___3Cs_i > *:nth-child(4) {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(16.65% - 10px);
    max-width: calc(16.65% - 10px);
    width: calc(16.65% - 10px);
  }
  .styles__head___2leHz > *:nth-child(4):nth-child(1n), .styles__row___3Cs_i > *:nth-child(4):nth-child(1n) {
    margin-right: 12px;
    margin-left: 0;
  }
  .styles__head___2leHz > *:nth-child(4):last-child, .styles__row___3Cs_i > *:nth-child(4):last-child {
    margin-right: 0;
  }
  .styles__head___2leHz > *:nth-child(4):nth-child(12n), .styles__row___3Cs_i > *:nth-child(4):nth-child(12n) {
    margin-right: 0;
    margin-left: auto;
  }
}
@media only screen and (max-width: 600px) {
  .styles__head___2leHz,
  .styles__row___3Cs_i {
    display: flex;
    flex-flow: row wrap;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
  }
  .styles__head___2leHz > *, .styles__row___3Cs_i > * {
    lost-column-cycle: 4;
  }
  .styles__head___2leHz > *:nth-child(1), .styles__row___3Cs_i > *:nth-child(1) {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(24.975% - 9px);
    max-width: calc(24.975% - 9px);
    width: calc(24.975% - 9px);
  }
  .styles__head___2leHz > *:nth-child(1):nth-child(1n), .styles__row___3Cs_i > *:nth-child(1):nth-child(1n) {
    margin-right: 12px;
    margin-left: 0;
  }
  .styles__head___2leHz > *:nth-child(1):last-child, .styles__row___3Cs_i > *:nth-child(1):last-child {
    margin-right: 0;
  }
  .styles__head___2leHz > *:nth-child(1):nth-child(12n), .styles__row___3Cs_i > *:nth-child(1):nth-child(12n) {
    margin-right: 0;
    margin-left: auto;
  }
  .styles__head___2leHz > *:nth-child(2), .styles__row___3Cs_i > *:nth-child(2) {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(45.7875% - 6.5px);
    max-width: calc(45.7875% - 6.5px);
    width: calc(45.7875% - 6.5px);
  }
  .styles__head___2leHz > *:nth-child(2):nth-child(1n), .styles__row___3Cs_i > *:nth-child(2):nth-child(1n) {
    margin-right: 12px;
    margin-left: 0;
  }
  .styles__head___2leHz > *:nth-child(2):last-child, .styles__row___3Cs_i > *:nth-child(2):last-child {
    margin-right: 0;
  }
  .styles__head___2leHz > *:nth-child(2):nth-child(12n), .styles__row___3Cs_i > *:nth-child(2):nth-child(12n) {
    margin-right: 0;
    margin-left: auto;
  }
  .styles__head___2leHz > *:nth-child(3), .styles__row___3Cs_i > *:nth-child(3) {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(16.65% - 10px);
    max-width: calc(16.65% - 10px);
    width: calc(16.65% - 10px);
  }
  .styles__head___2leHz > *:nth-child(3):nth-child(1n), .styles__row___3Cs_i > *:nth-child(3):nth-child(1n) {
    margin-right: 12px;
    margin-left: 0;
  }
  .styles__head___2leHz > *:nth-child(3):last-child, .styles__row___3Cs_i > *:nth-child(3):last-child {
    margin-right: 0;
  }
  .styles__head___2leHz > *:nth-child(3):nth-child(12n), .styles__row___3Cs_i > *:nth-child(3):nth-child(12n) {
    margin-right: 0;
    margin-left: auto;
  }
  .styles__head___2leHz > *:nth-child(4), .styles__row___3Cs_i > *:nth-child(4) {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(12.4875% - 10.5px);
    max-width: calc(12.4875% - 10.5px);
    width: calc(12.4875% - 10.5px);
  }
  .styles__head___2leHz > *:nth-child(4):nth-child(1n), .styles__row___3Cs_i > *:nth-child(4):nth-child(1n) {
    margin-right: 12px;
    margin-left: 0;
  }
  .styles__head___2leHz > *:nth-child(4):last-child, .styles__row___3Cs_i > *:nth-child(4):last-child {
    margin-right: 0;
  }
  .styles__head___2leHz > *:nth-child(4):nth-child(12n), .styles__row___3Cs_i > *:nth-child(4):nth-child(12n) {
    margin-right: 0;
    margin-left: auto;
  }
}
.styles__noInvoices___2Rpxi {
  text-align: center;
}
.styles__downloadLicense___2owhm {
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  letter-spacing: normal;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-weight: bold;
  color: #099cec;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  cursor: pointer
}
.styles__downloadLicense___2owhm > svg {
  fill: #099cec;
  margin-right: 4px;
}
.styles__downloadLicenseError___1pkL8 {
  color: #e12b0c
}
.styles__downloadLicenseError___1pkL8 > svg {
  fill: #e12b0c;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___2Djn_ {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___2Djn_ {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
/*
Top Nav:
- default avatar: white fingerprint
- personalized avatar: blue border

(1) Org list (2) Community Header Profile (3) Publisher Header Profile:
- personalized avatar: grey border
- the default avatar (i.e., the fingerprint): no border and is a blue fingerprint
*/
.styles__parent___2mFTP {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center
}
.styles__parent___2mFTP.styles__default___3Uxzu img {
      border: none;
      padding: 3px;
}
.styles__parent___2mFTP.styles__personalizedAvatar___2LkSj img {
      border: 3px solid #6bc3f3;
}
.styles__parent___2mFTP.styles__personalizedAvatar___2LkSj.styles__personalizedAvatarGreyBorder___3QXkG img {
        border: 3px solid #e7e8e9;
}
.styles__parent___2mFTP img {
    border-radius: 50%;
    -webkit-box-sizing: content-box;
            box-sizing: content-box;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___3hvID {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___3hvID {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__header___2DnGz {
  background-color: #ffffff;
  padding-top: 50px;
}
.styles__infoSection___1UTm3 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  margin: 0 auto;
  padding-top: 16px;
}
.styles__photoWrapper___3q6TR {
  width: 160px;
  height: 160px;
}
.styles__photoWrapper___3q6TR {
  min-width: 160px;
  position: relative;
  bottom: 40px;
  border-radius: 50%;
  overflow: hidden;
  background-color: #ffffff;
  border: 4px solid #ffffff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.styles__info___1Rd2O {
  color: #445d6e;
}
@media only screen and (max-width: 600px) {
  .styles__infoSection___1UTm3 {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    padding-bottom: 32px;
  }
}
@media only screen and (min-width: 601px) {
  .styles__infoSection___1UTm3 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    height: 176px;
    margin: 0 auto;
    padding-top: 16px;
  }
  .styles__info___1Rd2O {
    padding-left: 16px;
  }
}
.styles__photo___3Ysbi {
  width: 152px;
  height: 152px;
}
.styles__photo___3Ysbi {
  background-size: cover;
  background-position: 50%;
}
.styles__fallback___2uv23 {
  width: 80px;
  height: 80px;
}
.styles__name___14uxE {
  font-size: 22px;
  line-height: 32px;
  font-weight: 400;
  letter-spacing: normal;
  font-weight: 600;
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.styles__editLink___3a5pj {
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  letter-spacing: normal;
  margin-left: 8px;
}
.styles__description___2DIwK {
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  letter-spacing: normal;
  margin: 8px 0 12px 0;
  max-height: 40px;
  overflow: hidden;
}
.styles__details___3dj2a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  color: #8f9ea8;
  margin-bottom: 8px;
}
@media only screen and (max-width: 600px) {
  .styles__details___3dj2a {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
.styles__detail___1k4W1 {
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
  letter-spacing: normal;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 0 20px 4px 0;
}
.styles__detail___1k4W1 a {
    text-decoration: none;
  }
.styles__detailIcon___1Au6I {
  width: 18px;
  height: 18px;
}
.styles__detailIcon___1Au6I {
  margin-right: 4px;
  fill: #8f9ea8;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___2NUt- {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___2NUt- {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__main___15xn1 {
  font-family: 'Open Sans', sans-serif !important;
  font-size: 14px !important;
}
/* https://css-tricks.com/snippets/css/turn-off-number-input-spinners/ */
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___1mgJ8 {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___1mgJ8 {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.Select-control {
    border-radius: 2px;
    border-color: #e0e4e7 !important;
  }
.is-disabled .Select-control {
    cursor: not-allowed;
  }
.Select-menu-outer {
    border-bottom-right-radius: 2px;
    border-bottom-left-radius: 2px;
    border: 1px solid #e0e4e7;
    -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .1);
            box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .1);
  }
.Select-option {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    background-color: #ffffff;
    cursor: pointer;
    display: block;
    padding: 8px 10px
  }
.Select-option:last-child {
  border-bottom-right-radius: 2px;
  border-bottom-left-radius: 2px;
}
.Select-option.is-focused {
  background: #f7f7f8;
}
/* Error text is hidden by default */
.styles__errorText___1k_sp {
  display: none;
  color: #e12b0c;
  font-size: 12px;
  line-height: 12px;
  height: 12px;
  margin-top: 4px;
}
.styles__visible___kJi7_ {
  display: block;
}
/* same gray as textField floatingLabelColor */
.styles__sectionHeader___O2fp- {
  color: #6a7c94;
  font-size: 10px;
  margin-bottom: 8px;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___IDRV_ {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___IDRV_ {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__expiration___1uPcB .styles__title___pzNOK {
    margin-top: -22px;
    padding: 4px;
    color: #8f9ea8;
  }
.styles__expiration___1uPcB .styles__dates___2ldkU {
    display: flex;
    flex-flow: row wrap;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
  }
.styles__expiration___1uPcB .styles__dates___2ldkU > * {
  lost-column-cycle: 2;
}
.styles__expiration___1uPcB .styles__dates___2ldkU > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(49.95% - 6px);
  max-width: calc(49.95% - 6px);
  width: calc(49.95% - 6px);
}
.styles__expiration___1uPcB .styles__dates___2ldkU > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__expiration___1uPcB .styles__dates___2ldkU > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__expiration___1uPcB .styles__dates___2ldkU > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__expiration___1uPcB .styles__dates___2ldkU > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(49.95% - 6px);
  max-width: calc(49.95% - 6px);
  width: calc(49.95% - 6px);
}
.styles__expiration___1uPcB .styles__dates___2ldkU > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__expiration___1uPcB .styles__dates___2ldkU > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__expiration___1uPcB .styles__dates___2ldkU > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__expiration___1uPcB .styles__dates___2ldkU {
  margin-bottom: 8px;
}
.styles__expirationErr___1kLax > div {
  border-color: #e12b0c !important;
}
.styles__dateErr___1_DFF {
  color: #e12b0c;
  font-size: 12px;
  margin: 0 4px;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___Tty09 {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___Tty09 {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__form___1I4di {
  padding: 12px;
}
@media only screen and (max-width: 600px) {

  .styles__row___343WU,
  .styles__cardRow___1wWCG,
  .styles__postalRow___3FOme,
  .styles__submitRow___1FQY_ {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
@media only screen and (min-width: 601px) {
  .styles__row___343WU {
    display: flex;
    flex-flow: row wrap;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
  }
  .styles__row___343WU > * {
    lost-column-cycle: 2;
  }
  .styles__row___343WU > *:nth-child(1) {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(49.95% - 6px);
    max-width: calc(49.95% - 6px);
    width: calc(49.95% - 6px);
  }
  .styles__row___343WU > *:nth-child(1):nth-child(1n) {
    margin-right: 12px;
    margin-left: 0;
  }
  .styles__row___343WU > *:nth-child(1):last-child {
    margin-right: 0;
  }
  .styles__row___343WU > *:nth-child(1):nth-child(12n) {
    margin-right: 0;
    margin-left: auto;
  }
  .styles__row___343WU > *:nth-child(2) {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(49.95% - 6px);
    max-width: calc(49.95% - 6px);
    width: calc(49.95% - 6px);
  }
  .styles__row___343WU > *:nth-child(2):nth-child(1n) {
    margin-right: 12px;
    margin-left: 0;
  }
  .styles__row___343WU > *:nth-child(2):last-child {
    margin-right: 0;
  }
  .styles__row___343WU > *:nth-child(2):nth-child(12n) {
    margin-right: 0;
    margin-left: auto;
  }

  .styles__cardRow___1wWCG {
    display: flex;
    flex-flow: row wrap;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
  }

  .styles__cardRow___1wWCG > * {
    lost-column-cycle: 3;
  }

  .styles__cardRow___1wWCG > *:nth-child(1) {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(49.95% - 6px);
    max-width: calc(49.95% - 6px);
    width: calc(49.95% - 6px);
  }

  .styles__cardRow___1wWCG > *:nth-child(1):nth-child(1n) {
    margin-right: 12px;
    margin-left: 0;
  }

  .styles__cardRow___1wWCG > *:nth-child(1):last-child {
    margin-right: 0;
  }

  .styles__cardRow___1wWCG > *:nth-child(1):nth-child(12n) {
    margin-right: 0;
    margin-left: auto;
  }

  .styles__cardRow___1wWCG > *:nth-child(2) {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(16.65% - 10px);
    max-width: calc(16.65% - 10px);
    width: calc(16.65% - 10px);
  }

  .styles__cardRow___1wWCG > *:nth-child(2):nth-child(1n) {
    margin-right: 12px;
    margin-left: 0;
  }

  .styles__cardRow___1wWCG > *:nth-child(2):last-child {
    margin-right: 0;
  }

  .styles__cardRow___1wWCG > *:nth-child(2):nth-child(12n) {
    margin-right: 0;
    margin-left: auto;
  }

  .styles__cardRow___1wWCG > *:nth-child(3) {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(33.3% - 8px);
    max-width: calc(33.3% - 8px);
    width: calc(33.3% - 8px);
  }

  .styles__cardRow___1wWCG > *:nth-child(3):nth-child(1n) {
    margin-right: 12px;
    margin-left: 0;
  }

  .styles__cardRow___1wWCG > *:nth-child(3):last-child {
    margin-right: 0;
  }

  .styles__cardRow___1wWCG > *:nth-child(3):nth-child(12n) {
    margin-right: 0;
    margin-left: auto;
  }

  .styles__cardRow___1wWCG {
    margin-top: 16px;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }

  .styles__postalRow___3FOme {
    display: flex;
    flex-flow: row wrap;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
  }

  .styles__postalRow___3FOme > * {
    lost-column-cycle: 3;
  }

  .styles__postalRow___3FOme > *:nth-child(1) {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(33.3% - 8px);
    max-width: calc(33.3% - 8px);
    width: calc(33.3% - 8px);
  }

  .styles__postalRow___3FOme > *:nth-child(1):nth-child(1n) {
    margin-right: 12px;
    margin-left: 0;
  }

  .styles__postalRow___3FOme > *:nth-child(1):last-child {
    margin-right: 0;
  }

  .styles__postalRow___3FOme > *:nth-child(1):nth-child(12n) {
    margin-right: 0;
    margin-left: auto;
  }

  .styles__postalRow___3FOme > *:nth-child(2) {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(16.65% - 10px);
    max-width: calc(16.65% - 10px);
    width: calc(16.65% - 10px);
  }

  .styles__postalRow___3FOme > *:nth-child(2):nth-child(1n) {
    margin-right: 12px;
    margin-left: 0;
  }

  .styles__postalRow___3FOme > *:nth-child(2):last-child {
    margin-right: 0;
  }

  .styles__postalRow___3FOme > *:nth-child(2):nth-child(12n) {
    margin-right: 0;
    margin-left: auto;
  }

  .styles__postalRow___3FOme > *:nth-child(3) {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(49.95% - 6px);
    max-width: calc(49.95% - 6px);
    width: calc(49.95% - 6px);
  }

  .styles__postalRow___3FOme > *:nth-child(3):nth-child(1n) {
    margin-right: 12px;
    margin-left: 0;
  }

  .styles__postalRow___3FOme > *:nth-child(3):last-child {
    margin-right: 0;
  }

  .styles__postalRow___3FOme > *:nth-child(3):nth-child(12n) {
    margin-right: 0;
    margin-left: auto;
  }

  .styles__postalRow___3FOme {
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
  }
}
.styles__title___2vWed {
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  letter-spacing: normal;
  color: #445d6e;
  font-weight: bold;
}
.styles__error___1X41h {
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  letter-spacing: normal;
  font-weight: bold;
  color: #e12b0c;
}
.styles__submit___2luIu {
  margin: 20px 20px 0 0;
}
.styles__warning___o0yDm {
  color: #e12b0c;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  margin: 0 16px;
}
.styles__warning___o0yDm .styles__icon___1B8qM {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___Cg56o {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___Cg56o {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__title___IOVkF {
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  letter-spacing: normal;
  color: #445d6e;
  font-weight: bold;
}
.styles__updateCardRow___3D0m5 {
  margin-bottom: 16px;
}
.styles__paymentMethods___3R1a2 {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  width: 100%;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin: 16px 0;
}
.styles__paymentMethod___2_SMa {
  position: relative;
  margin-right: 16px;
}
.styles__card___2TCFN {
  min-width: 200px;
  height: 104px;
}
.styles__deletePaymentMethod___3VNjD {
  position: absolute;
  top: 0;
  right: 6px;
  cursor: pointer;
}
.styles__option___3eY6F {
  display: inline-block;
  text-decoration: underline;
  cursor: pointer;
}
.styles__options___Wumw_ {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.styles__prompt___1anb3 {
  margin-bottom: 16px;
}
.styles__splitForms___3J_ji {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap
}
.styles__splitForms___3J_ji > * {
  lost-column-cycle: 2;
}
.styles__splitForms___3J_ji > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(49.95% - 6px);
  max-width: calc(49.95% - 6px);
  width: calc(49.95% - 6px);
}
.styles__splitForms___3J_ji > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__splitForms___3J_ji > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__splitForms___3J_ji > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__splitForms___3J_ji > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(49.95% - 6px);
  max-width: calc(49.95% - 6px);
  width: calc(49.95% - 6px);
}
.styles__splitForms___3J_ji > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__splitForms___3J_ji > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__splitForms___3J_ji > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__splitForms___3J_ji > div:first-child {
    border-right: 1px solid #c0c9ce;
}
.styles__submit___1ik6R {
  cursor: pointer;
  margin: 8px 16px;
}
.styles__error___XLdUk {
  color: #e12b0c;
  padding-top: 12px;
}
.styles__noCreditCardsOnFile___1wEX_ {
  padding-top: 0;
  padding-bottom: 16px;
}
.styles__subText___3iVOu {
  color: #27343b;
}
.styles__loading___2fRzt {
  height: 550px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___tQCqX {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___tQCqX {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
@media only screen and (min-width: 601px) {
  .styles__row___2YoOt {
    display: flex;
    flex-flow: row wrap;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
  }
  .styles__row___2YoOt > * {
    lost-column-cycle: 2;
  }
  .styles__row___2YoOt > *:nth-child(1) {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(49.95% - 6px);
    max-width: calc(49.95% - 6px);
    width: calc(49.95% - 6px);
  }
  .styles__row___2YoOt > *:nth-child(1):nth-child(1n) {
    margin-right: 12px;
    margin-left: 0;
  }
  .styles__row___2YoOt > *:nth-child(1):last-child {
    margin-right: 0;
  }
  .styles__row___2YoOt > *:nth-child(1):nth-child(12n) {
    margin-right: 0;
    margin-left: auto;
  }
  .styles__row___2YoOt > *:nth-child(2) {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(49.95% - 6px);
    max-width: calc(49.95% - 6px);
    width: calc(49.95% - 6px);
  }
  .styles__row___2YoOt > *:nth-child(2):nth-child(1n) {
    margin-right: 12px;
    margin-left: 0;
  }
  .styles__row___2YoOt > *:nth-child(2):last-child {
    margin-right: 0;
  }
  .styles__row___2YoOt > *:nth-child(2):nth-child(12n) {
    margin-right: 0;
    margin-left: auto;
  }
  .styles__row___2YoOt {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }

  .styles__postalRow___2E5hi {
    display: flex;
    flex-flow: row wrap;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
  }

  .styles__postalRow___2E5hi > * {
    lost-column-cycle: 3;
  }

  .styles__postalRow___2E5hi > *:nth-child(1) {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(33.3% - 8px);
    max-width: calc(33.3% - 8px);
    width: calc(33.3% - 8px);
  }

  .styles__postalRow___2E5hi > *:nth-child(1):nth-child(1n) {
    margin-right: 12px;
    margin-left: 0;
  }

  .styles__postalRow___2E5hi > *:nth-child(1):last-child {
    margin-right: 0;
  }

  .styles__postalRow___2E5hi > *:nth-child(1):nth-child(12n) {
    margin-right: 0;
    margin-left: auto;
  }

  .styles__postalRow___2E5hi > *:nth-child(2) {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(33.3% - 8px);
    max-width: calc(33.3% - 8px);
    width: calc(33.3% - 8px);
  }

  .styles__postalRow___2E5hi > *:nth-child(2):nth-child(1n) {
    margin-right: 12px;
    margin-left: 0;
  }

  .styles__postalRow___2E5hi > *:nth-child(2):last-child {
    margin-right: 0;
  }

  .styles__postalRow___2E5hi > *:nth-child(2):nth-child(12n) {
    margin-right: 0;
    margin-left: auto;
  }

  .styles__postalRow___2E5hi > *:nth-child(3) {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(33.3% - 8px);
    max-width: calc(33.3% - 8px);
    width: calc(33.3% - 8px);
  }

  .styles__postalRow___2E5hi > *:nth-child(3):nth-child(1n) {
    margin-right: 12px;
    margin-left: 0;
  }

  .styles__postalRow___2E5hi > *:nth-child(3):last-child {
    margin-right: 0;
  }

  .styles__postalRow___2E5hi > *:nth-child(3):nth-child(12n) {
    margin-right: 0;
    margin-left: auto;
  }

  .styles__postalRow___2E5hi {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}
.styles__error___3we6r {
  font-size: 13px;
  line-height: 18px;
  font-weight: 400;
  letter-spacing: normal;
  height: 16px;
  color: #e12b0c;
  margin: 0 40px;
}
.styles__select___kHB3_ {
  margin-bottom: 12px;
}
@media only screen and (max-width: 600px) {
  .styles__row___2YoOt,
  .styles__postalRow___2E5hi {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___1ltQO {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___1ltQO {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
@media only screen and (min-width: 601px) {
  .styles__row___1Z8zD {
    display: flex;
    flex-flow: row wrap;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
  }
  .styles__row___1Z8zD > * {
    lost-column-cycle: 2;
  }
  .styles__row___1Z8zD > *:nth-child(1) {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(49.95% - 6px);
    max-width: calc(49.95% - 6px);
    width: calc(49.95% - 6px);
  }
  .styles__row___1Z8zD > *:nth-child(1):nth-child(1n) {
    margin-right: 12px;
    margin-left: 0;
  }
  .styles__row___1Z8zD > *:nth-child(1):last-child {
    margin-right: 0;
  }
  .styles__row___1Z8zD > *:nth-child(1):nth-child(12n) {
    margin-right: 0;
    margin-left: auto;
  }
  .styles__row___1Z8zD > *:nth-child(2) {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(49.95% - 6px);
    max-width: calc(49.95% - 6px);
    width: calc(49.95% - 6px);
  }
  .styles__row___1Z8zD > *:nth-child(2):nth-child(1n) {
    margin-right: 12px;
    margin-left: 0;
  }
  .styles__row___1Z8zD > *:nth-child(2):last-child {
    margin-right: 0;
  }
  .styles__row___1Z8zD > *:nth-child(2):nth-child(12n) {
    margin-right: 0;
    margin-left: auto;
  }
  .styles__row___1Z8zD {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}
.styles__fullRow___2YJlK {
  width: 100%;
}
.styles__title___3e-1z {
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  letter-spacing: normal;
  color: #445d6e;
  font-weight: bold;
}
.styles__submit___3qZLU {
  cursor: pointer;
  margin-left: 0;
}
.styles__successMessage___36cOd {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 12px;
  color: #00cbca;
}
.styles__successMessage___36cOd .styles__iconWrapper___3Nnek {
    margin-right: 8px;
  }
.styles__updateError___1vzdJ {
  margin-bottom: 20px;
}
@media only screen and (max-width: 600px) {
  .styles__row___1Z8zD {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}

/* https://goo.gl/Mus6xj */

/* Font sizes */

/* columns */

/* Three equal columns */

/* Rows */

/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/

@-webkit-keyframes styles__fadein___3HVmx {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes styles__fadein___3HVmx {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */

/* Causes text that overflows in an element to be truncated with an ellipsis. */

/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/

.styles__main___2fYQv.styles__notRunning_fill___3ibKG {/* stylelint-disable declaration-colon-space-before */
  fill : #1aaaf8;/* stylelint-enable */
}

.styles__main___2fYQv.styles__failed_fill___2-kSX {/* stylelint-disable declaration-colon-space-before */
  fill : #ef4a53;/* stylelint-enable */
}

.styles__main___2fYQv.styles__deployed_fill___3Egmg {/* stylelint-disable declaration-colon-space-before */
  fill : #00cbca;/* stylelint-enable */
}

.styles__main___2fYQv.styles__partlyRunning_fill___3p-DF {/* stylelint-disable declaration-colon-space-before */
  fill : #ffb463;/* stylelint-enable */
}

.styles__main___2fYQv.styles__canceled_fill___2UUhV {/* stylelint-disable declaration-colon-space-before */
  fill : #82949e;/* stylelint-enable */
}

.styles__main___2fYQv.styles__running_fill___1M1Xw {/* stylelint-disable declaration-colon-space-before */
  fill : #00cbca;/* stylelint-enable */
}

.styles__main___2fYQv.styles__succeeded_fill___V8qBq {/* stylelint-disable declaration-colon-space-before */
  fill : #00cbca;/* stylelint-enable */
}

.styles__main___2fYQv.styles__stopped_fill___366eC {/* stylelint-disable declaration-colon-space-before */
  fill : #ef4a53;/* stylelint-enable */
}

.styles__main___2fYQv.styles__empty_fill___2upwd {/* stylelint-disable declaration-colon-space-before */
  fill : #9eb3d5;/* stylelint-enable */
}

.styles__main___2fYQv.styles__emptyCluster_fill___31clH {/* stylelint-disable declaration-colon-space-before */
  fill : #9eb3d5;/* stylelint-enable */
}

.styles__main___2fYQv.styles__terminated_fill___18mZF {/* stylelint-disable declaration-colon-space-before */
  fill : #637986;/* stylelint-enable */
}

.styles__main___2fYQv.styles__unreachable_fill___2GcD3 {/* stylelint-disable declaration-colon-space-before */
  fill : #9967ff;/* stylelint-enable */
}

.styles__main___2fYQv.styles__pending_fill___1FOLZ {/* stylelint-disable declaration-colon-space-before */
  fill : #ffb463;/* stylelint-enable */
}

.styles__main___2fYQv.styles__inProgress_fill___2dU78 {/* stylelint-disable declaration-colon-space-before */
  fill : #2596ec;/* stylelint-enable */
}

.styles__main___2fYQv.styles__canceling_fill___1BzK8 {/* stylelint-disable declaration-colon-space-before */
  fill : #82949e;/* stylelint-enable */
}

.styles__main___2fYQv.styles__success_fill___1B-IJ {/* stylelint-disable declaration-colon-space-before */
  fill : #00cbca;/* stylelint-enable */
}

.styles__main___2fYQv.styles__initialized_fill___18UwF {/* stylelint-disable declaration-colon-space-before */
  fill : #2596ec;/* stylelint-enable */
}

.styles__main___2fYQv.styles__active_fill___l6IG7 {/* stylelint-disable declaration-colon-space-before */
  fill : #00cbca;/* stylelint-enable */
}

.styles__main___2fYQv.styles__pendingDelete_fill___3ics1 {/* stylelint-disable declaration-colon-space-before */
  fill : #ffc400;/* stylelint-enable */
}

.styles__main___2fYQv.styles__locked_fill___ZPjsx {/* stylelint-disable declaration-colon-space-before */
  fill : #ef4a53;/* stylelint-enable */
}

.styles__main___2fYQv.styles__readable_fill___2PTjN {/* stylelint-disable declaration-colon-space-before */
  fill : #ef4a53;/* stylelint-enable */
}

.styles__main___2fYQv.styles__writable_fill___VR4pq {/* stylelint-disable declaration-colon-space-before */
  fill : #00cbca;/* stylelint-enable */
}

.styles__main___2fYQv.styles__deploying_fill___276fl {/* stylelint-disable declaration-colon-space-before */
  fill : #00cbca;/* stylelint-enable */
}

.styles__main___2fYQv.styles__unavailable_fill___24_C2 {/* stylelint-disable declaration-colon-space-before */
  fill : #9967ff;/* stylelint-enable */
}

.styles__main___2fYQv.styles__notRunning_color___p6ZVB {/* stylelint-disable declaration-colon-space-before */
  color : #1aaaf8;/* stylelint-enable */
}

.styles__main___2fYQv.styles__failed_color___TX70K {/* stylelint-disable declaration-colon-space-before */
  color : #ef4a53;/* stylelint-enable */
}

.styles__main___2fYQv.styles__deployed_color___2Dktp {/* stylelint-disable declaration-colon-space-before */
  color : #00cbca;/* stylelint-enable */
}

.styles__main___2fYQv.styles__partlyRunning_color___2uUMr {/* stylelint-disable declaration-colon-space-before */
  color : #ffb463;/* stylelint-enable */
}

.styles__main___2fYQv.styles__canceled_color___20rSz {/* stylelint-disable declaration-colon-space-before */
  color : #82949e;/* stylelint-enable */
}

.styles__main___2fYQv.styles__running_color___19ap0 {/* stylelint-disable declaration-colon-space-before */
  color : #00cbca;/* stylelint-enable */
}

.styles__main___2fYQv.styles__succeeded_color___3VFVv {/* stylelint-disable declaration-colon-space-before */
  color : #00cbca;/* stylelint-enable */
}

.styles__main___2fYQv.styles__stopped_color___3iBW2 {/* stylelint-disable declaration-colon-space-before */
  color : #ef4a53;/* stylelint-enable */
}

.styles__main___2fYQv.styles__empty_color___2O_a3 {/* stylelint-disable declaration-colon-space-before */
  color : #9eb3d5;/* stylelint-enable */
}

.styles__main___2fYQv.styles__emptyCluster_color___1QopG {/* stylelint-disable declaration-colon-space-before */
  color : #9eb3d5;/* stylelint-enable */
}

.styles__main___2fYQv.styles__terminated_color___2YlQx {/* stylelint-disable declaration-colon-space-before */
  color : #637986;/* stylelint-enable */
}

.styles__main___2fYQv.styles__unreachable_color___1og0Z {/* stylelint-disable declaration-colon-space-before */
  color : #9967ff;/* stylelint-enable */
}

.styles__main___2fYQv.styles__pending_color___Qjyf_ {/* stylelint-disable declaration-colon-space-before */
  color : #ffb463;/* stylelint-enable */
}

.styles__main___2fYQv.styles__inProgress_color___2V0lG {/* stylelint-disable declaration-colon-space-before */
  color : #2596ec;/* stylelint-enable */
}

.styles__main___2fYQv.styles__canceling_color___l0G4U {/* stylelint-disable declaration-colon-space-before */
  color : #82949e;/* stylelint-enable */
}

.styles__main___2fYQv.styles__success_color___27TH4 {/* stylelint-disable declaration-colon-space-before */
  color : #00cbca;/* stylelint-enable */
}

.styles__main___2fYQv.styles__initialized_color___iHa0i {/* stylelint-disable declaration-colon-space-before */
  color : #2596ec;/* stylelint-enable */
}

.styles__main___2fYQv.styles__active_color___2yOp8 {/* stylelint-disable declaration-colon-space-before */
  color : #00cbca;/* stylelint-enable */
}

.styles__main___2fYQv.styles__pendingDelete_color___3lbiH {/* stylelint-disable declaration-colon-space-before */
  color : #ffc400;/* stylelint-enable */
}

.styles__main___2fYQv.styles__locked_color___gqUvS {/* stylelint-disable declaration-colon-space-before */
  color : #ef4a53;/* stylelint-enable */
}

.styles__main___2fYQv.styles__readable_color___3vqM0 {/* stylelint-disable declaration-colon-space-before */
  color : #ef4a53;/* stylelint-enable */
}

.styles__main___2fYQv.styles__writable_color___Ylh_W {/* stylelint-disable declaration-colon-space-before */
  color : #00cbca;/* stylelint-enable */
}

.styles__main___2fYQv.styles__deploying_color___QocxW {/* stylelint-disable declaration-colon-space-before */
  color : #00cbca;/* stylelint-enable */
}

.styles__main___2fYQv.styles__unavailable_color___umZ_E {/* stylelint-disable declaration-colon-space-before */
  color : #9967ff;/* stylelint-enable */
}

.styles__main___2fYQv.styles__notRunning_border-color___1i6ZU {/* stylelint-disable declaration-colon-space-before */
  border-color : #1aaaf8;/* stylelint-enable */
}

.styles__main___2fYQv.styles__failed_border-color___3e4OQ {/* stylelint-disable declaration-colon-space-before */
  border-color : #ef4a53;/* stylelint-enable */
}

.styles__main___2fYQv.styles__deployed_border-color___1Nlh6 {/* stylelint-disable declaration-colon-space-before */
  border-color : #00cbca;/* stylelint-enable */
}

.styles__main___2fYQv.styles__partlyRunning_border-color___d5i8H {/* stylelint-disable declaration-colon-space-before */
  border-color : #ffb463;/* stylelint-enable */
}

.styles__main___2fYQv.styles__canceled_border-color___3FPUr {/* stylelint-disable declaration-colon-space-before */
  border-color : #82949e;/* stylelint-enable */
}

.styles__main___2fYQv.styles__running_border-color___2uRZN {/* stylelint-disable declaration-colon-space-before */
  border-color : #00cbca;/* stylelint-enable */
}

.styles__main___2fYQv.styles__succeeded_border-color___2QeeU {/* stylelint-disable declaration-colon-space-before */
  border-color : #00cbca;/* stylelint-enable */
}

.styles__main___2fYQv.styles__stopped_border-color___2OlUb {/* stylelint-disable declaration-colon-space-before */
  border-color : #ef4a53;/* stylelint-enable */
}

.styles__main___2fYQv.styles__empty_border-color___1it5x {/* stylelint-disable declaration-colon-space-before */
  border-color : #9eb3d5;/* stylelint-enable */
}

.styles__main___2fYQv.styles__emptyCluster_border-color___1F4IE {/* stylelint-disable declaration-colon-space-before */
  border-color : #9eb3d5;/* stylelint-enable */
}

.styles__main___2fYQv.styles__terminated_border-color___3FJ3t {/* stylelint-disable declaration-colon-space-before */
  border-color : #637986;/* stylelint-enable */
}

.styles__main___2fYQv.styles__unreachable_border-color___3YUzI {/* stylelint-disable declaration-colon-space-before */
  border-color : #9967ff;/* stylelint-enable */
}

.styles__main___2fYQv.styles__pending_border-color___2IhMB {/* stylelint-disable declaration-colon-space-before */
  border-color : #ffb463;/* stylelint-enable */
}

.styles__main___2fYQv.styles__inProgress_border-color___1dHNl {/* stylelint-disable declaration-colon-space-before */
  border-color : #2596ec;/* stylelint-enable */
}

.styles__main___2fYQv.styles__canceling_border-color___Ucl3U {/* stylelint-disable declaration-colon-space-before */
  border-color : #82949e;/* stylelint-enable */
}

.styles__main___2fYQv.styles__success_border-color___2-l8Y {/* stylelint-disable declaration-colon-space-before */
  border-color : #00cbca;/* stylelint-enable */
}

.styles__main___2fYQv.styles__initialized_border-color___3NIVW {/* stylelint-disable declaration-colon-space-before */
  border-color : #2596ec;/* stylelint-enable */
}

.styles__main___2fYQv.styles__active_border-color___ET7O0 {/* stylelint-disable declaration-colon-space-before */
  border-color : #00cbca;/* stylelint-enable */
}

.styles__main___2fYQv.styles__pendingDelete_border-color___3gReF {/* stylelint-disable declaration-colon-space-before */
  border-color : #ffc400;/* stylelint-enable */
}

.styles__main___2fYQv.styles__locked_border-color___2cW-Q {/* stylelint-disable declaration-colon-space-before */
  border-color : #ef4a53;/* stylelint-enable */
}

.styles__main___2fYQv.styles__readable_border-color___1KjY1 {/* stylelint-disable declaration-colon-space-before */
  border-color : #ef4a53;/* stylelint-enable */
}

.styles__main___2fYQv.styles__writable_border-color___LfSh7 {/* stylelint-disable declaration-colon-space-before */
  border-color : #00cbca;/* stylelint-enable */
}

.styles__main___2fYQv.styles__deploying_border-color___wgoSO {/* stylelint-disable declaration-colon-space-before */
  border-color : #00cbca;/* stylelint-enable */
}

.styles__main___2fYQv.styles__unavailable_border-color___3h3l3 {/* stylelint-disable declaration-colon-space-before */
  border-color : #9967ff;/* stylelint-enable */
}

.styles__blink___3eIzd {
  -webkit-animation: styles__blinker___2VoOx 1.25s ease-in-out infinite;
          animation: styles__blinker___2VoOx 1.25s ease-in-out infinite;
}

@-webkit-keyframes styles__blinker___2VoOx {
  50% { opacity: 0.25; }
}

@keyframes styles__blinker___2VoOx {
  50% { opacity: 0.25; }
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___3nLO2 {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___3nLO2 {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__state___1sIRb {
  position: relative;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}
.styles__state___1sIRb i, .styles__stateBackground___j_5W_ {
  width: 11px;
  height: 11px;
}
.styles__state___1sIRb i,
.styles__stateBackground___j_5W_ {
  display: block;
  margin-top: 1px;
  border-style: solid;
  background: #ffffff;
  position: absolute;
  z-index: 2;
}
.styles__stateBackground___j_5W_ {
  color: #ffffff;
}
.styles__stateIcon___1XOeE {
  display: block;
  fill: #ffffff;
}
.styles__regular___2gPiy.styles__state___1sIRb {
  height: 28px;
  width: 28px;
}
.styles__regular___2gPiy.styles__state___1sIRb i,
  .styles__regular___2gPiy.styles__state___1sIRb .styles__stateBackground___j_5W_ {
    border-radius: 14px;
    border-width: 14px;
  }
.styles__regular___2gPiy.styles__state___1sIRb .styles__stateIcon___1XOeE {
    margin-top: -9px;
    margin-left: -9px;
  }
.styles__small___2zMwe.styles__state___1sIRb {
  height: 20px;
  width: 20px;
}
.styles__small___2zMwe.styles__state___1sIRb i,
  .styles__small___2zMwe.styles__state___1sIRb .styles__stateBackground___j_5W_ {
    border-radius: 10px;
    border-width: 10px;
  }
.styles__small___2zMwe.styles__state___1sIRb .styles__stateIcon___1XOeE {
    margin-top: -8px;
    margin-left: -6px;
  }

.styles__statusMessage___16Uy8 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  min-height: 63px;
  background: #fafafb;
  border-left: 4px solid;
  padding: 20px 14px;
}

.styles__error___33Lj_ {
  border-color: #e12b0c;
  fill: #e12b0c;
}

.styles__success___bNvZe {
  border-color: #00a000;
  fill: #00a000;
}

.styles__warning___2ZHD2 {
  border-color: #cccc00;
  fill: #cccc00;
}

.styles__default___FdpiS {
  border-color: #cccccc;
}

.styles__content___RFYzG {
  margin-left: 14px;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___1vDsq {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___1vDsq {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
html {
  background-color: #f7f7f8;
}
/* flexbox sticky footer */
/* https://philipwalton.github.io/solved-by-flexbox/demos/sticky-footer/ */
.styles__app___1o1RI {
  /* In development: make the app visible once css has loaded */
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  min-height: 100vh;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column
}
.styles__app___1o1RI.styles__noScroll___2cLFq {
  position: fixed;
  top: 0;
  bottom: 0;
}
.styles__main___1pg40 {
  -webkit-box-flex: 1;
      -ms-flex: 1 auto;
          flex: 1 auto;
  min-height: 100vh;
}
.styles__white___NRcyJ {
  background: #ffffff;
}
.styles__flexRow___2FYq7 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@keyframes styles__fadein___25_Fz {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__wrapper____G5VL {
  position: relative;
  -ms-flex-item-align: center;
      align-self: center;
  width: 100%;
}
.styles__searchBarWrapper___2kZcu {
  position: relative;
  width: 100%;
}
.styles__icon___2E1di {
  fill: #ffffff;
  position: absolute;
  top: 9px;
  left: 9px;
}
.styles__input___19pbM {
  text-indent: 24px;
  width: 100%;
  height: 36px;
  padding-top: 8px;
  padding-bottom: 8px;
  padding-left: 12px;
  border: 0;
  outline: none;
  border-radius: 2px;
  background-color: #ffffff;
}
.styles__menu___1De4e {
  border-radius: 2px;
  -webkit-box-shadow: 0 2px 12px rgba(0, 0, 0, .1);
          box-shadow: 0 2px 12px rgba(0, 0, 0, .1);
  background: #ffffff;
  position: absolute;
  overflow: auto;
  z-index: 999;
  width: 100%;
}
.styles__loading___Cm8lx {
  top: 10px;
  left: 10px;
}
.styles__result___1g6ah {
  color: #445d6e;
  padding: 8px 20px;
  cursor: pointer;
  text-align: left
}
.styles__result___1g6ah.styles__highlighted___kUwo0 {
  background: #e0e4e7;
}
.styles__menuTitle___3dScr {
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  letter-spacing: normal;
  cursor: default;
  color: #8f9ea8;
  text-align: left;
  padding: 12px;
}
.styles__resultName___14nHp {
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  letter-spacing: normal;
  color: #445d6e;
}
/* Search Autocomplete Results */
.styles__match___3HtXF {
  color: #099cec;
  font-weight: 600;
}
.styles__isOneCharSearchMsg___B7PMI {
  width: auto;
  max-width: 364px;
  height: 24px;
  font-size: 12px;
  border-radius: 2px;
  -webkit-box-shadow: 0 2px 3px #7d94a5;
          box-shadow: 0 2px 3px #7d94a5;
  background: #ffffff;
  padding: 3.6px;
  position: absolute;
  top: 110%;
  color: #244357;
  z-index: 1;
  -webkit-animation: styles__fadein___25_Fz 0.5s;
  animation: styles__fadein___25_Fz 0.5s;
}
.styles__triangle___F3-vG {
  position: absolute;
  z-index: 2;
  left: 9px;
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #ffffff;
  -webkit-animation: styles__fadein___25_Fz 0.5s;
  animation: styles__fadein___25_Fz 0.5s;
}
@keyframes styles__fadein___25_Fz {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@-webkit-keyframes styles__fadein___25_Fz {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___3Cudc {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___3Cudc {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__parent___3plE4 {
  background: #29343a;
  height: 800px;
}
.styles__wrapper___1wZgS {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  color: #ffffff;
  font-family: 'Open Sans', sans-serif;
}
.styles__wrapper___1wZgS .styles__bottomContent___1TTxl {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    width: 800px;
    -ms-flex-item-align: center;
        align-self: center;
  }
.styles__wrapper___1wZgS .styles__header___25rVg {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-bottom: 56px;
  }
.styles__onboardingParent___2rQXs {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  max-height: 1000px;
  width: 100%;
}
.styles__onboardingParent___2rQXs .styles__content___13y7M {
    background: #3a4951;
    -webkit-box-shadow: 0 4px 12px rgba(0, 0, 0, .33);
            box-shadow: 0 4px 12px rgba(0, 0, 0, .33);
    border-radius: 6px;
    height: 550px;
    width: 800px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin: 0 40px;
  }
.styles__onboardingParent___2rQXs .styles__content___13y7M .styles__userType___25AvY {
      text-align: left;
      margin-bottom: 10px;
    }
.styles__onboardingParent___2rQXs .styles__content___13y7M .styles__instructionHeader___3naUA {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      width: 470px;
    }
.styles__onboardingParent___2rQXs .styles__content___13y7M .styles__title___18fWg {
      font-size: 16px;
      font-weight: 600;
      text-align: center;
      margin: 35px 0 9px;
      max-width: 500px;
    }
.styles__onboardingParent___2rQXs .styles__content___13y7M .styles__subTitle___2Jqcz {
      font-weight: 400;
      font-size: 14px;
      line-height: 20px;
      text-align: center;
      margin-bottom: 35px;
      max-width: 500px;
    }
.styles__onboardingParent___2rQXs .styles__content___13y7M .styles__osOptions___3jtNH {
      font-size: 12px;
    }
.styles__onboardingParent___2rQXs .styles__content___13y7M .styles__osLine___3PXhs {
      background: #6bc3f3;
      width: 32px;
      height: 2px;
    }
.styles__onboardingParent___2rQXs .styles__content___13y7M .styles__helpLink___1xXDr {
      margin: 30px 0;
    }
.styles__onboardingParent___2rQXs .styles__content___13y7M .styles__subsequentSteps___2ifDL {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      background: #2496ed;
      -webkit-box-shadow: 0 4px 12px rgba(0, 0, 0, .33);
              box-shadow: 0 4px 12px rgba(0, 0, 0, .33);
      border-radius: 6px;
      width: 485px;
      min-height: 115px;
      font-weight: 500;
      color: #ffffff;
      margin-top: 16px;
    }
.styles__onboardingParent___2rQXs .styles__content___13y7M .styles__subsequentSteps___2ifDL .styles__instruction___1llTs {
        font-weight: 600;
        font-family: Courier, monospace;
        font-size: 14px;
        line-height: 16px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
      }
.styles__onboardingParent___2rQXs .styles__content___13y7M .styles__subsequentSteps___2ifDL .styles__instruction___1llTs .styles__clipboard___1RraE {
          display: grid;
          grid-template-rows: auto auto;
        }
.styles__onboardingParent___2rQXs .styles__content___13y7M .styles__subsequentSteps___2ifDL .styles__instruction___1llTs .styles__clipboard___1RraE .styles__copied___1Kb_C {
            font-size: 8px;
          }
.styles__onboardingParent___2rQXs .styles__content___13y7M .styles__subsequentSteps___2ifDL .styles__instruction___1llTs .styles__command___2N8j9 {
          margin-right: 20px;
          max-width: 365px;
          word-wrap: break-word;
          min-height: 40px;
        }
.styles__onboardingParent___2rQXs .styles__content___13y7M .styles__wrapper___1wZgS {
      display: grid;
      width: 375px;
    }
.styles__onboardingParent___2rQXs .styles__content___13y7M .styles__wrapper___1wZgS .styles__img___1lTSB {
        height: 140px;
        width: 230px;
        grid-column: 2;
        grid-column-start: 1;
        grid-column-end: 3;
        grid-row-start: 1;
        grid-row-end: 3;
        justify-self: center;
        margin-bottom: 20px;
      }
.styles__onboardingParent___2rQXs .styles__content___13y7M .styles__wrapper___1wZgS .styles__desktopIcon___1eyQf {
        grid-column-start: 1;
        grid-row-start: 3;
        grid-row-end: 5;
      }
.styles__onboardingParent___2rQXs .styles__content___13y7M .styles__wrapper___1wZgS .styles__text___1eYOE {
        font-weight: 600;
        grid-column-start: 2;
        padding: 0 10px 3px;
      }
.styles__onboardingParent___2rQXs .styles__content___13y7M .styles__wrapper___1wZgS .styles__subtext___2be7a {
        padding: 0 10px 3px;
        font-weight: normal;
        grid-column-start: 2;
      }
.styles__onboardingParent___2rQXs .styles__content___13y7M .styles__wrapper___1wZgS .styles__subtext___2be7a a {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-pack: center;
              -ms-flex-pack: center;
                  justify-content: center;
          text-decoration: none;
          cursor: pointer;
          color: #6bc3f3;
          font-size: 12px;
        }
.styles__onboardingParent___2rQXs .styles__content___13y7M .styles__wrapper___1wZgS .styles__subtext___2be7a:first-child {
  padding: 0 10px;
}
.styles__onboardingParent___2rQXs .styles__content___13y7M .styles__wrapper___1wZgS .styles__subtext___2be7a:nth-last-child(2) {
  margin: 10px 0;
  padding-left: 10px;
  max-width: 350px;
}
.styles__onboardingParent___2rQXs .styles__content___13y7M .styles__wrapper___1wZgS .styles__subtext___2be7a:nth-last-child(2) button {
            background-color: #007bff;
            border-color: #007bff;
            margin: 0;
}
.styles__onboardingParent___2rQXs .styles__content___13y7M .styles__wrapper___1wZgS .styles__subtext___2be7a:nth-last-child(2) button:hover {
  background-color: #066da5;
  border-color: #066da5;
}
.styles__onboardingParent___2rQXs .styles__navigator___1OI6L {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 650px;
    width: 10%;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
  }
.styles__onboardingParent___2rQXs .styles__navigator___1OI6L .styles__previousStep___3TJ26 button {
        font-weight: 500;
        color: #6bc3f3;
        background-color: #29343a;
        border-color: #29343a
      }
.styles__onboardingParent___2rQXs .styles__navigator___1OI6L .styles__previousStep___3TJ26 button:hover {
  background-color: #29343a;
  border-color: #29343a;
}
.styles__onboardingParent___2rQXs .styles__navigator___1OI6L .styles__nextStepButton___2BtTc {
      width: 155px;
    }
.styles__onboardingParent___2rQXs .styles__navigator___1OI6L .styles__nextStepButton___2BtTc button {
        background-color: #007bff;
        border-color: #007bff
      }
.styles__onboardingParent___2rQXs .styles__navigator___1OI6L .styles__nextStepButton___2BtTc button:hover {
  background-color: #066da5;
  border-color: #066da5;
}
.styles__link___2BZI- {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 100%;
  color: #6bc3f3;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
  margin: 20px 0;
}
.styles__tooltip___1MSO4 {
  font-family: 'Open Sans', sans-serif;
}
.styles__cursor___hUk66 {
  cursor: pointer;
}
.styles__tab___1qJKr {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  margin-left: 2px;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
.styles__macPlan___2xG8Z {
  font-family: 'Open Sans', sans-serif;
  margin-right: 19px;
  padding-bottom: 10px;
  border: none;
  outline: none;
  cursor: pointer;
  color: #e7e8e9;
  background-color: rgba(0, 0, 0, 0);
  background-color: transparent
}
.styles__macPlan___2xG8Z:hover {
  border: none;
  outline: none;
}
.styles__macPlan___2xG8Z.styles__macView___2cejj {
  color: #ffffff;
  border-bottom: 2px solid #6bc3f3;
  padding-bottom: 8px;
}
.styles__windowsPlan___6JCIG {
  font-family: 'Open Sans', sans-serif;
  padding-bottom: 10px;
  border: none;
  outline: none;
  color: #e7e8e9;
  cursor: pointer;
  background-color: rgba(0, 0, 0, 0);
  background-color: transparent
}
.styles__windowsPlan___6JCIG:hover {
  border: none;
  outline: none;
}
.styles__windowsPlan___6JCIG.styles__windowsView___3V1cb {
  color: #ffffff;
  border-bottom: 2px solid #6bc3f3;
  background-color: rgba(0, 0, 0, 0);
  padding-bottom: 8px;
}
@media (max-width: 600px) {
    .styles__onboardingParent___2rQXs .styles__content___13y7M {
      max-width: 400px;
    }

      .styles__onboardingParent___2rQXs .styles__content___13y7M .styles__title___18fWg {
        max-width: 400px;
      }

      .styles__onboardingParent___2rQXs .styles__content___13y7M .styles__subTitle___2Jqcz {
        max-width: 400px;
      }

      .styles__onboardingParent___2rQXs .styles__content___13y7M .styles__subsequentSteps___2ifDL {
        max-width: 350px;
        padding: 0 30px;
      }
          .styles__onboardingParent___2rQXs .styles__content___13y7M .styles__subsequentSteps___2ifDL .styles__instruction___1llTs .styles__command___2N8j9 {
            max-width: 250px;
          }
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___bAj3j {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___bAj3j {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__parent___2zI4b {
  margin-top: 30px;
}
.styles__title___1ZOJ7 {
  font-size: 17px;
  font-weight: 600; /* semibold */
}
.styles__stepBox___eMEIM {
  height: 200px;
  min-width: 120px;
  width: 10%;
  position: relative;
  margin-top: 20px;
}
.styles__stepBox___eMEIM .styles__steps___2RJH1 {
    display: grid;
    grid-template-columns: 40px 80px;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin-bottom: 15px;
  }
.styles__stepBox___eMEIM .styles__steps___2RJH1 .styles__currentStep___3ks53 {
      height: 22px;
      width: 22px;
      text-align: center;
      margin-right: 15px;
      background: #ffffff;
      color: #007bff;
      font-weight: 600;
      border: 1px solid #ffffff;
      border-radius: 50%;
      -webkit-transition: border 0.4s, background-color 0.4s;
      transition: border 0.4s, background-color 0.4s;
    }
.styles__stepBox___eMEIM .styles__steps___2RJH1 .styles__futureStep___KfzZz {
      border: 1px solid #6f777c;
      color: #6f777c;
      height: 22px;
      width: 22px;
      text-align: center;
      margin-right: 15px;
      border-radius: 50%;
    }
.styles__stepBox___eMEIM .styles__steps___2RJH1 .styles__stepDescription___1I7mL {
      font-size: 14px;
      color: #6f777c;
    }
.styles__stepBox___eMEIM .styles__steps___2RJH1 .styles__stepDescriptionCurrent___3xwKK {
      font-size: 14px;
      font-weight: 600;
      color: #ffffff;
    }
.styles__stepBox___eMEIM .styles__steps___2RJH1 .styles__completed___-Oitk {
      height: 22px;
      width: 22px;
      text-align: center;
      margin-right: 15px;
      background: #26ec8d;
      border: 1px solid #26ec8d;
      border-radius: 50%;
      -webkit-transition: border 1s, background-color 1s;
      transition: border 1s, background-color 1s;
    }
.styles__stepBox___eMEIM .styles__steps___2RJH1 .styles__completed___-Oitk .styles__checkIcon___nNIHQ {
        fill: #27343b;
      }
@media only screen and (max-width: 800px) {
  .styles__parent___2zI4b {
    display: none;
  }
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___3mZMp {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___3mZMp {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__wrapper___3gdMV {
  background: #29343a;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  color: #ffffff;
  font-family: 'Open Sans', sans-serif;
}
.styles__onboardingParent___5gdeZ {
  background: #29343a;
  height: 100vh;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 100%;
}
.styles__onboardingParent___5gdeZ .styles__content___1Qo-K {
    width: 80%;
    background: #3a4951;
    -webkit-box-shadow: 0 4px 12px rgba(0, 0, 0, .33);
            box-shadow: 0 4px 12px rgba(0, 0, 0, .33);
    border-radius: 6px;
    max-height: 250px;
    min-width: 680px;
    max-width: 750px;
  }
.styles__onboardingParent___5gdeZ .styles__content___1Qo-K .styles__trophyWrapper___3h_SG {
      background: #3a4951;
      display: grid;
      grid-template-columns: 170px 500px;
      grid-template-rows: 60px 120px 60px;
      max-height: 180px;
      min-width: 680px;
      max-width: 750px;
    }
.styles__onboardingParent___5gdeZ .styles__content___1Qo-K .styles__trophyWrapper___3h_SG .styles__trophy___JCmyD {
        grid-row-start: 1;
        grid-row-end: 4;
        position: relative;
        top: -55px;
      }
.styles__onboardingParent___5gdeZ .styles__content___1Qo-K .styles__trophyWrapper___3h_SG .styles__congratulations___3Zu7z {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: flex-start;
        font-size: 44px;
        font-family: 'Open Sans', sans-serif;
        font-weight: bold;
        padding: 0 6px;
        margin-top: 10px;
      }
.styles__onboardingParent___5gdeZ .styles__content___1Qo-K .styles__trophyWrapper___3h_SG .styles__subText___jemYO {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        font-size: 15px;
        padding: 0 6px;
      }
.styles__onboardingParent___5gdeZ .styles__content___1Qo-K .styles__trophyWrapper___3h_SG .styles__finalStep___56Ghw {
        width: 200px;
      }
.styles__onboardingParent___5gdeZ .styles__content___1Qo-K .styles__trophyWrapper___3h_SG .styles__finalStep___56Ghw a {
          text-decoration: none;
          cursor: pointer;
        }
.styles__onboardingParent___5gdeZ .styles__content___1Qo-K .styles__trophyWrapper___3h_SG .styles__finalStep___56Ghw button {
          font-weight: bold;
          font-family: 'Open Sans', sans-serif;
          background-color: #007bff;
          border-color: #007bff
        }
.styles__onboardingParent___5gdeZ .styles__content___1Qo-K .styles__trophyWrapper___3h_SG .styles__finalStep___56Ghw button:hover {
  background-color: #066da5;
  border-color: #066da5;
}
.styles__header___TQ5Dz {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: 50px 0;
  height: 150px;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___1TsTL {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___1TsTL {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__modalClass___2uP98 {
  -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .26);
          box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .26);
  padding: 32px;
  outline: none;
  border-radius: 2px;
  position: relative;
  width: 740px;
  max-height: 80%;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___5qC2P {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___5qC2P {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__modal___22-13 {
  max-width: 450px;
  position: relative;
}
.styles__closeModal___2a9rd {
  position: absolute;
  top: 20px;
  right: 20px;
  cursor: pointer;
}
.styles__children___2dasO {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 56px;
}
.styles__title___3IckL {
  font-size: 28px;
  line-height: 40px;
  font-weight: 400;
  letter-spacing: normal;
  font-weight: 300;
  margin-bottom: 24px;
}
.styles__description___255Im {
  font-size: 16px;
  line-height: 22px;
  font-weight: 400;
  letter-spacing: normal;
  color: #8f9ea8;
  text-align: center;
  margin-bottom: 24px;
}
.styles__dockerIcon___2NwBY {
  fill: #099cec;
  height: auto;
  width: 56px;
  margin-bottom: 24px;
}
.styles__login____mJGO {
  margin-bottom: 24px;
}
.styles__signUp___IrlBI {
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  letter-spacing: normal;
  margin-bottom: 24px;
}
.styles__link___1XGw9 {
  text-decoration: none;
  color: #099cec;
  cursor: pointer;
}
.styles__link___1XGw9:hover {
  color: #1798de;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___3wqaP {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___3wqaP {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__modal___3Vmsz {
  background: #ffffff;
  position: relative;
  height: 100%; /* essential in pinning header and footer, scrolling children */
  max-height: 80%;
  padding: 0;
}
.styles__closeModal___3RNgB {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  cursor: pointer;
}
.styles__closeIcon___2G11t {
  width: 12px;
  height: 12px;
}
.styles__closeIcon___2G11t {
  fill: #8f9ea8;
}
.styles__title___3Kw8C {
  font-weight: 600;
  font-size: 16px;
  line-height: 22px;
}
.styles__header___2OyTC {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 64px;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding: 20px;
  border-bottom: 1px solid #e0e4e7;
}
.styles__children___1Kufp {
  height: calc(100% - 139px);
  overflow-y: auto;
  padding: 24px;
}
.styles__footer___32uXG {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -ms-flex-line-pack: center;
      align-content: center;
  height: 75px;
  border-top: 1px solid #e0e4e7;
  padding: 12px 20px;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___3WPLM {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___3WPLM {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.ReactModal__Overlay {
    opacity: 0;
  }
.ReactModal__Overlay--after-open {
    opacity: 1;
    -webkit-transition: opacity 250ms ease-out;
    transition: opacity 250ms ease-out;
  }
.styles__magicCarpet___3aR2B {
  background-color: #f7f7f8;
  -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .26);
          box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .26);
  padding: 32px;
  overflow-y: auto;
}
@media only screen and (max-width: 600px) {
  .styles__magicCarpet___3aR2B {
    padding: 12px;
  }
}
.styles__header___1YECX {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.styles__titleWrapper___1lbAU {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.styles__close___1UKjm {
  width: 20px;
  height: 20px;
}
.styles__close___1UKjm {
  -ms-flex-item-align: start;
      align-self: flex-start;
  cursor: pointer;
}
/* Must be greater than FullscreenLoading's zindex so close can be pressed */
.styles__aboveLoading___J4oLZ {
  z-index: 1000;
}
.styles__icon___1XVIx {
  margin-right: 12px;
}
.styles__title___Ivsok {
  font-size: 24px;
  line-height: 32px;
  font-weight: 400;
}
.styles__subscription___uw59t {
  margin-bottom: 12px;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___2VB7z {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___2VB7z {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
/* stylelint-disable block-no-empty */
.dmenu {}
/* stylelint-enable */
.styles__container___2Og-W {
  display: inline-block;
  position: relative
}
.styles__container___2Og-W:not(.styles__opened___TQtir) .styles__backdrop___K-tpd {
  display: none !important;
}
.styles__opened___TQtir .styles__backdrop___K-tpd {
  position: fixed;
  background: transparent;
  height: 100vh;
  width: 100vw;
  left: 0;
  top: 0;

  /* Must be smaller than the magic carpet */
  z-index: 797;
}
.styles__menu___1qzbH {
  list-style: none;
  padding: 0;
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  letter-spacing: normal;
  position: absolute;
  z-index: 798;
  background: white;
  border: 1px solid #fbfbfc;
  border-radius: 2px;
  padding: 8px 0;
  -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .26);
          box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .26);
  width: 100%;
  min-width: 96px;
}
.styles__item___3pNSl {
  cursor: pointer;
  line-height: 2.4;
  padding: 0 20px
}
.styles__item___3pNSl:hover {
  background: #f7f7f8;
}
.styles__item___3pNSl.styles__disabled___1xuIl {
  color: #c0c9ce;
  pointer-events: none;
}
.styles__bottomBorder___3xOjs {
  border-bottom: 1px solid #e0e4e7;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___19r2P {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___19r2P {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
@font-face {
  font-family: 'Inconsolata';
  src: url(https://fonts.gstatic.com/s/inconsolata/v18/QldKNThLqRwH-OJ1UHjlKGlZ5qhExfHw.woff2);
}
.styles__parent___2wC68 {
  background: #ffffff;
}
.styles__wrapper___3KqS3 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  color: #ffffff;
  font-family: 'Open Sans', sans-serif;
}
.styles__wrapper___3KqS3 .styles__bottomContent___-w_8Z {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    max-width: 800px;
    -ms-flex-item-align: center;
        align-self: center;
  }
.styles__wrapper___3KqS3 .styles__header___2pvRe {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin-bottom: 56px;
  }
.styles__navigator___1-MD5 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  margin-top: 15vh;
}
.styles__navigator___1-MD5 .styles__previousStep___NJyme button {
      border: 0;
      cursor: pointer;
      -webkit-appearance: none;
      -moz-appearance: none;
      appearance: none;
      margin-right: 20px;
      font-weight: 600;
      color: #007bff;
      background-color: #ffffff;
      border-color: #ffffff
    }
.styles__navigator___1-MD5 .styles__previousStep___NJyme button:hover {
  background-color: #ffffff;
  border-color: #ffffff;
}
.styles__navigator___1-MD5 .styles__nextStepButton___2F8jO button {
      background-color: #007bff;
      border-color: #007bff
    }
.styles__navigator___1-MD5 .styles__nextStepButton___2F8jO button:hover {
  background-color: #066da5;
  border-color: #066da5;
}
.styles__navigator___1-MD5.styles__recoveryCodeOnly___1QH09 {
  -ms-flex-item-align: end;
      align-self: flex-end;
}
.styles__twoFactorParent___3e8_8 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  max-height: 1000px;
  width: 100%;
}
.styles__twoFactorParent___3e8_8 .styles__content___1Z53_ {
    color: #27343b;
    max-width: 800px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
.styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__userType___3b1lV {
      text-align: left;
      margin-bottom: 10px;
    }
.styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__instructionHeader___1KD9p {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      -webkit-box-align: start;
          -ms-flex-align: start;
              align-items: flex-start;
      max-width: 700px
    }
.styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__instructionHeader___1KD9p.styles__longerSubTitle___ma_eO {
  margin-bottom: 25px;
}
.styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__title___3Ouuy {
      font-size: 22px;
      font-weight: 600;
      margin: 30px 0 9px;
      max-width: 700px;
    }
.styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__subTitle___2qQWW {
      font-weight: 400;
      font-size: 14px;
      line-height: 20px;
      max-width: 470px;
    }
.styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__subTitle___2qQWW .styles__subTitleLink___1U-M7 {
        color: #007bff;
        text-decoration: none
      }
.styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__subTitle___2qQWW .styles__subTitleLink___1U-M7:hover {
  color: #445d6e;
}
.styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__contentBody___gAXls {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      background: #ffffff;
      -webkit-box-shadow: 2px 3px 10px rgba(0, 0, 0, .1);
              box-shadow: 2px 3px 10px rgba(0, 0, 0, .1);
      border-radius: 6px;
      width: 700px;
      padding: 25px 0;
    }
.styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__contentBody___gAXls .styles__contextSubText___30GDO {
        font-size: 36px;
        font-family: 'Inconsolata', sans-serif;
        text-align: center
      }
.styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__contentBody___gAXls .styles__contextSubText___30GDO.styles__textCode___2ctel {
  padding: 80px 0;
}
.styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__contentBody___gAXls .styles__saveOptions___I9rXN {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
      }
.styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__contentBody___gAXls .styles__saveOptions___I9rXN .styles__optionsButton___1AFoR {
          border: 1px solid #007bff;
          color: #007bff;
        }
.styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__contentBody___gAXls .styles__saveOptions___I9rXN .styles__optionsButton___1AFoR button {
            width: 85px;
          }
.styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__contentBody___gAXls .styles__qrLayout___1UeEA {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
        -webkit-box-align: center;
            -ms-flex-align: center;
                align-items: center;
        -webkit-box-pack: center;
            -ms-flex-pack: center;
                justify-content: center;
      }
.styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__contentBody___gAXls textarea {
        min-width: 600px;
        border: none;
        overflow: auto;
        outline: none;
        -webkit-box-shadow: none;
        box-shadow: none;
        resize: none;
        text-align: center;
      }
.styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__helpLink___sJ5As {
      margin: 30px 0;
    }
.styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__formField___1brbO {
      border-bottom: 1px solid #b7bbbe;
      border-top: 0;
      border-left: 0;
      border-right: 0;
      width: 460px;
      height: 30px;
      background-color: #fafafb;
      font-size: 14px;
      color: #27343b;
      padding: 7.5px;
      outline: none;
    }
.styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__subHeader___2IcVu {
      font-size: 18px;
      margin-top: 30px;
    }
.styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__text___2Nmw5 {
      width: 460px;
      margin: 12px 0;
    }
.styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__sixDigitCodeError___1mmFc {
      padding: 7.5px;
      font-size: 12px;
      color: #e12b0c;
    }
.styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__wrapper___3KqS3 {
      display: grid;
      max-width: 375px;
    }
.styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__wrapper___3KqS3 .styles__img___1di_j {
        height: 140px;
        width: 230px;
        grid-column: 2;
        grid-column-start: 1;
        grid-column-end: 3;
        grid-row-start: 1;
        grid-row-end: 3;
        justify-self: center;
        margin-bottom: 20px;
      }
.styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__wrapper___3KqS3 .styles__text___2Nmw5 {
        font-weight: 600;
        grid-column-start: 2;
        padding: 0 10px 3px;
      }
.styles__twoFactorParent___3e8_8.styles__recoveryCodeOnly___1QH09 {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.styles__subTitleLink___1U-M7 {
  color: #007bff;
  text-decoration: none;
  cursor: pointer
}
.styles__subTitleLink___1U-M7:hover {
  color: #066da5;
}
.styles__link___2vXOH {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 100%;
  color: #6bc3f3;
  font-weight: 600;
  font-size: 14px;
  text-decoration: none;
  margin: 20px 0;
}
.styles__cursor___3Mfos {
  cursor: pointer;
}
.styles__tab___1JgAX {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  margin: 30px 0 30px 2px;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
@media (max-width: 600px) {
    .styles__twoFactorParent___3e8_8 .styles__content___1Z53_ {
      max-width: 400px;
    }

      .styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__title___3Ouuy {
        max-width: 400px;
      }

      .styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__subTitle___2qQWW {
        max-width: 400px;
      }

      .styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__subsequentSteps___32BQI {
        max-width: 400px;
        padding: 0 30px;
      }
          .styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__subsequentSteps___32BQI .styles__instruction___1IPtw .styles__command___684Yi {
            max-width: 250px;
          }
}
.styles__typeCodePlan___1MgFI {
  font-family: 'Open Sans', sans-serif;
  font-size: 14px;
  margin-right: 19px;
  padding-bottom: 10px;
  border: none;
  outline: none;
  cursor: pointer;
  color: #27343b
}
.styles__typeCodePlan___1MgFI:hover {
  border: none;
  outline: none;
}
.styles__typeCodePlan___1MgFI.styles__typeSelected___2FDP0 {
  border-bottom: 2px solid #6bc3f3;
  padding-bottom: 8px;
  font-weight: 600;
}
.styles__text___2Nmw5 {
  font-size: 14px;
}
.styles__warningBox___1uMcq {
  margin-top: 30px;
  width: 700px;
  height: 115px;
  background: #fafafb;
}
.styles__warningBox___1uMcq .styles__yellowBar___2TkPt {
    position: absolute;
    width: 4px;
    height: 115px;
    background: #f7d933;
    margin-right: 10px;
  }
.styles__warningBox___1uMcq .styles__warningMessage___kuau3 {
    padding: 25px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
.styles__warningBox___1uMcq .styles__warningMessage___kuau3 .styles__warningText___3rO4k {
      margin-left: 20px;
      width: 450px;
    }
.styles__subTitleAccessToken___aCmG6 {
  margin: 12px 0 20px;
  max-width: 470px;
}
.styles__subTitleAccessToken___aCmG6 button {
    margin: 0 !important;
  }
.styles__warnUser___1Rh4B {
  max-width: 700px;
  margin: 0 24px;
  border-top: 8px solid #e12b0c
}
.styles__warnUser___1Rh4B.styles__yellowWarning___1SBJq {
  border-top: 8px solid #f7d933;
}
.styles__warnUser___1Rh4B .styles__header___2pvRe {
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 10px;
}
.styles__warnUser___1Rh4B .styles__text___2Nmw5 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    margin: 40px 0;
}
.styles__warnUser___1Rh4B .styles__text___2Nmw5.styles__recoveryCode___2azIC {
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
}
.styles__warnUser___1Rh4B .styles__text___2Nmw5 > :first-child {
      margin-right: 20px;
}
.styles__warnUser___1Rh4B .styles__exitButtons___1cdmM {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
}
@media (max-width: 1200px) {
  .styles__navigator___1-MD5 {
    margin-top: 16px;
  }
    .styles__twoFactorParent___3e8_8 .styles__stepNavigator___ZGdlt {
      display: none;
    }
}
@media (max-height: 600px) {
  .styles__navigator___1-MD5 {
    margin-top: 16px;
  }
}
@media (max-width: 745px) {
    .styles__twoFactorParent___3e8_8 .styles__content___1Z53_ {
      width: 100%;
    }

      .styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__instructionHeader___1KD9p {
        width: 100%;
      }

      .styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__title___3Ouuy {
        width: 80%;
      }

      .styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__subTitle___2qQWW {
        width: 100%;
      }

      .styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__text___2Nmw5 {
        max-width: 100%;
      }

      .styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__formField___1brbO {
        max-width: 100%;
      }

      .styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__contentBody___gAXls {
        width: 100%;
      }

        .styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__contentBody___gAXls textarea {
          min-width: 70%;
          max-width: 90%;
          overflow: hidden;
        }

        .styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__contentBody___gAXls .styles__contextSubText___30GDO.styles__textCode___2ctel {
    padding: 0;
    width: 80%;
    word-wrap: break-word;
  }

        .styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__contentBody___gAXls .styles__saveOptions___I9rXN {
          -webkit-box-align: center;
              -ms-flex-align: center;
                  align-items: center;
          -webkit-box-orient: vertical;
          -webkit-box-direction: normal;
              -ms-flex-direction: column;
                  flex-direction: column;
        }

          .styles__twoFactorParent___3e8_8 .styles__content___1Z53_ .styles__contentBody___gAXls .styles__saveOptions___I9rXN button {
            width: 60px;
          }

  .styles__warningBox___1uMcq {
    margin: 30px 0;
    width: 100%;
    height: auto;
  }

    .styles__warningBox___1uMcq .styles__yellowBar___2TkPt {
      display: none;
    }

    .styles__warningBox___1uMcq .styles__warningMessage___kuau3 {
      padding: 15px;
    }

      .styles__warningBox___1uMcq .styles__warningMessage___kuau3 .styles__warningText___3rO4k {
        margin-left: 20px;
        width: 100%;
      }
}
.styles__maxWidth___2CRSp {
  width: 100%;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___1v_Ed {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___1v_Ed {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__parent___lhD5U {
  background: #ffffff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.styles__wrapper___35Mhz {
  width: 700px;
}
.styles__header___2KTHb {
  font-size: 22px;
  font-family: 'Open Sans', sans-serif;
  color: #27343b;
  margin-bottom: 12px;
  font-weight: 600;
}
.styles__text___2z7u5 {
  color: #27343b;
  width: 470px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.styles__subtext___QUo5Q {
  width: 335px;
}
.styles__images___P6OvX {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin: 48px 0;
}
.styles__images___P6OvX .styles__image___3U13D {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    margin-right: 36px;
  }
.styles__imageBackground___2PkCh {
  background: #fafafb;
  border: 0.5px solid #e9ebee;
  width: 335px;
  height: 230px;
  margin-bottom: 30px;
  margin-left: auto;
  margin-right: auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.styles__imagePlaceholder___1WAJ0 {
  width: 80%;
  display: block;
  height: auto;
}
.styles__links___131up {
  color: #007bff;
  text-decoration: none
}
.styles__links___131up:hover {
  color: #445d6e;
}
.styles__linebreak___2zwLL {
  margin-top: 12px;
}
@media (max-width: 740px) {
  .styles__images___P6OvX {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    margin: 48px 0 0 0;
  }

  .styles__subtext___QUo5Q {
    margin: 20px 0;
    width: calc(100% - 20px);
  }

  .styles__text___2z7u5 {
    width: calc(100% - 20px);
  }

  .styles__imageBackground___2PkCh {
    margin-left: 0;
    margin-bottom: 0;
    width: calc(100% - 32px);
    height: calc(100% - 16px);
  }

  .styles__wrapper___35Mhz {
    width: 100%;
  }
}
.styles__maxWidth___pO9jL {
  max-width: 100%;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___Teg1n {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___Teg1n {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__parent___1tFD9 {
  margin-top: 30px;
}
.styles__title___21pkG {
  font-size: 14px;
  color: #27343b;
  text-transform: uppercase;
}
.styles__stepBox___2SVbm {
  min-height: 200px;
  margin-top: 20px;
}
.styles__stepBox___2SVbm .styles__steps___179UM {
    display: grid;
    grid-template-columns: 40px 250px;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    margin-bottom: 15px;
  }
.styles__stepBox___2SVbm .styles__steps___179UM .styles__currentStep___1nb2n {
      height: 22px;
      width: 22px;
      text-align: center;
      margin-right: 15px;
      background: #007bff;
      color: #ffffff;
      font-weight: 600;
      border: 1px solid #ffffff;
      border-radius: 50%;
      -webkit-transition: border 0.4s, background-color 0.4s;
      transition: border 0.4s, background-color 0.4s;
    }
.styles__stepBox___2SVbm .styles__steps___179UM .styles__futureStep___3LXdA {
      border: 1px solid #b7bbbe;
      color: #b7bbbe;
      height: 22px;
      width: 22px;
      text-align: center;
      margin-right: 15px;
      border-radius: 50%;
    }
.styles__stepBox___2SVbm .styles__steps___179UM .styles__stepDescription___1H-Va {
      font-size: 14px;
      color: #b7bbbe;
    }
.styles__stepBox___2SVbm .styles__steps___179UM .styles__stepDescriptionCurrent___XPm_E {
      font-size: 14px;
      font-weight: 600;
      color: #007bff;
    }
.styles__stepBox___2SVbm .styles__steps___179UM .styles__completed___35VS_ {
      height: 18px;
      width: 18px;
      margin: 0 2px;
      background: #11a661;
      border: 1px solid #11a661;
      border-radius: 50%;
      -webkit-transition: border 1s, background-color 1s;
      transition: border 1s, background-color 1s;
    }
.styles__stepBox___2SVbm .styles__steps___179UM .styles__completed___35VS_ svg {
        display: block;
        margin: 4px;
      }
@media only screen and (max-width: 800px) {
  .styles__parent___1tFD9 {
    display: none;
  }
}
.styles__italicize___a8SDQ {
  font-style: italic;
}

/* A modified version of "rc-tooltip/assets/bootstrap_white.css";
* that has been altered to use the `dTooltip` prefix instead of
* the default `rc-tooltip` so that it does not conflict with the
* rc-tooltip-* global styles from the `rc-slider` component. The
* `dTooltip` prefix has been set in the <Tooltip> component render
* method as `prefixCls`
*/
 {

  @-webkit-keyframes bootstrap_white__dTooltipZoomIn___58YUP {
    0% {
      opacity: 0;
      -webkit-transform-origin: 50% 50%;
      transform-origin: 50% 50%;
      -webkit-transform: scale(0, 0);
      transform: scale(0, 0);
    }
    100% {
      opacity: 1;
      -webkit-transform-origin: 50% 50%;
      transform-origin: 50% 50%;
      -webkit-transform: scale(1, 1);
      transform: scale(1, 1);
    }
  }

  @-webkit-keyframes bootstrap_white__dTooltipZoomOut___WHmh3 {
    0% {
      opacity: 1;
      -webkit-transform-origin: 50% 50%;
      transform-origin: 50% 50%;
      -webkit-transform: scale(1, 1);
      transform: scale(1, 1);
    }
    100% {
      opacity: 0;
      -webkit-transform-origin: 50% 50%;
      transform-origin: 50% 50%;
      -webkit-transform: scale(0, 0);
      transform: scale(0, 0);
    }
  }
}
.dTooltip {
    position: absolute;
    z-index: 1070;
    display: block;
    visibility: visible;
    line-height: 1.5;
    font-size: 12px;
    background-color: rgba(0, 0, 0, .05);
    padding: 1px;
    opacity: 0.9;
  }
.dTooltip-hidden {
    display: none;
  }
.dTooltip-inner {
    padding: 8px 10px;
    color: #333333;
    text-align: left;
    text-decoration: none;
    background-color: #ffffff;
    border-radius: 3px;
    min-height: 34px;
    border: 1px solid #b1b1b1;
  }
.dTooltip-arrow, .dTooltip-arrow-inner {
    position: absolute;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
  }
.dTooltip-placement-top .dTooltip-arrow, .dTooltip-placement-topLeft .dTooltip-arrow, .dTooltip-placement-topRight .dTooltip-arrow {
    bottom: -5px;
    margin-left: -6px;
    border-width: 6px 6px 0;
    border-top-color: #b1b1b1;
  }
.dTooltip-placement-top .dTooltip-arrow-inner, .dTooltip-placement-topLeft .dTooltip-arrow-inner, .dTooltip-placement-topRight .dTooltip-arrow-inner {
    bottom: 1px;
    margin-left: -6px;
    border-width: 6px 6px 0;
    border-top-color: #ffffff;
  }
.dTooltip-placement-top .dTooltip-arrow {
    left: 50%;
  }
.dTooltip-placement-topLeft .dTooltip-arrow {
    left: 15%;
  }
.dTooltip-placement-topRight .dTooltip-arrow {
    right: 15%;
  }
.dTooltip-placement-right .dTooltip-arrow, .dTooltip-placement-rightTop .dTooltip-arrow, .dTooltip-placement-rightBottom .dTooltip-arrow {
    left: -5px;
    margin-top: -6px;
    border-width: 6px 6px 6px 0;
    border-right-color: #b1b1b1;
  }
.dTooltip-placement-right .dTooltip-arrow-inner, .dTooltip-placement-rightTop .dTooltip-arrow-inner, .dTooltip-placement-rightBottom .dTooltip-arrow-inner {
    left: 1px;
    margin-top: -6px;
    border-width: 6px 6px 6px 0;
    border-right-color: #ffffff;
  }
.dTooltip-placement-right .dTooltip-arrow {
    top: 50%;
  }
.dTooltip-placement-rightTop .dTooltip-arrow {
    top: 15%;
    margin-top: 0;
  }
.dTooltip-placement-rightBottom .dTooltip-arrow {
    bottom: 15%;
  }
.dTooltip-placement-left .dTooltip-arrow, .dTooltip-placement-leftTop .dTooltip-arrow, .dTooltip-placement-leftBottom .dTooltip-arrow {
    right: -5px;
    margin-top: -6px;
    border-width: 6px 0 6px 6px;
    border-left-color: #b1b1b1;
  }
.dTooltip-placement-left .dTooltip-arrow-inner, .dTooltip-placement-leftTop .dTooltip-arrow-inner, .dTooltip-placement-leftBottom .dTooltip-arrow-inner {
    right: 1px;
    margin-top: -6px;
    border-width: 6px 0 6px 6px;
    border-left-color: #ffffff;
  }
.dTooltip-placement-left .dTooltip-arrow {
    top: 50%;
  }
.dTooltip-placement-leftTop .dTooltip-arrow {
    top: 15%;
    margin-top: 0;
  }
.dTooltip-placement-leftBottom .dTooltip-arrow {
    bottom: 15%;
  }
.dTooltip-placement-bottom .dTooltip-arrow, .dTooltip-placement-bottomLeft .dTooltip-arrow, .dTooltip-placement-bottomRight .dTooltip-arrow {
    top: -5px;
    margin-left: -6px;
    border-width: 0 6px 6px;
    border-bottom-color: #b1b1b1;
  }
.dTooltip-placement-bottom .dTooltip-arrow-inner, .dTooltip-placement-bottomLeft .dTooltip-arrow-inner, .dTooltip-placement-bottomRight .dTooltip-arrow-inner {
    top: 1px;
    margin-left: -6px;
    border-width: 0 6px 6px;
    border-bottom-color: #ffffff;
  }
.dTooltip-placement-bottom .dTooltip-arrow {
    left: 50%;
  }
.dTooltip-placement-bottomLeft .dTooltip-arrow {
    left: 15%;
  }
.dTooltip-placement-bottomRight .dTooltip-arrow {
    right: 15%;
  }
.dTooltip.dTooltip-zoom-enter, .dTooltip.dTooltip-zoom-leave {
    display: block;
  }
.dTooltip-zoom-enter, .dTooltip-zoom-appear {
    opacity: 0;
    -webkit-animation-duration: 0.3s;
    animation-duration: 0.3s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-timing-function: cubic-bezier(0.18, 0.89, 0.32, 1.28);
    animation-timing-function: cubic-bezier(0.18, 0.89, 0.32, 1.28);
    -webkit-animation-play-state: paused;
    animation-play-state: paused;
  }
.dTooltip-zoom-leave {
    -webkit-animation-duration: 0.3s;
    animation-duration: 0.3s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-timing-function: cubic-bezier(0.6, -0.3, 0.74, 0.05);
    animation-timing-function: cubic-bezier(0.6, -0.3, 0.74, 0.05);
    -webkit-animation-play-state: paused;
    animation-play-state: paused;
  }
.dTooltip-zoom-enter.dTooltip-zoom-enter-active, .dTooltip-zoom-appear.dTooltip-zoom-appear-active {
    -webkit-animation-name: dTooltipZoomIn;
    animation-name: dTooltipZoomIn;
    -webkit-animation-play-state: running;
    animation-play-state: running;
  }
.dTooltip-zoom-leave.dTooltip-zoom-leave-active {
    -webkit-animation-name: dTooltipZoomOut;
    animation-name: dTooltipZoomOut;
    -webkit-animation-play-state: running;
    animation-play-state: running;
  }
@keyframes bootstrap_white__dTooltipZoomIn___58YUP {
    0% {
      opacity: 0;
      -webkit-transform-origin: 50% 50%;
      transform-origin: 50% 50%;
      -webkit-transform: scale(0, 0);
      transform: scale(0, 0);
    }
    100% {
      opacity: 1;
      -webkit-transform-origin: 50% 50%;
      transform-origin: 50% 50%;
      -webkit-transform: scale(1, 1);
      transform: scale(1, 1);
    }
  }
@keyframes bootstrap_white__dTooltipZoomOut___WHmh3 {
    0% {
      opacity: 1;
      -webkit-transform-origin: 50% 50%;
      transform-origin: 50% 50%;
      -webkit-transform: scale(1, 1);
      transform: scale(1, 1);
    }
    100% {
      opacity: 0;
      -webkit-transform-origin: 50% 50%;
      transform-origin: 50% 50%;
      -webkit-transform: scale(0, 0);
      transform: scale(0, 0);
    }
  }

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___1K_NY {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___1K_NY {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
/* Overrides specific to Docker Cloud */
.dTooltip-inner {
    border: 0 none;
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, .2);
            box-shadow: 0 1px 4px rgba(0, 0, 0, .2);
    -webkit-transform: none;
            transform: none;
    padding: 12px;
    max-width: 480px;
  }
.dTooltip-arrow {
  width: 11px;
  height: 11px;
}
.dTooltip-arrow {
  background: #ffffff;
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
  z-index: 999;
}
.dTooltip-inner * {
    word-wrap: break-word;
  }
/* placement of arrows */
.dTooltip-placement-top .dTooltip-arrow, .dTooltip-placement-topLeft .dTooltip-arrow, .dTooltip-placement-topRight .dTooltip-arrow {
    border-left: 0 none;
    border-top: 0 none;
    background: #ffffff;
    border-right: 1px solid #dddddd;
    border-bottom: 1px solid #dddddd;
  }
.dTooltip-placement-bottom .dTooltip-arrow, .dTooltip-placement-bottomLeft .dTooltip-arrow, .dTooltip-placement-bottomRight .dTooltip-arrow {
    border-right: 0 none;
    border-bottom: 0 none;
    border-left: 1px solid #dddddd;
    border-top: 1px solid #dddddd;
  }
.dTooltip-placement-left .dTooltip-arrow {
    border-left: 0 none;
    border-bottom: 0 none;
    background: #ffffff;
    border-right: 1px solid #dddddd;
    border-top: 1px solid #dddddd;
  }
.dTooltip-placement-right .dTooltip-arrow {
    border-right: 0 none;
    border-top: 0 none;
    border-left: 1px solid #dddddd;
    border-bottom: 1px solid #dddddd;
  }
/* dark theme styling */
.dTooltip.darkTheme .dTooltip-inner {
      background: #445d6e;
      color: #ffffff;
    }
.dTooltip.darkTheme .dTooltip-arrow {
      background: #445d6e;
    }

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___1tTcV {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___1tTcV {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
/* Topnav */
.styles__topnav___2_B0m {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 64px;
  background-color: #099cec;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media only screen and (max-width: 600px) {
  .styles__topnav___2_B0m.styles__hasSearch___2E-A6 {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    height: 100px;
  }
  .styles__topnav___2_B0m .styles__search___3JFtL {
      width: 300px;
      margin: 12px 0;
  }
  .styles__topnav___2_B0m .styles__avatar___2KYUf {
      display: none !important;
  }
  .styles__topnav___2_B0m .styles__username___oMG_s {
      max-width: 120px;
      padding-top: 0;
  }
  .styles__topnav___2_B0m .styles__topNavContent___puDuG {
      -webkit-box-pack: justify;
          -ms-flex-pack: justify;
              justify-content: space-between;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      padding: 0 8px;
  }
}
.styles__topnav___2_B0m.styles__publishFlow___2rJs7 {
  min-width: 1295px;
}
.styles__topnav___2_B0m > * {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
}
.styles__topnav___2_B0m button {
    cursor: pointer;
}
.styles__topnav___2_B0m .styles__dockerFlat___2woUp {
    fill: #ffffff;
}
.styles__topnav___2_B0m .styles__buttonLink___3PPAv {
    font-weight: 600;
    font-size: 14px;
    margin: 0 12px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    opacity: 0.9;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    color: #ffffff;
    text-decoration: none;
    cursor: pointer;
    text-align: center;
}
.styles__topnav___2_B0m .styles__buttonLink___3PPAv:hover,
    .styles__topnav___2_B0m .styles__buttonLink___3PPAv:active,
    .styles__topnav___2_B0m .styles__buttonLink___3PPAv.styles__isActive___CkvNX {
  opacity: 1;
}
.styles__topnav___2_B0m .styles__logoWrapper___3MxB2 {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-right: 16px;
    text-align: center;
    text-decoration: none;
}
.styles__topnav___2_B0m .styles__loggedIn___3VPqF {
    margin-left: 12px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    cursor: pointer;
}
@media only screen and (max-width: 1200px) {
  .styles__topnav___2_B0m .styles__loggedIn___3VPqF {
      margin-left: 0 !important;
  }
  .styles__topnav___2_B0m .styles__buttonLink___3PPAv {
      margin: 0 8px;
  }
}
.styles__topnav___2_B0m .styles__avatar___2KYUf {
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.styles__topnav___2_B0m .styles__accountDropdown___30-JJ {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
}
.styles__topnav___2_B0m .styles__accountDropdown___30-JJ ul {
      margin-top: 4px !important;
      width: 190px;
      right: 0;
    }
.styles__topnav___2_B0m .styles__accountDropdown___30-JJ ul li {
        line-height: 3;
        overflow: hidden;
        text-overflow: ellipsis;
      }
.styles__publisherCenterTopnav___1Pi98 {
  margin: 0 auto;
  padding: 0 16px;
  -webkit-box-flex: 1;
      -ms-flex: 1 auto;
          flex: 1 auto;
}
.styles__transparent___2KRUv {
  padding-top: 20px;
  background-color: transparent;
  position: relative;
  z-index: 1;
}
.styles__expandable___1RB6Z {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-right: 4px;
  opacity: 0.7
}
.styles__expandable___1RB6Z:hover {
  opacity: 1;
}
.styles__expandable___1RB6Z > svg {
    fill: white;
}
/* Using width values from Docker Cloud */
.styles__username___oMG_s {
  font-size: 14px;
  color: #ffffff;
  background-color: transparent;
  border: none;
  outline: none;
  overflow: hidden;
  font-weight: 600;
  min-width: 50px;
  max-width: 140px;
  padding-top: 4px;
  text-overflow: ellipsis;
}
.styles__ssoLogout___3S3jd {
  color: #e12b0c;
}
/* Search & Autocomplete Results */
.styles__search___3JFtL {
  padding: 2px 0;
  min-width: 150px;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.styles__input___2Zhiv {
  max-width: 364px;
  color: #ffffff;
  background-color: rgba(255, 255, 255, .2)
}
.styles__input___2Zhiv:focus {
  color: #445d6e;
  background-color: rgba(255, 255, 255, 1);
}
.styles__darkIcon___3BHT1 {
  fill: #445d6e;
}
.styles__lightIcon___6cfzd {
  fill: #ffffff;
}
.styles__menu___2LJhJ {
  border-radius: 2px;
  -webkit-box-shadow: 0 2px 12px rgba(0, 0, 0, .1);
          box-shadow: 0 2px 12px rgba(0, 0, 0, .1);
  background: #ffffff;
  position: absolute;
  overflow: auto;
  z-index: 999;
  max-width: 364px;
}
.styles__gethelpDropdown___XXoQg .styles__ul___2SYz1 {
    width: 500px;
  }
.styles__loading___gvsD1 {
  position: absolute;
  border-right-color: #445d6e;
  border-bottom-color: #445d6e;
  border-left-color: #445d6e;
}
.styles__match___pN513 {
  color: #099cec;
  font-weight: 600;
}
.styles__result___Owm8E {
  padding: 8px 20px;
  cursor: pointer;
}
.styles__highlightedResult___2Kixi {
  padding: 8px 20px;
  cursor: pointer;
  background: #e0e4e7;
}
.styles__menuTitle___15JcK {
  font-size: 13px;
  line-height: 18px;
  font-weight: 400;
  letter-spacing: normal;
  padding: 8px;
  cursor: default;
  color: #8f9ea8;
}
.styles__resultName___2t8yu {
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  letter-spacing: normal;
}
.styles__resultCategories___3cgte {
  font-size: 13px;
  line-height: 18px;
  font-weight: 400;
  letter-spacing: normal;
  color: #8f9ea8;
}
.styles__onboardingMagicCarpet___1dSDn {
  background-color: #29343a;
  -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .26);
          box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .26);
  padding: 32px;
  overflow-y: auto;
}
.styles__twoFactorMagicCarpet___vbFib {
  background-color: #ffffff;
  padding: 32px;
  overflow-y: auto;
  width: 98% !important;
  height: 98vh !important;
  outline: none;
}
.styles__buyNow___3IjrN {
  width: 180px;
  height: 36px;
  border: 2px solid #ffffff;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  border-radius: 6px
}
.styles__buyNow___3IjrN:hover {
  background-color: #ffffff !important;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___2VEtj {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___2VEtj {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__footerWrapper___1Rljn {
  font-size: 13px;
  line-height: 18px;
  font-weight: 400;
  letter-spacing: normal;
  background-color: #022144;
  color: #ffffff;
}
.styles__contentWrapper___1L_-i {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.styles__section___XuuIR {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  padding: 40px 0;
}
@media only screen and (max-width: 1200px) {
  .styles__section___XuuIR {
    padding-left: 12px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}
.styles__linksMap___3rFFr {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  width: 80%;
}
@media only screen and (max-width: 600px) {
  .styles__linksMap___3rFFr {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    width: 100%;
  }
}
.styles__column___1cl5g {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  min-width: 150px;
}
.styles__column___1cl5g a:not(:last-child) {
    margin-bottom: 12px;
  }
@media only screen and (min-width: 601px) {
  .styles__column___1cl5g:not(:last-child) {
    margin-right: 80px;
  }
}
@media only screen and (max-width: 600px) {
  .styles__column___1cl5g:not(:last-child) {
    margin-bottom: 24px;
  }
}
@media only screen and (max-width: 1200px) {
  .styles__column___1cl5g:first-child {
    display: none;
  }
  .styles__column___1cl5g {
    min-width: 100px;
  }
}
@media only screen and (max-width: 960px) {
  .styles__column___1cl5g:first-child {
    display: none;
  }
  .styles__column___1cl5g {
    min-width: 50px;
  }
}
.styles__column___1cl5g a,
.styles__links___2sWbh a {
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  letter-spacing: normal;
  text-decoration: none;
  opacity: 0.6;
  cursor: pointer
}
.styles__column___1cl5g a:hover, .styles__links___2sWbh a:hover {
  opacity: 1;
}
.styles__links___2sWbh a:not(:last-child) {
  margin-right: 32px;
}
.styles__copyright___11bRD {
  font-weight: 600;
}
.styles__copyright___11bRD a {
    text-decoration: none;
  }
.styles__listTitle___R9nW5 {
  font-size: 16px;
  line-height: 22px;
  font-weight: 400;
  letter-spacing: normal;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-weight: 800;
  margin-bottom: 12px
}
.styles__listTitle___R9nW5.styles__social___3RJzg {
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.styles__subTitle___1dG4B {
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  letter-spacing: normal;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-weight: 800;
  margin: 16px 0;
}
.styles__socialLinks___2Dlcm {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  width: 250px;
}
@media only screen and (max-width: 1200px) {
  .styles__socialLinks___2Dlcm {
    margin-top: 20px;
  }
}
.styles__icon___32Su8 {
  fill: white;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___DS2oh {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___DS2oh {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__footerWrapper___1V-kz {
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
  letter-spacing: normal;
  margin-top: 20px;
  color: #8f9ea8;
}
.styles__contentWrapper___3tvh8 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding: 24px 0 40px;
}
.styles__contentWrapper___3tvh8 a {
    text-decoration: none;
    margin-left: 4px
  }
.styles__contentWrapper___3tvh8 a:hover {
  color: #445d6e;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___1T76Y {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___1T76Y {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__wrapper___EX-Nj {
  background: #022044;
  text-align: center;
  color: #ffffff;
  font-weight: 600;
  min-height: 38px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between
}
.styles__wrapper___EX-Nj.styles__secondary___2o0LW {
  background: #254356;
}
.styles__text___3a6LX {
  font-size: 13px;
  margin: 10px 40px;
  -webkit-box-flex: 2;
      -ms-flex-positive: 2;
          flex-grow: 2;
}
.styles__close___XHEiQ {
  margin-right: 20px;
  font-size: 16px;
  cursor: pointer;
}
.styles__icon___1Zq5X {
  margin-right: 8px;
}
.styles__bannerLinkText___3DcEK {
  margin-left: 4px;
}
@media only screen and (max-width: 960px) {
  .styles__wrapper___EX-Nj {
    min-height: 112px;
    z-index: 100;
  }
  .styles__text___3a6LX {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
  .styles__icon___1Zq5X {
    margin: 0;
  }
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___2GCvg {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___2GCvg {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__consolidationHelper___3q7p5 {
  position: fixed;
  bottom: 30px;
  right: 30px;
  border-radius: 3px;
  z-index: 100;
  border: 1px solid #dddddd;
  padding: 5px 10px;
  width: 330px;
  background: #ffffff;
  -webkit-box-shadow: 1px 1px 10px #333333;
          box-shadow: 1px 1px 10px #333333;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___2sXAU {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___2sXAU {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__wrapper___2rXVf {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}
.styles__img___yzf6i {
  margin: 32px 0 24px;
}
.styles__text___3mS6Z {
  font-size: 16px;
  line-height: 22px;
  font-weight: 400;
  letter-spacing: normal;
  text-align: center
}
.styles__text___3mS6Z a {
  text-decoration: none;
  cursor: pointer;
  color: #099cec;
}
.styles__text___3mS6Z > div {
  padding-bottom: 12px;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___qNm9n {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___qNm9n {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__wrapper___1nIm- {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  color: #70787d;
  font-family: 'Open Sans', sans-serif;
}
.styles__header___k4zSD {
  background: #ffffff;
  height: 150px;
  width: 100%;
  word-wrap: break-word;
}
.styles__title___FCP46 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 50px;
  font-size: 36px;
  color: #000000;
}
.styles__subTitle___4Bbin {
  color: #697a89;
  font-size: 18px;
  margin-top: 6px;
}
.styles__planTable___3wMGD {
  margin: 40px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  width: 100%;
  font-family: 'Open Sans', sans-serif;
}
.styles__row___1nBru {
  min-width: 800px;
  max-width: 900px;
  margin-bottom: 6px;
}
.styles__planCard___kM1Dw {
  padding: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  font-size: 14px;
}
.styles__planCard___kM1Dw div {
    color: #27343b;
  }
.styles__planCard___kM1Dw span {
    color: #70787d;
    font-weight: 300;
  }
.styles__planCard___kM1Dw .styles__planType___2x0SG {
    font-weight: 600;
    width: 20%;
  }
.styles__planCard___kM1Dw .styles__planPrice___DFIKz {
    font-weight: 500;
    width: 25%;
  }
.styles__planCard___kM1Dw .styles__planRepos___1Rb04 {
    font-weight: 600;
    width: 35%;
  }
.styles__planCard___kM1Dw .styles__planBuilds___2x3AE {
    font-weight: 600;
    width: 25%;
  }
.styles__tabs___26sE7 {
  background: #ffffff;
  height: 50px;
  -webkit-box-shadow: 0 1px 0 #c2c2c2;
          box-shadow: 0 1px 0 #c2c2c2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  width: 100%;
  font-family: 'Open Sans', sans-serif;
}
.styles__tabRow___1P8hO {
  min-width: 800px;
  max-width: 900px;
}
.styles__tab___25UGA {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  margin-left: 2px;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
.styles__userPlan___2JBMB {
  font-family: 'Open Sans', sans-serif;
  margin-right: 30px;
  padding-bottom: 15px;
  border: none;
  outline: none;
  cursor: pointer;
  color: #56666d;
  background-color: rgba(0, 0, 0, 0);
  background-color: transparent
}
.styles__userPlan___2JBMB:hover {
  border: none;
  outline: none;
}
.styles__userPlan___2JBMB.styles__userView___1b2UD {
  color: #099cec;
  border-bottom: 2px solid #099cec;
  padding-bottom: 13px;
}
.styles__ctaButton___3tzVP {
  width: 200px;
  -webkit-box-flex: 2;
      -ms-flex-positive: 2;
          flex-grow: 2;
  text-align: right;
}
.styles__orgPlan___1E-JP {
  font-family: 'Open Sans', sans-serif;
  padding-bottom: 15px;
  border: none;
  outline: none;
  color: #56666d;
  cursor: pointer;
  background-color: rgba(0, 0, 0, 0);
  background-color: transparent
}
.styles__orgPlan___1E-JP:hover {
  border: none;
  outline: none;
}
.styles__orgPlan___1E-JP.styles__orgView___1Z2qF {
  color: #099cec;
  border-bottom: 2px solid #099cec;
  background-color: rgba(0, 0, 0, 0);
  padding-bottom: 13px;
}
@media only screen and (max-width: 960px) {
  .styles__title___FCP46 {
    font-size: 30px;
  }
  .styles__subTitle___4Bbin {
    font-size: 18px;
    text-align: center;
  }
  .styles__tabs___26sE7 {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
  }
  .styles__orgPlan___1E-JP {
    margin-right: 40px;
  }
  .styles__tabRow___1P8hO {
    font-size: 12px;
    min-width: 300px;
    max-width: 700px;
    margin-right: 15px;
  }
  .styles__row___1nBru {
    min-width: 300px;
    max-width: 700px;
    margin-bottom: 6px;
    width: 100%;
  }
  .styles__planTable___3wMGD {
    font-size: 10px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    padding: 10px;
    margin: 10px 0;
  }
  .styles__tab___25UGA {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    margin-left: 2px;
    -webkit-box-pack: justify;
        -ms-flex-pack: justify;
            justify-content: space-between;
    -webkit-box-align: end;
        -ms-flex-align: end;
            align-items: flex-end;
  }
    .styles__tab___25UGA span:last-child {
      margin-right: 5px;
    }
}
@media only screen and (max-width: 600px) {
  .styles__planCard___kM1Dw {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
    .styles__planCard___kM1Dw .styles__planType___2x0SG {
      width: 100%;
    }
    .styles__planCard___kM1Dw .styles__planPrice___DFIKz {
      margin-top: 10px;
      width: 100%;
    }
    .styles__planCard___kM1Dw .styles__planRepos___1Rb04 {
      width: 100%;
    }
    .styles__planCard___kM1Dw .styles__planBuilds___2x3AE {
      width: 100%;
    }
  .styles__ctaButton___3tzVP {
    width: 150px;
  }
  .styles__userPlan___2JBMB {
    margin-left: 10px;
  }
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___3zJlU {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___3zJlU {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__main___ReGd7 {
  position: fixed;
  width: 100vw;
  height: 100vh;
  z-index: 999;
  overflow: hidden;
  left: 0;
  top: 0;
}
.styles__center___2YI_N {
  position: absolute !important;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
}
@media only screen and (min-width: 601px) {
  .styles__showTopnav___3qrNl {
    top: 64px;
  }

    .styles__showTopnav___3qrNl .styles__center___2YI_N {
      margin-top: -64px;
    }
}
@media only screen and (max-width: 600px) {
  .styles__showTopnav___3qrNl {
    top: 100px;
  }

    .styles__showTopnav___3qrNl .styles__center___2YI_N {
      margin-top: -100px;
    }
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___3lzLL {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___3lzLL {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__page___24Abd {
  width: 24px;
  height: 24px;
}
.styles__page___24Abd {
  text-decoration: none;
  color: inherit;
}
.styles__page___24Abd:visited {
  color: inherit;
}
.styles__page___24Abd {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 2px;
  color: #8f9ea8;
  background-color: #e0e4e7;
  font-size: 12px;
  margin-right: 4px;
  cursor: pointer;
}
.styles__page___24Abd:last-child {
  margin-right: 0;
}
.styles__page___24Abd:first-child:not(.styles__chevron___13BO3) {
  margin-left: 56px;
}
.styles__page___24Abd:last-child:not(.styles__chevron___13BO3) {
  margin-right: 56px;
}
.styles__chevron___13BO3 {
  fill: #8f9ea8;
}
.styles__firstPage___2aaoC > svg {
  -webkit-transform: rotate(-180deg);
          transform: rotate(-180deg);
}
.styles__nextPage___MEbmC > svg {
  -webkit-transform: rotate(-90deg);
          transform: rotate(-90deg);
}
.styles__previousPage___1dunb > svg {
  -webkit-transform: rotate(90deg);
          transform: rotate(90deg);
}
.styles__currentPage___1MBl0 {
  background-color: #099cec;
  color: #ffffff;
}
.styles__paginationCentered___3JgJW {
  list-style: none;
  padding: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___1mM3_ {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___1mM3_ {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__subnavWrapper___17yeU {
  background-color: #ffffff;
  color: #254356;
  border-bottom: 1px solid #e0e4e7;
  z-index: 2;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
}
.styles__subnavWrapper___17yeU h3 {
    font-size: 16px;
    font-weight: 600;
    margin: 0;
  }
.styles__nav___2Wc4j {
  fill: #8f9ea8;
  -webkit-transform: rotate(-90deg);
          transform: rotate(-90deg);
}
.styles__previousView___3T1J2 {
  color: #8f9ea8;
  cursor: pointer
}
.styles__previousView___3T1J2:hover {
  color: #254356;
}
.styles__breadcrumb___xUDUi {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
}
.styles__subnav___3eBHp {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  height: 64px;
  max-width: 1280px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  margin: 0 auto;
  padding: 0 32px;
}
@media only screen and (max-width: 600px) {
  .styles__subnav___3eBHp {
    padding: 0 12px;
  }
}
.styles__namespaceSelect___2f0kF {
  height: 36px;
  width: 200px;
}
.styles__text___36XCp {
  margin-right: 12px;
}
.styles__namespaceSelectWrapper___2tUdw {
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  letter-spacing: normal;
  color: #8f9ea8;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

/* SearchInput styles */

/* media queries */

/* lib/constants/sizes */

/* layout */

/* spacing */

/* misc */

/* body font sizes */

/* heading font sizes */

/* font family */

/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */

/* Purples - lightest to darkest */

/* Blues - lightest to darkest */

/* Greens - lightest to darkest */

/* Reds - lightest to darkest */

/* Yellows - lightest to darkest */

/* Grays - lightest to darkest */

/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */

/* -base background colors */

/* lib/constants/variants */

/* cohesion font colors */

/* State Colors */

/* -- These use colors not found in the styleguide -- */

/* - end -- */

/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/

/* button */

/* select */

/* input */

/* stylelint-disable value-list-comma-newline-after */

/* box-shadow for store cards */

/* component: tab */

/* Nautilus colors */

/* Publish flow */

/* Public Profile */

/* v2 */

/* https://goo.gl/Mus6xj */

/* Font sizes */

/* columns */

/* Three equal columns */

/* Rows */

/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/

@-webkit-keyframes styles__fadein___Dn3Ve {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes styles__fadein___Dn3Ve {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */

/* Causes text that overflows in an element to be truncated with an ellipsis. */

/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/

.styles__search___2b26x {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border: 1px solid #e0e4e7;
  background-color: #ffffff;
}

.styles__search___2b26x.styles__disabled___uZpyQ {
  cursor: not-allowed;
}

.styles__iconWrapper___3jGqi,
.styles__clearIconWrapper___30uOG {
  width: 18px;
  height: 18px;
}

.styles__iconWrapper___3jGqi {
  margin-left: 10px;
}

.styles__iconWrapper___3jGqi .styles__icon___1PIgZ {
    fill: #8f9ea8;
    width: 18px;
    height: 18px;
  }

.styles__clearIconWrapper___30uOG {
  margin-top: 2px;
  margin-right: 6px;
}

.styles__clearIconWrapper___30uOG .styles__icon___1PIgZ {
    fill: #8f9ea8;
    width: 8px;
    height: 8px;
  }

.styles__iconWrapper___3jGqi.styles__disabled___uZpyQ .styles__icon___1PIgZ,
.styles__clearIconWrapper___30uOG.styles__disabled___uZpyQ .styles__icon___1PIgZ {
  fill: #c0c9ce;
}

.styles__clearIconWrapper___30uOG:hover {
  cursor: pointer;
}

.styles__clearIconWrapper___30uOG:hover .styles__icon___1PIgZ {
    fill: #445d6e;
  }

.styles__clearIconWrapper___30uOG:hover.styles__disabled___uZpyQ {
  cursor: inherit;
}

.styles__clearIconWrapper___30uOG:hover.styles__disabled___uZpyQ .styles__icon___1PIgZ {
    fill: #c0c9ce;
  }

.styles__clearIconWrapper___30uOG:focus.styles__disabled___uZpyQ {
  outline: none;
}

.styles__hideClear___Df5xd {
  visibility: hidden;
}

.styles__field___140_5 {
  width: 100%;
  height: 100%;
  margin: 0 8px 0 6px;
  border: none;
  background-color: transparent;
  color: #445d6e;

  /* must explicitly set for FF otherwise it assumes 152px which is too wide */
  min-width: 100px;
}

.styles__field___140_5:focus {
  outline: none;
}

.styles__field___140_5.styles__disabled___uZpyQ {
  cursor: not-allowed;
  color: #c0c9ce;
}

/* A modified version of "rc-tooltip/assets/bootstrap_white.css";
* that has been altered to use the `dTooltip` prefix instead of
* the default `rc-tooltip` so that it does not conflict with the
* rc-tooltip-* global styles from the `rc-slider` component. The
* `dTooltip` prefix has been set in the <Tooltip> component render
* method as `prefixCls`
*/
 {

  @-webkit-keyframes bootstrap_white__dTooltipZoomIn___25rT4 {
    0% {
      opacity: 0;
      -webkit-transform-origin: 50% 50%;
      transform-origin: 50% 50%;
      -webkit-transform: scale(0, 0);
      transform: scale(0, 0);
    }
    100% {
      opacity: 1;
      -webkit-transform-origin: 50% 50%;
      transform-origin: 50% 50%;
      -webkit-transform: scale(1, 1);
      transform: scale(1, 1);
    }
  }

  @-webkit-keyframes bootstrap_white__dTooltipZoomOut___1HE8y {
    0% {
      opacity: 1;
      -webkit-transform-origin: 50% 50%;
      transform-origin: 50% 50%;
      -webkit-transform: scale(1, 1);
      transform: scale(1, 1);
    }
    100% {
      opacity: 0;
      -webkit-transform-origin: 50% 50%;
      transform-origin: 50% 50%;
      -webkit-transform: scale(0, 0);
      transform: scale(0, 0);
    }
  }
}
.dTooltip {
    position: absolute;
    z-index: 1070;
    display: block;
    visibility: visible;
    line-height: 1.5;
    font-size: 12px;
    background-color: rgba(0, 0, 0, .05);
    padding: 1px;
    opacity: 0.9;
  }
.dTooltip-hidden {
    display: none;
  }
.dTooltip-inner {
    padding: 8px 10px;
    color: #333333;
    text-align: left;
    text-decoration: none;
    background-color: #ffffff;
    border-radius: 3px;
    min-height: 34px;
    border: 1px solid #b1b1b1;
  }
.dTooltip-arrow, .dTooltip-arrow-inner {
    position: absolute;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
  }
.dTooltip-placement-top .dTooltip-arrow, .dTooltip-placement-topLeft .dTooltip-arrow, .dTooltip-placement-topRight .dTooltip-arrow {
    bottom: -5px;
    margin-left: -6px;
    border-width: 6px 6px 0;
    border-top-color: #b1b1b1;
  }
.dTooltip-placement-top .dTooltip-arrow-inner, .dTooltip-placement-topLeft .dTooltip-arrow-inner, .dTooltip-placement-topRight .dTooltip-arrow-inner {
    bottom: 1px;
    margin-left: -6px;
    border-width: 6px 6px 0;
    border-top-color: #ffffff;
  }
.dTooltip-placement-top .dTooltip-arrow {
    left: 50%;
  }
.dTooltip-placement-topLeft .dTooltip-arrow {
    left: 15%;
  }
.dTooltip-placement-topRight .dTooltip-arrow {
    right: 15%;
  }
.dTooltip-placement-right .dTooltip-arrow, .dTooltip-placement-rightTop .dTooltip-arrow, .dTooltip-placement-rightBottom .dTooltip-arrow {
    left: -5px;
    margin-top: -6px;
    border-width: 6px 6px 6px 0;
    border-right-color: #b1b1b1;
  }
.dTooltip-placement-right .dTooltip-arrow-inner, .dTooltip-placement-rightTop .dTooltip-arrow-inner, .dTooltip-placement-rightBottom .dTooltip-arrow-inner {
    left: 1px;
    margin-top: -6px;
    border-width: 6px 6px 6px 0;
    border-right-color: #ffffff;
  }
.dTooltip-placement-right .dTooltip-arrow {
    top: 50%;
  }
.dTooltip-placement-rightTop .dTooltip-arrow {
    top: 15%;
    margin-top: 0;
  }
.dTooltip-placement-rightBottom .dTooltip-arrow {
    bottom: 15%;
  }
.dTooltip-placement-left .dTooltip-arrow, .dTooltip-placement-leftTop .dTooltip-arrow, .dTooltip-placement-leftBottom .dTooltip-arrow {
    right: -5px;
    margin-top: -6px;
    border-width: 6px 0 6px 6px;
    border-left-color: #b1b1b1;
  }
.dTooltip-placement-left .dTooltip-arrow-inner, .dTooltip-placement-leftTop .dTooltip-arrow-inner, .dTooltip-placement-leftBottom .dTooltip-arrow-inner {
    right: 1px;
    margin-top: -6px;
    border-width: 6px 0 6px 6px;
    border-left-color: #ffffff;
  }
.dTooltip-placement-left .dTooltip-arrow {
    top: 50%;
  }
.dTooltip-placement-leftTop .dTooltip-arrow {
    top: 15%;
    margin-top: 0;
  }
.dTooltip-placement-leftBottom .dTooltip-arrow {
    bottom: 15%;
  }
.dTooltip-placement-bottom .dTooltip-arrow, .dTooltip-placement-bottomLeft .dTooltip-arrow, .dTooltip-placement-bottomRight .dTooltip-arrow {
    top: -5px;
    margin-left: -6px;
    border-width: 0 6px 6px;
    border-bottom-color: #b1b1b1;
  }
.dTooltip-placement-bottom .dTooltip-arrow-inner, .dTooltip-placement-bottomLeft .dTooltip-arrow-inner, .dTooltip-placement-bottomRight .dTooltip-arrow-inner {
    top: 1px;
    margin-left: -6px;
    border-width: 0 6px 6px;
    border-bottom-color: #ffffff;
  }
.dTooltip-placement-bottom .dTooltip-arrow {
    left: 50%;
  }
.dTooltip-placement-bottomLeft .dTooltip-arrow {
    left: 15%;
  }
.dTooltip-placement-bottomRight .dTooltip-arrow {
    right: 15%;
  }
.dTooltip.dTooltip-zoom-enter, .dTooltip.dTooltip-zoom-leave {
    display: block;
  }
.dTooltip-zoom-enter, .dTooltip-zoom-appear {
    opacity: 0;
    -webkit-animation-duration: 0.3s;
    animation-duration: 0.3s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-timing-function: cubic-bezier(0.18, 0.89, 0.32, 1.28);
    animation-timing-function: cubic-bezier(0.18, 0.89, 0.32, 1.28);
    -webkit-animation-play-state: paused;
    animation-play-state: paused;
  }
.dTooltip-zoom-leave {
    -webkit-animation-duration: 0.3s;
    animation-duration: 0.3s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-timing-function: cubic-bezier(0.6, -0.3, 0.74, 0.05);
    animation-timing-function: cubic-bezier(0.6, -0.3, 0.74, 0.05);
    -webkit-animation-play-state: paused;
    animation-play-state: paused;
  }
.dTooltip-zoom-enter.dTooltip-zoom-enter-active, .dTooltip-zoom-appear.dTooltip-zoom-appear-active {
    -webkit-animation-name: dTooltipZoomIn;
    animation-name: dTooltipZoomIn;
    -webkit-animation-play-state: running;
    animation-play-state: running;
  }
.dTooltip-zoom-leave.dTooltip-zoom-leave-active {
    -webkit-animation-name: dTooltipZoomOut;
    animation-name: dTooltipZoomOut;
    -webkit-animation-play-state: running;
    animation-play-state: running;
  }
@keyframes bootstrap_white__dTooltipZoomIn___25rT4 {
    0% {
      opacity: 0;
      -webkit-transform-origin: 50% 50%;
      transform-origin: 50% 50%;
      -webkit-transform: scale(0, 0);
      transform: scale(0, 0);
    }
    100% {
      opacity: 1;
      -webkit-transform-origin: 50% 50%;
      transform-origin: 50% 50%;
      -webkit-transform: scale(1, 1);
      transform: scale(1, 1);
    }
  }
@keyframes bootstrap_white__dTooltipZoomOut___1HE8y {
    0% {
      opacity: 1;
      -webkit-transform-origin: 50% 50%;
      transform-origin: 50% 50%;
      -webkit-transform: scale(1, 1);
      transform: scale(1, 1);
    }
    100% {
      opacity: 0;
      -webkit-transform-origin: 50% 50%;
      transform-origin: 50% 50%;
      -webkit-transform: scale(0, 0);
      transform: scale(0, 0);
    }
  }

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___2Rh3S {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___2Rh3S {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
/* Overrides specific to Docker Cloud */
.dTooltip-inner {
    border: 0 none;
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, .2);
            box-shadow: 0 1px 4px rgba(0, 0, 0, .2);
    -webkit-transform: none;
            transform: none;
    padding: 12px;
  }
.dTooltip-arrow {
  width: 11px;
  height: 11px;
}
.dTooltip-arrow {
  background: #ffffff;
    -webkit-transform: rotate(45deg);
            transform: rotate(45deg);
  z-index: 999;
}
.dTooltip-inner * {
    word-wrap: break-word;
  }
/* color */
.dTooltip {
    opacity: 1;
  }
/* size */
.dTooltip.small .dTooltip-inner {
      min-height: 0;
      padding: 4px 8px;
    }
/* placement of arrows */
.dTooltip-placement-top .dTooltip-arrow, .dTooltip-placement-topLeft .dTooltip-arrow, .dTooltip-placement-topRight .dTooltip-arrow {
    border-left: 0 none;
    border-top: 0 none;
    background: #ffffff;
    border-right: 1px solid #dddddd;
    border-bottom: 1px solid #dddddd;
  }
.dTooltip-placement-bottom .dTooltip-arrow, .dTooltip-placement-bottomLeft .dTooltip-arrow, .dTooltip-placement-bottomRight .dTooltip-arrow {
    border-right: 0 none;
    border-bottom: 0 none;
    border-left: 1px solid #dddddd;
    border-top: 1px solid #dddddd;
  }
.dTooltip-placement-left .dTooltip-arrow {
    border-left: 0 none;
    border-bottom: 0 none;
    background: #ffffff;
    border-right: 1px solid #dddddd;
    border-top: 1px solid #dddddd;
  }
.dTooltip-placement-right .dTooltip-arrow {
    border-right: 0 none;
    border-top: 0 none;
    border-left: 1px solid #dddddd;
    border-bottom: 1px solid #dddddd;
  }
/* dark theme styling */
.dTooltip.darkTheme .dTooltip-inner {
      background: #27343b;
      color: #ffffff;
    }
.dTooltip.darkTheme .dTooltip-arrow {
      background: #27343b;
    }

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___2FBXh {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___2FBXh {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__pullCount___2MIKx {
  font-size: 14px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #445d6e;
  fill: #445d6e;
  font-weight: bold;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.styles__pullText___24t9w {
  font-weight: normal;
  margin-right: 8px;
}
.styles__noPulls___1n1kn {
  opacity: 0.8;
}
.styles__icon___2Jvs1 {
  width: 16px;
  height: 16px;
}
.styles__icon___2Jvs1 {
  margin-right: 8px;
}
.styles__tiny___-Pb2p {
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
  letter-spacing: normal;
  font-weight: 600;
}
.styles__tiny___-Pb2p .styles__icon___2Jvs1 {
  width: 12px;
  height: 12px;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___2kYuC {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___2kYuC {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__tooltip___2XwC5 {
  max-width: 265px;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___K7qtP {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___K7qtP {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__starCount___PjVah {
  font-size: 14px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  color: #445d6e;
  fill: #445d6e;
  font-weight: bold;
}
.styles__toggleStar___2Qlmf {
  cursor: pointer;
  border-radius: 2px
}
.styles__toggleStar___2Qlmf:hover {
  cursor: pointer;
}
.styles__spinner___2PHNs {
  background-color: #ffffff;
}
.styles__starText___1dnpI {
  font-weight: normal;
  margin-right: 8px;
}
.styles__starNum___2YkOL {
  background: #ffffff;
  padding: 0 12px;
}
.styles__tooltip___3-j7I {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 0 8px;
}
.styles__tooltip___3-j7I .styles__iconInTooltip___2e1tB {
  width: 20px;
  height: 20px;
}
.styles__icon___4_It0 {
  width: 20px;
  height: 20px;
}
.styles__icon___4_It0 {
  margin: 8px;
}
.styles__tiny___3oFmP {
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
  letter-spacing: normal;
  font-weight: 600;
}
.styles__tiny___3oFmP .styles__icon___4_It0 {
  width: 12px;
  height: 12px;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___1rMBK {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___1rMBK {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__repoRow___1vo4h {
  margin-top: 16px;
  text-decoration: none;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  width: 100%;
  margin-right: 16px;
  overflow: hidden;
}
.styles__repoRow___1vo4h svg {
    margin-right: 8px;
    fill: #8f9ea8;
  }
.styles__repoRow___1vo4h:hover {
  -webkit-box-shadow: 0 1px 6px 0 #c0c0c0;
          box-shadow: 0 1px 6px 0 #c0c0c0;
}
.styles__repoRow___1vo4h .styles__reponame___18yGM {
    font-weight: 700;
}
.styles__repoCard___2bqxx {
  width: 100%;
  padding: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.styles__repoCard___2bqxx .styles__name___2W8lT {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
  }
.styles__repoCard___2bqxx .styles__updatedAt___-D5cR {
    font-size: 12px;
    line-height: 16px;
    color: #27343b;
    color: #70787d;
  }
.styles__repoCard___2bqxx .styles__right___3IqHY {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
.styles__repoCard___2bqxx .styles__right___3IqHY div:not(:last-child) {
      width: 90px;
    }
.styles__repoCard___2bqxx .styles__right___3IqHY svg {
      width: 14px;
      height: 14px;
      margin-right: 8px;
    }
.styles__repoCard___2bqxx .styles__right___3IqHY span {
      font-size: 12px;
      line-height: 16px;
      color: #27343b;
      font-weight: 600;
      color: #70787d;
    }
.styles__repoCard___2bqxx .styles__right___3IqHY .styles__starCount___1A7RN {
      border: 0;
      background: #ffffff;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
    }
.styles__repoCard___2bqxx .styles__right___3IqHY .styles__starCount___1A7RN span {
        padding: 0;
      }
.styles__repoCard___2bqxx .styles__right___3IqHY .styles__repoPrivateStatus___34eGE {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
    }
@media only screen and (max-width: 600px) {
    .styles__right___3IqHY .styles__starCount___1A7RN {
      width: 0;
      visibility: hidden;
    }
    .styles__right___3IqHY .styles__pullCount___2TpFZ {
      width: 0;
      visibility: hidden;
    }
}
@media only screen and (max-width: 480px) {
  .styles__right___3IqHY {
    width: 0;
    visibility: hidden;
  }
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___2m5aA {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___2m5aA {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__content___blBhs {
  margin-bottom: 32px;
}
.styles__title___fLey3 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.styles__title___fLey3 .styles__filter___22eC4 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
.styles__title___fLey3 .styles__filter___22eC4 > div {
      margin-right: 12px;
    }
.styles__title___fLey3 .styles__filter___22eC4 .styles__searchInput___1eZfm {
      width: 238px;
    }
.styles__title___fLey3 button {
    margin: 0;
    padding: 0 12px;
    border-radius: 4px;
  }
.styles__title___fLey3 button a {
      text-decoration: none;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: center;
          -ms-flex-pack: center;
              justify-content: center;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
    }
.styles__title___fLey3 button a svg {
        top: 0 !important;
      }
.styles__loading___5vaec {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  padding-top: 32px;
}
.styles__repoInfoCard___1krNF {
  padding: 20px;
  margin-top: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.styles__repoInfoCard___1krNF img {
    height: 50px;
    margin-right: 32px;
  }
.styles__divider___HpslD {
  margin: 64px 0 48px 0;
}
@media only screen and (max-width: 480px) {
  .styles__title___fLey3 {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }
    .styles__title___fLey3 .styles__filter___22eC4 {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
    }
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___3pm4w {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___3pm4w {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__content___1gzuP {
  padding-top: 32px;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___2RKWI {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___2RKWI {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__header___3qVFG {
  background-color: #ffffff;
  padding-top: 48px;
  padding-bottom: 40px;
  border-bottom: 1px solid #e0e4e7;
}
.styles__title___3efgb {
  font-size: 28px;
  line-height: 40px;
  font-weight: 400;
  letter-spacing: normal;
  font-weight: bold;
}
.styles__wrapperContainer___2m0xd {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.styles__main___1zg_M {
  padding-top: 24px;
  padding-bottom: 40px;
}
.styles__actions___2H53Z::before,
  .styles__actions___2H53Z::after {
  content: ' ';
  display: table;
}
.styles__actions___2H53Z::after {
  clear: both;
}
.styles__actions___2H53Z {
  margin-bottom: 12px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
@media only screen and (max-width: 480px) {
  .styles__title___3efgb {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
  }

    .styles__title___3efgb .styles__filter___2jDWG {
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-direction: column;
              flex-direction: column;
    }
}
.styles__orgLink___3eqIf {
  text-decoration: none;
}
.styles__orgCard___3WQS3 {
  width: 100%;
  margin-bottom: 12px;
  cursor: pointer;
  text-decoration: none;
  padding: 20px 28px;
}
.styles__listItem___2_hZ5 {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap
}
.styles__listItem___2_hZ5 > * {
  lost-column-cycle: 4;
}
.styles__listItem___2_hZ5 > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(29.1375% - 8.5px);
  max-width: calc(29.1375% - 8.5px);
  width: calc(29.1375% - 8.5px);
}
.styles__listItem___2_hZ5 > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__listItem___2_hZ5 > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__listItem___2_hZ5 > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__listItem___2_hZ5 > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(29.1375% - 8.5px);
  max-width: calc(29.1375% - 8.5px);
  width: calc(29.1375% - 8.5px);
}
.styles__listItem___2_hZ5 > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__listItem___2_hZ5 > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__listItem___2_hZ5 > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__listItem___2_hZ5 > *:nth-child(3) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(29.1375% - 8.5px);
  max-width: calc(29.1375% - 8.5px);
  width: calc(29.1375% - 8.5px);
}
.styles__listItem___2_hZ5 > *:nth-child(3):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__listItem___2_hZ5 > *:nth-child(3):last-child {
  margin-right: 0;
}
.styles__listItem___2_hZ5 > *:nth-child(3):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__listItem___2_hZ5 > *:nth-child(4) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(12.4875% - 10.5px);
  max-width: calc(12.4875% - 10.5px);
  width: calc(12.4875% - 10.5px);
}
.styles__listItem___2_hZ5 > *:nth-child(4):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__listItem___2_hZ5 > *:nth-child(4):last-child {
  margin-right: 0;
}
.styles__listItem___2_hZ5 > *:nth-child(4):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__listItem___2_hZ5 {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.styles__listItem___2_hZ5 > div {
  -ms-flex-item-align: center;
      align-self: center;
}
.styles__listItem___2_hZ5 .styles__name___1w6b_ {
    font-size: 14px;
    line-height: 20px;
    color: #27343b;
    font-weight: 600;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    line-height: 18px;
}
.styles__listItem___2_hZ5 .styles__name___1w6b_ > div {
  display: inline-block;
  vertical-align: middle;
  margin-right: 12px;
}
.styles__listItem___2_hZ5 .styles__noDescription___q0qrR {
    color: #c0c9ce;
    font-style: italic;
}
.styles__listHeader___3r_gG {

  font-size: 14px;

  line-height: 20px;

  color: #27343b;

  font-weight: 600;

  padding-left: 24px;

  text-transform: uppercase;

  color: #f7f8f9;

  white-space: nowrap;
  padding: 0 28px;
}
.styles__listHeader___3r_gG div {
    font-weight: 600;
    margin-top: 40px;
    margin-bottom: 12px;
    color: #8f9ea8;
  }
.styles__centerText___13Edi {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 30vh;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___3hR1h {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___3hR1h {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__orgRow___3zPTK {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap
}
.styles__orgRow___3zPTK > * {
  lost-column-cycle: 3;
}
.styles__orgRow___3zPTK > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(6.24375% - 11.25px);
  max-width: calc(6.24375% - 11.25px);
  width: calc(6.24375% - 11.25px);
}
.styles__orgRow___3zPTK > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__orgRow___3zPTK > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__orgRow___3zPTK > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__orgRow___3zPTK > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(42.4575% - 6.9px);
  max-width: calc(42.4575% - 6.9px);
  width: calc(42.4575% - 6.9px);
}
.styles__orgRow___3zPTK > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__orgRow___3zPTK > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__orgRow___3zPTK > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__orgRow___3zPTK > *:nth-child(3) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(42.4575% - 6.9px);
  max-width: calc(42.4575% - 6.9px);
  width: calc(42.4575% - 6.9px);
}
.styles__orgRow___3zPTK > *:nth-child(3):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__orgRow___3zPTK > *:nth-child(3):last-child {
  margin-right: 0;
}
.styles__orgRow___3zPTK > *:nth-child(3):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__orgRow___3zPTK {
  margin-bottom: 16px;
}
.styles__orgRow___3zPTK svg {
    margin-top: 12px;
}
.styles__orgFooter___1hGR- {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-left: 40px;
}
.styles__label___3aKo_ {
  background: #254356;
  color: #ffffff;
  padding: 4px;
  border-radius: 2px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: inline-block;
  margin-right: 4px;
}
.styles__label___3aKo_ svg {
    fill: #ffffff;
  }
.styles__orgHeader___DnkyO {
  /* @mixin shyHeader; */
  font-size: 14px;
  line-height: 20px;
  color: #27343b;
  margin-top: 20px;
}
.styles__orgFormContent___196SJ {
  margin-top: 24px;
  height: 340px;
  overflow: scroll;
}
.styles__CTA___QA16J {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.styles__idpInfo___guuRX {
  font-size: 13px;
}

  .styles__idpInfo___guuRX .styles__idpSettingsLink___1kUnO {
    color: #099cec;
    cursor: pointer;
    text-decoration: none;
  }

  .styles__idpInfo___guuRX .styles__idpSettingsLink___1kUnO:hover {
    text-decoration: underline;
  }

  .styles__idpInfo___guuRX .styles__idpStatus___1eO18 {
    color: #5a6774;
  }

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___1PLoD {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___1PLoD {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__header___3oh7G {
  background-color: #ffffff;
}
.styles__tabsSection___2Gs_c {
  background-color: #ffffff;
  border-bottom: solid 1px #e0e4e7;
  margin-top: -20px;
  margin-bottom: 32px;
}
.styles__tabsSection___2Gs_c .styles__tabs___2WMQc {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
.styles__tabsSection___2Gs_c .styles__tab___1cDnv {
    min-width: 100px;
    padding: 20px;
    text-align: center;
    text-decoration: none;
    font-size: 14px;
    color: #445d6e
  }
.styles__tabsSection___2Gs_c .styles__tab___1cDnv:hover {
  color: #099cec;
}
.styles__tabsSection___2Gs_c .styles__selected___3RxPo {
    font-weight: 600;
    color: #099cec;
    border-bottom: 2px solid #099cec;
  }

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___1MZtn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___1MZtn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__content___3_2zQ {
  min-height: 400px;
  padding: 12px;
}
.styles__sectionTitle___2ZKem {
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  letter-spacing: normal;
  font-weight: 600;
  color: #354a5b;
  margin: 0 0 4px;
}
.styles__teamSelect___RHQzl {
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
  letter-spacing: normal;
  color: #354a5b;
}
.styles__input___1OZIu {
  width: 100%;
}
.styles__select___3YWcz {
  margin-bottom: 28px;
}
.styles__error___30hgz {
  color: #e12b0c;
  margin-bottom: 12px;
}
.styles__ctas___1cxEr {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___102vy {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___102vy {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__leaveButtons___mF52Y {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  margin-top: 16px;
}
.styles__errorMessage___3VREW {
  margin-top: 32px;
  color: #ef4a53;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___2JjYF {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___2JjYF {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__loading___3xkbM {
  padding: 48px 0;
}
.styles__notFound___2j_0t {
  padding: 40px 24px;
}
.styles__icon___1YLK7 {
  fill: #8f9ea8;
}
.styles__iconTooltipWrapper___3ry_V:hover .styles__icon___1YLK7.styles__active___2UYOa {
  cursor: pointer;
  fill: #099cec;
}
.styles__title___1-4wy {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.styles__title___1-4wy button {
    margin: 0;
    padding: 0 12px;
    border-radius: 4px;
  }
.styles__title___1-4wy .styles__searchInput___LC7Gn {
    width: 238px;
    height: 36px;
  }
.styles__card___2lDLt {
  margin-bottom: 48px;
}
.styles__card___2lDLt .styles__items___2-9WI {
    margin-bottom: 32px;
  }
.styles__card___2lDLt .styles__items___2-9WI .styles__item___3iCny {
      width: 100%;
      text-decoration: none;
      padding: 0 20px;
    }
.styles__listItem___tLArg {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap
}
.styles__listItem___tLArg > * {
  lost-column-cycle: 4;
}
.styles__listItem___tLArg > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(24.975% - 9px);
  max-width: calc(24.975% - 9px);
  width: calc(24.975% - 9px);
}
.styles__listItem___tLArg > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__listItem___tLArg > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__listItem___tLArg > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__listItem___tLArg > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(24.975% - 9px);
  max-width: calc(24.975% - 9px);
  width: calc(24.975% - 9px);
}
.styles__listItem___tLArg > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__listItem___tLArg > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__listItem___tLArg > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__listItem___tLArg > *:nth-child(3) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(24.975% - 9px);
  max-width: calc(24.975% - 9px);
  width: calc(24.975% - 9px);
}
.styles__listItem___tLArg > *:nth-child(3):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__listItem___tLArg > *:nth-child(3):last-child {
  margin-right: 0;
}
.styles__listItem___tLArg > *:nth-child(3):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__listItem___tLArg > *:nth-child(4) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(20.8125% - 9.5px);
  max-width: calc(20.8125% - 9.5px);
  width: calc(20.8125% - 9.5px);
}
.styles__listItem___tLArg > *:nth-child(4):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__listItem___tLArg > *:nth-child(4):last-child {
  margin-right: 0;
}
.styles__listItem___tLArg > *:nth-child(4):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__listItem___tLArg {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  height: 64px;
  border-bottom: 1px solid #e7e8e9;
}
.styles__listItem___tLArg .styles__action___1KP79 {
    height: 20px;
    margin: 0;
    padding: 0;
    line-height: 20px;
    min-height: 20px;
}
.styles__listItem___tLArg .styles__action___1KP79 svg {
      top: 0;
      width: 20px !important;
      height: 20px !important;
    }
.styles__listItem___tLArg .styles__name___1ejQ9 {
    font-size: 14px;
    line-height: 20px;
    color: #27343b;
    font-weight: 600;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.styles__listItem___tLArg .styles__name___1ejQ9 > div {
  display: inline-block;
  vertical-align: middle;
  margin-right: 12px;
}
.styles__listItem___tLArg .styles__teams___3G-re {
    color: #099cec;
}
.styles__listHeader___25Oa7 {

  font-size: 14px;

  line-height: 20px;

  color: #27343b;

  font-weight: 600;

  padding-left: 24px;

  text-transform: uppercase;

  color: #f7f8f9;

  white-space: nowrap;
  padding: 0 28px;
}
.styles__listHeader___25Oa7 div {
    font-weight: 600;
    margin-top: 40px;
    margin-bottom: 12px;
    color: #8f9ea8;
  }
.styles__modal___2EwEm {
  background: #ffffff;
  max-width: 750px;
  margin: 20px;
}
.styles__modal___2EwEm .styles__title___1-4wy {
    margin: 0 0 24px;
    font-size: 18px;
    line-height: 24px;
    font-weight: 600;
  }
.styles__modal___2EwEm .styles__buttons___2YU_9 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    margin-top: 16px;
  }

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___2XNuM {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___2XNuM {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__modal___3AF2j {
  background: #ffffff;
  max-width: 750px;
  margin: 20px;
}
.styles__modal___3AF2j .styles__title___1WJn6 {
    margin: 12px 0 24px;
    font-size: 18px;
    line-height: 24px;
  }
.styles__modal___3AF2j .styles__errorMessage___a0lEe {
    margin: 20px 0;
    color: #e12b0c;
  }
.styles__modal___3AF2j .styles__buttons___GWtjj {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    margin-top: 16px;
  }
.styles__ctaButton___jzq_x {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.styles__icon___3E8bd {
  fill: #8f9ea8;
}
.styles__iconTooltipWrapper___2S7B0:hover .styles__icon___3E8bd.styles__active___3iXZx {
  cursor: pointer;
  fill: #099cec;
}
.styles__card___1Zj9R {
  margin-bottom: 48px;
}
.styles__card___1Zj9R .styles__loading___3ahGi {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding: 48px 0;
  }
.styles__card___1Zj9R .styles__items___2o-0g {
    margin-bottom: 32px;
  }
.styles__card___1Zj9R .styles__item___3PKeb {
    display: flex;
    flex-flow: row wrap;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap
  }
.styles__card___1Zj9R .styles__item___3PKeb > * {
  lost-column-cycle: 3;
}
.styles__card___1Zj9R .styles__item___3PKeb > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(91.575% - 1px);
  max-width: calc(91.575% - 1px);
  width: calc(91.575% - 1px);
}
.styles__card___1Zj9R .styles__item___3PKeb > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__card___1Zj9R .styles__item___3PKeb > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__card___1Zj9R .styles__item___3PKeb > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__card___1Zj9R .styles__item___3PKeb > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(4.1625% - 11.5px);
  max-width: calc(4.1625% - 11.5px);
  width: calc(4.1625% - 11.5px);
}
.styles__card___1Zj9R .styles__item___3PKeb > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__card___1Zj9R .styles__item___3PKeb > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__card___1Zj9R .styles__item___3PKeb > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__card___1Zj9R .styles__item___3PKeb > *:nth-child(3) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(4.1625% - 11.5px);
  max-width: calc(4.1625% - 11.5px);
  width: calc(4.1625% - 11.5px);
}
.styles__card___1Zj9R .styles__item___3PKeb > *:nth-child(3):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__card___1Zj9R .styles__item___3PKeb > *:nth-child(3):last-child {
  margin-right: 0;
}
.styles__card___1Zj9R .styles__item___3PKeb > *:nth-child(3):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__card___1Zj9R .styles__item___3PKeb {
  height: 60px;
  border-bottom: 1px solid #e7e8e9;
  width: 100%;
  text-decoration: none;
  padding: 0 28px;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.styles__card___1Zj9R .styles__item___3PKeb.styles__listHeader___3Xlx_ {
  font-size: 14px;
  line-height: 20px;
  color: #27343b;
  font-weight: 600;
  padding-left: 24px;
  text-transform: uppercase;
  color: #f7f8f9;
  white-space: nowrap;
  padding: 0 28px;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.styles__card___1Zj9R .styles__item___3PKeb.styles__listHeader___3Xlx_ div {
        font-weight: 600;
        margin-top: 40px;
        margin-bottom: 12px;
        color: #8f9ea8;
}
.styles__card___1Zj9R .styles__item___3PKeb .styles__action___22s3g {
      height: 20px;
      margin: 0;
      padding: 0;
      line-height: 20px;
      min-height: 20px;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___3ne0o {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___3ne0o {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__createButtons___2gX-6 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  margin-top: 16px;
}
.styles__privacyHeader___2bi3y {
  font-weight: 700;
}
.styles__privacyText___1BtqD {
  margin-left: 12px;
}
.styles__createTeamInput___1S-9t {
  margin-bottom: 24px;
}
.styles__privateTeams___1PeH0 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  margin-top: 16px;
  font-family: 'Open Sans', sans-serif;
}
.styles__privateTeams___1PeH0 .styles__checkbox___zBiTJ {
    margin-bottom: 5px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    cursor: pointer;
  }
.styles__privateTeams___1PeH0 .styles__checkbox___zBiTJ:last-child {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    padding-bottom: 0;
  }

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___T-7oT {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___T-7oT {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__title___2c5y0 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.styles__title___2c5y0 button {
    margin: 0;
    padding: 0 12px;
    border-radius: 4px;
  }
.styles__title___2c5y0 .styles__searchInput___1IPMk {
    width: 238px;
    height: 36px;
  }
.styles__listBody___Nac9D {
  margin-bottom: 48px;
}
.styles__listBody___Nac9D .styles__teams___1oVIY {
    margin-bottom: 32px;
  }
.styles__teamCard___3uA5B {
  padding: 20px 28px;
  margin-bottom: 10px;
  cursor: pointer;
}
.styles__listItem___1KbLd {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap
}
.styles__listItem___1KbLd > * {
  lost-column-cycle: 3;
}
.styles__listItem___1KbLd > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(24.975% - 9px);
  max-width: calc(24.975% - 9px);
  width: calc(24.975% - 9px);
}
.styles__listItem___1KbLd > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__listItem___1KbLd > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__listItem___1KbLd > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__listItem___1KbLd > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(49.95% - 6px);
  max-width: calc(49.95% - 6px);
  width: calc(49.95% - 6px);
}
.styles__listItem___1KbLd > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__listItem___1KbLd > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__listItem___1KbLd > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__listItem___1KbLd > *:nth-child(3) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(24.975% - 9px);
  max-width: calc(24.975% - 9px);
  width: calc(24.975% - 9px);
}
.styles__listItem___1KbLd > *:nth-child(3):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__listItem___1KbLd > *:nth-child(3):last-child {
  margin-right: 0;
}
.styles__listItem___1KbLd > *:nth-child(3):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__listItem___1KbLd .styles__action___MTdU4 {
    height: 20px;
    margin: 0;
    padding: 0;
    line-height: 20px;
    min-height: 20px;
}
.styles__listItem___1KbLd .styles__action___MTdU4 svg {
      top: 0;
      width: 20px !important;
      height: 20px !important;
    }
.styles__listItem___1KbLd .styles__name___3o4KL {
    font-size: 14px;
    line-height: 20px;
    color: #27343b;
    font-weight: 600;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.styles__listHeader___2Xbfq {

  font-size: 14px;

  line-height: 20px;

  color: #27343b;

  font-weight: 600;

  padding-left: 24px;

  text-transform: uppercase;

  color: #f7f8f9;

  white-space: nowrap;
  padding: 0 28px;
}
.styles__listHeader___2Xbfq div {
    font-weight: 600;
    margin-top: 40px;
    margin-bottom: 12px;
    color: #8f9ea8;
  }
.styles__loading___2Q7Re {
  padding: 48px 0;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___jbmIk {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___jbmIk {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__bold___5ctM5 {
  font-size: 14px;
  line-height: 20px;
  color: #27343b;
  font-weight: 600;
}
.styles__icon___1GKkp {
  fill: #8f9ea8;
}
.styles__iconTooltipWrapper___3dkXy:hover .styles__icon___1GKkp.styles__active___2Xwpo {
  cursor: pointer;
  fill: #099cec;
}
.styles__link___2VnqT {
  cursor: pointer;
  color: #099cec;
}
.styles__card___3K2DD {
  margin-bottom: 48px;
}
.styles__card___3K2DD .styles__loading___LaoxC {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    padding: 48px 0;
  }
.styles__card___3K2DD .styles__items___23Bxs {
    margin-bottom: 32px;
  }
.styles__card___3K2DD .styles__listItem___2Wpzr {
    display: flex;
    flex-flow: row wrap;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap
  }
.styles__card___3K2DD .styles__listItem___2Wpzr > * {
  lost-column-cycle: 3;
}
.styles__card___3K2DD .styles__listItem___2Wpzr > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(49.95% - 6px);
  max-width: calc(49.95% - 6px);
  width: calc(49.95% - 6px);
}
.styles__card___3K2DD .styles__listItem___2Wpzr > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__card___3K2DD .styles__listItem___2Wpzr > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__card___3K2DD .styles__listItem___2Wpzr > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__card___3K2DD .styles__listItem___2Wpzr > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(24.975% - 9px);
  max-width: calc(24.975% - 9px);
  width: calc(24.975% - 9px);
}
.styles__card___3K2DD .styles__listItem___2Wpzr > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__card___3K2DD .styles__listItem___2Wpzr > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__card___3K2DD .styles__listItem___2Wpzr > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__card___3K2DD .styles__listItem___2Wpzr > *:nth-child(3) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(20.8125% - 9.5px);
  max-width: calc(20.8125% - 9.5px);
  width: calc(20.8125% - 9.5px);
}
.styles__card___3K2DD .styles__listItem___2Wpzr > *:nth-child(3):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__card___3K2DD .styles__listItem___2Wpzr > *:nth-child(3):last-child {
  margin-right: 0;
}
.styles__card___3K2DD .styles__listItem___2Wpzr > *:nth-child(3):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__card___3K2DD .styles__listItem___2Wpzr {
  height: 60px;
  border-bottom: 1px solid #e7e8e9;
  width: 100%;
  text-decoration: none;
  padding: 0 28px;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.styles__card___3K2DD .styles__listItem___2Wpzr.styles__listHeader___nfKgb {
  font-size: 14px;
  line-height: 20px;
  color: #27343b;
  font-weight: 600;
  padding-left: 24px;
  text-transform: uppercase;
  color: #f7f8f9;
  white-space: nowrap;
  padding: 0 28px;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}
.styles__card___3K2DD .styles__listItem___2Wpzr.styles__listHeader___nfKgb div {
        font-weight: 600;
        margin-top: 40px;
        margin-bottom: 12px;
        color: #8f9ea8;
}
.styles__card___3K2DD .styles__listItem___2Wpzr .styles__repoPrivateStatus___bYwwt {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
}
.styles__card___3K2DD .styles__listItem___2Wpzr .styles__repoPrivateStatus___bYwwt > svg {
        width: 14px;
        height: 14px;
        margin-right: 8px;
      }
.styles__card___3K2DD .styles__listItem___2Wpzr .styles__goTo___3-WVU {
      height: 16px;
}
.styles__card___3K2DD .styles__listItem___2Wpzr .styles__goTo___3-WVU > svg {
        width: 16px;
        height: 16px;
      }
.styles__title___1pH-7 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.styles__title___1pH-7 .styles__searchInput___2TRjx {
    width: 238px;
    height: 36px;
  }
.styles__repoInfoCard___39Xi3 {
  padding: 20px;
  margin-top: 20px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.styles__repoInfoCard___39Xi3 img {
    height: 50px;
    margin-right: 32px;
  }

.styles__emailField___2IjjV {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

  .styles__emailField___2IjjV .styles__emailInput___2Hp8f {
    border-top: none;
    border: none;
    border-bottom: 2px dotted rgba(0, 0, 0, 0.30196);
    padding: 5px 0;
    width: 256px;
    overflow: hidden;
    margin-right: 10px;
  }

.styles__verified___18ljU {
  margin: 6px;
  padding: 0 10px;
  fill: #00a000;
}

.styles__primaryEmail___1TU0E {
  font-size: 13px;
  font-style: italic;
  color: #777777;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___3BgTu {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___3BgTu {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__modal___2YGSK {
  height: 490px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  padding: 0 30px;
}
.styles__dockerIcon___IITHP {
  margin: 30px 0;
}
.styles__header___3tGV8 {
  font-weight: 700;
  font-size: 22px;
  line-height: 30px;
  margin-bottom: 48px;
}
.styles__formField___31-NW {
  border: none;
  outline: none;
  width: 350px;
  height: 30px;
  background-color: #fafafb;
  font-size: 14px;
  color: #6f777c;
  padding: 7.5px;
}
.styles__fieldBorder___17N3G {
  height: 0;
  border: 0.5px solid #b7bbbe;
  width: 350px;
  margin-bottom: 6px;
}
.styles__fieldBorderError___11veC {
  height: 0;
  border: 0.5px solid #e12b0c;
  width: 350px;
  margin-bottom: 6px;
}
.styles__disableButton___T5gAw {
  width: 230px;
}
.styles__error___1K3IH {
  color: #e12b0c;
  font-size: 13px;
  width: 350px;
  height: 75px;
}

.styles__form___3rz0a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
}

.styles__input___3OwIK {
  width: 256px;
  margin-right: 18px;
}

.styles__emailsWrapper___3HKsk {
  position: relative;
}

.styles__loading___3bm5b {
  background-color: rgba(255, 255, 255, 0.8);
  position: absolute;
  z-index: 99;
  width: 100%;
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.styles__emailFieldWrapper___2tkyl {
  margin: 18px 0;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___1F0Xz {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___1F0Xz {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__pullCommand___1e-gY {
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  letter-spacing: normal;
  color: #8f9ea8;
  margin-bottom: 12px;
}
.styles__pullCode___38_jh {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  background-color: #27343b;
  border-radius: 2px;
  height: 44px;
}
.styles__input___1GNF9 {
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  letter-spacing: normal;
  width: 100%;
  overflow-x: auto;
  color: #ffffff;
  padding: 4px 12px;
  font-family: 'Courier New', Courier, monospace;
  font-weight: 600;
  unicode-bidi: embed;
  background-color: #27343b;
  border: none;
  border-radius: 2px;
}
.styles__tagPullInput___11UTk {
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
  letter-spacing: normal;
  width: 250px;
  overflow-x: auto;
  padding: 5px 12px;
  unicode-bidi: embed;
  background-color: #f1f4f6;
  border: none;
  border-radius: 2px;
}
.styles__tagPullCode___1VLVy {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  height: 28px !important;
  background-color: #f1f4f6;
  border-radius: 2px;
}
.styles__tagPullButton___293Nb {
  position: relative;
  -ms-flex-item-align: center;
      align-self: center;
  cursor: pointer;
  margin-right: 12px;
  top: 2px;
}
.styles__tagPullButton___293Nb svg {
    fill: #007bff;
    height: 18px;
    width: 18px;
  }
.styles__button___1h9sK {
  position: relative;
  -ms-flex-item-align: center;
      align-self: center;
  cursor: pointer;
  margin-right: 12px
}
.styles__button___1h9sK > svg {
  fill: white;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___1iTKI {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___1iTKI {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__main___EBGP1 {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.styles__main___EBGP1 svg {
    fill: #82949e;
    margin-right: 4px;
  }
.styles__display___31YnN {
  font-size: 12px;
  line-height: 16px;
  font-weight: 400;
  letter-spacing: normal;
  color: #82949e;
  line-height: 12px;
  float: left;
}
.styles__dateDisplay___dTlPO {
  font-size: 14px;
}

.styles__tooltipMultiLineContent___p6xV- {
  font-weight: bold;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___2IQ1M {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___2IQ1M {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__content___1ujI3 {
  padding-bottom: 4px;
}
.styles__card___2uTll {
  height: 100%;
  color: #27343b;
  font-size: 14px;
}
.styles__accessTokenForm___343ir {
  min-height: 400px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}
.styles__subtext___3eoob {
  margin: 28px 0;
}
.styles__confirmationBox___3MwcF {
  margin: 0 auto;
  max-width: 800px;
  background-color: #fafafb;
}
.styles__removalTable___3VmRD {
  margin: 32px 0;
}
.styles__removalTable___3VmRD hr {
    margin: 0;
  }
.styles__removalTable___3VmRD > * {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}
.styles__removalTable___3VmRD > * > * {
  lost-column-cycle: 3;
}
.styles__removalTable___3VmRD > * > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(37.4625% - 7.5px);
  max-width: calc(37.4625% - 7.5px);
  width: calc(37.4625% - 7.5px);
}
.styles__removalTable___3VmRD > * > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__removalTable___3VmRD > * > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__removalTable___3VmRD > * > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__removalTable___3VmRD > * > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(33.3% - 8px);
  max-width: calc(33.3% - 8px);
  width: calc(33.3% - 8px);
}
.styles__removalTable___3VmRD > * > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__removalTable___3VmRD > * > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__removalTable___3VmRD > * > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__removalTable___3VmRD > * > *:nth-child(3) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(33.3% - 8px);
  max-width: calc(33.3% - 8px);
  width: calc(33.3% - 8px);
}
.styles__removalTable___3VmRD > * > *:nth-child(3):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__removalTable___3VmRD > * > *:nth-child(3):last-child {
  margin-right: 0;
}
.styles__removalTable___3VmRD > * > *:nth-child(3):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__removalTable___3VmRD > * {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column wrap;
          flex-direction: column wrap;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  padding: 0 10px;
}
.styles__removalTable___3VmRD > *:first-child {
  padding: 5px 10px;
}
.styles__removalTable___3VmRD > *:last-child {
  padding-bottom: 5px;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___2yJC1 {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___2yJC1 {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__parent___2V0a1 {
  max-width: 700px;
  color: #27343b;
}
.styles__header___3OTH_ {
  font-size: 22px;
  font-weight: 600;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
  margin-bottom: 10px;
}
.styles__header___3OTH_ .styles__text___3smO2 {
    margin-left: 20px;
  }
.styles__confirmationBox___3Fl-h {
  margin: 0 auto;
  max-width: 800px;
  background-color: #fafafb;
}
.styles__removalTable___1YYox {
  margin-top: 32px;
}
.styles__removalTable___1YYox hr {
    margin: 0;
  }
.styles__removalTable___1YYox > * {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}
.styles__removalTable___1YYox > * > * {
  lost-column-cycle: 2;
}
.styles__removalTable___1YYox > * > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(49.95% - 6px);
  max-width: calc(49.95% - 6px);
  width: calc(49.95% - 6px);
}
.styles__removalTable___1YYox > * > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__removalTable___1YYox > * > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__removalTable___1YYox > * > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__removalTable___1YYox > * > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(16.65% - 10px);
  max-width: calc(16.65% - 10px);
  width: calc(16.65% - 10px);
}
.styles__removalTable___1YYox > * > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__removalTable___1YYox > * > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__removalTable___1YYox > * > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__removalTable___1YYox > * {
  padding: 5px 10px;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
}
.styles__removalTableTokens___2FHL8 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
}

.style__loading___36WMv {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___2YUqT {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___2YUqT {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__inputField___3cY98 {
  min-height: 62px;
}
.styles__repoName___2HTWC {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}
.styles__repoNamespace___3EAbe {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.styles__namespace___LXJx- {
  margin-top: 6px;
  -webkit-box-flex: 1;
      -ms-flex-positive: 1;
          flex-grow: 1;
}
.styles__repoNameInput___32bZF {
  padding-left: 16px;
  width: 100%;
}
.styles__repoUsage___cRFYx {
  font-size: 14px;
  line-height: 20px;
  color: #27343b;
  padding-bottom: 20px;
}
.styles__warn___25Ywv {
  color: #bf3b42;
}
.styles__privacy___TNUzt {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}
.styles__privacy___TNUzt > * {
  lost-column-cycle: 2;
}
.styles__privacy___TNUzt > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(49.95% - 6px);
  max-width: calc(49.95% - 6px);
  width: calc(49.95% - 6px);
}
.styles__privacy___TNUzt > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__privacy___TNUzt > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__privacy___TNUzt > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__privacy___TNUzt > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(49.95% - 6px);
  max-width: calc(49.95% - 6px);
  width: calc(49.95% - 6px);
}
.styles__privacy___TNUzt > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__privacy___TNUzt > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__privacy___TNUzt > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__privacy___TNUzt {
  padding-bottom: 12px;
}
.styles__privacyLabel___BirfX {
  margin-top: -8px;
}
.styles__privacyIcon___5Qb1L {
  margin: 0 6px 2px;
}
.styles__privacyLabelNameAndIcon___H8u9X {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: end;
      -ms-flex-align: end;
          align-items: flex-end;
}
.styles__privacyLabelName___2CDAf {
  font-size: 14px;
  line-height: 20px;
  color: #27343b;
  font-weight: 600;
}
.styles__privacyLabelDescription___2UMT4 {
  font-size: 14px;
  line-height: 20px;
  color: #27343b;
  padding-top: 4px;
}
.styles__sourceProviders___3IhFa {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.styles__sourceProvider___2CDLW {
  cursor: pointer;
  margin: 0 4px;
  border-radius: 4px;
}
.styles__selected___GxcSl {
  opacity: 1;
  border: 1px solid #e0e4e7;
}
.styles__submitRow___3x-aj {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  padding: 12px 0;
}
.styles__submitRow___3x-aj.styles__alignLeft___1T1mo {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}
.styles__submitRow___3x-aj.styles__alignLeft___1T1mo .styles__submit___2_ZIR {
    margin-left: 0;
  }
.styles__submitError___1RyZe {
  -ms-flex-item-align: center;
      align-self: center;
  font-style: italic;
  color: #e12b0c;
}

/* https://goo.gl/Mus6xj */

/* Font sizes */

/* columns */

/* Three equal columns */

/* Rows */

/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/

@-webkit-keyframes styles__fadein___34QzD {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes styles__fadein___34QzD {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */

/* Causes text that overflows in an element to be truncated with an ellipsis. */

/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/

.styles__labelFieldContainer___3dear {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}

.styles__labelFieldContainer___3dear > * {
  lost-column-cycle: 2;
}

.styles__labelFieldContainer___3dear > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(24.975% - 9px);
  max-width: calc(24.975% - 9px);
  width: calc(24.975% - 9px);
}

.styles__labelFieldContainer___3dear > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__labelFieldContainer___3dear > *:nth-child(1):last-child {
  margin-right: 0;
}

.styles__labelFieldContainer___3dear > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

.styles__labelFieldContainer___3dear > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(74.925% - 3px);
  max-width: calc(74.925% - 3px);
  width: calc(74.925% - 3px);
}

.styles__labelFieldContainer___3dear > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__labelFieldContainer___3dear > *:nth-child(2):last-child {
  margin-right: 0;
}

.styles__labelFieldContainer___3dear > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

.styles__labelFieldContainer___3dear {
  margin: 0 20px 20px;
}

.styles__label___1GIa5 {
  color: #637986;
  text-transform: uppercase;
}

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

.styles__alignCenter___18BKt {
  -ms-flex-item-align: center;
      align-self: center;
}

.styles__label___1GIa5.styles__disabled___2_DUT,
.styles__field___kMIeV.styles__disabled___2_DUT {
  color: #82949e;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___3JwNE {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___3JwNE {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__main___2JGR4 {
  margin-top: 16px;
}
.styles__main___2JGR4 button {
    padding: 0;
    margin-left: 0;
  }
.styles__row___tPT2D {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}
.styles__row___tPT2D > * {
  lost-column-cycle: 3;
}
.styles__row___tPT2D > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(12.4875% - 10.5px);
  max-width: calc(12.4875% - 10.5px);
  width: calc(12.4875% - 10.5px);
}
.styles__row___tPT2D > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__row___tPT2D > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__row___tPT2D > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__row___tPT2D > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(12.4875% - 10.5px);
  max-width: calc(12.4875% - 10.5px);
  width: calc(12.4875% - 10.5px);
}
.styles__row___tPT2D > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__row___tPT2D > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__row___tPT2D > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__row___tPT2D > *:nth-child(3) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(74.925% - 3px);
  max-width: calc(74.925% - 3px);
  width: calc(74.925% - 3px);
}
.styles__row___tPT2D > *:nth-child(3):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__row___tPT2D > *:nth-child(3):last-child {
  margin-right: 0;
}
.styles__row___tPT2D > *:nth-child(3):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__hookTeam___f_qo2 {
  float: left;
  margin-right: 12px;
}
.styles__info___xnUvr {
  margin-top: 16px;
  margin-bottom: 20px;
  background-color: #f7f7f8;
  padding: 16px;
  border-radius: 3px;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___2zAjW {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___2zAjW {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__wrapper___2kQOy {
  width: 100%;
}
.styles__title___27d1F {
  font-size: 16px;
  margin-top: 0;
}
.styles__subTitle___1wonT {
  font-size: 16px;
  font-weight: 400;
  margin: 24px 0 5px;
}
.styles__steps___1TC1H {
  padding-left: 20px;
}
.styles__steps___1TC1H li {
    margin-bottom: 4px;
  }
.styles__warningTitle___3_xF6 {
  font-size: 14px;
  margin-top: 0;
  color: #ef4a53;
  margin-left: 8px;
}
.styles__warningIcon___2KjCv {
  display: inline-block;
  margin-bottom: 10px;
  margin-top: 5px;
}
.styles__warningIcon___2KjCv svg {
    margin-bottom: -4px;
  }
.styles__converOrgCards___MAH6C .styles__card___31aLJ {
    margin-bottom: 12px;
  }
.styles__boldText___1n00Q {
  font-weight: 700;
}
.styles__infoText___15cwm {
  margin: 4px 0 24px;
  font-size: 13px;
  line-height: 20px;
}
.styles__convertButtons___DEzx1 {
  text-align: right;
}
.styles__idInput___NqeRd {
  margin-top: 12px;
  margin-bottom: 32px;
}
.styles__errorMessage___2l8yp {
  font-size: 13px;
  color: #ef4a53;
}
.styles__successMessage___3vlal {
  text-align: center;
  padding: 10px 0 20px;
}
.styles__successMessage___3vlal .styles__successTitle___3p834 {
    font-size: 18px;
    color: #70c9a0;
  }
.styles__boldItalic___NBbrc {
  font-weight: 600;
  font-style: italic;
}
.styles__provider___2EfkK {
  display: inline-block;
  text-align: center;
  margin-left: 12px;
  margin-right: 16px;
  color: #c0c9ce;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___M1uG_ {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___M1uG_ {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__title___2l09C {
  font-size: 16px;
  margin-top: 0;
}
.styles__wrapper___1MQ-r {
  width: 100%;
}
.styles__warningTitle___19cy_ {
  font-size: 14px;
  color: #ef4a53;
  margin-left: 8px;
}
.styles__warningIcon___1I2c5 {
  display: inline-block;
  margin-bottom: 10px;
  margin-top: 5px;
}
.styles__warningIcon___1I2c5 svg {
    margin-bottom: -4px;
  }
.styles__converOrgCards___3a_5Z .styles__card___1ZsQs {
    margin-top: 20px;
    margin-bottom: 12px;
  }
.styles__boldText___1TDEU {
  font-weight: 700;
}
.styles__infoText___3uSaA {
  margin-top: 32px;
  font-size: 13px;
  line-height: 20px;
}
.styles__convertButtons___1C2cK {
  text-align: right;
}
.styles__idInput___1SZQV {
  margin-bottom: 32px;
}
.styles__errorMessage___i2gl_ {
  font-size: 13px;
  color: #ef4a53;
}
.styles__errorMessage___i2gl_ p {
    margin: 0 0 3px;
    line-height: 1.5;
  }
.styles__provider___2FWZs {
  display: inline-block;
  text-align: center;
  margin-left: 12px;
  margin-right: 16px;
  color: #c0c9ce;
}

/* IdpIntegration Settings styles */

/* media queries */

/* lib/constants/sizes */

/* layout */

/* spacing */

/* misc */

/* body font sizes */

/* heading font sizes */

/* font family */

/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */

/* Purples - lightest to darkest */

/* Blues - lightest to darkest */

/* Greens - lightest to darkest */

/* Reds - lightest to darkest */

/* Yellows - lightest to darkest */

/* Grays - lightest to darkest */

/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */

/* -base background colors */

/* lib/constants/variants */

/* cohesion font colors */

/* State Colors */

/* -- These use colors not found in the styleguide -- */

/* - end -- */

/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/

/* button */

/* select */

/* input */

/* stylelint-disable value-list-comma-newline-after */

/* box-shadow for store cards */

/* component: tab */

/* Nautilus colors */

/* Publish flow */

/* Public Profile */

/* v2 */

/* https://goo.gl/Mus6xj */

/* Font sizes */

/* columns */

/* Three equal columns */

/* Rows */

/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/

@-webkit-keyframes styles__fadein___2AeD8 {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes styles__fadein___2AeD8 {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */

/* Causes text that overflows in an element to be truncated with an ellipsis. */

/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/

/* module account */

.styles__wrapper___KGzLf {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding-top: 24px;
  overflow: hidden;
  background: #f7f8f9;
}

.styles__wrapper___KGzLf .styles__card___3uHrc {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-flow: column nowrap;
            flex-flow: column nowrap;
  }

.styles__wrapper___KGzLf .styles__card___3uHrc h3 {
      margin-bottom: 36px;
    }

.styles__wrapper___KGzLf .styles__card___3uHrc .styles__errorHeader___39ppx {
      margin: 20px 0;
      font-size: 14px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: start;
          -ms-flex-pack: start;
              justify-content: flex-start;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      margin-bottom: 10px;
    }

.styles__wrapper___KGzLf .styles__card___3uHrc .styles__errorHeader___39ppx .styles__text___PJXC8 {
        margin-left: 20px;
      }

.styles__wrapper___KGzLf .styles__card___3uHrc > input {
    margin-bottom: 10px;
  }

.styles__accessTokenRetrievalError___2zg9t {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.styles__accessTokenRetrievalError___2zg9t > :first-child {
    margin-right: 12px;
  }

.styles__settingsInfoSection___KvKQb {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  max-width: 1000px;
}

.styles__settingsInfoCard___xcRHY {
  margin-bottom: 32px;
  background-color: #ffffff;
}

.styles__header___CX8kr {
  background-color: #ffffff;
}

.styles__title___1cYPc {
  font-size: 16px;
  font-weight: 600;
  margin: 0 0 24px;
  line-height: 16px;
}

.styles__boldItalic___p3bRi {
  font-weight: 600;
  font-style: italic;
}

.styles__buttonWrapper___2_lg5 {
  text-align: right;
}

.styles__promoCode___JCj-S {
  text-align: center;
  width: 100%;
}

.styles__promoCodeInfoCard___3xmul {
  background-color: #d1eefd;
  border-color: #a3ddfc;
  color: color-curious-blue;
  margin-bottom: 20px;
}

.styles__loadingCard___2bV1c {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  min-height: 200px;
}

.styles__largeLoadingCard___hbHgX {
  min-height: 400px;
}

.styles__promoCodeWrapper___2fnwS {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  min-height: 52px;
  top: -1px;
}

/* account nav and cards */

.styles__accountLeftNav___2zLGk {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
}

.styles__accountCardsContainer___sgyem {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  width: 1050px;
  margin-bottom: 20px;
}

.styles__accountCardsContainer___sgyem .styles__card___3uHrc {
    margin-bottom: 20px;
  }

.styles__changePasswordAndEmails___1OA0j .styles__emails___2tv1n,
  .styles__changePasswordAndEmails___1OA0j .styles__password___1LrAD {
    margin-top: 40px;
    margin-bottom: 48px;
  }

.styles__changePasswordAndEmails___1OA0j .styles__accountInfo___DAHFS {
    margin-top: 40px;
  }

.styles__changePasswordAndEmails___1OA0j .styles__header___CX8kr {
    font-size: 13px;
    line-height: 18px;
    font-weight: 400;
    letter-spacing: normal;
    font-weight: bolder;
    color: #c0c9ce;
    margin-bottom: 20px;
  }

.styles__changePasswordAndEmails___1OA0j .styles__inputField___j6TSF {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-flow: row wrap;
            flex-flow: row wrap;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    margin-top: 24px;
  }

.styles__changePasswordAndEmails___1OA0j .styles__setAsPrimaryBtn___1-y7C {
    color: #c0c9ce;
    background-color: #fbfbfc;
    border-color: #fbfbfc;
  }

.styles__changePasswordAndEmails___1OA0j .styles__primaryEmail___3TEac {
    margin: 4px;
    padding: 0 4px;
    min-width: 88px;
    height: 36px;
    display: inline-block;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    white-space: nowrap;
    text-decoration: none;
    font-weight: 700;
    font-size: 14px;
    line-height: 32px;
    color: #fbfbfc;
    background-color: #c0c9ce;
    border: 2px solid #c0c9ce;
    border-radius: 3px;
  }

.styles__changePasswordAndEmails___1OA0j .styles__checkedIcon___1aJP3 {
    margin: 8px 4px 4px 4px;
    padding: 0 4px;
  }

.styles__changePasswordAndEmails___1OA0j .styles__checkedIcon___1aJP3 svg {
      position: relative;
      top: 4px;
    }

.styles__changePasswordAndEmails___1OA0j .styles__button___3kd9n {
    margin: 4px;
    padding: 0 4px;
  }

.styles__changePasswordAndEmails___1OA0j .styles__passError___BDhqz {
    margin-top: 24px;
  }

.styles__saveBtn___3Ae_3 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-top: 20px;
}

.styles__justifyCenter___1x97_ {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}

.styles__recoveryCode___2ngfU {
  margin-right: 40px;
}

.styles__recoveryCode___2ngfU .styles__recoveryCodeBtn___GNoH_ {
    width: 190px;
    height: 33px;
    margin: 25px 0;
    border-radius: 4px;
    text-align: center;
  }

.styles__disableBtn___29ebf {
  color: #e12b0c;
  width: 180px;
  height: 33px;
  border: 1px solid #e12b0c;
  border-radius: 4px;
  font-weight: 800;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  margin: 25px 0
}

.styles__disableBtn___29ebf:hover {
  border: 1px solid #e12b0c;
}

.styles__saveBtnWithTokens___Hnvvt {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}

.styles__saveBtnWithTokens___Hnvvt button {
    margin: 0;
  }

.styles__saveBtnWithTokens___Hnvvt .styles__twoButtons___12lgI button:nth-child(1) {
  margin-right: 18px;
}

.styles__invertedPanicButton___3H_jo:hover {
  background-color: #871907 !important;
  color: #ffffff !important;
  border-color: #871907 !important;
}

.styles__invertedRegularButton___1CXe9:hover {
  background-color: #2596ec !important;
  color: #ffffff !important;
  border-color: #2596ec !important;
}

.styles__apiCodeBlock___2XxM6 {
  word-wrap: break-word;
}

/* cloud providers card */

.styles__cloudProviderRow___17ANq {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap
}

.styles__cloudProviderRow___17ANq > * {
  lost-column-cycle: 6;
}

.styles__cloudProviderRow___17ANq > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(20.8125% - 9.5px);
  max-width: calc(20.8125% - 9.5px);
  width: calc(20.8125% - 9.5px);
}

.styles__cloudProviderRow___17ANq > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__cloudProviderRow___17ANq > *:nth-child(1):last-child {
  margin-right: 0;
}

.styles__cloudProviderRow___17ANq > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

.styles__cloudProviderRow___17ANq > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(41.625% - 7px);
  max-width: calc(41.625% - 7px);
  width: calc(41.625% - 7px);
}

.styles__cloudProviderRow___17ANq > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__cloudProviderRow___17ANq > *:nth-child(2):last-child {
  margin-right: 0;
}

.styles__cloudProviderRow___17ANq > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

.styles__cloudProviderRow___17ANq > *:nth-child(3) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(8.325% - 11px);
  max-width: calc(8.325% - 11px);
  width: calc(8.325% - 11px);
}

.styles__cloudProviderRow___17ANq > *:nth-child(3):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__cloudProviderRow___17ANq > *:nth-child(3):last-child {
  margin-right: 0;
}

.styles__cloudProviderRow___17ANq > *:nth-child(3):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

.styles__cloudProviderRow___17ANq > *:nth-child(4) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(8.325% - 11px);
  max-width: calc(8.325% - 11px);
  width: calc(8.325% - 11px);
}

.styles__cloudProviderRow___17ANq > *:nth-child(4):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__cloudProviderRow___17ANq > *:nth-child(4):last-child {
  margin-right: 0;
}

.styles__cloudProviderRow___17ANq > *:nth-child(4):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

.styles__cloudProviderRow___17ANq > *:nth-child(5) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(14.985% - 10.2px);
  max-width: calc(14.985% - 10.2px);
  width: calc(14.985% - 10.2px);
}

.styles__cloudProviderRow___17ANq > *:nth-child(5):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__cloudProviderRow___17ANq > *:nth-child(5):last-child {
  margin-right: 0;
}

.styles__cloudProviderRow___17ANq > *:nth-child(5):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

.styles__cloudProviderRow___17ANq > *:nth-child(6) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(14.1525% - 10.3px);
  max-width: calc(14.1525% - 10.3px);
  width: calc(14.1525% - 10.3px);
}

.styles__cloudProviderRow___17ANq > *:nth-child(6):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__cloudProviderRow___17ANq > *:nth-child(6):last-child {
  margin-right: 0;
}

.styles__cloudProviderRow___17ANq > *:nth-child(6):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

.styles__cloudProviderRow___17ANq {
  border-top: 1px solid #e0e4e7;
  border-bottom: 1px solid #e0e4e7;
  margin-top: -1px;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.styles__cloudProviderRow___17ANq .styles__noMargin___M94tb {
    margin: 0;
}

/* Fix overflow issue in safari */

.styles__cloudProviderRow___17ANq > * {
    -ms-flex-negative: 1 !important;
        flex-shrink: 1 !important;
}

.styles__providerKey___2-G0b {
  word-wrap: break-word;
}

.styles__linkedProviderName___zrKwc {
  font-weight: 700;
  color: #254356;
}

.styles__providerName___2Aj7M {
  font-weight: 700;
  color: #c0c9ce;
}

.styles__addCredentials___3vIYy {
  color: #c0c9ce;
}

/* source providers card */

.styles__sourceProviderRow___3iz--,
.styles__sourceProviderHeader___3sVLb {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap
}

.styles__sourceProviderRow___3iz-- > *, .styles__sourceProviderHeader___3sVLb > * {
  lost-column-cycle: 5;
}

.styles__sourceProviderRow___3iz-- > *:nth-child(1), .styles__sourceProviderHeader___3sVLb > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(33.3% - 8px);
  max-width: calc(33.3% - 8px);
  width: calc(33.3% - 8px);
}

.styles__sourceProviderRow___3iz-- > *:nth-child(1):nth-child(1n), .styles__sourceProviderHeader___3sVLb > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__sourceProviderRow___3iz-- > *:nth-child(1):last-child, .styles__sourceProviderHeader___3sVLb > *:nth-child(1):last-child {
  margin-right: 0;
}

.styles__sourceProviderRow___3iz-- > *:nth-child(1):nth-child(12n), .styles__sourceProviderHeader___3sVLb > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

.styles__sourceProviderRow___3iz-- > *:nth-child(2), .styles__sourceProviderHeader___3sVLb > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(24.975% - 9px);
  max-width: calc(24.975% - 9px);
  width: calc(24.975% - 9px);
}

.styles__sourceProviderRow___3iz-- > *:nth-child(2):nth-child(1n), .styles__sourceProviderHeader___3sVLb > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__sourceProviderRow___3iz-- > *:nth-child(2):last-child, .styles__sourceProviderHeader___3sVLb > *:nth-child(2):last-child {
  margin-right: 0;
}

.styles__sourceProviderRow___3iz-- > *:nth-child(2):nth-child(12n), .styles__sourceProviderHeader___3sVLb > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

.styles__sourceProviderRow___3iz-- > *:nth-child(3), .styles__sourceProviderHeader___3sVLb > *:nth-child(3) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(8.325% - 11px);
  max-width: calc(8.325% - 11px);
  width: calc(8.325% - 11px);
}

.styles__sourceProviderRow___3iz-- > *:nth-child(3):nth-child(1n), .styles__sourceProviderHeader___3sVLb > *:nth-child(3):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__sourceProviderRow___3iz-- > *:nth-child(3):last-child, .styles__sourceProviderHeader___3sVLb > *:nth-child(3):last-child {
  margin-right: 0;
}

.styles__sourceProviderRow___3iz-- > *:nth-child(3):nth-child(12n), .styles__sourceProviderHeader___3sVLb > *:nth-child(3):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

.styles__sourceProviderRow___3iz-- > *:nth-child(4), .styles__sourceProviderHeader___3sVLb > *:nth-child(4) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(8.325% - 11px);
  max-width: calc(8.325% - 11px);
  width: calc(8.325% - 11px);
}

.styles__sourceProviderRow___3iz-- > *:nth-child(4):nth-child(1n), .styles__sourceProviderHeader___3sVLb > *:nth-child(4):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__sourceProviderRow___3iz-- > *:nth-child(4):last-child, .styles__sourceProviderHeader___3sVLb > *:nth-child(4):last-child {
  margin-right: 0;
}

.styles__sourceProviderRow___3iz-- > *:nth-child(4):nth-child(12n), .styles__sourceProviderHeader___3sVLb > *:nth-child(4):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

.styles__sourceProviderRow___3iz-- > *:nth-child(5), .styles__sourceProviderHeader___3sVLb > *:nth-child(5) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: -12px;
  max-width: -12px;
  width: -12px;
}

.styles__sourceProviderRow___3iz-- > *:nth-child(5):nth-child(1n), .styles__sourceProviderHeader___3sVLb > *:nth-child(5):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__sourceProviderRow___3iz-- > *:nth-child(5):last-child, .styles__sourceProviderHeader___3sVLb > *:nth-child(5):last-child {
  margin-right: 0;
}

.styles__sourceProviderRow___3iz-- > *:nth-child(5):nth-child(12n), .styles__sourceProviderHeader___3sVLb > *:nth-child(5):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

.styles__sourceProviderRow___3iz--,
.styles__sourceProviderHeader___3sVLb {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.styles__sourceProviderRow___3iz-- .styles__noMargin___M94tb, .styles__sourceProviderHeader___3sVLb .styles__noMargin___M94tb {
    margin: 0;
}

.styles__info___12LNm {
  margin-bottom: 20px;
  background-color: #f7f7f8;
  padding: 16px;
  border-radius: 3px;
}

.styles__sourceProviderMessage___3DP9O {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  margin-top: -12px;
}

.styles__sourceProviderMessage___3DP9O svg {
    fill: #8f9ea8;
    width: 18px;
    margin-bottom: -12px;
    margin-right: 12px;
  }

.styles__sourceProviderMessage___3DP9O p {
    /* @mixin tertiary; */
  }

.styles__sourceProviderHeader___3sVLb {
  font-size: 13px;
  line-height: 18px;
  letter-spacing: normal;
  font-weight: bolder;
  color: #c0c9ce;
  margin-top: 12px;
}

/* access tokens */

.styles__accessTokensView___3Fpgh {
  lost-container: column
}

.styles__accessTokensView___3Fpgh > *:nth-child(1) {
  width: 100%;
  height: calc(33.3% - 8px);
  margin-bottom: 12px;
}

.styles__accessTokensView___3Fpgh > *:nth-child(1):last-child {
  margin-bottom: 0;
}

.styles__accessTokensView___3Fpgh > *:nth-child(2) {
  width: 100%;
  height: calc(33.3% - 8px);
  margin-bottom: 12px;
}

.styles__accessTokensView___3Fpgh > *:nth-child(2):last-child {
  margin-bottom: 0;
}

.styles__accessTokensView___3Fpgh > *:nth-child(3) {
  width: 100%;
  height: calc(33.3% - 8px);
  margin-bottom: 12px;
}

.styles__accessTokensView___3Fpgh > *:nth-child(3):last-child {
  margin-bottom: 0;
}

.styles__accessTokensView___3Fpgh .styles__expandible___Qgz_H {
    overflow: hidden;
    -webkit-transition: max-height 0.5s ease-in-out;
    transition: max-height 0.5s ease-in-out;
}

.styles__accessTokensView___3Fpgh .styles__collapsed___1MR7m {
    max-height: 392px !important;
}

.styles__accessTokensView___3Fpgh .styles__expanded___2RIxh {
    max-height: 1960px !important;
}

.styles__showMoreOrLess___2jV_8 {
  text-align: center;
}

.styles__showMoreOrLess___2jV_8 .styles__link___1HsCS {
    text-decoration: none;
    cursor: pointer;
  }

.styles__showMoreOrLess___2jV_8 .styles__link___1HsCS span,
    .styles__showMoreOrLess___2jV_8 .styles__link___1HsCS svg {
      vertical-align: middle;
    }

.styles__showMoreOrLess___2jV_8 .styles__icon___3gHRY {
    -webkit-transition: rotate 0.5s ease-in-out;
    transition: rotate 0.5s ease-in-out;
  }

.styles__showMoreOrLess___2jV_8 .styles__rotateIcon___qD17G {
    -webkit-transform: rotate(180deg);
            transform: rotate(180deg);
  }

/* notifications email, slack and announcements */

.styles__notifications___Qh6Jr .styles__emailRadiogroup___2BBPW {
    display: -webkit-inline-box !important;
    display: -ms-inline-flexbox !important;
    display: inline-flex !important;
    -webkit-box-align: center !important;
        -ms-flex-align: center !important;
            align-items: center !important;
  }

.styles__notifications___Qh6Jr .styles__slackNotifications___wWffn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-flow: row nowrap;
            flex-flow: row nowrap;
  }

/* billing card */

.styles__billing___3say- {
  margin-left: 16px;
}

/* plans */

.styles__planDetails___111xw {
  height: 180px;
}

.styles__planDetails___111xw .styles__planContent___1tc0e {
    margin: 0 80px;
  }

.styles__planDetails___111xw .styles__icon___3gHRY {
    fill: #8f9ea8;
    margin-right: 8px;
  }

.styles__planDetails___111xw .styles__nodeCost___1zW3Q,
  .styles__planDetails___111xw .styles__privateReposAvailable___1lPfu {
    font-size: 14px;
    line-height: 20px;
    color: #27343b;
    margin-bottom: 4px;
  }

.styles__planDetails___111xw .styles__privateReposUsed___1V2CX {
    font-size: 14px;
    line-height: 20px;
    color: #27343b;
    color: #00cbca;
    margin-bottom: 4px;
  }

.styles__planDetails___111xw .styles__bigNumber___1KY_i {
    font-size: 28px;
    line-height: 40px;
    font-weight: 400;
    letter-spacing: normal;
    color: #254356;
    margin-right: 12px;
  }

.styles__planDetails___111xw .styles__priceText___2R_9g {
    font-size: 16px;
    line-height: 22px;
    font-weight: 400;
    letter-spacing: normal;
    color: #254356;
    margin-bottom: 4px;
  }

.styles__planDetails___111xw .styles__priceText___2R_9g .styles__bigNumber___1KY_i {
      margin-right: 8px;
      margin-left: 8px;
    }

.styles__planDetails___111xw .styles__usageDescription___2XJMU {
    font-size: 14px;
    line-height: 20px;
    color: #27343b;
    text-transform: uppercase;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }

.styles__planDetails___111xw .styles__usageText___lg063 {
    -ms-flex-item-align: center;
        align-self: center;
  }

.styles__planDetails___111xw .styles__splitPanels___1tP7m {
    display: flex;
    flex-flow: row wrap;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
  }

.styles__planDetails___111xw .styles__splitPanels___1tP7m > * {
  lost-column-cycle: 2;
}

.styles__planDetails___111xw .styles__splitPanels___1tP7m > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(58.275% - 5px);
  max-width: calc(58.275% - 5px);
  width: calc(58.275% - 5px);
}

.styles__planDetails___111xw .styles__splitPanels___1tP7m > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__planDetails___111xw .styles__splitPanels___1tP7m > *:nth-child(1):last-child {
  margin-right: 0;
}

.styles__planDetails___111xw .styles__splitPanels___1tP7m > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

.styles__planDetails___111xw .styles__splitPanels___1tP7m > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(41.625% - 7px);
  max-width: calc(41.625% - 7px);
  width: calc(41.625% - 7px);
}

.styles__planDetails___111xw .styles__splitPanels___1tP7m > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__planDetails___111xw .styles__splitPanels___1tP7m > *:nth-child(2):last-child {
  margin-right: 0;
}

.styles__planDetails___111xw .styles__splitPanels___1tP7m > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

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

.styles__planDetails___111xw .styles__monitoredWithNautilus___m_807 {
    font-size: 13px;
    line-height: 18px;
    font-weight: 400;
    letter-spacing: normal;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    color: #8f9ea8;
  }

.styles__planDetails___111xw .styles__nautilusUpsell___MrZRl {
    background-color: #ffffff;
    border: solid 1px #e0e4e7;
    padding: 12px;
    border-radius: 2px;
    margin-top: 32px;
  }

.styles__planDetails___111xw .styles__nautilusLink___wi4Ms {
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
    letter-spacing: normal;
    margin-left: 12px;
  }

.styles__planDetails___111xw button {
    margin: 0;
  }

.styles__planDetails___111xw .styles__planButton___2JiHV {
    margin-top: 20px;
  }

/* coupon codes */

.styles__couponCodes___2T-R7 {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap
}

.styles__couponCodes___2T-R7 > * {
  lost-column-cycle: 3;
}

.styles__couponCodes___2T-R7 > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(49.95% - 6px);
  max-width: calc(49.95% - 6px);
  width: calc(49.95% - 6px);
}

.styles__couponCodes___2T-R7 > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__couponCodes___2T-R7 > *:nth-child(1):last-child {
  margin-right: 0;
}

.styles__couponCodes___2T-R7 > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

.styles__couponCodes___2T-R7 > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(8.325% - 11px);
  max-width: calc(8.325% - 11px);
  width: calc(8.325% - 11px);
}

.styles__couponCodes___2T-R7 > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__couponCodes___2T-R7 > *:nth-child(2):last-child {
  margin-right: 0;
}

.styles__couponCodes___2T-R7 > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

.styles__couponCodes___2T-R7 > *:nth-child(3) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(41.625% - 7px);
  max-width: calc(41.625% - 7px);
  width: calc(41.625% - 7px);
}

.styles__couponCodes___2T-R7 > *:nth-child(3):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__couponCodes___2T-R7 > *:nth-child(3):last-child {
  margin-right: 0;
}

.styles__couponCodes___2T-R7 > *:nth-child(3):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

.styles__couponCodes___2T-R7 .styles__button___3kd9n {
    min-width: 40px;
    margin: 0 0 0 16px;
    padding: 0;
}

.styles__couponCodes___2T-R7 .styles__name___2JyA8 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}

.styles__couponCodesTitle___1qE6O {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.styles__couponCodesTitle___1qE6O .styles__infoTooltip___1tybH {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    margin-left: 16px;
  }

/* quotas */

.styles__quotasContainer___QnUWQ .styles__quotas___2TkBU {
    display: flex;
    flex-flow: row wrap;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap
  }

.styles__quotasContainer___QnUWQ .styles__quotas___2TkBU > * {
  lost-column-cycle: 2;
}

.styles__quotasContainer___QnUWQ .styles__quotas___2TkBU > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(49.95% - 6px);
  max-width: calc(49.95% - 6px);
  width: calc(49.95% - 6px);
}

.styles__quotasContainer___QnUWQ .styles__quotas___2TkBU > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__quotasContainer___QnUWQ .styles__quotas___2TkBU > *:nth-child(1):last-child {
  margin-right: 0;
}

.styles__quotasContainer___QnUWQ .styles__quotas___2TkBU > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

.styles__quotasContainer___QnUWQ .styles__quotas___2TkBU > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(49.95% - 6px);
  max-width: calc(49.95% - 6px);
  width: calc(49.95% - 6px);
}

.styles__quotasContainer___QnUWQ .styles__quotas___2TkBU > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__quotasContainer___QnUWQ .styles__quotas___2TkBU > *:nth-child(2):last-child {
  margin-right: 0;
}

.styles__quotasContainer___QnUWQ .styles__quotas___2TkBU > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

.styles__quotasContainer___QnUWQ .styles__quotas___2TkBU ul {
      list-style: none;
      padding: 0;
}

.styles__quotasContainer___QnUWQ .styles__quotas___2TkBU ul::before,
  .styles__quotasContainer___QnUWQ .styles__quotas___2TkBU ul::after {
  content: ' ';
  display: table;
}

.styles__quotasContainer___QnUWQ .styles__quotas___2TkBU ul::after {
  clear: both;
}

.styles__quotasContainer___QnUWQ .styles__quotas___2TkBU ul {
  padding-left: 16px;
}

.styles__quotasContainer___QnUWQ .styles__quotas___2TkBU li {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
      margin: 0 -4px 12px -4px;
}

.styles__quotasContainer___QnUWQ .styles__quotas___2TkBU li .styles__quotaField___25GZx:first-child {
        -webkit-box-flex: 1;
            -ms-flex-positive: 1;
                flex-grow: 1;
      }

.styles__quotasContainer___QnUWQ .styles__quotas___2TkBU li > * {
  margin: 0 4px;
}

/* delete account card */

.styles__deleteAccount___309Wa {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-flow: row nowrap;
          flex-flow: row nowrap;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.styles__deleteAccount___309Wa > div > p {
      color: #ef4a53;
    }

.styles__deleteAccount___309Wa button {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 200px;
            flex: 0 0 200px;
  }

.styles__accessTokensTable___yvW8_ {
  margin-top: 32px;
  min-height: 220px
}

.styles__accessTokensTable___yvW8_ > * {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}

.styles__accessTokensTable___yvW8_ > * > * {
  lost-column-cycle: 6;
}

.styles__accessTokensTable___yvW8_ > * > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(4.1625% - 11.5px);
  max-width: calc(4.1625% - 11.5px);
  width: calc(4.1625% - 11.5px);
}

.styles__accessTokensTable___yvW8_ > * > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__accessTokensTable___yvW8_ > * > *:nth-child(1):last-child {
  margin-right: 0;
}

.styles__accessTokensTable___yvW8_ > * > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

.styles__accessTokensTable___yvW8_ > * > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(41.625% - 7px);
  max-width: calc(41.625% - 7px);
  width: calc(41.625% - 7px);
}

.styles__accessTokensTable___yvW8_ > * > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__accessTokensTable___yvW8_ > * > *:nth-child(2):last-child {
  margin-right: 0;
}

.styles__accessTokensTable___yvW8_ > * > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

.styles__accessTokensTable___yvW8_ > * > *:nth-child(3) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(20.8125% - 9.5px);
  max-width: calc(20.8125% - 9.5px);
  width: calc(20.8125% - 9.5px);
}

.styles__accessTokensTable___yvW8_ > * > *:nth-child(3):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__accessTokensTable___yvW8_ > * > *:nth-child(3):last-child {
  margin-right: 0;
}

.styles__accessTokensTable___yvW8_ > * > *:nth-child(3):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

.styles__accessTokensTable___yvW8_ > * > *:nth-child(4) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(20.8125% - 9.5px);
  max-width: calc(20.8125% - 9.5px);
  width: calc(20.8125% - 9.5px);
}

.styles__accessTokensTable___yvW8_ > * > *:nth-child(4):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__accessTokensTable___yvW8_ > * > *:nth-child(4):last-child {
  margin-right: 0;
}

.styles__accessTokensTable___yvW8_ > * > *:nth-child(4):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

.styles__accessTokensTable___yvW8_ > * > *:nth-child(5) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(8.325% - 11px);
  max-width: calc(8.325% - 11px);
  width: calc(8.325% - 11px);
}

.styles__accessTokensTable___yvW8_ > * > *:nth-child(5):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__accessTokensTable___yvW8_ > * > *:nth-child(5):last-child {
  margin-right: 0;
}

.styles__accessTokensTable___yvW8_ > * > *:nth-child(5):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

.styles__accessTokensTable___yvW8_ > * > *:nth-child(6) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(8.325% - 11px);
  max-width: calc(8.325% - 11px);
  width: calc(8.325% - 11px);
}

.styles__accessTokensTable___yvW8_ > * > *:nth-child(6):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__accessTokensTable___yvW8_ > * > *:nth-child(6):last-child {
  margin-right: 0;
}

.styles__accessTokensTable___yvW8_ > * > *:nth-child(6):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

.styles__accessTokensTable___yvW8_ > * {
  margin: 12px 0;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.styles__accessTokensTable___yvW8_ .styles__accessTokensHeader___3xGlY {
    color: #6f777c;
    font-weight: 500;
    margin-bottom: 12px;
    text-transform: uppercase;
}

.styles__accessTokensTable___yvW8_ .styles__selectAction___2NMPr {
    -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
            flex: 0 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    width: 40px;
    font-size: 12px !important;
}

.styles__accessTokensTable___yvW8_ .styles__selectAction___2NMPr .styles__checkboxParent___1r5K- {
      width: 14px;
      height: 14px;
    }

.styles__accessTokensTable___yvW8_ .styles__selectAction___2NMPr .styles__checkbox___29o9- {
      opacity: 0.5;
    }

.styles__accessTokensTable___yvW8_ .styles__selectAction___2NMPr .styles__checkbox___29o9-.styles__checked___2fi78 {
      opacity: 1;
    }

.styles__accessTokensTable___yvW8_ .styles__selectAction___2NMPr .styles__checkboxIcon___3GblQ {
      width: 14px;
      height: 14px;
    }

/* cloudProviderError */

.styles__errorField___3nMET {
  display: none;
  color: #ef4a53
}

.styles__errorField___3nMET.styles__visible___1T2Zs {
  display: block;
}

.styles__errorField___3nMET > * {
  vertical-align: middle;
}

.styles__errorField___3nMET .styles__errorText___2izRD {
    margin-left: 8px;
}

/* convert account to organization */

.styles__convertAccount___2YjRF {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap
}

.styles__convertAccount___2YjRF > * {
  lost-column-cycle: 2;
}

.styles__convertAccount___2YjRF > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(70.7625% - 3.5px);
  max-width: calc(70.7625% - 3.5px);
  width: calc(70.7625% - 3.5px);
}

.styles__convertAccount___2YjRF > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__convertAccount___2YjRF > *:nth-child(1):last-child {
  margin-right: 0;
}

.styles__convertAccount___2YjRF > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

.styles__convertAccount___2YjRF > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(29.1375% - 8.5px);
  max-width: calc(29.1375% - 8.5px);
  width: calc(29.1375% - 8.5px);
}

.styles__convertAccount___2YjRF > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}

.styles__convertAccount___2YjRF > *:nth-child(2):last-child {
  margin-right: 0;
}

.styles__convertAccount___2YjRF > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}

.styles__convertAccount___2YjRF {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.styles__convertAccount___2YjRF .styles__title___1cYPc {
    font-size: 18px;
    line-height: 28px;
    font-weight: 500;
    letter-spacing: 0.005em;
}

.styles__convertAccount___2YjRF .styles__semiBold___1g1bI {
    font-weight: 600;
}

.styles__convertAccount___2YjRF .styles__button___3kd9n {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
        -ms-flex-pack: end;
            justify-content: flex-end;
    height: 48px;
}

.styles__successMessage___1POcQ {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-top: 12px;
  color: #00cbca;
}

.styles__successMessage___1POcQ .styles__iconWrapper___dhRND {
    margin-right: 8px;
  }

.styles__accountSwitcher___2gLhg {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  margin-bottom: 20px;
}

.styles__accountSwitcher___2gLhg span {
    margin-right: 12px;
  }

.styles__linkedCTA___2AeOx {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-weight: bold;
  -webkit-box-align: left;
      -ms-flex-align: left;
          align-items: left;
  color: #2596ec;
  cursor: pointer;
}

.styles__profileHeaderBar___Qi1zZ {
  height: 100%;
  background: white;
  border-bottom: 1px solid #e0e4e7;
}

.styles__profileHeader___9JWev {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: baseline;
      -ms-flex-align: baseline;
          align-items: baseline;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.styles__contextNav___3Awf1 {
  border-bottom: 1px solid #ffffff;
}

.styles__twoFactor___ZyA9K {
  text-align: center;
  margin: 0 auto;
  width: 511px;
  margin-top: 20px;
}

.styles__twoFactor___ZyA9K .styles__twoFactorDescription___2oMjs {
    line-height: 19px;
  }

.styles__twoFactor___ZyA9K .styles__twoFactorDescription___2oMjs .styles__subheader___1MGtY {
      font-weight: 600;
    }

.styles__warning___3t1pt {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  margin: 12px 0;
}

.styles__warning___3t1pt .styles__emphasis___3yvjj {
    margin-left: 10px;
    color: #e12b0c;
  }

.styles__twoFactorLoading___4xetV {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  min-height: 125px;
}

.styles__link___1HsCS {
  text-decoration: none;
  cursor: pointer;
  color: #2596ec;
}

.styles__link___1HsCS a {
    text-decoration: none;
  }

.styles__disableModal___23AAY {
  max-width: 460px !important;
  max-height: 490px !important;
}

.styles__cardTitle___7t1MK {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  font-size: 16px;
  font-weight: 600;
}

.styles__hr___1me8W {
  -ms-flex-item-align: start;
      align-self: flex-start;
  -webkit-box-flex: 99;
      -ms-flex-positive: 99;
          flex-grow: 99;
}

.styles__horizontalLine___EMVRI {
  height: 1px;
  border: 0;
  border-top: 1px solid #e0e4e7;
  margin: 0 35px;
}

.styles__failureModal___3KTjb {
  border-top: 8px solid #e12b0c;
}

@media (max-width: 1200px) {
  .styles__convertAccount___2YjRF {
    display: flex;
    flex-flow: row wrap;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
  }
  .styles__convertAccount___2YjRF > * {
    lost-column-cycle: 2;
  }
  .styles__convertAccount___2YjRF > *:nth-child(1) {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: 99.9%;
    max-width: 99.9%;
    width: 99.9%;
  }
  .styles__convertAccount___2YjRF > *:nth-child(1):nth-child(1n) {
    margin-right: 12px;
    margin-left: 0;
  }
  .styles__convertAccount___2YjRF > *:nth-child(1):last-child {
    margin-right: 0;
  }
  .styles__convertAccount___2YjRF > *:nth-child(1):nth-child(12n) {
    margin-right: 0;
    margin-left: auto;
  }
  .styles__convertAccount___2YjRF > *:nth-child(2) {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: 99.9%;
    max-width: 99.9%;
    width: 99.9%;
  }
  .styles__convertAccount___2YjRF > *:nth-child(2):nth-child(1n) {
    margin-right: 12px;
    margin-left: 0;
  }
  .styles__convertAccount___2YjRF > *:nth-child(2):last-child {
    margin-right: 0;
  }
  .styles__convertAccount___2YjRF > *:nth-child(2):nth-child(12n) {
    margin-right: 0;
    margin-left: auto;
  }
  .styles__convertAccount___2YjRF {
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
  }
}

@media (min-width: 601px) and (max-width: 960px) {
  .styles__accountCardsContainer___sgyem {
    width: 600px;
  }
    .styles__wrapper___KGzLf .styles__card___3uHrc {
      width: 600px;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
          -ms-flex-flow: column wrap;
              flex-flow: column wrap;
    }
  .styles__twoFactor___ZyA9K {
    max-width: 600px;
  }
    .styles__twoFactor___ZyA9K .styles__twoFactorDescription___2oMjs {
      min-height: 57px;
    }
}

@media (max-width: 820px) {
  .styles__accountCardsContainer___sgyem {
    width: 1000px;
    height: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
  }
  .styles__settingsInfoCard___xcRHY {
    width: 820px;
    height: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
  }
    .styles__wrapper___KGzLf .styles__card___3uHrc {
      width: 820px;
      height: 100%;
      overflow-x: scroll;
      overflow-y: hidden;
    }
  .styles__twoFactor___ZyA9K {
    width: 820px;
    height: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
  }
    .styles__twoFactor___ZyA9K .styles__twoFactorDescription___2oMjs {
      min-height: 57px;
    }
}

.styles__marginSpacing___3BW5M {
  margin-top: 40px;
}

.styles__accessTitle___2fGBS {
  font-size: 18px;
}

.styles__notice___1xCes {
  text-align: center;
}

.styles__notice___1xCes .styles__enabledInstructions___QwylM {
    text-align: left;
    margin: 0 25%;
    min-width: 150px;
  }

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___1IbVH {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___1IbVH {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__header___nJA4f {
  background-color: #ffffff;
  padding-top: 48px;
  padding-bottom: 40px;
  border-bottom: 1px solid #e0e4e7;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.styles__header___nJA4f .styles__title___1PTT_ {
    font-size: 28px;
    line-height: 40px;
    font-weight: 400;
    letter-spacing: normal;
    font-weight: bold;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
.styles__header___nJA4f .styles__noDescription___1uva9 {
    color: #c0c9ce;
    font-style: italic;
    cursor: pointer;
  }
.styles__header___nJA4f .styles__noDescription___1uva9 a {
      text-decoration: none;
    }
.styles__tabsSection___2J_ZQ {
  background-color: #ffffff;
  border-bottom: solid 1px #e0e4e7;
  margin-top: -20px;
}
.styles__tabsSection___2J_ZQ .styles__tabs___2k-8d {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
.styles__tabsSection___2J_ZQ .styles__tab___2hfCp {
    min-width: 100px;
    padding: 20px;
    text-align: center;
    text-decoration: none;
    font-size: 14px;
    color: #445d6e
  }
.styles__tabsSection___2J_ZQ .styles__tab___2hfCp:hover {
  color: #099cec;
}
.styles__tabsSection___2J_ZQ .styles__selected___2aCVV {
    font-weight: 600;
    color: #099cec;
    border-bottom: 2px solid #099cec;
  }
.styles__content___2zlo3 {
  margin-top: 32px;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___1ZpTv {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___1ZpTv {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__createButtons___2FzAr {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  margin-top: 16px;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___2g6QI {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___2g6QI {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__item___2-BI1 {
  position: relative;
  list-style: none;
}
li.styles__item___2-BI1:first-of-type .styles__content___lHbRE {
  border-top: 1px solid #e0e4e7;
}
.styles__content___lHbRE {
  position: relative;
  padding: 20px 0;
  border-bottom: 1px solid #e0e4e7;
}
/*
Selectable Item
***************/
.styles__selectable___m6zgY .styles__content___lHbRE {
    padding-left: 24px;
  }
.styles__selectable___m6zgY .styles__selector___11sNj {
    position: absolute;
    z-index: 10;
    top: 0;
    bottom: 0;
    left: -28px;
    width: 40px;
  }
.styles__selectable___m6zgY .styles__checkbox___cCdsR {
    position: absolute;

    /* visually hidden */
    top: -9999px;
    left: -9999px;
  }
.styles__selectable___m6zgY.styles__selected___10SWA > .styles__content___lHbRE {
  background: #fbfbfc;
}
.styles__selectable___m6zgY.styles__selected___10SWA .styles__checkbox___cCdsR,
  .styles__selectable___m6zgY:hover .styles__checkbox___cCdsR {
  top: calc(50% - 10px);
  left: 0;
}
/*
Hover
***************/
.styles__hover___3yhFI:hover {
  cursor: pointer
}
.styles__hover___3yhFI:hover > .styles__content___lHbRE {
  background: #f7f7f8;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___mpNdw {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___mpNdw {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__leaveButtons___h6aGA {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  margin-top: 16px;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___dcPuX {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___dcPuX {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__actions___3u9nz::before,
  .styles__actions___3u9nz::after {
  content: ' ';
  display: table;
}
.styles__actions___3u9nz::after {
  clear: both;
}
.styles__actions___3u9nz {
  margin-bottom: 12px;
}
.styles__addBtn___3_b_g,
.styles__menuBtn___kXJA1 {
  float: right;
}
.styles__addBtn___3_b_g,
.styles__menuBtn___kXJA1 > button {
  margin-top: 0;
  margin-bottom: 0;
}
.styles__addBtn___3_b_g {
  margin-right: 0;
  margin-left: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
.styles__addBtn___3_b_g svg {
    top: 0 !important;
  }
.styles__listItem___38-yh {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap
}
.styles__listItem___38-yh > * {
  lost-column-cycle: 2;
}
.styles__listItem___38-yh > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(24.975% - 9px);
  max-width: calc(24.975% - 9px);
  width: calc(24.975% - 9px);
}
.styles__listItem___38-yh > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__listItem___38-yh > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__listItem___38-yh > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__listItem___38-yh > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(70.7625% - 3.5px);
  max-width: calc(70.7625% - 3.5px);
  width: calc(70.7625% - 3.5px);
}
.styles__listItem___38-yh > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__listItem___38-yh > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__listItem___38-yh > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__listItem___38-yh {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  padding-left: 24px;
}
.styles__listItem___38-yh > div {
  -ms-flex-item-align: center;
      align-self: center;
}
.styles__listItem___38-yh .styles__action___2S_42 {
    height: 20px;
    margin: 0;
    padding: 0;
    line-height: 20px;
    min-height: 20px;
}
.styles__listItem___38-yh .styles__action___2S_42 svg {
      top: 0;
      width: 20px !important;
      height: 20px !important;
    }
.styles__listHeader___2FF2b {

  font-size: 14px;

  line-height: 20px;

  color: #27343b;

  font-weight: 600;

  padding-left: 24px;

  text-transform: uppercase;

  color: #f7f8f9;

  white-space: nowrap;
  padding: 0 28px;
}
.styles__listHeader___2FF2b div {
    font-weight: 600;
    margin-top: 40px;
    margin-bottom: 12px;
    color: #8f9ea8;
  }
.styles__items___28gKl {
  margin-bottom: 32px;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___3-C-F {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___3-C-F {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__permission___3_uhi {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
}
.styles__permission___3_uhi > * {
  lost-column-cycle: 3;
}
.styles__permission___3_uhi > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(29.1375% - 8.5px);
  max-width: calc(29.1375% - 8.5px);
  width: calc(29.1375% - 8.5px);
}
.styles__permission___3_uhi > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__permission___3_uhi > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__permission___3_uhi > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__permission___3_uhi > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(20.8125% - 9.5px);
  max-width: calc(20.8125% - 9.5px);
  width: calc(20.8125% - 9.5px);
}
.styles__permission___3_uhi > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__permission___3_uhi > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__permission___3_uhi > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__permission___3_uhi > *:nth-child(3) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(49.95% - 6px);
  max-width: calc(49.95% - 6px);
  width: calc(49.95% - 6px);
}
.styles__permission___3_uhi > *:nth-child(3):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__permission___3_uhi > *:nth-child(3):last-child {
  margin-right: 0;
}
.styles__permission___3_uhi > *:nth-child(3):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__permission___3_uhi {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: #445d6e;
}
.styles__permissionName___3xCR7 {
  font-size: 16px;
  line-height: 22px;
  font-weight: 400;
  letter-spacing: normal;
}
.styles__submitRow___xbkgU {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
}
.styles__repoPermissions___3JDVS .styles__title___1DygX {
    font-size: 16px;
    line-height: 22px;
    font-weight: 400;
    letter-spacing: normal;
    padding-bottom: 12px;
    color: #445d6e;
  }
.styles__repoPermissions___3JDVS .styles__info___3bPQX {
    display: flex;
    flex-flow: row wrap;
    -ms-flex-wrap: nowrap;
        flex-wrap: nowrap
  }
.styles__repoPermissions___3JDVS .styles__info___3bPQX > * {
  lost-column-cycle: 2;
}
.styles__repoPermissions___3JDVS .styles__info___3bPQX > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(49.95% - 6px);
  max-width: calc(49.95% - 6px);
  width: calc(49.95% - 6px);
}
.styles__repoPermissions___3JDVS .styles__info___3bPQX > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__repoPermissions___3JDVS .styles__info___3bPQX > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__repoPermissions___3JDVS .styles__info___3bPQX > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__repoPermissions___3JDVS .styles__info___3bPQX > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(49.95% - 6px);
  max-width: calc(49.95% - 6px);
  width: calc(49.95% - 6px);
}
.styles__repoPermissions___3JDVS .styles__info___3bPQX > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__repoPermissions___3JDVS .styles__info___3bPQX > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__repoPermissions___3JDVS .styles__info___3bPQX > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__repoPermissions___3JDVS .styles__info___3bPQX {
  margin-bottom: 16px;
}
.styles__repoPermissions___3JDVS .styles__info___3bPQX .styles__card___3brvM {
      margin: 0;
}
.styles__repoPermissions___3JDVS .styles__list___12hm1 {
    padding: 12px 0;
  }
.styles__repoPermissions___3JDVS .styles__list___12hm1 ul {
      list-style: none;
      padding: 0;
      margin: 0;
    }
.styles__singleItemPermission___2Cf9P {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap
}
.styles__singleItemPermission___2Cf9P > * {
  lost-column-cycle: 4;
}
.styles__singleItemPermission___2Cf9P > *:nth-child(1) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(29.1375% - 8.5px);
  max-width: calc(29.1375% - 8.5px);
  width: calc(29.1375% - 8.5px);
}
.styles__singleItemPermission___2Cf9P > *:nth-child(1):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__singleItemPermission___2Cf9P > *:nth-child(1):last-child {
  margin-right: 0;
}
.styles__singleItemPermission___2Cf9P > *:nth-child(1):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__singleItemPermission___2Cf9P > *:nth-child(2) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(20.8125% - 9.5px);
  max-width: calc(20.8125% - 9.5px);
  width: calc(20.8125% - 9.5px);
}
.styles__singleItemPermission___2Cf9P > *:nth-child(2):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__singleItemPermission___2Cf9P > *:nth-child(2):last-child {
  margin-right: 0;
}
.styles__singleItemPermission___2Cf9P > *:nth-child(2):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__singleItemPermission___2Cf9P > *:nth-child(3) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(4.1625% - 11.5px);
  max-width: calc(4.1625% - 11.5px);
  width: calc(4.1625% - 11.5px);
}
.styles__singleItemPermission___2Cf9P > *:nth-child(3):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__singleItemPermission___2Cf9P > *:nth-child(3):last-child {
  margin-right: 0;
}
.styles__singleItemPermission___2Cf9P > *:nth-child(3):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__singleItemPermission___2Cf9P > *:nth-child(4) {
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: calc(45.7875% - 6.5px);
  max-width: calc(45.7875% - 6.5px);
  width: calc(45.7875% - 6.5px);
}
.styles__singleItemPermission___2Cf9P > *:nth-child(4):nth-child(1n) {
  margin-right: 12px;
  margin-left: 0;
}
.styles__singleItemPermission___2Cf9P > *:nth-child(4):last-child {
  margin-right: 0;
}
.styles__singleItemPermission___2Cf9P > *:nth-child(4):nth-child(12n) {
  margin-right: 0;
  margin-left: auto;
}
.styles__singleItemPermission___2Cf9P {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-bottom: 12px;
}
.styles__singleItemPermission___2Cf9P .styles__button___3CN0p {
    min-width: 24px;
    margin: 0;
    padding: 0;
}
.styles__singleItemPermission___2Cf9P input {
    color: #27343b !important;
}
.styles__message___1vVJZ {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin: 25px 0 20px
}
.styles__message___1vVJZ.styles__failed___HTgTa {
  color: #ef4a53;
}
.styles__message___1vVJZ.styles__success___dvTQJ {
  color: #00cbca;
}
.styles__message___1vVJZ .styles__iconWrapper___3ggsa {
    margin-right: 8px;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___vH39K {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___vH39K {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__main___1PCpy {
  margin-bottom: 40px;
}
.styles__main___1PCpy .styles__card___WVzHD {
    margin-bottom: 12px;
  }
.styles__permissionRow___3cV35 {
  border-top: 1px solid #e0e4e7;
  padding: 24px 12px;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___2r4rr {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___2r4rr {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__deleteButtons___psOgb {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: end;
      -ms-flex-pack: end;
          justify-content: flex-end;
  margin-top: 16px;
}

/* media queries */
/* lib/constants/sizes */
/* layout */
/* spacing */
/* misc */
/* body font sizes */
/* heading font sizes */
/* font family */
/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */
/* Purples - lightest to darkest */
/* Blues - lightest to darkest */
/* Greens - lightest to darkest */
/* Reds - lightest to darkest */
/* Yellows - lightest to darkest */
/* Grays - lightest to darkest */
/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */
/* -base background colors */
/* lib/constants/variants */
/* cohesion font colors */
/* State Colors */
/* -- These use colors not found in the styleguide -- */
/* - end -- */
/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/
/* button */
/* select */
/* input */
/* stylelint-disable value-list-comma-newline-after */
/* box-shadow for store cards */
/* component: tab */
/* Nautilus colors */
/* Publish flow */
/* Public Profile */
/* v2 */
/* https://goo.gl/Mus6xj */
/* Font sizes */
/* columns */
/* Three equal columns */
/* Rows */
/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/
@-webkit-keyframes styles__fadein___iBLia {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes styles__fadein___iBLia {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */
/* Causes text that overflows in an element to be truncated with an ellipsis. */
/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/
.styles__main___3e3tT {
  margin-bottom: 40px;
}
.styles__main___3e3tT .styles__card___2yHXN {
    margin-bottom: 12px;
  }
.styles__main___3e3tT .styles__privacyHeader___4VFJO {
    color: #8f9ea8;
    margin-top: 24px;
  }
.styles__main___3e3tT .styles__propertiesCard___14iZa .styles__propertyFields___2wQRC {
      width: 50%;
    }
.styles__main___3e3tT .styles__propertiesCard___14iZa .styles__propertySection___1StlH {
      color: #8f9ea8
    }
.styles__main___3e3tT .styles__propertiesCard___14iZa .styles__propertySection___1StlH:last-child {
  margin-top: 24px;
}
.styles__main___3e3tT .styles__propertiesCard___14iZa .styles__propertyLabel___3iyls {
      color: #8f9ea8;
    }
.styles__main___3e3tT .styles__propertiesCard___14iZa .styles__propertyLabel___3iyls input {
        color: #27343b !important;
      }
.styles__main___3e3tT .styles__propertiesCard___14iZa .styles__saveButton___2-MwL {
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-pack: end;
          -ms-flex-pack: end;
              justify-content: flex-end;
      margin-top: 16px;
    }
.styles__main___3e3tT .styles__deleteCard___3gJI- .styles__deleteDescription___3aXff {
      display: table-cell;
      width: 100%;
    }
.styles__main___3e3tT .styles__deleteCard___3gJI- .styles__deleteButton___1Qx_g {
      display: table-cell;
      vertical-align: middle;
      text-align: right;
    }
.styles__privacyText___KyaVK {
  margin-left: 12px;
}
.styles__privateTeams___1sHLM {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  margin-top: 16px;
  font-family: 'Open Sans', sans-serif;
}
.styles__privateTeams___1sHLM .styles__toggle___1mRQT {
    margin-bottom: 5px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: flex-start;
    cursor: pointer;
  }
.styles__privateTeams___1sHLM .styles__toggle___1mRQT:last-child {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    padding-bottom: 0;
  }

/*! 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, /* 1 */
figcaption,
figure,
footer,
header,
main, /* 2 */
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, /* 1 */
[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 */
  -webkit-text-decoration: underline dotted;
          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 {
  -webkit-box-sizing: content-box;
          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"], /* 1 */
[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 {
  -webkit-box-sizing: border-box;
          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"] {
  -webkit-box-sizing: border-box;
          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 */
}

/* media queries */

/* lib/constants/sizes */

/* layout */

/* spacing */

/* misc */

/* body font sizes */

/* heading font sizes */

/* font family */

/* -----------------------------------------------------------------------------
 | Color Dictionary
----------------------------------------------------------------------------- */

/* Purples - lightest to darkest */

/* Blues - lightest to darkest */

/* Greens - lightest to darkest */

/* Reds - lightest to darkest */

/* Yellows - lightest to darkest */

/* Grays - lightest to darkest */

/* -----------------------------------------------------------------------------
 | Color Purpose Vars
----------------------------------------------------------------------------- */

/* -base background colors */

/* lib/constants/variants */

/* cohesion font colors */

/* State Colors */

/* -- These use colors not found in the styleguide -- */

/* - end -- */

/* Note: These are volumes states and not actual/valid object states.
 Added here for completion
*/

/* button */

/* select */

/* input */

/* stylelint-disable value-list-comma-newline-after */

/* box-shadow for store cards */

/* component: tab */

/* Nautilus colors */

/* Publish flow */

/* Public Profile */

/* v2 */

/* https://goo.gl/Mus6xj */

/* Font sizes */

/* columns */

/* Three equal columns */

/* Rows */

/* TODO:  Use flex. Flexbox doesn't seem to work on iOS safari/chrome
          when overriding a lost column for small devices (?)(Registration page)
*/

@-webkit-keyframes global__fadein___1lfBH {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@keyframes global__fadein___1lfBH {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* flex does not work inside firefox buttons, this is a workaround
   http://stackoverflow.com/questions/24289251/flexbox-not-working-in-buttons-in-firefox */

/* Causes text that overflows in an element to be truncated with an ellipsis. */

/*
 A little trick for vertically centering text content that doesn't wrap when
 the element's height is known.
*/

/* Base */

* {
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }

html, body {
    min-height: 100%;
    font-family: 'Open Sans', sans-serif;
    color: #27343b;
    font-size: 14px;
    overflow-x: hidden;

    /* https://goo.gl/WilEUt */
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-touch-callout: none;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

h1, h2, h3, h4, h5, h6, p {
    margin-bottom: 1em;
    margin-top: 1em;
  }

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #e0e4e7;
    margin: 1em 0;
    padding: 0;
  }

code {
    font-family: 'Ubuntu Mono', consolas, monaco, monospace;
  }

a {
    color: inherit;
  }

/* Helpers */

.wrapped {
    margin: 0 auto;
    width: 100%;
    max-width: 1280px;
  }

@media (min-width: 960px) {

  .wrapped {
    padding-left: 32px;
    padding-right: 32px;
  }
}

@media (min-width: 600px) {

  .wrapped {
    padding-left: 12px;
    padding-right: 12px;
  }
}

.wrapped {
    -webkit-box-flex: 1;
        -ms-flex: 1 auto;
            flex: 1 auto;
}

.clearfix::before, .clearfix::after {
  content: ' ';
  display: table;
}

.clearfix::after {
  clear: both;
}

a.unstyled {
    text-decoration: none;
    color: inherit;
}

a.unstyled:visited {
  color: inherit;
}

.body0 {
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
    letter-spacing: normal;
}

.body1 {
    font-size: 13px;
    line-height: 18px;
    font-weight: 400;
    letter-spacing: normal;
}

.body2 {
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    letter-spacing: normal;
}

.body3 {
    font-size: 16px;
    line-height: 22px;
    font-weight: 400;
    letter-spacing: normal;
}

.body4 {
    font-size: 18px;
    line-height: 24px;
    font-weight: 400;
    letter-spacing: normal;
}

.body5 {
    font-size: 20px;
    line-height: 28px;
    font-weight: 400;
    letter-spacing: normal;
}

.body6 {
    font-size: 22px;
    line-height: 32px;
    font-weight: 400;
    letter-spacing: normal;
}

.body7 {
    font-size: 28px;
    line-height: 40px;
    font-weight: 400;
    letter-spacing: normal;
}

.display4 {
    font-size: 112px;
    line-height: 112px;
    font-weight: 300;
    letter-spacing: -0.01em;
}

.display3 {
    font-size: 56px;
    line-height: 56px;
    font-weight: 400;
    letter-spacing: -0.005em;
}

.display2 {
    font-size: 45px;
    line-height: 64px;
    font-weight: 400;
}

.display1 {
    font-size: 38px;
    line-height: 44px;
    font-weight: 700;
}

.headline {
    font-size: 24px;
    line-height: 32px;
    font-weight: 400;
}

.title {
    font-size: 18px;
    line-height: 28px;
    font-weight: 500;
    letter-spacing: 0.005em;
}

.subhead {
    font-size: 16px;
    font-weight: 400;
    letter-spacing: 0.01em;
    line-height: 24px;
}

.pageTitle {
    font-size: 24px;
    line-height: 32px;
    color: #27343b;
    font-weight: 600;
}

.boldContent {
    font-size: 14px;
    line-height: 20px;
    color: #27343b;
    font-weight: 600;
}

.content {
    font-size: 14px;
    line-height: 20px;
    color: #27343b;
}

.tertiaryContent {
    font-size: 12px;
    line-height: 16px;
    color: #27343b;
}

.hidden {
    display: none !important;
}

.flexCentered {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
}

.Select-menu-outer {
    z-index: 5 !important;
}

