@charset "UTF-8";
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
@font-face {
  font-family: 'rs-icons';
  src: url("/fonts/rs-icons.eot");
  src: url("/fonts/rs-icons.eot?#iefix") format("embedded-opentype"), url("/fonts/rs-icons.woff") format("woff"), url("/fonts/rs-icons.ttf") format("truetype"), url("/fonts/rs-icons.svg#rs-icons") format("svg");
  font-weight: normal;
  font-style: normal; }

.rs-icon {
  display: inline-block;
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'rs-icons' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.rs-icon._curved-swap:before {
  content: "\e938"; }

.rs-icon._seat-hori:before {
  content: "\e934"; }

.rs-icon._seat-occupied:before {
  content: "\e935"; }

.rs-icon._seat-selected:before {
  content: "\e936"; }

.rs-icon._seat-vert:before {
  content: "\e937"; }

.rs-icon._public-location:before {
  content: "\e92d"; }

.rs-icon._checkbox-off:before {
  content: "\e92e"; }

.rs-icon._checkbox-on:before {
  content: "\e92f"; }

.rs-icon._radio-off:before {
  content: "\e930"; }

.rs-icon._radio-on:before {
  content: "\e931"; }

.rs-icon._map:before {
  content: "\e932"; }

.rs-icon._direction:before {
  content: "\e933"; }

.rs-icon._remove:before {
  content: "\e92b"; }

.rs-icon._filter:before {
  content: "\e92c"; }

.rs-icon._trash:before {
  content: "\e920"; }

.rs-icon._chat-bubble:before {
  content: "\e921"; }

.rs-icon._chat-bubble-favorite:before {
  content: "\e922"; }

.rs-icon._chat-bubble-outline:before {
  content: "\e923"; }

.rs-icon._facebook-letter:before {
  content: "\e924"; }

.rs-icon._flag-location:before {
  content: "\e925"; }

.rs-icon._notifications:before {
  content: "\e926"; }

.rs-icon._notifications-none:before {
  content: "\e927"; }

.rs-icon._open-panel:before {
  content: "\e928"; }

.rs-icon._upload:before {
  content: "\e929"; }

.rs-icon._user:before {
  content: "\e92a"; }

.rs-icon._exit:before, body.master3 #PopUpContainer #PopUpClose:before, body.master3 #PopUpContainer #PopUpCloseCS:before {
  content: "\e909"; }

.rs-icon._send:before {
  content: "\e90c"; }

.rs-icon._arrow-back:before {
  content: "\e90d"; }

.rs-icon._circle-address:before {
  content: "\e90e"; }

.rs-icon._down-arrow:before {
  content: "\e90f"; }

.rs-icon._flag:before {
  content: "\e910"; }

.rs-icon._link-tilted:before {
  content: "\e911"; }

.rs-icon._message:before {
  content: "\e912"; }

.rs-icon._people:before {
  content: "\e913"; }

.rs-icon._pin-number:before {
  content: "\e914"; }

.rs-icon._public:before {
  content: "\e915"; }

.rs-icon._settings:before {
  content: "\e916"; }

.rs-icon._star:before {
  content: "\e917"; }

.rs-icon._star-half:before {
  content: "\e918"; }

.rs-icon._star-outline:before {
  content: "\e919"; }

.rs-icon._star-1:before {
  content: "\e91a"; }

.rs-icon._star-2:before {
  content: "\e91b"; }

.rs-icon._star-3:before {
  content: "\e91c"; }

.rs-icon._star-4:before {
  content: "\e91d"; }

.rs-icon._star-5:before {
  content: "\e91e"; }

.rs-icon._swap-vert:before {
  content: "\e91f"; }

.rs-icon._left-thick-arrow:before {
  content: "\e905"; }

.rs-icon._right-thick-arrow:before {
  content: "\e906"; }

.rs-icon._clock:before {
  content: "\e907"; }

.rs-icon._date-picker:before {
  content: "\e908"; }

.rs-icon._plus-circle:before {
  content: "\e90a"; }

.rs-icon._uber:before {
  content: "\e90b"; }

.rs-icon._OOR:before {
  content: "\e904"; }

.rs-icon._team-trips:before {
  content: "\e900"; }

.rs-icon._benefits:before {
  content: "\e901"; }

.rs-icon._gas-container:before {
  content: "\e902"; }

.rs-icon._ghg-producers:before {
  content: "\e903"; }

.rs-icon._hide:before {
  content: "\e68e"; }

.rs-icon._move:before {
  content: "\e68f"; }

.rs-icon._cluster:before {
  content: "\e68c"; }

.rs-icon._invisible:before {
  content: "\e68d"; }

.rs-icon._challenges:before {
  content: "\e685"; }

.rs-icon._commute-summary:before {
  content: "\e686"; }

.rs-icon._contests:before {
  content: "\e687"; }

.rs-icon._heart-outline:before {
  content: "\e688"; }

.rs-icon._incentives-points:before {
  content: "\e689"; }

.rs-icon._information:before {
  content: "\e68a"; }

.rs-icon._share-outline:before {
  content: "\e68b"; }

.rs-icon._update-trip:before {
  content: "\e683"; }

.rs-icon._refresh:before {
  content: "\e684"; }

.rs-icon._bell:before {
  content: "\e65e"; }

.rs-icon._logout:before {
  content: "\e663"; }

.rs-icon._menu-v1:before {
  content: "\e675"; }

.rs-icon._menu-v2:before {
  content: "\e676"; }

.rs-icon._placeholder:before {
  content: "\e677"; }

.rs-icon._plus:before {
  content: "\e678"; }

.rs-icon._save-v2:before {
  content: "\e679"; }

.rs-icon._pin-waitlist:before {
  content: "\e681"; }

.rs-icon._sliders:before {
  content: "\e682"; }

.rs-icon._printer:before {
  content: "\e674"; }

.rs-icon._trip-profiles:before {
  content: "\e664"; }

.rs-icon._contests-won:before {
  content: "\e666"; }

.rs-icon._eye:before {
  content: "\e667"; }

.rs-icon._heart:before {
  content: "\e668"; }

.rs-icon._lock:before {
  content: "\e669"; }

.rs-icon._messages-nav:before {
  content: "\e66a"; }

.rs-icon._milestones-1:before {
  content: "\e66b"; }

.rs-icon._milestones-2:before {
  content: "\e66c"; }

.rs-icon._milestones-3:before {
  content: "\e66d"; }

.rs-icon._milestones-4:before {
  content: "\e66e"; }

.rs-icon._notification:before {
  content: "\e66f"; }

.rs-icon._store-1:before {
  content: "\e670"; }

.rs-icon._store-2:before {
  content: "\e671"; }

.rs-icon._store-3:before {
  content: "\e672"; }

.rs-icon._store-4:before {
  content: "\e673"; }

.rs-icon._grid-icon-incentives:before {
  content: "\e662"; }

.rs-icon._share:before {
  content: "\e665"; }

.rs-icon._contests-eligibility:before {
  content: "\e659"; }

.rs-icon._contests-entries:before {
  content: "\e65a"; }

.rs-icon._contests-list:before {
  content: "\e65b"; }

.rs-icon._contests-wishlist:before {
  content: "\e65c"; }

.rs-icon._general-entries:before {
  content: "\e65d"; }

.rs-icon._mailing-address:before {
  content: "\e65f"; }

.rs-icon._narrow-view:before {
  content: "\e660"; }

.rs-icon._wider-list:before {
  content: "\e661"; }

.rs-icon._language:before {
  content: "\e657"; }

.rs-icon._slider-circle-tooltip:before {
  content: "\e658"; }

.rs-icon._favorite-left:before {
  content: "\e655"; }

.rs-icon._favorite-right:before {
  content: "\e656"; }

.rs-icon._trip-types:before {
  content: "\e628"; }

.rs-icon._Bike-circle:before {
  content: "\e646"; }

.rs-icon._briefcase-circle:before {
  content: "\e647"; }

.rs-icon._bus-circle:before {
  content: "\e648"; }

.rs-icon._carpool-circle:before {
  content: "\e649"; }

.rs-icon._driver-circle:before {
  content: "\e64a"; }

.rs-icon._mentor-circle:before {
  content: "\e64b"; }

.rs-icon._passenger-circle:before {
  content: "\e64c"; }

.rs-icon._star1-circle:before {
  content: "\e64d"; }

.rs-icon._star2-circle:before {
  content: "\e64e"; }

.rs-icon._star3-circle:before {
  content: "\e64f"; }

.rs-icon._star4-circle:before {
  content: "\e650"; }

.rs-icon._star5-circle:before {
  content: "\e651"; }

.rs-icon._taxi-circle:before {
  content: "\e652"; }

.rs-icon._vanpool-circle:before {
  content: "\e653"; }

.rs-icon._Walk-circle:before {
  content: "\e654"; }

.rs-icon._help:before {
  content: "\e643"; }

.rs-icon._schedule:before {
  content: "\e644"; }

.rs-icon._Gas:before {
  content: "\e641"; }

.rs-icon._money:before {
  content: "\e642"; }

.rs-icon._dashboard:before {
  content: "\e600"; }

.rs-icon._filters:before {
  content: "\e63f"; }

.rs-icon._transit-light:before {
  content: "\e640"; }

.rs-icon._profile:before {
  content: "\e627"; }

.rs-icon._show-less:before {
  content: "\e645"; }

.rs-icon._show-more:before {
  content: "\e63e"; }

.rs-icon._next-btn:before {
  content: "\e639"; }

.rs-icon._create:before {
  content: "\e63a"; }

.rs-icon._back-btn2:before {
  content: "\e63b"; }

.rs-icon._add-date:before {
  content: "\e63c"; }

.rs-icon._delete-erase:before {
  content: "\e63d"; }

.rs-icon._alert:before {
  content: "\e636"; }

.rs-icon._checkmark-fco:before {
  content: "\e637"; }

.rs-icon._current-location:before {
  content: "\e638"; }

.rs-icon._send-email2:before {
  content: "\e62c"; }

.rs-icon._camera:before {
  content: "\e62e"; }

.rs-icon._checkmark:before {
  content: "\e62f"; }

.rs-icon._edit:before {
  content: "\e630"; }

.rs-icon._email:before {
  content: "\e631"; }

.rs-icon._expand-btn:before {
  content: "\e632"; }

.rs-icon._folder:before {
  content: "\e633"; }

.rs-icon._minimize-btn:before {
  content: "\e634"; }

.rs-icon._save:before {
  content: "\e635"; }

.rs-icon._commute-home:before {
  content: "\e609"; }

.rs-icon._initial-location:before {
  content: "\e629"; }

.rs-icon._plane:before {
  content: "\e62a"; }

.rs-icon._left-btn:before {
  content: "\e624"; }

.rs-icon._magnifyingglass:before {
  content: "\e625"; }

.rs-icon._right-btn:before {
  content: "\e626"; }

.rs-icon._subway:before {
  content: "\e602"; }

.rs-icon._cablecar:before {
  content: "\e61f"; }

.rs-icon._ferry:before {
  content: "\e620"; }

.rs-icon._streetcar:before {
  content: "\e621"; }

.rs-icon._taxi:before {
  content: "\e622"; }

.rs-icon._train:before {
  content: "\e623"; }

.rs-icon._bicycle:before {
  content: "\e61a"; }

.rs-icon._bus:before {
  content: "\e61b"; }

.rs-icon._bus-buddy:before {
  content: "\e61c"; }

.rs-icon._car-icon:before {
  content: "\e61d"; }

.rs-icon._van:before {
  content: "\e61e"; }

.rs-icon._briefcase:before {
  content: "\e601"; }

.rs-icon._contacted-icon:before {
  content: "\e603"; }

.rs-icon._directions:before {
  content: "\e604"; }

.rs-icon._end-location:before {
  content: "\e606"; }

.rs-icon._facebook:before {
  content: "\e607"; }

.rs-icon._female:before {
  content: "\e608"; }

.rs-icon._male:before {
  content: "\e60a"; }

.rs-icon._mentor:before {
  content: "\e60b"; }

.rs-icon._non-smoking:before {
  content: "\e60c"; }

.rs-icon._passenger:before {
  content: "\e60d"; }

.rs-icon._seat:before {
  content: "\e60e"; }

.rs-icon._send-email:before {
  content: "\e60f"; }

.rs-icon._smoking:before {
  content: "\e610"; }

.rs-icon._steering-wheel:before {
  content: "\e617"; }

.rs-icon._walking:before {
  content: "\e619"; }

.rs-icon._pin-active .path1:before {
  content: "\e67a";
  color: #464646; }

.rs-icon._pin-active .path2:before {
  content: "\e67b";
  margin-left: -1em;
  color: #464646; }

.rs-icon._pin-active .path3:before {
  content: "\e67c";
  margin-left: -1em;
  color: #464646; }

.rs-icon._pin-active .path4:before {
  content: "\e67d";
  margin-left: -1em;
  color: rgba(107, 211, 0, 0.2); }

.rs-icon._pin-active .path5:before {
  content: "\e67e";
  margin-left: -1em;
  color: #464646; }

.rs-icon._pin-results .path1:before {
  content: "\e67f";
  color: rgba(107, 211, 0, 0.2); }

.rs-icon._pin-results .path2:before {
  content: "\e680";
  margin-left: -1em;
  color: #464646; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.depth {
  transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1); }
  .depth > .panel {
    box-shadow: none;
    margin: 0 !important; }
  .depth.depth-0 {
    transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); }
  .depth.depth-1 {
    transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); }
  .depth.depth-2 {
    transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 8px 17px rgba(0, 0, 0, 0.2); }
  .depth.depth-3 {
    transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 17px 50px rgba(0, 0, 0, 0.19); }
  .depth.depth-4 {
    transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 16px 28px 0 rgba(0, 0, 0, 0.22); }
  .depth.depth-5 {
    transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 27px 24px 0 rgba(0, 0, 0, 0.2); }
  .depth.depth-lifted.depth-1 {
    transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); }
  .depth.depth-lifted.depth-2 {
    transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 8px 17px rgba(0, 0, 0, 0.2); }
  .depth.depth-lifted.depth-3 {
    transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 17px 50px rgba(0, 0, 0, 0.19); }
  .depth.depth-lifted.depth-4 {
    transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 16px 28px 0 rgba(0, 0, 0, 0.22); }
  .depth.depth-lifted.depth-5 {
    transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 27px 24px 0 rgba(0, 0, 0, 0.2); }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.paper:before, .paper:after {
  content: " ";
  display: table; }

.paper:after {
  clear: both; }

.paper {
  transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1), transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); }

.paper {
  background-color: #fff;
  border-color: #bdbdbd;
  border-top-color: rgba(255, 255, 255, 0.7);
  transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.bootstrap:not(.remove-bootstrap) h1, .bootstrap:not(.remove-bootstrap) h2, .bootstrap:not(.remove-bootstrap) h3, .bootstrap:not(.remove-bootstrap) h4, .bootstrap:not(.remove-bootstrap) h5, .bootstrap:not(.remove-bootstrap) h6,
.bootstrap:not(.remove-bootstrap) .h1, .bootstrap:not(.remove-bootstrap) .h2, .bootstrap:not(.remove-bootstrap) .h3, .bootstrap:not(.remove-bootstrap) .h4, .bootstrap:not(.remove-bootstrap) .h5, .bootstrap:not(.remove-bootstrap) .h6 {
  font-family: inherit;
  font-weight: 500;
  line-height: 1.1;
  color: inherit; }
  .bootstrap:not(.remove-bootstrap) h1 small,
  .bootstrap:not(.remove-bootstrap) h1 .small, .bootstrap:not(.remove-bootstrap) h2 small,
  .bootstrap:not(.remove-bootstrap) h2 .small, .bootstrap:not(.remove-bootstrap) h3 small,
  .bootstrap:not(.remove-bootstrap) h3 .small, .bootstrap:not(.remove-bootstrap) h4 small,
  .bootstrap:not(.remove-bootstrap) h4 .small, .bootstrap:not(.remove-bootstrap) h5 small,
  .bootstrap:not(.remove-bootstrap) h5 .small, .bootstrap:not(.remove-bootstrap) h6 small,
  .bootstrap:not(.remove-bootstrap) h6 .small,
  .bootstrap:not(.remove-bootstrap) .h1 small,
  .bootstrap:not(.remove-bootstrap) .h1 .small, .bootstrap:not(.remove-bootstrap) .h2 small,
  .bootstrap:not(.remove-bootstrap) .h2 .small, .bootstrap:not(.remove-bootstrap) .h3 small,
  .bootstrap:not(.remove-bootstrap) .h3 .small, .bootstrap:not(.remove-bootstrap) .h4 small,
  .bootstrap:not(.remove-bootstrap) .h4 .small, .bootstrap:not(.remove-bootstrap) .h5 small,
  .bootstrap:not(.remove-bootstrap) .h5 .small, .bootstrap:not(.remove-bootstrap) .h6 small,
  .bootstrap:not(.remove-bootstrap) .h6 .small {
    font-weight: normal;
    line-height: 1;
    color: #999999; }

.bootstrap:not(.remove-bootstrap) h1, .bootstrap:not(.remove-bootstrap) .h1,
.bootstrap:not(.remove-bootstrap) h2, .bootstrap:not(.remove-bootstrap) .h2,
.bootstrap:not(.remove-bootstrap) h3, .bootstrap:not(.remove-bootstrap) .h3 {
  margin-top: 20px;
  margin-bottom: 10px; }
  .bootstrap:not(.remove-bootstrap) h1 small,
  .bootstrap:not(.remove-bootstrap) h1 .small, .bootstrap:not(.remove-bootstrap) .h1 small,
  .bootstrap:not(.remove-bootstrap) .h1 .small,
  .bootstrap:not(.remove-bootstrap) h2 small,
  .bootstrap:not(.remove-bootstrap) h2 .small, .bootstrap:not(.remove-bootstrap) .h2 small,
  .bootstrap:not(.remove-bootstrap) .h2 .small,
  .bootstrap:not(.remove-bootstrap) h3 small,
  .bootstrap:not(.remove-bootstrap) h3 .small, .bootstrap:not(.remove-bootstrap) .h3 small,
  .bootstrap:not(.remove-bootstrap) .h3 .small {
    font-size: 65%; }

.bootstrap:not(.remove-bootstrap) h4, .bootstrap:not(.remove-bootstrap) .h4,
.bootstrap:not(.remove-bootstrap) h5, .bootstrap:not(.remove-bootstrap) .h5,
.bootstrap:not(.remove-bootstrap) h6, .bootstrap:not(.remove-bootstrap) .h6 {
  margin-top: 10px;
  margin-bottom: 10px; }
  .bootstrap:not(.remove-bootstrap) h4 small,
  .bootstrap:not(.remove-bootstrap) h4 .small, .bootstrap:not(.remove-bootstrap) .h4 small,
  .bootstrap:not(.remove-bootstrap) .h4 .small,
  .bootstrap:not(.remove-bootstrap) h5 small,
  .bootstrap:not(.remove-bootstrap) h5 .small, .bootstrap:not(.remove-bootstrap) .h5 small,
  .bootstrap:not(.remove-bootstrap) .h5 .small,
  .bootstrap:not(.remove-bootstrap) h6 small,
  .bootstrap:not(.remove-bootstrap) h6 .small, .bootstrap:not(.remove-bootstrap) .h6 small,
  .bootstrap:not(.remove-bootstrap) .h6 .small {
    font-size: 75%; }

.bootstrap:not(.remove-bootstrap) h1, .bootstrap:not(.remove-bootstrap) .h1 {
  font-size: 36px; }

.bootstrap:not(.remove-bootstrap) h2, .bootstrap:not(.remove-bootstrap) .h2 {
  font-size: 30px; }

.bootstrap:not(.remove-bootstrap) h3, .bootstrap:not(.remove-bootstrap) .h3 {
  font-size: 24px; }

.bootstrap:not(.remove-bootstrap) h4, .bootstrap:not(.remove-bootstrap) .h4 {
  font-size: 18px; }

.bootstrap:not(.remove-bootstrap) h5, .bootstrap:not(.remove-bootstrap) .h5 {
  font-size: 14px; }

.bootstrap:not(.remove-bootstrap) h6, .bootstrap:not(.remove-bootstrap) .h6 {
  font-size: 12px; }

p {
  margin: 0 0 10px; }

.lead {
  margin-bottom: 20px;
  font-size: 16px;
  font-weight: 200;
  line-height: 1.4; }
  @media (min-width: 768px) {
    .lead {
      font-size: 21px; } }

small,
.small {
  font-size: 85%; }

cite {
  font-style: normal; }

mark,
.mark {
  background-color: #fcf8e3;
  padding: .2em; }

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

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

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

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

.text-muted {
  color: #999999; }

.text-primary {
  color: #03a9f4; }

a.text-primary:hover {
  color: #0286c2; }

.text-success {
  color: #3c763d; }

a.text-success:hover {
  color: #2b542c; }

.text-info {
  color: #31708f; }

a.text-info:hover {
  color: #245269; }

.text-warning {
  color: #8a6d3b; }

a.text-warning:hover {
  color: #66512c; }

.text-danger {
  color: #a94442; }

a.text-danger:hover {
  color: #843534; }

.page-header {
  padding-bottom: 9px;
  margin: 40px 0 20px;
  border-bottom: 1px solid #eeeeee; }

ul,
ol {
  margin-top: 0;
  margin-bottom: 10px; }
  ul ul,
  ul ol,
  ol ul,
  ol ol {
    margin-bottom: 0; }

.list-unstyled, .list-inline {
  padding-left: 0;
  list-style: none; }

.list-inline {
  margin-left: -5px; }
  .list-inline > li {
    display: inline-block;
    padding-left: 5px;
    padding-right: 5px; }

dl {
  margin-top: 0;
  margin-bottom: 20px; }

dt,
dd {
  line-height: 1.42857; }

dt {
  font-weight: bold; }

dd {
  margin-left: 0; }

.dl-horizontal dd:before, .dl-horizontal dd:after {
  content: " ";
  display: table; }

.dl-horizontal dd:after {
  clear: both; }

@media (min-width: 768px) {
  .dl-horizontal dt {
    float: left;
    width: 160px;
    clear: left;
    text-align: right;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap; }
  .dl-horizontal dd {
    margin-left: 180px; } }

abbr[title],
abbr[data-original-title] {
  cursor: help;
  border-bottom: 1px dotted #999999; }

.initialism {
  font-size: 90%;
  text-transform: uppercase; }

blockquote {
  padding: 10px 20px;
  margin: 0 0 20px;
  font-size: 17.5px;
  border-left: 5px solid #eeeeee; }
  blockquote p:last-child,
  blockquote ul:last-child,
  blockquote ol:last-child {
    margin-bottom: 0; }
  blockquote footer,
  blockquote small,
  blockquote .small {
    display: block;
    font-size: 80%;
    line-height: 1.42857;
    color: #999999; }
    blockquote footer:before,
    blockquote small:before,
    blockquote .small:before {
      content: '\2014 \00A0'; }

.blockquote-reverse,
blockquote.pull-right {
  padding-right: 15px;
  padding-left: 0;
  border-right: 5px solid #eeeeee;
  border-left: 0;
  text-align: right; }
  .blockquote-reverse footer:before,
  .blockquote-reverse small:before,
  .blockquote-reverse .small:before,
  blockquote.pull-right footer:before,
  blockquote.pull-right small:before,
  blockquote.pull-right .small:before {
    content: ''; }
  .blockquote-reverse footer:after,
  .blockquote-reverse small:after,
  .blockquote-reverse .small:after,
  blockquote.pull-right footer:after,
  blockquote.pull-right small:after,
  blockquote.pull-right .small:after {
    content: '\00A0 \2014'; }

blockquote:before,
blockquote:after {
  content: ""; }

address {
  margin-bottom: 20px;
  font-style: normal;
  line-height: 1.42857; }

/* Generated by Font Squirrel (http://www.fontsquirrel.com) on August 18, 2014 */
/*@font-face {
        font-family: 'Roboto';
        src: url('/fonts/roboto/roboto-thin-webfont.eot');
        src: url('/fonts/roboto/roboto-thin-webfont.eot?#iefix') format('embedded-opentype'), url('/fonts/roboto/roboto-thin-webfont.woff') format('woff'), url('/fonts/roboto/roboto-thin-webfont.ttf') format('truetype');
        font-weight: 100;
        font-style: normal;
    }

    @font-face {
        font-family: 'Roboto';
        src: url('/fonts/roboto/roboto-thinitalic-webfont.eot');
        src: url('/fonts/roboto/roboto-thinitalic-webfont.eot?#iefix') format('embedded-opentype'), url('/fonts/roboto/roboto-thinitalic-webfont.woff') format('woff'), url('/fonts/roboto/roboto-thinitalic-webfont.ttf') format('truetype');
        font-weight: 100;
        font-style: italic;
    }*/
@font-face {
  font-family: 'Roboto';
  src: url("/fonts/roboto/roboto-light-webfont.eot");
  src: url("/fonts/roboto/roboto-light-webfont.eot?#iefix") format("embedded-opentype"), url("/fonts/roboto/roboto-light-webfont.woff") format("woff"), url("/fonts/roboto/roboto-light-webfont.ttf") format("truetype");
  font-weight: 300;
  font-style: normal; }

@font-face {
  font-family: 'Roboto';
  src: url("/fonts/roboto/roboto-lightitalic-webfont.eot");
  src: url("/fonts/roboto/roboto-lightitalic-webfont.eot?#iefix") format("embedded-opentype"), url("/fonts/roboto/roboto-lightitalic-webfont.woff") format("woff"), url("/fonts/roboto/roboto-lightitalic-webfont.ttf") format("truetype");
  font-weight: 300;
  font-style: italic; }

@font-face {
  font-family: 'Roboto';
  src: url("/fonts/roboto/roboto-regular-webfont.eot");
  src: url("/fonts/roboto/roboto-regular-webfont.eot?#iefix") format("embedded-opentype"), url("/fonts/roboto/roboto-regular-webfont.woff") format("woff"), url("/fonts/roboto/roboto-regular-webfont.ttf") format("truetype");
  font-weight: 400;
  font-style: normal; }

@font-face {
  font-family: 'Roboto';
  src: url("/fonts/roboto/roboto-italic-webfont.eot");
  src: url("/fonts/roboto/roboto-italic-webfont.eot?#iefix") format("embedded-opentype"), url("/fonts/roboto/roboto-italic-webfont.woff") format("woff"), url("/fonts/roboto/roboto-italic-webfont.ttf") format("truetype");
  font-weight: 400;
  font-style: italic; }

@font-face {
  font-family: 'Roboto';
  src: url("/fonts/roboto/roboto-medium-webfont.eot");
  src: url("/fonts/roboto/roboto-medium-webfont.eot?#iefix") format("embedded-opentype"), url("/fonts/roboto/roboto-medium-webfont.woff") format("woff"), url("/fonts/roboto/roboto-medium-webfont.ttf") format("truetype");
  font-weight: 500;
  font-style: normal; }

@font-face {
  font-family: 'Roboto';
  src: url("/fonts/roboto/roboto-mediumitalic-webfont.eot");
  src: url("/fonts/roboto/roboto-mediumitalic-webfont.eot?#iefix") format("embedded-opentype"), url("/fonts/roboto/roboto-mediumitalic-webfont.woff") format("woff"), url("/fonts/roboto/roboto-mediumitalic-webfont.ttf") format("truetype");
  font-weight: 500;
  font-style: italic; }

/*@font-face {
        font-family: 'Roboto';
        src: url('/fonts/roboto/roboto-bold-webfont.eot');
        src: url('/fonts/roboto/roboto-bold-webfont.eot?#iefix') format('embedded-opentype'), url('/fonts/roboto/roboto-bold-webfont.woff') format('woff'), url('/fonts/roboto/roboto-bold-webfont.ttf') format('truetype');
        font-weight: 700;
        font-style: normal;
    }
    @font-face {
        font-family: 'Roboto';
        src: url('/fonts/roboto/roboto-bolditalic-webfont.eot');
        src: url('/fonts/roboto/roboto-bolditalic-webfont.eot?#iefix') format('embedded-opentype'), url('/fonts/roboto/roboto-bolditalic-webfont.woff') format('woff'), url('/fonts/roboto/roboto-bolditalic-webfont.ttf') format('truetype');
        font-weight: 700;
        font-style: italic;
    }*/
/*@font-face {
        font-family: 'Roboto';
        src: url('/fonts/roboto/roboto-black-webfont.eot');
        src: url('/fonts/roboto/roboto-black-webfont.eot?#iefix') format('embedded-opentype'), url('/fonts/roboto/roboto-black-webfont.woff') format('woff'), url('/fonts/roboto/roboto-black-webfont.ttf') format('truetype');
        font-weight: 900;
        font-style: normal;
    }
    @font-face {
        font-family: 'Roboto';
        src: url('/fonts/roboto/roboto-blackitalic-webfont.eot');
        src: url('/fonts/roboto/roboto-blackitalic-webfont.eot?#iefix') format('embedded-opentype'), url('/fonts/roboto/roboto-blackitalic-webfont.woff') format('woff'), url('/fonts/roboto/roboto-blackitalic-webfont.ttf') format('truetype');
        font-weight: 900;
        font-style: italic;
    }*/
html, body {
  font-family: 'Roboto', Arial, sans-serif; }

.type-inline-with-button {
  line-height: 36px !important;
  height: 36px; }

.type-display-4 {
  font-size: 112px;
  font-weight: 300;
  color: #010101; }

.type-display-3 {
  font-size: 56px;
  font-weight: normal;
  color: #010101; }

.type-display-2 {
  font-size: 45px;
  line-height: 48px;
  font-weight: normal;
  color: #010101; }

.type-display-1 {
  font-size: 34px;
  line-height: 40px;
  font-weight: normal;
  color: #010101; }

.type-headline {
  font-size: 24px;
  line-height: 32px;
  font-weight: normal;
  color: #464646; }

.type-title {
  font-size: 20px;
  line-height: 32px;
  font-weight: 500;
  color: #464646; }

.type-subhead-2 {
  font-size: 16px;
  line-height: 28px;
  font-weight: normal;
  color: #020202; }

.type-subhead-1, .paper-list-subheader .primary-text, .paper-list .list-group-item .primary-text, .accordion-group .accordion-heading .row-text {
  font-size: 15px;
  line-height: 24px;
  font-weight: normal;
  color: #020202; }

.type-body-2, .paper-card.paper-card-expanded-commuter dl dt {
  font-size: 13px;
  line-height: 24px;
  font-weight: 500;
  color: #020202; }

.type-body-1, .table > tbody > tr > td, .paper-list .list-group-item .secondary-text, .paper-list.thin-line .list-group-item .primary-text, .paper-card.paper-card-expanded-commuter dl dd {
  font-size: 13px;
  line-height: 20px;
  font-weight: normal;
  color: #020202; }

.type-caption {
  font-size: 12px;
  line-height: 20px;
  font-weight: normal;
  color: #898989; }

.type-menu, .progress-indicator .step-number {
  font-size: 12px;
  line-height: 20px;
  font-weight: 500;
  color: #020202; }

.type-button, .paper-tabs.paper-tabs-dark .paper-tab .paper-tab-text, .paper-tabs.paper-tabs-light .paper-tab .paper-tab-text, .nav.nav-tabs > li > a, .nav.nav-tabs.nav-justified > li > a, .scrollable-tabs .scrollable-tabs-ctrl > a {
  font-size: 12px;
  font-weight: 500;
  text-transform: uppercase;
  color: #020202; }

.type-select {
  font-size: 14px;
  line-height: 15px;
  font-weight: normal;
  color: #010101; }

.type-result-heading {
  font-size: 15px;
  line-height: 16px;
  font-weight: normal;
  color: #464646; }

.type-result-data {
  font-size: 11px;
  line-height: 12px;
  font-weight: 300;
  color: #898989; }

.type-primary-data {
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 14px;
  line-height: 16px;
  color: #898989;
  font-weight: lighter; }

.type-secondary-data {
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 12px;
  line-height: 16px;
  color: #898989;
  font-weight: normal; }

.type-waiting-list {
  color: #f39c12; }

.type-seats-available {
  color: #0FB72B; }

.type-inactive {
  color: #898989; }

.type-bold {
  font-weight: bold !important; }

.mobile-header {
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 20px;
  font-weight: 500;
  color: #464646; }

.mobile-header-white {
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 20px;
  font-weight: 500;
  color: #fff; }

.secondary-title {
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #464646; }

.caption {
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 12px;
  font-weight: 300;
  color: #898989; }

.body-text {
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: #464646; }

.bootstrap:not(.remove-bootstrap) .type-inline-with-button {
  line-height: 36px !important;
  height: 36px; }

.bootstrap:not(.remove-bootstrap) .type-display-4 {
  font-size: 112px;
  font-weight: 300; }

.bootstrap:not(.remove-bootstrap) .type-display-3 {
  font-size: 56px;
  font-weight: normal; }

.bootstrap:not(.remove-bootstrap) .type-display-2 {
  font-size: 45px;
  line-height: 48px;
  font-weight: normal; }

.bootstrap:not(.remove-bootstrap) .type-display-1 {
  font-size: 34px;
  line-height: 40px;
  font-weight: normal; }

.bootstrap:not(.remove-bootstrap) .type-headline {
  font-size: 24px;
  line-height: 32px;
  font-weight: normal; }

.bootstrap:not(.remove-bootstrap) .type-title {
  font-size: 20px;
  line-height: 32px;
  font-weight: 500; }

.bootstrap:not(.remove-bootstrap) .type-subhead-2 {
  font-size: 16px;
  line-height: 28px;
  font-weight: normal; }

.bootstrap:not(.remove-bootstrap) .type-subhead-1, .bootstrap:not(.remove-bootstrap) .paper-list-subheader .primary-text, .paper-list-subheader .bootstrap:not(.remove-bootstrap) .primary-text, .bootstrap:not(.remove-bootstrap) .paper-list .list-group-item .primary-text, .paper-list .list-group-item .bootstrap:not(.remove-bootstrap) .primary-text, .bootstrap:not(.remove-bootstrap) .accordion-group .accordion-heading .row-text, .accordion-group .accordion-heading .bootstrap:not(.remove-bootstrap) .row-text {
  font-size: 15px;
  line-height: 24px;
  font-weight: normal; }

.bootstrap:not(.remove-bootstrap) .type-body-2, .bootstrap:not(.remove-bootstrap) .paper-card.paper-card-expanded-commuter dl dt, .paper-card.paper-card-expanded-commuter dl .bootstrap:not(.remove-bootstrap) dt {
  font-size: 13px;
  line-height: 24px;
  font-weight: 500; }

.bootstrap:not(.remove-bootstrap) .type-body-1, .bootstrap:not(.remove-bootstrap) .table > tbody > tr > td, .bootstrap:not(.remove-bootstrap) .paper-list .list-group-item .secondary-text, .paper-list .list-group-item .bootstrap:not(.remove-bootstrap) .secondary-text, .bootstrap:not(.remove-bootstrap) .paper-list.thin-line .list-group-item .primary-text, .paper-list.thin-line .list-group-item .bootstrap:not(.remove-bootstrap) .primary-text, .bootstrap:not(.remove-bootstrap) .paper-card.paper-card-expanded-commuter dl dd, .paper-card.paper-card-expanded-commuter dl .bootstrap:not(.remove-bootstrap) dd {
  font-size: 13px;
  line-height: 20px;
  font-weight: normal; }

.bootstrap:not(.remove-bootstrap) .type-caption {
  font-size: 12px;
  line-height: 20px;
  font-weight: normal; }

.bootstrap:not(.remove-bootstrap) .type-menu, .bootstrap:not(.remove-bootstrap) .progress-indicator .step-number, .progress-indicator .bootstrap:not(.remove-bootstrap) .step-number {
  font-size: 12px;
  line-height: 20px;
  font-weight: 500; }

.bootstrap:not(.remove-bootstrap) .type-button, .bootstrap:not(.remove-bootstrap) .paper-tabs.paper-tabs-dark .paper-tab .paper-tab-text, .paper-tabs.paper-tabs-dark .paper-tab .bootstrap:not(.remove-bootstrap) .paper-tab-text, .bootstrap:not(.remove-bootstrap) .paper-tabs.paper-tabs-light .paper-tab .paper-tab-text, .paper-tabs.paper-tabs-light .paper-tab .bootstrap:not(.remove-bootstrap) .paper-tab-text, .bootstrap:not(.remove-bootstrap) .nav.nav-tabs > li > a, .bootstrap:not(.remove-bootstrap) .scrollable-tabs .scrollable-tabs-ctrl > a, .scrollable-tabs .bootstrap:not(.remove-bootstrap) .scrollable-tabs-ctrl > a {
  font-size: 12px;
  font-weight: 500;
  text-transform: uppercase; }

.bootstrap:not(.remove-bootstrap) .type-select {
  font-size: 14px;
  line-height: 15px;
  font-weight: normal; }

.bootstrap:not(.remove-bootstrap) .type-result-heading {
  font-size: 15px;
  line-height: 16px;
  font-weight: normal;
  color: #464646; }

.bootstrap:not(.remove-bootstrap) .type-result-data {
  font-size: 11px;
  line-height: 12px;
  font-weight: 300;
  color: #898989; }

.bootstrap:not(.remove-bootstrap) .type-primary-data {
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 14px;
  line-height: 16px;
  color: #898989;
  font-weight: lighter; }

.bootstrap:not(.remove-bootstrap) .type-secondary-data {
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 12px;
  line-height: 16px;
  color: #898989;
  font-weight: normal; }

.bootstrap:not(.remove-bootstrap) .type-waiting-list {
  color: #f39c12; }

.bootstrap:not(.remove-bootstrap) .type-seats-available {
  color: #0FB72B; }

.bootstrap:not(.remove-bootstrap) .type-inactive {
  color: #898989; }

.bootstrap:not(.remove-bootstrap) .type-bold {
  font-weight: bold !important; }

.bootstrap:not(.remove-bootstrap) .mobile-header {
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 20px;
  font-weight: 500;
  color: #464646; }

.bootstrap:not(.remove-bootstrap) .mobile-header-white {
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 20px;
  font-weight: 500;
  color: #fff; }

.bootstrap:not(.remove-bootstrap) .secondary-title {
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 16px;
  font-weight: 400;
  color: #464646; }

.bootstrap:not(.remove-bootstrap) .caption {
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 12px;
  font-weight: 300;
  color: #898989; }

.bootstrap:not(.remove-bootstrap) .body-text {
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 12px;
  font-weight: 500;
  color: #464646; }

.bootstrap:not(.remove-bootstrap) .primary-text, .bootstrap:not(.remove-bootstrap) .secondary-text {
  margin: 0;
  padding: 0; }

.bootstrap:not(.remove-bootstrap) h1, .bootstrap:not(.remove-bootstrap) h2, .bootstrap:not(.remove-bootstrap) h3, .bootstrap:not(.remove-bootstrap) h4, .bootstrap:not(.remove-bootstrap) h5, .bootstrap:not(.remove-bootstrap) h6 {
  margin: 4px 0; }

.bootstrap:not(.remove-bootstrap) .prompt-text {
  color: #999999; }

.primary-text, .secondary-text {
  margin: 0;
  padding: 0; }

.ellipsis, .paper-list .list-group-item .primary-text, .paper-list.one-line .list-group-item .secondary-text, .paper-list.two-lines .list-group-item .secondary-text {
  -ms-text-overflow: ellipsis;
  text-overflow: ellipsis;
  overflow: hidden; }

.prompt-text {
  color: #999999; }

.no-wrap, .paper-list .list-group-item .primary-text, .paper-list.one-line .list-group-item .secondary-text, .paper-list.two-lines .list-group-item .secondary-text {
  white-space: nowrap; }

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

.left-text, .paper-list .list-group-item .primary-text, .paper-list .list-group-item .secondary-text {
  text-align: left; }

.not-button, .paper-list .list-group-item .secondary-text {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  background-color: transparent;
  padding: 0; }
  .not-button:focus, .paper-list .list-group-item .secondary-text:focus {
    outline: 0; }

.align-with-h5 {
  margin-top: 10px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.paper-button.fab {
  transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1), transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); }

.paper-button.raised-button {
  transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1), transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); }

.mobile-body .paper-button.paper-button-wide {
  margin: 16px 0; }

.paper-button-list .paper-button-icon {
  margin-right: 8px; }

.paper-button-list.pull-right .paper-button-icon:last-child, .paper-button-list.pull-right .paper-button-icon:only-child {
  margin-right: 0; }

.paper-button-opacity {
  opacity: 0.44 !important;
  font-size: 16px !important; }

.paper-header-color {
  color: rgba(0, 0, 0, 0.51) !important;
  font-size: 14px; }

.paper-button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  background-color: transparent;
  -webkit-border-fit: border !important;
  padding: 0;
  text-align: center;
  padding: 0;
  margin: 0;
  border: none;
  display: block;
  border-radius: 0;
  overflow: hidden; }
  .paper-button:focus {
    outline: none; }
  .paper-button::-moz-focus-inner {
    border: none;
    /* overrides extra padding in Firefox */ }
  .paper-button .paper-button:hover {
    background-color: transparent !important; }
  .paper-button::-moz-selection {
    background-color: transparent; }
  .paper-button::selection {
    background-color: transparent; }
  .paper-button::moz-selection {
    background-color: transparent; }
  .paper-button .rs-icon {
    font-size: 21px; }
    .paper-button .rs-icon._filters {
      font-size: 14px; }
  .paper-button.with-ink:active {
    background-color: #efefef;
    background-color: rgba(230, 230, 230, 0.8); }
  .paper-button.paper-button-fab {
    transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    z-index: 450;
    position: absolute;
    text-align: center;
    border-radius: 48px;
    width: 48px;
    height: 48px;
    background-color: #03a9f4; }
    .paper-button.paper-button-fab:hover, .paper-button.paper-button-fab:focus, .paper-button.paper-button-fab:active, .paper-button.paper-button-fab.is-active, .paper-button.paper-button-fab.is-hover {
      z-index: 500;
      transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
      box-shadow: 0 8px 17px rgba(0, 0, 0, 0.2); }
    .paper-button.paper-button-fab.paper-button-fab-sm {
      border-radius: 40px;
      width: 40px;
      height: 40px; }
    .paper-button.paper-button-fab.fab-bg-white {
      background-color: #fff; }
    .paper-button.paper-button-fab.fab-primary {
      color: #03a9f4; }
    .paper-button.paper-button-fab.fab-default {
      color: #434343; }
  .paper-button.paper-button-raised, .raised-button {
    position: relative;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.28);
    transition: all 0.15s ease; }
    .paper-button.paper-button-raised.is-active, .is-active.raised-button, .paper-button.paper-button-raised:active, .raised-button:active, .paper-button.paper-button-raised:focus, .raised-button:focus, .paper-button.paper-button-raised:hover, .raised-button:hover, .paper-button.paper-button-raised.is-hover, .is-hover.raised-button {
      box-shadow: 0 4px 14px 0 rgba(0, 0, 0, 0.26) !important; }
  .paper-button.paper-button-flat, .flat-button, .paper-button.paper-button-icon {
    border-radius: 0;
    background-color: transparent; }
    .paper-button.paper-button-flat.btn:hover, .btn.flat-button:hover, .paper-button.paper-button-flat.btn:focus, .btn.flat-button:focus, .paper-button.paper-button-flat.btn:active, .btn.flat-button:active, .paper-button.paper-button-flat.btn:visited, .btn.flat-button:visited, .paper-button.paper-button-flat.btn.is-hover, .btn.is-hover.flat-button, .paper-button.paper-button-icon.btn:hover, .paper-button.paper-button-icon.btn:focus, .paper-button.paper-button-icon.btn:active, .paper-button.paper-button-icon.btn:visited, .paper-button.paper-button-icon.btn.is-hover {
      background-color: transparent;
      border-color: none !important;
      box-shadow: none;
      outline: none; }
    .paper-button.paper-button-flat.btn:hover, .btn.flat-button:hover, .paper-button.paper-button-flat.btn.is-hover, .btn.is-hover.flat-button, .paper-button.paper-button-icon.btn:hover, .paper-button.paper-button-icon.btn.is-hover {
      background-color: #e6e6e6; }
    .paper-button.paper-button-flat.btn:focus, .btn.flat-button:focus, .paper-button.paper-button-icon.btn:focus {
      background-color: #d9d9d9; }
    .paper-button.paper-button-flat.btn:active, .btn.flat-button:active, .paper-button.paper-button-icon.btn:active {
      background-color: #d9d9d9; }
    .paper-button.paper-button-flat.is-disabled, .is-disabled.flat-button, .paper-button.paper-button-icon.is-disabled {
      color: #999999 !important; }
    .paper-button.paper-button-flat.btn-default, .btn-default.flat-button, .paper-button.paper-button-icon.btn-default {
      color: #333333; }
    .paper-button.paper-button-flat.btn-primary, .btn-primary.flat-button, .paper-button.paper-button-icon.btn-primary {
      color: #03a9f4; }
    .paper-button.paper-button-flat.btn-success, .btn-success.flat-button, .paper-button.paper-button-icon.btn-success {
      color: #0FB62B; }
    .paper-button.paper-button-flat.btn-info, .btn-info.flat-button, .paper-button.paper-button-icon.btn-info {
      color: #5bc0de; }
    .paper-button.paper-button-flat.btn-secondary, .btn-secondary.flat-button, .paper-button.paper-button-icon.btn-secondary {
      color: #5bc0de; }
    .paper-button.paper-button-flat.btn-warning, .btn-warning.flat-button, .paper-button.paper-button-icon.btn-warning {
      color: #f0ad4e; }
    .paper-button.paper-button-flat.btn-danger, .btn-danger.flat-button, .paper-button.paper-button-icon.btn-danger {
      color: #d9534f; }
    .paper-button.paper-button-flat.btn-link, .btn-link.flat-button, .paper-button.paper-button-icon.btn-link {
      color: #03a9f4; }
    .paper-button.paper-button-flat.btn-inactive, .btn-inactive.flat-button, .paper-button.paper-button-icon.btn-inactive {
      color: #898989; }
  .paper-button.paper-button-flat.btn.btn-default, .btn.btn-default.flat-button, .paper-button.paper-button-icon.btn.btn-default {
    color: #333333; }
  .paper-button.paper-button-flat.btn.btn-primary, .btn.btn-primary.flat-button, .paper-button.paper-button-icon.btn.btn-primary {
    color: #03a9f4; }
  .paper-button.paper-button-flat.btn.btn-success, .btn.btn-success.flat-button, .paper-button.paper-button-icon.btn.btn-success {
    color: #0FB62B; }
  .paper-button.paper-button-flat.btn.btn-info, .btn.btn-info.flat-button, .paper-button.paper-button-icon.btn.btn-info {
    color: #5bc0de; }
  .paper-button.paper-button-flat.btn.btn-secondary, .btn.btn-secondary.flat-button, .paper-button.paper-button-icon.btn.btn-secondary {
    color: #5bc0de; }
  .paper-button.paper-button-flat.btn.btn-warning, .btn.btn-warning.flat-button, .paper-button.paper-button-icon.btn.btn-warning {
    color: #f0ad4e; }
  .paper-button.paper-button-flat.btn.btn-danger, .btn.btn-danger.flat-button, .paper-button.paper-button-icon.btn.btn-danger {
    color: #d9534f; }
  .paper-button.paper-button-flat.btn.btn-link, .btn.btn-link.flat-button, .paper-button.paper-button-icon.btn.btn-link {
    color: #03a9f4; }
  .paper-button.paper-button-flat.btn.btn-inactive, .btn.btn-inactive.flat-button, .paper-button.paper-button-icon.btn.btn-inactive {
    color: #898989; }
  .paper-button.paper-button-icon, .paper-button.paper-button-raised.paper-button-icon, .paper-button-icon.raised-button {
    font-size: 16px; }
  .paper-button.paper-button-icon {
    text-align: center;
    width: 24px;
    height: 24px; }
    .paper-button.paper-button-icon:focus {
      /*outline: 1px rgba(0,0,0,0.3) solid;*/ }
    .paper-button.paper-button-icon .glyphicon, .paper-button.paper-button-icon .glyphicons, .paper-button.paper-button-icon .rs-icon {
      margin: -0.344px; }
    .paper-button.paper-button-icon .poi-icons {
      font-size: 24px; }
    .paper-button.paper-button-icon.paper-button-small, .paper-button.paper-button-icon.paper-button-small.row-icon, .paper-button.paper-button-icon.paper-button-small.row-icon.row-icon-secondary {
      font-size: 12px; }
      .paper-button.paper-button-icon.paper-button-small .glyphicon, .paper-button.paper-button-icon.paper-button-small .glyphicons, .paper-button.paper-button-icon.paper-button-small .rs-icon, .paper-button.paper-button-icon.paper-button-small.row-icon .glyphicon, .paper-button.paper-button-icon.paper-button-small.row-icon .glyphicons, .paper-button.paper-button-icon.paper-button-small.row-icon .rs-icon, .paper-button.paper-button-icon.paper-button-small.row-icon.row-icon-secondary .glyphicon, .paper-button.paper-button-icon.paper-button-small.row-icon.row-icon-secondary .glyphicons, .paper-button.paper-button-icon.paper-button-small.row-icon.row-icon-secondary .rs-icon {
        font-size: 12px;
        margin: 2.742px; }
        .paper-button.paper-button-icon.paper-button-small .glyphicon.icon-rotate, .paper-button.paper-button-icon.paper-button-small .glyphicons.icon-rotate, .paper-button.paper-button-icon.paper-button-small .rs-icon.icon-rotate, .paper-button.paper-button-icon.paper-button-small.row-icon .glyphicon.icon-rotate, .paper-button.paper-button-icon.paper-button-small.row-icon .glyphicons.icon-rotate, .paper-button.paper-button-icon.paper-button-small.row-icon .rs-icon.icon-rotate, .paper-button.paper-button-icon.paper-button-small.row-icon.row-icon-secondary .glyphicon.icon-rotate, .paper-button.paper-button-icon.paper-button-small.row-icon.row-icon-secondary .glyphicons.icon-rotate, .paper-button.paper-button-icon.paper-button-small.row-icon.row-icon-secondary .rs-icon.icon-rotate {
          transform: rotate(90deg); }
    .paper-button.paper-button-icon.paper-button-raised .glyphicon, .paper-button-icon.raised-button .glyphicon, .paper-button.paper-button-icon.paper-button-raised .glyphicons, .paper-button-icon.raised-button .glyphicons, .paper-button.paper-button-icon.paper-button-raised .rs-icon, .paper-button-icon.raised-button .rs-icon {
      margin: 5.656px; }
    .paper-button.paper-button-icon.paper-button-icon--sm {
      height: 16px;
      width: 16px; }
      .paper-button.paper-button-icon.paper-button-icon--sm .rs-icon {
        font-size: 16px;
        line-height: 16px; }
  .paper-button.paper-button-raised, .raised-button, .paper-button.paper-button-flat, .flat-button {
    border-radius: 0;
    border: 0;
    height: 36px;
    line-height: 36px;
    padding: 0 16px;
    font-size: 12px;
    font-weight: 500;
    text-transform: uppercase;
    color: #020202; }
    .paper-button.paper-button-raised.paper-button-vertical, .paper-button-vertical.raised-button, .paper-button.paper-button-flat.paper-button-vertical, .paper-button-vertical.flat-button {
      width: 36px;
      height: 88px;
      padding: 16px 0;
      text-align: center; }
    .paper-button.paper-button-raised.paper-button-small, .paper-button-small.raised-button, .paper-button.paper-button-flat.paper-button-small, .paper-button-small.flat-button {
      padding: 0 5px;
      line-height: 20px;
      height: 20px;
      line-height: 20px; }
  .paper-button.paper-button-raised, .raised-button, .paper-button.paper-button-raised.paper-button-icon, .paper-button-icon.raised-button {
    color: #fff;
    background-color: #eeeeee; }
    .paper-button.paper-button-raised.btn-default, .btn-default.raised-button, .paper-button.paper-button-raised.paper-button-icon.btn-default, .paper-button-icon.btn-default.raised-button {
      background-color: #eeeeee;
      color: #333333 !important; }
    .paper-button.paper-button-raised.btn-primary, .btn-primary.raised-button, .paper-button.paper-button-raised.paper-button-icon.btn-primary, .paper-button-icon.btn-primary.raised-button {
      background-color: #03a9f4;
      color: #ffffff !important; }
    .paper-button.paper-button-raised.btn-success, .btn-success.raised-button, .paper-button.paper-button-raised.paper-button-icon.btn-success, .paper-button-icon.btn-success.raised-button {
      background-color: #0FB62B;
      color: #ffffff !important; }
    .paper-button.paper-button-raised.btn-info, .btn-info.raised-button, .paper-button.paper-button-raised.paper-button-icon.btn-info, .paper-button-icon.btn-info.raised-button {
      background-color: #5bc0de;
      color: #ffffff !important; }
    .paper-button.paper-button-raised.btn-warning, .btn-warning.raised-button, .paper-button.paper-button-raised.paper-button-icon.btn-warning, .paper-button-icon.btn-warning.raised-button {
      background-color: #f0ad4e;
      color: #ffffff !important; }
    .paper-button.paper-button-raised.btn-danger, .btn-danger.raised-button, .paper-button.paper-button-raised.paper-button-icon.btn-danger, .paper-button-icon.btn-danger.raised-button {
      background-color: #d9534f;
      color: #ffffff !important; }
    .paper-button.paper-button-raised.btn-link, .btn-link.raised-button, .paper-button.paper-button-raised.paper-button-icon.btn-link, .paper-button-icon.btn-link.raised-button {
      background-color: #03a9f4;
      color: #ffffff !important; }
    .paper-button.paper-button-raised.btn-inactive, .btn-inactive.raised-button, .paper-button.paper-button-raised.paper-button-icon.btn-inactive, .paper-button-icon.btn-inactive.raised-button {
      color: #898989; }
    .paper-button.paper-button-raised.is-disabled, .is-disabled.raised-button, .paper-button.paper-button-raised.paper-button-icon.is-disabled, .paper-button-icon.is-disabled.raised-button {
      background-color: #eeeeee !important;
      color: #999999 !important; }
  .paper-button.paper-button-raised.btn, .btn.raised-button, .paper-button.paper-button-raised.paper-button-icon.btn, .paper-button-icon.btn.raised-button {
    color: #fff;
    background-color: #eeeeee; }
    .paper-button.paper-button-raised.btn.btn-default, .btn.btn-default.raised-button, .paper-button.paper-button-raised.paper-button-icon.btn.btn-default, .paper-button-icon.btn.btn-default.raised-button {
      background-color: #eeeeee;
      color: #333333 !important; }
    .paper-button.paper-button-raised.btn.btn-primary, .btn.btn-primary.raised-button, .paper-button.paper-button-raised.paper-button-icon.btn.btn-primary, .paper-button-icon.btn.btn-primary.raised-button {
      background-color: #03a9f4;
      color: #ffffff !important; }
    .paper-button.paper-button-raised.btn.btn-success, .btn.btn-success.raised-button, .paper-button.paper-button-raised.paper-button-icon.btn.btn-success, .paper-button-icon.btn.btn-success.raised-button {
      background-color: #0FB62B;
      color: #ffffff !important; }
    .paper-button.paper-button-raised.btn.btn-info, .btn.btn-info.raised-button, .paper-button.paper-button-raised.paper-button-icon.btn.btn-info, .paper-button-icon.btn.btn-info.raised-button {
      background-color: #5bc0de;
      color: #ffffff !important; }
    .paper-button.paper-button-raised.btn.btn-warning, .btn.btn-warning.raised-button, .paper-button.paper-button-raised.paper-button-icon.btn.btn-warning, .paper-button-icon.btn.btn-warning.raised-button {
      background-color: #f0ad4e;
      color: #ffffff !important; }
    .paper-button.paper-button-raised.btn.btn-danger, .btn.btn-danger.raised-button, .paper-button.paper-button-raised.paper-button-icon.btn.btn-danger, .paper-button-icon.btn.btn-danger.raised-button {
      background-color: #d9534f;
      color: #ffffff !important; }
    .paper-button.paper-button-raised.btn.btn-link, .btn.btn-link.raised-button, .paper-button.paper-button-raised.paper-button-icon.btn.btn-link, .paper-button-icon.btn.btn-link.raised-button {
      background-color: #03a9f4;
      color: #ffffff !important; }
    .paper-button.paper-button-raised.btn.btn-inactive, .btn.btn-inactive.raised-button, .paper-button.paper-button-raised.paper-button-icon.btn.btn-inactive, .paper-button-icon.btn.btn-inactive.raised-button {
      color: #898989; }
    .paper-button.paper-button-raised.btn.is-disabled, .btn.is-disabled.raised-button, .paper-button.paper-button-raised.paper-button-icon.btn.is-disabled, .paper-button-icon.btn.is-disabled.raised-button {
      background-color: #eeeeee !important;
      color: #999999 !important; }
  .paper-button.paper-button-raised.paper-button-icon, .paper-button-icon.raised-button {
    padding: 0;
    width: 36px;
    height: 36px; }
  .paper-button .paper-button-icon {
    display: inline-block;
    margin-left: 0px;
    margin-right: 16px; }
  .paper-button.paper-button-wide {
    width: 100%; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.paper-emphasis-relative {
  position: relative; }

.paper-emphasis-linearProgress {
  height: 3px;
  position: absolute;
  margin: 0;
  bottom: 0;
  right: 0;
  left: 0;
  overflow-x: hidden;
  background-color: transparent;
  opacity: 0;
  transition: opacity 0.2s ease-out; }
  .paper-emphasis-linearProgress:after, .paper-emphasis-linearProgress:before {
    width: 0%;
    height: 3px;
    margin: auto;
    position: absolute;
    bottom: 0;
    left: 0%;
    content: '';
    display: block;
    background-color: transparent; }
  .paper-emphasis-linearProgress:before {
    animation-delay: 0.60s; }
  .paper-emphasis-linearProgress.is-active {
    opacity: 1;
    background-color: #e6e6e6; }
    .paper-emphasis-linearProgress.is-active:after, .paper-emphasis-linearProgress.is-active:before {
      animation: load 1.5s ease-in-out infinite, load-position 1.5s linear infinite;
      background-color: #aaa; }
    .paper-emphasis-linearProgress.is-active:before {
      animation-delay: 0.60s; }
  .paper-emphasis-linearProgress.ng-animate.is-active-remove:after, .paper-emphasis-linearProgress.ng-animate.is-active-remove:before {
    animation: load 1.5s ease-in-out infinite, load-position 1.5s linear infinite; }

@keyframes load {
  0% {
    width: 0%; }
  40% {
    width: 30%; }
  45% {
    width: 32%; }
  100% {
    width: 0%; } }

@keyframes load-position {
  0% {
    left: 0%; }
  10% {
    left: 0%; }
  85% {
    left: 100%; }
  100% {
    left: 100%; } }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.has-custom-scrollbar {
  position: relative;
  overflow-y: auto;
  -ms-overflow-style: -ms-autohiding-scrollbar;
  /* Set width */
  /* Track */
  /* Handle */ }
  .has-custom-scrollbar::-webkit-scrollbar {
    width: 8px; }
  .has-custom-scrollbar::-webkit-scrollbar-track {
    display: none; }
  .has-custom-scrollbar::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: rgba(200, 200, 200, 0.8);
    box-shadow: inset 0 0 6px rgba(200, 200, 200, 0.8); }
  .has-custom-scrollbar::-webkit-scrollbar-thumb:window-inactive {
    background: rgba(201, 201, 201, 0.8); }

.has-custom-scrollbar-horizontal {
  -ms-overflow-style: -ms-autohiding-scrollbar;
  /* Height */
  /* Track */
  /* Handle */ }
  .has-custom-scrollbar-horizontal::-webkit-scrollbar {
    height: 4px; }
  .has-custom-scrollbar-horizontal::-webkit-scrollbar-track {
    display: none; }
  .has-custom-scrollbar-horizontal::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: rgba(200, 200, 200, 0.8);
    box-shadow: inset 0 0 6px rgba(200, 200, 200, 0.8); }
  .has-custom-scrollbar-horizontal::-webkit-scrollbar-thumb:window-inactive {
    background-color: rgba(201, 201, 201, 0.8); }

/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.paper-tab-text {
  -webkit-user-select: none;
  /* Chrome all / Safari all */
  -moz-user-select: none;
  /* Firefox all */
  -ms-user-select: none;
  /* IE 10+ */
  /* No support for these yet, use at own risk */
  -o-user-select: none;
  user-select: none;
  cursor: pointer; }

.paper-tab-heading-icon {
  font-size: 18px;
  height: 9px;
  top: -14px; }
  .paper-tab-heading-icon.rs-icon {
    font-size: 26px; }

.paper-tabs .paper-tab {
  border-bottom: 0.2rem solid transparent;
  border-bottom-width: 2px;
  margin-bottom: -2px;
  white-space: nowrap; }
  .paper-tabs .paper-tab:hover {
    background-color: #e6e6e6; }
  .paper-tabs .paper-tab.is-active {
    border-bottom-color: #03a9f4; }

.paper-tabs.paper-tabs-dark .paper-tab .paper-tab-text {
  color: #ccc;
  color: rgba(255, 255, 255, 0.6); }

.paper-tabs.paper-tabs-dark .paper-tab.is-active .paper-tab-text {
  color: #03a9f4; }

.paper-tabs.paper-tabs-light .paper-tab .paper-tab-text {
  color: #333;
  color: rgba(0, 0, 0, 0.6); }

.paper-tabs.paper-tabs-light .paper-tab.is-active .paper-tab-text {
  color: #03a9f4; }

.paper-tabs.tab-content-has-custom-scrollbar .tab-content {
  position: relative;
  overflow-y: auto;
  -ms-overflow-style: -ms-autohiding-scrollbar;
  /* Set width */
  /* Track */
  /* Handle */ }
  .paper-tabs.tab-content-has-custom-scrollbar .tab-content::-webkit-scrollbar {
    width: 8px; }
  .paper-tabs.tab-content-has-custom-scrollbar .tab-content::-webkit-scrollbar-track {
    display: none; }
  .paper-tabs.tab-content-has-custom-scrollbar .tab-content::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: rgba(200, 200, 200, 0.8);
    box-shadow: inset 0 0 6px rgba(200, 200, 200, 0.8); }
  .paper-tabs.tab-content-has-custom-scrollbar .tab-content::-webkit-scrollbar-thumb:window-inactive {
    background: rgba(201, 201, 201, 0.8); }

.nav.nav-tabs li a {
  -webkit-user-select: none;
  /* Chrome all / Safari all */
  -moz-user-select: none;
  /* Firefox all */
  -ms-user-select: none;
  /* IE 10+ */
  /* No support for these yet, use at own risk */
  -o-user-select: none;
  user-select: none;
  cursor: pointer; }

.nav.nav-tabs, .nav.nav-tabs.nav-justified {
  overflow-x: hidden; }
  .nav.nav-tabs > li, .nav.nav-tabs.nav-justified > li {
    border-bottom: 0.2rem solid transparent;
    border-bottom-width: 2px;
    margin-bottom: -2px;
    white-space: nowrap; }
    .nav.nav-tabs > li:hover, .nav.nav-tabs.nav-justified > li:hover {
      background-color: #e6e6e6; }
    .nav.nav-tabs > li > a, .nav.nav-tabs.nav-justified > li > a {
      border: none;
      color: #333;
      color: rgba(0, 0, 0, 0.6); }
      .nav.nav-tabs > li > a:hover, .nav.nav-tabs.nav-justified > li > a:hover {
        border: none;
        background-color: transparent;
        cursor: pointer; }
    .nav.nav-tabs > li.active, .nav.nav-tabs.nav-justified > li.active {
      border-bottom-color: #03a9f4; }
      .nav.nav-tabs > li.active > a, .nav.nav-tabs.nav-justified > li.active > a {
        border: none;
        color: #03a9f4; }

.scrollable-tabs {
  position: relative; }
  .scrollable-tabs .scrollable-tabs-ctrl-spacer > div {
    width: 40px !important; }
  .scrollable-tabs .scrollable-tabs-ctrl {
    position: absolute;
    z-index: 1;
    width: 40px;
    height: 40px;
    background-color: transparent;
    border-bottom: 0.2rem solid transparent;
    border-bottom-width: 2px;
    margin-bottom: -2px;
    white-space: nowrap; }
    .scrollable-tabs .scrollable-tabs-ctrl:hover {
      background-color: #e6e6e6; }
    .scrollable-tabs .scrollable-tabs-ctrl > a {
      position: absolute;
      padding: 10px 15px;
      line-height: 1.42857;
      text-align: center;
      color: #333;
      color: rgba(0, 0, 0, 0.6);
      width: 40px;
      height: 40px; }
      .scrollable-tabs .scrollable-tabs-ctrl > a:hover {
        border: none;
        background-color: transparent;
        cursor: pointer; }
    .scrollable-tabs .scrollable-tabs-ctrl.active {
      border-bottom-color: #03a9f4; }
      .scrollable-tabs .scrollable-tabs-ctrl.active > a {
        border: none;
        color: #03a9f4; }
    .scrollable-tabs .scrollable-tabs-ctrl.scrollable-tabs-ctrl-left-btn {
      left: 0; }
    .scrollable-tabs .scrollable-tabs-ctrl.scrollable-tabs-ctrl-right-btn {
      right: 0; }

.paper-tabs.paper-tabs-sm .nav > li > a {
  padding: 4px; }

.paper-tabs.paper-tabs-lg .nav > li > a {
  padding: 16px 0; }

.paper-tabs.paper-tabs-lg.paper-tabs-grey .nav.nav-tabs {
  background-color: #f9f9f9; }

.paper-tabs.paper-tabs-vertical {
  overflow: visible; }
  .paper-tabs.paper-tabs-vertical .nav.nav-tabs {
    min-width: 48px;
    overflow: visible; }
  .paper-tabs.paper-tabs-vertical .nav > li {
    min-height: 40px;
    max-width: 48px;
    margin-bottom: -2px; }
    .paper-tabs.paper-tabs-vertical .nav > li > a {
      padding: 0;
      margin: 0;
      width: 48px; }
    .paper-tabs.paper-tabs-vertical .nav > li:hover {
      max-width: 48px; }
    .paper-tabs.paper-tabs-vertical .nav > li.active > a {
      padding: 0;
      margin: 0; }
  .paper-tabs.paper-tabs-vertical tab-heading {
    display: block; }
  .paper-tabs.paper-tabs-vertical .paper-tab-heading-icon {
    height: 40px;
    width: 48px;
    top: 0;
    text-align: center;
    padding-top: 8px; }
  .paper-tabs.paper-tabs-vertical.paper-tabs-icons .nav > li.active {
    border-bottom: none; }
  .paper-tabs.paper-tabs-vertical.paper-tabs-icons .nav > li > a {
    color: #D0D0D0; }
    .paper-tabs.paper-tabs-vertical.paper-tabs-icons .nav > li > a.active {
      color: inherit;
      border-bottom: none;
      border-bottom-color: none; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
        For IE8 compatability

    */
body.ie8 .paper-dropdown .paper-dropdown-content-backing {
  border: 1px solid #adadad; }

body:not(.ie8) .paper-dropdown .paper-dropdown-content-wrapper {
  min-width: 100%; }

.trip-profiles-body .paper-dropdown {
  height: 100%; }
  .trip-profiles-body .paper-dropdown .paper-dropdown-title {
    width: 100%;
    height: 100%; }

.paper-dropdown {
  position: relative;
  transition: all 0 ease-in-out 0s;
  /* Make pull-left and pull-right more intuitively change paper-dropdown-title */ }
  .paper-dropdown .paper-dropdown-title {
    float: left;
    position: relative;
    z-index: 1; }
  .paper-dropdown.pull-left .paper-dropdown-title {
    float: left; }
  .paper-dropdown.pull-right .paper-dropdown-title {
    float: right; }
  .paper-dropdown .paper-dropdown-click-catcher {
    display: none; }
  .paper-dropdown .paper-dropdown-content-wrapper {
    position: absolute;
    width: auto;
    height: auto; }
    .paper-dropdown .paper-dropdown-content-wrapper.anchor-to-right {
      right: 0; }
    .paper-dropdown .paper-dropdown-content-wrapper.anchor-to-bottom {
      bottom: -24px; }
    .paper-dropdown .paper-dropdown-content-wrapper.anchor-to-top {
      top: 0; }
    .paper-dropdown .paper-dropdown-content-wrapper.anchor-to-left {
      left: 0; }
    .paper-dropdown .paper-dropdown-content-wrapper.anchor-to-vCenter {
      bottom: -150px; }
    .paper-dropdown .paper-dropdown-content-wrapper > .paper-dropdown-content {
      position: relative;
      z-index: -1;
      width: auto;
      height: auto;
      opacity: 0;
      transition: opacity 0.1s ease-in 0.15s;
      margin: 1px; }
    .paper-dropdown .paper-dropdown-content-wrapper > .paper-dropdown-content-backing {
      position: absolute;
      left: 0;
      right: 100%;
      top: 0;
      bottom: 100%;
      transition: left 0.1s ease-in-out 0s, right 0.1s ease-in-out 0s, top 0.05s ease-in-out 0.1s, bottom 0.05s ease-in-out 0.1s; }
  .paper-dropdown.is-closed .paper-dropdown-content-wrapper {
    z-index: -1;
    display: none; }
    .paper-dropdown.is-closed .paper-dropdown-content-wrapper > .paper-dropdown-content-backing {
      border-color: transparent; }
  .paper-dropdown.is-open {
    z-index: 6; }
    .paper-dropdown.is-open .paper-dropdown-title {
      z-index: 0; }
    .paper-dropdown.is-open .paper-dropdown-content-wrapper {
      z-index: 1;
      display: block;
      background-color: #fff; }
      .paper-dropdown.is-open .paper-dropdown-content-wrapper .paper-dropdown-content-backing {
        left: 0;
        right: 0;
        top: 0;
        bottom: 0; }
      .paper-dropdown.is-open .paper-dropdown-content-wrapper .paper-dropdown-content {
        z-index: 2;
        opacity: 1; }
  .paper-dropdown.ng-animate.is-closed-add .paper-dropdown-content-wrapper {
    z-index: 1; }
    .paper-dropdown.ng-animate.is-closed-add .paper-dropdown-content-wrapper > .paper-dropdown-content {
      transition: opacity 0s ease-in 0s; }
    .paper-dropdown.ng-animate.is-closed-add .paper-dropdown-content-wrapper > .paper-dropdown-content-backing {
      transition: left .1s ease-in-out 0s, right .1s ease-in-out 0s, top .1s ease-in-out 0s, bottom .1s ease-in-out 0s; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.paper-list:before, .paper-list:after {
  content: " ";
  display: table; }

.paper-list:after {
  clear: both; }

list-group:before, list-group:after {
  content: " ";
  display: table; }

list-group:after {
  clear: both; }

.paper-list .list-group-item:before, .paper-list .list-group-item:after {
  content: " ";
  display: table; }

.paper-list .list-group-item:after {
  clear: both; }

.paper-list-subheader {
  -webkit-user-select: none;
  /* Chrome all / Safari all */
  -moz-user-select: none;
  /* Firefox all */
  -ms-user-select: none;
  /* IE 10+ */
  /* No support for these yet, use at own risk */
  -o-user-select: none;
  user-select: none;
  cursor: pointer; }

.paper-list-subheader {
  height: 48px;
  padding: 16px 16px; }

.paper-list {
  margin: 0;
  padding: 8px 0; }
  .paper-list .list-group-item {
    margin: 0;
    width: 100%;
    list-style: none;
    border-radius: 0;
    padding: 16px 16px;
    background-color: transparent;
    border-color: transparent; }
    .paper-list .list-group-item .primary-text {
      -webkit-appearance: none;
      -moz-appearance: none;
      appearance: none;
      border: none;
      background-color: transparent;
      -webkit-border-fit: border !important;
      padding: 0;
      display: block; }
      .paper-list .list-group-item .primary-text:focus {
        outline: none; }
      .paper-list .list-group-item .primary-text::-moz-focus-inner {
        border: none;
        /* overrides extra padding in Firefox */ }
      .paper-list .list-group-item .primary-text:focus {
        text-decoration: underline; }
    .paper-list .list-group-item .secondary-text {
      display: block; }
      .paper-list .list-group-item .secondary-text:focus {
        text-decoration: underline; }
  .paper-list.thin-line .list-group-item {
    min-height: 24px;
    padding-top: 0px;
    padding-bottom: 0px; }
  .paper-list.one-line .list-group-item {
    min-height: 48px; }
  .paper-list.data-lines .list-group-item {
    padding: 0;
    margin: 0;
    min-height: 60px; }
  .paper-list.two-lines .list-group-item {
    min-height: 72px; }
  .paper-list.three-lines .list-group-item {
    min-height: 88px; }
  .paper-list.paper-list-with-avatar .list-group-item {
    position: relative;
    padding-left: 72px; }
    .paper-list.paper-list-with-avatar .list-group-item .avatar {
      position: absolute;
      left: 16px; }
      .paper-list.paper-list-with-avatar .list-group-item .avatar.avatar-sm {
        left: 29px; }
  .paper-list.paper-list-with-avatar.data-lines .list-group-item {
    position: relative;
    padding-left: 64px; }
    .paper-list.paper-list-with-avatar.data-lines .list-group-item .avatar {
      position: absolute;
      left: 16px; }
      .paper-list.paper-list-with-avatar.data-lines .list-group-item .avatar.avatar-sm {
        left: 29px; }
  .paper-list.paper-list-with-avatar.data-lines .avatar {
    top: 8px; }
  .paper-list.paper-list-with-divider .list-group-item {
    border-top: 1px solid;
    border-top-color: rgba(200, 200, 200, 0.8); }
    .paper-list.paper-list-with-divider .list-group-item:first-child {
      border-top: none; }
  .paper-list.max-height {
    transition: height 0.15s ease-in-out;
    position: relative;
    overflow-y: auto;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    /* Set width */
    /* Track */
    /* Handle */
    max-height: 180px; }
    .paper-list.max-height::-webkit-scrollbar {
      width: 8px; }
    .paper-list.max-height::-webkit-scrollbar-track {
      display: none; }
    .paper-list.max-height::-webkit-scrollbar-thumb {
      border-radius: 10px;
      background-color: rgba(200, 200, 200, 0.8);
      box-shadow: inset 0 0 6px rgba(200, 200, 200, 0.8); }
    .paper-list.max-height::-webkit-scrollbar-thumb:window-inactive {
      background: rgba(201, 201, 201, 0.8); }
    @media only screen and (min-height: 665px) {
      .paper-list.max-height {
        max-height: 300px; } }
    @media only screen and (min-height: 990px) {
      .paper-list.max-height {
        max-height: 300px; } }
    .paper-list.max-height.more-max-height {
      max-height: 300px; }
      @media only screen and (min-height: 665px) {
        .paper-list.max-height.more-max-height {
          max-height: 420px; } }
      @media only screen and (min-height: 990px) {
        .paper-list.max-height.more-max-height {
          max-height: 420px; } }
  .paper-list.no-padding .list-group-item {
    padding-left: 0;
    padding-right: 0; }

.list-group {
  padding: 8px 0;
  margin-bottom: 0; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.text-field-group:before, .text-field-group:after {
  content: " ";
  display: table; }

.text-field-group:after {
  clear: both; }

.text-field {
  transition: box-shadow 0.28s cubic-bezier(0.4, 0, 0.2, 1), transform 0.3s cubic-bezier(0.4, 0, 0.2, 1); }

.text-field {
  -webkit-user-select: none;
  /* Chrome all / Safari all */
  -moz-user-select: none;
  /* Firefox all */
  -ms-user-select: none;
  /* IE 10+ */
  /* No support for these yet, use at own risk */
  -o-user-select: none;
  user-select: none;
  cursor: pointer; }

.label {
  -webkit-user-select: none;
  /* Chrome all / Safari all */
  -moz-user-select: none;
  /* Firefox all */
  -ms-user-select: none;
  /* IE 10+ */
  /* No support for these yet, use at own risk */
  -o-user-select: none;
  user-select: none;
  cursor: pointer; }

.text-field {
  cursor: pointer; }

@keyframes inputHighlighter {
  from {
    background-color: #03a9f4; }
  to {
    width: 0;
    background-color: transparent; } }

.error-text {
  color: red;
  font-size: 11px;
  float: right;
  margin-top: -3px; }

.text-field, .text-field-placeholder {
  float: left;
  position: relative;
  width: 100%;
  margin-top: 0px;
  /*min-height: $text-field-single-line-height;*/ }
  .text-field:first-child, .text-field-placeholder:first-child {
    margin-top: 0; }
  .text-field .text-field, .text-field-placeholder .text-field {
    margin-top: 0; }

.text-field-placeholder.text-field-placeholder-mock-input {
  position: relative;
  width: 100%;
  background-color: white;
  min-height: 51px;
  border: 1px solid #666666;
  border-radius: 0 4px 4px 0; }

textarea {
  -moz-appearance: none;
  -webkit-appearance: none;
  outline: none;
  border: none;
  width: 100%;
  resize: vertical;
  padding: 1.2rem 0;
  min-height: 12rem;
  border-bottom: 2px solid transparent; }
  textarea:focus {
    border-bottom-color: #03a9f4; }
  textarea::-moz-selection {
    background-color: #03abf7;
    background-color: rgba(3, 169, 244, 0.5); }
  textarea::selection {
    background-color: #03abf7;
    background-color: rgba(3, 169, 244, 0.5); }

textarea.text-field {
  -moz-appearance: none;
  -webkit-appearance: none;
  outline: none;
  border: none;
  width: 100%;
  resize: vertical;
  padding: 12px 0;
  min-height: 120px;
  margin: 24px 0;
  border-bottom: 2px solid transparent; }
  textarea.text-field:focus {
    border-bottom-color: #03a9f4; }
  textarea.text-field::-moz-selection {
    background-color: #03abf7;
    background-color: rgba(3, 169, 244, 0.5); }
  textarea.text-field::selection {
    background-color: #03abf7;
    background-color: rgba(3, 169, 244, 0.5); }
  textarea.text-field.paper-card {
    padding-left: 8px;
    padding-right: 8px; }
    textarea.text-field.paper-card:focus {
      border-bottom-color: rgba(3, 169, 244, 0.5); }

.text-field {
  position: relative;
  margin: 8px 0;
  /*Here is where I'm trying to override some of the previous ptb styles*/ }
  .text-field .label {
    padding-left: 0;
    text-align: left;
    font-size: 14px;
    font-weight: normal; }
  .text-field label {
    margin-bottom: 0; }
  .text-field .text-field-highlight {
    position: absolute;
    height: 24px;
    width: 112px;
    top: 16px;
    left: 0px;
    pointer-events: none;
    opacity: 0.5; }
  .text-field input[type=text], .text-field input[type=tel], .text-field input[type=password], .text-field input[type=email]:focus ~ .text-field-highlight {
    animation: inputHighlighter 0.3s ease; }
  .text-field.text-field-single-line {
    margin: 8px 0;
    /*padding-top: $text-field-single-line-margin-top !important;*/ }
    .text-field.text-field-single-line input[type=text], .text-field.text-field-single-line input[type=tel], .text-field.text-field-single-line input[type=password], .text-field.text-field-single-line input[type=email] {
      display: block;
      width: 100%;
      margin: 0;
      border: none;
      border-bottom: 1px solid rgba(0, 0, 0, 0.12);
      font-size: 16px;
      padding: 8px 0;
      background-color: transparent;
      color: #898989;
      font-weight: 500;
      padding-top: 24px; }
      .text-field.text-field-single-line input[type=text] ~ .label, .text-field.text-field-single-line input[type=tel] ~ .label, .text-field.text-field-single-line input[type=password] ~ .label, .text-field.text-field-single-line input[type=email] ~ .label {
        font-size: 16px;
        width: 100%;
        position: absolute;
        pointer-events: none;
        left: 0;
        top: 26px;
        color: #bcbcbc;
        font-weight: 300;
        transition: 0.2s ease all;
        text-align: left; }
      .text-field.text-field-single-line input[type=text] ~ .underline, .text-field.text-field-single-line input[type=tel] ~ .underline, .text-field.text-field-single-line input[type=password] ~ .underline, .text-field.text-field-single-line input[type=email] ~ .underline {
        display: block;
        background-color: #03a9f4;
        height: 2px;
        width: 10px;
        top: 54px;
        left: 45%;
        visibility: hidden;
        position: absolute;
        transition: 0.2s ease all; }
      .text-field.text-field-single-line input[type=text]:focus ~ .label, .text-field.text-field-single-line input[type=tel]:focus ~ .label, .text-field.text-field-single-line input[type=password]:focus ~ .label, .text-field.text-field-single-line input[type=email]:focus ~ .label {
        color: #03a9f4; }
      .text-field.text-field-single-line input[type=text]:focus ~ .underline, .text-field.text-field-single-line input[type=tel]:focus ~ .underline, .text-field.text-field-single-line input[type=password]:focus ~ .underline, .text-field.text-field-single-line input[type=email]:focus ~ .underline {
        visibility: visible;
        width: 100%;
        left: 0; }
      .text-field.text-field-single-line input[type=text]:focus, .text-field.text-field-single-line input[type=text].has-value, .text-field.text-field-single-line input[type=tel]:focus, .text-field.text-field-single-line input[type=tel].has-value, .text-field.text-field-single-line input[type=password]:focus, .text-field.text-field-single-line input[type=password].has-value, .text-field.text-field-single-line input[type=email]:focus, .text-field.text-field-single-line input[type=email].has-value {
        outline: none; }
        .text-field.text-field-single-line input[type=text]:focus ~ .label, .text-field.text-field-single-line input[type=text].has-value ~ .label, .text-field.text-field-single-line input[type=tel]:focus ~ .label, .text-field.text-field-single-line input[type=tel].has-value ~ .label, .text-field.text-field-single-line input[type=password]:focus ~ .label, .text-field.text-field-single-line input[type=password].has-value ~ .label, .text-field.text-field-single-line input[type=email]:focus ~ .label, .text-field.text-field-single-line input[type=email].has-value ~ .label {
          color: #03a9f4;
          visibility: visible;
          width: 100%;
          visibility: visible;
          top: 0px;
          font-size: 12px; }
    .text-field.text-field-single-line.is-disabled {
      border-bottom: 1px dashed #9e9e9e;
      background-color: transparent; }
    .text-field.text-field-single-line.text-field-with-icon .text-field-icon {
      display: block;
      text-align: center;
      width: 48px;
      height: 48px;
      position: absolute;
      top: 4px; }
      .text-field.text-field-single-line.text-field-with-icon .text-field-icon .glyphicon, .text-field.text-field-single-line.text-field-with-icon .text-field-icon .glyphicons, .text-field.text-field-single-line.text-field-with-icon .text-field-icon .rs-icon {
        font-size: 24px;
        text-align: center;
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        margin: 6px 12px;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-align: center;
            align-items: center; }
    .text-field.text-field-single-line.text-field-with-icon input[type=text], .text-field.text-field-single-line.text-field-with-icon input[type=tel], .text-field.text-field-single-line.text-field-with-icon input[type=password], .text-field.text-field-single-line.text-field-with-icon input[type=email] {
      padding-left: 48px; }
      .text-field.text-field-single-line.text-field-with-icon input[type=text] ~ .label, .text-field.text-field-single-line.text-field-with-icon input[type=tel] ~ .label, .text-field.text-field-single-line.text-field-with-icon input[type=password] ~ .label, .text-field.text-field-single-line.text-field-with-icon input[type=email] ~ .label {
        left: 48px; }
    .text-field.text-field-single-line.text-field-with-icon .text-field-highlight {
      left: 48px; }
    .text-field.text-field-single-line.text-field-with-validation {
      min-height: 84px; }
      .text-field.text-field-single-line.text-field-with-validation .text-field-error-message-holder {
        float: left;
        width: 100%;
        height: 32px;
        margin-bottom: 8px; }
      .text-field.text-field-single-line.text-field-with-validation .text-field-error-message {
        font-size: 16px;
        line-height: 28px;
        font-weight: normal;
        color: #020202;
        color: #f0ad4e; }
  .text-field.text-field-ptb {
    padding: 0;
    /*min-height: $text-field-single-line-height;*/
    padding-top: 12px;
    padding-left: 8px;
    padding-right: 8px;
    margin-bottom: 4px; }
    .text-field.text-field-ptb:hover {
      /*background-color: #ececec;*/ }
    .text-field.text-field-ptb .text-field-highlight {
      height: 16px;
      width: 112px;
      top: 12px;
      left: 8px; }
    .text-field.text-field-ptb .label {
      position: absolute;
      top: 12px;
      left: 0px; }
      .text-field.text-field-ptb .label.label-label {
        color: #5bc0de; }
      .text-field.text-field-ptb .label.label-placeholder {
        opacity: 0.6;
        color: #000; }
    .text-field.text-field-ptb::moz-selection {
      background-color: transparent; }
    .text-field.text-field-ptb::-moz-selection {
      background-color: transparent; }
    .text-field.text-field-ptb::selection {
      background-color: transparent; }
    .text-field.text-field-ptb .glyphicon::moz-selection {
      background-color: transparent; }
    .text-field.text-field-ptb .glyphicon::-moz-selection {
      background-color: transparent; }
    .text-field.text-field-ptb .glyphicon::selection {
      background-color: transparent; }
    .text-field.text-field-ptb .underline {
      display: block !important;
      border: 1px solid;
      border-top: none;
      position: absolute;
      top: 36px;
      left: 8px;
      right: 8px;
      height: 2px;
      border-color: #959595;
      border-top-color: transparent;
      background-color: transparent;
      left: 40px; }
      .text-field.text-field-ptb .underline::after {
        display: block;
        content: "";
        position: absolute;
        top: 0;
        left: 50%;
        right: 50%;
        bottom: 0;
        transition: left 0.1s ease-out, right 0.1s ease-out;
        background-color: transparent; }
    .text-field.text-field-ptb > input[type=text], .text-field.text-field-ptb input[type=tel], .text-field.text-field-ptb input[type=password], .text-field.text-field-ptb input[type=email] {
      -moz-appearance: none;
      -webkit-appearance: none;
      outline: none;
      border: none;
      padding: 0;
      width: 100%;
      background-color: transparent;
      min-height: 19px;
      padding-left: 8px;
      padding-right: 8px;
      /*max-height: $text-field-single-line-height - ($text-field-vertical-padding*2);*/
      font-size: 14px;
      font-weight: normal; }
    .text-field.text-field-ptb .text-field-inset-icon {
      position: absolute;
      left: 8px;
      font-size: 20px; }
      .text-field.text-field-ptb .text-field-inset-icon .rs-icon._initial-location {
        color: #0fb62b; }
      .text-field.text-field-ptb .text-field-inset-icon .rs-icon._end-location {
        color: #e73d38; }
    .text-field.text-field-ptb.thin-line {
      min-height: 24px;
      padding-top: 4px; }
      .text-field.text-field-ptb.thin-line .underline {
        display: block !important;
        border: 1px solid;
        border-top: none;
        position: absolute;
        top: 36px;
        left: 8px;
        right: 8px;
        height: 2px;
        border-color: #959595;
        border-top-color: transparent;
        background-color: transparent; }
    .text-field.text-field-ptb.is-focused .underline::after {
      left: 0;
      right: 0;
      background-color: #0094ff; }
    .text-field.text-field-ptb.is-focused:hover {
      background-color: transparent; }
    .text-field.text-field-ptb.with-icon .text-field-highlight {
      left: 40px; }
    .text-field.text-field-ptb.with-icon > input[type=text], .text-field.text-field-ptb.with-icon input[type=tel], .text-field.text-field-ptb.with-icon input[type=password], .text-field.text-field-ptb.with-icon input[type=email] {
      padding-left: 32px; }
    .text-field.text-field-ptb.with-icon .label {
      left: 40px; }

.screen-content .row .text-field-with-icon .text-field-icon {
  left: -12px; }

.text-field.text-field-ptb:before, .text-field.text-field-ptb:after {
  content: " ";
  display: table; }

.text-field.text-field-ptb:after {
  clear: both; }

body.ie8 .text-field.text-field-ptb.is-active {
  border: 1px solid #adadad; }

.text-field.text-field-ptb.is-active {
  transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
  background-color: #fff;
  position: absolute;
  z-index: 500;
  /*top: $text-field-ptb-padding * -1;*/
  padding: 16px 8px 0;
  background-color: #fff;
  border-color: #bdbdbd;
  border-top-color: rgba(255, 255, 255, 0.7); }
  .text-field.text-field-ptb.is-active:hover {
    background-color: #fff; }
  .text-field.text-field-ptb.is-active .text-field-highlight {
    display: none;
    opacity: 0; }
  .text-field.text-field-ptb.is-active .autocomplete-suggestion-list:before, .text-field.text-field-ptb.is-active .autocomplete-suggestion-list:after {
    content: " ";
    display: table; }
  .text-field.text-field-ptb.is-active .autocomplete-suggestion-list:after {
    clear: both; }
  .text-field.text-field-ptb.is-active > input[type=text], .text-field.text-field-ptb.is-active input[type=tel], .text-field.text-field-ptb.is-active input[type=password], .text-field.text-field-ptb.is-active input[type=email] {
    margin-bottom: 8px; }
  .text-field.text-field-ptb.is-active .label {
    top: 16px; }
  .text-field.text-field-ptb.is-active .autocomplete-suggestion-list {
    float: left;
    width: 100%;
    margin-top: 8px; }
    .text-field.text-field-ptb.is-active .autocomplete-suggestion-list li {
      list-style: none; }
    .text-field.text-field-ptb.is-active .autocomplete-suggestion-list .list-group-item {
      max-height: 56px; }
    .text-field.text-field-ptb.is-active .autocomplete-suggestion-list .autocomplete-suggestion {
      float: left; }
  .text-field.text-field-ptb.is-active .underline {
    top: 44px; }
  .text-field.text-field-ptb.is-active.has-max-height .autocomplete-suggestion-list {
    max-height: 224px;
    position: relative;
    overflow-y: auto;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    /* Set width */
    /* Track */
    /* Handle */ }
    .text-field.text-field-ptb.is-active.has-max-height .autocomplete-suggestion-list::-webkit-scrollbar {
      width: 8px; }
    .text-field.text-field-ptb.is-active.has-max-height .autocomplete-suggestion-list::-webkit-scrollbar-track {
      display: none; }
    .text-field.text-field-ptb.is-active.has-max-height .autocomplete-suggestion-list::-webkit-scrollbar-thumb {
      border-radius: 10px;
      background-color: rgba(200, 200, 200, 0.8);
      box-shadow: inset 0 0 6px rgba(200, 200, 200, 0.8); }
    .text-field.text-field-ptb.is-active.has-max-height .autocomplete-suggestion-list::-webkit-scrollbar-thumb:window-inactive {
      background: rgba(201, 201, 201, 0.8); }

.text-field-group > .text-field-addon {
  float: left;
  text-align: center;
  width: 40px;
  height: 40px;
  margin-right: 16px; }
  .text-field-group > .text-field-addon .text-field-icon {
    margin-top: 8px; }

.text-field-group > .text-field, .text-field-group > .text-field-placeholder {
  width: 70%;
  width: calc(100% - 56px); }

/***************************************************************************************
            
      Temp fix for the input fields using md-input-row-fix for the iOS app approval
            
****************************************************************************************/
.md-input-fix {
  margin: 8px 0;
  width: 100%;
  display: block;
  border: none;
  padding: 24px 0 10px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  transition: all 0.3s cubic-bezier(0.64, 0.09, 0.08, 1);
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 96%, #03a9f4 4%);
  background-position: -768px 0;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  color: #898989;
  font-weight: 500; }
  .md-input-fix:focus, .md-input-fix:valid {
    box-shadow: none;
    outline: none;
    background-position: 0 0; }
    .md-input-fix:focus::-webkit-input-placeholder, .md-input-fix:valid::-webkit-input-placeholder {
      color: #03a9f4;
      font-size: 11px;
      transform: translateY(-20px);
      visibility: visible !important; }

.md-input-row-fix {
  position: relative;
  margin-top: 24px;
  /* LABEL ======================================= */
  /* active state */
  /* BOTTOM BARS ================================= */
  /* active state */
  /* HIGHLIGHTER ================================== */
  /* active state */
  /* ANIMATIONS ================ */ }
  .md-input-row-fix input {
    font-size: 16px;
    padding: 8px 8px 8px 0;
    display: block;
    width: 100%;
    border: none;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    color: #898989;
    font-weight: 500; }
  .md-input-row-fix input:focus {
    outline: none; }
  .md-input-row-fix label {
    color: #999;
    font-size: 16px;
    font-weight: normal;
    position: absolute;
    pointer-events: none;
    left: 0px;
    top: 12px;
    transition: 0.2s ease all;
    -moz-transition: 0.2s ease all;
    -webkit-transition: 0.2s ease all; }
  .md-input-row-fix input:focus ~ label, .md-input-row-fix input:valid ~ label {
    top: -12px;
    font-size: 12px;
    color: #03a9f4; }
  .md-input-row-fix .bar {
    position: relative;
    display: block;
    width: 100%; }
  .md-input-row-fix .bar:before, .md-input-row-fix .bar:after {
    content: '';
    height: 2px;
    width: 0;
    bottom: 1px;
    position: absolute;
    background: #03a9f4;
    transition: 0.2s ease all;
    -moz-transition: 0.2s ease all;
    -webkit-transition: 0.2s ease all; }
  .md-input-row-fix .bar:before {
    left: 50%; }
  .md-input-row-fix .bar:after {
    right: 50%; }
  .md-input-row-fix input:focus ~ .bar:before, .md-input-row-fix input:focus ~ .bar:after {
    width: 50%; }
  .md-input-row-fix .highlight {
    position: absolute;
    height: 60%;
    width: 100px;
    top: 25%;
    left: 0;
    pointer-events: none;
    opacity: 0.5; }
  .md-input-row-fix input:focus ~ .highlight {
    animation: inputHighlighter 0.3s ease; }

@keyframes inputHighlighter {
  from {
    background: #5264AE; }
  to {
    width: 0;
    background: transparent; } }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.with-ink:hover {
  background-color: #efefef;
  background-color: rgba(230, 230, 230, 0.8); }

.with-ink:active, .with-ink:focus {
  background-color: #efefef !important;
  background-color: rgba(230, 230, 230, 0.8) !important; }

.screen-content .with-ink:active, .screen-content .with-ink:focus,
.row.with-ink:active,
.row.with-ink:focus,
.list-group-item.with-ink:active,
.list-group-item.with-ink:focus,
.with-ink.with-ink-dark:active,
.with-ink.with-ink-dark:focus {
  background-color: #f0f0f0 !important;
  background-color: rgba(200, 200, 200, 0.25) !important; }

.screen-content .with-ink:hover,
.row.with-ink:hover,
.list-group-item.with-ink:hover,
.with-ink.with-ink-dark:hover {
  background-color: #f0f0f0;
  background-color: rgba(200, 200, 200, 0.25); }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.paper-button-group {
  float: left; }
  .paper-button-group:before, .paper-button-group:after {
    content: " ";
    display: table; }
  .paper-button-group:after {
    clear: both; }
  .paper-button-group .paper-button-group-button {
    float: left;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    background-color: transparent;
    -webkit-border-fit: border !important;
    padding: 0; }
    .paper-button-group .paper-button-group-button:focus {
      outline: none; }
    .paper-button-group .paper-button-group-button::-moz-focus-inner {
      border: none;
      /* overrides extra padding in Firefox */ }
  .paper-button-group.paper-button-group-vertical {
    width: 48px; }
    .paper-button-group.paper-button-group-vertical .paper-button-group-button {
      width: 100%;
      height: 40px;
      font-size: 23px;
      color: #D0D0D0; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.ptb-is-open .mobile-screen .app-bar {
  z-index: -1 !important;
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  position: static !important; }

.ptb-is-open .mobile-screen .screen-content.with-ptbs {
  height: 100%;
  z-index: 40;
  top: 0; }

.mobile-screen {
  /*position:absolute;*/
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  background-color: #fff;
  min-height: 100%;
  padding-top: 56px; }
  .mobile-screen.with-app-bar-tabs {
    padding-top: 92px; }
  .mobile-screen.no-app-bar {
    padding-top: 0; }
    .mobile-screen.no-app-bar .screen-content.with-ptbs {
      top: 0; }
  .mobile-screen .screen-content {
    width: 100%;
    height: 100%;
    position: relative;
    padding: 0;
    /*padding-top: $mobile-screen-padding-top;*/
    padding-left: 16px;
    padding-right: 16px;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch; }
    .mobile-screen .screen-content.with-ptbs {
      height: calc(100% - 56px);
      position: absolute;
      top: 56px; }
    .mobile-screen .screen-content .no-padding-h {
      padding-left: 0 !important;
      padding-right: 0 !important; }
  .mobile-screen .mobile-screen {
    position: absolute; }
  .mobile-screen .fixed-map-container {
    height: 400px;
    position: relative; }

body .nested-mobile-view {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; }
  body .nested-mobile-view:empty {
    display: none; }

body .mobile-main-view > .mobile-screen {
  z-index: 1; }

body .nested-mobile-view {
  z-index: 20; }
  body .nested-mobile-view .nested-mobile-view {
    z-index: 30; }
    body .nested-mobile-view .nested-mobile-view .nested-mobile-view {
      z-index: 40; }
      body .nested-mobile-view .nested-mobile-view .nested-mobile-view .nested-mobile-view {
        z-index: 50; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.progress-indicator {
  border-radius: 24px;
  width: 24px;
  height: 24px;
  position: relative;
  text-align: center;
  background-color: #03a9f4;
  color: #fff; }
  .progress-indicator .step-number {
    color: #fff;
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0; }
  .progress-indicator::after {
    display: inline-block;
    text-decoration: none;
    *display: inline;
    *zoom: 1;
    vertical-align: middle;
    font-family: "Glyphicons Regular";
    content: "";
    border-radius: 24px;
    width: 24px;
    height: 24px;
    line-height: 24px;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    background-color: #0FB62B;
    color: #fff; }
  .progress-indicator.is-completed {
    background-color: transparent;
    color: transparent; }
    .progress-indicator.is-completed .step-number {
      color: transparent; }
    .progress-indicator.is-completed::after {
      opacity: 1; }

.row .progress-indicator.row-icon {
  border-radius: 24px;
  width: 24px;
  height: 24px;
  margin: 12px; }

accordion, .accordion {
  display: block; }
  accordion:before, accordion:after, .accordion:before, .accordion:after {
    content: " ";
    display: table; }
  accordion:after, .accordion:after {
    clear: both; }

a.accordion-toggle:hover {
  color: #020202;
  text-decoration: none;
  cursor: pointer; }

.accordion-toggle, .accordion-heading {
  color: #020202; }
  .accordion-toggle:before, .accordion-toggle:after, .accordion-heading:before, .accordion-heading:after {
    content: " ";
    display: table; }
  .accordion-toggle:after, .accordion-heading:after {
    clear: both; }

.accordion-group {
  border-bottom: 1px solid #eeeeee;
  margin-bottom: 0;
  box-shadow: none; }
  .accordion-group .row {
    margin: 0; }
  .accordion-group .accordion-heading .row-text {
    margin-top: 12px; }
  .accordion-group .accordion-body {
    /*padding: $accordion-body-padding-vertical $mobile-screen-padding-horizontal;*/ }

.screen-content .accordion-group {
  margin: 0 -16px; }
  .screen-content .accordion-group .row.accordion-heading {
    margin: 0; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.address {
  max-width: 100%; }
  .address .ellipsis, .address .paper-list .list-group-item .primary-text, .paper-list .list-group-item .address .primary-text, .address .paper-list.one-line .list-group-item .secondary-text, .paper-list.one-line .list-group-item .address .secondary-text, .address .paper-list.two-lines .list-group-item .secondary-text, .paper-list.two-lines .list-group-item .address .secondary-text {
    max-width: 100%; }
  .address.address-listItem {
    -webkit-user-select: none;
    /* Chrome all / Safari all */
    -moz-user-select: none;
    /* Firefox all */
    -ms-user-select: none;
    /* IE 10+ */
    /* No support for these yet, use at own risk */
    -o-user-select: none;
    user-select: none;
    cursor: pointer; }
  .address.address-listItem .address-title, .address.address-deleteDialogue .address-title {
    cursor: pointer;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    background-color: transparent;
    -webkit-border-fit: border !important;
    padding: 0;
    font-size: 14px;
    font-weight: bold;
    margin-top: 0;
    margin-bottom: 10px;
    max-width: 100%; }
    .address.address-listItem .address-title:focus, .address.address-deleteDialogue .address-title:focus {
      outline: none; }
    .address.address-listItem .address-title::-moz-focus-inner, .address.address-deleteDialogue .address-title::-moz-focus-inner {
      border: none;
      /* overrides extra padding in Firefox */ }
    .address.address-listItem .address-title:last-child, .address.address-deleteDialogue .address-title:last-child {
      margin-bottom: 0; }
  .address.address-listItem .address-street, .address.address-deleteDialogue .address-street {
    cursor: pointer;
    padding: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    background-color: transparent;
    -webkit-border-fit: border !important;
    padding: 0;
    font-size: 14px;
    margin-top: 0;
    margin-bottom: 10px;
    max-width: 100%; }
    .address.address-listItem .address-street:focus, .address.address-deleteDialogue .address-street:focus {
      outline: none; }
    .address.address-listItem .address-street::-moz-focus-inner, .address.address-deleteDialogue .address-street::-moz-focus-inner {
      border: none;
      /* overrides extra padding in Firefox */ }
    .address.address-listItem .address-street:last-child, .address.address-deleteDialogue .address-street:last-child {
      margin-bottom: 0; }
    .address.address-listItem .address-street.has-address-name, .address.address-deleteDialogue .address-street.has-address-name {
      /*margin-top: - $address-street-has-address-name-margin-top;*/ }
  .address.address-deleteDialogue .address-buttons {
    text-align: center; }

.is-deletable .address {
  padding-right: 40px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.spa-side-nav {
  display: none; }

#spaRemoveContentTarget.contains-side-nav {
  position: relative; }
  @media (max-width: 1088px) {
    #spaRemoveContentTarget.contains-side-nav #MasterMainContent {
      padding-left: 8px; }
    #spaRemoveContentTarget.contains-side-nav #SiteMapDiv {
      padding-left: 2px !important; } }
  @media (max-width: 1070px) {
    #spaRemoveContentTarget.contains-side-nav #MasterMainContent {
      padding-left: 18px; }
    #spaRemoveContentTarget.contains-side-nav #SiteMapDiv {
      padding-left: 42px !important; } }
  @media (max-width: 1060px) {
    #spaRemoveContentTarget.contains-side-nav #MasterMainContent {
      padding-left: 32px; }
    #spaRemoveContentTarget.contains-side-nav #SiteMapDiv {
      padding-left: 42px !important; } }
  @media (max-width: 1050px) {
    #spaRemoveContentTarget.contains-side-nav #MasterMainContent {
      padding-left: 62px; }
    #spaRemoveContentTarget.contains-side-nav #SiteMapDiv {
      padding-left: 52px !important; } }

.spa-side-nav-wrapper {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0; }
  .spa-side-nav-wrapper * {
    box-sizing: border-box; }

.spa-sticky-header-footer .spa-side-nav._V3, .spa-side-nav-wrapper .spa-side-nav._V3 {
  transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 8px 17px rgba(0, 0, 0, 0.2);
  display: block;
  position: absolute;
  top: 0;
  width: 50px;
  bottom: 0;
  left: 0;
  background: #fff;
  z-index: 1001; }
  .spa-sticky-header-footer .spa-side-nav._V3 .spa-side-nav-item, .spa-side-nav-wrapper .spa-side-nav._V3 .spa-side-nav-item {
    color: #999;
    width: 50px;
    height: 50px;
    text-align: center;
    padding: 12px;
    font-size: 25px;
    cursor: pointer;
    border-bottom: 1px solid #efefef;
    text-decoration: none; }
    .spa-sticky-header-footer .spa-side-nav._V3 .spa-side-nav-item:hover, .spa-sticky-header-footer .spa-side-nav._V3 .spa-side-nav-item.active, .spa-side-nav-wrapper .spa-side-nav._V3 .spa-side-nav-item:hover, .spa-side-nav-wrapper .spa-side-nav._V3 .spa-side-nav-item.active {
      /*color:#fff;*/
      color: #03a9f4; }

.spa-sticky-header-footer .spa-side-nav._V4, .spa-side-nav-wrapper .spa-side-nav._V4 {
  transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 8px 17px rgba(0, 0, 0, 0.2);
  position: absolute;
  top: 0;
  width: 50px;
  bottom: 0;
  left: 0;
  background: #484848;
  color: #fff;
  z-index: 1001;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  overflow: hidden;
  transition: width 250ms;
  transition-delay: 300ms; }
  .spa-sticky-header-footer .spa-side-nav._V4.is-expanded, .spa-side-nav-wrapper .spa-side-nav._V4.is-expanded {
    width: 250px; }
  .spa-sticky-header-footer .spa-side-nav._V4 .spa-side-nav-item, .spa-side-nav-wrapper .spa-side-nav._V4 .spa-side-nav-item {
    width: 42px;
    height: 50px;
    line-height: 50px; }
  .spa-sticky-header-footer .spa-side-nav._V4._force-close, .spa-side-nav-wrapper .spa-side-nav._V4._force-close {
    transition-delay: 0; }
    .spa-sticky-header-footer .spa-side-nav._V4._force-close:hover, .spa-side-nav-wrapper .spa-side-nav._V4._force-close:hover {
      width: 50px; }
  .spa-sticky-header-footer .spa-side-nav._V4._completely-hidden, .spa-side-nav-wrapper .spa-side-nav._V4._completely-hidden {
    width: 0; }

.spa-sticky-header-footer .spa-side-nav--row, .spa-side-nav-wrapper .spa-side-nav--row {
  background: #484848;
  color: #fff;
  display: -ms-flexbox;
  display: flex;
  line-height: 50px;
  height: 50px;
  cursor: pointer;
  border: none;
  padding: 0;
  margin: 0;
  text-decoration: none;
  text-align: left;
  white-space: nowrap; }
  .spa-sticky-header-footer .spa-side-nav--row:hover, .spa-side-nav-wrapper .spa-side-nav--row:hover {
    background-color: #0288d1;
    color: #ffffff; }
  .spa-sticky-header-footer .spa-side-nav--row._active .spa-side-nav--icon, .spa-side-nav-wrapper .spa-side-nav--row._active .spa-side-nav--icon {
    border-color: #0288d1;
    background-color: #0288d1;
    color: #ffffff; }

.spa-sticky-header-footer .spa-side-nav--icon, .spa-side-nav-wrapper .spa-side-nav--icon {
  width: 50px;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  font-size: 20px;
  text-align: center;
  -ms-flex: 0 0 auto;
      flex: 0 0 auto; }

.spa-sticky-header-footer .spa-side-nav--text, .spa-side-nav-wrapper .spa-side-nav--text {
  -ms-flex: 0 1 auto;
      flex: 0 1 auto;
  padding-left: 8px;
  font-size: 16px; }

chat-thread-bar {
  z-index: 499; }

.main {
  position: relative; }
  .main .map-root {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    overflow: hidden; }
  .main.main-find-commute-options {
    width: 100%;
    height: 100%;
    min-height: 800px; }
    @media only screen and (max-height: 530px) {
      .main.main-find-commute-options {
        min-height: 594px; } }
    @media only screen and (min-height: 530px) {
      .main.main-find-commute-options {
        min-height: 594px; } }
    @media only screen and (min-height: 665px) {
      .main.main-find-commute-options {
        min-height: 705px; } }
    @media only screen and (min-height: 800px) {
      .main.main-find-commute-options {
        min-height: 680px; } }
    @media only screen and (min-height: 990px) {
      .main.main-find-commute-options {
        min-height: 1030px; } }
  .main.main-dashboard {
    width: 100%;
    height: 100%;
    min-height: 900px;
    min-height: 900px;
    background-color: #f9f9f9; }

.spa-sticky-header-footer .main .map-root {
  left: 50px; }
  .spa-sticky-header-footer .main .map-root._side-nav-completely-hidden {
    left: 0;
    margin-left: 50px; }

.spa-sticky-header-footer .main.main-find-commute-options {
  width: 100%;
  height: 100%;
  min-height: 0; }
  @media only screen and (max-height: 530px) {
    .spa-sticky-header-footer .main.main-find-commute-options {
      min-height: 0; } }
  @media only screen and (min-height: 530px) {
    .spa-sticky-header-footer .main.main-find-commute-options {
      min-height: 0; } }
  @media only screen and (min-height: 665px) {
    .spa-sticky-header-footer .main.main-find-commute-options {
      min-height: 0; } }
  @media only screen and (min-height: 800px) {
    .spa-sticky-header-footer .main.main-find-commute-options {
      min-height: 0; } }
  @media only screen and (min-height: 990px) {
    .spa-sticky-header-footer .main.main-find-commute-options {
      min-height: 0; } }

.spa-sticky-header-footer .main.main-dashboard {
  width: 100%;
  height: 100%;
  min-height: 0;
  min-height: 0; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
body.spa.spa-full-width .spa-root {
  width: 100%; }

body.spa.spa-full-width .MasterMainContentArea {
  width: 100% !important;
  position: relative; }

body.spa.spa-full-width.spa-find-commute-options .main-header {
  z-index: 500; }

body.spa.spa-full-width.spa-find-commute-options .main-content-section {
  margin-top: 0; }

body.spa.rs-debug-spa-mq::before {
  content: "Debug Media Queries:";
  display: block;
  position: fixed;
  right: 1em;
  top: 5em;
  z-index: 10000;
  padding: 8px;
  background-color: #fff;
  border-color: #bdbdbd;
  border-top-color: rgba(255, 255, 255, 0.7);
  transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 17px 50px rgba(0, 0, 0, 0.19); }

@media only screen and (max-height: 530px) {
  body.spa.rs-debug-spa-mq::before {
    content: "$mq-xs-max-height: (max-height: 530px)"; } }

@media only screen and (min-height: 530px) {
  body.spa.rs-debug-spa-mq::before {
    content: "$mq-sm-vertical-only: (min-height: 530px)"; } }

@media only screen and (min-height: 665px) {
  body.spa.rs-debug-spa-mq::before {
    content: "$mq-md-vertical-only: (min-height: 665px)"; } }

@media only screen and (min-height: 800px) {
  body.spa.rs-debug-spa-mq::before {
    content: "$mq-lg-vertical-only: (min-height: 800px)"; } }

@media only screen and (min-height: 990px) {
  body.spa.rs-debug-spa-mq::before {
    content: "$mq-xlg-vertical-only: (min-height: 990px)"; } }

#spaRemoveContentTarget.on-desktop-app .MasterMainContentArea {
  z-index: 0;
  width: 100% !important;
  position: relative; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*! normalize.css v3.0.1 | MIT License | git.io/normalize */
html {
  font-family: sans-serif;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%; }

body {
  margin: 0; }

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
  display: block; }

audio,
canvas,
progress,
video {
  display: inline-block;
  vertical-align: baseline; }

audio:not([controls]) {
  display: none;
  height: 0; }

[hidden],
template {
  display: none; }

a {
  background: transparent; }

a:active,
a:hover {
  outline: 0; }

abbr[title] {
  border-bottom: 1px dotted; }

b,
strong {
  font-weight: bold; }

dfn {
  font-style: italic; }

h1 {
  font-size: 2em;
  margin: 0.67em 0; }

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

mark {
  background: #ff0;
  color: #000; }

small {
  font-size: 80%; }

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline; }

sup {
  top: -0.5em; }

sub {
  bottom: -0.25em; }

img {
  border: 0; }

svg:not(:root) {
  overflow: hidden; }

figure {
  margin: 1em 40px; }

hr {
  box-sizing: content-box;
  height: 0; }

pre {
  overflow: auto; }

code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em; }

button,
input,
optgroup,
select,
textarea {
  color: inherit;
  font: inherit;
  margin: 0; }

button {
  overflow: visible; }

button,
select {
  text-transform: none; }

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button;
  cursor: pointer; }

button[disabled],
html input[disabled] {
  cursor: default; }

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0;
  padding: 0; }

input {
  line-height: normal; }

input[type="checkbox"],
input[type="radio"] {
  box-sizing: border-box;
  padding: 0; }

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
  height: auto; }

input[type="search"] {
  -webkit-appearance: textfield;
  box-sizing: content-box; }

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

fieldset {
  border: 1px solid #c0c0c0;
  margin: 0 2px;
  padding: 0.35em 0.625em 0.75em; }

legend {
  border: 0;
  padding: 0; }

textarea {
  overflow: auto; }

optgroup {
  font-weight: bold; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

td,
th {
  padding: 0; }

/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.bootstrap * {
  box-sizing: border-box; }

.bootstrap *:before,
.bootstrap *:after {
  box-sizing: border-box; }

html {
  font-size: 62.5%;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }

body {
  /*font-family: $font-family-base;*/
  font-size: 14px;
  line-height: 1.42857;
  color: #333333;
  background-color: #fff; }

input,
button,
select,
textarea {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit; }

a {
  color: #03a9f4;
  text-decoration: none; }
  a:hover, a:focus {
    color: #03a9f4;
    text-decoration: underline; }
  a:focus {
    outline: thin dotted;
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px; }

.border-top {
  border-top: 1px solid rgba(0, 0, 0, 0.12); }

.border-bottom {
  border-bottom: 1px solid rgba(0, 0, 0, 0.12); }

figure {
  margin: 0; }

img {
  vertical-align: middle; }

.img-responsive {
  display: block;
  max-width: 100%;
  height: auto; }

.img-rounded {
  border-radius: 6px; }

.img-thumbnail {
  padding: 4px;
  line-height: 1.42857;
  background-color: #fff;
  border: 1px solid #ddd;
  border-radius: 4px;
  transition: all 0.2s ease-in-out;
  display: inline-block;
  max-width: 100%;
  height: auto; }

.img-circle {
  border-radius: 50%; }

hr {
  margin-top: 20px;
  margin-bottom: 20px;
  border: 0;
  border-top: 1px solid #eeeeee; }

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0; }

.sr-only-focusable:active, .sr-only-focusable:focus {
  position: static;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  clip: auto; }

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

.clearfix:after {
  clear: both; }

.center-block {
  display: block;
  margin-left: auto;
  margin-right: auto; }

.pull-right {
  float: right !important; }

.pull-left {
  float: left !important; }

.hide {
  display: none !important; }

.show {
  display: block !important; }

.invisible {
  visibility: hidden; }

.text-hide {
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0; }

.cursor-pointer {
  cursor: pointer; }

.no-height-restrictions {
  height: auto !important;
  max-height: none !important; }

.hidden {
  display: none !important;
  visibility: hidden !important; }

.affix {
  position: fixed; }

.one-unit-tall {
  min-height: 8px; }

.row.min-height {
  min-height: 28px; }

.inline-block {
  display: inline-block !important; }

.inline {
  display: inline !important; }

.noPadding, .no-padding {
  padding: 0 !important; }

.no-padding-h {
  padding-left: 0 !important;
  padding-right: 0 !important; }

.no-padding-v {
  padding-top: 0 !important;
  padding-bottom: 0 !important; }

.no-padding-left {
  padding-left: 0 !important; }

.no-padding-right {
  padding-right: 0 !important; }

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

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

.pad-top {
  padding-top: 8px !important; }

.pad-left {
  padding-left: 8px !important; }

.pad-right {
  padding-right: 8px !important; }

.pad-bottom {
  padding-bottom: 8px !important; }

.height-100 {
  height: 100%; }

.margin-top {
  margin-top: 8px !important; }

.margin-left {
  margin-left: 8px !important; }

.margin-right {
  margin-right: 8px !important; }

.margin-bottom {
  margin-bottom: 8px !important; }

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

.no-margin-h {
  margin-left: 0 !important;
  margin-right: 0 !important; }

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

.no-max-height {
  max-height: none !important; }

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

.posRel {
  position: relative; }

.absoluteCenter {
  position: absolute;
  margin: auto;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0; }

.pull-top-left {
  position: absolute;
  top: 0;
  left: 0; }

.pull-top-right {
  position: absolute;
  top: 0;
  right: 0; }

.line-divider {
  height: 1px;
  margin: 8px 0;
  background: #e1e1e1; }

[class*="col-xs"].no-padding {
  padding-left: 0;
  padding-right: 0; }

[class*="col-sm"].no-padding {
  padding-left: 0;
  padding-right: 0; }

[class*="col-md"].no-padding {
  padding-left: 0;
  padding-right: 0; }

[class*="col-lg"].no-padding {
  padding-left: 0;
  padding-right: 0; }

.bg-primary {
  color: #fff; }

.bg-primary {
  background-color: #03a9f4; }

a.bg-primary:hover {
  background-color: #0286c2; }

.bg-success {
  background-color: #dff0d8; }

a.bg-success:hover {
  background-color: #c1e2b3; }

.bg-info {
  background-color: #d9edf7; }

a.bg-info:hover {
  background-color: #afd9ee; }

.bg-warning {
  background-color: #fcf8e3; }

a.bg-warning:hover {
  background-color: #f7ecb5; }

.bg-danger {
  background-color: #f2dede; }

a.bg-danger:hover {
  background-color: #e4b9b9; }

.bg-selection {
  background-color: #eeeeee !important; }
  .bg-selection .paper-button-flat, .bg-selection .paper-button-icon {
    background-color: transparent !important; }
    .bg-selection .paper-button-flat:hover, .bg-selection .paper-button-flat:focus, .bg-selection .paper-button-flat:active, .bg-selection .paper-button-flat.is-active, .bg-selection .paper-button-icon:hover, .bg-selection .paper-button-icon:focus, .bg-selection .paper-button-icon:active, .bg-selection .paper-button-icon.is-active {
      background-color: transparent !important; }

.bg-lightgray {
  background-color: #ececec !important; }
  .bg-lightgray .paper-button-flat, .bg-lightgray .paper-button-icon {
    background-color: transparent !important; }
    .bg-lightgray .paper-button-flat:hover, .bg-lightgray .paper-button-flat:focus, .bg-lightgray .paper-button-flat:active, .bg-lightgray .paper-button-flat.is-active, .bg-lightgray .paper-button-icon:hover, .bg-lightgray .paper-button-icon:focus, .bg-lightgray .paper-button-icon:active, .bg-lightgray .paper-button-icon.is-active {
      background-color: transparent !important; }

.transparent {
  /* IE 8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  /* Good browsers */
  opacity: 0; }

.fullSpread {
  width: 100%;
  height: 100%; }
  .fullSpread.fullSpread-absolute {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0; }

.clear-left {
  clear: left !important; }

.clear-right {
  clear: right !important; }

.clear-both {
  clear: both !important; }

.white-space-normal {
  white-space: normal !important; }

.brand-primary {
  color: #03a9f4 !important; }

.brand-info {
  color: #5bc0de !important; }

.brand-danger {
  color: #d9534f !important; }

.brand-success {
  color: #0FB62B !important; }
  .brand-success:hover {
    color: #006B29; }

.brand-warning {
  color: #f0ad4e !important; }

.brand-trip-type {
  color: #9573BB !important; }
  .brand-trip-type:hover {
    color: #8446A7; }

.brand-orig-pin-color {
  color: #0fb62b !important; }

.brand-dest-pin-color {
  color: #e73d38 !important; }

a.link {
  cursor: pointer;
  color: #03a9f4;
  text-decoration: none; }
  a.link:hover, a.link:focus {
    color: #03a9f4;
    text-decoration: underline; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
body.ie8 ._strikethrough-line {
  right: 0;
  top: 53%; }

.strikethrough-decoration {
  position: relative;
  width: 100%;
  text-align: center; }
  .strikethrough-decoration ._strikethrough-text {
    text-align: center; }
  .strikethrough-decoration ._strikethrough-line {
    content: "";
    display: inline-block;
    position: absolute;
    height: 1px;
    background-color: #dfdfdf;
    vertical-align: middle;
    width: 30%; }
    .strikethrough-decoration ._strikethrough-line:first-child {
      left: 0;
      top: 53%; }
    .strikethrough-decoration ._strikethrough-line:last-child {
      right: 0;
      top: 53%; }

.paper-card:before, .paper-card:after {
  content: " ";
  display: table; }

.paper-card:after {
  clear: both; }

.paper-card .paper-card-heading:before, .paper-card .paper-card-heading:after {
  content: " ";
  display: table; }

.paper-card .paper-card-heading:after {
  clear: both; }

.paper-card .paper-card-body:before, .paper-card .paper-card-body:after {
  content: " ";
  display: table; }

.paper-card .paper-card-body:after {
  clear: both; }

.paper-card-bottom-action-area:before, .paper-card-bottom-action-area:after {
  content: " ";
  display: table; }

.paper-card-bottom-action-area:after {
  clear: both; }

.paper-card {
  background-color: #fff;
  border: 1px solid #bdbdbd;
  border-radius: 2px; }
  .paper-card.paper-card-small {
    max-width: 400px;
    /*max-height: 304px;*/ }
  .paper-card.paper-card-compact {
    margin-bottom: 16px; }
  .paper-card.paper-card-transparent {
    background-color: transparent !important; }
  .paper-card.pin-top {
    width: 100%;
    top: 0;
    position: absolute;
    z-index: 500; }
  .paper-card .row.full-width {
    margin-left: -16px;
    margin-right: -16px;
    width: calc(100% + 3.2rem); }
  .paper-card .paper-card-heading {
    margin: 0; }
    .paper-card .paper-card-heading.paper-card-heading-padded {
      padding: 8px 16px; }
    .paper-card .paper-card-heading.paper-card-heading-underline {
      border-bottom: 1px solid #DBDBDB; }
      .paper-card .paper-card-heading.paper-card-heading-underline.paper-card-heading-padded {
        padding-bottom: 16px; }
    .paper-card .paper-card-heading.paper-card-heading-title {
      padding: 12px 16px 0 16px;
      min-height: 40px; }
      .paper-card .paper-card-heading.paper-card-heading-title .primary-text {
        margin-top: 8px; }
      .paper-card .paper-card-heading.paper-card-heading-title .close-button {
        width: 48px;
        height: 48px; }
    .paper-card .paper-card-heading.paper-card-heading-padded-sm {
      padding: 8px; }
    .paper-card .paper-card-heading .avatar-section, .paper-card .paper-card-heading .details-section {
      float: left; }
    .paper-card .paper-card-heading .primary-text {
      font-family: 'Roboto', Arial, sans-serif;
      font-size: 20px;
      font-weight: 500;
      line-height: 22px;
      float: left; }
    .paper-card .paper-card-heading .paper-button-icon.pull-right {
      margin-right: 8px; }
    .paper-card .paper-card-heading .avatar {
      margin-right: 16px; }
  .paper-card .paper-card-body {
    padding: 0 16px;
    padding-top: 12px;
    margin: 0; }
    .paper-card .paper-card-body.max-height {
      max-height: 360px;
      overflow-x: hidden;
      overflow-y: auto; }
    .paper-card .paper-card-body.without-action-area {
      padding-bottom: 16px; }
  .paper-card.paper-card-pin-top {
    position: absolute;
    top: 0;
    z-index: 10; }
  .paper-card.paper-card-fco-section {
    width: 440px;
    top: 16px !important;
    left: 50px;
    z-index: 50; }
    .paper-card.paper-card-fco-section.paper-card-fco-section-distance-panel {
      left: 440px !important;
      top: 0 !important;
      width: 300px; }
    .paper-card.paper-card-fco-section.paper-card-fco-section-advanced-search {
      left: 0px !important;
      top: 0px !important;
      width: 440px;
      min-height: 100%; }

.paper-card-bottom-action-area-title {
  float: left;
  width: 100%;
  margin: 0;
  padding: 8px 16px;
  padding-bottom: 0;
  color: #BCBCBC;
  text-align: center;
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 12px; }

.paper-card-bottom-action-area {
  margin-left: 0;
  margin-right: 0;
  min-height: 48px;
  padding: 8px 8px 8px; }
  .paper-card-bottom-action-area.with-top-border {
    border-top: 1px solid #dfdfdf;
    min-height: 56px;
    padding-top: 8px; }
  .paper-card-bottom-action-area.absolute-bottom-action-area {
    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0;
    background-color: white; }
  .paper-card-bottom-action-area .paper-card-bottom-action-area-text-left {
    text-align: left;
    font-size: 14px;
    padding-left: 0px; }

.panel-body .paper-card-bottom-action-area.absolute-bottom-action-area {
  left: 16px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*

    This is NOT used in Desktop.scss. Look in core/paper-card for that.

*/
.paper-card {
  background-color: #fff;
  border: 1px solid #bdbdbd;
  border-radius: 2px;
  transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
  /*

    This is NOT used in Desktop.scss. Look in core/paper-card for that.

*/
  /*

    This is NOT used in Desktop.scss. Look in core/paper-card for that.

*/ }
  .paper-card:before, .paper-card:after {
    content: " ";
    display: table; }
  .paper-card:after {
    clear: both; }
  .paper-card .row.full-width {
    margin-left: -16px;
    margin-right: -16px;
    width: calc(100% + 3.2rem); }
  .paper-card .paper-card-heading {
    margin: 0;
    /*

    This is NOT used in Desktop.scss. Look in core/paper-card for that.

*/ }
    .paper-card .paper-card-heading:before, .paper-card .paper-card-heading:after {
      content: " ";
      display: table; }
    .paper-card .paper-card-heading:after {
      clear: both; }
    .paper-card .paper-card-heading.paper-card-heading-padded {
      padding: 16px 16px 0 16px; }
    .paper-card .paper-card-heading.paper-card-heading-underline {
      border-bottom: 1px solid #DBDBDB; }
      .paper-card .paper-card-heading.paper-card-heading-underline.paper-card-heading-padded {
        padding-bottom: 16px; }
    .paper-card .paper-card-heading .avatar-section, .paper-card .paper-card-heading .details-section {
      float: left; }
    .paper-card .paper-card-heading .primary-text {
      font-family: 'Roboto', Arial, sans-serif;
      font-size: 20px;
      font-weight: 500;
      line-height: 22px;
      float: left; }
    .paper-card .paper-card-heading .avatar {
      margin-right: 16px; }
  .paper-card .paper-card-body {
    padding: 0 16px;
    padding-top: 12px;
    margin: 0; }
    .paper-card .paper-card-body:before, .paper-card .paper-card-body:after {
      content: " ";
      display: table; }
    .paper-card .paper-card-body:after {
      clear: both; }
  .paper-card.with-action-area {
    padding-bottom: 0; }
    .paper-card.with-action-area .paper-card-bottom-action-area {
      margin-left: -16px;
      margin-right: -16px; }
  .paper-card.paper-card-pin-top {
    position: absolute;
    top: 0;
    z-index: 10; }
  .paper-card.paper-card-fco-section {
    width: 440px; }

/*

    This is NOT used in Desktop.scss. Look in core/paper-card for that.

*/
.paper-card-bottom-action-area {
  margin-left: 0;
  margin-right: 0;
  min-height: 48px;
  padding: 8px 8px 8px;
  /*

    This is NOT used in Desktop.scss. Look in core/paper-card for that.

*/ }
  .paper-card-bottom-action-area:before, .paper-card-bottom-action-area:after {
    content: " ";
    display: table; }
  .paper-card-bottom-action-area:after {
    clear: both; }
  .paper-card-bottom-action-area.absolute-bottom-action-area {
    position: absolute;
    width: 100%;
    bottom: 0;
    left: 0; }
  .paper-card-bottom-action-area .paper-card-bottom-action-area-text-left {
    text-align: left;
    font-size: 14px;
    padding-left: 0px; }

.panel-body .paper-card-bottom-action-area.absolute-bottom-action-area {
  left: 16px; }

/*

    This is NOT used in Desktop.scss. Look in core/paper-card for that.

*/
.login-Bar {
  background-color: #ffffff;
  transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
  z-index: 50;
  position: relative;
  font-family: Roboto, sans-serif;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  min-height: 40px; }

.user-bar--container {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
      justify-content: space-between;
  height: 40px; }

.user-bar--left-section {
  display: -ms-flexbox;
  display: flex; }

.user-bar--right-section {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center; }
  .user-bar--right-section .sign-in-control--container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center; }

.admin-bar .user-bar--container {
  height: auto !important; }

.admin-user-bar .user-bar--container {
  height: auto !important; }

.user-bar-settings-holder {
  float: right;
  height: 24px;
  margin-bottom: 0 !important;
  position: relative;
  color: rgba(0, 0, 0, 0.54); }
  .user-bar-settings-holder li {
    margin: 0; }
  .user-bar-settings-holder a, .user-bar-settings-holder a:visited, .user-bar-settings-holder a:active {
    color: rgba(0, 0, 0, 0.54);
    text-decoration: none !important; }
  .user-bar-settings-holder a:hover {
    color: #0288d1;
    text-decoration: none; }
  .user-bar-settings-holder .single-language-only {
    margin: 1px 10px 0 0; }

.admin-user-bar-settings-holder {
  float: left;
  margin: 10px 0 !important; }

.language-selector {
  position: relative;
  min-width: 88px;
  border: 1px solid transparent; }
  .language-selector .language-selector-dropdown-title {
    font-size: 20px !important;
    line-height: 24px !important;
    width: 100% !important;
    margin: 8px 16px !important;
    color: rgba(0, 0, 0, 0.87) !important;
    box-sizing: border-box !important; }
  .language-selector .language-selector-link {
    padding: 0 8px;
    display: -ms-flexbox;
    display: flex; }
    .language-selector .language-selector-link .glyphicon-globe {
      font-size: 20px; }
    .language-selector .language-selector-link span {
      margin: 2.5px 2.5px 2.5px 2.5px; }
    .language-selector .language-selector-link--text {
      margin: auto 4px auto 8px; }
  .language-selector div {
    z-index: 3;
    transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    background-color: #fff;
    border: 1px solid #bdbdbd;
    border-radius: 2px;
    border: 0;
    background-color: #fff;
    transition: background-color 0.15s linear;
    position: absolute;
    top: 30px;
    padding: 0px !important;
    margin: 0px !important; }
    .language-selector div:before, .language-selector div:after {
      content: " ";
      display: table; }
    .language-selector div:after {
      clear: both; }
  .language-selector ul li a span {
    float: right;
    position: relative;
    top: 4px;
    color: #00C853; }

.language-selector ul li {
  color: #58595B;
  line-height: 24px;
  padding: 0;
  height: 40px;
  display: -ms-flexbox;
  display: flex; }
  .language-selector ul li a {
    color: #58595B;
    line-height: 24px;
    display: block;
    margin: auto 16px;
    width: 100%; }
    .language-selector ul li a:active, .language-selector ul li a:visited {
      text-decoration: none;
      color: #58595B;
      transition: background-color 0.15s linear; }
    .language-selector ul li a:hover {
      text-decoration: none;
      color: #58595B;
      transition: color 0.15s linear; }
  .language-selector ul li:hover {
    background-color: #e0e0e0;
    transition: background-color 0.15s linear; }

.continue-registration {
  float: right;
  margin: 4px 10px; }
  .continue-registration a, .continue-registration a:visited, .continue-registration a:active {
    color: #03a9f4;
    text-decoration: none; }
  .continue-registration a:hover {
    color: #0288d1;
    text-decoration: none; }

.cancel-registration {
  float: right;
  margin: 0 !important;
  color: #03a9f4; }
  .cancel-registration li {
    margin: 0; }
  .cancel-registration a, .cancel-registration a:visited, .cancel-registration a:active {
    color: #03a9f4;
    text-decoration: none;
    margin: 1px 0 0 10px;
    display: block; }
  .cancel-registration a:hover {
    color: #0288d1;
    text-decoration: none;
    margin: 1px 0 0 10px; }

.open-login-button-container {
  display: inline-block;
  *display: inline;
  *zoom: 1;
  float: right;
  position: relative;
  font-family: Roboto, sans-serif; }
  .open-login-button-container .welcome-label {
    font-size: 24px;
    font-weight: 500;
    margin-bottom: 10px;
    display: block; }
  .open-login-button-container .forgot-password-button a {
    font-size: 10px;
    color: #03a9f4; }
  .open-login-button-container .remember-me-label {
    font-size: 10px;
    font-weight: normal;
    vertical-align: middle;
    color: #666666; }
  .open-login-button-container .user-bar-remember {
    margin: 20px 0 0 0;
    float: left;
    word-wrap: break-word;
    max-width: 120px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row; }
  .open-login-button-container .login-submit {
    margin: 20px 0 0 0;
    min-width: 120px; }
  .open-login-button-container .facebook-login-holder {
    width: 100%;
    text-align: center;
    border-top: 1px solid #eeeeee;
    padding-top: 20px;
    position: relative;
    margin-top: 65px; }
    .open-login-button-container .facebook-login-holder .facebook-login-or-label-holder {
      position: absolute;
      top: -9px;
      left: 50%;
      margin-left: -22px;
      background: #ffffff;
      padding: 0 15px;
      color: #aaaaaa;
      font-size: 12px; }
  .open-login-button-container .login-card {
    position: absolute;
    right: 0;
    width: 344px;
    padding: 16px;
    background-color: #fff;
    transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    background-color: #fff;
    border: 1px solid #bdbdbd;
    border-radius: 2px;
    border: 1px solid #bdbdbd;
    display: none;
    z-index: 5;
    transition: background-color 0.15s linear; }
    .open-login-button-container .login-card:before, .open-login-button-container .login-card:after {
      content: " ";
      display: table; }
    .open-login-button-container .login-card:after {
      clear: both; }
    .open-login-button-container .login-card .close-button {
      color: rgba(0, 0, 0, 0.54);
      float: right;
      position: absolute;
      top: 12px;
      right: 12px;
      font-size: 24px;
      width: 40px;
      height: 40px; }
      .open-login-button-container .login-card .close-button:hover, .open-login-button-container .login-card .close-button:focus {
        background-color: #eee; }
      .open-login-button-container .login-card .close-button .rs-icon {
        font-size: 24px; }

/*Cole's Stuff*/
.forgot-password-card {
  position: absolute;
  right: 0;
  width: 320px;
  height: 200px;
  padding: 16px;
  background-color: #fff;
  transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
  background-color: #fff;
  border: 1px solid #bdbdbd;
  border-radius: 2px;
  border: 1px solid #bdbdbd;
  display: none;
  z-index: 5;
  transition: background-color 0.15s linear;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); }
  .forgot-password-card:before, .forgot-password-card:after {
    content: " ";
    display: table; }
  .forgot-password-card:after {
    clear: both; }
  .forgot-password-card .header-title {
    position: relative;
    float: left;
    line-height: 20px;
    font-size: 20px;
    color: #464646;
    font-weight: normal;
    margin-bottom: 8px;
    display: block; }
  .forgot-password-card .header-subtitle {
    position: relative;
    margin: 0 0 16px 0;
    float: left;
    font-size: 12px;
    font-weight: light; }
  .forgot-password-card .input-container {
    position: relative;
    width: 285px;
    margin: 8px 0 30px 0;
    float: left; }
  .forgot-password-card .cancel-button {
    position: absolute;
    bottom: 0px;
    left: 0px;
    margin: 0 0 8px 40px;
    float: left;
    color: #666666;
    font-weight: bold;
    font-size: 12px;
    text-decoration: none !important; }
    .forgot-password-card .cancel-button :hover {
      text-decoration: none !important;
      color: #168CF6; }
  .forgot-password-card .send-reset-password-request {
    position: absolute;
    bottom: 0px;
    right: 0px;
    margin: 0 15px 10px 0 !important;
    float: right; }
  .forgot-password-card .header-subtitle-error-message {
    color: red;
    position: relative;
    float: left;
    margin: 0 0 16px 0;
    font-size: 12px;
    display: none; }
  .forgot-password-card .input-error-message {
    color: red;
    position: relative;
    float: left;
    top: -29px;
    font-size: 12px;
    height: 0px; }
  .forgot-password-card .userID-message {
    display: none; }
  .forgot-password-card .firstName-message {
    display: none; }
  .forgot-password-card .lastName-message {
    display: none; }

.forgot-password-submit-success-card {
  position: absolute;
  right: 0;
  width: 320px;
  height: 392px;
  padding: 16px;
  background-color: #0fb72b !important;
  transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
  background-color: #fff;
  border: 1px solid #bdbdbd;
  border-radius: 2px;
  border: 1px solid #0fb72b;
  display: none;
  z-index: 5;
  transition: background-color 0.15s linear;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); }
  .forgot-password-submit-success-card:before, .forgot-password-submit-success-card:after {
    content: " ";
    display: table; }
  .forgot-password-submit-success-card:after {
    clear: both; }
  .forgot-password-submit-success-card .forgot-password-submit-success-message-main {
    font-weight: bold;
    position: relative;
    float: left;
    font-size: 20px;
    color: white;
    text-align: center;
    /*added to modify margin to fix text overflow & overlap*/
    margin: 152px 0 20px 0;
    width: 100%;
    word-wrap: break-word;
    /*for long emails*/ }
  .forgot-password-submit-success-card .forgot-password-submit-success-message-sub {
    font-weight: lighter;
    position: relative;
    float: left;
    font-size: 12px;
    color: white;
    text-align: center; }
  .forgot-password-submit-success-card .forgot-password-submit-success-ok-button {
    font-weight: normal;
    text-align: center;
    position: absolute;
    color: white;
    width: 320px;
    bottom: 0px;
    left: 0px;
    margin-bottom: 8px; }
    .forgot-password-submit-success-card .forgot-password-submit-success-ok-button a {
      color: white;
      text-decoration: none !important; }

.forgot-password-submit-error-card {
  position: absolute;
  right: 0;
  width: 320px;
  height: 392px;
  padding: 16px;
  background-color: #e63d38 !important;
  transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
  background-color: #fff;
  border: 1px solid #bdbdbd;
  border-radius: 2px;
  border: 1px solid #e63d38;
  display: none;
  z-index: 5;
  transition: background-color 0.15s linear;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); }
  .forgot-password-submit-error-card:before, .forgot-password-submit-error-card:after {
    content: " ";
    display: table; }
  .forgot-password-submit-error-card:after {
    clear: both; }
  .forgot-password-submit-error-card .forgot-password-submit-error-message-main {
    font-weight: bold;
    position: relative;
    float: left;
    font-size: 20px;
    color: white;
    text-align: center;
    margin: 185px 0 20px 0; }
  .forgot-password-submit-error-card .forgot-password-submit-error-message-sub {
    font-weight: lighter;
    position: relative;
    float: left;
    font-size: 12px;
    color: white;
    text-align: center;
    width: 320px;
    left: -17px; }
  .forgot-password-submit-error-card .forgot-password-submit-error-ok-button {
    font-weight: normal;
    text-align: center;
    position: absolute;
    color: white;
    width: 320px;
    bottom: 0px;
    left: 0px;
    margin-bottom: 8px; }
    .forgot-password-submit-error-card .forgot-password-submit-error-ok-button a {
      color: white;
      text-decoration: none !important; }

/* End of Cole's Stuff*/
.admin-open-login-button-container {
  margin-top: 15px; }

.admin-login {
  float: right; }
  .admin-login .userid {
    display: inline-block;
    padding: 0 0 2px 0; }
  .admin-login .login-input ~ label {
    top: -3px; }
  .admin-login .input-container {
    margin: -8px 10px; }
  .admin-login .login-input.floating-label:focus ~ label,
  .admin-login .login-input.floating-label.dirty ~ label {
    top: -15px !important; }

.registration-sub-label {
  font-size: 12px;
  color: #9e9e9e;
  font-style: italic; }

/*Admin Settings*/
.admin-user-bar {
  position: relative;
  background: #fafafa;
  margin-bottom: 16px;
  padding: 8px 16px;
  transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); }
  .admin-user-bar .user-bar--container {
    -ms-flex-direction: column;
        flex-direction: column; }
  .admin-user-bar .sign-in-control--container {
    margin-left: 50px; }
  .admin-user-bar .sign-in-control--admin-second-row-btns {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: end;
        justify-content: flex-end;
    margin-right: -184px;
    /* Quick fix to alignment issues after accessibility fixes */ }
    .admin-user-bar .sign-in-control--admin-second-row-btns .editSite-exit {
      position: absolute;
      right: 20px;
      bottom: 20px; }
  .admin-user-bar #UserBarRegister {
    margin-top: -28px !important; }
  .admin-user-bar #UserBarRegisterAdmin {
    margin-top: -28px !important; }
  .admin-user-bar .top-user-navigation-button {
    float: none; }
  .admin-user-bar .CustomSubSiteLabelDiv {
    padding: 8px 0; }
  .admin-user-bar .cancel-registration {
    clear: both;
    margin: -20px 10px 0 0 !important; }

.top-user-navigation-button-user-only {
  padding: 0 15px !important; }

.top-user-navigation-button {
  float: right;
  display: inline-block;
  margin: 0 5px !important; }

.top-user-navigation-button-admin {
  min-width: 175px !important; }

.AdminEditSiteButtonContainer, .AdminGoToAdminPortalButtonContainer {
  margin: 10px 0; }

.user-bar {
  color: rgba(0, 0, 0, 0.54); }

.user-bar-drop-container-icon, .user-bar-no-drop-down-icon {
  float: left;
  color: rgba(0, 0, 0, 0.54);
  transition: color 0.15s linear;
  position: relative; }
  .user-bar-drop-container-icon a, .user-bar-drop-container-icon a:visited, .user-bar-drop-container-icon a:active, .user-bar-no-drop-down-icon a, .user-bar-no-drop-down-icon a:visited, .user-bar-no-drop-down-icon a:active {
    color: rgba(0, 0, 0, 0.54);
    text-decoration: none !important; }

.admin-css-drowdown-list-label {
  padding-right: 5px;
  margin-left: 10px;
  font-size: 12px;
  color: #58595B; }

#AdminCSSSelectionChange {
  color: #58595B;
  width: 200px;
  font-size: 12px;
  border: 1px solid #bdbdbd;
  background-color: #fff;
  border-radius: 2px;
  transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
  background-color: #fff;
  border: 1px solid #bdbdbd;
  border-radius: 2px;
  padding: 1px 0; }
  #AdminCSSSelectionChange:before, #AdminCSSSelectionChange:after {
    content: " ";
    display: table; }
  #AdminCSSSelectionChange:after {
    clear: both; }

.AdminDivDropdown {
  float: left;
  margin-top: 4px; }

.AdminDivTable {
  float: right;
  color: #58595B;
  font-size: 12px;
  height: 38px; }

.CustomSubSiteLabel {
  color: #757575;
  color: rgba(0, 0, 0, 0.87);
  font-size: 12px;
  display: inline-block;
  height: 40px;
  padding: 10px 0;
  line-height: 20px; }

.internal-message-control-item {
  color: rgba(0, 0, 0, 0.54);
  transition: color 0.15s linear;
  display: -ms-flexbox;
  display: flex;
  width: 35px;
  height: 40px; }
  .internal-message-control-item .glyphicon {
    margin: auto;
    font-size: 17px;
    padding: 8px; }
  .internal-message-control-item span.is-with-notifications + .glyphicon {
    color: #03a9f4; }

.internal-message-control-item:hover {
  color: #0288d1;
  transition: color 0.15s linear; }

.internal-message-control-item.open {
  color: #0288d1; }

.InternalMessagingControl_DropDownContent {
  display: none;
  position: absolute;
  right: 0;
  width: 440px;
  background-color: #fff;
  transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
  background-color: #fff;
  border: 1px solid #bdbdbd;
  border-radius: 2px;
  border: 1px solid #bdbdbd;
  color: #58595B !important;
  z-index: 3;
  margin-top: -40px; }
  .InternalMessagingControl_DropDownContent:before, .InternalMessagingControl_DropDownContent:after {
    content: " ";
    display: table; }
  .InternalMessagingControl_DropDownContent:after {
    clear: both; }

#InternalMessagingControl_SeeAllBtn {
  color: #03a9f4;
  height: 40px !important;
  line-height: 31px !important; }
  #InternalMessagingControl_SeeAllBtn:hover {
    text-decoration: none;
    color: #0288d1; }

.InternalMessagingControl_DropDownContent_Notifications, .InternalMessagingControl_DropDownContent_Messages {
  font-size: 12px; }

.InternalMessaging table tr:hover, .InternalMessaging_ConversationSection.InternalConversationOpenLink:hover {
  color: #58595B;
  background-color: #e0e0e0;
  transition: background-color 0.15s linear; }

.internalMessagingSent {
  width: 30px; }
  .internalMessagingSent p {
    padding: 5px 0 0 10px;
    color: #58595B; }

.internalMessagingMessage p {
  font-size: 12px;
  margin: 2px 0; }

.user-bar-drop-container-icon:hover a, .user-bar-no-drop-down-icon:hover a {
  color: #0288d1;
  text-decoration: none;
  transition: color 0.15s linear; }

.user-bar-icon-holder {
  float: right;
  margin-bottom: 0 !important;
  line-height: 14px; }

.userWelcomeNEWClean {
  padding-right: 8px; }

.personal-details-menu-dropdown {
  position: absolute;
  right: 0;
  transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
  background-color: #fff;
  border: 1px solid #bdbdbd;
  border-radius: 2px;
  border: 1px solid #bdbdbd;
  background-color: #fff;
  transition: background-color 0.15s linear;
  white-space: nowrap;
  z-index: 5;
  margin-top: -20px !important;
  top: 60px; }
  .personal-details-menu-dropdown:before, .personal-details-menu-dropdown:after {
    content: " ";
    display: table; }
  .personal-details-menu-dropdown:after {
    clear: both; }
  .personal-details-menu-dropdown .settings-header {
    background-color: #fff;
    color: rgba(0, 0, 0, 0.87);
    margin-right: 20px;
    font-size: 20px;
    line-height: 24px;
    margin: 12px 8px 0px 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
  .personal-details-menu-dropdown li[role="menuitem"] {
    height: 40px;
    display: -ms-flexbox;
    display: flex; }
    .personal-details-menu-dropdown li[role="menuitem"] a {
      margin: auto 8px auto 16px;
      width: 100%; }
    .personal-details-menu-dropdown li[role="menuitem"]:hover {
      text-align: left;
      width: 100%;
      text-decoration: none;
      background-color: #e0e0e0;
      color: #58595B;
      transition: background-color 0.15s linear; }
      .personal-details-menu-dropdown li[role="menuitem"]:hover a {
        color: #58595B; }
  .personal-details-menu-dropdown li.delete-account a {
    color: #CC461B !important; }
  .personal-details-menu-dropdown a {
    color: #58595B !important;
    line-height: 24px;
    display: block; }
    .personal-details-menu-dropdown a:active, .personal-details-menu-dropdown a:visited {
      text-decoration: none;
      color: #58595B;
      transition: background-color 0.15s linear; }

.input-container {
  position: relative;
  width: 303px;
  margin: 7px 0;
  float: left; }

.login-input {
  display: block;
  width: 100%;
  margin: 0;
  border: none;
  border-bottom: 1px solid #9e9e9e;
  font-size: 16px !important;
  padding: 8px 0 6px 0;
  background-color: transparent;
  color: #58595B;
  /*font-weight:bold;*/
  z-index: 2; }

.login-input[disabled] {
  border-bottom: 1px dashed #9e9e9e;
  background-color: transparent; }

.login-input ~ label {
  font-size: 14px;
  width: 100%;
  position: absolute;
  pointer-events: none;
  left: 0;
  top: 10px;
  bottom: 0px;
  color: #898989;
  font-weight: normal; }

.login-input.floating-label ~ label {
  transition: 0.2s ease all;
  -moz-transition: 0.2s ease all;
  -webkit-transition: 0.2s ease all; }

.login-input:focus {
  outline: none; }

.login-input ~ label:after {
  content: '';
  background-color: #03a9f4;
  height: 2px;
  width: 10px;
  bottom: -5px;
  left: 45%;
  visibility: hidden;
  position: absolute;
  transition: 0.2s ease all;
  -webkit-transition: 0.2s ease all;
  -moz-transition: 0.2s ease all; }

.login-input:focus ~ label:after {
  visibility: visible;
  width: 100%;
  left: 0; }

.login-input.dirty ~ label {
  visibility: hidden; }

.login-input.floating-label:focus ~ label,
.login-input.floating-label.dirty ~ label {
  visibility: visible;
  top: -10px;
  font-size: 12px;
  color: #03a9f4; }

.user-bar-account {
  height: 40px;
  padding: 0 8px 0 16px; }
  .user-bar-account .user-bar-drop-container--welcome-name {
    height: 40px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row; }
    .user-bar-account .user-bar-drop-container--welcome-name .user-bar-drop-container--welcome-title {
      margin: 10px 8px 10px 0;
      margin-right: 8px;
      color: #03a9f4;
      font-size: 12px;
      line-height: 20px; }
    .user-bar-account .user-bar-drop-container--welcome-name .user-bar-drop-container--welcome-avatar-img {
      width: 32px;
      height: 32px;
      border-radius: 16px;
      margin: auto;
      border: 1px solid #eee; }

.user-sign-out-link, .admin-user-sign-out-link {
  display: -ms-flexbox;
  display: flex;
  height: 40px; }
  .user-sign-out-link a, .admin-user-sign-out-link a {
    height: auto;
    line-height: 40px;
    font-size: 12px !important;
    line-height: 20px !important;
    margin: 10px 8px 10px 0; }

.user-dashboard-link {
  display: -ms-flexbox;
  display: flex;
  height: 40px;
  width: 35px; }
  .user-dashboard-link a {
    text-align: center;
    font-size: 17px;
    margin: auto;
    padding: 8px;
    width: 100%; }

.InternalMessagingControl_SendCommunicationsToEmailCheckboxHolder {
  padding-left: 20px;
  margin-bottom: 5px; }
  .InternalMessagingControl_SendCommunicationsToEmailCheckboxHolder .InternalMessagingControl_SendCommunicationsToEmailCheckboxArea {
    font-weight: normal;
    font-size: 12px;
    padding-left: 5px;
    vertical-align: top;
    margin-top: 5px; }

@font-face {
  font-family: 'rs-icons';
  src: url("fonts/rs-icons.eot?we8uy9");
  src: url("fonts/rs-icons.eot?#iefixwe8uy9") format("embedded-opentype"), url("fonts/rs-icons.svg?we8uy9#rs-icons") format("svg");
  font-weight: normal;
  font-style: normal; }

[class^="rs-icon-"], [class*=" rs-icon-"] {
  font-family: 'rs-icons';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.forgot-password-submit-card-icon {
  font-size: 55px;
  font-weight: lighter;
  line-height: 0;
  text-align: center;
  color: white;
  position: absolute;
  top: 115px;
  left: 0;
  width: 320px; }

.rs-icon._checkmark-fco:before {
  content: "\e637"; }

.rs-icon._checkmark:before {
  content: "\e62f"; }

.rs-icon._exit:before, body.master3 #PopUpContainer #PopUpClose:before, body.master3 #PopUpContainer #PopUpCloseCS:before {
  content: "\e909"; }

.CellNumberConfirmation {
  font-size: 32px !important;
  /*width: 100px;*/
  text-align: center;
  margin: auto !important; }

.sendNewCellNumberConfirmation {
  margin-top: 8px !important;
  /*text-align:center;*/ }
  .sendNewCellNumberConfirmation a, .sendNewCellNumberConfirmation a:visited, .sendNewCellNumberConfirmation a:active {
    color: #03a9f4 !important;
    text-decoration: none !important; }

.confirmationCodeButtons a, .confirmationCodeButtons a:visited, .confirmationCodeButtons a:active {
  padding: 8px 32px !important;
  margin-top: 16px !important;
  margin-bottom: -16px !important;
  display: inline-block; }

.confirmationCodeButtons .clearButtonStyle a, .confirmationCodeButtons .clearButtonStyle a:visited, .confirmationCodeButtons .clearButtonStyle a:active {
  color: #03a9f4 !important;
  padding-left: 0px !important; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*

    This is NOT used in Desktop.scss. Look in core/paper-card for that.

*/
/*

    This is NOT used in Desktop.scss. Look in core/paper-card for that.

*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.main-nav-bar {
  height: 30px; }
  .main-nav-bar ul {
    list-style: none; }
    .main-nav-bar ul li {
      display: block;
      float: left;
      position: relative;
      transition: background-color 0.15s linear; }
      .main-nav-bar ul li a {
        font-size: 14px;
        color: #ffffff; }
        .main-nav-bar ul li a:active, .main-nav-bar ul li a:visited, .main-nav-bar ul li a:focus {
          color: #ffffff; }
        .main-nav-bar ul li a:hover {
          text-decoration: none;
          color: #ffffff; }
        .main-nav-bar ul li a:focus + .nav-bar-drop-down {
          display: block; }
      .main-nav-bar ul li:hover {
        background-color: #0288d1;
        transition: background-color 0.15s linear; }
        .main-nav-bar ul li:hover .main-nav-link {
          color: #ffffff; }
  .main-nav-bar .main-nav-bar-dropdown {
    transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    z-index: 500;
    border-radius: 0 0 2px 2px;
    background-color: #fff; }
    .main-nav-bar .main-nav-bar-dropdown ul li {
      color: #58595B;
      line-height: 24px; }
      .main-nav-bar .main-nav-bar-dropdown ul li.disabled a {
        color: #bdbdbd; }
        .main-nav-bar .main-nav-bar-dropdown ul li.disabled a:hover, .main-nav-bar .main-nav-bar-dropdown ul li.disabled a:active, .main-nav-bar .main-nav-bar-dropdown ul li.disabled a:visited {
          color: #bdbdbd; }
      .main-nav-bar .main-nav-bar-dropdown ul li a {
        color: #58595B;
        line-height: 24px; }
        .main-nav-bar .main-nav-bar-dropdown ul li a:hover, .main-nav-bar .main-nav-bar-dropdown ul li a:active, .main-nav-bar .main-nav-bar-dropdown ul li a:visited {
          text-decoration: none;
          color: #58595B; }
      .main-nav-bar .main-nav-bar-dropdown ul li:hover {
        background-color: #e0e0e0; }

.nav-bar-main-links .nav-bar-current-page {
  background-color: none; }

html, body {
  width: 100%;
  height: 100%;
  margin: 0; }

#SurveyForm {
  overflow-y: auto;
  max-height: 85vh;
  max-height: calc(100vh - 100px); }
  #SurveyForm > div.left {
    max-height: 70vh;
    max-height: calc(100vh - 260px);
    overflow-y: auto; }

.main-header {
  transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
  background-color: #03a9f4;
  position: relative;
  z-index: 3; }
  .main-header:hover {
    z-index: 1000; }

.skip-navigation {
  position: absolute;
  clip: rect(1px, 1px, 1px, 1px);
  padding: 8px;
  width: 1px;
  height: 1px;
  overflow: hidden; }
  .skip-navigation:focus {
    z-index: 999;
    clip: auto;
    width: auto;
    height: auto; }

/*To ensure that select containers go above the header*/
._md-select-menu-container {
  z-index: 300 !important; }

.container-Center {
  width: 1000px;
  width: 960px;
  margin: 0 auto; }

.branding-Bar {
  height: 60px;
  background-color: #03a9f4; }

.main-nav-bar {
  height: 30px;
  background-color: #03a9f4; }

#SiteMapDiv {
  background-color: #666;
  color: #e0e0e0;
  background-image: none !important;
  padding: 20px 30px !important; }
  #SiteMapDiv table span, #SiteMapDiv a, #SiteMapDiv a:active, #SiteMapDiv a:hover, #SiteMapDiv a:visited {
    color: #e0e0e0 !important; }

.footer_Version {
  color: #e0e0e0 !important; }

.performance-stats-footer {
  background-color: #666; }

.main-content-section {
  margin: 0; }

.ProfileLabel {
  font-family: Roboto, sans-serif; }

body .modal ~ .md-dialog-container {
  z-index: 9999; }

body._lower-md-dialog-containers .modal ~ .md-dialog-container {
  z-index: 999; }

body .modal ~ md-virtual-repeat-container.md-autocomplete-suggestions-container {
  z-index: 2000; }

body.master3 {
  /*Contact Us - Overriding old styles*/ }
  body.master3 #PopUpContainer {
    /*Test what happens if this is edited*/
    /*.modified-email-button.LinkButtonStyle a.NewMasterButtonStyle:link {
                background-color: #fff !important;
                color: $brand-primary !important;
                box-shadow: none !important;
            }*/ }
    body.master3 #PopUpContainer #PopUpBox, body.master3 #PopUpContainer #PopUpBoxCS {
      background-color: #fff;
      border: 1px solid #bdbdbd;
      border-radius: 2px;
      transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
      box-shadow: 0 8px 17px rgba(0, 0, 0, 0.2);
      background-image: none;
      border: 0;
      font-family: Roboto, sans-serif; }
      body.master3 #PopUpContainer #PopUpBox:before, body.master3 #PopUpContainer #PopUpBox:after, body.master3 #PopUpContainer #PopUpBoxCS:before, body.master3 #PopUpContainer #PopUpBoxCS:after {
        content: " ";
        display: table; }
      body.master3 #PopUpContainer #PopUpBox:after, body.master3 #PopUpContainer #PopUpBoxCS:after {
        clear: both; }
    body.master3 #PopUpContainer #PopUpIcon, body.master3 #PopUpContainer #PopUpIconCS {
      background: none !important;
      text-align: left;
      margin: 0px;
      color: #212121;
      padding: 16px 24px;
      min-height: 32px; }
    body.master3 #PopUpContainer #PopUpMessageTitle, body.master3 #PopUpContainer #PopUpMessageTitleCS {
      font-family: 'Roboto', Arial, sans-serif;
      font-size: 24px;
      font-weight: 500; }
    body.master3 #PopUpContainer #PopUpContent, body.master3 #PopUpContainer #PopUpContentCS {
      color: #757575;
      margin: 8px 24px 8px 24px;
      line-height: 1.2em; }
    body.master3 #PopUpContainer .modified-email-button #PopUpOK:hover {
      background-color: #eee; }
    body.master3 #PopUpContainer #PopUpOK, body.master3 #PopUpContainer #PopUpConfirm, body.master3 #PopUpContainer #PopUpCancel {
      color: #fff;
      background-color: #03a9f4;
      background-image: none;
      line-height: normal;
      white-space: normal;
      min-width: 88px;
      padding-top: 8px;
      padding-bottom: 8px;
      display: block;
      box-sizing: border-box;
      font-size: 12px;
      font-weight: 500;
      text-transform: uppercase;
      color: #020202;
      -webkit-appearance: none;
      -moz-appearance: none;
      appearance: none;
      border: none;
      background-color: transparent;
      -webkit-border-fit: border !important;
      padding: 0;
      text-align: center;
      padding: 0;
      margin: 0;
      border: none;
      display: block;
      border-radius: 0;
      overflow: hidden;
      position: relative;
      box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.28);
      transition: all 0.15s ease;
      border: 0;
      height: 36px;
      line-height: 36px;
      padding: 0 16px; }
      body.master3 #PopUpContainer #PopUpOK:focus, body.master3 #PopUpContainer #PopUpConfirm:focus, body.master3 #PopUpContainer #PopUpCancel:focus {
        outline: none; }
      body.master3 #PopUpContainer #PopUpOK::-moz-focus-inner, body.master3 #PopUpContainer #PopUpConfirm::-moz-focus-inner, body.master3 #PopUpContainer #PopUpCancel::-moz-focus-inner {
        border: none;
        /* overrides extra padding in Firefox */ }
      body.master3 #PopUpContainer #PopUpOK .paper-button:hover, body.master3 #PopUpContainer #PopUpConfirm .paper-button:hover, body.master3 #PopUpContainer #PopUpCancel .paper-button:hover {
        background-color: transparent !important; }
      body.master3 #PopUpContainer #PopUpOK::-moz-selection, body.master3 #PopUpContainer #PopUpConfirm::-moz-selection, body.master3 #PopUpContainer #PopUpCancel::-moz-selection {
        background-color: transparent; }
      body.master3 #PopUpContainer #PopUpOK::selection, body.master3 #PopUpContainer #PopUpConfirm::selection, body.master3 #PopUpContainer #PopUpCancel::selection {
        background-color: transparent; }
      body.master3 #PopUpContainer #PopUpOK::moz-selection, body.master3 #PopUpContainer #PopUpConfirm::moz-selection, body.master3 #PopUpContainer #PopUpCancel::moz-selection {
        background-color: transparent; }
      body.master3 #PopUpContainer #PopUpOK .rs-icon, body.master3 #PopUpContainer #PopUpConfirm .rs-icon, body.master3 #PopUpContainer #PopUpCancel .rs-icon {
        font-size: 21px; }
        body.master3 #PopUpContainer #PopUpOK .rs-icon._filters, body.master3 #PopUpContainer #PopUpConfirm .rs-icon._filters, body.master3 #PopUpContainer #PopUpCancel .rs-icon._filters {
          font-size: 14px; }
      body.master3 #PopUpContainer #PopUpOK.with-ink:active, body.master3 #PopUpContainer #PopUpConfirm.with-ink:active, body.master3 #PopUpContainer #PopUpCancel.with-ink:active {
        background-color: #efefef;
        background-color: rgba(230, 230, 230, 0.8); }
      body.master3 #PopUpContainer #PopUpOK.is-active, body.master3 #PopUpContainer #PopUpOK:active, body.master3 #PopUpContainer #PopUpOK:focus, body.master3 #PopUpContainer #PopUpOK:hover, body.master3 #PopUpContainer #PopUpOK.is-hover, body.master3 #PopUpContainer #PopUpConfirm.is-active, body.master3 #PopUpContainer #PopUpConfirm:active, body.master3 #PopUpContainer #PopUpConfirm:focus, body.master3 #PopUpContainer #PopUpConfirm:hover, body.master3 #PopUpContainer #PopUpConfirm.is-hover, body.master3 #PopUpContainer #PopUpCancel.is-active, body.master3 #PopUpContainer #PopUpCancel:active, body.master3 #PopUpContainer #PopUpCancel:focus, body.master3 #PopUpContainer #PopUpCancel:hover, body.master3 #PopUpContainer #PopUpCancel.is-hover {
        box-shadow: 0 4px 14px 0 rgba(0, 0, 0, 0.26) !important; }
      body.master3 #PopUpContainer #PopUpOK:hover, body.master3 #PopUpContainer #PopUpConfirm:hover, body.master3 #PopUpContainer #PopUpCancel:hover {
        text-decoration: none; }
    body.master3 #PopUpContainer #PopUpOK, body.master3 #PopUpContainer #PopUpConfirm {
      float: right; }
    body.master3 #PopUpContainer #PopUpCancel {
      float: left; }
    body.master3 #PopUpContainer #PopUpClose, body.master3 #PopUpContainer #PopUpCloseCS {
      display: inline-block;
      font-family: 'rs-icons';
      speak: none;
      font-style: normal;
      font-weight: normal;
      font-variant: normal;
      text-transform: none;
      line-height: 1;
      /* Better Font Rendering =========== */
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      top: 16px;
      right: 16px;
      background-color: white;
      background-image: none;
      color: rgba(0, 0, 0, 0.54);
      text-decoration: none;
      font-size: 24px;
      width: 40px !important;
      height: 40px !important;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-pack: center;
          justify-content: center;
      -ms-flex-align: center;
          align-items: center; }
      body.master3 #PopUpContainer #PopUpClose:hover, body.master3 #PopUpContainer #PopUpCloseCS:hover {
        background-color: #eee; }
  body.master3 .popUpWindow, body.master3 .popUpWindowContactUs {
    font-family: Roboto;
    border-radius: 3px;
    border: 0; }
  body.master3 .popUpWindowContactUs {
    width: 475px; }
  body.master3 .popUpReportTitle,
  body.master3 .popUpTitle {
    position: relative;
    padding: 0px 20px;
    min-height: 48px;
    line-height: 48px;
    font-size: 20px; }
  body.master3 .popUpTitleContactUs {
    position: relative;
    padding: 0px 24px;
    max-height: 48px;
    line-height: 48px; }
    body.master3 .popUpTitleContactUs .popUpTitleHeader {
      font-size: 20px; }
  body.master3 .popUpReportTitleHeader {
    font-size: 20px; }
  body.master3 .popUpTitle .popUpClose,
  body.master3 .popUpReportTitle .popupClose,
  body.master3 .popUpTitleContactUs .popUpClose,
  body.master3 .popUpTitleTermsConditions .popUpClose,
  body.master3 .popUpTitleClaimConfirm .popUpClose {
    font-size: 24px;
    padding: 0;
    margin: 0;
    border: 0;
    color: white;
    font-weight: normal;
    position: absolute;
    top: 0px !important;
    right: 0px !important;
    width: 48px !important;
    height: 48px !important;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
        justify-content: center;
    -ms-flex-align: center;
        align-items: center;
    background: transparent;
    border-radius: 0px; }
    body.master3 .popUpTitle .popUpClose:hover,
    body.master3 .popUpReportTitle .popupClose:hover,
    body.master3 .popUpTitleContactUs .popUpClose:hover,
    body.master3 .popUpTitleTermsConditions .popUpClose:hover,
    body.master3 .popUpTitleClaimConfirm .popUpClose:hover {
      background: rgba(255, 255, 255, 0.25); }
  body.master3 #ContactUsFormHolder, body.master3 #VehicleForm {
    overflow: inherit; }
    body.master3 #ContactUsFormHolder .InputLabel, body.master3 #VehicleForm .InputLabel {
      font-family: Roboto, sans-serif; }
    body.master3 #ContactUsFormHolder .InputText, body.master3 #ContactUsFormHolder .InputSelect, body.master3 #ContactUsFormHolder .InputMessage, body.master3 #VehicleForm .InputText, body.master3 #VehicleForm .InputSelect, body.master3 #VehicleForm .InputMessage {
      font-family: Roboto, sans-serif;
      box-shadow: none;
      border-radius: 3px; }
  body.master3 #FeedbackContactInfoDiv {
    width: 100%; }

/*Fixing toast issue input IE*/
md-toast .md-toast-content {
  min-width: 300px; }

.LinkButtonStyle a.NewMasterButtonStyle:link, .LinkButtonStyle a.NewMasterButtonStyle:visited, .LinkButtonStyle a.NewMasterButtonStyle:active, .actionButton, .actionButton:active, .actionButton:focus, .actionButton:visited {
  background-color: #03a9f4 !important;
  border: none !important;
  border-radius: 0;
  /*box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.28);*/
  transition: all 0.15s ease;
  color: #ffffff !important;
  text-decoration: none; }

.actionButton a, .actionButtona:hover, .actionButton a:visited, .actionButton a:active, .actionButton a:focus {
  color: #ffffff !important; }

.LinkButtonStyle a.NewMasterButtonStyle:hover, .actionButton:hover, .LinkButtonStyle a.NewMasterButtonStyle:focus, .actionButton:focus {
  background-color: #0288d1 !important;
  text-decoration: none !important;
  box-shadow: 0 4px 14px 0 rgba(0, 0, 0, 0.26) !important;
  color: #ffffff !important; }

.ToggleSwitchWrapper, .ToggleSwitchWrapperVertical {
  box-shadow: none !important;
  border: none !important;
  background: none !important;
  border-radius: 2px !important; }

.ToggleSwitchWrapper label, .ToggleSwitchWrapperVertical label {
  background: none !important;
  border: none !important;
  box-shadow: none !important; }

.ToggleSwitchWrapper label:hover, .ToggleSwitchWrapperVertical label:hover {
  background: none !important;
  border: none !important;
  box-shadow: none !important; }

.ToggleSwitchWrapper label.checked, .ToggleSwitchWrapperVertical label.checked {
  background-color: #03a9f4 !important;
  color: #ffffff !important;
  transition: all 0.25s ease; }

.NewMasterButtonStyle {
  color: #ffffff !important;
  text-decoration: none !important; }

.getStartedButtonHolder {
  display: none; }

.dashboardModuleHiddenModulesHolder {
  padding-left: 0 !important;
  margin-left: 0 !important; }

#sortableDashboardModuleButtons li {
  margin: 0 21px 10px 0 !important; }

.dasboardModuleButton {
  /*border: none !important;*/
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26) !important;
  border-radius: 2px !important;
  font-family: 'Roboto', Arial, sans-serif !important;
  transition: all .15s ease !important; }

.dasboardModuleButton:hover {
  box-shadow: 0 4px 14px 0 rgba(0, 0, 0, 0.26) !important;
  transition: all .15s ease !important; }

.dashboardModuleHiddenModulesHolder {
  position: absolute !important;
  margin-top: 0 !important;
  top: 15px !important;
  right: -5px !important;
  background: none !important;
  border: none !important;
  box-shadow: none !important; }

.dashboardModuleButtonTitle {
  font-family: 'Roboto', Arial, sans-serif !important;
  background-color: #ffffff !important;
  color: #666666 !important;
  font-weight: normal !important;
  border-bottom: none !important; }

.dashboardModuleHideModuleButton {
  background-position: -20px 0 !important; }

.dashboardModuleMoveModuleButton {
  background-position: 0 0 !important; }

.dashboardModuleButtonInfoLine.lineOne {
  font-weight: normal !important;
  font-size: 14px !important; }

.dashboardModuleButtonInfoLine.lineTwo {
  font-weight: normal !important;
  font-size: 12px !important; }

.pageContentHolderUnderTabs {
  border: none !important;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26) !important;
  border-radius: 2px !important;
  font-family: 'Roboto', Arial, sans-serif !important;
  background-color: #ffffff !important;
  width: 900px !important; }

.pageContentTabSectionNEW {
  border: none !important;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26) !important;
  border-radius: 2px !important;
  font-family: 'Roboto', Arial, sans-serif !important;
  background-color: #ffffff !important;
  margin: 0 0 15px 0 !important; }

.dashboardModuleHolder {
  background: #ffffff !important;
  border: 1px solid #A1A1A1 !important; }

.DashboardSectionItemHeader {
  border: none !important; }

.DashboardSectionItemHeader h3 {
  font-weight: normal !important;
  font-family: 'Roboto', Arial, sans-serif !important; }

#commuteProfileLeftWrapper {
  background: #ffffff !important; }

.hor-minimalist-b .SummaryTablePrizeTitles {
  background: #efefef !important;
  border-radius: 0 !important; }

.travelMode {
  border-radius: 0 !important;
  border: none !important; }

.travelMode:hover {
  background: #ffffff !important;
  border-radius: 0 !important; }

.selectedTravelMode {
  box-shadow: none !important;
  background: #ffffff !important;
  border-radius: 0 !important;
  border-bottom: 3px solid #03a9f4 !important; }

.travelModeTitle {
  font-weight: normal !important; }

.modeStat {
  color: #03a9f4 !important; }

.modeStatDist {
  color: #7a7a7a !important;
  font-weight: normal !important; }

.travelMode:active {
  box-shadow: none !important; }

.CommuterInformationSmall .textboxBorder,
.addressThreeAddresses .textboxBorder,
.addressThreeAddresses .textboxBorder {
  border: none !important; }

.CommuterInformationSmall .predictiveTextBoxWrapper input[type=text],
.addressThreeAddresses .predictiveTextBoxWrapper input[type=text],
.addressThreeAddresses .predictiveTextBoxWrapper input[type=text] {
  border: none !important;
  border-radius: 0 !important;
  border-bottom: 1px solid #9e9e9e !important; }

.TravelPlanner .PTBHolder label, .TravelPlanner .ToggleSwitchLabel {
  font-weight: normal !important;
  color: #757575 !important; }

.profileDetailsInputHolder {
  position: relative;
  display: inline-block; }

.profileDetailsInput {
  display: block !important;
  width: 100% !important;
  margin: 0 !important;
  border: 0 !important;
  border-bottom: 1px solid #9e9e9e !important;
  font-size: 14px !important;
  padding: 4px 0 !important;
  background-color: transparent !important;
  color: #333333 !important;
  z-index: 2 !important;
  height: 20px !important;
  margin-left: 10px !important;
  width: 275px !important;
  border-radius: 0 !important; }

.profileDetailsInput ~ label {
  width: 100% !important;
  position: absolute !important;
  pointer-events: none !important;
  bottom: 5px !important;
  font-weight: 400 !important; }

.profileDetailsInput ~ label:after {
  content: '';
  background-color: #03a9f4;
  height: 2px;
  width: 10px;
  bottom: -5px;
  left: 50%;
  visibility: hidden;
  position: absolute;
  transition: .2s ease all;
  -webkit-transition: .2s ease all;
  margin-left: 5px; }

.profileDetailsInput:focus {
  outline: none; }

.profileDetailsInput:focus ~ label:after {
  visibility: visible;
  width: 100%;
  left: 0; }

.profileDivider {
  color: #EEEEEE !important;
  background: #EEEEEE !important; }

.ProfileEditUserIDTable .dialog_field_value {
  width: 700px;
  padding-left: 30px;
  padding-bottom: 7px; }

.GlobalHelpIconInlineChangeLogin {
  left: 305px; }

select.field_input {
  margin-left: 10px;
  background: none;
  border-radius: 0;
  border: none;
  border-bottom: 1px solid #9e9e9e;
  height: 30px;
  font-size: 14px;
  padding-left: 0;
  width: 275px; }

select.field_input:focus, select.field_input:hover {
  outline: none !important;
  border: none !important;
  border-bottom: 1px solid #9e9e9e !important; }

.pageContentTabSectionUnderTabs {
  background: none !important;
  border: none !important;
  min-height: 0 !important;
  margin: 0 !important; }

.pageContentTabsNEW {
  padding-left: 0 !important;
  margin-left: -2px; }

.pageContentTabNEW a:link, .DashboardPageSectionTab a:link, .pageContentTabNEW a:active, .DashboardPageSectionTab a:active, .pageContentTabNEW a:focus, .DashboardPageSectionTab a:focus, .pageContentTabNEW a:visited, .DashboardPageSectionTab a:visited {
  background: #f5f5f5 !important;
  border-radius: 0 !important;
  border: 1px solid #f5f5f5 !important;
  font-size: 14px !important;
  font-weight: normal !important;
  color: #666666 !important; }

.pageContentTabNEW a:hover, .DashboardPageSectionTab a:hover {
  background: #ffffff !important; }

.pageContentTabNEW.openPageContentTab a, .DashboardPageSectionTab.openPageSectionTab a, .pageContentTabNEW.openPageContentTab a:hover, .DashboardPageSectionTab.openPageSectionTab a:hover {
  background: #ffffff !important;
  border: 1px solid #EEEEEE !important;
  border-bottom: 2px solid #03a9f4 !important;
  margin-bottom: 2px; }

.pageContentTabSectionInner {
  padding-left: 0 !important;
  color: #666666 !important; }

.EmailConfirmationTable .info_message {
  background-color: #ffbaba; }

.modified-email-confirmation-bar.container-Center {
  width: 100%; }

.modified-email-info-wrapper.info_message {
  background-image: none;
  background: #c10300;
  background-color: #c10300;
  color: #FFFFFF;
  border: none;
  text-align: center;
  padding: 0 0 15px 0px !important; }

.modified-email-info-wrapper.info_message #ctl01_PageNavigation3_ResendConfirmationEmailLinkButton, .modified-email-info-wrapper.info_message #ctl01_PageNavigation3_SetContactEmailLinkButton {
  color: #212121 !important;
  height: 36px;
  background-color: #fff;
  padding: 10px 16px;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.28);
  border-radius: 2px;
  margin-left: 8px; }

.pointRedeemButton a {
  background-color: #03a9f4 !important;
  background-image: none !important;
  border: none !important;
  border-radius: 0 !important;
  font-family: 'Roboto', Arial, sans-serif !important;
  color: #ffffff !important;
  font-weight: normal !important;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.28) !important;
  transition: all .15s ease !important;
  margin-top: 7px !important; }

.pointRedeemButton a:hover {
  box-shadow: 0 4px 14px 0 rgba(0, 0, 0, 0.26) !important;
  transition: all .15s ease !important; }

.addressThreeAddresses label, .addressThreeAddresses .InputLabel {
  font-size: 12.5px !important;
  color: #757575 !important; }

.pageContentTabNEW, .DashboardPageSectionTab {
  margin-right: 0 !important; }

.post-button {
  position: relative;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.28);
  transition: all 0.15s ease; }
  .post-button.is-active, .post-button:active, .post-button:focus, .post-button:hover, .post-button.is-hover {
    box-shadow: 0 4px 14px 0 rgba(0, 0, 0, 0.26) !important; }

.CollapseExpandButton {
  background-image: none;
  padding-right: 0; }
  .CollapseExpandButton.Collapsed {
    background-image: none; }

.singleTripPopulateHolder {
  background-color: #ffffff; }

.singleTripWrapper {
  margin: 0; }
  .singleTripWrapper .ModuleContentHolder {
    background: none;
    border: none;
    border-radius: 0; }
  .singleTripWrapper .ModuleContentHeader {
    padding: 8px;
    font-style: normal;
    background: none;
    border-radius: 0;
    box-shadow: none;
    border: none;
    font-weight: normal; }

.singleTripContactButton {
  background-color: #03a9f4 !important;
  border: none !important;
  border-radius: 0;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.28);
  transition: all 0.15s ease;
  color: #ffffff !important;
  font-weight: normal !important; }
  .singleTripContactButton:hover {
    background-color: #0288d1 !important;
    text-decoration: none !important;
    box-shadow: 0 4px 14px 0 rgba(0, 0, 0, 0.26) !important;
    color: #ffffff !important; }

.singleTripPortalHolder .searchTripMapPlaceHolder {
  width: 433px; }

.singleTripPortalHolder .predictiveTravelGooglemapWrp {
  border: none; }

.singleTripPortalHolder .textboxBorder {
  border: none;
  box-shadow: none; }

.singleTripPortalHolder .predictiveTextBoxWrapper {
  border: none !important;
  border-bottom: 1px solid #9e9e9e !important;
  border-radius: 0 !important; }

#singleTripSearchButton {
  margin-top: 20px;
  margin-bottom: 5px; }

.singleTripTabs {
  padding-left: 0;
  margin: 0; }
  .singleTripTabs .singleTripTab {
    margin: 0; }
    .singleTripTabs .singleTripTab a, .singleTripTabs .singleTripTab a:hover {
      background: none;
      border: none; }
    .singleTripTabs .singleTripTab .openSingleTripTabBefore, .singleTripTabs .singleTripTab .openSingleTripTabAfter, .singleTripTabs .singleTripTab .singleTripTabAfter, .singleTripTabs .singleTripTab .singleTripTabBefore {
      background: none;
      height: 0;
      width: 0;
      left: 0; }

.singleTripButton {
  margin: 0 5px; }

.postTripButton {
  float: right;
  margin-right: 0px; }

.progressBarHolder {
  margin-bottom: 10px; }

.singleTripAdditionalInfoOptionHolder {
  margin: 0; }

.singleTripAdvancedSettingsButtonHolder {
  position: relative;
  background: none;
  border-radius: none;
  color: #03a9f4;
  bottom: 0;
  padding: 0;
  text-align: right;
  clear: both;
  padding: 8px 0;
  margin-right: -5px;
  height: 10px; }

.SingleTripPage .pageContentHolderUnderTabs {
  width: 960px !important;
  background: #ffffff; }

.SingleTripPage .ModuleContentHolder {
  background-color: #fff;
  border: 1px solid #bdbdbd;
  border-radius: 2px;
  transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
  border: 0; }
  .SingleTripPage .ModuleContentHolder:before, .SingleTripPage .ModuleContentHolder:after {
    content: " ";
    display: table; }
  .SingleTripPage .ModuleContentHolder:after {
    clear: both; }

.singleTripTab {
  background: #f5f5f5 !important;
  border-radius: 0 !important;
  border: 1px solid #f5f5f5 !important; }
  .singleTripTab a {
    font-size: 14px !important;
    font-weight: normal !important;
    color: #666666 !important; }
  .singleTripTab:hover {
    background: #ffffff !important; }
  .singleTripTab.openSingleTripTab {
    background: #ffffff !important;
    border: 1px solid #EEEEEE !important;
    border-bottom: 2px solid #03a9f4 !important; }

.singleTripAdditionalInfoHolder {
  background: #f5f5f5;
  border-radius: 0;
  margin: 10px 5px 0 0; }
  .singleTripAdditionalInfoHolder .singleTripChooseDate {
    border-radius: 0; }
  .singleTripAdditionalInfoHolder .ToggleSwitchWrapper {
    margin: 0 0 10px 0;
    border-radius: 0 !important;
    height: 26px; }
    .singleTripAdditionalInfoHolder .ToggleSwitchWrapper label {
      border-radius: 0 !important; }
      .singleTripAdditionalInfoHolder .ToggleSwitchWrapper label span {
        line-height: 27px; }

.singleTripPortalWrapper {
  background-color: #fff;
  border: 1px solid #bdbdbd;
  border-radius: 2px;
  transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
  border: 0; }
  .singleTripPortalWrapper:before, .singleTripPortalWrapper:after {
    content: " ";
    display: table; }
  .singleTripPortalWrapper:after {
    clear: both; }
  .singleTripPortalWrapper .singleTripChooseDate, .singleTripPortalWrapper .singleTripChooseTime, .singleTripPortalWrapper .singleTripMyTripSearchBar, .singleTripPortalWrapper .singleTripChooseVehicle, .singleTripPortalWrapper .singleTripChooseCost, .singleTripPortalWrapper .singleTripCreateNoteInput, .singleTripPortalWrapper #singleTripMyTripFilterOptions {
    border-radius: 0; }
  .singleTripPortalWrapper .ToggleSwitchWrapper {
    margin: 0 0 10px 0;
    border-radius: 0 !important;
    height: 26px; }
    .singleTripPortalWrapper .ToggleSwitchWrapper label {
      border-radius: 0 !important; }
      .singleTripPortalWrapper .ToggleSwitchWrapper label span {
        line-height: 27px; }

.singleTripPostTripPopUpHeader {
  background: none;
  border-radius: none;
  padding: 5px 0 10px 0;
  font-size: 16px;
  text-align: left; }

.singleTripCancelHeader .cancelTextClose {
  background: none;
  border: none;
  color: black;
  font-size: 24px;
  top: 17px; }

.singleTripCancelHeader .cancelTextClose:before {
  content: "\e62b";
  font-family: rs-icons; }

#singleTripPopUpPhoneNumber, #singleTripPopUpNotes {
  border-radius: 0; }

.singleTripRightButton {
  border-radius: 0;
  transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
  border: none; }

.singleTripContactConfirmHolder {
  border-radius: 2px; }

.singleTripConfirmNotesNumberHolder input, .singleTripConfirmNotesNumberHolder textarea {
  border-radius: 0px; }

#singleTripSearchMyTripsButton {
  margin-top: 21px;
  margin-left: 25px; }

.singleTripContentTitle {
  font-size: 16px;
  margin-top: -6px; }

.singleTripMyBookedTripsReturnedHolder, .singleTripSearchReturnedRecentlyPostedHolder {
  margin-top: 20px; }

.ui-timepicker-div {
  font-size: 10px !important; }

div.request-carpool-btn p,
div.days-row p {
  margin-bottom: 0; }

.master3 .more-info-alongRoute {
  padding-right: 0;
  padding-top: 0;
  position: absolute;
  bottom: 2px;
  left: 400px; }

.master3 div.more-info p {
  margin-bottom: 0;
  white-space: nowrap; }

#google_translate_element {
  float: right;
  margin-right: 8px; }

.modified-conversation-dialog.InternalMessagingPanel .popUpWindow {
  border: none;
  border-radius: 2px; }

.modified-conversation-dialog.InternalMessagingPanel .popUpTitle {
  color: #212121;
  background: none; }

.modified-conversation-dialog.InternalMessagingPanel .popUpTitle h3 {
  color: #212121; }

.modified-conversation-dialog.InternalMessagingPanel .InternalMessaging_ConversationSection {
  padding: 8px 16px 5px 16px; }

.modified-conversation-dialog.InternalMessagingPanel .InternalMessaging_ReplyTextArea {
  margin: 0px 16px 16px 82px;
  max-width: 100%;
  width: calc(100% - 98px);
  border: 1px solid #e0e0e0;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  padding-left: 16px; }

.modified-conversation-dialog.InternalMessagingPanel textarea:focus {
  border-bottom-color: #03a9f4 !important; }

.modified-conversation-dialog.InternalMessagingPanel .popUpButtonsContainer {
  padding: 16px;
  float: none;
  text-align: right; }

.modified-conversation-dialog.InternalMessagingPanel .buttonRight {
  margin-left: 16px; }

.modified-conversation-dialog.InternalMessagingPanel .buttonLeft {
  float: none; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*

    This is NOT used in Desktop.scss. Look in core/paper-card for that.

*/
/*

    This is NOT used in Desktop.scss. Look in core/paper-card for that.

*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*

    This is NOT used in Desktop.scss. Look in core/paper-card for that.

*/
/*

    This is NOT used in Desktop.scss. Look in core/paper-card for that.

*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*

    This is NOT used in Desktop.scss. Look in core/paper-card for that.

*/
/*

    This is NOT used in Desktop.scss. Look in core/paper-card for that.

*/
.InternalMessagingControl_SendCommunicationsToEmailCheckboxHolder {
  padding-left: 20px;
  margin-bottom: 5px; }
  .InternalMessagingControl_SendCommunicationsToEmailCheckboxHolder .InternalMessagingControl_SendCommunicationsToEmailCheckboxArea {
    font-weight: normal;
    font-size: 12px;
    padding-left: 5px;
    vertical-align: top;
    margin-top: 5px; }

@font-face {
  font-family: 'rs-icons';
  src: url("fonts/rs-icons.eot?we8uy9");
  src: url("fonts/rs-icons.eot?#iefixwe8uy9") format("embedded-opentype"), url("fonts/rs-icons.svg?we8uy9#rs-icons") format("svg");
  font-weight: normal;
  font-style: normal; }

[class^="rs-icon-"], [class*=" rs-icon-"] {
  font-family: 'rs-icons';
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

.forgot-password-submit-card-icon {
  font-size: 55px;
  font-weight: lighter;
  line-height: 0;
  text-align: center;
  color: white;
  position: absolute;
  top: 115px;
  left: 0;
  width: 320px; }

.rs-icon._checkmark-fco:before {
  content: "\e637"; }

.rs-icon._checkmark:before {
  content: "\e62f"; }

.rs-icon._exit:before, body.master3 #PopUpContainer #PopUpClose:before, body.master3 #PopUpContainer #PopUpCloseCS:before {
  content: "\e909"; }

.CellNumberConfirmation {
  font-size: 32px !important;
  /*width: 100px;*/
  text-align: center;
  margin: auto !important; }

.sendNewCellNumberConfirmation {
  margin-top: 8px !important;
  /*text-align:center;*/ }
  .sendNewCellNumberConfirmation a, .sendNewCellNumberConfirmation a:visited, .sendNewCellNumberConfirmation a:active {
    color: #03a9f4 !important;
    text-decoration: none !important; }

.confirmationCodeButtons a, .confirmationCodeButtons a:visited, .confirmationCodeButtons a:active {
  padding: 8px 32px !important;
  margin-top: 16px !important;
  margin-bottom: -16px !important;
  display: inline-block; }

.confirmationCodeButtons .clearButtonStyle a, .confirmationCodeButtons .clearButtonStyle a:visited, .confirmationCodeButtons .clearButtonStyle a:active {
  color: #03a9f4 !important;
  padding-left: 0px !important; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The directions-result-summary component.

		Contains a text summary of bike direction, duration and distance.
      
        HTML Structure:

		directions-result-summary
            --> div: result wrapper
                --> text: route addresses
                --> text: travel distance and duration

	*/
directions-result-summary {
  display: -ms-flexbox;
  display: flex; }

.directions-result-summary--text-container {
  padding: 16px;
  width: 100%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column; }

.directions-result-summary--text-container-summary {
  white-space: normal; }

.directions-result-summary--text-container-summary-travel-mode {
  font-size: 16px;
  color: rgba(0, 0, 0, 0.87); }

.directions-result-summary--text-container-details {
  padding-top: 4px; }

.directions-result-summary--text-container-details-distance {
  color: rgba(0, 0, 0, 0.54);
  padding-right: 16px; }

.directions-result-summary--text-container-details-duration {
  color: rgba(0, 0, 0, 0.87); }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        The route-addresses-summary-display component.

        Todo: Add description here.

        HTML Structure:

        Todo: Document HTML Structure
        route-addresses-summary-display

    */
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        The address-summary-display component.

        Todo: Add description here.

        HTML Structure:

        Todo: Document HTML Structure
        address-summary-display

    */
address-summary-display {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center; }
  address-summary-display._orig .address-summary-display--circle-status-icon {
    background-color: #4CAF50; }
  address-summary-display._dest .address-summary-display--circle-status-icon {
    background-color: #F44336; }

.address-summary-display--circle-status-icon {
  display: block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  -ms-flex: 0 0 auto;
      flex: 0 0 auto; }

.address-summary-display--route {
  color: rgba(0, 0, 0, 0.54);
  padding-left: 10px;
  height: 20px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap; }
  .address-summary-display--route:hover {
    /*white-space: normal;
                height: auto;*/ }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The map-directions-overlay-card component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		map-directions-overlay-card

	*/
map-directions-overlay-card {
  display: -ms-flexbox;
  display: flex;
  background-color: #fff;
  -ms-flex-direction: column;
      flex-direction: column;
  width: 480px;
  height: 100%;
  /*added for IE positioning issue*/
  top: 0px; }
  map-directions-overlay-card.is-hidden {
    display: none; }
  map-directions-overlay-card._drawer-style {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out 0.1s; }
    map-directions-overlay-card._drawer-style.is-hidden {
      display: -ms-flexbox;
      display: flex;
      opacity: 0;
      transform: translateX(-100%); }
    map-directions-overlay-card._drawer-style:not(.is-hidden) {
      opacity: 1;
      transform: translateX(0); }

.map-directions-overlay-card {
  /* &--close-icon-btn {
            position:absolute;
            top: 0;
            right: 0;
            z-index: 2;
        }*/ }
  .map-directions-overlay-card--heading {
    -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    width: 100%;
    min-height: 56px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
  .map-directions-overlay-card--directions-result-summary {
    width: 100%; }
  .map-directions-overlay-card--bottom-row {
    -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    display: block;
    width: 100%; }
  .map-directions-overlay-card--close-flat-btn {
    margin: 8px auto 8px 8px; }
  .map-directions-overlay-card--directions-summary {
    -ms-flex: 1 0 auto;
        flex: 1 0 auto;
    max-height: calc(100% - 56px);
    background-color: #fff; }
    .map-directions-overlay-card--directions-summary .directions-summary {
      padding: 16px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.ReceiptTable {
  width: 100%;
  padding: 16px;
  display: block; }
  .ReceiptTable:before, .ReceiptTable:after {
    content: " ";
    display: table; }
  .ReceiptTable:after {
    clear: both; }
  .ReceiptTable-lineItemList {
    float: left;
    width: 100%;
    margin: 0; }
    .ReceiptTable-lineItemList:before, .ReceiptTable-lineItemList:after {
      content: " ";
      display: table; }
    .ReceiptTable-lineItemList:after {
      clear: both; }
  .ReceiptTable-lineItem {
    width: 100%;
    float: left;
    clear: left;
    list-style: none; }
    .ReceiptTable-lineItem:before, .ReceiptTable-lineItem:after {
      content: " ";
      display: table; }
    .ReceiptTable-lineItem:after {
      clear: both; }
  .ReceiptTable-lineItemLabel {
    float: left;
    width: 75%;
    margin-top: 8px;
    display: block; }
  .ReceiptTable-lineItemValue {
    float: right;
    text-align: right;
    width: 25%;
    font-size: 32px;
    line-height: 36px;
    color: #838383; }
  .ReceiptTable-sum {
    width: 100%;
    float: left;
    clear: both;
    border-top: solid 1px grey; }
  .ReceiptTable-sumLabel {
    width: 75%;
    float: left;
    margin-top: 8px; }
  .ReceiptTable-sumValue {
    /*width: 25px;*/
    float: right;
    text-align: right;
    color: #389AD3;
    font-size: 32px;
    line-height: 36px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.two-line-notification-list-item {
  display: -ms-flexbox;
  display: flex;
  display: -webkit-flex; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.rs-ptb-list {
  background-color: white;
  overflow-x: hidden;
  max-height: 225px;
  margin: 0;
  padding: 0;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
  z-index: 5; }
  .rs-ptb-list--icon {
    padding: 0 16px 0 4px;
    font-size: 20px !important; }
  .rs-ptb-list--current-location .rs-icon {
    color: #03a9f4; }
  .rs-ptb-list .list-group-item {
    height: 48px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    padding: 4px 16px !important; }
    .rs-ptb-list .list-group-item:active {
      background-color: #eeeeee; }

.ptb-list-item--address-group {
  overflow: hidden; }

.ptb-list-item--address-name {
  font-weight: 700;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  width: 100%; }

.ptb-list-item--address-full {
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
  width: 100%; }

.ptb-list-item--clock-icon {
  color: #AEAEAE;
  margin-left: auto;
  padding: 0;
  width: 48px;
  text-align: right; }

/*Temporary house for the desktop ptb list*/
.rs-ptb--address-input {
  min-height: 32px !important; }

.bg-selection-on-hover:hover {
  background-color: #eeeeee !important; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        The rating-star-display component.

        Todo: Add description here.

        HTML Structure:

        Todo: Document HTML Structure
        rating-star-display

    */
rating-star-display {
  color: #FFD600; }

.rating-star-display--icon-container > .rs-icon._star-outline {
  opacity: 0;
  visibility: hidden; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The assorted-search-filter component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		assorted-search-filter

	*/
assorted-search-filter {
  display: -ms-flexbox;
  display: flex; }
  assorted-search-filter.is-hidden {
    display: none; }

.assorted-search-filter--container {
  width: 100%;
  height: 48px;
  padding: 7px 0px; }

.assorted-search-filter--container-item._slider {
  width: 100%; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The base-search-filter component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		base-search-filter

	*/
base-search-filter {
  display: -ms-flexbox;
  display: flex; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The checkbox-search-filter component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		checkbox-search-filter

	*/
checkbox-search-filter {
  display: -ms-flexbox;
  display: flex; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The search-filter-form-group component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		search-filter-form-group

	*/
search-filter-form-group {
  display: -ms-flexbox;
  display: flex; }

.search-filter-form-group--search-filter-list {
  -ms-flex: 1 0 100%;
      flex: 1 0 100%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; }

.search-filter-form-group--search-filter-list-item {
  -ms-flex: 1 0 100%;
      flex: 1 0 100%; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The search-filter-form component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		search-filter-form

	*/
search-filter-form {
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -ms-flex-direction: column;
      flex-direction: column; }

.search-filter-form {
  /* Layout:
             * The component is made using ng-repeat. The entire thing is called "rows", and each "row" in that rows is a filter.
             * Within each filter, there can exist another set of "rows". This is when a filter is subdivided.
             * Within this second level of rows, there can exist columns if required.
             * For example, Male & Female checkboxes are in one column, and Smoker & Non-Smoker are in another.
            */ }
  .search-filter-form--heading {
    -ms-flex: 1 0 100%;
        flex: 1 0 100%;
    display: -ms-flexbox;
    display: flex; }
    .search-filter-form--heading-label {
      -ms-flex: 1 0 auto;
          flex: 1 0 auto;
      margin-right: auto; }
    .search-filter-form--heading-toggle-switch {
      -ms-flex: 1 0 auto;
          flex: 1 0 auto;
      margin-left: auto; }
  .search-filter-form--rows {
    -ms-flex: 1 0 100%;
        flex: 1 0 100%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    /* 
            .search-filter-form--row:nth-child(1) {

                .search-filter-form--column:nth-child(2) {
                    margin-left: 10px;
                    border-left: 1px solid #e4e4e4;
                    padding-left: 30px;
                }
            } */ }
    .search-filter-form--rows._nested-mode .search-filter-form--rows {
      border: none; }
    .search-filter-form--rows._nested-mode.ng-enter {
      transition: transform 0.06s ease-in, opacity 0.1s linear;
      opacity: 0;
      transform: scale(0.8, 0);
      transform-origin: top; }
    .search-filter-form--rows._nested-mode.ng-enter-active {
      opacity: 1;
      transform: scale(1, 1); }
    .search-filter-form--rows._nested-mode.ng-leave {
      transition: transform 0.1s ease-in, opacity 0.1s linear;
      opacity: 1;
      transform: scale(1, 1);
      transform-origin: top; }
    .search-filter-form--rows._nested-mode.ng-leave-active {
      opacity: 0;
      transform: scale(0.8, 0); }
  .search-filter-form--row {
    -ms-flex: 1 0 100%;
        flex: 1 0 100%;
    display: -ms-flexbox;
    display: flex;
    border-top: 1px solid #e4e4e4;
    margin: 0 -16px 0 -16px;
    padding: 0 16px 0 16px;
    /*IE collapse fix*/
    min-height: 72px;
    /* Male | Female | Smoker | Non-Smoker */ }
    .search-filter-form--row .search-filter-form--column-filter-form {
      width: 100%; }
      .search-filter-form--row .search-filter-form--column-filter-form .search-filter-form--heading {
        -ms-flex-pack: justify;
            justify-content: space-between;
        -ms-flex-align: center;
            align-items: center;
        font-size: 16px;
        font-weight: 400; }
    .search-filter-form--row.alt--padded-row {
      padding: 8px 16px 8px 16px; }
    .search-filter-form--row.alt--min-height-row {
      /*IE collapse fix*/
      min-height: 112px;
      -ms-flex: 1 0 auto;
          flex: 1 0 auto; }
    .search-filter-form--row.alt--thin-row {
      min-height: 48px; }
    .search-filter-form--row.alt--no-underline + .search-filter-form--row {
      border-top: none; }
    .search-filter-form--row.alt--distance-search-form {
      -ms-flex: 1 1 auto;
          flex: 1 1 auto; }
  .search-filter-form--column {
    -ms-flex: 1 1 auto;
        flex: 1 1 auto; }
  .search-filter-form--column-filter {
    width: 100%; }
    .search-filter-form--column-filter .checkbox-search-filter--icon {
      font-size: 24px;
      padding: 0 16px 0 0; }
      .search-filter-form--column-filter .checkbox-search-filter--icon ._initial-location {
        color: #0fb62b; }
      .search-filter-form--column-filter .checkbox-search-filter--icon ._end-location {
        color: #e73d38; }
    .search-filter-form--column-filter .checkbox-search-filter--checkbox {
      color: #898989; }
      .search-filter-form--column-filter .checkbox-search-filter--checkbox:hover {
        color: #000000; }
  .search-filter-form--column-filter-group {
    width: 100%;
    padding: 0 0 0 0; }
    .search-filter-form--column-filter-group .search-filter-form-group--search-filter-list .search-filter-form-group--search-filter-list-item md-select ._md-select-value {
      border-bottom: none; }
    .search-filter-form--column-filter-group .search-filter-form-group--search-filter-list .search-filter-form-group--search-filter-list-item md-select ._md-text {
      color: #898989; }
    .search-filter-form--column-filter-group .search-filter-form-group--search-filter-list .search-filter-form-group--search-filter-list-item md-input-container {
      margin: 0 0 0 0;
      padding: 0 0 0 0; }
      .search-filter-form--column-filter-group .search-filter-form-group--search-filter-list .search-filter-form-group--search-filter-list-item md-input-container label {
        font-size: 16px;
        color: #000000;
        font-weight: 400;
        /* Old rules being called from abstract files which must be overwritten to match the updated style */
        overflow: auto;
        text-overflow: initial;
        padding: 0 0 0 0;
        margin: 0 0 0 0 !important;
        display: initial;
        position: relative; }
        .search-filter-form--column-filter-group .search-filter-form-group--search-filter-list .search-filter-form-group--search-filter-list-item md-input-container label:not(._md-container-ignore) {
          position: relative;
          top: 0px; }
        .search-filter-form--column-filter-group .search-filter-form-group--search-filter-list .search-filter-form-group--search-filter-list-item md-input-container label:not(.md-no-float) {
          transform: none; }
    .search-filter-form--column-filter-group checkbox-search-filter {
      color: #898989; }
      .search-filter-form--column-filter-group checkbox-search-filter:hover {
        color: #000000; }
      .search-filter-form--column-filter-group checkbox-search-filter .checkbox-search-filter--icon {
        padding: 0 16px 0 0;
        font-size: 24px;
        height: 24px; }
      .search-filter-form--column-filter-group checkbox-search-filter md-checkbox {
        margin: 0 0 0 0; }
        .search-filter-form--column-filter-group checkbox-search-filter md-checkbox ._md-container {
          left: auto;
          right: 0; }
        .search-filter-form--column-filter-group checkbox-search-filter md-checkbox ._md-label {
          display: -ms-flexbox;
          display: flex;
          -ms-flex-align: center;
              align-items: center;
          margin-left: 0;
          margin-right: 30px; }
        .search-filter-form--column-filter-group checkbox-search-filter md-checkbox:last-of-type {
          width: 100%; }

@media (max-width: 768px) {
  .search-filter-form--heading-label {
    min-width: 180px;
    /*added for IE space collapse */ } }

@media (min-width: 769px) {
  .search-filter-form--heading-label {
    min-width: 254px;
    /*added for IE space collapse */ } }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The select-search-filter component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		select-search-filter

	*/
select-search-filter {
  display: -ms-flexbox;
  display: flex; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The slider-search-filter component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		slider-search-filter

	*/
slider-search-filter {
  display: -ms-flexbox;
  display: flex; }
  slider-search-filter > md-slider-container {
    width: 100%; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The text-search-filter component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		text-search-filter

	*/
text-search-filter {
  display: -ms-flexbox;
  display: flex; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        The tour-exhibit component.

        Todo: Add description here.

        HTML Structure:

        Todo: Document HTML Structure
        tour-exhibit

    */
tour-exhibit {
  display: block;
  margin-top: 24px;
  margin-left: auto;
  margin-right: auto;
  background-color: #fff;
  font-family: 'Roboto', Arial, sans-serif;
  text-align: center; }

.tour-exhibit--exhibit-container {
  font-size: 14px; }

.tour-exhibit--exhibit-header {
  font-size: 20px;
  padding: 24px 16px 16px;
  color: rgba(0, 0, 0, 0.54); }

.tour-exhibit--exhibit-text {
  padding: 16px;
  color: rgba(0, 0, 0, 0.54);
  font-weight: 500; }

.tour-exhibit--map-input {
  padding: 16px; }

.tour-exhibit--map-button-container {
  padding: 16px 16px 24px; }

.tour-exhibit--map-button {
  padding: 0 48px;
  height: 36px;
  color: #fff; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        The ui-tour-controls component.

        Todo: Add description here.

        HTML Structure:

        Todo: Document HTML Structure
        ui-tour-controls

    */
ui-tour-controls {
  display: -ms-flexbox;
  display: flex; }

.ui-tour-controls--tourguide-actions {
  display: -ms-flexbox;
  display: flex;
  width: 100%; }

.ui-tour-controls--tourguide-next-or-ok-holder {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  margin-left: auto; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        HTML Structure:

        trip-address-picker
            --addresses-list
                --address-picker
            --address-order-control-group
                --swap-btn

    */
trip-address-picker {
  display: -ms-flexbox;
  display: flex; }

.trip-address-picker--address-list-group {
  /*flex: 2 1 88%;
            padding: 24px 0;*/ }

.trip-address-picker--address-picker:first-child {
  /*margin-bottom: 8px;*/ }

.trip-address-picker--addresses-list {
  margin: 16px 16px 0px 16px;
  -ms-flex: 1 0 auto;
      flex: 1 0 auto; }

.trip-address-picker--address-order-control-group {
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  height: 96px;
  padding: 0;
  margin-top: 16px;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex: 0 0;
      flex: 0 0; }

.trip-address-picker--swap-btn {
  margin-top: 24px;
  padding: 0 16px 0 0 !important;
  color: #5f5c5c !important; }
  .trip-address-picker--swap-btn .rs-icon {
    font-size: 24px;
    transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -webkit-transition: all 0.3s ease; }
    .trip-address-picker--swap-btn .rs-icon:hover {
      color: #03a9f4;
      transform: scale(1.2); }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.trip-itinerary-picker {
  background-color: white; }
  .trip-itinerary-picker--address-picker {
    height: 104px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        The seat-map-display component.

        Todo: Add description here.

        HTML Structure:

        Todo: Document HTML Structure
        seat-map-display

    */
seat-map-display {
  display: -ms-flexbox;
  display: flex;
  background-color: #fff;
  height: 100%;
  max-height: 376px; }

.seat-map-display--seat-row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
      justify-content: space-between; }

.seat-map-display--single-trip-vehicles {
  padding: 8px;
  position: relative;
  transform: rotate(90deg);
  /*Single-Trip-Pickup*/
  /*Extended Pickup*/
  /*Single Trip Car*/
  /*Single-Trip-SUV*/
  /*Single-Trip-Station-Wagon*/
  /*Single Trip 15 Passenger Van*/
  /*end of 15PassengerVan*/
  /*Single Trip 12 Passenger Van*/
  /*end of 12PassengerVan*/
  /*Single Trip 9 Passenger Van*/
  /*end of 9PassengerVan*/
  /*Single Trip Van*/
  /*Single Trip Mini Van*/
  /*end of Single Trip Mini Van*/ }
  .seat-map-display--single-trip-vehicles._single-trip-pickup .seat-map-display--seat-row-container {
    position: absolute;
    top: 62px;
    left: 28px;
    width: 110px; }
  .seat-map-display--single-trip-vehicles._single-trip-pickup .seat-map-display--seat-row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    margin-bottom: 4px; }
    .seat-map-display--single-trip-vehicles._single-trip-pickup .seat-map-display--seat-row._front {
      -ms-flex-pack: justify;
          justify-content: space-between; }
  .seat-map-display--single-trip-vehicles._single-trip-extended-pickup .seat-map-display--seat-row-container {
    position: absolute;
    top: 62px;
    left: 30px;
    width: 110px; }
  .seat-map-display--single-trip-vehicles._single-trip-extended-pickup .seat-map-display--seat-row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    margin-bottom: 4px;
    -ms-flex-pack: justify;
        justify-content: space-between; }
    .seat-map-display--single-trip-vehicles._single-trip-extended-pickup .seat-map-display--seat-row._front {
      -ms-flex-pack: justify;
          justify-content: space-between; }
  .seat-map-display--single-trip-vehicles._single-trip-car .seat-map-display--seat-row-container {
    position: absolute;
    top: 106px;
    left: 37px;
    width: 106px; }
  .seat-map-display--single-trip-vehicles._single-trip-car .seat-map-display--seat-row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    margin-bottom: 4px;
    -ms-flex-pack: justify;
        justify-content: space-between; }
    .seat-map-display--single-trip-vehicles._single-trip-car .seat-map-display--seat-row._front {
      -ms-flex-pack: justify;
          justify-content: space-between;
      /* .seat-map-display--vehicle-seat {
                            &._center {
                                visibility: hidden;
                            }
                        }*/ }
  .seat-map-display--single-trip-vehicles._single-trip-suv .seat-map-display--seat-row-container {
    top: 103px;
    left: 40px;
    position: absolute;
    width: 118px; }
  .seat-map-display--single-trip-vehicles._single-trip-suv .seat-map-display--seat-row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    margin-bottom: 4px;
    -ms-flex-pack: justify;
        justify-content: space-between; }
    .seat-map-display--single-trip-vehicles._single-trip-suv .seat-map-display--seat-row._front {
      -ms-flex-pack: justify;
          justify-content: space-between; }
    .seat-map-display--single-trip-vehicles._single-trip-suv .seat-map-display--seat-row._first-row {
      -ms-flex-pack: justify;
          justify-content: space-between; }
  .seat-map-display--single-trip-vehicles._single-trip-station-wagon .seat-map-display--seat-row-container {
    position: absolute;
    top: 64px;
    left: 24px;
    width: 110px; }
  .seat-map-display--single-trip-vehicles._single-trip-station-wagon .seat-map-display--seat-row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    margin-bottom: 4px; }
    .seat-map-display--single-trip-vehicles._single-trip-station-wagon .seat-map-display--seat-row._front {
      -ms-flex-pack: justify;
          justify-content: space-between; }
    .seat-map-display--single-trip-vehicles._single-trip-station-wagon .seat-map-display--seat-row._first-row {
      -ms-flex-pack: justify;
          justify-content: space-between; }
  .seat-map-display--single-trip-vehicles._single-trip-15-passenger .seat-map-display--seat-row-container {
    position: absolute;
    top: 95px;
    left: 41px;
    width: 139px; }
  .seat-map-display--single-trip-vehicles._single-trip-15-passenger .seat-map-display--seat-row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    margin-bottom: 4px; }
    .seat-map-display--single-trip-vehicles._single-trip-15-passenger .seat-map-display--seat-row._front {
      -ms-flex-pack: justify;
          justify-content: space-between; }
  .seat-map-display--single-trip-vehicles._single-trip-12-passenger .seat-map-display--seat-row-container {
    position: absolute;
    top: 114px;
    left: 45px;
    width: 131px; }
  .seat-map-display--single-trip-vehicles._single-trip-12-passenger .seat-map-display--seat-row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    margin-bottom: 4px; }
    .seat-map-display--single-trip-vehicles._single-trip-12-passenger .seat-map-display--seat-row._front {
      -ms-flex-pack: justify;
          justify-content: space-between; }
  .seat-map-display--single-trip-vehicles._single-trip-9-passenger .seat-map-display--seat-row-container {
    position: absolute;
    top: 102px;
    left: 40px;
    width: 119px; }
  .seat-map-display--single-trip-vehicles._single-trip-9-passenger .seat-map-display--seat-row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    margin-bottom: 4px; }
    .seat-map-display--single-trip-vehicles._single-trip-9-passenger .seat-map-display--seat-row._front {
      -ms-flex-pack: justify;
          justify-content: space-between; }
  .seat-map-display--single-trip-vehicles._single-trip-van .seat-map-display--seat-row-container {
    position: absolute;
    top: 92px;
    left: 43px;
    width: 112px; }
  .seat-map-display--single-trip-vehicles._single-trip-van .seat-map-display--seat-row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    margin-bottom: 4px;
    -ms-flex-pack: justify;
        justify-content: space-between; }
    .seat-map-display--single-trip-vehicles._single-trip-van .seat-map-display--seat-row._front {
      -ms-flex-pack: justify;
          justify-content: space-between; }
  .seat-map-display--single-trip-vehicles._single-trip-mini-van .seat-map-display--seat-row-container {
    position: absolute;
    top: 64px;
    left: 30px;
    width: 110px; }
  .seat-map-display--single-trip-vehicles._single-trip-mini-van .seat-map-display--seat-row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    margin-bottom: 4px;
    -ms-flex-pack: justify;
        justify-content: space-between; }
    .seat-map-display--single-trip-vehicles._single-trip-mini-van .seat-map-display--seat-row._front {
      -ms-flex-pack: justify;
          justify-content: space-between; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        The seat-availability-picker component.

        Todo: Add description here.

        HTML Structure:

        Todo: Document HTML Structure
        seat-map-display

    */
seat-availability-picker {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  position: relative; }

.seat-availability-picker {
  background-color: #fff;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2); }
  .seat-availability-picker--seat-availability-header {
    padding: 0 4px 0 16px;
    height: 56px;
    width: auto;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    -ms-flex-align: center;
        align-items: center;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
  .seat-availability-picker--header-text {
    font-size: 20px;
    font-weight: 500;
    color: rgba(0, 0, 0, 0.87); }
  .seat-availability-picker--header-button {
    margin-left: auto;
    font-size: 24px;
    width: 48px;
    height: 48px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: distribute;
        justify-content: space-around; }
  .seat-availability-picker--vehicle-dropdown-menu {
    height: 56px;
    padding: 0 4px 0 16px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    cursor: pointer;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
    .seat-availability-picker--vehicle-dropdown-menu:hover {
      background-color: #ececec; }
  .seat-availability-picker--vehicle-dropdown-icon {
    width: 40px;
    height: 40px;
    font-size: 24px;
    border-radius: 50%;
    background-color: #EEEEEE;
    color: rgba(0, 0, 0, 0.54);
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center; }
  .seat-availability-picker--vehicle-model {
    padding-left: 16px; }
  .seat-availability-picker--vehicle-dropdown-arrow {
    margin-left: auto; }
  .seat-availability-picker--user-vehicle-picker {
    background-color: #fff;
    position: absolute;
    top: 20px; }
  .seat-availability-picker--footer-buttons {
    height: 52px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center; }
  .seat-availability-picker--empty-state {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex-align: center;
        align-items: center; }
    .seat-availability-picker--empty-state .empty-state--label {
      display: none; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.seat-map-legend--icons-container {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  -ms-flex-pack: distribute;
      justify-content: space-around; }

.seat-map-legend--legend-item {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  width: auto;
  height: 48px;
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 16px;
  font-weight: 300;
  -ms-flex-align: center;
      align-items: center; }

.seat-map-legend--legend-item-icon {
  font-size: 16px;
  color: rgba(0, 0, 0, 0.56);
  transform: rotate(90deg); }

.seat-map-legend--legend-item-label {
  padding-left: 16px;
  font-size: 13px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        The seat-position-picker component.

        Todo: Add description here.

        HTML Structure:

        Todo: Document HTML Structure
        seat-position-picker

    */
seat-position-picker {
  display: -ms-flexbox;
  display: flex;
  background-color: #fff;
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 16px;
  font-weight: 300;
  max-width: 480px; }

.seat-position-picker {
  /* &--vehicle-dropdown-arrow {
            margin-left: auto;
            font-size: 24px;
            width: 48px;
            height: 48px;
            display: flex;
            align-items: center;
            justify-content: space-around;
        }
           &--list-icon {
            width: 40px;
            height: 40px;
            font-size: 24px;
            border-radius: 50%;
            padding: 8px 0px 0px 8px;
            color: #fff;
            //background: rgb(100, 181, 246);
        }
       */ }
  .seat-position-picker--seat-display-container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    width: 480px; }
  .seat-position-picker--seat-availability-display {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    margin-bottom: 24px;
    -ms-flex-pack: center;
        justify-content: center; }
  .seat-position-picker--display-legend-column {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    padding-left: 16px;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex: 1 0 auto;
        flex: 1 0 auto; }
  .seat-position-picker--seat-map {
    -ms-flex-pack: center;
        justify-content: center;
    -ms-flex: 1 0 auto;
        flex: 1 0 auto;
    height: auto; }
  .seat-position-picker--legend-text {
    font-weight: 500;
    padding-top: 20px; }
  .seat-position-picker--legend-sub-text {
    font-size: 16px;
    color: dodgerblue;
    font-weight: 400; }
  .seat-position-picker--seat-availability-legend {
    height: auto;
    margin-bottom: auto;
    width: 100%;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    margin-top: 16px; }
  .seat-position-picker--select-all-button {
    color: #03a9f4; }
  .seat-position-picker--footer-buttons {
    padding: 0 4px 0 16px;
    height: 52px;
    width: auto;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    -ms-flex-align: center;
        align-items: center;
    border-top: 1px solid rgba(0, 0, 0, 0.12); }
  .seat-position-picker--back-button {
    margin-right: auto; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
        The seat-reservation-icon SCSS component.

        Todo: Add description here.

        HTML Structure:
    <button class="seat-reservation-icon--seat-availability _available">
        <span class="rs-icon _ICON_NAME"></span></button>
    <button class="seat-reservation-icon--seat-availability _reserved">
        <span class="rs-icon _ICON_NAME"></span></button>
    <button class="seat-reservation-icon--seat-availability _unavailable">
        <span class="rs-icon _ICON_NAME"></span></button>

        Todo: Document HTML Structure

        .seat-reservation-icon
            --seat-availablity (mods: _available, _reserved, _unavailable)
        
    */
seat-reservation-icon {
  display: block; }
  seat-reservation-icon.is-selected .seat-reservation-icon--seat-availability {
    border-radius: 5px;
    background-image: url(/Images/SPA/core/trips/seatReservations/selected-seat.png);
    background-size: 31px 33px;
    background-repeat: no-repeat;
    background-position-x: 0px;
    background-position-y: -1px;
    transform: rotate(-90deg); }

.seat-reservation-icon--seat-availability {
  width: 30px;
  height: 30px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  background-color: transparent;
  -webkit-border-fit: border !important;
  padding: 0; }
  .seat-reservation-icon--seat-availability:focus {
    outline: none; }
  .seat-reservation-icon--seat-availability::-moz-focus-inner {
    border: none;
    /* overrides extra padding in Firefox */ }
  .seat-reservation-icon--seat-availability._available {
    color: #00c853; }
    .seat-reservation-icon--seat-availability._available:hover {
      border-color: #0b8720; }
  .seat-reservation-icon--seat-availability._unavailable {
    color: #9e9e9e; }
  .seat-reservation-icon--seat-availability._reserved-by-current-user {
    color: #00c853;
    transform: rotate(-90deg); }
  .seat-reservation-icon--seat-availability._reserved {
    color: #9e9e9e; }

.seat-reservation-icon--seat-icon {
  width: 32px;
  height: 32px;
  font-size: 32px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.trip-post-editor--toolbar {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center; }

.trip-post-editor--header {
  -ms-flex: 0 0 auto;
      flex: 0 0 auto;
  width: 100%;
  -ms-flex-item-align: start;
      align-self: flex-start; }

.trip-post-editor--header-title {
  padding: 16px;
  margin: 0; }

.trip-post-editor--help-btn {
  margin-left: auto; }

.trip-post-editor--buttons {
  z-index: 2;
  padding: 16px;
  width: 100%;
  background-color: #fff;
  box-shadow: 0 -2px 6px rgba(0, 0, 0, 0.2);
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: justify;
      justify-content: space-between;
  height: 72px; }

.trip-post-editor--buttons-cancel-button {
  width: 47%; }

.trip-post-editor--buttons-next-button {
  margin-left: auto;
  padding: 0;
  width: 47%; }

.trip-post-editor--nested-button {
  display: block; }

.trip-post-editor--post-trip-button {
  height: 24px;
  padding: 0 !important;
  border: none;
  border-radius: 0;
  text-transform: uppercase;
  margin-left: auto;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.28); }
  .trip-post-editor--post-trip-button:hover {
    box-shadow: 0 4px 14px 0 rgba(0, 0, 0, 0.26) !important; }

.trip-post-editor--span-button {
  padding: 8px 16px;
  background-color: #03a9f4;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.28);
  cursor: pointer; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
		The seat-reservation component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		seat-reservation

	*/
.seat-reservation {
  /** &--passenger-status {
            width: 96px;
            text-align: center;
           
            > .rs-icon {
                font-size: 20px;
                margin-bottom: 8px;
            }
        }*/ }
  .seat-reservation--request-item {
    padding: 16px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column; }
    .seat-reservation--request-item._is-rejected {
      opacity: 0.5; }
  .seat-reservation--request-item-row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center; }
  .seat-reservation--passenger-img-wrapper {
    padding-right: 16px; }
  .seat-reservation--passenger-status-icon {
    font-size: 18px;
    position: relative;
    top: -12px;
    left: 0px; }
    .seat-reservation--passenger-status-icon.rs-icon._checkmark {
      color: #00C853; }
  .seat-reservation--passenger-info {
    -ms-flex: 1;
        flex: 1; }
  .seat-reservation--passenger-name {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center; }
  .seat-reservation--passenger-group-icon {
    font-size: 24px;
    color: rgba(0, 0, 0, 0.54);
    padding-right: 8px; }
  .seat-reservation--passenger-icon-row {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    /* > span {
                padding-right: 5px;
                color: rgba(0, 0, 0, 0.54);
            }*/ }
  .seat-reservation--user-preference-icons {
    padding-right: 5px;
    color: rgba(0, 0, 0, 0.54); }
  .seat-reservation--seats-booked {
    font-size: 12px; }
  .seat-reservation--booking-status-confirmed {
    color: #0FB62B; }
  .seat-reservation--booking-status-requested {
    color: #f0ad4e; }
  .seat-reservation--booking-status-ignored {
    color: #d9534f; }
  .seat-reservation--request-date {
    font-size: 12px;
    color: rgba(0, 0, 0, 0.38); }
  .seat-reservation--message-icon {
    font-size: 24px; }
  .seat-reservation--request-action-buttons {
    padding: 0 8px;
    display: -ms-flexbox;
    display: flex;
    margin-top: 8px; }
  .seat-reservation--reject-button {
    width: 47%; }
    .seat-reservation--reject-button.md-button.md-rideshark-theme-theme.md-raised {
      background-color: #F5F5F5; }
  .seat-reservation--approve-button {
    width: 47%; }
    .seat-reservation--approve-button.md-button.md-rideshark-theme-theme.md-raised {
      background-color: #00C853;
      color: #FFFFFF; }
    .seat-reservation--approve-button.md-button.md-rideshark-theme-theme.md-raised:not([disabled]):hover {
      background-color: #00C853; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The trip-post-card component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		trip-post-card

	*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The trip-post-display component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		trip-post-display

	*/
trip-post-display {
  background-color: #fafafa;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  height: 100%;
  -ms-flex-pack: justify;
      justify-content: space-between;
  width: 480px;
  position: relative; }
  trip-post-display hr {
    margin-bottom: 0px;
    margin-top: 0px;
    border-top: 1px solid rgba(0, 0, 0, 0.12); }
  trip-post-display._move-action-buttons {
    -ms-flex-pack: start;
        justify-content: flex-start; }
  trip-post-display .map {
    width: 100%;
    height: 100%;
    min-height: 100px; }

.trip-post-display {
  /*Header bar*/
  /*Cancelled Status*/
  /*Driver profile*/
  /*Tabbed Instructions*/
  /*Trip Info Panel*/
  /*Recurring Trip Schedule Styles*/
  /*About Driver Panel*/
  /* Riders tab - badge */
  /*Action Area - Bottom Buttons*/
  /*Universal*/ }
  .trip-post-display--map-container {
    display: block; }
  .trip-post-display--internal-conversation-link {
    display: inline-block;
    position: relative;
    cursor: pointer;
    min-height: 36px;
    min-width: 88px;
    line-height: 36px;
    vertical-align: middle;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-grid-row-align: center;
    -ms-flex-align: center;
        align-items: center;
    text-align: center;
    border-radius: 3px;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: 0;
    padding: 0 6px;
    margin: 6px 8px;
    background: transparent;
    color: currentColor;
    white-space: nowrap;
    text-transform: uppercase;
    font-weight: 500;
    font-size: 14px;
    font-style: inherit;
    font-variant: inherit;
    font-family: inherit;
    text-decoration: none;
    overflow: hidden;
    transition: box-shadow 0.4s cubic-bezier(0.25, 0.8, 0.25, 1), background-color 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
    margin-left: auto;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    color: #212121;
    background-color: #fafafa; }
    .trip-post-display--internal-conversation-link a {
      color: #212121; }
    .trip-post-display--internal-conversation-link:hover a {
      text-decoration: none;
      color: inherit; }
  .trip-post-display--loading-cover {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 2;
    background-color: #fff;
    font-size: 24px;
    font-weight: 300; }
  .trip-post-display--top-section {
    width: 100%;
    -ms-flex-preferred-size: auto;
        flex-basis: auto; }
  .trip-post-display--bottom-section {
    -ms-flex-preferred-size: auto;
        flex-basis: auto;
    overflow: auto;
    width: 100%;
    -ms-flex-positive: 1;
        flex-grow: 1; }
  .trip-post-display--header {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: justify;
        justify-content: space-between;
    border-bottom: 1px solid #DCDCDC;
    -ms-flex-negative: 0;
        flex-shrink: 0;
    background-color: #fafafa;
    height: 48px; }
  .trip-post-display--header-back-button {
    -ms-flex: 1 10%;
        flex: 1 10%;
    color: rgba(0, 0, 0, 0.54); }
  .trip-post-display--header-label {
    -ms-flex: 1 70%;
        flex: 1 70%; }
  .trip-post-display--header-share-button {
    -ms-flex: 1 10%;
        flex: 1 10%;
    color: rgba(0, 0, 0, 0.54); }
  .trip-post-display--notification {
    height: 40px;
    background-color: #f57c00;
    color: #FFFFFF;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    font-size: 12px; }
  .trip-post-display--profile {
    padding: 16px;
    height: 100px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-negative: 0;
        flex-shrink: 0; }
  .trip-post-display--profile-avatar-img {
    width: 88px; }
    .trip-post-display--profile-avatar-img .user-avatar-img {
      width: 72px !important;
      height: 72px !important; }
  .trip-post-display--user-profile .rs-icon {
    font-size: 20px;
    color: rgba(0, 0, 0, 0.54); }
  .trip-post-display--user-profile .trip-post-display--user-preference-icons {
    height: 24px; }
  .trip-post-display--user-name {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    height: 24px;
    margin-bottom: 6px;
    /* > span {
                padding-right: 8px;
            } */ }
  .trip-post-display--user-name-display {
    font-size: 20px;
    font-weight: 600;
    padding-right: 16px; }
  .trip-post-display--user-name-icon.rs-icon {
    font-size: 24px; }
  .trip-post-display--user-preference-icons {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-line-pack: center;
        align-content: center; }
  .trip-post-display--rating-star .rs-icon {
    color: #FFD600; }
  .trip-post-display--tabs {
    overflow: hidden;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex-positive: 1;
        flex-grow: 1;
    border-bottom: 1px solid #DCDCDC; }
    .trip-post-display--tabs._resize-tab-height {
      -ms-flex: 0 1 auto;
          flex: 0 1 auto; }
    .trip-post-display--tabs rs-tabset-headings {
      border-bottom: 1px solid rgba(0, 0, 0, 0.12);
      box-shadow: 0 8px 6px -6px rgba(0, 0, 0, 0.12);
      text-transform: uppercase;
      margin-bottom: 0;
      display: block; }
    .trip-post-display--tabs rs-tab-heading:hover {
      color: #03a9f4; }
    .trip-post-display--tabs .rs-tabset--body {
      /*flex-basis:auto;
                overflow: auto;
                width: 100%;
                flex-grow:1;*/
      overflow: auto;
      overflow-x: hidden; }
  .trip-post-display--addresses {
    padding: 16px;
    display: -ms-flexbox;
    display: flex; }
  .trip-post-display--address-line {
    display: -ms-flexbox;
    display: flex; }
  .trip-post-display--address-title {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column; }
  .trip-post-display--route-addresses .address-summary-display--route {
    color: rgba(0, 0, 0, 0.87); }
  .trip-post-display--leaving-info {
    padding: 16px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center; }
  .trip-post-display--leaving-date {
    -ms-flex: auto;
        flex: auto; }
  .trip-post-display--seats-info {
    padding: 16px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center; }
  .trip-post-display--seats-left {
    color: rgba(0, 0, 0, 0.54);
    font-size: 34px; }
  .trip-post-display--seats-riders {
    text-align: right;
    -ms-flex: auto;
        flex: auto;
    color: rgba(0, 0, 0, 0.38); }
  .trip-post-display--cost-info {
    padding: 16px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center; }
  .trip-post-display--cost-info-price {
    color: rgba(0, 0, 0, 0.54);
    font-size: 34px;
    -ms-flex: auto;
        flex: auto; }
  .trip-post-display--cost-info-discount-container {
    text-align: right;
    -ms-flex: auto;
        flex: auto; }
  .trip-post-display--cost-info-discount-rate {
    color: rgba(0, 0, 0, 0.38); }
  .trip-post-display--see-more {
    text-transform: none;
    padding: 0;
    height: 24px;
    line-height: 24px; }
  .trip-post-display--comment-box {
    padding: 16px;
    display: -ms-flexbox;
    display: flex;
    overflow: auto; }
  .trip-post-display--vehicle-info {
    padding: 16px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    transition: all 0.3s ease; }
  .trip-post-display--vehicle-img {
    width: 88px;
    padding-right: 24px;
    text-align: right;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: end;
        justify-content: flex-end; }
  .trip-post-display--vehicle-placeholder {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #ececec;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    font-size: 24px;
    color: rgba(0, 0, 0, 0.54); }
  .trip-post-display--vehicle-summary {
    -ms-flex: auto;
        flex: auto; }
  .trip-post-display--view-car {
    padding: 0; }
  .trip-post-display--schedule-panel {
    padding: 0 16px;
    cursor: default;
    position: relative; }
  .trip-post-display--overlay-div {
    position: absolute;
    width: 70%;
    height: 100%; }
  .trip-post-display--schedule-panel-headings {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    /*height: 48px;*/
    margin-left: 45px; }
  .trip-post-display--schedule-panel-heading {
    width: 150px;
    text-align: center; }
  .trip-post-display--heading-text {
    font-size: 14px !important; }
  .trip-post-display--schedule-panel-time-picker {
    display: -ms-flexbox;
    display: flex;
    padding: 4px 0;
    /*border-bottom: 1px solid rgba(0, 0, 0, 0.12);*/
    height: 38px;
    cursor: default; }
  .trip-post-display--driver-info {
    padding: 16px;
    display: -ms-flexbox;
    display: flex; }
  .trip-post-display--driver-info-list {
    border: none;
    padding: 0; }
  .trip-post-display--driver-info-list-item .rs-icon {
    padding-right: 16px;
    color: rgba(0, 0, 0, 0.54); }
  .trip-post-display--list-details {
    -ms-flex: auto;
        flex: auto; }
  .trip-post-display--list-details-address {
    color: rgba(0, 0, 0, 0.54);
    font-size: 12px; }
  .trip-post-display--other-posts {
    padding: 0px 16px;
    display: -ms-flexbox;
    display: flex; }
  .trip-post-display--other-posts-title {
    padding-top: 16px; }
  .trip-post-display--other-posts-list {
    -ms-flex: auto;
        flex: auto; }
  .trip-post-display--other-posts-list-item {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    padding: 16px; }
  .trip-post-display--view-more {
    padding: 0; }
  .trip-post-display--rider-number-badge {
    background-color: #00C853;
    color: #FFFFFF;
    border-radius: 50%;
    width: 16px;
    height: 16px;
    font-size: 12px;
    text-align: center;
    margin-left: 4px;
    position: absolute;
    top: 10px; }
  .trip-post-display--trip-question-btn {
    width: 100%; }
  .trip-post-display--material-list-title {
    width: 88px;
    text-align: right;
    padding-right: 24px;
    font-size: 14px !important;
    color: rgba(0, 0, 0, 0.54); }
  .trip-post-display--link {
    cursor: pointer;
    padding: 0px; }
  .trip-post-display--circle-img-placeholder {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #ececec;
    display: block; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The trip-post-list-page component.

		Todo: This lists the trips posted by the user (as a driver)

		HTML Structure:

		Todo: Document HTML Structure
		trip-post-list-page

	*/
trip-post-list-page {
  display: block;
  width: 480px; }

.trip-post-list-page {
  position: relative;
  top: 0;
  bottom: 0;
  left: 0;
  width: 480px;
  height: 100%;
  background-color: #EEEEEE;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  /* Header */
  /* Subheader */
  /* Sorting */
  /* Ride Requests and Posts*/
  /* &--trip-listing-display {
            display: flex;
            align-items: center;
            width: 100%;
            background-color: #FFFFFF;

        }  */ }
  .trip-post-list-page--header-help {
    display: -ms-flexbox;
    display: flex; }
  .trip-post-list-page--header-help-text {
    margin: 10px; }
  .trip-post-list-page--list-status-indicator {
    position: absolute;
    right: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 40px 0 0 40px; }
    .trip-post-list-page--list-status-indicator._is-confirmed {
      border-color: #00C853 transparent transparent transparent; }
      .trip-post-list-page--list-status-indicator._is-confirmed .rs-icon {
        color: #FFFFFF; }
    .trip-post-list-page--list-status-indicator._is-pending {
      border-color: #EC9B42 transparent transparent transparent; }
      .trip-post-list-page--list-status-indicator._is-pending .rs-icon {
        color: #FFFFFF;
        transform: rotate(90deg); }
  .trip-post-list-page--status-icon {
    position: relative;
    top: -36px;
    left: -18px;
    font-size: 14px; }
  .trip-post-list-page--user-avatar-img._is-driver .user-avatar-img {
    background: #03a7f2; }
  .trip-post-list-page--user-avatar-img._is-passenger .user-avatar-img {
    background: #ec9b42; }
  .trip-post-list-page--trip-type-img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center; }
    .trip-post-list-page--trip-type-img._is-driver {
      background: #03a7f2; }
    .trip-post-list-page--trip-type-img._is-passenger {
      background: #ec9b42; }
  .trip-post-list-page--trip-type-icon {
    color: white;
    font-size: 24px; }
  .trip-post-list-page--panel {
    width: 500px;
    height: 100%;
    background: #fff; }
  .trip-post-list-page .paper-card {
    border: 0;
    border-radius: 0; }
  .trip-post-list-page--header {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    background-color: #FFFFFF;
    color: rgba(0, 0, 0, 0.87);
    width: 100%;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-negative: 0;
        flex-shrink: 0;
    z-index: 9; }
    .trip-post-list-page--header._no-tab-shadow {
      box-shadow: none; }
  .trip-post-list-page--header-title {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    width: 100%;
    height: 56px;
    -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    /*IE fix-for header collapse*/
    min-height: 56px; }
  .trip-post-list-page--header-title-text {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-positive: 1;
        flex-grow: 1;
    font-size: 20px;
    padding: 0 0 0 16px; }
  .trip-post-list-page--header-tabset .rs-tabset--tabset-headings {
    margin-bottom: 0px !important; }
  .trip-post-list-page--header-tabset .rs-tabset--tab-heading:hover {
    color: #03a9f4; }
  .trip-post-list-page--trip-tab {
    height: 48px !important; }
    .trip-post-list-page--trip-tab:hover {
      color: #03a9f4; }
    .trip-post-list-page--trip-tab.is-selected {
      background-color: #eeeeee;
      color: #03a9f4;
      border-bottom: 2px solid #03a9f4;
      padding-top: 2px; }
  .trip-post-list-page--header-post-button {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
        justify-content: center;
    width: 132px;
    height: 36px;
    color: rgba(0, 0, 0, 0.54);
    background-color: #FFFFFF;
    text-transform: uppercase;
    box-shadow: 0 4px 14px 0 rgba(0, 0, 0, 0.26); }
    .trip-post-list-page--header-post-button:hover {
      box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.26); }
  .trip-post-list-page--header-image {
    /* Made width 478 because the box-shadow adds 2px of border.
                   Making this smaller and hiding the extra pixels cuts off
                   the excess pixels from the image.
                */
    width: 478px;
    overflow: hidden; }
  .trip-post-list-page--posts-list {
    height: 100%;
    width: 100%;
    overflow-y: auto; }
  .trip-post-list-page--reservations-list {
    height: 100%;
    width: 100%;
    overflow-y: auto; }
  .trip-post-list-page--subheader {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: justify;
        justify-content: space-between;
    width: 100%;
    height: 50px;
    padding: 0 16px 0 16px;
    color: rgba(0, 0, 0, 0.54);
    font-weight: 500;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
  .trip-post-list-page--list-sorter {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: start;
        justify-content: flex-start;
    height: 48px;
    padding: 0 16px 0 16px;
    color: rgba(0, 0, 0, 0.54);
    font-weight: 500;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
  .trip-post-list-page--list-sorter-label {
    padding: 4px 16px 0 0; }
  .trip-post-list-page--list-sorter-dropdown {
    margin: 0 0 0 0; }
  .trip-post-list-page--ride-post-list {
    line-height: 1; }
  .trip-post-list-page--ride-request-list {
    line-height: 1; }
  .trip-post-list-page--list-card {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    background-color: #FFFFFF;
    cursor: pointer;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    position: relative;
    overflow: hidden; }
    .trip-post-list-page--list-card:hover {
      box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.38);
      transition: all 0.3s ease;
      -webkit-transition: all 0.3s ease;
      background-color: rgba(3, 169, 244, 0.1); }
  .trip-post-list-page--list-card-header {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    width: 100%;
    height: 40px;
    color: #000000;
    font-size: 16px;
    padding: 16px 16px 13px 16px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
  .trip-post-list-page--list-card-trip-details {
    display: -ms-flexbox;
    display: flex;
    width: 100%;
    height: 124px;
    padding: 16px; }
  .trip-post-list-page--list-user-indicator {
    margin-right: 16px; }
  .trip-post-list-page--list-card-trip-header {
    line-height: 24px;
    color: rgba(0, 0, 0, 0.87); }
  .trip-post-list-page--list-address-summary-location-display {
    color: rgba(0, 0, 0, 0.54);
    font-size: 14px;
    margin-bottom: 4px; }
    .trip-post-list-page--list-address-summary-location-display:nth-child(1) {
      padding: 0 0 8px 0; }
  .trip-post-list-page--list-address-summary-location-details {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: baseline;
        align-items: baseline; }
  .trip-post-list-page--list-address-summary {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis; }
  .trip-post-list-page--list-date-summary-panel {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex-align: end;
        align-items: flex-end;
    color: rgba(0, 0, 0, 0.38);
    margin-left: auto; }
  .trip-post-list-page--list-vehicle-summary {
    line-height: 16px;
    margin-top: 10px; }
  .trip-post-list-page--list-day-display {
    color: rgba(0, 0, 0, 0.38);
    line-height: 24px; }
  .trip-post-list-page--list-time-display {
    line-height: 20px; }
  .trip-post-list-page--list-cost-display {
    margin: 4px 0;
    color: rgba(0, 0, 0, 0.87);
    height: 24px; }
  .trip-post-list-page--list-seat-summary {
    line-height: 18px; }
  .trip-post-list-page--list-card-seat-count {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    height: 40px;
    color: rgba(0, 0, 0, 0.38);
    margin-left: 72px;
    border-top: 1px solid rgba(0, 0, 0, 0.12);
    padding-right: 16px; }
  .trip-post-list-page--list-card-confirmation-status {
    height: 100%;
    color: #03a9f4;
    font-size: 13px;
    width: auto;
    height: 24px;
    line-height: 24px;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-align: center;
        align-items: center; }
  .trip-post-list-page--list-card-status-icon {
    font-size: 16px;
    line-height: 24px; }
    .trip-post-list-page--list-card-status-icon.rs-icon._checkmark {
      width: 20px;
      height: 20px;
      color: #00C853;
      line-height: 20px; }
    .trip-post-list-page--list-card-status-icon.rs-icon._open-panel {
      width: 20px;
      height: 20px;
      color: #EC9B42;
      line-height: 20px;
      transform: rotate(90deg); }
  .trip-post-list-page--list-card-confirmation-text {
    padding-left: 16px;
    font-size: 12px;
    line-height: 16px; }
    .trip-post-list-page--list-card-confirmation-text._confirmed {
      color: #00C853; }
    .trip-post-list-page--list-card-confirmation-text._pending {
      color: #EC9B42; }
  .trip-post-list-page--list-date {
    display: -ms-flexbox;
    display: flex;
    margin-left: auto;
    color: rgba(0, 0, 0, 0.38); }
    .trip-post-list-page--list-date :nth-child(1) {
      border-top: none; }

/* Sets the border around the list div without
     * adding the paper-card class
     */
.list-background {
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The one-time-rideshare-post-editor component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		one-time-rideshare-post-editor

	*/
trip-cost-window {
  display: block;
  height: 100%; }

.trip-cost-window {
  width: 100%;
  background: #fff;
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 13px;
  color: rgba(0, 0, 0, 0.87);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  max-height: 100%; }
  .trip-cost-window--cost-header-container {
    width: 100%; }
  .trip-cost-window--seats-summary {
    overflow: auto;
    position: relative;
    overflow-y: auto;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    /* Set width */
    /* Track */
    /* Handle */
    padding: 0 16px; }
    .trip-cost-window--seats-summary::-webkit-scrollbar {
      width: 8px; }
    .trip-cost-window--seats-summary::-webkit-scrollbar-track {
      display: none; }
    .trip-cost-window--seats-summary::-webkit-scrollbar-thumb {
      border-radius: 10px;
      background-color: rgba(200, 200, 200, 0.8);
      box-shadow: inset 0 0 6px rgba(200, 200, 200, 0.8); }
    .trip-cost-window--seats-summary::-webkit-scrollbar-thumb:window-inactive {
      background: rgba(201, 201, 201, 0.8); }
  .trip-cost-window--header {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    -ms-flex-align: center;
        align-items: center;
    padding-left: 16px;
    height: 56px; }
  .trip-cost-window--header-text {
    font-size: 20px;
    font-weight: 500; }
  .trip-cost-window--header-buttons {
    margin-left: auto;
    font-size: 24px; }
  .trip-cost-window--header-help-button {
    width: 48px;
    height: 48px; }
  .trip-cost-window--header-close-button {
    width: 48px;
    height: 48px; }
  .trip-cost-window--trip-summary {
    /*border-top: 1px solid rgba(0,0,0,0.12);*/
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    height: auto;
    font-size: 13px;
    /*padding: 0 16px;*/ }
  .trip-cost-window--summary-sub-header {
    display: -ms-flexbox;
    display: flex;
    height: 40px;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center; }
  .trip-cost-window--summary-display {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex: 0 1 auto;
        flex: 0 1 auto;
    height: 40px;
    border-top: 1px solid rgba(0, 0, 0, 0.12);
    padding: 0 16px; }
  .trip-cost-window--summary-item {
    margin-left: auto; }
  .trip-cost-window--trip-expenses {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    height: auto;
    padding: 0 16px; }
  .trip-cost-window--expense-item-container {
    display: -ms-flexbox;
    display: flex;
    height: 40px;
    -ms-flex-align: center;
        align-items: center; }
  .trip-cost-window--expense-label {
    width: 50%;
    margin-right: auto; }
  .trip-cost-window--expense-item {
    height: 40px;
    width: auto;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center; }
  .trip-cost-window--expense-item-input {
    border: none;
    outline: none;
    background: transparent;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    width: 88px;
    text-align: right;
    /* &:focus::-webkit-input-placeholder {
                color: transparent;
            }*/ }
    .trip-cost-window--expense-item-input:focus {
      border-bottom: 2px solid #03a9f4; }
    .trip-cost-window--expense-item-input:placeholder-shown {
      text-align: center; }
  .trip-cost-window--expense-remove-button {
    width: 40px;
    height: 40px;
    -ms-flex-align: center;
        align-items: center;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
        justify-content: center;
    font-size: 20px;
    color: rgba(0, 0, 0, 0.54);
    cursor: pointer; }
  .trip-cost-window--seat-cost-wrapper {
    height: 72px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    padding: 0 16px;
    background-color: #03a9f4;
    -ms-flex-align: center;
        align-items: center; }
  .trip-cost-window--seat-cost {
    color: #fff;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column; }
  .trip-cost-window--seat-cost-caption {
    font-size: 14px; }
  .trip-cost-window--revenue-container {
    margin-left: auto;
    background-color: #fff;
    width: 152px;
    -ms-flex: 0 1 auto;
        flex: 0 1 auto;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: end;
        justify-content: flex-end;
    font-size: 24px; }
  .trip-cost-window--revenue-button {
    width: 48px;
    height: 48px;
    -ms-flex-align: center;
        align-items: center;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
        justify-content: center; }
  .trip-cost-window--revenue-button-tooltip {
    position: relative;
    color: red; }
  .trip-cost-window--revenue-button-tooltip .trip-cost-window--revenue-button-tooltiptext {
    visibility: hidden;
    width: 266px;
    background-color: white;
    color: red;
    border-radius: 2px;
    padding: 16px;
    font-size: 12px;
    position: absolute;
    top: 48px;
    left: -122px;
    font-family: 'Roboto';
    line-height: 1.3;
    box-shadow: 0px 2px 12px rgba(0, 0, 0, 0.24); }
  .trip-cost-window--revenue-button-tooltip:hover .trip-cost-window--revenue-button-tooltiptext {
    visibility: visible; }
  .trip-cost-window--revenue-input {
    height: 48px;
    width: auto;
    padding-right: 16px;
    padding-top: 3px; }
  .trip-cost-window--revenue {
    border: none;
    outline: none;
    background: transparent;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    width: 80px;
    text-align: right;
    /*&:focus::-webkit-input-placeholder {
                color: transparent;
            }
             &:focus::-moz-placeholder {
                color: transparent;
            }
            */ }
    .trip-cost-window--revenue:focus {
      border-bottom: 2px solid #03a9f4; }
  .trip-cost-window--seats-summary-header {
    display: -ms-flexbox;
    display: flex;
    height: 40px;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
  .trip-cost-window--seats-summary-table {
    width: 100%; }
  .trip-cost-window--table-header {
    color: rgba(0, 0, 0, 0.54); }
  .trip-cost-window--seats-summary-item {
    height: 40px;
    text-align: center;
    vertical-align: middle;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
  .trip-cost-window--seats-summary-cost {
    height: 40px;
    text-align: center;
    vertical-align: middle;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
  .trip-cost-window--seats-summary-revenue {
    height: 40px;
    text-align: center;
    vertical-align: middle;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
  .trip-cost-window--seats-caption-footer {
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 0 1 auto;
        flex: 0 1 auto;
    height: 60px;
    padding: 0 16px;
    -ms-flex-align: center;
        align-items: center;
    /*border-bottom: 1px solid rgba(0,0,0,0.12);*/ }
  .trip-cost-window--footer-text {
    color: rgba(0, 0, 0, 0.54); }
  .trip-cost-window--footer-text-button {
    margin-left: auto; }
  .trip-cost-window--seats-revenue {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: end;
        justify-content: flex-end;
    padding-right: 16px;
    height: 40px;
    -ms-flex-align: center;
        align-items: center;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
  .trip-cost-window--revenue-total {
    margin-left: 16px; }
  .trip-cost-window--footer-buttons {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: end;
        justify-content: flex-end;
    height: 48px;
    margin-top: auto;
    -ms-flex-align: end;
        align-items: flex-end; }
  .trip-cost-window--accordion-heading {
    background-color: #03a9f4; }
  .trip-cost-window--accordion-toggle {
    text-decoration: none; }
  .trip-cost-window--accordion-toggle:hover {
    color: white;
    text-decoration: none; }
  .trip-cost-window--accordion-toggle:visited {
    color: white;
    text-decoration: none; }
  .trip-cost-window--accordion-toggle:focus {
    color: white;
    text-decoration: none; }
  .trip-cost-window--accordion-toggle:after {
    font-family: 'Glyphicons Halflings';
    content: "\e114";
    color: white;
    font-size: 14px;
    padding-left: 10px;
    vertical-align: text-bottom; }
  .trip-cost-window--accordion-toggle.collapsed:after {
    /* symbol for "collapsed" panels */
    content: "\e080"; }
  .trip-cost-window--accordion-heading {
    background-color: #03a9f4;
    color: white;
    text-decoration: none;
    border-radius: 0px !important;
    height: 40px; }
  .trip-cost-window--panel-group {
    margin-bottom: 1px !important;
    margin-top: 1px !important; }
    .trip-cost-window--panel-group._remove-border .accordion-group {
      border-bottom: none; }
  .trip-cost-window--payments-container {
    padding: 16px; }
  .trip-cost-window--payment-method {
    display: block;
    margin: 16px !important; }
  .trip-cost-window .panel-heading {
    background-color: #03a9f4;
    color: white;
    text-decoration: none;
    border-radius: 0px !important;
    height: 40px; }
    .trip-cost-window .panel-heading:hover {
      color: white;
      text-decoration: none; }
  .trip-cost-window--panel-group-toggle {
    background-color: #03a9f4;
    color: white;
    text-decoration: none;
    min-height: 40px;
    padding: 11px;
    box-sizing: border-box; }
    .trip-cost-window--panel-group-toggle:focus {
      outline: none;
      text-decoration: underline; }
      .trip-cost-window--panel-group-toggle:focus .rs-icon {
        transform: scale(2) rotate(-90deg); }
        .trip-cost-window--panel-group-toggle:focus .rs-icon.alt--rotated {
          transform: scale(2) rotate(0deg); }
  .trip-cost-window--panel-group .panel-group {
    margin-bottom: 0; }
  .trip-cost-window--panel-group .panel-title {
    margin: 0; }
    .trip-cost-window--panel-group .panel-title .accordion-toggle:focus {
      outline: none; }
  .trip-cost-window--panel-group .rs-icon {
    transition: transform 0.2s ease-in-out;
    transform: rotate(-90deg); }
    .trip-cost-window--panel-group .rs-icon.alt--rotated {
      transform: rotate(0deg); }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The desktop-trip-post-view-page 

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		trip-post-view-page

	*/
.trip-post-view-page {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 480px;
  background-color: #eeeeee;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  /**
            The trip-post-display that's on the page.
        */ }
  .trip-post-view-page--trip-post-display {
    -ms-flex-positive: 1;
        flex-grow: 1; }

.empty-state-short {
  width: 100px;
  height: 12px;
  background-color: #EEEEEE;
  margin-bottom: 5px; }

.empty-state-long {
  width: 150px;
  height: 12px;
  background-color: #EEEEEE; }

.empty-state-text {
  color: rgba(0, 0, 0, 0.38); }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
new-otr-reservation {
  display: block; }

.new-otr-reservation--heading-container {
  height: 56px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
  .new-otr-reservation--heading-container._hide-header {
    display: none; }

.new-otr-reservation--heading-title {
  padding-left: 16px; }

.new-otr-reservation--header-button-container {
  color: rgba(0, 0, 0, 0.54);
  margin-left: auto;
  padding-right: 4px; }

.new-otr-reservation--trip-summary-wrapper {
  height: 56px;
  padding: 7px 0;
  box-sizing: border-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12); }

.new-otr-reservation--route-summary {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  border-right: 1px solid rgba(0, 0, 0, 0.12);
  padding-left: 16px; }

.new-otr-reservation--route-labels {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  padding-right: 6px;
  text-align: right;
  color: rgba(0, 0, 0, 0.54); }

.new-otr-reservation--cost-seat-wrapper {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row; }

.new-otr-reservation--cost-summary {
  display: -ms-inline-flexbox;
  display: inline-flex;
  border-right: 1px solid rgba(0, 0, 0, 0.12);
  padding-right: 16px;
  max-width: 216px; }

.new-otr-reservation--seats-summary {
  display: -ms-inline-flexbox;
  display: inline-flex;
  padding-right: 16px; }

.new-otr-reservation--summary-labels {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  padding: 0px 16px;
  text-align: right;
  color: rgba(0, 0, 0, 0.54); }

.new-otr-reservation--summary-display {
  color: rgba(0, 0, 0, 0.54);
  line-height: 36px;
  overflow: hidden; }

.new-otr-reservation--route-display-container {
  width: 216px;
  padding-right: 16px; }
  .new-otr-reservation--route-display-container .address-summary-display--circle-status-icon {
    display: none; }
  .new-otr-reservation--route-display-container .address-summary-display--route {
    color: rgba(0, 0, 0, 0.87); }

.new-otr-reservation--route-display {
  color: rgba(0, 0, 0, 0.87); }

.new-otr-reservation--body-seat-legend {
  display: -ms-flexbox;
  display: flex;
  height: 56px;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: center;
      justify-content: center; }

.new-otr-reservation--legend-item {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  padding-right: 16px; }

.new-otr-reservation--legend-item-icon {
  font-size: 32px;
  margin-right: 8px; }
  .new-otr-reservation--legend-item-icon._seat-occupied {
    color: rgba(0, 0, 0, 0.38); }

.new-otr-reservation--legend-item-icon-selected {
  color: #00c853; }

.new-otr-reservation--legend-item-icon-available {
  color: #00c853;
  transform: rotate(90deg); }

.new-otr-reservation--legend-item-label {
  line-height: 24px;
  color: rgba(0, 0, 0, 0.54); }

.new-otr-reservation--body-seat-position {
  border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
  .new-otr-reservation--body-seat-position seat-position-picker {
    max-width: 100%; }
  .new-otr-reservation--body-seat-position .seat-position-picker--seat-display-container {
    width: 100%; }
  .new-otr-reservation--body-seat-position .seat-position-picker--seat-availability-display {
    border-top: none;
    border-bottom: none; }
    .new-otr-reservation--body-seat-position .seat-position-picker--seat-availability-display seat-map-display {
      max-width: 100%;
      height: 100%; }
    .new-otr-reservation--body-seat-position .seat-position-picker--seat-availability-display .seat-position-picker--seat-map {
      padding-top: 16px; }
  .new-otr-reservation--body-seat-position .seat-position-picker--display-legend-column {
    display: none; }

.new-otr-reservation--body-seat-message {
  padding: 16px 16px 32px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12); }

.new-otr-reservation--message-composer {
  padding-top: 16px; }

.new-otr-reservation--message-text-field {
  background-color: #EEE;
  min-height: 36px;
  padding: 8px 8px 4px; }

.new-otr-reservation--button-container {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: end;
      justify-content: flex-end;
  padding: 16px 16px 16px 0; }

.new-otr-reservation--reserve-seat-button {
  margin-left: 16px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The one-time-rideshare-reservation-editor component.

		The idea behind this component is that there is a "body" section, which contains a list of existing reservations
        for the rideshare (or a loading bar).

        Then, when modifications or edits are made to the reservations, the various components which actually modify
        the reservations are displayed in an "overlay" (this overlay will cover the "body", but it does not display 
        in a modal or any type of popup format.)

		HTML Structure:

		Todo: Document HTML Structure
		one-time-rideshare-reservation-editor

	*/
one-time-rideshare-reservation-editor {
  width: 100%;
  max-width: 640px;
  height: auto;
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 14px;
  position: relative;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column; }

.one-time-rideshare-reservation-editor--body {
  background: #fff; }
  .one-time-rideshare-reservation-editor--body._override-padding {
    margin: -24px;
    /*this is to override md-dialog's forced padding*/ }

.one-time-rideshare-reservation-editor--overlay {
  background-color: #fff;
  z-index: 1;
  padding: 0px 0px 16px 16px; }

.one-time-rideshare-reservation-editor--progress-overlay {
  background-color: #fff;
  z-index: 2; }
  .one-time-rideshare-reservation-editor--progress-overlay md-progress-circular {
    margin: 0 auto; }

.one-time-rideshare-reservation-editor--text-container {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.38); }

.one-time-rideshare-reservation-editor--heading-title {
  padding: 20px 24px; }

.one-time-rideshare-reservation-editor--sub-text {
  padding: 0 24px 20px; }

.one-time-rideshare-reservation-editor--button-container {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  margin-bottom: 8px; }

.one-time-rideshare-reservation-editor--cancel-button {
  margin-left: auto; }

.one-time-rideshare-reservation-editor--reserve-seat-button {
  margin-left: 8px; }

.one-time-rideshare-reservation-editor--confirmation-container {
  height: 200px;
  -ms-flex-pack: center;
      justify-content: center;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  background-color: #03a9f4;
  color: #fff; }

.one-time-rideshare-reservation-editor--confirmation-title {
  font-weight: 400; }

.one-time-rideshare-reservation-editor--confirmation-title {
  padding: 20px 24px; }

.one-time-rideshare-reservation-editor--reservation-summary-title {
  height: 40px;
  background-color: #EEEEEE;
  color: rgba(0, 0, 0, 0.54);
  padding: 0 16px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: center;
      justify-content: center; }

.one-time-rideshare-reservation-editor--summary-location-container {
  height: 72px;
  padding: 16px 24px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  display: -ms-flexbox;
  display: flex; }

.one-time-rideshare-reservation-editor--summary-location {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column; }

.one-time-rideshare-reservation-editor--display-label {
  width: 88px;
  color: rgba(0, 0, 0, 0.54);
  margin-right: 24px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: end;
      justify-content: flex-end; }

.one-time-rideshare-reservation-editor--summary-display {
  height: 48px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  padding: 0 24px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12); }

.one-time-rideshare-reservation-editor--display-time {
  margin-left: auto; }

.one-time-rideshare-reservation-editor--summary-buttons {
  height: 52px;
  margin-top: 56px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: end;
      justify-content: flex-end;
  -ms-flex-align: center;
      align-items: center; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
otr-reservation-summary {
  display: block; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.review-otr-reservation--container {
  max-width: 640px;
  width: 100%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column; }

.review-otr-reservation--heading-container {
  height: 56px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  padding: 0 4px 0 16px; }
  .review-otr-reservation--heading-container._hide-header {
    display: none; }

.review-otr-reservation--header-button-container {
  color: rgba(0, 0, 0, 0.54);
  margin-left: auto; }

.review-otr-reservation--reservation-summary {
  height: 56px;
  padding: 7px 0px;
  box-sizing: border-box;
  display: -ms-flexbox;
  display: flex;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12); }

.review-otr-reservation--summary-location-container {
  display: -ms-flexbox;
  display: flex;
  padding: 0px 16px;
  border-right: 1px solid rgba(0, 0, 0, 0.12); }

.review-otr-reservation--summary-location {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column; }

.review-otr-reservation--display-label {
  color: rgba(0, 0, 0, 0.54);
  text-align: right;
  padding-right: 6px; }

.review-otr-reservation--route-addresses {
  width: 100%;
  max-width: 216px; }
  .review-otr-reservation--route-addresses address-summary-display .address-summary-display--circle-status-icon {
    display: none; }
  .review-otr-reservation--route-addresses address-summary-display .address-summary-display--route {
    color: rgba(0, 0, 0, 0.87); }

.review-otr-reservation--cost-seat-wrapper {
  display: -ms-flexbox;
  display: flex; }

.review-otr-reservation--cost-summary {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  border-right: 1px solid rgba(0, 0, 0, 0.12);
  padding-right: 16px;
  color: rgba(0, 0, 0, 0.54);
  max-width: 216px; }

.review-otr-reservation--seats-summary {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  color: rgba(0, 0, 0, 0.54);
  padding-right: 16px; }

.review-otr-reservation--summary-labels {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  padding: 0px 16px;
  text-align: right;
  color: rgba(0, 0, 0, 0.54); }

.review-otr-reservation--summary-value {
  overflow: hidden;
  white-space: nowrap; }

.review-otr-reservation--summary-display {
  border-bottom: 1px solid rgba(0, 0, 0, 0.12); }

.review-otr-reservation--summary-display-legend-wrapper {
  display: -ms-flexbox;
  display: flex;
  height: 56px;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: center;
      justify-content: center; }

.review-otr-reservation--summary-display-legend {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-align: center;
      align-items: center;
  padding-right: 16px; }

.review-otr-reservation--legend-item {
  display: -ms-flexbox;
  display: flex; }

.review-otr-reservation--legend-item-icon {
  font-size: 32px;
  margin-right: 8px; }
  .review-otr-reservation--legend-item-icon._seat-occupied {
    color: rgba(0, 0, 0, 0.38); }
  .review-otr-reservation--legend-item-icon._seat-selected {
    color: #00c853; }

.review-otr-reservation--legend-item-icon-available {
  color: #00c853;
  transform: rotate(90deg); }

.review-otr-reservation--legend-item-label {
  line-height: 24px;
  color: rgba(0, 0, 0, 0.54); }

.review-otr-reservation--summary-display-seat-map-container {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center; }

.review-otr-reservation--button-container {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: end;
      justify-content: flex-end;
  padding: 8px 16px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.one-time-rideshare-reservation-success-dialog {
  /* dialogue style */ }
  .one-time-rideshare-reservation-success-dialog--container {
    width: 100%;
    overflow: hidden; }
  .one-time-rideshare-reservation-success-dialog--icon-container {
    background-color: #00C853;
    height: 348px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center; }
  .one-time-rideshare-reservation-success-dialog--icon-wrapper {
    width: 200px;
    height: 200px;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-size: 120px;
    color: #00C853;
    -ms-flex-pack: center;
        justify-content: center;
    -ms-flex-align: center;
        align-items: center;
    border-radius: 50%;
    background-color: #FFF; }
  .one-time-rideshare-reservation-success-dialog--check-icon {
    color: #00C853; }
  .one-time-rideshare-reservation-success-dialog--success-msg {
    margin: 0 auto;
    text-align: center;
    padding: 24px 72px; }
  .one-time-rideshare-reservation-success-dialog--msg-header {
    font-size: 24px;
    line-height: 32px;
    padding-bottom: 4px; }
  .one-time-rideshare-reservation-success-dialog--sub-header {
    font-size: 14px;
    color: rgba(0, 0, 0, 0.54); }
  .one-time-rideshare-reservation-success-dialog--footer-buttons {
    color: #00C853;
    height: 36px;
    text-align: right;
    padding: 16px 16px 12px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.payment-summary {
  width: 480px;
  height: 100%;
  border: 1px solid rgba(0, 0, 0, 0.12);
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 13px;
  font-weight: 400; }
  .payment-summary--header {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    -ms-flex-align: center;
        align-items: center;
    height: 56px;
    margin: 4px 0;
    -ms-flex: 0 1 auto;
        flex: 0 1 auto;
    padding: 0 16px; }
  .payment-summary--header-text {
    font-size: 20px;
    Font-weight: 500;
    margin-right: auto; }
  .payment-summary--print-button {
    width: 48px;
    height: 48px;
    font-size: 24px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    color: rgba(0, 0, 0, 0.54); }
  .payment-summary--exit-button {
    width: 48px;
    height: 48px;
    font-size: 24px; }
  .payment-summary--summary-details {
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 0 1 auto;
        flex: 0 1 auto;
    height: 40px;
    -ms-flex-align: center;
        align-items: center;
    padding: 0 16px;
    border-top: 1px solid rgba(0, 0, 0, 0.12); }
  .payment-summary--summary-item {
    margin-left: auto; }
  .payment-summary--discount-display {
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 0 1 auto;
        flex: 0 1 auto;
    height: 40px;
    -ms-flex-align: center;
        align-items: center;
    border: 1px solid rgba(0, 0, 0, 0.12);
    background-color: #03a9f4;
    color: #fff;
    padding: 0 16px; }
  .payment-summary--discount-button {
    margin-left: auto;
    font-size: 20px; }
  .payment-summary--seat-booking-display {
    padding: 0 16px; }
  .payment-summary--booking-summary {
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 0 1 auto;
        flex: 0 1 auto;
    height: 40px;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: justify;
        justify-content: space-between;
    border-top: 1px solid rgba(0, 0, 0, 0.12); }
  .payment-summary--booking-tag {
    color: rgba(0, 0, 0, 0.38); }
  .payment-summary--Total-display {
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 0 1 auto;
        flex: 0 1 auto;
    height: 40px;
    -ms-flex-align: center;
        align-items: center;
    border-top: 1px solid rgba(0, 0, 0, 0.12);
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    font-size: 16px; }
  .payment-summary--total-label {
    margin-right: auto; }
  .payment-summary--total-tag {
    font-size: 12px;
    padding-right: 4px;
    color: rgba(0, 0, 0, 0.38); }
  .payment-summary--footer-container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: end;
        justify-content: flex-end;
    padding: 16px; }
  .payment-summary--footer-header {
    font-size: 16px;
    padding-bottom: 8px; }
  .payment-summary--footer-sub-text {
    color: rgba(0, 0, 0, 0.38); }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.ride-request-notification {
  width: 480px;
  height: 444px;
  border: 1px solid rgba(0, 0, 0, 0.12);
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 13px;
  font-weight: 400;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column; }
  .ride-request-notification--header-container {
    border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
  .ride-request-notification--header {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    -ms-flex-align: center;
        align-items: center;
    height: 56px;
    margin: 4px 0;
    -ms-flex: 0 1 auto;
        flex: 0 1 auto;
    padding: 0 16px; }
  .ride-request-notification--header-text {
    font-size: 20px;
    Font-weight: 500;
    margin-right: auto; }
  .ride-request-notification--exit-button {
    width: 48px;
    height: 48px;
    font-size: 24px; }
  .ride-request-notification--user-profile {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    padding: 0 16px;
    height: 72px;
    -ms-flex-align: start;
        align-items: flex-start; }
  .ride-request-notification--user-indicator-avatar-img {
    padding-right: 16px; }
  .ride-request-notification--profile-details {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column; }
  .ride-request-notification--profile-name {
    margin-bottom: 4px; }
  .ride-request-notification--user-preference-icons {
    font-size: 20px;
    margin-bottom: 4px;
    color: rgba(0, 0, 0, 0.54); }
  .ride-request-notification--rating-star {
    margin-bottom: 4px;
    color: rgba(0, 0, 0, 0.54); }
  .ride-request-notification--trip-listing-display {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex-pack: center;
        justify-content: center;
    padding: 16px 12px 16px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
  .ride-request-notification--trip-header {
    margin-bottom: 16px; }
  .ride-request-notification--trip-listing {
    height: 20px;
    margin-bottom: 4px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 0 1 auto;
        flex: 0 1 auto; }
  .ride-request-notification--trip-label {
    color: rgba(0, 0, 0, 0.38);
    width: 46px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: end;
        justify-content: flex-end; }
  .ride-request-notification--trip-location {
    width: auto;
    margin-left: 16px; }
  .ride-request-notification--trip-preference {
    margin-left: auto; }
  .ride-request-notification--seat-listing-display {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    -ms-flex: 0 1 auto;
        flex: 0 1 auto;
    height: 72px;
    -ms-flex-align: center;
        align-items: center;
    padding: 0 16px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
  .ride-request-notification--seat-booking {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex-align: center;
        align-items: center;
    color: rgba(0, 0, 0, 0.38);
    width: auto;
    margin-left: auto; }
  .ride-request-notification--seat-label {
    color: rgba(0, 0, 0, 0.38);
    text-align: center;
    width: 46px; }
  .ride-request-notification--seats {
    font-size: 24px;
    margin-left: 16px; }
  .ride-request-notification--buttons-display {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: end;
        align-items: flex-end;
    padding: 0 16px 16px;
    height: 48px;
    margin-top: auto; }
  .ride-request-notification--details-button {
    color: rgba(0, 0, 0, 0.54);
    background: #fff; }
  .ride-request-notification--confirm-button {
    margin-left: auto; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The trip-proposal-editor component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		trip-proposal-editor

	*/
.tripProposalWindow .modal-dialog {
  background-color: rgba(0, 0, 0, 0.01); }

.tripProposalWindow .modal-content {
  width: 480px;
  margin: 7.5% auto; }

trip-proposal-editor {
  display: -ms-flexbox;
  display: flex;
  width: 480px;
  background-color: #fff;
  padding: 0 16px;
  border-radius: 2px; }

.trip-proposal-editor--editor-wrapper {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  width: 100%; }

.trip-proposal-editor--header-content {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  width: 100%;
  height: 56px;
  -ms-flex-align: center;
      align-items: center; }

.trip-proposal-editor--heading-text {
  -ms-flex: 0 1 auto;
      flex: 0 1 auto; }

.trip-proposal-editor--header-close-button {
  margin-left: auto;
  cursor: pointer;
  width: 48px;
  height: 48px;
  display: -ms-flexbox;
  display: flex;
  margin-right: -16px; }

.trip-proposal-editor--exit-button {
  font-size: 24px; }

.trip-proposal-editor--first-message-text {
  padding-bottom: 6px; }

.trip-proposal-editor--first-message-entry {
  padding: 8px;
  width: 96%;
  border-radius: 2px;
  -webkit-border-radius: 2px;
  border: 1px solid rgba(0, 0, 0, 0.12);
  background-color: #ececec; }

.trip-proposal-editor--detail-text {
  margin: 8px 0; }

.trip-proposal-editor--proposal-buttons {
  margin-left: auto;
  height: 52px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: end;
      align-items: flex-end;
  padding-bottom: 16px; }

.trip-proposal-editor--send-message-button {
  margin-left: 16px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
trip-proposal-display {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  width: 480px;
  background-color: #eee;
  height: 100%; }
  trip-proposal-display .trip-post-ride-request {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    height: 172px;
    margin-bottom: 8px;
    background: #fff; }
    trip-proposal-display .trip-post-ride-request--heading {
      display: -ms-flexbox;
      display: flex;
      padding: 4px;
      margin-bottom: 8px; }
    trip-proposal-display .trip-post-ride-request--back-btn {
      padding-left: 4px;
      margin-right: 16px; }
    trip-proposal-display .trip-post-ride-request--title-display {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-direction: column;
          flex-direction: column;
      -ms-flex-positive: 1;
          flex-grow: 1;
      padding-top: 8px; }
    trip-proposal-display .trip-post-ride-request--trip-locations {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-direction: column;
          flex-direction: column;
      padding-top: 4px;
      padding-bottom: 4px;
      margin: auto 16px 8px; }
    trip-proposal-display .trip-post-ride-request--divider-top {
      border: 0;
      height: 1px;
      background: #eee;
      width: 100%;
      margin-top: 8px; }
    trip-proposal-display .trip-post-ride-request--trip-preview {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
      -ms-flex-pack: justify;
          justify-content: space-between;
      -ms-flex-line-pack: center;
          align-content: center;
      -ms-flex-align: baseline;
          align-items: baseline;
      height: 48px;
      padding-top: 4px;
      padding-left: 16px; }
    trip-proposal-display .trip-post-ride-request--action-button {
      color: #9e9e9e; }
  trip-proposal-display .matched-user-display {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    height: 48px;
    padding-left: 24px; }
  trip-proposal-display .divider-matched-user {
    height: 1px;
    background: #eee;
    width: 100%;
    border: 0; }
  trip-proposal-display .ride-request-main-buttons {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
        justify-content: space-between;
    padding-left: 16px;
    padding-right: 16px;
    padding-bottom: 16px;
    margin-top: auto; }
    trip-proposal-display .ride-request-main-buttons--im-not-interested-button {
      width: 200px;
      padding-right: 16px; }
    trip-proposal-display .ride-request-main-buttons--send-a-message-button {
      width: 200px;
      background: #65a5f2;
      float: right; }
  trip-proposal-display .t-subheading {
    margin-bottom: 8px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
        The trip-listing-tile-display component.

        Todo: Add description here.

        HTML Structure:

        Todo: Document HTML Structure
        trip-listing-tile-display

    */
trip-listing-tile-display {
  display: -ms-flexbox;
  display: flex;
  padding: 4px 0 0 4px;
  background-color: #FAFAFA; }

.trip-listing-tile-display--tile-display-container {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  border: 1px solid rgba(0, 0, 0, 0.12);
  margin: 0 4px 4px 0;
  background-color: #fff;
  transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  width: 236px; }
  .trip-listing-tile-display--tile-display-container:hover {
    cursor: pointer;
    /* box-shadow: 0 14px 28px rgba(0,0,0,0.24),
                      0 10px 10px rgba(0,0,0,0.22);*/
    box-shadow: 0 4px 24px rgba(0, 0, 0, 0.24), 0 8px 24px rgba(0, 0, 0, 0.2); }

.trip-listing-tile-display--schedule-information {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  height: 56px;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: center;
      justify-content: center; }

.trip-listing-tile-display--one-time-trip-information {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  padding: 0 16px;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: center;
      justify-content: center;
  font-size: 16px; }

.trip-listing-tile-display--single-trip-date {
  color: rgba(0, 0, 0, 0.87);
  line-height: 30px; }

.trip-listing-tile-display--single-trip-time {
  color: rgba(0, 0, 0, 0.38);
  -ms-flex-item-align: end;
      align-self: flex-end; }

.trip-listing-tile-display--user-display-container {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  padding: 16px 0 0; }

.trip-listing-tile-display--user-indicator {
  padding: 0 16px; }

.trip-listing-tile-display--map-pin {
  color: #03a9f4;
  bottom: 8px;
  right: 2px; }
  .trip-listing-tile-display--map-pin .MapPin-pinhead {
    border-color: #03a9f4; }
  .trip-listing-tile-display--map-pin .MapPin-point {
    border-top-color: #03a9f4;
    border-width: 25px 10px 0px 8px; }

.trip-listing-tile-display--pin {
  color: #03a9f4;
  font-size: 32px;
  position: absolute;
  top: 40px;
  left: 10px; }

.trip-listing-tile-display--user-profile-information {
  -ms-flex: 1;
      flex: 1; }
  .trip-listing-tile-display--user-profile-information h2 small.trip-listing-tile-display--reservation-confirmation {
    color: #0FB62B; }

.trip-listing-tile-display--user-name {
  line-height: 24px;
  font-weight: 500; }

.trip-listing-tile-display--icon-row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  -ms-flex-align: start;
      align-items: flex-start; }

.trip-listing-tile-display--user-preference-icons {
  color: rgba(0, 0, 0, 0.54); }

.trip-listing-tile-display--rating-star {
  height: 16px; }

.trip-listing-tile-display--route-addresses {
  /*Making the addresses display in one line and overflow hidden until hover*/ }
  .trip-listing-tile-display--route-addresses .address-summary-display--route {
    height: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 164px;
    /*248px; - actual size*/
    color: rgba(0, 0, 0, 0.87); }
    .trip-listing-tile-display--route-addresses .address-summary-display--route:hover {
      /*white-space: normal;
                    height: auto;*/ }
  .trip-listing-tile-display--route-addresses .address-summary-display--circle-status-icon {
    display: none; }

.trip-listing-tile-display--vehicle-summary {
  color: rgba(0, 0, 0, 0.38);
  margin: 3px 0 0 20px; }

.trip-listing-tile-display--trip-information {
  padding: 16px; }

.trip-listing-tile-display--address-display {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row; }

.trip-listing-tile-display--location {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  margin-bottom: 8px; }

.trip-listing-tile-display--general-info {
  /* display: flex;
            flex-direction: column;
            align-items: flex-end;*/
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  -ms-flex-align: center;
      align-items: center; }

.trip-listing-tile-display--trip-price {
  padding-left: 10px;
  /*to align with address-summary-display*/ }

.trip-listing-tile-display--trip-info-title {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  color: rgba(0, 0, 0, 0.38);
  width: 38px; }

.trip-listing-tile-display--trip-seats {
  margin-left: auto; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        The trip-mode-picker component.

        Todo: Add description here.

        HTML Structure:

        Todo: Document HTML Structure
        trip-mode-picker

    */
trip-mode-picker {
  display: -ms-flexbox;
  display: flex;
  background-color: #fff;
  border: 2px solid rgba(0, 0, 0, 0.12);
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 16px;
  font-weight: 300;
  font-weight: 500;
  width: 400px; }

.trip-mode-picker--picker-container {
  -ms-flex-direction: column;
      flex-direction: column;
  width: 100%; }

.trip-mode-picker--header-container {
  padding: 0 4px 0 16px;
  height: 56px;
  width: auto;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  -ms-flex-align: center;
      align-items: center; }

.trip-mode-picker--header-text {
  font-size: 20px;
  font-weight: 500;
  color: rgba(0, 0, 0, 0.87); }

.trip-mode-picker--header-btn {
  margin-left: auto;
  font-size: 24px;
  width: 48px;
  height: 48px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: distribute;
      justify-content: space-around; }

.trip-mode-picker--back-btn {
  height: 56px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        The user-public-trip-details component.

        Todo: Add description here.

        HTML Structure:

        Todo: Document HTML Structure
        user-public-trip-details

    */
user-public-trip-details {
  display: -ms-flexbox;
  display: flex;
  display: -webkit-flex;
  width: auto;
  height: 96px;
  background-color: #fff;
  padding: 16px;
  margin-left: 500px;
  margin-top: 20px;
  border: 2px solid rgba(0, 0, 0, 0.12); }

.user-public-trip-details--icon-item-container {
  max-height: 64px;
  width: auto;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  -ms-flex: 1 1 auto;
      flex: 1 1 auto; }

.user-public-trip-details--icon-items-left {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  height: 64px;
  width: auto;
  top: 0;
  margin-right: 16px; }

.user-public-trip-details--icon-legend-item {
  width: 24px !important;
  height: 24px !important;
  margin-right: 16px;
  color: rgba(0, 0, 0, 0.54); }

.user-public-trip-details--icon-legend-item > span {
  margin: 0 !important; }

.user-public-trip-details--icon-items-left > div {
  display: -ms-flexbox;
  display: flex; }

.user-public-trip-details--icon-items-right > div {
  display: -ms-flexbox;
  display: flex; }

.user-public-trip-details--icon-legend-item, .user-public-trip-details--legend-item-label {
  -ms-flex: 0 1 auto;
      flex: 0 1 auto; }

.user-public-trip-details--legend-item-label {
  width: auto;
  max-height: 24px;
  font-size: 14px;
  font-family: 'Roboto', Arial, sans-serif;
  text-align: left;
  margin-top: 0;
  color: rgba(0, 0, 0, 0.87); }

.user-public-trip-details--icon-items-top {
  margin-bottom: 12px; }

.user-public-trip-details--icon-items-right {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  height: 64px;
  margin-left: auto;
  top: 0; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
        The trip-listing-display component.

        Todo: Add description here.

        HTML Structure:

        Todo: Document HTML Structure
        trip-listing-display

    */
trip-listing-display {
  display: -ms-flexbox;
  display: flex;
  padding: 16px 0 8px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  transition: background-color 0.2s ease;
  -webkit-transition: background-color 0.2s ease;
  -moz-transition: background-color 0.2s ease;
  background-color: #FFF;
  height: 137px;
  max-width: 100%; }
  trip-listing-display:hover {
    background-color: rgba(3, 169, 244, 0.1);
    cursor: pointer; }
  trip-listing-display._hide-addresses {
    padding: 8px 0;
    height: 86px; }
    trip-listing-display._hide-addresses .trip-listing-display--schedule-information {
      -ms-flex-direction: row;
          flex-direction: row;
      -ms-flex-align: center;
          align-items: center; }

.trip-listing-display--user-indicator {
  padding: 0 16px;
  position: relative; }
  .trip-listing-display--user-indicator .MapPin {
    position: absolute;
    bottom: 0;
    left: 16px; }

.trip-listing-display--map-pin {
  color: #03a9f4;
  bottom: 8px;
  right: 2px; }
  .trip-listing-display--map-pin .MapPin-pinhead {
    padding-top: 0;
    border-color: #03a9f4; }
  .trip-listing-display--map-pin .MapPin-point {
    border-top-color: #03a9f4;
    border-width: 25px 10px 0px 8px; }

.trip-listing-display--pin {
  color: #03a9f4;
  font-size: 32px;
  position: absolute;
  top: 40px;
  left: 10px; }

.trip-listing-display--user-profile-information {
  -ms-flex: 1 1 auto;
      flex: 1 1 auto;
  width: 100%;
  min-width: 150px;
  padding-right: 16px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column; }
  .trip-listing-display--user-profile-information .trip-listing-display--user-name {
    -ms-flex-negative: 0;
        flex-shrink: 0; }
  .trip-listing-display--user-profile-information .trip-listing-display--icon-row {
    -ms-flex: 0 1 auto;
        flex: 0 1 auto; }
  .trip-listing-display--user-profile-information h2 small.trip-listing-display--reservation-confirmation {
    color: #0FB62B; }

.trip-listing-display--user-name {
  line-height: 24px;
  font-weight: 500;
  margin: 0;
  padding-bottom: 4px;
  /*added for mobile display - to fix reservation confirmation text overflow*/
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis; }

.trip-listing-display--user-name-icon {
  margin-left: 16px;
  color: rgba(0, 0, 0, 0.86); }

.trip-listing-display--icon-row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center; }

.trip-listing-display--user-preference-icons {
  color: rgba(0, 0, 0, 0.54); }

.trip-listing-display--route-addresses {
  /*Making the addresses display in one line and overflow hidden until hover*/
  /* .address-summary-display--route{ //.trip-listing-display--route-addresses .address-summary-display--route{}
                height: 20px;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                width: 248px;

                &:hover{
                    
                    /*white-space: normal;
                    height: auto;
                }*/ }

.trip-listing-display--vehicle-summary {
  color: rgba(0, 0, 0, 0.38);
  margin: 3px 0 0 20px; }

.trip-listing-display--schedule-information {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  -ms-flex-align: end;
      align-items: flex-end;
  padding-right: 16px;
  /*added for mobile display -small screen size*/
  min-width: 92px;
  -ms-flex: 1 0 auto;
      flex: 1 0 auto; }
  .trip-listing-display--schedule-information weekly-schedule-summary {
    margin: auto; }
  .trip-listing-display--schedule-information .trip-listing-display--one-time-trip-information {
    margin: auto 16px; }
  .trip-listing-display--schedule-information .trip-listing-display--general-info {
    margin: auto; }

.trip-listing-display--one-time-trip-information {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  -ms-flex-align: end;
      align-items: flex-end;
  margin-right: 20px; }

.trip-listing-display--single-trip-date {
  color: rgba(0, 0, 0, 0.38);
  line-height: 30px; }
  .trip-listing-display--single-trip-date.t-headline {
    font-size: 22px !important; }

.trip-listing-display--single-trip-time {
  color: rgba(0, 0, 0, 0.38);
  -ms-flex-item-align: end;
      align-self: flex-end; }

.trip-listing-display--general-info {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  -ms-flex-align: end;
      align-items: flex-end; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*

    <div class = "CARD"><
    <!00 ContentHERE __>
    <?div>

*/
/*.trip-proposal-display--matched-user-details-card  {
    margin-left: 16px;

    position:absolute;



}*/
.card {
  background: #ffffff;
  padding: 16px;
  margin-left: 16px;
  margin-right: 16px;
  margin-bottom: 16px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
        SplitButton contains a flat paper button, and a dropdown with additional options.
        The button may optionally have an icon inside of it.
    */
.SplitButton-buttonContainer {
  float: left; }

.SplitButton-button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  background-color: transparent;
  -webkit-border-fit: border !important;
  padding: 0;
  height: 32px;
  padding: 8px;
  font-family: Roboto,Arial,sans-serif;
  font-size: 12px;
  line-height: 16px;
  width: 100%;
  text-align: left; }
  .SplitButton-button:focus {
    outline: none; }
  .SplitButton-button::-moz-focus-inner {
    border: none;
    /* overrides extra padding in Firefox */ }
  .SplitButton-button:hover, .SplitButton-button:focus {
    background-color: #f1f1f1; }

.SplitButton-buttonIcon {
  font-size: 14px;
  margin-right: 8px;
  width: 16px;
  height: 16px;
  float: left; }

.SplitButton-buttonText {
  text-transform: uppercase;
  float: left; }

.SplitButton-dropdown {
  float: right; }

.SplitButton.SplitButton--brandPrimary .SplitButton-buttonText, .SplitButton.SplitButton--brandPrimary .SplitButton-buttonIcon {
  color: #03a9f4; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        The user-avatar-img component.

        Todo: Add description here.

        HTML Structure:

        Todo: Document HTML Structure
        user-avatar-img

    */
.user-avatar-img {
  border-radius: 50%;
  width: 40px;
  height: 40px;
  background-color: #EEEEEE; }
  .user-avatar-img--img {
    width: 100%;
    border-radius: 50%; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "materialSettings"; //This doesn't seem to be required. Also, I don't think this is the right address.*/
user-schedule-comparator {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  min-width: 400px;
  max-width: 400px;
  height: 613px;
  background-color: #FAFAFA;
  -ms-flex-direction: column;
      flex-direction: column;
  -ms-flex-pack: justify;
      justify-content: space-between; }

.user-schedule-comparator {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column; }
  .user-schedule-comparator--group-schedule-display {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
        justify-content: space-between;
    -ms-flex-align: baseline;
        align-items: baseline; }
  .user-schedule-comparator--group-schedule-heading {
    display: inline-block;
    -ms-flex-direction: column;
        flex-direction: column;
    width: auto; }
  .user-schedule-comparator--group-schedule-subheading {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-line-pack: justify;
        align-content: space-between; }
  .user-schedule-comparator--user-avatar-displays {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
        justify-content: center;
    margin: 16px 0 8px 0;
    width: 400px; }
  .user-schedule-comparator--user-avatar-displays-list-item {
    -ms-flex: 1 0 auto;
        flex: 1 0 auto;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center; }
  .user-schedule-comparator--user-name {
    width: 432px;
    height: 50px;
    margin: 0 -16px 0 -16px;
    padding: 0 0 0 16px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    background-color: #EEEDED;
    /* color: $brand-primary; //*/
    color: #6d6d6d; }
  .user-schedule-comparator--weekly-schedule-display {
    -ms-flex: 1 0 100%;
        flex: 1 0 100%;
    width: 432px;
    height: 420px;
    margin: 0 -16px 0 -16px; }
    .user-schedule-comparator--weekly-schedule-display--custom-schedule-panel-time-picker {
      background-color: #FAFAFA; }
  .user-schedule-comparator--compare-times-btn {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: end;
        justify-content: flex-end;
    -ms-flex-align: center;
        align-items: center;
    color: #03A7F2 !important; }

.card {
  background-color: #FAFAFA;
  margin: 0; }

.rs-icon._exit:not(md-icon) {
  width: 24px;
  height: 24px; }

.rs-icon._checkmark {
  color: #AEAEAE;
  width: 16px;
  height: 16px; }

.t-title {
  display: inline-block; }

.t-subheading {
  display: inline-block;
  padding: 0 12px 0 0; }

.weekly-schedule-picker--custom-schedule-panel-time-picker {
  color: #737373; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
 * This mixin adds specific colors to rs-icon's which match a certain type of icon.
 */
user-details-display {
  display: -ms-flexbox;
  display: flex;
  display: -webkit-flex;
  padding: 16px 0 0 16px;
  border-top: 1px solid rgba(0, 0, 0, 0.12);
  border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
  user-details-display .rs-icon {
    /*gender*/
    /*skill level*/
    /*smoking status*/
    /*carpool related*/
    /*cycling related*/
    /*commute buddy _travel-mode-editor.scss*/
    /*CSSGroup*/
    /*employer group*/ }
    user-details-display .rs-icon._female {
      color: #bf82cc; }
    user-details-display .rs-icon._male {
      color: #3f51b5; }
    user-details-display .rs-icon._star-1 {
      color: #D9B85C; }
    user-details-display .rs-icon._star-2 {
      color: #D9B85C; }
    user-details-display .rs-icon._star-3 {
      color: #D9B85C; }
    user-details-display .rs-icon._star-4 {
      color: #D9B85C; }
    user-details-display .rs-icon._star-5 {
      color: #D9B85C; }
    user-details-display .rs-icon._smoking {
      color: #9ccc65; }
    user-details-display .rs-icon._non-smoking {
      color: #689f38; }
    user-details-display .rs-icon._driver-circle {
      color: #ff9d4d; }
    user-details-display .rs-icon._passenger {
      color: #ce467c; }
    user-details-display .rs-icon._mentor {
      color: #56A4A3; }
    user-details-display .rs-icon._carpool-circle {
      color: #64B3F4; }
    user-details-display .rs-icon._vanpool-circle {
      color: #5C6BBE; }
    user-details-display .rs-icon._bicycle {
      color: #26A498; }
    user-details-display .rs-icon._bus-buddy {
      color: #A947BA; }
    user-details-display .rs-icon._walking {
      color: #EF5350; }
    user-details-display .rs-icon._cluster {
      color: #555; }
    user-details-display .rs-icon._briefcase {
      color: #b3b84f; }

.user-details-display {
  /* details container ends */ }
  .user-details-display--details-container._single-column {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column; }
    .user-details-display--details-container._single-column .user-details-display--details-container-item {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-direction: row;
          flex-direction: row;
      -ms-flex: 0 1 auto;
          flex: 0 1 auto;
      margin-bottom: 8px; }
    .user-details-display--details-container._single-column .user-details-display--details-container-item-icon {
      color: rgba(0, 0, 0, 0.54);
      width: 24px;
      height: 24px;
      margin-right: 16px; }
    .user-details-display--details-container._single-column .user-details-display--details-container-icon {
      font-size: 24px; }
    .user-details-display--details-container._single-column .user-details-display--details-container-item-label {
      font-size: 14px;
      font-family: 'Roboto', Arial, sans-serif;
      text-align: left;
      color: rgba(0, 0, 0, 0.54);
      max-height: 24px;
      width: auto; }
  .user-details-display--details-container._two-columns {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row; }
    .user-details-display--details-container._two-columns .user-details-display--details-container-column {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-direction: column;
          flex-direction: column;
      margin-right: 16px; }
    .user-details-display--details-container._two-columns._left {
      margin-right: 16px;
      background-color: #fffaa5; }
    .user-details-display--details-container._two-columns._right {
      margin-left: auto;
      top: 0;
      -ms-flex-pack: start;
          justify-content: flex-start; }
    .user-details-display--details-container._two-columns .user-details-display--details-container-item {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-direction: row;
          flex-direction: row;
      -ms-flex: 0 1 auto;
          flex: 0 1 auto;
      margin-bottom: 8px; }
    .user-details-display--details-container._two-columns .user-details-display--details-container-item-icon {
      color: rgba(0, 0, 0, 0.54);
      width: 24px;
      height: 24px;
      margin-right: 16px; }
      .user-details-display--details-container._two-columns .user-details-display--details-container-item-icon .user-details-display--details-container-icon {
        font-size: 24px; }
      .user-details-display--details-container._two-columns .user-details-display--details-container-item-icon .user-details-display--details-container-item-label {
        font-size: 14px;
        font-family: 'Roboto', Arial, sans-serif;
        text-align: left;
        color: rgba(0, 0, 0, 0.86);
        max-height: 24px;
        width: auto; }

/*user-details-display ends*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
 * This mixin adds specific colors to rs-icon's which match a certain type of icon.
 */
user-details-icon-display {
  display: -ms-flexbox;
  display: flex;
  display: -webkit-flex; }
  user-details-icon-display._icon-small .user-details-icon-display--details-icon {
    font-size: 16px;
    width: 16px;
    height: 16px; }
  user-details-icon-display._icon-medium .user-details-icon-display--details-icon {
    font-size: 20px;
    width: 20px;
    height: 20px; }
  user-details-icon-display._icon-large .user-details-icon-display--details-icon {
    font-size: 24px;
    width: 24px;
    height: 24px; }
  user-details-icon-display .rs-icon {
    /*gender*/
    /*skill level*/
    /*smoking status*/
    /*carpool related*/
    /*cycling related*/
    /*commute buddy _travel-mode-editor.scss*/
    /*CSSGroup*/
    /*employer group*/ }
    user-details-icon-display .rs-icon._female {
      color: #bf82cc; }
    user-details-icon-display .rs-icon._male {
      color: #3f51b5; }
    user-details-icon-display .rs-icon._star-1 {
      color: #D9B85C; }
    user-details-icon-display .rs-icon._star-2 {
      color: #D9B85C; }
    user-details-icon-display .rs-icon._star-3 {
      color: #D9B85C; }
    user-details-icon-display .rs-icon._star-4 {
      color: #D9B85C; }
    user-details-icon-display .rs-icon._star-5 {
      color: #D9B85C; }
    user-details-icon-display .rs-icon._smoking {
      color: #9ccc65; }
    user-details-icon-display .rs-icon._non-smoking {
      color: #689f38; }
    user-details-icon-display .rs-icon._driver-circle {
      color: #ff9d4d; }
    user-details-icon-display .rs-icon._passenger {
      color: #ce467c; }
    user-details-icon-display .rs-icon._mentor {
      color: #56A4A3; }
    user-details-icon-display .rs-icon._carpool-circle {
      color: #64B3F4; }
    user-details-icon-display .rs-icon._vanpool-circle {
      color: #5C6BBE; }
    user-details-icon-display .rs-icon._bicycle {
      color: #26A498; }
    user-details-icon-display .rs-icon._bus-buddy {
      color: #A947BA; }
    user-details-icon-display .rs-icon._walking {
      color: #EF5350; }
    user-details-icon-display .rs-icon._cluster {
      color: #555; }
    user-details-icon-display .rs-icon._briefcase {
      color: #b3b84f; }

.user-details-icon-display--details-container {
  display: -ms-flexbox;
  display: flex; }

.user-details-icon-display--details-container-item-icon {
  margin-right: 8px; }

.user-details-icon-display--details-icon {
  font-size: 16px;
  color: rgba(0, 0, 0, 0.54);
  width: 16px;
  height: 16px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        The user-account-settings-display component.

        Todo: Add description here.

        HTML Structure:

        Todo: Document HTML Structure
        user-account-settings-display

    */
.user-account-settings-display {
  /* Account Details style */ }
  .user-account-settings-display--container-wrapper {
    width: 480px;
    height: 100%;
    border: 1px solid #ddd;
    color: rgba(0, 0, 0, 0.87);
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23); }
  .user-account-settings-display--header-wrapper {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    padding: 16px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    padding: 4px;
    -ms-flex-align: center;
        align-items: center; }
  .user-account-settings-display--back-arrow {
    width: 48px;
    height: 48px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center; }
  .user-account-settings-display--header-text {
    padding-left: 16px;
    font-size: 20px;
    line-height: 24px; }
  .user-account-settings-display--user-profile-display {
    /*height: 128px;*/
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    padding-top: 16px;
    box-shadow: 0 4px 6px 0 rgba(0, 0, 0, 0.12); }
  .user-account-settings-display--user-avatar-container {
    padding: 0px 24px 4px; }
  .user-account-settings-display--user-avatar-display {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background-color: cornflowerblue; }
  .user-account-settings-display--user-image-upload {
    height: 32px;
    width: 32px;
    border-radius: 50%;
    border: 2px solid #FFF;
    background-color: cadetblue;
    position: relative;
    top: -20px;
    left: -8px;
    z-index: 3; }
  .user-account-settings-display--user-name-container {
    font-size: 24px; }
  .user-account-settings-display--user-name {
    padding-left: 16px; }
  .user-account-settings-display--user-icon-display {
    font-size: 20px;
    color: rgba(0, 0, 0, 0.54); }
  .user-account-settings-display--user-rating-display {
    font-size: 20px; }
  .user-account-settings-display--user-information-container {
    padding: 0;
    margin: 0; }
  .user-account-settings-display--user-details-display-wrapper {
    padding: 14px 16px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
  .user-account-settings-display--user-details-sub-header {
    font-size: 16px; }
    .user-account-settings-display--user-details-sub-header:hover {
      background-color: #EEE; }
  .user-account-settings-display--sub-header-discription {
    font-size: 14px;
    line-height: 16px;
    color: rgba(0, 0, 0, 0.54); }
  .user-account-settings-display--snack-bar-container {
    display: -ms-flexbox;
    display: flex;
    position: absolute;
    bottom: 0;
    left: 50%;
    margin-left: -180px;
    width: 100%; }
  .user-account-settings-display--snack-bar-wrapper {
    width: 360px;
    color: #FFF;
    background-color: black;
    padding: 14px 16px;
    font-size: 14px;
    line-height: 20px; }
  .user-account-settings-display--details-display-container {
    position: absolute;
    top: 8px;
    left: 496px;
    width: 480px;
    border: 1px solid #DDD;
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22); }
  .user-account-settings-display--details-display-wrapper {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row; }
  .user-account-settings-display--details-left-arrow {
    width: 0;
    height: 0;
    border-right: 20px solid #FFF;
    border-top: 14px solid transparent;
    border-bottom: 14px solid transparent;
    position: absolute;
    top: 204px;
    left: -16px; }
  .user-account-settings-display--details-content-wrapper {
    padding-bottom: 16px;
    width: 100%; }
  .user-account-settings-display--details-header {
    height: 56px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center; }
  .user-account-settings-display--header-exit-button {
    padding-right: 16px; }
  .user-account-settings-display--header-text {
    margin-right: auto;
    font-size: 20px; }
  .user-account-settings-display--sub-header-details {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    -ms-flex-align: center;
        align-items: center;
    padding: 10px 0px;
    background-color: #EEE; }
  .user-account-settings-display--sub-header-text {
    font-size: 14px;
    line-height: 20px;
    margin-right: auto; }
  .user-account-settings-display--sub-header-button {
    padding-right: 16px; }
  .user-account-settings-display--inputs-wrapper {
    height: 100px; }
  .user-account-settings-display--login-option-wrapper {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center; }
  .user-account-settings-display--login-icon {
    padding-left: 16px;
    height: 20px;
    font-size: 20px; }
  .user-account-settings-display--login-option {
    padding-left: 16px;
    margin-right: auto; }
  .user-account-settings-display--disconnect-button {
    height: 24px;
    padding: 12px 16px; }
  .user-account-settings-display--password-change-display {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    -ms-flex-align: center;
        align-items: center;
    padding-bottom: 8px; }
  .user-account-settings-display--password-change-text {
    padding-left: 16px;
    margin-right: auto;
    line-height: 24px;
    padding: 8px 0px 0px 16px; }
  .user-account-settings-display--password-change-options {
    padding-right: 16px; }
  .user-account-settings-display--account-footer-buttons {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    -ms-flex-align: center;
        align-items: center;
    padding: 9px 0; }
  .user-account-settings-display--delete-button {
    margin-right: auto;
    padding: 10px 0 10px 16px; }
  .user-account-settings-display--save-button {
    margin-right: 16px; }

/*User Details*/
.matched-user-details {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  margin-bottom: 16px;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -ms-flex-align: center;
      align-items: center; }
  .matched-user-details--profile-left-display {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex-pack: justify;
        justify-content: space-between;
    -ms-flex-align: center;
        align-items: center; }
  .matched-user-details--divider-vertical {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    width: 1px;
    height: 50px;
    background: #eeeeee; }
  .matched-user-details--profile-right-display {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex-pack: start;
        justify-content: flex-start;
    -ms-flex-align: center;
        align-items: center; }

.user-avatar-img {
  padding-bottom: 8px;
  height: 72px;
  width: 72px; }

.rating-star-display {
  height: 24px;
  width: 100%; }

.matched-user-schedule-display {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
      justify-content: space-between;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-line-pack: center;
      align-content: center;
  height: 92px; }
  .matched-user-schedule-display--schedule-summary {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex-pack: distribute;
        justify-content: space-around;
    -ms-flex-align: start;
        align-items: flex-start;
    height: 92px; }
  .matched-user-schedule-display--view-schedule-button {
    height: 32px;
    color: #65a5f2;
    color: #65a5f2;
    font-weight: bold; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        The vehicle-description-summary component.

        Todo: Add description here.

        HTML Structure:

        Todo: Document HTML Structure
        vehicle-description-summary

    */
vehicle-description-summary {
  color: rgba(0, 0, 0, 0.38); }

.vehicle-description-summary--vehicle-info {
  /*padding-top: 5px;
             margin-left: 16px;*/ }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The user-vehicle-editor component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		user-vehicle-editor

	*/
.user-vehicle-editor--form {
  margin-top: 16px; }

.user-vehicle-editor--input-row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  height: 80px; }

.user-vehicle-editor--label {
  font-weight: 500 !important;
  max-width: initial !important;
  overflow: initial !important;
  /*Needed to add this fix so that it doesn't cut off on mobile*/ }

.user-vehicle-editor--block-column {
  width: 240px;
  margin-left: 16px;
  margin-right: 16px; }

.user-vehicle-editor--car-ownership {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  padding: 0 16px 0 20px;
  height: 48px;
  margin-bottom: 16px;
  /* border-bottom: 1px solid rgba(0, 0, 0, 0.12);
            border-top: 1px solid rgba(0, 0, 0, 0.12);*/
  cursor: pointer; }

.user-vehicle-editor--car-ownership-checkbox-holder {
  margin-left: auto; }

.user-vehicle-editor--vehicle-image {
  height: 56px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  padding: 0 4px 0 16px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  cursor: pointer; }

.user-vehicle-editor--vehicle-icon {
  width: 40px;
  height: 40px;
  background-color: #EEEEEE;
  color: rgba(0, 0, 0, 0.54);
  border-radius: 50%;
  font-size: 24px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: center;
      justify-content: center; }

.user-vehicle-editor--add-vehicle-text {
  padding-left: 16px; }

.user-vehicle-editor--action-area {
  height: 56px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: end;
      justify-content: flex-end; }

.user-vehicle-editor--action-area-mobile {
  display: none; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The user-vehicle-picker component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		user-vehicle-picker

	*/
.user-vehicle-picker {
  width: 448px;
  background-color: white;
  position: absolute;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
  left: 16px;
  top: -22px;
  /*padding: 8px 0px;*/
  z-index: 1; }
  .user-vehicle-picker--list-container {
    height: 280px; }
  .user-vehicle-picker--list-item {
    border-top: 1px solid rgba(0, 0, 0, 0.12);
    height: 56px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    padding-left: 16px;
    cursor: pointer; }
    .user-vehicle-picker--list-item:hover {
      background-color: #ececec;
      transition: background-color 0.3s ease;
      -moz-transition: background-color 0.3s ease; }
  .user-vehicle-picker--vehicle-icon {
    width: 40px;
    height: 40px;
    background-color: #EEEEEE;
    color: rgba(0, 0, 0, 0.54);
    border-radius: 50%;
    font-size: 24px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center; }
  .user-vehicle-picker--vehicle-model {
    padding-left: 16px; }
  .user-vehicle-picker--icon-row {
    margin-left: auto;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    padding-right: 4px; }
  .user-vehicle-picker--edit-button {
    color: rgba(0, 0, 0, 0.54); }
  .user-vehicle-picker--selected-vehicle {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    width: 48px !important;
    height: 48px !important; }
  .user-vehicle-picker--add-vehicle {
    height: 48px;
    width: 100%;
    border-top: 1px solid rgba(0, 0, 0, 0.12); }
    .user-vehicle-picker--add-vehicle:hover {
      color: #03a9f4; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.u-pullLeft {
  float: left !important; }

.u-clearLeft {
  clear: left !important; }

.u-pullRight {
  float: right !important; }

.u-marginRight16 {
  margin-right: 16px !important; }

.u-cf:before, .u-cf:after {
  content: " ";
  display: table; }

.u-cf:after {
  clear: both; }

.u-cursorPointer {
  cursor: pointer; }

.u-centerHorizontal {
  margin: 0 auto; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.u-uppercase {
  text-transform: uppercase; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        These helper classes contain all relevant typography for the app.

        All typography helpers, follow this naming convention:

        .t-{NAME_OF_TYPOGRAPHY_CLASS}

        For modifiers, use this modifier pattern:

        .t-mod--{NAME_OF_MODIFIER}


        Eg, for body-1

        .t-body-1

        To make body-1 have a text shadow, add this class:

        .t-body-1.t-mod--text-shadow



        Modifications of these classes can have far-reaching, unintended consequences. 
        
        If you need to make a modification to a typography style, either pick an existing modifier which suits your needs, or,
        add special formatting in your component.
    */
.t-caption {
  font-family: 'Roboto', Arial, sans-serif !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  color: #9e9e9e;
  color: rgba(0, 0, 0, 0.38); }
  .t-caption._t-font-weight-light {
    font-weight: 300 !important; }
  .t-caption._t-font-weight-regular {
    font-weight: 400 !important; }
  .t-caption._t-font-weight-medium {
    font-weight: 500 !important; }
  .t-caption._t-font-weight-bold {
    font-weight: 700 !important; }

.t-headline {
  font-family: 'Roboto', Arial, sans-serif !important;
  font-size: 24px !important;
  font-weight: 400 !important; }
  .t-headline._t-font-weight-light {
    font-weight: 300 !important; }
  .t-headline._t-font-weight-regular {
    font-weight: 400 !important; }
  .t-headline._t-font-weight-medium {
    font-weight: 500 !important; }
  .t-headline._t-font-weight-bold {
    font-weight: 700 !important; }

.t-title {
  font-family: 'Roboto', Arial, sans-serif !important;
  font-size: 20px !important;
  font-weight: 500 !important;
  line-height: 24px !important;
  color: #212121; }
  .t-title._t-font-weight-light {
    font-weight: 300 !important; }
  .t-title._t-font-weight-regular {
    font-weight: 400 !important; }
  .t-title._t-font-weight-medium {
    font-weight: 500 !important; }
  .t-title._t-font-weight-bold {
    font-weight: 700 !important; }

.t-subheading {
  font-family: 'Roboto', Arial, sans-serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  color: #212121; }
  .t-subheading._t-font-weight-light {
    font-weight: 300 !important; }
  .t-subheading._t-font-weight-regular {
    font-weight: 400 !important; }
  .t-subheading._t-font-weight-medium {
    font-weight: 500 !important; }
  .t-subheading._t-font-weight-bold {
    font-weight: 700 !important; }

.t-subheading-2 {
  font-family: 'Roboto', Arial, sans-serif !important;
  font-size: 16px !important;
  font-weight: 500 !important; }
  .t-subheading-2._t-font-weight-light {
    font-weight: 300 !important; }
  .t-subheading-2._t-font-weight-regular {
    font-weight: 400 !important; }
  .t-subheading-2._t-font-weight-medium {
    font-weight: 500 !important; }
  .t-subheading-2._t-font-weight-bold {
    font-weight: 700 !important; }

.t-body-2 {
  font-family: 'Roboto', Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 500 !important; }
  .t-body-2._t-font-weight-light {
    font-weight: 300 !important; }
  .t-body-2._t-font-weight-regular {
    font-weight: 400 !important; }
  .t-body-2._t-font-weight-medium {
    font-weight: 500 !important; }
  .t-body-2._t-font-weight-bold {
    font-weight: 700 !important; }

.t-body-1 {
  font-family: 'Roboto', Arial, sans-serif !important;
  font-size: 14px !important;
  font-weight: 400 !important; }
  .t-body-1._t-font-weight-light {
    font-weight: 300 !important; }
  .t-body-1._t-font-weight-regular {
    font-weight: 400 !important; }
  .t-body-1._t-font-weight-medium {
    font-weight: 500 !important; }
  .t-body-1._t-font-weight-bold {
    font-weight: 700 !important; }

/*Material design caption*/
.t-subhead-1 {
  font-family: 'Roboto', Arial, sans-serif !important;
  font-size: 12px !important;
  font-weight: 500 !important; }
  .t-subhead-1._t-font-weight-light {
    font-weight: 300 !important; }
  .t-subhead-1._t-font-weight-regular {
    font-weight: 400 !important; }
  .t-subhead-1._t-font-weight-medium {
    font-weight: 500 !important; }
  .t-subhead-1._t-font-weight-bold {
    font-weight: 700 !important; }

.t-display-1 {
  font-family: 'Roboto', Arial, sans-serif !important;
  font-size: 34px !important;
  font-weight: 400 !important; }
  .t-display-1._t-font-weight-light {
    font-weight: 300 !important; }
  .t-display-1._t-font-weight-regular {
    font-weight: 400 !important; }
  .t-display-1._t-font-weight-medium {
    font-weight: 500 !important; }
  .t-display-1._t-font-weight-bold {
    font-weight: 700 !important; }

.bootstrap h1.t-title, .bootstrap h1.t-subheading, .bootstrap h1.t-body-2, .bootstrap h1.t-body-1, .bootstrap h1.t-caption, .bootstrap h2.t-title, .bootstrap h2.t-subheading, .bootstrap h2.t-body-2, .bootstrap h2.t-body-1, .bootstrap h2.t-caption, .bootstrap h3.t-title, .bootstrap h3.t-subheading, .bootstrap h3.t-body-2, .bootstrap h3.t-body-1, .bootstrap h3.t-caption, .bootstrap h4.t-title, .bootstrap h4.t-subheading, .bootstrap h4.t-body-2, .bootstrap h4.t-body-1, .bootstrap h4.t-caption, .bootstrap h5.t-title, .bootstrap h5.t-subheading, .bootstrap h5.t-body-2, .bootstrap h5.t-body-1, .bootstrap h5.t-caption, .bootstrap h6.t-title, .bootstrap h6.t-subheading, .bootstrap h6.t-body-2, .bootstrap h6.t-body-1, .bootstrap h6.t-caption {
  margin: 0; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*

    Chat Message Composer structure:

    chat-message-composer
        --textarea-container
            --textarea
            --hidden-sizing-div (added by JS in order to set the height attribute of --textarea appropriately)
        --buttons-container
            --buttons-container-btn.alt--shrink-btn
            --buttons-container-btn.alt--send-btn


*/
chat-message-composer {
  display: -ms-flexbox;
  display: flex;
  background-color: #03a9f4;
  min-height: 64px; }

.chat-message-composer {
  /*

    Chat Message Composer structure:

    chat-message-composer
        --textarea-container
            --textarea
            --hidden-sizing-div (added by JS in order to set the height attribute of --textarea appropriately)

    */
  /**
          The textarea and hidden sizing div must have the same styles for anything
          related to the size. The hidden sizing div will have the content the user
          has typed entered into the div; the height of it will be read and set onto
          the textarea's height. The width, height, padding, font-size of the hidden
          sizing div and textarea must be synchronized.
        */
  /*

    Chat Message Composer structure:

    chat-message-composer
        --buttons-container
            --buttons-container-btn (x2)

    */ }
  .chat-message-composer--textarea-container {
    margin: 16px 4px 16px 20px;
    -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    min-height: 32px;
    background-color: #fff;
    box-sizing: border-box;
    -ms-flex-pack: center;
        justify-content: center;
    overflow-y: hidden; }
  .chat-message-composer--textarea, .chat-message-composer--hidden-sizing-div {
    border: 0;
    padding: 5px;
    width: 100%;
    min-height: 32px;
    max-height: 244px;
    margin-bottom: 0;
    overflow-wrap: break-word;
    white-space: pre-wrap;
    word-wrap: break-word;
    border: 0;
    border-radius: 0;
    resize: none;
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 14px; }
  .chat-message-composer--textarea {
    -ms-flex: 1 1 100%;
        flex: 1 1 100%;
    color: #000;
    margin: auto;
    background-color: #fff;
    overflow-y: auto;
    transition: height 0.15s ease-out;
    position: relative;
    overflow-y: auto;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    /* Set width */
    /* Track */
    /* Handle */ }
    .chat-message-composer--textarea::-webkit-scrollbar {
      width: 8px; }
    .chat-message-composer--textarea::-webkit-scrollbar-track {
      display: none; }
    .chat-message-composer--textarea::-webkit-scrollbar-thumb {
      border-radius: 10px;
      background-color: rgba(200, 200, 200, 0.8);
      box-shadow: inset 0 0 6px rgba(200, 200, 200, 0.8); }
    .chat-message-composer--textarea::-webkit-scrollbar-thumb:window-inactive {
      background: rgba(201, 201, 201, 0.8); }
  .chat-message-composer--hidden-sizing-div {
    -ms-flex: 1 0 auto;
        flex: 1 0 auto;
    padding-bottom: 16px;
    overflow-y: hidden; }
  .chat-message-composer--buttons-container {
    -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    -ms-flex-item-align: stretch;
        align-self: stretch;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    margin: 8px 4px 8px 0; }
  .chat-message-composer--buttons-container-btn {
    -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    background-color: #03a9f4;
    color: #ffffff;
    padding: 16px 0; }
    .chat-message-composer--buttons-container-btn.alt--send-btn {
      -ms-flex-item-align: end;
          align-self: flex-end;
      margin-top: auto; }
    .chat-message-composer--buttons-container-btn.alt--shrink-btn {
      -ms-flex-item-align: start;
          align-self: flex-start;
      margin-bottom: auto; }
  .chat-message-composer--hidden-sizing-div-new-line {
    width: 100%; }

/**
		The chat-thread component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		chat-thread

	*/
chat-thread {
  display: block;
  position: relative;
  z-index: 1; }

.chat-thread--thread-display {
  width: 100%;
  height: calc(100% - 64px);
  transition: height 0.15s ease-out; }

.chat-thread--message-composer {
  z-index: 2;
  width: 100%;
  min-height: 64px;
  position: absolute;
  bottom: 0; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The chat-thread-display component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		chat-thread-display

	*/
chat-thread-display {
  display: -ms-flexbox;
  display: flex;
  background-color: #fff;
  width: 100%;
  height: 100%; }

.chat-thread-display {
  /* End of -div */ }
  .chat-thread-display--sequence-holder {
    overflow-y: auto;
    overflow-x: hidden;
    -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    max-width: 100%;
    position: relative;
    overflow-y: auto;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    /* Set width */
    /* Track */
    /* Handle */
    background-color: #eee; }
    .chat-thread-display--sequence-holder::-webkit-scrollbar {
      width: 8px; }
    .chat-thread-display--sequence-holder::-webkit-scrollbar-track {
      display: none; }
    .chat-thread-display--sequence-holder::-webkit-scrollbar-thumb {
      border-radius: 10px;
      background-color: rgba(200, 200, 200, 0.8);
      box-shadow: inset 0 0 6px rgba(200, 200, 200, 0.8); }
    .chat-thread-display--sequence-holder::-webkit-scrollbar-thumb:window-inactive {
      background: rgba(201, 201, 201, 0.8); }
  .chat-thread-display--sequence-holder-div {
    width: 100%;
    border-top: 1px solid rgba(0, 0, 0, 0.12); }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The chat-thread-list component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		chat-thread-list

	*/
chat-thread-list {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column; }

.chat-thread-list--list-item {
  width: 100%;
  -ms-flex: 0 0 auto;
      flex: 0 0 auto; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
		The chat-thread-list-item component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		chat-thread-list item

	*/
chat-thread-list-item {
  display: -ms-flexbox;
  display: flex;
  background-color: #fff;
  padding: 16px 16px 32px 16px;
  height: 88px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  transition: background-color 0.2s ease;
  -webkit-transition: background-color 0.2s ease; }
  chat-thread-list-item:hover {
    background-color: #ececec;
    cursor: pointer; }

.chat-thread-list-item--user-indicator-avatar-img {
  -ms-flex: 0 1 auto;
      flex: 0 1 auto;
  left: 0;
  top: 0;
  width: 40px;
  height: 40px;
  margin-top: 0px !important; }

.chat-thread-list-item--conversation-item-container {
  -ms-flex: 1 1 auto;
      flex: 1 1 auto;
  margin-left: 16px;
  max-width: 346px; }

.chat-thread-list-item--conversation-items-display {
  display: -ms-flexbox;
  display: flex;
  height: 20px;
  -ms-flex-direction: row;
      flex-direction: row; }

.chat-thread-list-item--user-name {
  margin-right: auto;
  -ms-flex: 0 1 auto;
      flex: 0 1 auto;
  max-height: 20px;
  -ms-flex-item-align: start;
      align-self: flex-start; }

.chat-thread-list-item--option-menu-btn {
  -ms-flex: 0 1 auto;
      flex: 0 1 auto;
  max-height: 20px;
  -ms-flex-item-align: start;
      align-self: flex-start; }
  .chat-thread-list-item--option-menu-btn._option-small-button {
    width: 20px;
    height: 20px; }
    .chat-thread-list-item--option-menu-btn._option-small-button .chat-thread-list-item--option-icon {
      font-size: 15px;
      margin: 0;
      -ms-flex-align: start;
          align-items: flex-start; }

.chat-thread-list-item--message-count-badge {
  border: 1px solid #69a6ec;
  margin-right: 16px;
  background-color: #03a9f4;
  border-radius: 50%;
  padding-bottom: 2px;
  text-align: center;
  cursor: pointer;
  color: #fff;
  font-size: 12px;
  width: 20px;
  height: 20px;
  -ms-flex: 0 1 auto;
      flex: 0 1 auto;
  max-height: 20px;
  -ms-flex-item-align: start;
      align-self: flex-start; }

.chat-thread-list-item--message-summary-container {
  overflow: hidden; }

.chat-thread-list-item--message-summary {
  height: 20px;
  -ms-flex: 0 1 auto;
      flex: 0 1 auto;
  color: rgba(0, 0, 0, 0.76);
  font-size: 1em; }

.chat-thread-list-item--trip-related-items {
  max-height: 16px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  color: rgba(0, 0, 0, 0.54);
  font-size: 0.8em;
  -ms-flex-align: center;
      align-items: center; }

.chat-thread-list-item--trip-related-icon {
  -ms-flex: 0 1 auto;
      flex: 0 1 auto; }
  .chat-thread-list-item--trip-related-icon._trip-small-button {
    width: 16px;
    height: 16px; }
    .chat-thread-list-item--trip-related-icon._trip-small-button .chat-thread-list-item--trip-icon {
      font-size: 14px;
      margin: 0; }

.chat-thread-list-item--trip-related-msg {
  -ms-flex: 0 1 auto;
      flex: 0 1 auto; }

.chat-thread-list-item--message-date {
  -ms-flex: 0 1 auto;
      flex: 0 1 auto;
  flex: 0 1 auto; }

.chat-thread-list-item--trip-related-msg {
  -ms-flex: 0 1 auto;
      flex: 0 1 auto;
  margin-left: 8px; }

.chat-thread-list-item--message-date {
  -ms-flex: 0 1 auto;
      flex: 0 1 auto;
  margin-left: auto; }

/*end of chat-thread-list-item*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The chat-thread-sequence-item component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		chat-thread-sequence-item

	*/
chat-thread-sequence-item {
  height: auto;
  max-width: 100%; }

.chat-thread-sequence-item--container {
  display: -ms-flexbox;
  display: flex;
  padding: 16px 16px 0 16px;
  width: 100%;
  height: auto; }
  .chat-thread-sequence-item--container._left .chat-thread-sequence-item--chat-message-container-message {
    margin: 0 0 8px 8px; }
    .chat-thread-sequence-item--container._left .chat-thread-sequence-item--chat-message-container-message:before {
      content: "";
      position: absolute;
      width: 0;
      height: 0;
      border-style: solid;
      top: 0;
      left: 0;
      border-width: 8px 8px 0 8px;
      border-color: #fff transparent transparent transparent; }
  .chat-thread-sequence-item--container._left .chat-thread-sequence-item--chat-message-container-time {
    text-align: left;
    padding-left: 8px; }
  .chat-thread-sequence-item--container._right {
    -ms-flex-direction: row-reverse;
        flex-direction: row-reverse; }
    .chat-thread-sequence-item--container._right .chat-thread-sequence-item--chat-message-container-message {
      margin: 0 8px 8px 0;
      background-color: #e1f5fe;
      /*rgba(3,169,244,0.12);*/
      /*End of _left:before */ }
      .chat-thread-sequence-item--container._right .chat-thread-sequence-item--chat-message-container-message:before {
        position: absolute;
        content: '';
        width: 0;
        height: 0;
        border-style: solid;
        top: 0;
        right: 0;
        border-width: 8px 8px 0 8px;
        border-color: #e1f5fe transparent transparent transparent; }
    .chat-thread-sequence-item--container._right .chat-thread-sequence-item--chat-message-container-time {
      text-align: right;
      padding-right: 8px; }

.chat-thread-sequence-item--user-indicator-avatar-img {
  -ms-flex: 0 1 auto;
      flex: 0 1 auto;
  z-index: 2;
  left: 16px;
  margin-top: 0px;
  margin-right: 16px; }

.chat-thread-sequence-item--chat-message-container {
  -ms-flex: 0 1 auto;
      flex: 0 1 auto;
  max-width: 100%;
  position: relative; }

.chat-thread-sequence-item--chat-message-container-message {
  max-width: 100%;
  background-color: #fff;
  height: auto;
  border-radius: 2px;
  padding: 16px;
  /**
                These are added to get word breaks on long, long words, links, etc.
            */ }
  .chat-thread-sequence-item--chat-message-container-message a, .chat-thread-sequence-item--chat-message-container-message p, .chat-thread-sequence-item--chat-message-container-message div {
    margin: 0;
    /* These are technically the same, but use both */
    overflow-wrap: break-word;
    word-wrap: break-word;
    -ms-word-break: break-all;
    /* This is the dangerous one in WebKit, as it breaks things wherever */
    word-break: break-all;
    /* Instead use this non-standard one: */
    word-break: break-word;
    /* Adds a hyphen where the word breaks, if supported (No Blink) */
    -ms-hyphens: auto;
    -webkit-hyphens: auto;
    hyphens: auto; }

.chat-thread-sequence-item--chat-message-container-time {
  display: inline-block;
  width: 100%; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The direct-message-chat-thread component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		direct-message-chat-thread

	*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The trip-chat-thread component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		trip-chat-thread

	*/
trip-chat-thread {
  display: block; }

.trip-chat-thread--trip-link {
  background-color: #ffffff;
  width: 100%;
  border-bottom: 1px inset #bbbbbb;
  padding-left: 16px;
  height: 56px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  -ms-flex-align: center;
      align-items: center;
  cursor: pointer;
  transition: background-color 0.3s ease; }
  .trip-chat-thread--trip-link:hover {
    background-color: #ececec; }

.trip-chat-thread--trip-link-labels {
  -ms-flex: 0 1 80%;
      flex: 0 1 80%;
  margin-right: auto; }

.trip-chat-thread--trip-link-thread-btn {
  -ms-flex: 0 0 auto;
      flex: 0 0 auto;
  margin-left: auto;
  color: rgba(0, 0, 0, 0.38); }

.trip-chat-thread--chat-thread {
  height: calc(100% - 56px); }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*

    This is NOT used in Desktop.scss. Look in core/paper-card for that.

*/
/*

    This is NOT used in Desktop.scss. Look in core/paper-card for that.

*/
/*
    Hide any elements directly inside the parent element, after a given delay
*/
@keyframes sliding-tab-animation {
  0% {
    opacity: 1; }
  50% {
    opacity: 1; }
  100% {
    opacity: 0; } }

/**
    This should be applied to a container which contains multiple elements as direct children, which
    should all include the sliding-tab mixin.
*/
@keyframes search-results-card-tab-content-hide {
  0% {
    opacity: 1; }
  50% {
    opacity: 1; }
  100% {
    opacity: 0; } }

.SearchResultsCard {
  width: 100%;
  background-color: #fff;
  border: 1px solid #bdbdbd;
  border-radius: 2px;
  /*
            The nested results wrapper, and the nested results, 
            act as tabbed containers.

            SearchResultsCard-nestedResults contains a div
            containing the actual results, but is really a 
            tab pane.

            When refactoring, -nestedResultsWrapper and
            -nestedResults should be able to be replaced by 
            a tab component without consequence.
        */ }
  .SearchResultsCard:before, .SearchResultsCard:after {
    content: " ";
    display: table; }
  .SearchResultsCard:after {
    clear: both; }
  .SearchResultsCard-nestedResultsWrapper {
    display: block;
    min-height: 0;
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    overflow: visible; }
  .SearchResultsCard-nestedResults {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    transform: translateX(0);
    transition: transform 0.5s cubic-bezier(0.35, 0, 0.25, 1);
    /**
                  This is intended to prevent an awkward slide transition from occuring, when the card is initially 
                  placed on the page, and before Javascript can change the classes.
              */ }
    .SearchResultsCard-nestedResults--initiallyHide:not(.is-hiddenLeft), .SearchResultsCard-nestedResults--initiallyHide:not(.is-hiddenRight), .SearchResultsCard-nestedResults--initiallyHide:not(.is-currentCard) {
      display: none; }
    .SearchResultsCard-nestedResults--initiallyHide.is-hiddenLeft, .SearchResultsCard-nestedResults--initiallyHide.is-hiddenRight, .SearchResultsCard-nestedResults--initiallyHide.is-currentCard {
      display: block !important; }
    .SearchResultsCard-nestedResults.is-hiddenLeft {
      transform: translateX(-100%);
      animation: 1s search-results-card-tab-content-hide;
      opacity: 0; }
      .SearchResultsCard-nestedResults.is-hiddenLeft > * {
        transition: visibility 0s linear;
        transition-delay: 0.5s;
        visibility: hidden; }
    .SearchResultsCard-nestedResults.is-hiddenRight {
      transform: translateX(100%);
      animation: 1s search-results-card-tab-content-hide;
      opacity: 0; }
      .SearchResultsCard-nestedResults.is-hiddenRight > * {
        transition: visibility 0s linear;
        transition-delay: 0.5s;
        visibility: hidden; }
    .SearchResultsCard-nestedResults.is-currentCard {
      position: relative; }
  .SearchResultsCard-refinementHeading {
    line-height: 36px; }
  .SearchResultsCard.SearchResultsCard--withNestedResults {
    overflow: hidden; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        The purpose of this class is mainly for semantics on the page.
        It simply denotes a section of the page (usually a ui-view) which
        should be overlaid on the existing context.

        An OverlaySection is not like a lightbox (ie it is not appropriate
        to use for a modal)
        
        The positioning and dimensions of the OverlaySection should be specified
        by the components or pages which contain OverlaySections.

        Eg:

        <div class="Component">
            <div class="Component-overlay OverlaySection">
                ...content
            </div>
        </div>

        // Styles

        .Component-overlay
        {
            // width, height, left, top.
        }

        .Component-overlay.Component-overlay--withModifier
        {
            // modified width, height, etc.
        }
    */
.OverlaySection {
  position: absolute;
  z-index: 204; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.search-results-heading--admin-fields {
  float: left;
  border-top: 1px solid #232323;
  margin-top: 8px; }

.search-results-heading--admin-fields-inputs > label {
  margin-bottom: 0 !important;
  margin-right: 8px !important; }
  .search-results-heading--admin-fields-inputs > label > span {
    margin-top: 4px;
    font-weight: normal;
    display: inline-block; }

.FCOPage {
  position: absolute;
  left: 16px;
  top: 16px;
  z-index: 100;
  /* This wrapper goes around the search box and the search results.
            This allows relative positioning to be used.
        */ }
  .FCOPage-backToTripPlannerBtn {
    width: 48px;
    height: 48px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center; }
    .FCOPage-backToTripPlannerBtn:hover, .FCOPage-backToTripPlannerBtn:focus {
      background-color: #eee; }
  .FCOPage-modeNavContainer {
    background-color: #fff;
    border: 1px solid #bdbdbd;
    box-shadow: 4px 4px 6px 0px rgba(0, 0, 0, 0.2);
    position: absolute;
    width: 48px;
    left: -96px;
    top: 16px;
    transition: left 0.2s ease-in-out;
    border: 0;
    display: none; }
    .FCOPage-modeNavContainer.is-open {
      left: -8px;
      display: block; }
  .FCOPage-searchBox {
    margin-top: 16px; }
  .FCOPage-searchWrapper {
    position: absolute;
    left: 50px;
    width: 440px; }
  .FCOPage-searchResultsContainer, .FCOPage-promptContainer {
    position: relative;
    margin-bottom: 48px;
    width: 440px;
    margin-top: 16px; }
  .FCOPage-promptContainer .paper-card {
    padding: 8px 16px;
    border: 0; }
  .FCOPage-promptContainer .up_arrow {
    font-size: 20px; }
  .FCOPage-rangeFlyout {
    position: absolute;
    left: 489px;
    top: 16px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        The FCOSearchBox is used primarily for the main Desktop FCO page.

        Other versions of this component may be developed in the future, but all 
        must provide documentation on the reasons for why they are developed,
        and what pages of the application they reside in.
    */
.FCOSearchBox {
  background-color: #fff;
  border: 1px solid #bdbdbd;
  box-shadow: 4px 4px 6px 0px rgba(0, 0, 0, 0.2);
  border: 0;
  /**
            The heading for the search box, containing the text for the current mode,
            and additional buttons
        */
  /**
            The container which holds the two preset settings (the Trip Profile
            dropdown, and the Recurring Trip dropdown.
        */
  /**
            The dropdowns that go inside presetContainer are each a presetDropdown.

            Until Flexbox is usable, we must use modifier classes to achieve proper
            width.
        */
  /**
            The container which holds the address selections - It contains the
            addresses, as well as the swap addresses button.
        */
  /**
            This should be the actual route-addresses directive
        */
  /**
            The swap addresses button.

            If a directive is ever developed that has the swap button built in,
            that should be used instead.
        */
  /**
            Contains other settings about the search.
            In the normal use case, this contians the 
            schedule preview, and the buttons/dropdown to save as
            a new trip, or update the current trip.
        */
  /**
            Contains the split button for Save/Update.
        */
  /**
            The dropdown to save or update the Trip Profile which is currently loaded.
        */
  /**
            This is used to position the FAB ONLY.

            Any modification of the color, size,
            shadow, etc. of the FAB should be done
            by using modifier classes on the FAB itself.
        */ }
  .FCOSearchBox--heading {
    height: 48px;
    padding: 16px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center; }
  .FCOSearchBox--btn-container {
    position: absolute;
    right: 0;
    display: -ms-flexbox;
    display: flex; }
    .FCOSearchBox--btn-container button {
      width: 48px;
      height: 48px; }
      .FCOSearchBox--btn-container button ._sliders {
        font-size: 18px; }
      .FCOSearchBox--btn-container button:hover, .FCOSearchBox--btn-container button:focus {
        background-color: #eee; }
  .FCOSearchBox-presetContainer {
    height: 26px;
    border: 1px solid #dfdfdf;
    padding: 0 24px 0 24px;
    border-right: none;
    border-left: none; }
    .FCOSearchBox-presetContainer.FCOSearchBox-presetContainer--twoDropdowns .FCOSearchBox-presetDropdown {
      width: 50%;
      /*width: calc(50% - 16px);*/ }
      .FCOSearchBox-presetContainer.FCOSearchBox-presetContainer--twoDropdowns .FCOSearchBox-presetDropdown:first-of-type {
        border-right: 1px solid #dfdfdf;
        margin-right: 16px; }
      .FCOSearchBox-presetContainer.FCOSearchBox-presetContainer--twoDropdowns .FCOSearchBox-presetDropdown:last-of-type {
        width: calc(50% - 32px); }
  .FCOSearchBox-presetDropdown {
    width: 100%;
    height: 100%;
    float: left;
    /**
                This needs to be done becuase of how things are set up right now,
                 but it isn't the SUIT way. This should really be discouraged.

                It's required becaues of how the paper-dropdown directive
                uses buttons.
            */ }
    .FCOSearchBox-presetDropdown .Dropdown-title > button {
      width: 100%;
      height: 100%; }
      .FCOSearchBox-presetDropdown .Dropdown-title > button:before, .FCOSearchBox-presetDropdown .Dropdown-title > button:after {
        content: " ";
        display: table; }
      .FCOSearchBox-presetDropdown .Dropdown-title > button:after {
        clear: both; }
  .FCOSearchBox-addressesContainer {
    width: 100%;
    padding: 16px;
    background-color: #fff; }
    .FCOSearchBox-addressesContainer:before, .FCOSearchBox-addressesContainer:after {
      content: " ";
      display: table; }
    .FCOSearchBox-addressesContainer:after {
      clear: both; }
  .FCOSearchBox-addresses {
    width: calc(100% - 48px);
    float: left; }
    .FCOSearchBox-addresses .address-picker--ptb {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-align: center;
          align-items: center;
      padding-right: 0 !important; }
      .FCOSearchBox-addresses .address-picker--ptb .address-picker--address-input {
        margin-left: 32px;
        padding: 4px 8px !important;
        background-color: #eeeeee !important; }
      .FCOSearchBox-addresses .address-picker--ptb.is-active {
        display: initial !important;
        padding-left: 0 !important; }
        .FCOSearchBox-addresses .address-picker--ptb.is-active .address-picker--address-input {
          background-color: transparent !important;
          margin-bottom: 0 !important;
          padding-top: 0 !important; }
      .FCOSearchBox-addresses .address-picker--ptb .rs-ptb-list {
        border-top: 2px solid #03a9f4; }
  .FCOSearchBox-swapBtn {
    width: 40px;
    float: right;
    color: #bcbcbc !important; }
    .FCOSearchBox-swapBtn:hover {
      color: #03a9f4 !important;
      background-color: transparent !important; }
  .FCOSearchBox-settingsContainer {
    min-height: 48px;
    border-top: 1px solid #dfdfdf;
    padding: 8px 16px; }
  .FCOSearchBox-saveOrUpdateDropdownContainer {
    float: right;
    margin-right: 48px; }
  .FCOSearchBox-fab {
    position: absolute;
    bottom: 24px;
    right: 8px;
    z-index: 4 !important; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.Dropdown {
  position: relative;
  /*
            This is the visible part of the dropdown.
            Maps to a paper-dropdown-title element.

            The inner layout in HTML of this sub-component should be
            in the following order:

            Dropdown-title
                Dropdown-titleIcon (optional)
                Dropdown-secondaryTitleIcon (optional)
                Dropdown-titleText

        */
  /**
            The primary icon, which may or may not be a button.

            Is positioned on the left.
        */
  /*
            In the source code, this MUST immediately preceed the titleIcon.

            This enables the next sibling selector to effect the 
        */
  /*
            The content of the dropdown
        */
  /*
            The list of options.

            This goes inside content.
        */
  /**
            Goes on the <li> elements inside &-list.

            Each should contain a &-listItemText element,
            and optionally a &-listItemBtn. 
            &-listItemBtn should always come before &-listItemText
            in the source code.
        */
  /**
            This is one option in the list 
        */
  /**
            This is an item in the list which does not need to be scrolled to.
        */
  /* 
            This is used to make the dropdown vertically thin and remove white space. 
            It affects both the title and the content.

            This is used on the FCO Search Box.
        */
  /**
            Converts the dropdown to just use an icon for the title.
        */
  /**
            Specifies what should occur if both the iconTitle and flatButton modifiers are used on the same
            component
        */
  /**
            This is used in the FCO Search Box to style the dropdown for the presets.
        */ }
  .Dropdown-title {
    float: left;
    width: 100%;
    padding: 0; }
    .Dropdown-title:before, .Dropdown-title:after {
      content: " ";
      display: table; }
    .Dropdown-title:after {
      clear: both; }
  .Dropdown-titleIcon {
    float: left;
    margin-right: 8px; }
  .Dropdown-titleSecondaryIcon {
    position: absolute;
    right: 8px;
    top: 0; }
  .Dropdown-titleText {
    float: left;
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 12px;
    line-height: 16px;
    width: 100%;
    text-align: left; }
  .Dropdown-list {
    position: relative;
    overflow-y: auto;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    /* Set width */
    /* Track */
    /* Handle */
    max-height: 300px;
    display: block;
    margin-bottom: 0; }
    .Dropdown-list::-webkit-scrollbar {
      width: 8px; }
    .Dropdown-list::-webkit-scrollbar-track {
      display: none; }
    .Dropdown-list::-webkit-scrollbar-thumb {
      border-radius: 10px;
      background-color: rgba(200, 200, 200, 0.8);
      box-shadow: inset 0 0 6px rgba(200, 200, 200, 0.8); }
    .Dropdown-list::-webkit-scrollbar-thumb:window-inactive {
      background: rgba(201, 201, 201, 0.8); }
  .Dropdown-listItem {
    list-style: none;
    position: relative;
    min-height: 32px;
    padding: 8px 16px;
    cursor: pointer;
    display: block;
    /**
                See below for the Dropdown-listItemBtn default state.

                Hoevering on the list item, causes the button to be visible.
            */ }
    .Dropdown-listItem:hover {
      background-color: #F1F1F1; }
    .Dropdown-listItem:hover .Dropdown-listItemBtn.Dropdown-listItemBtn--showOnHover, .Dropdown-listItem:focus .Dropdown-listItemBtn.Dropdown-listItemBtn--showOnHover {
      opacity: 1;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-align: center;
          align-items: center;
      background-color: transparent; }
  .Dropdown-listItemText {
    width: 100%;
    display: inline-block;
    float: left;
    white-space: nowrap;
    text-overflow: ellipsis;
    position: relative;
    top: -4px; }
  .Dropdown-listItemIcon {
    float: left;
    display: inline;
    margin-right: 16px; }
  .Dropdown-listItemBtn {
    width: 16px;
    height: 16px;
    position: absolute;
    right: 16px;
    top: 16px;
    overflow: visible; }
    .Dropdown-listItemBtn + .Dropdown-listItemText {
      width: calc(100% - 24px);
      padding-right: 24px; }
    .Dropdown-listItemBtn.Dropdown-listItemBtn--showOnHover {
      opacity: 0;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-align: center;
          align-items: center;
      transition: opacity 0.15s ease-in-out; }
    .Dropdown-listItemBtn:hover.Dropdown-listItemBtn--showOnHover, .Dropdown-listItemBtn:focus.Dropdown-listItemBtn--showOnHover {
      opacity: 1;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-align: center;
          align-items: center;
      background-color: transparent !important; }
    .Dropdown-listItemBtn > .rs-icon {
      margin: 0;
      position: absolute; }
  .Dropdown-pinnedItem {
    width: 100%; }
  .Dropdown.Dropdown--thin .Dropdown-title {
    padding-top: 4px;
    padding-bottom: 4px; }
  .Dropdown.Dropdown--thin .Dropdown-titleIcon {
    width: 16px;
    height: 16px; }
    .Dropdown.Dropdown--thin .Dropdown-titleIcon .rs-icon {
      font-size: 16px; }
    .Dropdown.Dropdown--thin .Dropdown-titleIcon + .Dropdown-titleText {
      width: calc(100% - 24px); }
    .Dropdown.Dropdown--thin .Dropdown-titleIcon + .Dropdown-titleSecondaryIcon + .Dropdown-titleText {
      width: calc(100% - 48px); }
  .Dropdown.Dropdown--thin .Dropdown-titleSecondaryIcon {
    top: 4px;
    width: 16px;
    height: 16px; }
    .Dropdown.Dropdown--thin .Dropdown-titleSecondaryIcon:focus {
      outline: -webkit-focus-ring-color auto 5px; }
    .Dropdown.Dropdown--thin .Dropdown-titleSecondaryIcon .rs-icon {
      font-size: 16px; }
  .Dropdown.Dropdown--thin .Dropdown-listItem {
    min-height: 32px;
    padding: 8px 16px; }
  .Dropdown.Dropdown--thin .Dropdown-listItemBtn {
    top: 8px; }
  .Dropdown.Dropdown--thin .Dropdown-list + .Dropdown-pinnedItem {
    margin-top: 8px; }
  .Dropdown.Dropdown--thin .Dropdown-pinnedItem {
    height: 32px;
    font-size: 12px;
    line-height: 16px; }
    .Dropdown.Dropdown--thin .Dropdown-pinnedItem .rs-icon {
      position: relative;
      top: 1px;
      width: 16px;
      height: 16px;
      font-size: 16px;
      margin-right: 8px; }
  .Dropdown.Dropdown--minContentWidth .Dropdown-content {
    min-width: 200px; }
  .Dropdown.Dropdown--flatButton .Dropdown-title {
    height: 32px;
    padding: 8px 16px; }
    .Dropdown.Dropdown--flatButton .Dropdown-title:hover, .Dropdown.Dropdown--flatButton .Dropdown-title:focus {
      background-color: #f1f1f1; }
  .Dropdown.Dropdown--flatButton .Dropdown-titleIcon {
    margin-right: 16px;
    width: 16px;
    height: 16px; }
  .Dropdown.Dropdown--flatButton .Dropdown-titleText {
    text-transform: uppercase;
    width: auto; }
  .Dropdown.Dropdown--flatButton .Dropdown-listItem {
    color: #898989; }
    .Dropdown.Dropdown--flatButton .Dropdown-listItem:hover {
      color: #03a9f4;
      background-color: #F2F2F2; }
  .Dropdown.Dropdown--flatButton .Dropdown-listItemIcon {
    width: 16px;
    height: 16px; }
    .Dropdown.Dropdown--flatButton .Dropdown-listItemIcon .rs-icon {
      font-size: 16px; }
  .Dropdown.Dropdown--flatButton .Dropdown-listItemText {
    text-transform: uppercase;
    margin-right: 24px; }
  .Dropdown.Dropdown--iconTitle .Dropdown-titleIcon {
    margin-right: 0; }
  .Dropdown.Dropdown--iconTitle .Dropdown-title {
    padding: 8px 4px; }
  .Dropdown.Dropdown--noPaddingLeft .Dropdown-title {
    padding-left: 0 !important; }
  .Dropdown.Dropdown--iconTitle.Dropdown--flatButton .Dropdown-title {
    padding: 8px; }
  .Dropdown.Dropdown--lightGrey .Dropdown-title {
    color: #757575;
    display: -ms-flexbox;
    display: flex; }
  .Dropdown.Dropdown--lightGrey .Dropdown-pinnedItem {
    border-top: 1px solid #DEDEDE; }
  .Dropdown.Dropdown--hoverBrandPrimary .Dropdown-title:hover {
    color: #03a9f4; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.FCORangeFlyout {
  background-color: #fff;
  border: 1px solid #bdbdbd;
  box-shadow: 4px 4px 6px 0px rgba(0, 0, 0, 0.2);
  min-width: 288px;
  min-height: 244px;
  /**
            The heading (contains heading text, close button)
        */
  /**
            The heading text (title of the slide)

            The !important rules are required to overcome the styling put on elements.
        */
  /**
        This container holds the 'Use Filters' checkbox, and its label.
        */
  /**
            There are two of these, one per slider
        */
  /**
            Again, there are two of these.
        */ }
  .FCORangeFlyout-heading {
    padding: 16px;
    height: 48px; }
  .FCORangeFlyout-headingText {
    font-family: 'Roboto', Arial, sans-serif !important;
    font-size: 16px !important;
    line-height: 20px !important;
    margin: 0 !important;
    color: #464646 !important;
    float: left; }
  .FCORangeFlyout-body {
    width: 100%;
    padding: 16px; }
  .FCORangeFlyout-closeBtn {
    float: right;
    color: #bcbcbc; }
    .FCORangeFlyout-closeBtn .rs-icon {
      width: 16px;
      height: 16px;
      font-size: 16px; }
  .FCORangeFlyout-enableCheckboxContainer {
    padding-bottom: 16px; }
  .FCORangeFlyout-enableCheckbox {
    margin-top: -7px !important;
    margin-left: -7px !important; }
  .FCORangeFlyout-sliderLabel {
    margin-top: 8px;
    height: 16px; }
  .FCORangeFlyout-sliderLabelText {
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 12px;
    line-height: 16px;
    font-weight: normal !important;
    margin-bottom: 0 !important; }
    .FCORangeFlyout-sliderLabelText .rs-icon {
      width: 16px;
      height: 16px;
      font-size: 16px;
      margin-right: 8px; }
  .FCORangeFlyout-sliderUnitText {
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 12px;
    line-height: 16px;
    font-weight: bold; }
  .FCORangeFlyout-sliderContainer {
    margin-bottom: 16px; }
    .FCORangeFlyout-sliderContainer:last-child {
      margin-bottom: 8px; }
    .FCORangeFlyout-sliderContainer > md-slider-container {
      width: 100%; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        This is broken up between two HTML files in the vbhtml, but when
        viewed on the DOM, this is one element.

        The main 'component' class goes on the ui-view which should contain the FCO Search Results.

        All the other components of that page are outlined here.
    */
.FCOSearchResultsContainer-expandedResultOverlay {
  left: 56px;
  top: -20px;
  box-shadow: 8px 8px 16px -4px rgba(0, 0, 0, 0.3);
  transition: top 0.5s cubic-bezier(0.15, 0.68, 0.49, 0.93); }

.user-identity-summary--text {
  white-space: normal !important; }

@media only screen and (max-height: 1000px) {
  .FCOSearchResultsContainer-expandedResultOverlay {
    top: -60px; }
    .FCOSearchResultsContainer-expandedResultOverlay._higher-offset {
      top: -60px; } }

@media only screen and (max-height: 900px) {
  .FCOSearchResultsContainer-expandedResultOverlay {
    top: -160px; }
    .FCOSearchResultsContainer-expandedResultOverlay._higher-offset {
      top: -160px; } }

@media only screen and (max-height: 830px) {
  .FCOSearchResultsContainer-expandedResultOverlay {
    top: -170px; }
    .FCOSearchResultsContainer-expandedResultOverlay._higher-offset {
      top: -170px; } }

@media only screen and (max-height: 800px) {
  .FCOSearchResultsContainer-expandedResultOverlay {
    top: -200px; }
    .FCOSearchResultsContainer-expandedResultOverlay._higher-offset {
      top: -200px; } }

@media only screen and (max-height: 760px) {
  .FCOSearchResultsContainer-expandedResultOverlay {
    top: -210px; }
    .FCOSearchResultsContainer-expandedResultOverlay._higher-offset {
      top: -210px; } }

@media only screen and (max-height: 720px) {
  .FCOSearchResultsContainer-expandedResultOverlay {
    top: -225px; }
    .FCOSearchResultsContainer-expandedResultOverlay._higher-offset {
      top: -225px; } }

@media only screen and (max-height: 690px) {
  .FCOSearchResultsContainer-expandedResultOverlay {
    top: -260px; }
    .FCOSearchResultsContainer-expandedResultOverlay._higher-offset {
      top: -260px; } }

@media only screen and (max-height: 660px) {
  .FCOSearchResultsContainer-expandedResultOverlay {
    top: -290px; }
    .FCOSearchResultsContainer-expandedResultOverlay._higher-offset {
      top: -290px; } }

@media only screen and (max-height: 630px) {
  .FCOSearchResultsContainer-expandedResultOverlay {
    top: -300px; }
    .FCOSearchResultsContainer-expandedResultOverlay._higher-offset {
      top: -300px; } }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.SearchResultsList-loadingIndicator {
  width: 100%;
  min-height: 48px;
  padding: 16px;
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 16px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
        The map pin is displayed on the map, as well as in lists and modals 
        where this piece of the UI is repeated.

        For example, in FCO it is used in both the map for each origin and destination,
        and inside each SearchResult component.


        MapPins are designed to have dynamic sizes and colors, and support the following 
        Javascript states:

            is-dot - Converts the MapPin to a small dot
            is-md - Medium size
            is-lg - Large size
            is-filled - The background is the same as the border color
            is-hidden - The pin is completely hidden (it shrinks down and dissapears)


        Markup:

        <MapPin>
            <MapPin-pinhead>
                <MapPin-pinheadData/> OR 
                <MapPin-pinheadImage/>
            </MapPin-pinhead>
            <MapPin-point/>
        </MapPin>
    */
.MapPin {
  position: relative;
  background-color: transparent;
  width: 24px;
  height: 36px;
  transition: transform 0.16s 0.05s ease-in-out, color 0.08s 0.05s ease-in-out, background-color 0.16s 0.05s ease-in-out, border-color 0.16s 0.05s ease-in-out;
  /*
            The pinhead is the circle at the top of the pin, where information or images
            are displayed
        */
  /*
            The pinhead image is must always be an <img> element, and it must always be 
            a child of the MapPin-pinhead.
        */
  /**
            The pinhead data must always be inside the MapPin-pinhead.
            Numbers, letters, or other small pieces of information may be put as the
            content of this element.
        */
  /*
            The point is the part of the pin which sticks into the map or surface.
            It's the bottom 'tail'.
        */
  /**
            If the color of the pin should fill the entire pin, this
            modifier should be added
        */ }
  .MapPin-pinhead {
    position: absolute;
    top: 0;
    left: 0;
    width: 24px;
    height: 24px;
    border: 2px solid green;
    background-color: white;
    border-radius: 24px;
    text-align: center;
    overflow: hidden;
    z-index: 1;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    transition: transform 0.16s 0.05s ease-in-out, color 0.08s 0.05s ease-in-out, background-color 0.16s 0.05s ease-in-out, border-color 0.16s 0.05s ease-in-out; }
  .MapPin-pinheadImage {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    transition: opacity 0.16s 0.05s ease-in-out; }
  .MapPin-pinheadData {
    opacity: 1;
    transition: opacity 0.08s 0s ease-in-out; }
  .MapPin-point {
    position: absolute;
    opacity: 1;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    top: 8px;
    left: 4px;
    width: 0;
    height: 0;
    border: 12px solid transparent;
    border-width: 28px 8px 0 8px;
    border-top-color: green;
    z-index: 0;
    transition: transform 0.16s 0.025s ease-in, opacity 0.08s 0.05s ease-in; }
    .MapPin-point.is-hidden, .MapPin-point.is-dot {
      transition: transform 0.08s 0s ease-in, opacity 0.08s 0s ease-in; }
  .MapPin.is-md .MapPin-pinhead {
    border-width: 2px; }
  .MapPin.is-lg .MapPin-pinhead {
    transform: scale(1.5) translateY(-8px); }
  .MapPin.is-dot .MapPin-pinhead, .MapPin.is-hidden .MapPin-pinhead {
    color: green;
    background-color: green; }
  .MapPin.is-dot .MapPin-pinhead, .MapPin.is-hidden .MapPin-pinhead {
    transform: translate(0, 21.6px) scale(0.4); }
  .MapPin.is-dot .MapPin-pinheadData, .MapPin.is-dot .MapPin-pinheadImage, .MapPin.is-hidden .MapPin-pinheadData, .MapPin.is-hidden .MapPin-pinheadImage {
    opacity: 0; }
  .MapPin.is-dot .MapPin-pinhead img {
    display: none; }
  .MapPin.is-dot .MapPin-point {
    transform: scale(0, 0); }
  .MapPin.is-hidden {
    transform: translate(0, 16.8px) scale(0); }
    .MapPin.is-hidden .MapPin-point {
      transform: scale(0, 0); }
  .MapPin--orig .MapPin-pinhead {
    border-color: #1e64a6; }
  .MapPin--orig .MapPin-point {
    border-top-color: #1e64a6; }
  .MapPin--orig.is-dot .MapPin-pinhead, .MapPin--orig.is-hidden .MapPin-pinhead {
    color: #1e64a6;
    background-color: #1e64a6; }
  .MapPin--dest .MapPin-pinhead {
    border-color: #b22024; }
  .MapPin--dest .MapPin-point {
    border-top-color: #b22024; }
  .MapPin--dest.is-dot .MapPin-pinhead, .MapPin--dest.is-hidden .MapPin-pinhead {
    color: #b22024;
    background-color: #b22024; }
  .MapPin--fillBackground.MapPin--orig .MapPin-pinhead {
    color: #fff;
    background-color: #1e64a6; }
  .MapPin--fillBackground.MapPin--dest .MapPin-pinhead {
    color: #fff;
    background-color: #b22024; }
  .MapPin--searchResultIcon.MapPin {
    height: 27px;
    width: 20px;
    position: absolute; }
  .MapPin--searchResultIcon .MapPin-pinhead {
    color: #1e64a6;
    background-color: #fff;
    border: 1px solid #1e64a6;
    border-radius: 20px;
    width: 20px;
    height: 20px; }
  .MapPin--searchResultIcon .MapPin-pinheadData {
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 12px;
    font-weight: 500; }
  .MapPin--searchResultIcon .MapPin-point {
    border-top-color: #1e64a6;
    top: 12px;
    left: 3px;
    border-width: 16px 7px 0 7px; }

/*
        SearchResult represents each individual item in the core.fco.SearchResultsList component.

        It is always an <li>. Different versions of the component will have different styles applied.

        This component is written first using floats.
        
        It is possible that in the future, flexbox may be more performant than floats. At this time however, 
        FireFox has a slow flexbox implementation.

        Javascript states:
            
            is-expanded - The result is currently expanded in another part of the UI
            is-hovered - The result is currently hovered
            is-showingAdmin - The result is showing Admin information
            

        Markup:
        <SearchResult>
            <SearchResult-avatar>
                <SearchResult-avatarImage/>
                <SearchResult-mapPin (MapPin Component)>
            </SearchResult-avatar>
            <SearchResult-listing>
                <SearchResult-primaryListingContainer>
                    <SearchResult-listingHeader/>
                    <SearchResult-primaryIconsSet/>
                </SearchResult-primaryListingContainer>
                <SearchResult-secondaryListingContainer>
                    <SearchResult-secondaryIconSet />
                    <SearchResult-scheduleSummaryContainer/> OR <SearchResult-nextTripContainer/>
                </SearchResult-secondaryListingContainer>
            </SearchResult-listing>
            <SearchResult-primaryActionButton>
                <SearchResult-sendEmailButton/> OR <PaperButton/>
            </SearchResult-primaryActionButton>
            <SearchResult-adminSection/>
        </SearchResult>

    */
.SearchResult {
  list-style: none;
  width: 100%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  min-height: 68px;
  margin: 0;
  padding: 0;
  transition: background-color 0.06s ease-in-out;
  border: none;
  cursor: pointer;
  border-top: 1px solid #ddd;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  /*
            This is usually an <img>. 
        */
  /*
            This is always a MapPin component.
        */
  /**
            The listing contains two containers inside of it, primaryListingContainer and secondaryListingContainer.
            The primary one is for content that is on the top row, the secondary is for content that is on the bottom
            row. 

            Other modifiers to the SearchResult component may change the arrangement of primary and Secondary conatiner,
            and may choose to include other types of content.
        */
  /**
            All of the 'Secondary' icons, schedule summaries, etc. are relegated to the 
            second row of the SearchResult-listing (they are children of -secondaryListingContainer)
        */
  /**
            Both of these elements are in the secondaryListingContainer for the element.
        */
  /**
            The Primary Action Button is the 'send email', 'join vanpool' button.
        */
  /**
            The admin section for the plugin.
        */ }
  .SearchResult-avatar {
    position: relative;
    float: left;
    width: 66px;
    -ms-flex-preferred-size: 66px;
        flex-basis: 66px; }
  .SearchResult-avatarImage {
    float: left;
    margin-left: 9px;
    margin-top: 6px;
    border-radius: 50px;
    width: 50px;
    height: 50px; }
  .SearchResult-mapPin {
    top: 28px;
    left: 3px;
    transform: none; }
  .SearchResult-listing {
    float: left;
    width: 274px;
    -ms-flex-positive: 1;
        flex-grow: 1;
    padding-right: 8px; }
  .SearchResult-primaryListingContainer, .SearchResult-secondaryListingContainer {
    float: left;
    clear: left;
    width: 100%;
    height: 34px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    -ms-flex-align: center;
        align-items: center;
    padding: 4px 0; }
  .SearchResult-listingHeader {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    background-color: transparent;
    -webkit-border-fit: border !important;
    padding: 0;
    float: left; }
    .SearchResult-listingHeader:focus {
      outline: none; }
    .SearchResult-listingHeader::-moz-focus-inner {
      border: none;
      /* overrides extra padding in Firefox */ }
  .SearchResult-primaryIconSet {
    float: right;
    margin-left: auto; }
  .SearchResult-secondaryIconSet {
    float: left; }
  .SearchResult-scheduleSummaryContainer {
    float: right;
    margin-left: auto; }
  .SearchResult-nextTripContainer {
    float: right;
    margin-left: auto; }
  .SearchResult:hover, .SearchResult.is-hovered, .SearchResult.is-expanded {
    background-color: #e6e6e6; }
  .SearchResult-primaryActionButton {
    float: right;
    -ms-flex-item-align: end;
        align-self: flex-end;
    height: 100%;
    width: 80px;
    -ms-flex-preferred-size: 80px;
        flex-basis: 80px;
    margin-left: auto;
    border-left: 1px solid #f0f0f0;
    background-color: transparent;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none;
    background-color: transparent;
    -webkit-border-fit: border !important;
    padding: 0; }
    .SearchResult-primaryActionButton:focus {
      outline: none; }
    .SearchResult-primaryActionButton::-moz-focus-inner {
      border: none;
      /* overrides extra padding in Firefox */ }
    .SearchResult-primaryActionButton:hover, .SearchResult-primaryActionButton:focus {
      box-shadow: 0 0 12px 1px rgba(0, 0, 0, 0.3); }
      .SearchResult-primaryActionButton:hover .SearchResult-sendEmailButton, .SearchResult-primaryActionButton:focus .SearchResult-sendEmailButton {
        background-color: #60ccfd;
        background-image: url("/Images/SPA/envelope_bg-white.png");
        color: rgba(255, 255, 255, 0.9); }
  .SearchResult-sendEmailButton {
    width: 100%;
    margin: auto;
    height: 68px;
    background: no-repeat 0 0 url("/Images/SPA/envelope_bg.png");
    background-color: #03a9f4;
    text-transform: uppercase;
    color: #03a9f4;
    font-size: 12px;
    padding: 24px 0;
    box-shadow: none;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-line-pack: center;
        align-content: center;
    -ms-flex-pack: center;
        justify-content: center; }
    .SearchResult-sendEmailButton:hover {
      background-color: #60ccfd;
      background-image: url("/Images/SPA/envelope_bg-white.png");
      color: rgba(255, 255, 255, 0.9); }
    .SearchResult-sendEmailButton:active {
      background-color: #0286c2;
      background-image: url("/Images/SPA/envelope_bg-white.png");
      color: #fff; }
  .SearchResult-adminSection {
    float: left;
    clear: left; }

/*
        The search result AdminSection always is a child of the SearchResult, 
        but important enough that it deserves it's own component styles.

        This is what is presented to Administrators when they are using the site on
        behalf of a user.
    */
.SearchResultAdminSection {
  width: 100%;
  padding-bottom: 16px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  /**
            The individual data in the component
        */ }
  .SearchResultAdminSection-dataPoint {
    float: left;
    width: 100%;
    -ms-flex-preferred-size: 100%;
        flex-basis: 100%; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
        This is the modal which shows for each incentive which is highlighted.

        DetailModal
                                    -newUsersImgContainer (positioned absolutely)
                                        -newUsersImg
                                        -newUsersText
            -heading
                -headingText
                -headingInventoryText
                -headingCloseBtn
            -body
                -tabset
                    -tabBody DetailModalItemTab
                    -tabBody DetailModalEarnTab
                    -tabBody DetailModalDetailsTab
                    -tabBody DetailModalReadMoreTab

            -userActionsBar                
                -iconActionButton
                -iconActionButton --wishlist
                -entryWidget (IncentiveEntryWidget)

    */
.DetailModal {
  width: 704px;
  height: auto;
  max-height: 500px;
  background-color: #fff;
  border: 1px solid #bdbdbd;
  border-radius: 2px;
  transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1); }
  .DetailModal-heading {
    padding: 12px 16px 0;
    min-height: 40px;
    font-size: 20px; }
  .DetailModal-headingCloseBtn {
    top: 16px !important; }
  .DetailModal-body {
    padding: 16px 0; }
  .DetailModal-tabset .nav-tabs {
    border-bottom: 1px solid #ddd; }
    .DetailModal-tabset .nav-tabs .active {
      background-color: #eeeeee; }
  .DetailModal-tabBody {
    max-height: 320px;
    padding: 16px;
    display: block; }
    .DetailModal-tabBody:before, .DetailModal-tabBody:after {
      content: " ";
      display: table; }
    .DetailModal-tabBody:after {
      clear: both; }
  .DetailModal-userActionsBar {
    height: 68px;
    padding: 16px;
    border-top: solid 1px #bcbcbc; }
    .DetailModal-userActionsBar:before, .DetailModal-userActionsBar:after {
      content: " ";
      display: table; }
    .DetailModal-userActionsBar:after {
      clear: both; }
  .DetailModal-iconActionButton {
    font-size: 16px;
    color: #898989;
    padding: 12px;
    display: inline-block; }
    .DetailModal-iconActionButton.DetailModal-iconActionButton--wishlist.is-onWishlist {
      color: #E70A9D; }
  .DetailModal-entryWidget {
    float: right; }
    .DetailModal-entryWidget .IncentiveEntryWidget-enrolledMessageContainer {
      left: 16px; }
  .DetailModal .incentive-point-earning-purpose-is-not-qualified {
    text-decoration: line-through; }

/*
        This is applied to the main details pane


        DetailModalItemTab
            -mainImgContainer
                -mainImg
            -summaryDisplay IncentiveSummaryDisplay--plainText
            -pointsSummaryColumn
                -pointsSummaryRow --validPoints
                -pointsSummaryRow
                -pointsSummaryRow --requiredPoints
                -pointsSummaryRow
                -pointsSummaryRow --requiredPoints
                -pointsSummaryRow
    */
.DetailModalItemTab {
  display: -ms-flexbox;
  display: flex; }
  .DetailModalItemTab-mainImgContainer {
    width: 160px;
    height: 160px;
    text-align: center;
    vertical-align: middle;
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 0 0 160px;
        flex: 0 0 160px;
    margin-right: 8px; }
  .DetailModalItemTab-mainImg {
    vertical-align: middle;
    width: 100%;
    max-height: 100%;
    max-width: 100%;
    margin: auto; }
  .no-flexbox .DetailModalItemTab-mainImgContainer {
    float: left; }
  .DetailModalItemTab-summaryDisplay {
    -ms-flex: 1 1 50%;
        flex: 1 1 50%;
    width: 50% !important;
    border-right: 1px solid #dfdfdf; }
  .no-flexbox .DetailModalItemTab-summaryDisplay {
    float: left;
    width: 49% !important; }
  .DetailModalItemTab-pointsSummaryColumn {
    -ms-flex: 1 1 25%;
        flex: 1 1 25%;
    text-align: center; }
  .no-flexbox .DetailModalItemTab-pointsSummaryColumn {
    float: right;
    width: 24%; }
  .DetailModalItemTab-pointsSummaryRow {
    font-size: 12px;
    line-height: 20px;
    font-weight: 400;
    color: #898989; }
    .DetailModalItemTab-pointsSummaryRow.DetailModalItemTab-pointsSummaryRow--validPoints {
      color: #389AD3;
      font-size: 32px;
      line-height: 36px; }
    .DetailModalItemTab-pointsSummaryRow.DetailModalItemTab-pointsSummaryRow--requiredPoints {
      margin-top: 12px;
      line-height: 16px;
      font-size: 16px;
      font-weight: 400; }

/*
        This is applied to the main details pane


        DetailModalEarnTab
            -dateText (text which is about a date)
    */
.DetailModalEarnTab-dateText {
  font-size: 14px;
  color: #03a9f4; }

/*
        This is applied to the main details pane


        DetailModalDetailsTab
            -entryDetailsColumn
                -entryDetailsHeading
                -entryDetailsList
                    -entryDetailsListItem
            -pointsRundownColumn
                -pointsReceiptTable ReceiptTable
    */
.DetailModalDetailsTab {
  display: -ms-flexbox;
  display: flex; }
  .DetailModalDetailsTab-entryDetailsColumn {
    -ms-flex: 1 0 50%;
        flex: 1 0 50%;
    border-right: 1px solid #dfdfdf; }
  .no-flexbox .DetailModalDetailsTab-entryDetailsColumn {
    float: left;
    width: 50%; }
  .DetailModalDetailsTab-entryDetailsHeading {
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 16px;
    font-weight: 400;
    font-weight: 400;
    line-height: 28px; }
  .DetailModalDetailsTab-entryDetailsList {
    margin: 0; }
  .DetailModalDetailsTab-entryDetailsListItem {
    font-size: 13px;
    font-weight: 400;
    line-height: 20px;
    list-style-type: disc;
    list-style-position: inside; }
  .DetailModalDetailsTab-pointsRundownColumn {
    -ms-flex: 1 0 50%;
        flex: 1 0 50%; }
  .no-flexbox .DetailModalDetailsTab-pointsRundownColumn {
    float: left;
    width: 50%; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The date-picker component.

		Todo: Add description here.

		HTML Structure:

		
		date-picker
            --calendar
	*/
date-picker {
  display: block;
  width: 100%; }

.date-picker--calendar {
  width: 100%; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The date-time-picker component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		date-time-picker

	*/
.date-time-picker--time-row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  border-top: 1px solid rgba(0, 0, 0, 0.12);
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  height: 48px;
  -ms-flex-align: center;
      align-items: center; }

.date-time-picker--separator {
  border-top: 1px solid rgba 0, 0, 0, 0.12;
  margin-top: 0;
  margin-bottom: 0;
  background-color: white; }

.date-time-picker--icon-container {
  padding-left: 16px; }
  .date-time-picker--icon-container span.rs-icon {
    font-size: 24px;
    line-height: 48px;
    color: rgba(0, 0, 0, 0.54); }

.date-time-picker--time-types-column {
  padding: 0 24px; }
  .date-time-picker--time-types-column .paper-select .paper-select-title-caret {
    top: 22px !important; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The time-picker component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		time-picker
            --display
                --display-empty-time-label
                --display-entry
                    --display-entry-input
                    --display-entry-input
                    --display-entry-meridian
                        --display-entry-meridian-label
                        --display-entry-meridian-label
                        --display-entry-meridian-checkbox
	*/
time-picker {
  display: block; }

.time-picker--md-select.md-rideshark-theme-theme .md-select-value.md-select-placeholder {
  color: rgba(0, 0, 0, 0.87); }

.time-picker--md-select[disabled=disabled] .md-select-icon {
  display: none; }

.time-picker--md-select[disabled=disabled] md-select-value {
  background-image: none !important; }

.time-picker--md-option {
  height: 24px;
  background-image: none; }

.time-picker--display-entry {
  display: -ms-flexbox;
  display: flex;
  margin-left: 16px; }

.time-picker--display-entry-colon {
  font-weight: bold;
  line-height: 72px;
  margin: 0 16px; }

.time-picker--display-entry-meridian {
  line-height: 67px;
  margin: 0 16px; }

.time-picker--display-entry-meridian-label {
  cursor: pointer;
  margin-bottom: 0 !important; }

.time-picker--display-entry-meridian-checkbox {
  display: none; }

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0; }

input[type="number"] {
  -moz-appearance: textfield; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        The annotated-calendar is used to display a Gregorian Calendar, a single month at a time.

        Different days on the calendar can be annotated with various markings.


        HTML Structure:

        annotated-calendar
            --calendar-heading
                --prev-month-btn
                --calendar-heading-text
                --next-month-btn
            --calendar-month-holder
                --calendar-month (is-currentMonth, is-lastMonth, is-nextMonth)
    */
annotated-calendar {
  display: block;
  max-width: 100%; }

.annotated-calendar--calendar-heading {
  display: -ms-flexbox;
  display: flex;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  height: 48px; }

.annotated-calendar--prev-month-btn {
  -ms-flex: 0 0 auto;
      flex: 0 0 auto;
  /*fix for IE*/
  -ms-flex-item-align: start;
      align-self: flex-start;
  margin-right: auto; }
  .annotated-calendar--prev-month-btn:hover {
    background-color: #ececec; }

.annotated-calendar--calendar-heading-text {
  -ms-flex: 1;
      flex: 1;
  margin: auto;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center;
  font-size: 16px;
  font-weight: 500;
  -ms-flex-align: center;
      align-items: center;
  /*fix for IE*/ }

.annotated-calendar--calendar-heading-text-month {
  padding-right: 5px; }

.annotated-calendar--next-month-btn {
  -ms-flex: 0 0 auto;
      flex: 0 0 auto;
  /*fix for IE*/
  margin-left: auto; }
  .annotated-calendar--next-month-btn:hover {
    background-color: #ececec; }

.annotated-calendar--calendar-separator {
  border-top: 1px solid rgba(0, 0, 0, 0.12);
  margin-top: 0;
  background-color: white; }

.annotated-calendar--week-label {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
      justify-content: space-around; }

.annotated-calendar--day-label {
  width: 32px;
  height: 32px;
  padding: 4px;
  font-weight: 500;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: center;
      justify-content: center; }

.annotated-calendar--calendar-month-holder {
  position: relative;
  overflow: hidden;
  min-width: 100%;
  min-height: 168px; }

.annotated-calendar--calendar-month {
  max-width: 100%; }

.annotated-calendar--calendar-month-swapper {
  position: absolute;
  width: 100%;
  height: 100%; }
  .annotated-calendar--calendar-month-swapper.ng-enter, .annotated-calendar--calendar-month-swapper.ng-leave {
    transition: 0.3s ease-in-out all; }
  .annotated-calendar--calendar-month-swapper._slide-left.ng-enter {
    transform: translateX(-100%); }
  .annotated-calendar--calendar-month-swapper._slide-left.ng-enter-active {
    transform: translateX(0px); }
  .annotated-calendar--calendar-month-swapper._slide-left.ng-leave {
    transform: translateX(0px); }
  .annotated-calendar--calendar-month-swapper._slide-left.ng-leave-active {
    transform: translateX(100%); }
  .annotated-calendar--calendar-month-swapper._slide-right.ng-enter {
    transform: translateX(100%); }
  .annotated-calendar--calendar-month-swapper._slide-right.ng-enter-active {
    transform: translateX(0px); }
  .annotated-calendar--calendar-month-swapper._slide-right.ng-leave {
    transform: translateX(0px); }
  .annotated-calendar--calendar-month-swapper._slide-right.ng-leave-active {
    transform: translateX(-100%); }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The annotated-calendar-month component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		annotated-calendar-month

	*/
annotated-calendar-month {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  width: auto; }

.annotated-calendar-month--week {
  -ms-flex: 1 0 100%;
      flex: 1 0 100%; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The annotated-calendar-week component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		annotated-calendar-week

	*/
annotated-calendar-week {
  display: -ms-flexbox;
  display: flex; }

.annotated-calendar-week--calendar-day {
  -ms-flex: 0 1 auto;
      flex: 0 1 auto;
  /*added as fix for IE day-selection collapse*/
  margin: 0 auto; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
		The annotated-calendar-day component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		annotated-calendar-day

	*/
annotated-calendar-day {
  display: -ms-flexbox;
  display: flex;
  width: 28px;
  height: 28px;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-line-pack: center;
      align-content: center;
  text-align: center;
  cursor: pointer; }

.annotated-calendar-day--day-label {
  display: block;
  color: #121212;
  width: 28px;
  height: 28px;
  padding: 4px; }
  .annotated-calendar-day--day-label:hover {
    background-color: rgba(0, 0, 0, 0.12);
    border-radius: 25px; }
    .annotated-calendar-day--day-label:hover._disabled {
      background-color: transparent; }
  .annotated-calendar-day--day-label._in-other-month {
    color: rgba(0, 0, 0, 0.38); }
  .annotated-calendar-day--day-label._show-filled-circle {
    background-color: #03a9f4;
    border-radius: 25px;
    color: white; }
  .annotated-calendar-day--day-label._disabled {
    opacity: 0.2;
    cursor: default; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The schedule-preview-strip component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		schedule-preview-strip

	*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
weekly-schedule-picker rs-tab-heading {
  height: 36px;
  border-right: 1px solid #e0e0e0; }
  weekly-schedule-picker rs-tab-heading:last-child {
    border-right: none; }

weekly-schedule-picker .rs-tab-heading {
  height: 36px; }
  weekly-schedule-picker .rs-tab-heading--content {
    height: 36px; }
    weekly-schedule-picker .rs-tab-heading--content > span {
      line-height: 36px; }
    weekly-schedule-picker .rs-tab-heading--content.is-selected {
      background-color: #03a9f4;
      color: white;
      text-align: center; }

.weekly-schedule-picker--mon-fri-panel {
  display: -ms-flexbox;
  display: flex; }

.weekly-schedule-picker--mon-to-fri-panel-large-heading {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center;
  padding: 48px 8px;
  font-size: 34px;
  color: rgba(0, 0, 0, 0.54); }

.weekly-schedule-picker--mon-to-fri-panel-time-pickers {
  display: -ms-flexbox;
  display: flex;
  padding-bottom: 150px; }

.weekly-schedule-picker--mon-to-fri-panel-time-picker-col {
  -ms-flex: 1;
      flex: 1;
  text-align: center; }

.weekly-schedule-picker--time-picker-col-label {
  color: rgba(0, 0, 0, 0.54) !important; }

.weekly-schedule-picker--mon-to-fri-panel-time-picker {
  padding-top: 10px; }

.weekly-schedule-picker--custom-schedule-panel-headings {
  display: -ms-flexbox;
  display: flex;
  margin-left: 45px;
  height: 48px; }

.weekly-schedule-picker--custom-schedule-panel-heading {
  width: 150px;
  text-align: center;
  padding: 14px 0; }
  .weekly-schedule-picker--custom-schedule-panel-heading._align-text {
    padding: 0; }

.weekly-schedule-picker--separator {
  margin-top: 0;
  margin-bottom: 0;
  border-top-color: rgba(0, 0, 0, 0.12);
  background-color: white; }

.weekly-schedule-picker--custom-schedule-panel-time-picker {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  background-color: white;
  height: 48px; }

.weekly-schedule-picker--custom-schedule-comment-entry-description {
  padding: 16px 0px 8px; }

.weekly-schedule-picker--custom-schedule-comment-entry textarea {
  background-color: #eeeeee;
  padding: 12px; }

@media (max-width: 360px) {
  weekly-schedule-picker .rs-tab-heading--content > span {
    white-space: nowrap;
    font-size: 0.833em; } }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The weekly-schedule-preview component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		weekly-schedule-preview

	*/
weekly-schedule-preview {
  float: left;
  max-width: 370px; }

.weekly-schedule-preview--preview-panel {
  height: 32px;
  padding: 0; }

.weekly-schedule-preview--schedule-preview {
  margin-top: 3px; }

.weekly-schedule-preview--edit-btn {
  height: 32px !important;
  line-height: 1 !important;
  padding: 0 8px !important; }

.weekly-schedule-preview--edit-panel {
  position: absolute;
  top: 16px;
  z-index: 100; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The weekly-schedule-summary component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		weekly-schedule-summary

	*/
weekly-schedule-summary {
  display: -ms-flexbox;
  display: flex;
  padding: 5px;
  color: rgba(0, 0, 0, 0.54);
  position: relative; }
  weekly-schedule-summary .is-active {
    color: #0FB62B; }

.weekly-schedule-summary--day {
  display: inline-block;
  padding-left: 8px;
  position: relative; }

.weekly-schedule-summary--day-indicator {
  position: absolute;
  margin: 0;
  padding: 0;
  width: 8px;
  height: 1px;
  background-color: #0FB62B; }
  .weekly-schedule-summary--day-indicator:before {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    border: 3px solid transparent; }
  .weekly-schedule-summary--day-indicator.mod--departing {
    top: -2px;
    right: 2px; }
    .weekly-schedule-summary--day-indicator.mod--departing:before {
      transform: translate(8px, -2.5px);
      border-left-color: #0FB62B; }
  .weekly-schedule-summary--day-indicator.mod--returning {
    bottom: -4px;
    right: 0px; }
    .weekly-schedule-summary--day-indicator.mod--returning:before {
      transform: translate(-6px, -2.5px);
      border-right-color: #0FB62B; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The schedule-day-time-picker component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		

	*/
schedule-day-time-picker._condensed .schedule-day-time-picker--day-name label {
  width: 30px;
  height: 30px;
  border-radius: 15px;
  font-size: 12px; }

schedule-day-time-picker._condensed .schedule-day-time-picker--time-picker {
  font-size: 12px;
  margin-top: 2px; }

.schedule-day-time-picker--day-name {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  padding-left: 16px;
  /*padding-top: 2px;*/ }
  .schedule-day-time-picker--day-name:hover {
    transform: scale(1.1);
    transition: all 0.3s ease; }

.schedule-day-time-picker--day-name-label {
  text-align: center;
  width: 35px;
  height: 35px;
  background-color: rgba(0, 0, 0, 0.12);
  color: rgba(0, 0, 0, 0.38);
  border-radius: 25px;
  padding-top: 7px;
  margin-bottom: 0px !important;
  cursor: pointer;
  font-weight: 500 !important; }
  .schedule-day-time-picker--day-name-label.is-matching-schedule {
    background-color: #00c853; }

.schedule-day-time-picker--day-name-checkbox {
  display: none; }

.schedule-day-time-picker--time-entries-column {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center; }

.schedule-day-time-picker--time-entries-column-pickers {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center; }

.schedule-day-time-picker--time-picker._start {
  padding-left: 30px;
  min-width: 88px;
  text-align: right;
  box-sizing: content-box; }

.schedule-day-time-picker--time-picker._end {
  padding-left: 80px;
  min-width: 88px;
  text-align: right;
  box-sizing: content-box; }

.schedule-day-time-picker--time-picker.is-matching-schedule {
  color: #00c853 !important; }
  .schedule-day-time-picker--time-picker.is-matching-schedule md-select md-select-value {
    border-bottom-style: none; }
    .schedule-day-time-picker--time-picker.is-matching-schedule md-select md-select-value span:first-child {
      color: #00c853 !important; }
    .schedule-day-time-picker--time-picker.is-matching-schedule md-select md-select-value .md-select-icon {
      display: none; }
  .schedule-day-time-picker--time-picker.is-matching-schedule md-select.md-rideshark-theme-theme[disabled] .md-select-value {
    background-image: none; }

.schedule-day-time-picker--time-entries-column-message-row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  cursor: pointer;
  padding-left: 40px; }

.schedule-day-time-picker--message-left-arrow {
  font-size: 24px;
  color: rgba(0, 0, 0, 0.54);
  padding-right: 20px; }

.schedule-day-time-picker--message-text {
  color: rgba(0, 0, 0, 0.38);
  font-weight: 500 !important; }

/*Modifiers*/
.is-commuting {
  background-color: #03a9f4;
  color: white; }

._end {
  padding-left: 30px; }

@media (max-width: 320px) {
  .schedule-day-time-picker--time-picker._end {
    padding-left: 16px; }
  .schedule-day-time-picker--time-picker._start {
    padding-left: 16px; } }

@media (max-width: 360px) and (min-width: 321px) {
  .schedule-day-time-picker--time-picker._end {
    padding-left: 40px; } }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The schedule-day-time-display component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		

	*/
schedule-day-time-display._condensed .schedule-day-time-display--day-name label {
  width: 30px;
  height: 30px;
  border-radius: 15px;
  font-size: 12px; }

schedule-day-time-display._condensed .schedule-day-time-display--time-picker {
  font-size: 12px;
  margin-top: 2px; }

.schedule-day-time-display--day-name {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  padding-left: 16px;
  cursor: none;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none; }

.schedule-day-time-display--day-name-label {
  text-align: center;
  width: 35px;
  height: 35px;
  background-color: rgba(0, 0, 0, 0.12);
  color: rgba(0, 0, 0, 0.38);
  border-radius: 25px;
  padding-top: 7px;
  margin-bottom: 0px !important;
  cursor: pointer;
  font-weight: 500 !important; }
  .schedule-day-time-display--day-name-label.is-matching-schedule {
    background-color: #00c853; }

.schedule-day-time-display--day-name-checkbox {
  display: none; }

.schedule-day-time-display--time-entries-column {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center; }

.schedule-day-time-display--time-entries-column-pickers {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center; }

.schedule-day-time-display--time-picker._start {
  padding-left: 30px;
  min-width: 88px;
  text-align: right;
  box-sizing: content-box; }

.schedule-day-time-display--time-picker._end {
  padding-left: 80px;
  min-width: 88px;
  text-align: right;
  box-sizing: content-box; }

.schedule-day-time-display--time-picker.is-matching-schedule {
  color: #00c853 !important; }
  .schedule-day-time-display--time-picker.is-matching-schedule md-select md-select-value {
    border-bottom-style: none; }
    .schedule-day-time-display--time-picker.is-matching-schedule md-select md-select-value span:first-child {
      color: #00c853 !important; }
    .schedule-day-time-display--time-picker.is-matching-schedule md-select md-select-value .md-select-icon {
      display: none; }
  .schedule-day-time-display--time-picker.is-matching-schedule md-select.md-rideshark-theme-theme[disabled] .md-select-value {
    background-image: none; }

.schedule-day-time-display--time-entries-column-message-row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  cursor: pointer;
  padding-left: 40px; }

.schedule-day-time-display--message-left-arrow {
  font-size: 24px;
  color: rgba(0, 0, 0, 0.54);
  padding-right: 20px; }

.schedule-day-time-display--message-text {
  color: rgba(0, 0, 0, 0.38);
  font-weight: 500 !important; }

/*Modifiers*/
.is-commuting {
  background-color: #03a9f4;
  color: white; }

._end {
  padding-left: 30px; }

@media (max-width: 320px) {
  .schedule-day-time-display--time-picker._end {
    padding-left: 16px; }
  .schedule-day-time-display--time-picker._start {
    padding-left: 16px; } }

@media (max-width: 360px) and (min-width: 321px) {
  .schedule-day-time-display--time-picker._end {
    padding-left: 40px; } }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        The assorted-time-picker allows users to specify either a single trip time, or a regular trip schedule.

        It's primary function is to open the assorted-time-picker-card component, and display the selected time
    */
assorted-time-picker {
  margin: 0 16px 16px 16px;
  position: relative; }

.assorted-time-picker--icon-container {
  display: -ms-flexbox;
  display: flex;
  cursor: pointer;
  -ms-flex-align: center;
      align-items: center;
  color: #5f5c5c; }
  .assorted-time-picker--icon-container span {
    font-size: 24px; }
    .assorted-time-picker--icon-container span:before {
      padding: 0 !important; }

.assorted-time-picker--picker-container {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center; }
  .assorted-time-picker--picker-container._pop-up {
    padding: 0px 48px 16px 16px; }

.assorted-time-picker--time-entry-display {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  height: 32px;
  cursor: pointer;
  margin-left: 32px;
  width: 352px;
  z-index: 2;
  background-color: #eeeeee;
  transition: background-color 0.3s ease; }
  .assorted-time-picker--time-entry-display:hover {
    background-color: #e0e0e0; }
    .assorted-time-picker--time-entry-display:hover .assorted-time-picker--edit-icon {
      display: block; }

.assorted-time-picker--choose-time-summary {
  display: -ms-flexbox;
  display: flex;
  width: 352px;
  padding-left: 8px;
  font-weight: 400;
  color: rgba(0, 0, 0, 0.38); }

.assorted-time-picker--edit-icon {
  font-size: 24px;
  margin-left: auto;
  padding-right: 8px;
  color: rgba(0, 0, 0, 0.54);
  transition: all 0.3s ease;
  display: none;
  position: relative;
  right: 30px; }

.assorted-time-picker--one-or-recurring-container {
  display: -ms-flexbox;
  display: flex;
  margin: 8px 0 16px 64px; }

.assorted-time-picker--trip-type-label {
  margin-right: 16px;
  font-size: 12px;
  font-weight: 600; }

.assorted-time-picker--radio-outer {
  border: 2px solid #66aff0;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  float: left;
  margin-left: 16px;
  cursor: pointer; }

.assorted-time-picker--radio-inner {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: #66aff0;
  margin: 4px; }

.assorted-time-picker--radio-label {
  float: left;
  padding-left: 16px;
  padding-right: 16px; }

@media (max-width: 360px) {
  .assorted-time-picker--one-or-recurring-container {
    width: 100%; }
  .assorted-time-picker--radio-label {
    padding-left: 16px; } }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The assorted-time-picker-card component.

		The assorted time picker card contains two tabs - one with the options for a one time trip, the other with options for a weekly trip.

		HTML Structure:

		Todo: Document HTML Structure
		assorted-time-picker-card

	*/
assorted-time-picker-card {
  display: -ms-flexbox;
  display: flex;
  background-color: #fff;
  width: 100%;
  -ms-flex-direction: column;
      flex-direction: column;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  z-index: 4; }
  assorted-time-picker-card._pop-up {
    padding: 0px 16px 16px;
    width: 400px; }
  assorted-time-picker-card._drop-shadow {
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22); }

.assorted-time-picker-card--heading {
  -ms-flex: 0 0 auto;
      flex: 0 0 auto;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  padding: 4px 0 0 16px;
  width: 100%; }

.assorted-time-picker-card--heading-label {
  -ms-flex: 1;
      flex: 1;
  margin-right: auto; }

.assorted-time-picker-card--close-btn {
  -ms-flex-item-align: end;
      align-self: flex-end;
  margin-left: auto;
  -ms-flex: 0 0 auto;
      flex: 0 0 auto;
  /*fix for IE*/ }

.assorted-time-picker-card--body-tabset {
  -ms-flex: 1 0 auto;
      flex: 1 0 auto; }

.assorted-time-picker-card--body rs-tabset-headings {
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  margin-bottom: 0px; }

.assorted-time-picker-card--body rs-tab-heading:hover {
  color: #03a9f4; }

.assorted-time-picker-card--date-summary {
  height: 36px;
  line-height: 36px;
  font-weight: 500;
  color: rgba(0, 0, 0, 0.54);
  text-align: center; }

.assorted-time-picker-card--action-area {
  -ms-flex: 0 0 auto;
      flex: 0 0 auto;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  padding: 8px;
  -ms-flex-item-align: end;
      align-self: flex-end; }
  .assorted-time-picker-card--action-area button {
    border: none;
    background-color: transparent;
    margin-left: auto;
    text-transform: uppercase; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
assorted-time-summary {
  display: block; }
  assorted-time-summary._white .assorted-time-summary--one-time-summary {
    color: rgba(255, 255, 255, 0.7);
    padding: 4px 0 0 36px;
    font-size: 14px; }
  assorted-time-summary._white .assorted-time-summary--weekly-summary {
    padding: 4px 0 0 28px;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.3); }
    assorted-time-summary._white .assorted-time-summary--weekly-summary .is-active {
      color: rgba(255, 255, 255, 0.7); }

.assorted-time-summary--one-time-summary {
  display: -ms-flexbox;
  display: flex;
  padding-left: 8px;
  font-weight: 400;
  color: #0070c9;
  width: 352px;
  -ms-flex-align: center;
      align-items: center; }

.assorted-time-summary--weekly-summary {
  width: 352px;
  /*padding-left: 8px;*/ }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The custom-weekly-schedule-display component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		custom-weekly-schedule-display

	*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		Desktop specific styles for the date-time-picker

	*/
.date-time-picker--date-summary {
  height: 48px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The assorted-time-picker component.

        The primary goal of this file is to add desktop-app specific styling to the assorted-time-picker.

	*/
assorted-time-picker {
  display: block;
  position: relative; }

.assorted-time-picker--picker-card._pop-up {
  position: absolute;
  left: 24px;
  top: -16px;
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
  width: 400px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.ShareModalWindow {
  max-width: 704px;
  margin: auto;
  margin-top: 170px; }
  .ShareModalWindow .modal-content {
    border: none;
    border-radius: 0; }
  .ShareModalWindow .modal-dialog {
    overflow-x: hidden; }

.ShareModal {
  max-width: 704px; }
  .ShareModal-heading {
    padding: 16px;
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 20px; }
  .ShareModal-body {
    width: 100%; }
  .ShareModal-link {
    padding: 0 24px 24px 24px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center; }
  .ShareModal-linkUrl {
    width: 542px;
    background-color: #eeeeee;
    padding: 8px;
    margin-right: 20px; }
  .ShareModal-item {
    padding: 24px;
    display: -ms-flexbox;
    display: flex; }
  .ShareModal-centeredButton {
    margin: 16px auto; }
  .ShareModal-itemContent {
    float: right;
    max-width: calc(100% - 112px);
    position: relative;
    overflow-y: auto;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    /* Set width */
    /* Track */
    /* Handle */ }
    .ShareModal-itemContent::-webkit-scrollbar {
      width: 8px; }
    .ShareModal-itemContent::-webkit-scrollbar-track {
      display: none; }
    .ShareModal-itemContent::-webkit-scrollbar-thumb {
      border-radius: 10px;
      background-color: rgba(200, 200, 200, 0.8);
      box-shadow: inset 0 0 6px rgba(200, 200, 200, 0.8); }
    .ShareModal-itemContent::-webkit-scrollbar-thumb:window-inactive {
      background: rgba(201, 201, 201, 0.8); }
  .ShareModal-imgContainer {
    width: 100px;
    height: 100px;
    padding-right: 16px; }
  .ShareModal-itemImage {
    width: 100%;
    max-width: 100%;
    max-height: 100%; }
  .ShareModal-itemHeading {
    float: left;
    margin-top: 0;
    font-size: 16px;
    line-height: 28px;
    font-weight: normal;
    color: #020202;
    line-height: 20px; }
  .ShareModal-itemMessage {
    float: left;
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 13px;
    font-weight: 400;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.38); }
  .ShareModal-itemCaption {
    float: left;
    color: rgba(0, 0, 0, 0.38);
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 12px;
    font-weight: 400; }
  .ShareModal-textArea {
    width: 624px;
    height: 108px;
    margin: 24px;
    padding: 16px;
    background-color: #eeeeee; }
  .ShareModal-tabs {
    clear: left; }
    .ShareModal-tabs li {
      width: 160px;
      text-align: center; }
    .ShareModal-tabs .nav-tabs {
      padding: 0 112px; }
      .ShareModal-tabs .nav-tabs .active {
        background-color: #eeeeee; }
  .ShareModal-tweetCharactersLeft {
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 13px;
    font-weight: 400;
    margin-left: 24px;
    padding-left: 16px;
    margin-top: -60px;
    margin-bottom: 40px; }
    .ShareModal-tweetCharactersLeft.ShareModal-tweetCharactersLeft--tooManyChars {
      color: #d9534f; }
  .ShareModal-actionArea {
    padding: 16px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: end;
        justify-content: flex-end; }
    .ShareModal-actionArea:before, .ShareModal-actionArea:after {
      content: " ";
      display: table; }
    .ShareModal-actionArea:after {
      clear: both; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        The TourCanvas should be applied to the <ui-tour> element inserted on the page.

        Nothing fancy about this, just providing a home for things to live.
    */
.TourCanvas {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99999; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.Arrow {
  position: absolute;
  width: 0;
  height: 0;
  border: 16px solid transparent; }
  .Arrow::before {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    border: 19px solid transparent;
    z-index: -1; }
  .Arrow.Arrow--right {
    border-left-color: #fff; }
  .Arrow.Arrow--left {
    border-right-color: #fff; }
  .Arrow.Arrow--top {
    border-bottom-color: #fff; }
  .Arrow.Arrow--bottom {
    border-top-color: #fff; }
  .Arrow.Arrow--yellow.Arrow--right {
    border-left-color: #FFFFA5; }
  .Arrow.Arrow--yellow.Arrow--left {
    border-right-color: #FFFFA5; }
  .Arrow.Arrow--yellow.Arrow--top {
    border-bottom-color: #FFFFA5; }
  .Arrow.Arrow--yellow.Arrow--bottom {
    border-top-color: #FFFFA5; }
  .Arrow.Arrow--right {
    border-right-width: 0; }
    .Arrow.Arrow--right::before {
      border-left-color: rgba(0, 0, 0, 0.14);
      right: -22px;
      bottom: -21px; }
  .Arrow.Arrow--left {
    border-right-color: white;
    border-left-width: 0; }
    .Arrow.Arrow--left::before {
      border-right-color: rgba(0, 0, 0, 0.14);
      left: -22px;
      bottom: -21px; }
  .Arrow.Arrow--top {
    border-bottom-color: white;
    border-top-width: 0; }
    .Arrow.Arrow--top::before {
      border-bottom-color: rgba(0, 0, 0, 0.14);
      right: -19px;
      top: -21px;
      border-bottom-width: 17px; }
  .Arrow.Arrow--bottom {
    border-top-color: white;
    border-bottom-width: 0; }
    .Arrow.Arrow--bottom::before {
      border-top-color: rgba(0, 0, 0, 0.14);
      left: -19px;
      bottom: -23px; }

.Tourguide {
  position: absolute;
  z-index: 999;
  background-color: #fff;
  border: 1px solid rgba(0, 0, 0, 0.2);
  box-shadow: 0 4px 12px 1px rgba(0, 0, 0, 0.4);
  padding: 16px;
  transition: transform 0.3s ease-in-out, ms-transform 0.3s ease-in-out; }
  .Tourguide-close {
    position: absolute;
    right: 16px;
    top: 16px; }
  .Tourguide-desc {
    min-width: 300px;
    float: left;
    margin-bottom: 0;
    padding-left: 8px;
    padding-right: 8px; }
  .Tourguide-topRow {
    width: 100%;
    display: -ms-flexbox;
    display: flex; }
  .Tourguide-helpIconHolder {
    width: 32px; }
    .Tourguide-helpIconHolder .rs-icon {
      font-size: 24px; }
  .Tourguide-title {
    float: left;
    margin: 0 !important;
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 18px;
    padding-bottom: 8px;
    padding-right: 20px; }
  .Tourguide-actions {
    width: 100%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
        justify-content: space-between;
    -ms-flex-align: baseline;
        align-items: baseline; }
  .Tourguide-prev {
    float: left;
    -ms-flex-item-align: end;
        align-self: flex-end;
    margin-right: auto; }
  .Tourguide-nextOrOkHolder {
    float: right;
    margin-left: auto;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: end;
        justify-content: flex-end;
    -ms-flex-align: baseline;
        align-items: baseline; }
  .Tourguide-stopCounter {
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 12px;
    float: left;
    margin-right: 8px; }
  .Tourguide-nextOrOk {
    float: right; }
  .Tourguide-arrow {
    position: absolute;
    transition: transform 0.2s ease-in-out; }
    .Tourguide-arrow.Tourguide-arrow--right {
      right: -16px;
      top: 16px; }
    .Tourguide-arrow.Tourguide-arrow--left {
      left: -16px;
      top: 16px; }
    .Tourguide-arrow.Tourguide-arrow--top {
      left: calc(50% - 16px);
      top: -16px; }
    .Tourguide-arrow.Tourguide-arrow--bottom {
      left: calc(50% - 16px);
      bottom: -16px; }
  .Tourguide.Tourguide--yellow {
    background-color: #FFFFA5; }

.no-csstransitions .Tourguide {
  transition: none; }
  .no-csstransitions .Tourguide-arrow {
    transition: none; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.animation.is-playing {
  animation-duration: 1s;
  animation-fill-mode: both; }

@keyframes jello {
  0%, 100%, 11.1% {
    transform: none; }
  22.2% {
    transform: skewX(-12.5deg) skewY(-12.5deg); }
  33.3% {
    transform: skewX(6.25deg) skewY(6.25deg); }
  44.4% {
    transform: skewX(-3.125deg) skewY(-3.125deg); }
  55.5% {
    transform: skewX(1.5625deg) skewY(1.5625deg); }
  66.6% {
    transform: skewX(-0.78125deg) skewY(-0.78125deg); }
  77.7% {
    transform: skewX(0.39063deg) skewY(0.39063deg); }
  88.8% {
    transform: skewX(-0.19531deg) skewY(-0.19531deg); } }

.animation--jello {
  animation-name: jello;
  transform-origin: center;
  animation-play-state: unset; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.TripSchedulePreview {
  float: left;
  max-width: 370px; }
  .TripSchedulePreview-previewPanel {
    height: 32px;
    padding: 0; }
  .TripSchedulePreview-schedulePreview {
    margin-top: 3px; }
  .TripSchedulePreview-editBtn {
    height: 32px !important;
    line-height: 1 !important;
    padding: 0 8px !important; }
  .TripSchedulePreview-editPanel {
    position: absolute;
    top: 16px;
    z-index: 100; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.SchedulePreviewStrip .summary-day-text.brand-success {
  position: relative;
  font-weight: bold !important;
  top: 1px; }

.SchedulePreviewStrip.SchedulePreviewStrip--compressed .schedule-summary-day {
  margin-right: 0; }

.SchedulePreviewStrip.SchedulePreviewStrip--tall .schedule-summary-day {
  height: 32px;
  padding-top: 5px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The trip-proposal-edit-page component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		trip-proposal-edit-page

	*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The trip-post-overlay-card component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		trip-post-overlay-card

	*/
trip-post-overlay-card {
  display: -ms-flexbox;
  display: flex;
  height: 100%; }
  trip-post-overlay-card.is-hidden {
    display: none; }
  trip-post-overlay-card._drawer-style {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out 0.1s; }
    trip-post-overlay-card._drawer-style.is-hidden {
      display: -ms-flexbox;
      display: flex;
      opacity: 0;
      transform: translateX(-100%); }
    trip-post-overlay-card._drawer-style:not(.is-hidden) {
      opacity: 1;
      transform: translateX(0); }
  trip-post-overlay-card._drawer-style .trip-post-overlay-card--header-back-button {
    display: block;
    -ms-flex: 0 1 auto;
        flex: 0 1 auto; }
  trip-post-overlay-card._drawer-style .trip-post-overlay-card--header-close-button {
    display: none; }

.trip-post-overlay-card--container {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  height: 100%; }

.trip-post-overlay-card--header {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  width: 100%;
  -ms-flex-pack: justify;
      justify-content: space-between;
  border-bottom: 1px solid #DCDCDC;
  -ms-flex-negative: 0;
      flex-shrink: 0; }

.trip-post-overlay-card--body {
  height: 1px;
  -ms-flex-positive: 1;
      flex-grow: 1; }

.trip-post-overlay-card--header-back-button {
  display: none; }

.trip-post-overlay-card--header-close-button {
  display: block;
  -ms-flex: 0 0 auto;
      flex: 0 0 auto;
  margin-left: auto; }

.trip-post-overlay-card--header-label {
  padding-left: 16px;
  -ms-flex: 1 0 auto;
      flex: 1 0 auto; }

.trip-post-overlay-card--trip-post-card {
  overflow-y: auto;
  overflow-x: hidden; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The desktop-trip-post-view-page component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		desktop-trip-post-view-page

	*/
.desktop-trip-post-view-page--contact-overlay-card {
  position: absolute;
  bottom: 40px;
  left: 40px;
  z-index: 3;
  min-width: 440px;
  background-color: #fff;
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.28); }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The desktop-trip-post-edit-page component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		desktop-trip-post-edit-page

	*/
desktop-trip-post-edit-page {
  display: block; }

.desktop-trip-post-edit-page {
  /**
            The trip-post-display that's on the page.
        */ }
  .desktop-trip-post-edit-page--panel {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 480px;
    background-color: #fff; }
  .desktop-trip-post-edit-page--trip-post-display {
    position: relative; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The trip-post-list-page component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		trip-post-list-page

	*/
trip-post-list-page {
  display: block; }

.trip-post-list-page--list-address-summary-panel {
  width: 280px;
  /*for ellipses*/ }

.trip-post-list-page--list-day-display {
  color: rgba(0, 0, 0, 0.38);
  line-height: 24px; }

.trip-post-list-page--list-card-confirmation-text {
  font-size: 12px;
  line-height: 16px;
  color: #03a9f4;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The trip-post-editor component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		trip-post-editor

	*/
trip-post-editor {
  width: 480px; }

.trip-post-editor {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  height: 100%; }
  .trip-post-editor--header {
    width: 100%;
    -ms-flex-preferred-size: auto;
        flex-basis: auto; }
  .trip-post-editor--body {
    -ms-flex-preferred-size: auto;
        flex-basis: auto;
    overflow: auto;
    width: 100%;
    -ms-flex-positive: 1;
        flex-grow: 1;
    background-color: #E0E0E0;
    position: relative;
    overflow-y: auto;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    /* Set width */
    /* Track */
    /* Handle */
    overflow-x: hidden; }
    .trip-post-editor--body::-webkit-scrollbar {
      width: 8px; }
    .trip-post-editor--body::-webkit-scrollbar-track {
      display: none; }
    .trip-post-editor--body::-webkit-scrollbar-thumb {
      border-radius: 10px;
      background-color: rgba(200, 200, 200, 0.8);
      box-shadow: inset 0 0 6px rgba(200, 200, 200, 0.8); }
    .trip-post-editor--body::-webkit-scrollbar-thumb:window-inactive {
      background: rgba(201, 201, 201, 0.8); }
  .trip-post-editor--trip-itinerary-picker {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    /*box-shadow: 0px 2px 6px rgba(0,0,0,0.2);
            background-color: #ffffff;*/
    /*margin-bottom: 16px;*/ }
  .trip-post-editor--title {
    padding: 16px;
    height: 56px;
    margin: 4px 0; }

/**
		The one-time-rideshare-post-editor component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		one-time-rideshare-post-editor

	*/
one-time-rideshare-post-editor {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  padding: 2px 0 16px;
  font-family: 'Roboto', Arial, sans-serif;
  height: auto; }

.one-time-rideshare-post-editor--container {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  height: auto; }

.one-time-rideshare-post-editor--side-panel {
  display: none;
  position: absolute;
  top: 0px;
  z-index: 2;
  width: 100%;
  min-height: 170px;
  background-color: #e0e0e0; }
  .one-time-rideshare-post-editor--side-panel._isVisible {
    display: block; }

.one-time-rideshare-post-editor--seats-information {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  height: 72px;
  -ms-flex-pack: center;
      justify-content: center;
  padding: 0 16px;
  background-color: #fff;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  transition: background-color 0.3s ease;
  cursor: pointer; }
  .one-time-rideshare-post-editor--seats-information._isDisabled {
    opacity: 0.38; }
  .one-time-rideshare-post-editor--seats-information._isActive {
    background-color: #E0E0E0; }
  .one-time-rideshare-post-editor--seats-information:hover {
    background-color: #ececec; }

.one-time-rideshare-post-editor--seats-information-header {
  font-size: 16px;
  color: rgba(0, 0, 0, 0.87); }

.one-time-rideshare-post-editor--seats-information-text {
  font-size: 14px;
  color: rgba(0, 0, 0, 0.54); }

.one-time-rideshare-post-editor--trip-cost {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  height: 72px;
  -ms-flex-pack: center;
      justify-content: center;
  padding-left: 16px;
  /*box-shadow to be applied to component when created*/
  box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.2);
  cursor: pointer; }
  .one-time-rideshare-post-editor--trip-cost._isDisabled {
    opacity: 0.38; }
  .one-time-rideshare-post-editor--trip-cost._isActive {
    background-color: #E0E0E0; }
  .one-time-rideshare-post-editor--trip-cost:hover {
    background-color: #ececec; }

.one-time-rideshare-post-editor--trip-cost-header {
  font-size: 16px;
  color: rgba(0, 0, 0, 0.87); }

.one-time-rideshare-post-editor--trip-cost-text {
  font-size: 14px;
  color: rgba(0, 0, 0, 0.54); }

.one-time-rideshare-post-editor--optional-preferences {
  display: -ms-flexbox;
  display: flex;
  height: 48px;
  -ms-flex-direction: column;
      flex-direction: column;
  -ms-flex-pack: center;
      justify-content: center;
  padding-left: 16px;
  background-color: #EEEEEE;
  font-size: 14px;
  color: rgba(0, 0, 0, 0.54); }

.one-time-rideshare-post-editor--passengers-preferences {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  height: 72px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  -ms-flex-pack: center;
      justify-content: center;
  padding-left: 16px; }

.one-time-rideshare-post-editor--passengers-preferences-header {
  height: 20px;
  font-size: 16px;
  color: rgba(0, 0, 0, 0.87); }

.one-time-rideshare-post-editor--passengers-preferences-icons {
  height: 16px;
  color: rgba(0, 0, 0, 0.54);
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  height: 20px;
  width: 110px;
  -ms-flex-pack: justify;
      justify-content: space-between;
  padding-top: 8px; }

.one-time-rideshare-post-editor--automatic-booking {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  height: 60px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  padding-left: 16px; }

.one-time-rideshare-post-editor--automatic-booking-text-holder {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  -ms-flex: 1 0 auto;
      flex: 1 0 auto;
  -ms-flex-pack: center;
      justify-content: center; }

.one-time-rideshare-post-editor--automatic-booking-checkbox-holder {
  margin-left: auto;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: end;
      justify-content: flex-end;
  width: 42px;
  -ms-flex-align: center;
      align-items: center;
  margin-right: 16px; }

.one-time-rideshare-post-editor--automatic-booking-header {
  font-size: 16px;
  color: rgba(0, 0, 0, 0.87); }

.one-time-rideshare-post-editor--automatic-booking-text {
  font-size: 14px;
  color: rgba(0, 0, 0, 0.54); }

.one-time-rideshare-post-editor--automatic-booking-checkbox {
  width: 20px;
  height: 20px; }

.one-time-rideshare-post-editor--comment {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  height: auto;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
  -ms-flex-pack: center;
      justify-content: center;
  padding: 16px; }

.one-time-rideshare-post-editor--comment-label {
  margin-bottom: 8px;
  font-size: 16px;
  color: rgba(0, 0, 0, 0.87); }

.one-time-rideshare-post-editor--comment-textarea {
  background: #EEEEEE;
  border: none;
  padding: 8px;
  box-sizing: border-box;
  overflow-y: hidden;
  min-height: 28px;
  height: 36px; }

.one-time-rideshare-post-editor--post-editor-buttons {
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1 0 auto;
      flex: 1 0 auto;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: end;
      justify-content: flex-end;
  width: 100%;
  background-color: white;
  bottom: 0px;
  position: absolute;
  margin: 0px;
  padding: 16px;
  box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.2); }

.one-time-rideshare-post-editor--cancel-button {
  color: rgba(0, 0, 0, 0.54); }

.one-time-rideshare-post-editor--post-trip-button {
  margin-left: 16px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The desktop trip-cost-window SCSS component

        contains additional style for the desktop version of the trip-cost-window

		HTML Structure:

		Todo: Document HTML Structure
		trip-cost-window

	*/
.trip-cost-window {
  /*fix for h4 overflow in desktop panel-group-toggle*/ }
  .trip-cost-window--panel-group .panel-title {
    margin: 0 !important; }
  .trip-cost-window--panel-group-toggle.alt--resize-panel-header {
    min-height: 1%;
    padding: 0; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The one-time-rideshare-reservation-editor-overlay-card component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		one-time-rideshare-reservation-editor-overlay-card

	*/
one-time-rideshare-reservation-editor-overlay-card {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 999999999;
  background-color: rgba(0, 0, 0, 0.3);
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.28); }
  one-time-rideshare-reservation-editor-overlay-card.is-hidden {
    display: none; }
  one-time-rideshare-reservation-editor-overlay-card._drawer-style {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out 0.1s; }
    one-time-rideshare-reservation-editor-overlay-card._drawer-style.is-hidden {
      display: -ms-flexbox;
      display: flex;
      opacity: 0;
      transform: translateX(-100%); }
    one-time-rideshare-reservation-editor-overlay-card._drawer-style:not(.is-hidden) {
      opacity: 1;
      transform: translateX(0); }

.one-time-rideshare-reservation-editor-overlay-card--modal {
  position: relative;
  top: 250px;
  background-color: #fff;
  height: auto;
  width: 640px;
  margin: 0 auto; }

.one-time-rideshare-reservation-editor-overlay-card--reservation-editor {
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.28); }

.one-time-rideshare-reservation-editor-overlay-card--exit-button {
  position: absolute;
  top: 8px;
  right: 0;
  transition: all 0.3s ease;
  -moz-transition: all 0.3s ease; }
  .one-time-rideshare-reservation-editor-overlay-card--exit-button:hover {
    transform: scale(1.2);
    -moz-transform: scale(1.2); }
  .one-time-rideshare-reservation-editor-overlay-card--exit-button ._exit {
    color: white; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The rs-icon-tab component. Goes inside an rs-tabset-headings component.


		HTML Structure:

		rs-icon-tab-heading
            --number-badge
            --icon

	*/
rs-icon-tab-heading {
  position: relative;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-line-pack: center;
      align-content: center;
  -ms-flex-pack: center;
      justify-content: center;
  width: 64px;
  height: 48px;
  cursor: pointer;
  text-align: center; }

.rs-icon-tab-heading--number-badge {
  position: absolute;
  left: 28px;
  border-radius: 50%;
  padding: 2px;
  color: #fff;
  width: 18px;
  height: 18px;
  font-size: 12px;
  font-family: 'Roboto', Arial, sans-serif; }

.rs-icon-tab-heading--icon {
  -ms-flex-item-align: center;
      -ms-grid-row-align: center;
      align-self: center;
  text-align: center;
  /*added this as fix for IE */
  width: 24px;
  height: 24px;
  font-size: 24px; }

.rs-icon-tab-heading--selected-underline {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 2px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The rs-tabset component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		rs-tabset

	*/
rs-tabset {
  display: block;
  width: 100%; }

.rs-tabset--tabset-headings {
  margin-bottom: 16px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
		The rs-tab-heading component. Goes inside an rs-tabset-headings component.


		HTML Structure:

		rs-tab-heading
            --number-badge
            --icon

	*/
rs-tab-heading {
  position: relative;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-line-pack: center;
      align-content: center;
  -ms-flex-pack: center;
      justify-content: center;
  height: 48px;
  -ms-flex: 1;
      flex: 1;
  cursor: pointer;
  font-weight: 500;
  color: rgba(0, 0, 0, 0.54);
  cursor: pointer; }
  rs-tab-heading._sub-mode-trapezoid {
    font-size: 16px;
    /*updated as per Tom's review*/
    line-height: 17px; }
    rs-tab-heading._sub-mode-trapezoid .rs-tab-heading--content.is-selected {
      /*trapezoid shape for sub-mode-tab*/
      border-right: 8px solid #EEE;
      border-left: 8px solid #EEE;
      border-bottom: 40px solid #FFF; }
    rs-tab-heading._sub-mode-trapezoid .rs-tab-heading--selected-underline {
      /*move underline for sub-mode-tab*/
      bottom: 40px;
      left: 8px;
      right: 8px; }
    rs-tab-heading._sub-mode-trapezoid .rs-tabset--tab-heading-btn {
      /* this adjusts tab-label position */
      margin-top: 8px;
      height: auto;
      padding: 4px 0 4px 0;
      min-height: 40px; }
    rs-tab-heading._sub-mode-trapezoid .rs-tabset--tab-heading-btn:focus {
      border-top-style: none;
      border-bottom-style: none; }
    rs-tab-heading._sub-mode-trapezoid .rs-tabset--tab-heading-btn-badge {
      top: 10px; }

.rs-tab-heading--content {
  display: block;
  height: 48px;
  margin: 0 auto;
  width: 100%;
  text-align: center; }
  .rs-tab-heading--content > span {
    line-height: 48px; }
  .rs-tab-heading--content.is-selected {
    color: #03a9f4;
    background-color: #EEEEEE;
    text-align: center;
    width: 100%; }

.rs-tab-heading--selected-underline {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 2px;
  background-color: #03a9f4; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        The rs-tabset-headings just contains tabs.
        
        Structure
        
        rs-tabset-headings
            --tab-headings <Div that contains all the tabs>
                <This is transcluded>
    */
rs-tabset-headings {
  width: 100%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-align: end;
      align-items: flex-end; }
  rs-tabset-headings._show-tab-shape {
    position: relative;
    background-color: #fff; }
    rs-tabset-headings._show-tab-shape .rs-tabset-headings--tab-headings {
      position: relative;
      z-index: 1;
      background-color: transparent; }
      rs-tabset-headings._show-tab-shape .rs-tabset-headings--tab-headings > rs-icon-tab-heading:hover {
        background-color: transparent; }
    rs-tabset-headings._show-tab-shape .rs-tabset-headings--trapezoid {
      min-width: 64px;
      width: 96px;
      border-left: 8px solid #FFFFFF;
      border-right: 8px solid #FFFFFF;
      border-bottom: 48px solid transparent;
      color: #FFFFFF;
      position: absolute;
      z-index: 0;
      left: 0;
      bottom: 0;
      transition: transform .2s ease, color .2s ease, background-color 0.3s ease-out; }
    rs-tabset-headings._show-tab-shape rs-icon-tab-heading.is-selected .rs-icon-tab-heading--icon {
      color: #fff !important; }
    rs-tabset-headings._show-tab-shape rs-icon-tab-heading.is-selected .rs-icon-tab-heading--number-badge {
      display: none; }

.rs-tabset-headings--tab-headings {
  width: 100%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center;
  /*bg color added-as per new compressed view style*/
  background-color: #ECECEC;
  -ms-flex: 1 0 auto;
      flex: 1 0 auto;
  color: rgba(0, 0, 0, 0.38); }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        The tab-subheader component is used directly under a tab list. 
        
        It optionally has one button on the right-hand side.

        The text of the subheader should always summarize the content immediately following the tab.


        Structure
        
        tab-subheader
            --text
            --primary-btn (maybe)
    */
tab-subheader {
  display: -ms-flexbox;
  display: flex;
  width: 100%; }

.tab-subheader--text {
  font-size: 13px;
  font-weight: 500;
  color: #6D6D6D;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  margin-left: 24px; }

.tab-subheader--primary-btn {
  margin-left: auto;
  margin-right: 16px;
  height: 48px !important;
  width: 48px !important; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        The list-item-picker component.

        Todo: Add description here.

        HTML Structure:

        Todo: Document HTML Structure
        list-item-picker

    */
list-item-picker {
  display: -ms-flexbox;
  display: flex;
  background-color: #fff;
  border-top: 2px solid rgba(0, 0, 0, 0.12);
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 16px;
  font-weight: 300;
  font-weight: 500;
  width: 100%;
  height: auto;
  -ms-flex-direction: column;
      flex-direction: column; }

.list-item-picker {
  /*
        &--vanpool-icon {
            width: 40px;
            height: 40px;
            font-size: 24px;
            border-radius: 50%;
            padding: 8px 0px 0px 8px;
            color: #fff;
            background: rgb(92, 107, 192);
        }
        &--transit-icon {
            width: 40px;
            height: 40px;
            font-size: 24px;
            border-radius: 50%;
            padding: 8px 0px 0px 8px;
            color: #fff;
            background: rgb(187, 66, 66);
        }
        &--cycling-icon {
            width: 40px;
            height: 40px;
            font-size: 24px;
            border-radius: 50%;
            padding: 8px 0px 0px 8px;
            color: #fff;
            background: rgb(38, 166, 154);
            //rgb(239, 83, 80);
        }
        &--walking-icon {
            width: 40px;
            height: 40px;
            font-size: 24px;
            border-radius: 50%;
            padding: 8px 0px 0px 8px;
            color: #fff;
            background: rgb(239, 83, 80);
        }*/ }
  .list-item-picker--list-item {
    padding-left: 16px;
    height: 76px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    -ms-flex-align: center;
        align-items: center;
    border-bottom: 2px solid rgba(0, 0, 0, 0.12);
    color: rgba(0, 0, 0, 0.54);
    cursor: pointer; }
  .list-item-picker--list-icon {
    width: 40px;
    height: 40px;
    font-size: 24px;
    border-radius: 50%;
    padding: 8px 0px 0px 8px;
    color: #fff; }
  .list-item-picker--list-text {
    padding-left: 16px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    width: 300px; }
  .list-item-picker--list-label {
    width: auto;
    color: rgba(0, 0, 0, 0.87); }
  .list-item-picker--list-description {
    font-size: 14px;
    color: rgba(0, 0, 0, 0.54);
    width: auto; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
collection-item-picker {
  display: block; }

.collection-item-picker--dropdown {
  width: 100%;
  max-width: 224px; }

.collection-item-picker--dropdown-title {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center; }

.collection-item-picker--dropdown-title .not-button, .collection-item-picker--dropdown-title .paper-list .list-group-item .secondary-text, .paper-list .list-group-item .collection-item-picker--dropdown-title .secondary-text {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center; }

.collection-item-picker--dropdown-title-text {
  max-width: 240px;
  color: #0070c9; }

.collection-item-picker--dropdown-down-arrow {
  font-size: 24px; }

.collection-item-picker--dropdown .paper-dropdown-content-wrapper {
  position: absolute;
  top: -20px;
  /*box-shadow: 0 10px 20px rgba(0, 0, 0, 0.16), 0 6px 6px rgba(0, 0, 0, 0.24);*/ }

.collection-item-picker--dropdown-content-title {
  height: 48px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  border-bottom: 1px solid #eeeeee;
  padding: 0 16px;
  margin: 0;
  font-size: 20px;
  font-weight: 500;
  color: #0070c9; }

.collection-item-picker--dropdown-list {
  padding: 0;
  margin: 0;
  overflow-x: hidden;
  /*background-color: white;*/ }

.collection-item-picker--dropdown-list-item {
  height: 48px;
  cursor: pointer;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  border-bottom: 1px solid #eeeeee;
  padding: 0 16px; }
  .collection-item-picker--dropdown-list-item:hover {
    background-color: #EEEEEE; }
  .collection-item-picker--dropdown-list-item.is-selected {
    background-color: #EEEEEE; }

.collection-item-picker--dropdown-list-item-text {
  margin: 0 16px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap; }

.collection-item-picker--dropdown-pinned-item {
  height: 48px;
  margin: auto; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
rs-horizontal-stepper {
  border-top: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  height: 60px; }

.rs-horizontal-stepper--step-dot {
  position: relative;
  background-color: #03a9f4;
  opacity: 0.38;
  border-radius: 50%;
  width: 16px;
  height: 16px;
  display: block;
  clear: both;
  z-index: 1;
  left: -45%; }

.rs-horizontal-stepper--step-dot-0 {
  left: 0%; }

.rs-horizontal-stepper--step-line {
  width: 100%;
  height: 4px;
  margin-top: 6px;
  background-color: #03a9f4;
  opacity: 0.38;
  position: relative;
  left: -45%; }

.rs-horizontal-stepper--step-text {
  width: 50%;
  margin: 8px auto 4px auto; }

.rs-horizontal-stepper--step-primary-text {
  color: #808080;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
      justify-content: center; }

.rs-horizontal-stepper--progress-container {
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  -ms-flex-pack: center;
      justify-content: center; }

.rs-horizontal-stepper--step {
  cursor: pointer;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  width: 33.3333%; }
  .rs-horizontal-stepper--step:hover {
    background-color: #ececec;
    transition: background-color 0.3s ease; }
  .rs-horizontal-stepper--step.is-active .rs-horizontal-stepper {
    /*Brand primary with 38% opacity*/ }
    .rs-horizontal-stepper--step.is-active .rs-horizontal-stepper--step-primary-text {
      /*color: rgba(0,0,0,0.87);*/
      color: #03a9f4; }
    .rs-horizontal-stepper--step.is-active .rs-horizontal-stepper--step-dot {
      /*background-color: $brand-primary-38-opaque;*/
      background-color: #03a9f4;
      opacity: 1.0;
      transition: background-color 1.0s ease; }
    .rs-horizontal-stepper--step.is-active .rs-horizontal-stepper--step-line {
      /*background-color: $brand-primary-38-opaque;*/
      background-color: #03a9f4;
      opacity: 1.0;
      transition: background-color 1.0s ease; }
  .rs-horizontal-stepper--step.is-completed .rs-horizontal-stepper--step-primary-text {
    color: rgba(0, 0, 0, 0.87); }
  .rs-horizontal-stepper--step.is-completed .rs-horizontal-stepper--step-dot {
    background-color: #03a9f4;
    opacity: 1.0;
    transition: background-color 1.0s ease; }
  .rs-horizontal-stepper--step.is-completed .rs-horizontal-stepper--step-line {
    background-color: #03a9f4;
    opacity: 1.0;
    transition: background-color 1.0s ease; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The empty-state component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		empty-state

	*/
empty-state {
  display: block;
  position: relative; }
  empty-state._progress-bar-position {
    width: 100%;
    margin-top: 16px; }
  empty-state._ie-resize {
    width: 480px; }

.empty-state--label {
  color: rgba(0, 0, 0, 0.54);
  line-height: 28px;
  margin: 16px;
  text-align: center; }

.empty-state--description {
  display: block;
  margin: 16px;
  font-size: 16px;
  color: rgba(0, 0, 0, 0.38);
  text-align: center; }

.empty-state--button-positioner {
  /*position: absolute;
            top:0;
            left:0;
            right:0;
            bottom:0;
            z-index:1;
            display:flex;*/ }

.empty-state--button {
  margin: 16px; }

.empty-state--progress {
  text-align: center;
  margin: 0 auto; }

.empty-state--image-container {
  margin: 16px;
  max-width: 300px;
  max-height: 300px; }

.empty-state--image {
  width: 100%; }
  .empty-state--image._show-image {
    display: none; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
rs-tabset {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column; }
  rs-tabset._no-tab-shadow rs-tabset-headings {
    border-bottom: 0px;
    box-shadow: none; }
  rs-tabset._no-tab-shadow .rs-tab--content {
    background-color: #fff; }

.rs-tabset--tabset-headings {
  -ms-flex: 0 0 auto;
      flex: 0 0 auto; }

.rs-tabset--body {
  -ms-flex: 1 1 auto;
      flex: 1 1 auto; }

.rs-tabset--tab-heading-btn {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  background-color: transparent;
  -webkit-border-fit: border !important;
  padding: 0;
  width: 100%;
  height: 100%;
  text-transform: uppercase; }
  .rs-tabset--tab-heading-btn:focus {
    outline: none; }
  .rs-tabset--tab-heading-btn::-moz-focus-inner {
    border: none;
    /* overrides extra padding in Firefox */ }
  .rs-tabset--tab-heading-btn:focus {
    border-bottom: 2px solid #0286c2; }

.rs-tabset--tab-heading-btn-badge {
  background-color: #00C853;
  color: #FFFFFF;
  border-radius: 8px;
  min-width: 16px;
  font-size: 12px;
  text-align: center;
  padding: 0px 5px;
  position: absolute;
  top: 8px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The rs-accordion component.

		Contains the trip-itinerary-picker component and 
        two bars (dividers) at top and bottom of the trip-itinerary-picker
        and a button to expand/collapse its content
            
		HTML Structure:

		rs-accordion
            --> top divider
            --> content (both summary, and content)
                -- two rows of input boxes for origin/destination addresses,
                -- radio buttons for single or recurring trips,
                -- input for displaying date/time schedule
            --> bottom divider with button (aligned right)

	*/
rs-accordion {
  display: block;
  width: 100%;
  position: relative;
  padding: 8px 0;
  min-height: 40px;
  overflow: hidden; }
  rs-accordion._min-height-100 {
    min-height: 100px; }
  rs-accordion.is-open {
    overflow: visible; }
    rs-accordion.is-open .rs-accordion--content-area-wrapper {
      overflow-y: visible; }
  rs-accordion._hide-chrome .rs-accordion--divider {
    transform: scale(1, 0); }
  rs-accordion._hide-chrome .rs-accordion--toggle-panel-button {
    transform: scale(0, 0);
    opacity: 0; }

.rs-accordion--divider {
  height: 8px;
  width: 100%;
  background-color: #dedede;
  text-align: right;
  position: absolute;
  z-index: 0;
  transform: scale(1, 1);
  transition: transform 0.2s ease-in-out, background-color 0.3s ease-out 0s;
  transition-delay: 0s; }
  .rs-accordion--divider.alt--top {
    position: absolute;
    top: 0;
    left: 0; }
  .rs-accordion--divider.alt--bottom {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 1; }
    .rs-accordion--divider.alt--bottom.alt-is--closed {
      transform: scale(1, 40);
      transition: transform 0.2s ease-in-out 0.4s, background-color 0.3s ease-out 0s; }

.rs-accordion--content-area-wrapper {
  height: auto;
  overflow-y: hidden; }
  .rs-accordion--content-area-wrapper .rs-accordion--content-area {
    transition: all 0.4s ease-in-out, opacity 0.2s ease-in-out 0.3s; }
  .rs-accordion--content-area-wrapper.alt-is--open {
    z-index: 2;
    position: relative; }
    .rs-accordion--content-area-wrapper.alt-is--open .rs-accordion--content-area {
      max-height: 1000px;
      opacity: 1; }
  .rs-accordion--content-area-wrapper.alt-is--closed .rs-accordion--content-area {
    max-height: 0px;
    opacity: 0; }

.rs-accordion--toggle-panel-button {
  opacity: 1;
  position: absolute;
  right: 8px;
  z-index: 3;
  bottom: 0;
  transition: transform 0.2s ease-in-out, opacity 0.1s ease-in; }
  .rs-accordion--toggle-panel-button.alt-is--not-available {
    transform: scale(0, 0);
    opacity: 0; }
  .rs-accordion--toggle-panel-button.icon-button {
    background-color: #dedede;
    transition: background-color 0.3s ease-out 0s;
    color: #fff;
    width: 40px;
    height: 40px; }

.rs-accordion--toggle-icon.rs-icon._show-more {
  color: #FFFFFF;
  margin: 8px;
  /*adjusted icon margin based on design width: 40px*/ }

.rs-accordion--toggle-icon.rs-icon._show-less {
  color: #FFFFFF;
  margin: 8px;
  /*adjusted icon margin based on design width: 40px*/ }

.rs-accordion--content-area {
  position: relative;
  z-index: 1;
  padding: 0 8px;
  opacity: 1;
  transition: opacity 0.2s ease-in-out; }
  .rs-accordion--content-area.alt--summary {
    z-index: 2;
    padding: 8px;
    position: absolute;
    top: 0; }
  .rs-accordion--content-area.alt-is--open {
    display: block; }
  .rs-accordion--content-area.alt-is--closed {
    opacity: 0; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The trip-search-result-list component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		trip-search-result-list
	*/
trip-search-result-list {
  max-height: 100%;
  display: block;
  width: 100%; }
  trip-search-result-list._horizontal {
    height: auto;
    max-height: unset; }
    trip-search-result-list._horizontal .trip-search-result-list.--grouped-results {
      width: 100%;
      height: auto; }
    trip-search-result-list._horizontal .trip-search-result-list--grouped-results-list {
      height: auto; }
      trip-search-result-list._horizontal .trip-search-result-list--grouped-results-list-hrepeat {
        height: 205px !important;
        width: 100%; }
        trip-search-result-list._horizontal .trip-search-result-list--grouped-results-list-hrepeat .md-virtual-repeat-offsetter {
          display: -ms-flexbox;
          display: flex;
          -ms-flex-direction: column;
              flex-direction: column; }
        trip-search-result-list._horizontal .trip-search-result-list--grouped-results-list-hrepeat .md-virtual-repeat-sizer {
          width: 100%;
          height: auto !important; }
        trip-search-result-list._horizontal .trip-search-result-list--grouped-results-list-hrepeat .md-virtual-repeat-container.md-orient-horizontal .md-virtual-repeat-scroller {
          overflow-x: hidden;
          overflow-y: auto; }

.trip-search-result-list--grouped-results-container {
  height: 100%;
  width: 100%;
  overflow-y: auto;
  position: relative;
  overflow-y: auto;
  -ms-overflow-style: -ms-autohiding-scrollbar;
  /* Set width */
  /* Track */
  /* Handle */ }
  .trip-search-result-list--grouped-results-container::-webkit-scrollbar {
    width: 8px; }
  .trip-search-result-list--grouped-results-container::-webkit-scrollbar-track {
    display: none; }
  .trip-search-result-list--grouped-results-container::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: rgba(200, 200, 200, 0.8);
    box-shadow: inset 0 0 6px rgba(200, 200, 200, 0.8); }
  .trip-search-result-list--grouped-results-container::-webkit-scrollbar-thumb:window-inactive {
    background: rgba(201, 201, 201, 0.8); }

.trip-search-result-list--grouped-results {
  height: 100%; }
  .trip-search-result-list--grouped-results.alt-horizontal {
    width: 100%;
    height: auto; }
    .trip-search-result-list--grouped-results.alt-horizontal .trip-search-result-list--grouped-results-list-vrepeat {
      height: auto;
      width: 100%; }
    .trip-search-result-list--grouped-results.alt-horizontal .trip-search-result-list--grouped-results-list-hrepeat {
      height: 100%;
      width: auto; }

.trip-search-result-list--grouped-results-list {
  height: 100%; }
  .trip-search-result-list--grouped-results-list-vrepeat {
    height: 100%; }
  .trip-search-result-list--grouped-results-list-trip-post {
    min-height: 86px;
    max-height: 86px; }
    .trip-search-result-list--grouped-results-list-trip-post._in-admin-mode {
      min-height: 186px;
      max-height: 186px; }
  .trip-search-result-list--grouped-results-list-vanpool {
    min-height: 68px;
    max-height: 68px;
    border-bottom: solid 1px #F2F2F2; }
    @media screen and (max-width: 420px) {
      .trip-search-result-list--grouped-results-list-vanpool {
        min-height: 120px;
        max-height: 120px; }
        .trip-search-result-list--grouped-results-list-vanpool .ts-vanpool-search-result--container {
          height: 120px; } }
    .trip-search-result-list--grouped-results-list-vanpool:nth-child(1) {
      border-top: solid 1px #F2F2F2; }
  .trip-search-result-list--grouped-results-list-directions {
    min-height: 68px; }
  .trip-search-result-list--grouped-results-list-transit-direction {
    min-height: 90px; }
  .trip-search-result-list--grouped-results-list.alt--trip-posts-hide-addresses .trip-search-result-list--grouped-results-list-trip-post {
    min-height: 86px;
    max-height: 86px; }
    .trip-search-result-list--grouped-results-list.alt--trip-posts-hide-addresses .trip-search-result-list--grouped-results-list-trip-post._in-admin-mode {
      min-height: 186px;
      max-height: 186px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The trip-post-search-result component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		trip-post-search-result

	*/
trip-post-search-result {
  display: block;
  display: -ms-flexbox;
  display: flex;
  position: relative;
  max-width: 100%;
  -ms-flex-direction: column;
      flex-direction: column; }
  trip-post-search-result._trip-posts-hide-addresses trip-listing-display {
    padding: 8px 0; }

.trip-post-search-result--loading-circular {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin-left: auto;
  margin-right: auto;
  margin-top: auto;
  margin-bottom: auto !important; }

.trip-post-search-result--trip-listing-display {
  width: 100%; }

.trip-post-search-result--trip-listing-container {
  display: -ms-flexbox;
  display: flex; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The directions-search-result component.

		Contains a text summary of bike direction. User clicks to select detailed 
        trip direction.

		HTML Structure:

		directions-search-result
            --> div: search result wrapper
                --> text: route addresses
                --> text: travel distance and duration

	*/
directions-search-result {
  display: -ms-flexbox;
  display: flex; }

.directions-search-result {
  /*
        &--text-container-summary {}

        &--text-container-summary-travel-mode {
            font-size: 16px;
            color: rgba(0, 0, 0, 0.87);
        }

        &--text-container-details {
            padding-top: 4px;
        }

        &--text-container-details-distance {
            color: rgba(0, 0, 0, 0.54);
        }

        &--text-container-details-duration {
            color: rgba(0, 0, 0, 0.87);
        }*/ }
  .directions-search-result--wrapper {
    width: 100%;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    transition: background-color .2s ease; }
    .directions-search-result--wrapper:hover {
      background-color: rgba(3, 169, 244, 0.1);
      cursor: pointer; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**

        A trip-search-panel should ideally be styled with the _fill-vert modifier.


        Structure:


        trip-search-panel
            --header
                --back-buton
                --header-content-container
                    --header-label
                        --header-label-text .t-title
                        --header-label-carat
                    --trip-profile-picker OR --trip-profile-picker-no-trips-message

            --trip-search-itinerary
            --trip-mode-result-selection
            --results-container

    */
trip-search-panel {
  width: auto;
  display: -ms-flexbox;
  display: flex;
  width: 480px;
  background-color: #FAFAFA;
  -ms-flex-flow: column nowrap;
      flex-flow: column nowrap; }

.trip-search-panel--header {
  min-height: 72px;
  width: 100%;
  padding: 16px 0;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-negative: 0;
      flex-shrink: 0;
  background-color: white; }

.trip-search-panel--header-content-container {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  margin-left: 25px;
  width: 100%;
  height: 48px; }

.trip-search-panel--header-label {
  display: -ms-flexbox;
  display: flex;
  padding-right: 16px; }
  .trip-search-panel--header-label > .md-icon-button {
    margin-left: auto;
    font-size: 24px; }

.trip-search-panel--header-label-carat {
  font-size: 24px;
  cursor: pointer; }

.trip-search-panel--header-trip-profile-picker-trips-message {
  cursor: pointer; }

.trip-search-panel--trip-profile-selection {
  cursor: pointer; }

.trip-search-panel--header-post-btn {
  display: -ms-flexbox;
  display: flex;
  margin-right: 16px;
  margin-left: auto; }

.trip-search-panel--subheader {
  height: 40px;
  background-color: #E0E0E0; }

.trip-search-panel--parameters {
  background-color: white; }

.trip-search-panel--parameters-post-trip {
  display: none; }

.trip-search-panel--parameters-trip-search-itinerary {
  -ms-flex: 1 0 100%;
      flex: 1 0 100%;
  min-height: 140px; }

.trip-search-panel--trip-mode-selector-subhead {
  background-color: #e0e0e0;
  min-height: 32px;
  text-align: center;
  line-height: 32px; }

.trip-search-panel--parameters-trip-mode-result-selection {
  -ms-flex: 1 0 100%;
      flex: 1 0 100%;
  min-height: 140px; }

.trip-search-panel--results-container {
  -ms-flex: 1 1 100%;
      flex: 1 1 100%;
  /*padding-bottom: 16px;*/
  /*background-color:#eeeeee;*/
  /*overflow: hidden;
            margin-right: 8px;*/ }
  .trip-search-panel--results-container:hover {
    /*overflow: auto;
                margin-right: 0px;*/ }

.trip-search-panel--empty-state {
  text-align: center;
  padding: 24px; }

.trip-search-panel--results-container-result-list {
  height: 100%; }

.ripple {
  position: relative;
  overflow: hidden; }

.ripple:after {
  content: "";
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  pointer-events: none;
  background-image: radial-gradient(circle, #fff 10%, transparent 10.01%);
  background-repeat: no-repeat;
  background-position: 50%;
  transform: scale(10, 10);
  opacity: 0;
  transition: transform .5s, opacity 1s; }

.ripple:active:after {
  transform: scale(0, 0);
  opacity: .2;
  transition: 0s; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The trip-mode-selector component.

		Contains two rows of tabs, first row allowing the user to select the mode of transportation (car, bus ,etc), the second allowing the user to choose a sub-mode (passenger, rider, routes, etc.)

		HTML Structure:

		trip-mode-selector
            --primary-mode-tabs (rs-tabset-headings)
            --result-count-subheader (tab-subheader)
            --secondary-mode-tabs (rs-tabset-headings)

	*/
trip-mode-selector {
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; }

.trip-mode-selector--hierarchical-tabs-container, .trip-mode-selector--list-container, .trip-mode-selector--comparison-list-container {
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; }

.trip-mode-selector--hierarchical-tabs-container {
  /* fix for tab collapse - IE*/
  height: 137px; }

.trip-mode-selector--primary-mode-tabs {
  -ms-flex: 1 0 100%;
      flex: 1 0 100%;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.24);
  color: rgba(0, 0, 0, 0.54);
  z-index: 2; }

.trip-mode-selector--primary-mode-tab-heading {
  -ms-flex: 1;
      flex: 1;
  border-right: 1px solid #eeeeee; }
  .trip-mode-selector--primary-mode-tab-heading:hover {
    background-color: #eeeeee; }

.trip-mode-selector--result-count-subheader {
  -ms-flex: 1 0 100%;
      flex: 1 0 100%;
  -ms-flex-align: center;
      align-items: center;
  height: 40px;
  background-color: #E0E0E0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
  .trip-mode-selector--result-count-subheader button {
    height: 24px;
    color: rgba(0, 0, 0, 0.54); }

.trip-mode-selector--sub-mode-tabs {
  -ms-flex: 1 0 100%;
      flex: 1 0 100%;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  text-transform: uppercase; }

.trip-mode-selector--sub-mode-tab-heading {
  -ms-flex: 1;
      flex: 1; }
  .trip-mode-selector--sub-mode-tab-heading:hover {
    color: #03a9f4; }

/**
		The trip-mode-selector component.

		* This component displays the trip search options - carpool, vanpool, walking, etc

		HTML Structure:

		Document HTML Structure
         trip-mode-selector
            --tabs or buttons: trip search options - Carpool(passenger/driver), cycling, walking, transit,etc
                --> icon
                --> text
                --> subtext
	*/
trip-mode-selector {
  display: -ms-flexbox;
  display: flex;
  font-size: 100%;
  max-height: 100%;
  /*height overlap not allowing click for 1st trip listing result-IE fix*/
  width: 100%; }

.trip-mode-selector--container {
  width: 100%;
  height: 100%;
  font-size: 16px;
  background-color: #ECECEC;
  overflow: auto; }

.trip-mode-selector--commute-type-container {
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  background-color: #fff;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  width: 100%; }

.trip-mode-selector--impact-comparison-container {
  cursor: pointer; }
  .trip-mode-selector--impact-comparison-container:hover {
    background-color: #ececec; }

.trip-mode-selector--commute-option-container {
  height: 60px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  cursor: pointer;
  transition: background-color 0.3s ease; }
  .trip-mode-selector--commute-option-container:hover {
    background-color: #eeeeee; }

.trip-mode-selector--commute-icon {
  color: #fff;
  margin: 0 16px;
  display: -ms-flexbox;
  display: flex;
  font-size: 24px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  -ms-flex: 0 0 auto;
      flex: 0 0 auto;
  display: flex;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  -ms-flex-align: center;
      align-items: center;
  padding: 4px; }
  .trip-mode-selector--commute-icon._passenger-background {
    background-color: #ec9b42; }
  .trip-mode-selector--commute-icon._bicycle-background {
    background-color: #26A599; }
  .trip-mode-selector--commute-icon._walk-background {
    background-color: #EF5451; }
  .trip-mode-selector--commute-icon._van-background {
    background-color: #5C6BBF; }
  .trip-mode-selector--commute-icon._transit-background {
    background-color: #AA47BB; }

.trip-mode-selector--commute-result-number {
  /*padding: 0 8px;*/
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex: 0 0 50px;
      flex: 0 0 50px; }

.trip-mode-selector--commute-result-number-progress {
  -ms-flex-pack: center;
      justify-content: center;
  -ms-flex-align: center;
      align-items: center; }

.trip-mode-selector--commute-header {
  padding-bottom: 4px; }

.trip-mode-selector--commute-details {
  font-size: 13px;
  /*font-weight: 300;*/
  color: rgba(0, 0, 0, 0.54);
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
      justify-content: space-between; }

.trip-mode-selector--commute-type {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  width: 100%;
  overflow: hidden; }

.trip-mode-selector--commute-option-container {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  padding: 14px 0 14px 16px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  min-width: 72px;
  height: 60px;
  width: 50%;
  /* This places middle border*/ }
  .trip-mode-selector--commute-option-container:nth-child(odd) {
    border-right: 1px solid rgba(0, 0, 0, 0.12); }
  .trip-mode-selector--commute-option-container:active {
    background-color: #E0E0E0;
    cursor: pointer; }

.trip-mode-selector--impact-comparison-container {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  padding: 12px 0 12px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  min-width: 72px;
  height: 64px;
  width: 100%;
  /* This places middle border*/ }
  .trip-mode-selector--impact-comparison-container:nth-child(odd) {
    border-right: 1px solid rgba(0, 0, 0, 0.12); }
  .trip-mode-selector--impact-comparison-container:active {
    background-color: #E0E0E0;
    cursor: pointer; }

.trip-mode-selector--commute-text-holder {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  -ms-flex-pack: center;
      justify-content: center;
  padding: 0 16px;
  min-width: 300px;
  -ms-flex: 1 0 auto;
      flex: 1 0 auto; }

.trip-mode-selector--commute-header {
  font-size: 16px;
  line-height: 16px;
  padding-bottom: 4px; }

.trip-mode-selector--sub-text {
  color: rgba(0, 0, 0, 0.54);
  font-size: 14px;
  line-height: 16px; }

@media (max-width: 360px) {
  .trip-mode-selector--commute-option-container {
    width: 100%; }
  .trip-mode-selector--commute-option-container:nth-child(odd) {
    border-right: none; }
  .trip-mode-selector--commute-type {
    overflow-y: auto;
    overflow-x: hidden; } }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
contact-trip-profile-post-from-trip-search {
  display: block;
  display: -ms-flexbox;
  display: flex; }

.contact-trip-profile-post-from-trip-search--composer {
  width: 100%; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
trip-search-query-input {
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap; }

.trip-search-query-input--primary-mode-tabs {
  -ms-flex: 1 0 100%;
      flex: 1 0 100%;
  z-index: 2; }

.trip-search-query-input--primary-mode-tab-heading {
  -ms-flex: 1;
      flex: 1; }
  .trip-search-query-input--primary-mode-tab-heading:hover {
    background-color: #eeeeee; }

.trip-search-query-input--sub-mode-tabs {
  -ms-flex: 1 0 100%;
      flex: 1 0 100%;
  text-transform: uppercase; }

.trip-search-query-input--itinerary-picker.alt--showing-time-popover assorted-time-picker {
  min-height: 50px; }

.trip-search-query-input--itinerary-picker.alt--showing-time-popover .assorted-time-picker--picker-container {
  display: none; }

.trip-search-query-input--itinerary-picker.alt--hiding-time-picker .trip-itinerary-picker--time-picker {
  display: none; }

.trip-search-query-input--itinerary-picker.alt--hiding-time-options .assorted-time-picker--one-or-recurring-container {
  display: none; }

.trip-search-query-input--trip-type-popover {
  background: #c80000;
  position: absolute;
  color: #fff;
  height: 32px;
  padding: 6px;
  text-align: center;
  width: 220px;
  max-width: 100%;
  top: 105px;
  bottom: auto;
  left: 444px;
  font-size: 110%; }
  .trip-search-query-input--trip-type-popover:before {
    content: "";
    border: 16px solid transparent;
    position: absolute;
    width: 0px;
    top: 0px;
    height: 0px;
    left: -32px;
    border-right-color: #c80000; }

.trip-search-query-input--accordion-summary {
  color: #FFFFFF;
  padding-left: 16px;
  font-size: 16px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  width: 100%;
  height: 88px;
  font-size: 16px;
  -ms-flex-align: center;
      align-items: center; }

.trip-search-query-input--trip-info-wrapper {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  -ms-flex-pack: center;
      justify-content: center;
  width: 100%; }

.trip-search-query-input--trip-info-wrapper-route-icon {
  font-size: 16px;
  margin-right: 16px; }

.trip-search-query-input--trip-info-wrapper-route-icon-divider {
  height: 8px;
  width: 8px;
  border-left: 1px solid rgba(255, 255, 255, 0.3);
  margin-left: 7px; }

.trip-search-query-input--trip-info-wrapper-route-week-days {
  color: rgba(255, 255, 255, 0.7);
  font-size: 14px;
  padding: 4px 0 0 32px; }

.trip-search-query-input--trip-info-wrapper-route-week-days > span {
  color: rgba(255, 255, 255, 0.3); }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        Icon button is usually a square button. This button is used to define buttons where only an icon is
        visible.


        Html Usage:

        <button class="icon-button">
            <span class="rs-icon rs-icon-ICON_NAME"></span>
        </button>

        Branding Colors:

        <button class="icon-button brand-primary"></button>

        Modifiers:

            Flat Button
            <button class="icon-button mod--flat-button"></button>

            Raised Button
            <button class="icon-button mod--raised-button"></button>
        
            Size - 20px
            <button class="icon-button mod--raised-button"></button>
    */
.icon-button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  background-color: transparent;
  -webkit-border-fit: border !important;
  padding: 0;
  width: 48px;
  height: 48px; }
  .icon-button:focus {
    outline: none; }
  .icon-button::-moz-focus-inner {
    border: none;
    /* overrides extra padding in Firefox */ }
  .icon-button > .rs-icon {
    width: 24px;
    height: 24px;
    margin: 12px;
    font-size: 24px;
    color: rgba(0, 0, 0, 0.54);
    /*^The designer said that by default, most icons should be black with 54% opacity, other than dialog boxes that are white*/ }
  .icon-button._20px {
    width: 20px;
    height: 20px; }
    .icon-button._20px > .rs-icon {
      width: 16px;
      height: 16px;
      margin: 4px;
      font-size: 16px; }
    .icon-button._20px._no-margin > .rs-icon {
      width: 20px;
      height: 20px;
      margin: 0;
      font-size: 20px; }
  .icon-button._close-btn {
    width: 48px;
    height: 48px;
    -ms-flex-preferred-size: 48px;
        flex-basis: 48px;
    margin-left: auto; }
    .icon-button._close-btn > .rs-icon._exit {
      width: 24px;
      height: 24px;
      margin: 10px;
      font-size: 24px; }
  .icon-button._back-btn {
    width: 48px;
    height: 48px; }
    .icon-button._back-btn > .rs-icon {
      width: 24px;
      height: 24px;
      margin: 12px;
      font-size: 24px; }

/**

        .icon-button._back-btn {

        }


        .some-component-name
        {
         &--some-part-inside-the-component {
        color:RED:
        }
        }

        */
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.flat-button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  font-size: 14px;
  color: #6d6d6d;
  white-space: nowrap; }
  .flat-button.brand-primary {
    color: #03a9f4; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.raised-button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  font-size: 14px;
  white-space: nowrap; }
  .raised-button.brand-primary {
    color: #03a9f4; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        Presently, the address-picker component is a thin wrapper around a PTB.

        As more features are added, it is expected that a version not using a PTB
        will be developed.

        As such, this component "Breaks the rules" so to speak, to keep the PTB css ignorant of this component,
        and to make it easier to upgrade should the time arise.

        Ideally, the structure would follow more BEM style naming.


        .address-picker 
            --icon-column
                --icon-span
            --address-entry-column
                --ptb (<rs-ptb class="mod--address-picker"></rs-ptb>)
    */
address-picker {
  display: -ms-flexbox;
  display: flex;
  /*************************************************************
            Try to eliminate this bottom section as much as possible

        **************************************************************/
  /* Move the placeholder text slightly downwards while active */
  /* Sets text colour for form elements */
  /*When hovering over the list item results*/
  /*Moves the placeholder text slightly rightwards*/ }
  address-picker .address-picker--icon-span {
    font-size: 24px; }
    address-picker .address-picker--icon-span._initial-location {
      color: #00c853; }
    address-picker .address-picker--icon-span._end-location {
      color: #dd2c00; }
  address-picker .address-picker--icon-column {
    color: #5f5c5c;
    cursor: pointer;
    padding-top: 4px;
    -ms-flex: 0 0 auto;
        flex: 0 0 auto; }
  address-picker .address-picker--address-entry-column {
    width: 100%;
    margin-left: 32px;
    -ms-flex: 1 auto;
        flex: 1 auto; }
  address-picker .address-picker--ptb {
    cursor: pointer;
    width: 100%; }
    address-picker .address-picker--ptb.is-active {
      width: calc(100% - 58px); }
      address-picker .address-picker--ptb.is-active .address-picker--address-input {
        border-bottom: 2px solid #03a9f4; }
    address-picker .address-picker--ptb.text-field {
      transition: none; }
  address-picker .address-picker--address-input {
    height: 32px !important;
    background-color: #eeeeee !important;
    transition: background-color 0.3s ease; }
    address-picker .address-picker--address-input:hover {
      background-color: #e0e0e0 !important; }
  address-picker .text-field.text-field-ptb {
    padding: 0 !important; }
  address-picker .text-field.text-field-ptb .label {
    top: 0; }
  address-picker .text-field.text-field-ptb.is-active .label {
    top: 4px;
    padding-left: 12px; }
  address-picker .text-field .text-field-ptb .is-active .label .ng-hide {
    top: 0; }
  address-picker .text-field.text-field-ptb > input[type=text], address-picker .text-field.text-field-ptb input[type=tel],
  address-picker .text-field.text-field-ptb input[type=password], address-picker .text-field.text-field-ptb input[type=email] {
    /*background-color: #eeeeee;*/
    /*max-height: 29px !important;
            height: 29px;*/
    color: #0070c9 !important; }
    address-picker .text-field.text-field-ptb > input[type=text]:hover, address-picker .text-field.text-field-ptb input[type=tel]:hover,
    address-picker .text-field.text-field-ptb input[type=password]:hover, address-picker .text-field.text-field-ptb input[type=email]:hover {
      border: 1px solid #0070c9; }
  address-picker .text-field.text-field-ptb.is-active > input[type=text], address-picker .text-field.text-field-ptb.is-active input[type=tel],
  address-picker .text-field.text-field-ptb.is-active input[type=password], address-picker .text-field.text-field-ptb.is-active input[type=email] {
    /*background-color: #FFF;
            margin-top: 18px;
            margin-left: 0 !important;
            max-width: 100%;
            max-height: none;*/
    margin-bottom: 0 !important; }
  address-picker .text-field.text-field-ptb.with-icon > input[type=text], address-picker .text-field.text-field-ptb.with-icon input[type=tel],
  address-picker .text-field.text-field-ptb.with-icon input[type=password], address-picker .text-field.text-field-ptb.with-icon input[type=email] {
    padding-left: 8px;
    width: 352px;
    /*align-self: flex-start;*/ }
  address-picker .text-field.text-field-ptb .label.label-label {
    color: #a7a7a7;
    padding-top: 4px; }
  address-picker .text-field.text-field-ptb.is-active .autocomplete-suggestion-list .list-group-item {
    transition: all 0.3s ease;
    -moz-transition: all 0.3s ease; }
    address-picker .text-field.text-field-ptb.is-active .autocomplete-suggestion-list .list-group-item:hover {
      background-color: #eeeeee; }
  address-picker .text-field.text-field-ptb:hover {
    background-color: rgba(0, 0, 0, 0); }
  address-picker .text-field.text-field-ptb .text-field-inset-icon {
    font-size: 24px;
    left: 4px; }
  address-picker .text-field.text-field-ptb.with-icon .label {
    left: 6px; }
  address-picker .text-field-highlight {
    color: #a6a6a6; }
  address-picker .paper-button {
    width: 0 !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important; }
  address-picker .paper-button-flat {
    width: 0 !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important; }
  address-picker .text-field.text-field-ptb.is-active .autocomplete-suggestion-list {
    margin-top: 0; }

/* Sets the position to be relative so that its child parents can be absolute and won't stick to the top. */
.trip-address-picker--address-picker {
  position: relative;
  min-height: 44px; }

.label .label-inset .label-label .ng-binding {
  margin-left: 46px; }

.text-field.text-field-ptb .underline {
  display: none !important; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The trip-mode-result-selection component.

		

		HTML Structure:

		trip-mode-result-selection

	*/
ts-vanpool-search-result {
  display: block;
  width: 100%;
  position: relative;
  height: auto; }

.ts-vanpool-search-result--container {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
      flex-wrap: nowrap;
  -ms-flex: 1 0 auto;
      flex: 1 0 auto;
  cursor: pointer; }
  @media screen and (max-width: 420px) {
    .ts-vanpool-search-result--container {
      -ms-flex-wrap: wrap;
          flex-wrap: wrap; } }
  .ts-vanpool-search-result--container:hover {
    background-color: #F0F0F0; }
  .ts-vanpool-search-result--container:active {
    background-color: #EBEBEB; }

.ts-vanpool-search-result--pin-container {
  -ms-flex: 1 0 auto;
      flex: 1 0 auto;
  max-width: 28px;
  /* max-width and width need to be the same here */
  width: 28px;
  margin: 0 16px 0 0;
  /* This is actually for moving the text right 16px, not the icon */ }
  .ts-vanpool-search-result--pin-container-pin {
    top: 12px !important;
    left: 0 !important;
    width: 28px;
    margin: 0 0 0 8px; }

.ts-vanpool-search-result--details-container {
  -ms-flex: 1 0 auto;
      flex: 1 0 auto;
  padding: 0 8px 0 8px; }
  .ts-vanpool-search-result--details-container .ts-vanpool-search-result--details-container-bottom-schedule-info .ts-vanpool-search-result--details-container-bottom {
    display: -ms-flexbox;
    display: flex;
    width: 100%; }

.ts-vanpool-search-result--details-container-top {
  height: 34px;
  display: -ms-flexbox;
  display: flex; }

.ts-vanpool-search-result--details-container-bottom {
  height: 34px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
      justify-content: space-between; }
  .ts-vanpool-search-result--details-container-bottom .type-result-data {
    padding: 0 0 2px 0; }

.ts-vanpool-search-result--join-section {
  -ms-flex: 0 0 145px;
      flex: 0 0 145px;
  padding: 16px 0 0 0;
  border-left: solid 1px #F2F2F2;
  width: 145px;
  /* If this height is changed, also change the height in .trip-search-result-list--grouped-results-list-vanpool*/
  height: 68px; }
  @media screen and (max-width: 420px) {
    .ts-vanpool-search-result--join-section {
      -ms-flex-positive: 1;
          flex-grow: 1; }
      .ts-vanpool-search-result--join-section .vanpool-capacity-summary .bottom-half {
        padding-left: 8px; } }
  .ts-vanpool-search-result--join-section .pull-right {
    padding: 1px 0 0 8px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.trip-search-index-page {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  overflow-y: visible;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  height: 100%;
  background-color: #FAFAFA;
  /*
        &--one-time-rideshare-reservation-editor-overlay-card {
            position: fixed;
            top: 0;
            left: 0;
            bottom: 0;
            right: 0;
            z-index: 2;
            background-color: #fff;
            box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.28);
        }*/ }
  .trip-search-index-page [class*="overlay-card"]:not(.is-hidden) ~ trip-search-panel .trip-search-query-input--trip-type-popover {
    display: none; }
  .trip-search-index-page--post-trip-btn {
    position: absolute;
    z-index: 3;
    left: 350px;
    top: 16px; }
  .trip-search-index-page--trip-search-panel {
    z-index: 1;
    -ms-flex: 0 0 auto;
        flex: 0 0 auto; }
    .trip-search-index-page--trip-search-panel:focus {
      outline: none; }
  .trip-search-index-page--results-container {
    -ms-flex: 1 0 auto;
        flex: 1 0 auto;
    display: -ms-flexbox;
    display: flex; }
  .trip-search-index-page--results-container-result-list {
    -ms-flex: 1 0 auto;
        flex: 1 0 auto; }
  .trip-search-index-page--advanced-trip-search-overlay-card {
    position: absolute;
    top: 200px;
    left: 20px;
    z-index: 2;
    width: 480px; }
  .trip-search-index-page--trip-post-overlay-card, .trip-search-index-page--vanpool-overlay-card, .trip-search-index-page--vanpool-membership-overlay-card, .trip-search-index-page--map-directions-overlay-card, .trip-search-index-page--one-time-rideshare-reservation-editor-overlay-card, .trip-search-index-page--contact-trip-post-from-trip-search-overlay-card {
    /*top: 35.7%;
            left: 56px;*/
    z-index: 10;
    background-color: #fff;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.28); }
  .trip-search-index-page--vanpool-overlay-card, .trip-search-index-page--vanpool-membership-overlay-card, .trip-search-index-page--map-directions-overlay-card, .trip-search-index-page--one-time-rideshare-reservation-editor-overlay-card, .trip-search-index-page--contact-trip-post-from-trip-search-overlay-card {
    position: absolute; }
  .trip-search-index-page--vanpool-overlay-card._card-position {
    top: 0;
    /*this moves card to top - IE fix*/
    bottom: 0;
    width: 100%; }
  .trip-search-index-page--vanpool-membership-overlay-card {
    z-index: 33; }
  .trip-search-index-page--trip-post-overlay-card {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex-align: end;
        align-items: flex-end;
    background-color: #fafafa; }
  .trip-search-index-page--contact-trip-post-from-trip-search-overlay-card {
    min-width: 440px;
    bottom: 40px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The advanced-trip-search-overlay-card component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		advanced-trip-search-overlay-card
	*/
advanced-trip-search-overlay-card {
  display: -ms-flexbox;
  display: flex;
  background-color: #ffffff;
  -ms-flex-direction: column;
      flex-direction: column;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  padding: 16px;
  /*card position update*/ }
  advanced-trip-search-overlay-card.is-hidden {
    display: none; }
  advanced-trip-search-overlay-card._drawer-style {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out 0.1s; }
    advanced-trip-search-overlay-card._drawer-style.is-hidden {
      display: -ms-flexbox;
      display: flex;
      opacity: 0;
      transform: translateX(-100%); }
    advanced-trip-search-overlay-card._drawer-style:not(.is-hidden) {
      opacity: 1;
      transform: translateX(0); }
  advanced-trip-search-overlay-card._card-update {
    top: 24px;
    border: 1px solid #fafafa; }

.advanced-trip-search-overlay-card--heading {
  -ms-flex: 1 0 100%;
      flex: 1 0 100%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  padding: 0 0 16px 0;
  /*IE collapse fix*/
  height: 96px; }

.advanced-trip-search-overlay-card--title {
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1 0 100%;
      flex: 1 0 100%;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: justify;
      justify-content: space-between;
  /*IE collapse fix*/
  max-height: 48px; }
  .advanced-trip-search-overlay-card--title .icon-button {
    width: 24px !important;
    height: 24px !important;
    margin: 0 !important; }
    .advanced-trip-search-overlay-card--title .icon-button > .rs-icon {
      width: 24px;
      height: 24px;
      margin: 0 !important;
      color: #898989; }
      .advanced-trip-search-overlay-card--title .icon-button > .rs-icon:hover {
        color: #000000; }

.advanced-trip-search-overlay-card--subtitle {
  /*IE collapse fix*/
  line-height: 48px; }
  .advanced-trip-search-overlay-card--subtitle .t-subheading {
    color: #898989 !important;
    font-size: 14px !important; }

.advanced-trip-search-overlay-card--advanced-trip-search-panel {
  -ms-flex: 1 0 100%;
      flex: 1 0 100%; }

.advanced-trip-search-overlay-card--bottom-buttons-panel {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: end;
      justify-content: flex-end; }
  .advanced-trip-search-overlay-card--bottom-buttons-panel .advanced-trip-search-overlay-card--close-button {
    color: #03a9f4; }
    .advanced-trip-search-overlay-card--bottom-buttons-panel .advanced-trip-search-overlay-card--close-button:hover {
      color: initial; }
  .advanced-trip-search-overlay-card--bottom-buttons-panel .advanced-trip-search-overlay-card--apply-button {
    color: #03a9f4; }
    .advanced-trip-search-overlay-card--bottom-buttons-panel .advanced-trip-search-overlay-card--apply-button:hover {
      color: initial; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
contact-trip-post-overlay-card {
  display: block;
  display: -ms-flexbox;
  display: flex; }
  contact-trip-post-overlay-card.is-hidden {
    display: none; }
  contact-trip-post-overlay-card._drawer-style {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out 0.1s; }
    contact-trip-post-overlay-card._drawer-style.is-hidden {
      display: -ms-flexbox;
      display: flex;
      opacity: 0;
      transform: translateX(-100%); }
    contact-trip-post-overlay-card._drawer-style:not(.is-hidden) {
      opacity: 1;
      transform: translateX(0); }

.contact-trip-post-overlay-card--contact-form {
  width: 100%; }

.contact-trip-post-overlay-card--light-box {
  background-color: rgba(0, 0, 0, 0.54);
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100vw; }

.contact-trip-post-overlay-card--contact-form {
  width: 100%;
  max-width: 440px;
  border-radius: 2px;
  background-color: #FFF;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 0px 0px 24px rgba(0, 0, 0, 0.24); }

contact-trip-post-from-trip-search-overlay-card {
  display: block;
  display: -ms-flexbox;
  display: flex; }
  contact-trip-post-from-trip-search-overlay-card.is-hidden {
    display: none; }
  contact-trip-post-from-trip-search-overlay-card._drawer-style {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out 0.1s; }
    contact-trip-post-from-trip-search-overlay-card._drawer-style.is-hidden {
      display: -ms-flexbox;
      display: flex;
      opacity: 0;
      transform: translateX(-100%); }
    contact-trip-post-from-trip-search-overlay-card._drawer-style:not(.is-hidden) {
      opacity: 1;
      transform: translateX(0); }

.contact-trip-post-from-trip-search-overlay-card--contact-form {
  /* .trip-profile-match-email-composer {
                &--action-area {
                    button.btn.paper-button.paper-button-raised.btn-primary {
                        background-color: transparent;
                        box-shadow: none;
                        color: $brand-primary !important;

                        &:hover {
                            box-shadow: none !important;
                            background-color: #e6e6e6;
                        }
                        &:active {
                            box-shadow: none !important;
                            background-color: #d9d9d9;
                        }
                        &:focus {
                            box-shadow: none !important;
                            background-color: #d9d9d9;
                        }
                    }
                }
            }*/ }

.contact-trip-post-from-trip-search-overlay-card--light-box {
  background-color: rgba(0, 0, 0, 0.54);
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100vw; }

.contact-trip-post-from-trip-search-overlay-card--contact-form {
  width: 100%;
  max-width: 440px;
  border-radius: 2px;
  background-color: #FFF;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 0px 0px 24px rgba(0, 0, 0, 0.24); }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
trip-search-admin-controls {
  display: block;
  position: fixed;
  z-index: 2000;
  background-color: #fff;
  box-shadow: 0px 20px 32px -1px rgba(0, 0, 0, 0.52); }

.trip-search-admin-controls--heading {
  margin: 0 !important;
  padding: 16px !important;
  background-color: #242424 !important;
  color: #fff !important;
  font-weight: 500;
  cursor: move;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none; }

.trip-search-admin-controls--print-btn .rs-icon {
  margin-right: 8px; }

.trip-search-admin-controls--minimize-control {
  background-color: #03a9f4;
  padding: 8px 12px;
  color: #fff !important;
  cursor: pointer; }
  .trip-search-admin-controls--minimize-control-label {
    color: #fff !important; }
  .trip-search-admin-controls--minimize-control .rs-icon {
    margin: auto;
    color: #fff; }

.trip-search-admin-controls--pages {
  height: 330px;
  overflow-y: hidden;
  transition: height 0.2s ease-in-out; }
  .trip-search-admin-controls--pages.is-collapsed {
    height: 0; }

.trip-search-admin-controls--lists {
  padding: 16px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**

        This component is used to show the tabs for a TabbedInstructionsViewer

        TabbedInstructionsTabs
            -tab (repeated)    // There is one of these for each tab. Only one has the is-selected state applied.
                is-selected (on/off)
    */
.TabbedInstructionsTabs {
  width: 204px;
  vertical-align: middle;
  font-size: 16px;
  position: relative;
  transition: .1s all ease;
  box-shadow: 1px 4px 7px 0px #bdbdbd;
  z-index: 10;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column; }
  .TabbedInstructionsTabs-tab {
    padding: 16px;
    font-size: 14px;
    cursor: pointer;
    display: inline;
    background-color: white;
    font-family: Roboto;
    font-weight: 400;
    color: rgba(0, 0, 0, 0.87);
    border-bottom: 1px solid #eeeeee; }
    .TabbedInstructionsTabs-tab:hover {
      opacity: 1;
      background-color: rgba(3, 169, 244, 0.12); }
    .TabbedInstructionsTabs-tab.is-selected {
      opacity: 1;
      background-color: rgba(3, 169, 244, 0.12) !important; }
  .TabbedInstructionsTabs-subtitle {
    color: rgba(0, 0, 0, 0.54);
    line-height: 24px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**

        This component is used to show the actual content of an instructions panel

        TabbedInstructionsContent
            -contentContainer (repeated)    // There is one of these for each instruction, only one is shown at a time however.
                -content --summary          // The summary content
                -content --body             // The body content
    */
.TabbedInstructionsContent {
  position: relative;
  transition: .2s ease max-height;
  overflow: hidden;
  background-color: #eeeeee; }
  .TabbedInstructionsContent-heading {
    height: 48px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center; }
  .TabbedInstructionsContent-title {
    padding: 8px 16px; }
  .TabbedInstructionsContent-contentContainer {
    padding: 16px;
    margin: 16px;
    background-color: white;
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23); }
  .TabbedInstructionsContent.is-hidden {
    max-height: 0; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        This class is applied to the modal which is shown in the 'See More' button of TabbedInstructionsViewer

        TabbedInstructionsModal
            -title
            -content (TabbedInstructionsViewer)
    */
.TabbedInstructionsModal:before, .TabbedInstructionsModal:after {
  content: " ";
  display: table; }

.TabbedInstructionsModal:after {
  clear: both; }

.TabbedInstructionsModal-title {
  position: relative;
  padding: 16px;
  color: #fff; }
  .TabbedInstructionsModal-title:before, .TabbedInstructionsModal-title:after {
    content: " ";
    display: table; }
  .TabbedInstructionsModal-title:after {
    clear: both; }

.TabbedInstructionsModal-titleText {
  display: inline-block;
  float: left;
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 16px; }

.TabbedInstructionsModal-closeBtn {
  display: inline-block;
  position: absolute;
  top: 0;
  right: 0;
  float: right;
  padding: 16px;
  cursor: pointer; }
  .TabbedInstructionsModal-closeBtn:hover {
    background-color: rgba(0, 0, 0, 0.2); }

.TabbedInstructionsModal-content {
  float: left;
  width: 100%; }

/**
        This is used to show tabbed instructions for Incentives, and any other feature which requires it.

        TabbedInstructionsViewer
            -tabList (TabbedInstructionsTabs)
            -contentList (TabbedInstructionsContent)
            -buttons
                button "Hide"
                button "See More"
    */
.TabbedInstructionsViewer:before, .TabbedInstructionsViewer:after {
  content: " ";
  display: table; }

.TabbedInstructionsViewer:after {
  clear: both; }

.TabbedInstructionsViewer-sideNav {
  position: relative;
  z-index: 1;
  transition: 0.2s ease all; }
  .TabbedInstructionsViewer-sideNav.isCollapsed {
    right: 204px; }
    .TabbedInstructionsViewer-sideNav.isCollapsed .TabbedInstructionsViewer-tabList {
      display: none; }

.TabbedInstructionsViewer-toggle {
  position: absolute;
  right: -24px;
  top: 8px;
  height: 72px;
  width: 24px;
  background-color: white;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: center;
      justify-content: center;
  cursor: pointer; }

.TabbedInstructionsViewer-tabList {
  float: left;
  background-color: white !important; }

.TabbedInstructionsViewer-body {
  width: 100%;
  height: 100%;
  float: left;
  clear: left;
  box-shadow: 1px 2px 7px 0 #bdbdbd;
  background-color: white;
  z-index: 100; }

.TabbedInstructionsViewer-contentList {
  width: 100%;
  height: 100%;
  overflow: hidden; }

.TabbedInstructionsViewer-contentList:hover {
  overflow: auto; }

.TabbedInstructionsViewer-buttons {
  width: 100%;
  float: left;
  clear: left;
  padding-bottom: 8px; }

.TabbedInstructionsViewer.TabbedInstructionsViewer--expanded {
  max-height: none; }
  .TabbedInstructionsViewer.TabbedInstructionsViewer--expanded .TabbedInstructionsViewer-contentList {
    max-height: 600px;
    overflow-y: auto; }
  .TabbedInstructionsViewer.TabbedInstructionsViewer--expanded .TabbedInstructionsViewer-buttons {
    display: none; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The vanpool-overlay-card component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		vanpool-overlay-card

	*/
vanpool-overlay-card {
  display: -ms-flexbox;
  display: flex;
  position: relative;
  background-color: #fff;
  -ms-flex-direction: column;
      flex-direction: column; }
  vanpool-overlay-card.is-hidden {
    display: none; }
  vanpool-overlay-card._drawer-style {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out 0.1s; }
    vanpool-overlay-card._drawer-style.is-hidden {
      display: -ms-flexbox;
      display: flex;
      opacity: 0;
      transform: translateX(-100%); }
    vanpool-overlay-card._drawer-style:not(.is-hidden) {
      opacity: 1;
      transform: translateX(0); }
  vanpool-overlay-card._card-position {
    /*This applies updated design to vanpool display*/ }
    vanpool-overlay-card._card-position vanpool-display .paper-card {
      width: 100%;
      box-shadow: none;
      border: none; }
      vanpool-overlay-card._card-position vanpool-display .paper-card .paper-tabs .tab-content {
        height: auto; }
      vanpool-overlay-card._card-position vanpool-display .paper-card rs-tabset {
        font-size: 12px; }
      vanpool-overlay-card._card-position vanpool-display .paper-card .rs-tabset--body {
        padding: 0 16px; }
    vanpool-overlay-card._card-position vanpool-display .absolute-bottom-action-area {
      padding: 24px 16px 0 0;
      position: relative; }
    vanpool-overlay-card._card-position .vanpool-overlay-card--close-flat-btn {
      display: none; }

.vanpool-overlay-card--header {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  border-bottom: 1px solid #e0e0e0; }

.vanpool-overlay-card--header-text {
  padding-left: 16px; }

.vanpool-overlay-card--close-icon-btn {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2; }

.vanpool-overlay-card--close-flat-btn {
  position: absolute;
  bottom: 16px;
  left: 16px; }

.vanpool-overlay-card--vanpool-display {
  width: 100%; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The vanpool-membership-overlay-card component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		vanpool-membership-overlay-card

	*/
vanpool-membership-overlay-card {
  display: -ms-flexbox;
  display: flex;
  position: relative;
  background-color: #fff; }
  vanpool-membership-overlay-card.is-hidden {
    display: none; }
  vanpool-membership-overlay-card._drawer-style {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out 0.1s; }
    vanpool-membership-overlay-card._drawer-style.is-hidden {
      display: -ms-flexbox;
      display: flex;
      opacity: 0;
      transform: translateX(-100%); }
    vanpool-membership-overlay-card._drawer-style:not(.is-hidden) {
      opacity: 1;
      transform: translateX(0); }

.vanpool-membership-overlay-card--close-icon-btn {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2; }

.vanpool-membership-overlay-card--close-flat-btn {
  position: absolute;
  bottom: 16px;
  left: 16px; }

.vanpool-membership-overlay-card--vanpool-display {
  width: 100%; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
		The user-vehicle-editor-overlay-card component.

		Todo: Add description here.

		HTML Structure:

		Todo: Document HTML Structure
		user-vehicle-editor-overlay-card

	*/
user-vehicle-editor-overlay-card {
  position: fixed;
  z-index: 10;
  background-color: #fff;
  box-shadow: 0 14px 28px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.22);
  min-width: 510px;
  margin: auto;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%); }
  user-vehicle-editor-overlay-card.is-hidden {
    display: none; }
  user-vehicle-editor-overlay-card._drawer-style {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out 0.1s; }
    user-vehicle-editor-overlay-card._drawer-style.is-hidden {
      display: -ms-flexbox;
      display: flex;
      opacity: 0;
      transform: translateX(-100%); }
    user-vehicle-editor-overlay-card._drawer-style:not(.is-hidden) {
      opacity: 1;
      transform: translateX(0); }

.user-vehicle-editor-overlay-card--header {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  -ms-flex-align: center;
      align-items: center;
  height: 56px;
  padding: 0 4px 0 16px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12); }

.user-vehicle-editor-overlay-card--close-icon-btn {
  margin-left: auto;
  /*position:absolute;
            top: 0;
            right: 0;
            z-index: 2;
        }*/
  /*&--close-flat-btn {
            position:absolute;
            bottom: 16px;
            left: 16px;
        }
        &--vanpool-display {
            width: 100%;*/ }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        The login-modal component.

        Todo: Add description here.

        HTML Structure:

        Todo: Document HTML Structure
        login-modal

    */
login-modal {
  width: 100%;
  height: 100%;
  display: -ms-flexbox;
  display: flex; }

.login-modal {
  /*  &--checkmark-icon-display {
            width: 24px;
            height: 24px;
            border-radius: 2px;
            background-color: $brand-primary;
            display: flex;
            align-items: center;
            justify-content: center;
            
        }
        &--checkmark-icon {
            color: #FFFFFF;
        }

        &--checkmark-text {
            padding-left: 16px;
            color: rgba(0,0,0,0.54);
        }*/ }
  .login-modal--container {
    width: 100%;
    height: 100%;
    display: -ms-flexbox;
    display: flex;
    background-color: rgba(0, 0, 0, 0.12);
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0; }
  .login-modal--content-wrapper {
    width: 480px;
    height: auto;
    border-radius: 2px;
    box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22);
    background-color: #FFF;
    position: absolute;
    top: 50%;
    margin-top: -200px;
    left: 50%;
    margin-left: -240px; }
  .login-modal--header-container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    margin-top: 4px;
    padding: 4px 0 4px 16px;
    -ms-flex-align: center;
        align-items: center; }
  .login-modal--header-text {
    font-size: 20px;
    line-height: 24px;
    color: rgba(0, 0, 0, 0.87); }
  .login-modal--header-exit-button {
    margin-left: auto;
    font-size: 24px;
    width: 48px;
    height: 48px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    cursor: pointer; }
  .login-modal--user-login-form-holder {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    padding: 0 16px;
    height: 148px; }
  .login-modal--input-container {
    width: 100%;
    padding: 0; }
  .login-modal--input-holder {
    display: block;
    letter-spacing: 1px;
    padding: 12px 0 8px;
    text-align: left;
    position: relative; }
  .login-modal--label-text {
    color: rgba(0, 0, 0, 0.38);
    cursor: text;
    font-size: 16px;
    line-height: 20px;
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
    transition: all 0.2s ease;
    position: absolute;
    left: 0;
    top: 26px;
    font-weight: 400 !important; }
  .login-modal--input-box {
    background-color: transparent;
    border: none;
    border-bottom: 1px solid #DDD;
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
    color: rgba(0, 0, 0, 0.87);
    font-size: 16px;
    line-height: 24px;
    outline: 0;
    padding-top: 14px;
    text-align: left;
    transition: all 0.2s ease;
    width: 100%; }
    .login-modal--input-box:focus {
      color: rgba(0, 0, 0, 0.87);
      outline: none; }
  .login-modal--input-box:focus + .login-modal--label-text {
    color: #03a9f4;
    font-size: 12px;
    top: 8px; }
  .login-modal--input-box:valid + .login-modal--label-text {
    color: #03a9f4;
    font-size: 12px;
    top: 8px; }
  .login-modal--input-box:focus ~ .login-modal--animated-bar {
    transform: scale(1); }
  .login-modal--animated-bar {
    background: #03a9f4;
    display: block;
    height: 2px;
    position: absolute;
    left: 0;
    top: 50px;
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
    transform: scale(0, 1);
    transition: all 0.2s linear;
    width: 100%; }
  .login-modal--error-label {
    font-size: 12px;
    letter-spacing: 0px;
    line-height: 12px;
    color: red;
    position: relative;
    top: 6px; }
  .login-modal--password-reset {
    -ms-flex-item-align: end;
        align-self: flex-end;
    line-height: 16px;
    font-size: 12px;
    color: #03a9f4;
    cursor: pointer;
    position: relative;
    top: -14px; }
    .login-modal--password-reset:hover {
      text-decoration: underline;
      color: #03a9f4; }
  .login-modal--checkbox-wrapper {
    padding: 8px 16px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center; }
  .login-modal--checkbox-icon-display {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.54); }
    .login-modal--checkbox-icon-display .paper-checkbox-display-element {
      padding: 0 16px;
      width: 24px;
      height: 24px; }
  .login-modal--checkbox {
    border-radius: 2px; }
  .login-modal--checkbox-text {
    padding-left: 4px;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.54);
    line-height: 44px; }
  .login-modal--account-holder {
    height: 40px;
    margin-bottom: 8px;
    padding: 0 16px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    color: rgba(0, 0, 0, 0.54); }
  .login-modal--account-link {
    color: #03a9f4;
    cursor: pointer;
    padding-left: 8px; }
    .login-modal--account-link:hover {
      text-decoration: underline;
      color: #03a9f4; }
  .login-modal--log-in-button-holder {
    padding: 8px 16px 12px;
    height: auto;
    display: -ms-flexbox;
    display: flex;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
  .login-modal--log-in-button {
    width: 100%;
    border-radius: 2px; }
  .login-modal--social-media-login-holder {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    line-height: 16px; }
  .login-modal--social-media-content {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    cursor: pointer;
    padding: 12px 0;
    width: 50%;
    transition: all 0.3s ease;
    text-decoration: none; }
    .login-modal--social-media-content:hover {
      background-color: #EEEEEE;
      text-decoration: none; }
  .login-modal--media-icon-holder {
    padding: 0 16px; }
  .login-modal--google-img {
    height: 24px; }
  .login-modal--facebook-img {
    height: 24px; }
  .login-modal--social-media-label {
    color: rgba(0, 0, 0, 0.54);
    padding-right: 16px;
    text-decoration: none; }
  .login-modal--social-media-divider {
    height: 32px;
    border-left: 1px solid #EEE; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        The registration-modal component.

        Todo: Add description here.

        HTML Structure:

        Todo: Document HTML Structure
        registration-modal

    */
registration-modal {
  width: 100%;
  height: 100%;
  display: -ms-flexbox;
  display: flex; }

.registration-modal {
  /*this is the style for the workplace pop-up*/
  /*pop-up style ends*/ }
  .registration-modal--container {
    width: 100%;
    height: 100%;
    display: -ms-flexbox;
    display: flex;
    background-color: rgba(0, 0, 0, 0.12);
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0; }
  .registration-modal--content-wrapper {
    width: 480px;
    height: auto;
    border-radius: 2px;
    box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22);
    background-color: #FFF;
    margin: auto;
    /*position: absolute;
            top: 50%;
            margin-top: -320px;
            left: 50%;
            margin-left: -240px;*/
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column; }
  .registration-modal--header-container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    margin-top: 4px;
    padding: 4px 0 4px 16px;
    -ms-flex-align: center;
        align-items: center;
    position: relative;
    height: 56px; }
  .registration-modal--image-display-container {
    width: 156px;
    margin: 16px;
    padding: 8px 0;
    position: absolute;
    top: -4px;
    left: 0px;
    background-color: #FFF;
    box-shadow: 0 0px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); }
  .registration-modal--image-display-text {
    font-size: 16px;
    line-height: 24px;
    padding: 12px 16px;
    transition: all 0.3s ease;
    cursor: pointer;
    height: 48px; }
    .registration-modal--image-display-text:hover {
      background-color: #EEEEEE;
      color: #03a9f4; }
  .registration-modal--user-avatar-wrapper {
    margin-right: 16px; }
  .registration-modal--user-avatar-image .user-avatar-img {
    width: 32px !important;
    height: 32px !important; }
  .registration-modal--header-text {
    font-size: 20px;
    line-height: 24px;
    color: rgba(0, 0, 0, 0.87);
    margin-right: auto; }
  .registration-modal--header-exit-button {
    font-size: 24px;
    width: 48px;
    height: 48px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    cursor: pointer; }
  .registration-modal--sub-text {
    padding: 4px 0 12px;
    font-size: 14px;
    border-bottom: 1px solid #DDDDDD;
    margin: 0 16px;
    height: auto; }
  .registration-modal--region-selection-holder {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    border-bottom: 1px solid #DDDDDD;
    padding: 12px 0 8px;
    margin: 0 16px; }
  .registration-modal--selection-header-wrapper {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    padding-bottom: 8px;
    margin: 0 16px;
    border-bottom: 1px solid #DDDDDD; }
  .registration-modal--selection-text {
    font-size: 16px;
    line-height: 16px; }
  .registration-modal--selection-icon {
    width: 24px;
    height: 24px;
    font-size: 24px; }
  .registration-modal--selection-items-container {
    margin-top: 8px;
    background-color: #FFF;
    position: absolute;
    top: 50%;
    margin-top: -220px;
    left: 50%;
    margin-left: -94px;
    min-width: 280px;
    max-width: 448px;
    height: auto;
    z-index: 3;
    box-shadow: 0 0px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); }
    .registration-modal--selection-items-container .has-custom-scrollbar {
      margin: 4px 4px 4px 0; }
  .registration-modal--selection-items-wrapper {
    padding: 8px 0;
    max-height: 216px;
    overflow-y: auto; }
  .registration-modal--selection-item {
    font-size: 16px;
    line-height: 24px;
    padding: 12px 16px;
    transition: all 0.3s ease;
    cursor: pointer;
    height: 48px; }
    .registration-modal--selection-item:hover {
      background-color: #EEEEEE;
      color: #03a9f4; }
  .registration-modal--user-login-form-holder {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    padding: 0 16px; }
  .registration-modal--input-container {
    width: 100%;
    padding: 0; }
  .registration-modal--name-input-container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row; }
  .registration-modal--input-holder {
    display: block;
    padding: 12px 0 8px;
    text-align: left;
    position: relative;
    height: 72px; }
    .registration-modal--input-holder._add-margin-right {
      margin-right: 16px; }
  .registration-modal--label-text {
    color: rgba(0, 0, 0, 0.38);
    cursor: text;
    font-size: 16px;
    line-height: 20px;
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
    transition: all 0.2s ease;
    position: absolute;
    left: 0;
    top: 26px;
    font-weight: 400 !important; }
  .registration-modal--input-box {
    background-color: transparent;
    border: none;
    border-bottom: 1px solid #DDDDDD;
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
    color: rgba(0, 0, 0, 0.87);
    font-size: 16px;
    line-height: 24px;
    outline: 0;
    padding-top: 14px;
    text-align: left;
    transition: all 0.2s ease;
    width: 100%; }
    .registration-modal--input-box:focus {
      color: rgba(0, 0, 0, 0.87);
      outline: none; }
  .registration-modal--input-box:focus + .registration-modal--label-text {
    color: #03a9f4;
    font-size: 12px;
    top: 8px; }
  .registration-modal--input-box:valid + .registration-modal--label-text {
    color: #03a9f4;
    font-size: 12px;
    top: 8px; }
  .registration-modal--input-box:focus ~ .registration-modal--animated-bar {
    transform: scale(1); }
  .registration-modal--animated-bar {
    background: #03a9f4;
    display: block;
    height: 2px;
    position: absolute;
    left: 0;
    top: 50px;
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
    transform: scale(0, 1);
    transition: all 0.2s linear;
    width: 100%; }
  .registration-modal--error-label {
    font-size: 12px;
    letter-spacing: 0px;
    line-height: 12px;
    color: red;
    position: relative;
    top: 6px; }
  .registration-modal--email-instruction {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: end;
        justify-content: flex-end;
    line-height: 16px;
    font-size: 12px;
    letter-spacing: 0px;
    color: rgba(0, 0, 0, 0.38);
    cursor: pointer;
    position: relative;
    top: -8px;
    /* left: 246px; */ }
  .registration-modal--show-characters {
    display: -ms-flexbox;
    display: flex;
    line-height: 16px;
    font-size: 20px;
    width: 24px;
    margin-left: auto;
    letter-spacing: 0px;
    color: rgba(0, 0, 0, 0.38);
    cursor: pointer;
    position: relative;
    top: -24px;
    /* left: 246px; */ }
  .registration-modal--account-holder {
    height: 40px;
    margin-bottom: 8px;
    padding: 0 16px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    color: rgba(0, 0, 0, 0.54); }
  .registration-modal--login-link {
    color: #03a9f4;
    cursor: pointer;
    padding-left: 8px; }
    .registration-modal--login-link:hover {
      text-decoration: underline;
      color: #03a9f4; }
  .registration-modal--checkbox-holder {
    margin-top: 8px;
    padding: 2px 16px 4px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center; }
    .registration-modal--checkbox-holder._left {
      margin-right: 16px; }
  .registration-modal--checkbox-icon-display {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.54); }
  .registration-modal--checkbox {
    border-radius: 2px; }
  .registration-modal--checkbox-text {
    font-size: 12px;
    color: rgba(0, 0, 0, 0.54);
    position: relative;
    /*to align text with checkbox*/
    top: 6px; }
  .registration-modal--checkbox-text-links {
    color: #03a9f4;
    cursor: pointer;
    margin: 0 4px; }
    .registration-modal--checkbox-text-links:hover {
      text-decoration: underline;
      color: #03a9f4; }
  .registration-modal--create-account-button-holder {
    padding: 16px 16px 16px;
    height: auto;
    display: -ms-flexbox;
    display: flex;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
  .registration-modal--create-account-button {
    width: 100%;
    border-radius: 2px; }
  .registration-modal--social-media-login-holder {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    line-height: 16px; }
  .registration-modal--social-media-content {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    cursor: pointer;
    padding: 12px 0;
    width: 50%;
    transition: all 0.3s ease;
    text-decoration: none; }
    .registration-modal--social-media-content:hover {
      background-color: #EEEEEE;
      text-decoration: none; }
  .registration-modal--media-icon-holder {
    padding: 0 16px; }
  .registration-modal--google-img {
    height: 24px; }
  .registration-modal--facebook-img {
    height: 24px; }
  .registration-modal--social-media-label {
    color: rgba(0, 0, 0, 0.54);
    padding-right: 16px;
    text-decoration: none; }
  .registration-modal--social-media-divider {
    height: 32px;
    border-left: 1px solid #EEEEEE; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        The registration-password-reset component.

        Todo: Add description here.

        HTML Structure:

        Todo: Document HTML Structure
        registration-password-reset

    */
registration-password-reset {
  width: 100%;
  height: 100%;
  min-height: 640px;
  display: -ms-flexbox;
  display: flex;
  background-color: rgba(0, 0, 0, 0.12); }

.registration-password-reset--container {
  width: 100%;
  height: 100%;
  display: -ms-flexbox;
  display: flex;
  background-color: rgba(0, 0, 0, 0.12); }

.registration-password-reset--content-wrapper {
  width: 480px;
  border-radius: 2px;
  box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22);
  min-height: 400px;
  position: absolute;
  left: 50%;
  margin-left: -240px;
  top: 50%;
  margin-top: -200px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  background-color: #FFF; }

.registration-password-reset--header-container {
  margin-top: 4px;
  width: 100%; }

.registration-password-reset--header {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  padding: 4px 0;
  margin-bottom: 4px;
  -ms-flex-align: center;
      align-items: center; }

.registration-password-reset--header-back-button {
  margin-left: 4px;
  font-size: 24px; }

.registration-password-reset--header-text {
  font-size: 20px;
  line-height: 24px;
  color: rgba(0, 0, 0, 0.87);
  padding-left: 16px; }

.registration-password-reset--header-exit-button {
  margin-left: auto;
  margin-right: 4px;
  font-size: 24px;
  width: 48px;
  height: 48px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: center;
      justify-content: center; }

.registration-password-reset--sub-text {
  color: rgba(0, 0, 0, 0.38);
  font-size: 14px;
  padding: 16px; }

.registration-password-reset--input-container {
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1 1 auto;
      flex: 1 1 auto;
  height: 100%; }

.registration-password-reset--input-holder {
  padding: 12px 16px 8px;
  margin: auto;
  width: 100%; }

.registration-password-reset--input-box {
  background-color: transparent;
  border: none;
  border-bottom: 1px solid #DDD;
  color: rgba(0, 0, 0, 0.38);
  font-size: 16px;
  line-height: 24px;
  outline: 0;
  padding-bottom: 8px;
  text-align: left;
  transition: all 0.2s ease;
  width: 100%; }
  .registration-password-reset--input-box:focus {
    color: rgba(0, 0, 0, 0.87);
    outline: none; }

.registration-password-reset--input-box:focus ~ .registration-password-reset--animated-bar {
  transform: scale(1); }

.registration-password-reset--animated-bar {
  background: #03a9f4;
  display: block;
  height: 2px;
  position: relative;
  left: 0;
  top: -1px;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  transform: scale(0, 1);
  transition: all 0.2s linear;
  width: 100%; }

.registration-password-reset--error-label {
  font-size: 12px;
  color: #F44336;
  position: relative;
  top: 8px;
  left: 0; }

.registration-password-reset--footer-button-container {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column; }

.registration-password-reset--text-link-display {
  padding: 12px 16px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: center;
      justify-content: center;
  color: rgba(0, 0, 0, 0.38);
  font-size: 14px;
  line-height: 16px;
  margin-bottom: 8px; }

.registration-password-reset--text-link {
  cursor: pointer;
  color: #03a9f4;
  padding: 0 8px; }
  .registration-password-reset--text-link:hover {
    text-decoration: underline;
    color: #03a9f4; }

.registration-password-reset--full-width-button-holder {
  width: 100%;
  padding: 16px; }

.registration-password-reset--full-width-button {
  width: 100%; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        The registration-phone-request component.

        Todo: Add description here.

        HTML Structure:

        Todo: Document HTML Structure
        registration-phone-request

    */
registration-phone-request {
  width: 100%;
  height: 100%;
  min-height: 640px;
  display: -ms-flexbox;
  display: flex;
  background-color: rgba(0, 0, 0, 0.12); }

.registration-phone-request {
  /****/
  /** code for the Verify-Phone-Number UI*/ }
  .registration-phone-request--container {
    width: 100%;
    height: 100%;
    display: -ms-flexbox;
    display: flex;
    background-color: rgba(0, 0, 0, 0.12); }
  .registration-phone-request--content-wrapper {
    width: 480px;
    border-radius: 2px;
    box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22);
    min-height: 400px;
    position: absolute;
    left: 50%;
    margin-left: -240px;
    top: 50%;
    margin-top: -200px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    background-color: #FFF; }
    .registration-phone-request--content-wrapper._UI-verify {
      position: absolute;
      left: 50%;
      top: 990px;
      /*For testing only*/ }
  .registration-phone-request--header-container {
    margin-top: 4px;
    width: 100%; }
  .registration-phone-request--header {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    padding: 4px 0;
    margin-bottom: 4px;
    -ms-flex-align: center;
        align-items: center; }
  .registration-phone-request--header-text {
    font-size: 20px;
    line-height: 24px;
    color: rgba(0, 0, 0, 0.87);
    padding-left: 16px; }
  .registration-phone-request--header-exit-button {
    margin-left: auto;
    margin-right: 4px;
    font-size: 24px;
    width: 48px;
    height: 48px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center; }
  .registration-phone-request--sub-text {
    color: rgba(0, 0, 0, 0.38);
    font-size: 14px;
    padding: 16px; }
  .registration-phone-request--input-container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    height: 100%; }
  .registration-phone-request--input-holder {
    letter-spacing: 1px;
    padding: 12px 36px 8px;
    margin: auto;
    width: 100%; }
  .registration-phone-request--input-box {
    background-color: transparent;
    border: none;
    border-bottom: 1px solid #DDD;
    color: rgba(0, 0, 0, 0.38);
    font-size: 24px;
    line-height: 24px;
    outline: 0;
    padding-bottom: 8px;
    text-align: center;
    transition: all 0.2s ease;
    width: 100%; }
    .registration-phone-request--input-box:focus {
      color: rgba(0, 0, 0, 0.87);
      outline: none; }
  .registration-phone-request--input-box:focus ~ .registration-phone-request--animated-bar {
    transform: scale(1); }
  .registration-phone-request--animated-bar {
    background: #03a9f4;
    display: block;
    height: 2px;
    position: relative;
    left: 0;
    top: -1px;
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
    transform: scale(0, 1);
    transition: all 0.2s linear;
    width: 100%; }
  .registration-phone-request--error-label {
    font-size: 12px;
    color: #F44336;
    position: relative;
    top: 8px;
    left: 0; }
  .registration-phone-request--button-container {
    padding: 8px 0 16px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    -ms-flex-align: center;
        align-items: center;
    color: rgba(0, 0, 0, 0.54);
    width: 100%; }
  .registration-phone-request--skip-button {
    text-decoration: none;
    color: rgba(0, 0, 0, 0.38);
    cursor: pointer;
    margin-left: 16px; }
    .registration-phone-request--skip-button:hover {
      background-color: #EEEEEE; }
  .registration-phone-request--code-button-holder {
    margin-left: auto;
    margin-right: 16px; }
  .registration-phone-request--code-button {
    width: 180px; }
  .registration-phone-request--header-back-button {
    margin-left: 4px;
    font-size: 24px; }
  .registration-phone-request--footer-button-container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column; }
  .registration-phone-request--text-button-display {
    padding: 0 16px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    color: rgba(0, 0, 0, 0.87);
    font-size: 14px;
    line-height: 16px;
    margin-bottom: 8px; }
  .registration-phone-request--resend-button {
    cursor: pointer;
    color: #03a9f4;
    padding: 0 8px; }
    .registration-phone-request--resend-button:hover {
      text-decoration: underline;
      color: #03a9f4; }
  .registration-phone-request--verify-button-holder {
    width: 100%;
    padding: 16px; }
  .registration-phone-request--verify-button {
    width: 100%; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        The registration-phone-summary-display component.

        Todo: Add description here.

        HTML Structure:

        Todo: Document HTML Structure
        registration-phone-summary-display

    */
registration-phone-summary-display {
  width: 100%;
  height: 100%;
  min-height: 640px;
  display: -ms-flexbox;
  display: flex;
  background-color: rgba(0, 0, 0, 0.12); }

.registration-phone-summary-display--container {
  width: 100%;
  height: 100%;
  display: -ms-flexbox;
  display: flex;
  background-color: rgba(0, 0, 0, 0.12); }

.registration-phone-summary-display--content-wrapper {
  width: 480px;
  border-radius: 2px;
  box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22);
  height: auto;
  position: absolute;
  left: 50%;
  margin-left: -240px;
  top: 50%;
  margin-top: -200px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  background-color: #FAFAFA; }

.registration-phone-summary-display--header-container {
  margin-top: 4px;
  width: 100%; }

.registration-phone-summary-display--header {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  padding: 4px 0 4px 16px;
  margin-bottom: 4px;
  -ms-flex-align: center;
      align-items: center; }

.registration-phone-summary-display--header-exit-button {
  margin-left: auto;
  margin-right: 4px;
  font-size: 24px;
  width: 48px;
  height: 48px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: center;
      justify-content: center; }

.registration-phone-summary-display--body-container {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column; }

.registration-phone-summary-display--body-wrapper {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  padding: 16px 72px;
  -ms-flex-align: center;
      align-items: center; }

.registration-phone-summary-display--check-icon-holder {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background-color: #8BC34A;
  text-align: center;
  margin: 16px 0;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: center;
      justify-content: center; }

.registration-phone-summary-display--check-mark {
  font-size: 68px;
  color: #FFF; }

.registration-phone-summary-display--title-text-holder {
  font-size: 24px;
  line-height: 32px;
  padding: 16px 0; }

.registration-phone-summary-display--sub-text-holder {
  font-size: 14px;
  line-height: 24px;
  padding-bottom: 16px; }

.registration-phone-summary-display--app-container {
  margin: 24px 0 8px;
  padding: 16px 0;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  -ms-flex-align: center;
      align-items: center;
  width: 100%; }

.registration-phone-summary-display--left-button {
  /*app store icon*/ }

.registration-phone-summary-display--right-button {
  /*google play icon*/
  margin-left: auto; }

.registration-phone-summary-display--button-container {
  padding: 8px 0 16px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-pack: center;
      justify-content: center;
  width: 100%; }

.registration-phone-summary-display--close-button {
  text-decoration: none;
  color: rgba(0, 0, 0, 0.38);
  cursor: pointer; }
  .registration-phone-summary-display--close-button:hover {
    background-color: #EEEEEE; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        The registration-user-details component.

        Todo: Add description here.

        HTML Structure:

        Todo: Document HTML Structure
        registration-user-details

    */
registration-user-details {
  width: 100%;
  height: 100%;
  display: -ms-flexbox;
  display: flex; }

.registration-user-details {
  /*this is the style for the workplace pop-up*/
  /*pop-up style ends*/ }
  .registration-user-details--container {
    width: 100%;
    height: 100%;
    display: -ms-flexbox;
    display: flex;
    background-color: rgba(0, 0, 0, 0.12); }
  .registration-user-details--content-wrapper {
    width: 480px;
    height: auto;
    border-radius: 2px;
    box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22);
    background-color: #FFF;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%); }
  .registration-user-details--header-container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    margin-top: 4px;
    padding: 4px 0 4px 16px;
    -ms-flex-align: center;
        align-items: center;
    position: relative; }
  .registration-user-details--image-display-container {
    width: 156px;
    margin: 16px;
    padding: 8px 0;
    position: absolute;
    top: -4px;
    left: 0;
    background-color: #FFF;
    box-shadow: 0 0px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
    z-index: 3; }
  .registration-user-details--image-display-text {
    font-size: 16px;
    line-height: 24px;
    padding: 12px 16px;
    transition: all 0.3s ease;
    cursor: pointer;
    height: 48px; }
    .registration-user-details--image-display-text:hover {
      background-color: #EEEEEE;
      color: #03a9f4; }
  .registration-user-details--user-avatar-wrapper {
    margin-right: 16px; }
  .registration-user-details--user-avatar-image .user-avatar-img {
    width: 32px !important;
    height: 32px !important; }
  .registration-user-details--header-text {
    font-size: 20px;
    line-height: 24px;
    color: rgba(0, 0, 0, 0.87);
    margin-right: auto; }
  .registration-user-details--header-close-button {
    font-size: 24px;
    margin-right: 4px;
    width: 48px;
    height: 48px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    cursor: pointer;
    color: rgba(0, 0, 0, 0.54); }
  .registration-user-details--sub-text-holder {
    position: relative;
    display: -ms-flexbox;
    display: flex; }
  .registration-user-details--sub-text {
    background-color: #EEEEEE;
    padding: 13px 16px;
    font-size: 14px;
    color: rgba(0, 0, 0, 0.54);
    width: 100%; }
  .registration-user-details--sub-text-error {
    background-color: #FF9100;
    padding: 13px 16px;
    width: 100%;
    color: #FFFFFF;
    position: absolute;
    left: 0;
    top: 0;
    visibility: hidden;
    /*for testing*/ }
  .registration-user-details--body-wrapper {
    height: 100%;
    max-height: 388px;
    overflow-y: auto;
    margin: 4px 4px 0 0; }
  .registration-user-details--details-icon-container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
  .registration-user-details--details-icon-wrapper {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    width: 50%; }
  .registration-user-details--icon-display-wrapper {
    padding: 0 4px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    height: 48px; }
  .registration-user-details--checkbox-wrapper {
    cursor: pointer;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center; }
  .registration-user-details--checkbox {
    width: 24px;
    height: 24px;
    /*font-size: 12px;
            background-color: $brand-primary;
            color: #FFFFFF;*/
    /* to be replaced with checkbox icon*/ }
  .registration-user-details--icon-label {
    padding: 0 16px 0 4px;
    line-height: 24px; }
  .registration-user-details--icon-display {
    font-size: 24px;
    color: rgba(0, 0, 0, 0.54);
    margin-left: auto; }
  .registration-user-details--details-icon-divider {
    border-right: 1px solid rgba(0, 0, 0, 0.12);
    height: auto;
    margin: 12px 0; }
  .registration-user-details--organization-selection-holder {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    padding: 8px 16px 0;
    height: 72px; }
    .registration-user-details--organization-selection-holder:hover {
      background-color: #EEE;
      cursor: pointer; }
  .registration-user-details--selection-subheader {
    color: rgba(0, 0, 0, 0.87);
    line-height: 24px; }
  .registration-user-details--selection-display-container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    height: 40px; }
  .registration-user-details--selection-items-container {
    margin-top: 8px;
    background-color: #FFF;
    position: absolute;
    top: 142px;
    left: 16px;
    min-width: 280px;
    max-width: 448px;
    height: auto;
    z-index: 3;
    box-shadow: 0 0px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); }
    .registration-user-details--selection-items-container .has-custom-scrollbar {
      margin: 4px 4px 4px 0; }
  .registration-user-details--selection-items-wrapper {
    padding: 8px 0;
    max-height: 216px;
    overflow-y: auto; }
  .registration-user-details--selection-item {
    font-size: 16px;
    line-height: 24px;
    padding: 12px 16px;
    transition: all 0.3s ease;
    cursor: pointer;
    height: 48px; }
    .registration-user-details--selection-item:hover {
      background-color: #EEEEEE;
      color: #03a9f4; }
  .registration-user-details--selection-display-text {
    font-size: 16px;
    line-height: 16px;
    color: rgba(0, 0, 0, 0.54); }
  .registration-user-details--selection-icon {
    width: 24px;
    height: 24px;
    font-size: 24px; }
  .registration-user-details--user-login-form-holder {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column; }
  .registration-user-details--input-container {
    width: 100%;
    padding: 0; }
  .registration-user-details--phone-input-container {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    -ms-flex-align: center;
        align-items: center;
    padding-right: 16px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
  .registration-user-details--input-holder {
    display: block;
    padding: 12px 0 8px;
    text-align: left;
    position: relative;
    height: 72px;
    -ms-flex: 1 1 auto;
        flex: 1 1 auto;
    margin-left: 16px; }
    .registration-user-details--input-holder._input-small {
      width: auto; }
  .registration-user-details--label-text {
    color: rgba(0, 0, 0, 0.38);
    cursor: text;
    font-size: 16px;
    line-height: 20px;
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
    transition: all 0.2s ease;
    position: absolute;
    left: 0;
    top: 26px;
    font-weight: 400 !important; }
  .registration-user-details--input-box {
    background-color: transparent;
    border: none;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
    color: rgba(0, 0, 0, 0.87);
    font-size: 16px;
    line-height: 24px;
    outline: 0;
    padding-top: 15px;
    text-align: left;
    transition: all 0.2s ease;
    width: 100%; }
    .registration-user-details--input-box:focus {
      color: rgba(0, 0, 0, 0.87);
      outline: none; }
  .registration-user-details--input-box:focus + .registration-user-details--label-text {
    color: #03a9f4;
    font-size: 12px;
    top: 8px; }
  .registration-user-details--input-box:valid + .registration-user-details--label-text {
    color: #03a9f4;
    font-size: 12px;
    top: 8px; }
  .registration-user-details--input-box:focus ~ .registration-user-details--animated-bar {
    transform: scale(1); }
  .registration-user-details--animated-bar {
    background: #03a9f4;
    display: block;
    height: 2px;
    position: absolute;
    left: 0;
    top: 50px;
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
    transform: scale(0, 1);
    transition: all 0.2s linear;
    width: 100%; }
  .registration-user-details--error-label-holder {
    width: 100%;
    position: relative;
    top: -8px; }
  .registration-user-details--error-label {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    line-height: 12px;
    color: #FFF;
    background-color: #FFFFFF;
    height: 32px; }
  .registration-user-details--error-description {
    color: #FF9100;
    padding-left: 16px; }
  .registration-user-details--verify-action {
    margin-left: 8px;
    color: #03a9f4; }
    .registration-user-details--verify-action:hover {
      text-decoration: underline;
      color: #03a9f4; }
  .registration-user-details--phone-type-holder {
    display: -ms-flexbox;
    display: flex;
    color: rgba(0, 0, 0, 0.87);
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    -ms-flex-align: center;
        align-items: center;
    height: 33px;
    margin-left: 16px;
    cursor: pointer; }
  .registration-user-details--phone-type {
    font-size: 16px;
    line-height: 16px;
    color: rgba(0, 0, 0, 0.54); }
  .registration-user-details--phone-type-display {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center; }
  .registration-user-details--phone-type-wrapper {
    padding: 8px 0;
    background-color: #FFF;
    position: absolute;
    top: 184px;
    right: 8px;
    width: 112px;
    height: auto;
    z-index: 3;
    box-shadow: 0 0px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23); }
    .registration-user-details--phone-type-wrapper._work-phone {
      top: 288px; }
    .registration-user-details--phone-type-wrapper._home-phone {
      top: 360px; }
  .registration-user-details--phone-type-item {
    padding: 12px 16px;
    transition: all 0.3s ease;
    cursor: pointer;
    height: 48px; }
    .registration-user-details--phone-type-item:hover {
      background-color: #EEEEEE;
      color: #03a9f4; }
  .registration-user-details--phone-selection-icon {
    width: 24px;
    height: 24px;
    font-size: 24px; }
  .registration-user-details--add-phone-holder {
    padding: 10px 16px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    color: rgba(0, 0, 0, 0.54);
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    height: 40px; }
  .registration-user-details--add-phone-label {
    color: rgba(0, 0, 0, 0.54);
    cursor: pointer;
    margin-right: auto; }
  .registration-user-details--action-complete-button-holder {
    padding: 16px 16px 16px;
    height: auto;
    display: -ms-flexbox;
    display: flex;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12); }
  .registration-user-details--action-complete-button {
    width: 100%;
    border-radius: 2px; }

.profile-view--error-container-error-message {
  color: #f89c50;
  font-style: italic;
  margin: 8px 0; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
trip-profile-picker {
  display: block; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.animation-fixture.animation-slide-out {
  width: 100%;
  overflow-x: hidden;
  position: relative; }
  .animation-fixture.animation-slide-out .animated-el {
    position: absolute;
    top: 0;
    left: 0;
    transition: left 0.3s ease-in-out 0.1s; }
    .animation-fixture.animation-slide-out .animated-el.__no-delay {
      transition: left 0.3s ease-in-out; }
    .animation-fixture.animation-slide-out .animated-el.__long-delay {
      transition: left 0.3s ease-in-out 0.2s; }
    .animation-fixture.animation-slide-out .animated-el.__slide-from-left.ng-animate.ng-enter {
      left: 100%; }
      .animation-fixture.animation-slide-out .animated-el.__slide-from-left.ng-animate.ng-enter.ng-enter-active {
        left: 0; }
    .animation-fixture.animation-slide-out .animated-el.__slide-from-left.ng-animate.ng-leave {
      left: 0; }
      .animation-fixture.animation-slide-out .animated-el.__slide-from-left.ng-animate.ng-leave.ng-leave-active {
        left: 100%; }
    .animation-fixture.animation-slide-out .animated-el.__slide-from-right.ng-animate.ng-enter {
      left: -100%; }
      .animation-fixture.animation-slide-out .animated-el.__slide-from-right.ng-animate.ng-enter.ng-enter-active {
        left: 0; }
    .animation-fixture.animation-slide-out .animated-el.__slide-from-right.ng-animate.ng-leave {
      left: 0; }
      .animation-fixture.animation-slide-out .animated-el.__slide-from-right.ng-animate.ng-leave.ng-leave-active {
        left: -100%; }

trip-profile-match-email-composer {
  display: block;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column; }
  trip-profile-match-email-composer._no-max-height .trip-profile-match-email-composer--body {
    max-height: 100%; }
  trip-profile-match-email-composer md-content {
    background-color: #fff !important; }

.trip-profile-match-email-composer--header {
  -ms-flex: 0 0 auto;
      flex: 0 0 auto;
  padding: 8px;
  min-height: 40px;
  position: relative; }

.trip-profile-match-email-composer--title {
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 20px;
  font-weight: 500; }

.trip-profile-match-email-composer--close-button {
  top: 8px;
  right: 0px;
  position: absolute;
  font-size: 24px; }

.trip-profile-match-email-composer--body {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column;
  -ms-flex: 1 1 auto;
      flex: 1 1 auto;
  max-height: 340px;
  padding: 12px 16px 0;
  margin: 0;
  margin-bottom: 48px; }
  .trip-profile-match-email-composer--body-row {
    -ms-flex: 1 0 auto;
        flex: 1 0 auto;
    margin: 0;
    padding: 0;
    float: left;
    clear: left;
    width: 100%; }
    .trip-profile-match-email-composer--body-row.alt--full-width {
      margin-left: -16px;
      margin-right: -16px;
      width: calc(100% + 3.2rem); }
    .trip-profile-match-email-composer--body-row .form-input-group {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-direction: column;
          flex-direction: column; }
      .trip-profile-match-email-composer--body-row .form-input-group .form-input-row {
        -ms-flex: 1 0 auto;
            flex: 1 0 auto;
        position: relative;
        display: -ms-flexbox;
        display: flex; }
        .trip-profile-match-email-composer--body-row .form-input-group .form-input-row > label.paper-checkbox {
          margin: auto 0; }
        .trip-profile-match-email-composer--body-row .form-input-group .form-input-row .row-text {
          margin: auto 0; }
        .trip-profile-match-email-composer--body-row .form-input-group .form-input-row.animation-fixture {
          height: 72px; }
        .trip-profile-match-email-composer--body-row .form-input-group .form-input-row._align-checkbox {
          padding-left: 0px; }

.trip-profile-match-email-composer--phone-entry-field {
  display: -ms-flexbox;
  display: flex;
  padding: 0 16px; }
  .trip-profile-match-email-composer--phone-entry-field > .text-field {
    -ms-flex: 1 1 auto;
        flex: 1 1 auto; }
  .trip-profile-match-email-composer--phone-entry-field .row-icon-secondary {
    -ms-flex: 0 0 auto;
        flex: 0 0 auto;
    margin: auto 0; }

.trip-profile-match-email-composer--email-help-btn {
  margin-top: 12px !important; }

.trip-profile-match-email-composer--action-area {
  position: absolute;
  width: 100%;
  bottom: 0;
  left: 0;
  margin-left: 0;
  margin-right: 0;
  min-height: 48px;
  padding: 8px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
copyable-link {
  display: -ms-flexbox;
  display: flex; }

.copyable-link--link-text {
  margin: 8px;
  padding: 0 8px;
  -ms-flex: 1 1 auto;
      flex: 1 1 auto;
  background-color: #eee;
  line-height: 36px;
  -ms-flex-align: center;
      align-items: center;
  white-space: nowrap; }

rs-address-picker {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
      flex-direction: row;
  width: 100%;
  /* *modifier class for styling -  */ }
  rs-address-picker._inset-well md-autocomplete md-autocomplete-wrap:not(.md-menu-showing) {
    box-shadow: none;
    background-color: #eeeeee;
    transition: background-color 0.3s ease;
    cursor: pointer;
    height: 32px;
    -ms-flex-align: center;
        align-items: center; }
    rs-address-picker._inset-well md-autocomplete md-autocomplete-wrap:not(.md-menu-showing):hover {
      background-color: #e0e0e0; }
  rs-address-picker._inset-well .rs-address-picker--icon {
    font-size: 20px;
    display: -ms-flexbox;
    display: flex; }
  rs-address-picker._plain-text-field md-autocomplete md-autocomplete-wrap:not(.md-menu-showing) {
    height: 40px; }
  rs-address-picker._plain-text-field md-input-container {
    margin: 0px; }
    rs-address-picker._plain-text-field md-input-container label,
    rs-address-picker._plain-text-field md-input-container .md-errors-spacer {
      display: none; }
    rs-address-picker._plain-text-field md-input-container.md-rideshark-theme-theme:not(.md-input-invalid) label {
      opacity: 0; }
    rs-address-picker._plain-text-field md-input-container.md-rideshark-theme-theme:not(.md-input-invalid).md-input-focused .md-input {
      border-color: rgba(0, 0, 0, 0.12);
      border-width: 0 0 1px; }
    rs-address-picker._plain-text-field md-input-container input {
      border-bottom-color: transparent !important; }
  rs-address-picker._plain-text-field md-progress-linear.md-inline {
    bottom: 0; }
  rs-address-picker._plain-text-field .rs-address-picker--icon {
    font-size: 20px;
    display: -ms-flexbox;
    display: flex; }
  rs-address-picker._plain-text-field .rs-address-picker--floating-label-underline {
    border-bottom: 1px solid #dedede;
    position: absolute;
    left: 24px;
    right: 0;
    bottom: 0; }
  rs-address-picker._inline-card-textfield md-autocomplete md-autocomplete-wrap:not(.md-menu-showing) {
    box-shadow: none; }
  rs-address-picker._inline-card-textfield .rs-address-picker--icon {
    font-size: 20px;
    display: -ms-flexbox;
    display: flex; }
  rs-address-picker._less-padding {
    /*to reduce the spacing between addresses in cc-trip-log-editor*/
    margin-bottom: -12px; }
  rs-address-picker._trip-log-address-spacing .rs-address-picker--icon {
    /*to add spacing between icon and addresses in cc-trip-log-editor*/ }
    rs-address-picker._trip-log-address-spacing .rs-address-picker--icon._trip-log-margin {
      margin-right: 26px; }
  rs-address-picker._underline md-autocomplete-wrap:not(.md-menu-showing)::after {
    content: "";
    display: block;
    position: absolute;
    border-bottom: 1px solid #b3b3b3;
    bottom: 2px;
    left: 0px;
    right: 0px; }

body md-virtual-repeat-container.md-autocomplete-suggestions-container .highlight {
  border: none !important; }

.rs-address-picker--icon {
  -ms-flex: 0 0 auto;
      flex: 0 0 auto; }
  .rs-address-picker--icon .rs-icon._initial-location {
    color: #00c853; }
  .rs-address-picker--icon .rs-icon._end-location {
    color: #dd2c00; }

.rs-address-picker--md-autocomplete {
  -ms-flex: 1 0 auto;
      flex: 1 0 auto; }

.rs-address-picker--md-autocomplete-item {
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow-x: hidden; }
  .rs-address-picker--md-autocomplete-item-title {
    font-weight: bold; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.bg-selection-on-hover:hover {
  background-color: #eeeeee !important; }

cc-trip-log-editor {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
      flex-direction: column; }
  cc-trip-log-editor .row {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    -ms-flex: 1 0 auto;
        flex: 1 0 auto;
    margin: 0;
    width: 100%;
    box-sizing: border-box; }
    cc-trip-log-editor .row .col-6 {
      -ms-flex: 1 0 50%;
          flex: 1 0 50%; }
    cc-trip-log-editor .row .row-text {
      -ms-flex: 1 1 auto;
          flex: 1 1 auto;
      padding: 0 16px 0 0;
      margin: 0; }
  cc-trip-log-editor .paper-select {
    width: 100%;
    height: 72px;
    box-sizing: border-box;
    position: relative; }
    cc-trip-log-editor .paper-select select {
      position: absolute;
      top: 32px;
      padding: 4px;
      border-bottom: 1px solid #ddd !important; }

.cc-trip-log-editor {
  /*Edit Trip Details (Fixed)*/
  /*Select commute mode*/
  /*Add/Edit Dates*/
  /*Trip Purpose*/
  /*Vehicle Information*/
  /*Action Buttons*/ }
  .cc-trip-log-editor--trip-log-wrapper {
    min-width: 480px;
    margin: -24px;
    /*this is to override md-dialog's forced padding*/
    overflow-x: hidden; }
  .cc-trip-log-editor--trip-row {
    -ms-flex: 1 0 auto;
        flex: 1 0 auto; }
  .cc-trip-log-editor--edit-trip-details {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    border-bottom: 1px solid #e0e0e0;
    padding: 8px 16px; }
  .cc-trip-log-editor--commute-mode-title-wrapper {
    border-bottom: 1px solid #e0e0e0;
    padding: 8px 16px; }
    .cc-trip-log-editor--commute-mode-title-wrapper.paper-select.with-icon select {
      left: 64px;
      border: none;
      color: #757575; }
  .cc-trip-log-editor--travel-mode-icon-wrapper {
    width: 36px;
    margin-right: 16px; }
    .cc-trip-log-editor--travel-mode-icon-wrapper .commute-mode-icon {
      width: 36px; }
  .cc-trip-log-editor--edit-date-wrapper {
    border-bottom: 1px solid #e0e0e0;
    height: 72px;
    padding: 8px 16px;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap; }
    .cc-trip-log-editor--edit-date-wrapper:hover {
      background: #f1f1f1;
      cursor: pointer; }
  .cc-trip-log-editor--edit-date-button-wrapper {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    height: 32px; }
  .cc-trip-log-editor--edit-date-icon {
    font-size: 24px;
    color: #757575;
    margin: 0 8px 0 4px; }
  .cc-trip-log-editor--date-display-wrapper {
    padding-left: 52px;
    width: 100%; }
    .cc-trip-log-editor--date-display-wrapper.row-content {
      font-size: 12px; }
  .cc-trip-log-editor--trip-purpose-row.paper-select {
    padding: 8px 16px;
    border-bottom: 1px solid #e0e0e0;
    height: 72px; }
  .cc-trip-log-editor--trip-purpose-row.with-ink:hover {
    background-color: transparent; }
  .cc-trip-log-editor--trip-purpose-row select {
    left: 64px;
    border: none;
    color: #757575;
    margin: 8px 0px 16px; }
  .cc-trip-log-editor--md-radio-group {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row;
        flex-direction: row;
    padding: 8px 0 0 52px; }
  .cc-trip-log-editor--md-radio-button {
    margin-right: 24px;
    color: #757575;
    transition: font-weight 0.2s ease; }
  .cc-trip-log-editor--trip-address-row {
    padding: 16px 16px 0px; }
  .cc-trip-log-editor--trip-details-inner-section {
    padding: 0px 52px;
    border-bottom: 1px solid #e0e0e0; }
  .cc-trip-log-editor--trip-form-label {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    height: 72px; }
  .cc-trip-log-editor--rs-timepicker {
    margin-left: 12px;
    max-width: 150px; }
  .cc-trip-log-editor--vehicle-selection {
    padding: 8px 16px;
    border-bottom: 1px solid #e0e0e0; }
    .cc-trip-log-editor--vehicle-selection select {
      left: 65px;
      border: none;
      color: #757575; }
  .cc-trip-log-editor--vehicle-selection-icon {
    color: #757575;
    font-size: 24px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: #e0e0e0;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    margin-right: 16px; }
  .cc-trip-log-editor--action-buttons {
    padding: 16px; }

/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.mobile-calendar {
  width: 100%; }
  .mobile-calendar .heading {
    height: 36px;
    background-color: #03a9f4;
    color: #fff;
    font-size: 16px;
    text-align: center; }
    .mobile-calendar .heading .heading-text {
      line-height: 36px; }
    .mobile-calendar .heading .heading-icon {
      padding: 8px; }
  .mobile-calendar .calendar-table {
    width: 100%;
    /*> thead > tr > th {
        vertical-align: bottom;
        border-bottom: 2px solid $table-border-color;
      }*/
    /*> caption + thead,
      > colgroup + thead,
      > thead:first-child {
        > tr:first-child {
          > th,
          > td {
            border-top: 0;
          }
        }
      }*/
    /*> tbody + tbody {
        border-top: 2px solid $table-border-color;
      }*/
    /*.table {
        background-color: $body-bg;
      }*/ }
    .mobile-calendar .calendar-table > thead > tr > th,
    .mobile-calendar .calendar-table > thead > tr > td,
    .mobile-calendar .calendar-table > tbody > tr > th,
    .mobile-calendar .calendar-table > tbody > tr > td,
    .mobile-calendar .calendar-table > tfoot > tr > th,
    .mobile-calendar .calendar-table > tfoot > tr > td {
      padding: 8px;
      vertical-align: middle;
      text-align: center;
      font-size: 14px;
      position: relative;
      /*&.selected{
                .day-number{
                    color:$brand-primary;
                    border: 1px solid $brand-primary;
                    border-radius:32px;
                    content:"";
                }
            }*/ }
      .mobile-calendar .calendar-table > thead > tr > th.otherMonth,
      .mobile-calendar .calendar-table > thead > tr > td.otherMonth,
      .mobile-calendar .calendar-table > tbody > tr > th.otherMonth,
      .mobile-calendar .calendar-table > tbody > tr > td.otherMonth,
      .mobile-calendar .calendar-table > tfoot > tr > th.otherMonth,
      .mobile-calendar .calendar-table > tfoot > tr > td.otherMonth {
        color: #b5b5b5; }
      .mobile-calendar .calendar-table > thead > tr > th.selected,
      .mobile-calendar .calendar-table > thead > tr > td.selected,
      .mobile-calendar .calendar-table > tbody > tr > th.selected,
      .mobile-calendar .calendar-table > tbody > tr > td.selected,
      .mobile-calendar .calendar-table > tfoot > tr > th.selected,
      .mobile-calendar .calendar-table > tfoot > tr > td.selected {
        color: #03a9f4; }
      .mobile-calendar .calendar-table > thead > tr > th span.day-number,
      .mobile-calendar .calendar-table > thead > tr > td span.day-number,
      .mobile-calendar .calendar-table > tbody > tr > th span.day-number,
      .mobile-calendar .calendar-table > tbody > tr > td span.day-number,
      .mobile-calendar .calendar-table > tfoot > tr > th span.day-number,
      .mobile-calendar .calendar-table > tfoot > tr > td span.day-number {
        height: 32px !important;
        width: 32px !important;
        position: relative; }
      .mobile-calendar .calendar-table > thead > tr > th span.selected:before,
      .mobile-calendar .calendar-table > thead > tr > td span.selected:before,
      .mobile-calendar .calendar-table > tbody > tr > th span.selected:before,
      .mobile-calendar .calendar-table > tbody > tr > td span.selected:before,
      .mobile-calendar .calendar-table > tfoot > tr > th span.selected:before,
      .mobile-calendar .calendar-table > tfoot > tr > td span.selected:before {
        position: absolute;
        content: "";
        border-radius: 30px;
        width: 32px;
        height: 32px;
        border: 1px solid #03a9f4;
        top: -6px;
        left: -7px; }
      .mobile-calendar .calendar-table > thead > tr > th span.selected-offset:before,
      .mobile-calendar .calendar-table > thead > tr > td span.selected-offset:before,
      .mobile-calendar .calendar-table > tbody > tr > th span.selected-offset:before,
      .mobile-calendar .calendar-table > tbody > tr > td span.selected-offset:before,
      .mobile-calendar .calendar-table > tfoot > tr > th span.selected-offset:before,
      .mobile-calendar .calendar-table > tfoot > tr > td span.selected-offset:before {
        position: absolute;
        content: "";
        border-radius: 30px;
        width: 32px;
        height: 32px;
        border: 1px solid #03a9f4;
        top: -6px;
        left: -11px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
user-vehicle-editor {
  display: -ms-flexbox;
  display: flex;
  width: 100%; }

/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.commute-summary-module {
  height: 200px;
  width: 448px;
  /*updated Log A Trip design*/ }
  .commute-summary-module--progress-container {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    margin: 0 auto;
    display: table; }
  .commute-summary-module .paper-card-heading {
    background-color: #03a9f4;
    color: #fff;
    line-height: 24px; }
    .commute-summary-module .paper-card-heading .heading-text {
      text-align: center;
      vertical-align: middle; }
    .commute-summary-module .paper-card-heading .rs-icon {
      height: 100%;
      font-size: 12px;
      line-height: 24px;
      padding: 0 10px;
      cursor: pointer;
      position: absolute; }
      .commute-summary-module .paper-card-heading .rs-icon:hover {
        background: rgba(255, 255, 255, 0.3); }
      .commute-summary-module .paper-card-heading .rs-icon._back-btn2 {
        left: 0; }
      .commute-summary-module .paper-card-heading .rs-icon._next-btn {
        right: 0; }
  .commute-summary-module .calendar-area {
    width: 216px;
    background: #f9f9f9;
    height: auto;
    float: left; }
    .commute-summary-module .calendar-area table {
      width: 100%;
      margin: 0; }
      .commute-summary-module .calendar-area table thead tr th {
        border: none;
        text-align: center;
        font-weight: normal;
        font-size: 12px;
        font-weight: 500;
        padding: 0; }
      .commute-summary-module .calendar-area table tbody tr td {
        border: none;
        text-align: center;
        font-weight: lighter;
        font-size: 12px;
        height: auto;
        width: 46px;
        padding: 1px;
        cursor: pointer; }
        .commute-summary-module .calendar-area table tbody tr td .day-number {
          height: 24px;
          width: 24px;
          border-radius: 12px;
          border: 1px solid transparent;
          margin: 0 auto; }
        .commute-summary-module .calendar-area table tbody tr td.otherMonth {
          color: #b5b5b5;
          cursor: default; }
          .commute-summary-module .calendar-area table tbody tr td.otherMonth:hover {
            background: none; }
        .commute-summary-module .calendar-area table tbody tr td.hasTrips {
          color: #03a9f4; }
          .commute-summary-module .calendar-area table tbody tr td.hasTrips .day-number {
            border: 1px solid #03a9f4; }
        .commute-summary-module .calendar-area table tbody tr td:hover .day-number {
          background: #efefef; }
        .commute-summary-module .calendar-area table tbody tr td.selected .day-number {
          color: #fff;
          border: 1px solid #03a9f4;
          background-color: #03a9f4; }
          .commute-summary-module .calendar-area table tbody tr td.selected .day-number.future-date {
            border: 1px solid #b5b5b5;
            background-color: #b5b5b5; }
  .commute-summary-module .info-area {
    float: right;
    height: 200px;
    width: 232px; }
    .commute-summary-module .info-area .info-body {
      height: 138px;
      overflow: auto; }
      .commute-summary-module .info-area .info-body .help-text {
        text-align: center;
        padding: 16px 24px;
        padding-top: 50px;
        white-space: normal; }
        .commute-summary-module .info-area .info-body .help-text h4 {
          font-weight: bold;
          font-size: 14px;
          color: #464646;
          margin-bottom: 16px; }
        .commute-summary-module .info-area .info-body .help-text p {
          font-weight: normal;
          font-size: 12px;
          color: #868686;
          line-height: 18px;
          padding: 0 10px; }
      .commute-summary-module .info-area .info-body ul.trip-items-list {
        padding: 0; }
        .commute-summary-module .info-area .info-body ul.trip-items-list .trip-item-row {
          margin: 0;
          padding: 4px 8px;
          height: 32px;
          line-height: 24px;
          vertical-align: middle;
          cursor: pointer; }
          .commute-summary-module .info-area .info-body ul.trip-items-list .trip-item-row .row-icon {
            display: block;
            float: left;
            text-align: center;
            width: 24px;
            height: 24px; }
            .commute-summary-module .info-area .info-body ul.trip-items-list .trip-item-row .row-icon .mode-icon {
              width: 24px;
              height: 24px; }
          .commute-summary-module .info-area .info-body ul.trip-items-list .trip-item-row .row-text {
            float: left;
            margin-top: 0;
            margin-left: 12px;
            font-size: 12px;
            color: #878787; }
  .commute-summary-module--updated-info-area {
    border-left: 1px solid rgba(0, 0, 0, 0.12); }
  .commute-summary-module--info-header {
    height: 24px;
    position: relative; }
  .commute-summary-module--help-text-with-icon.help-text {
    padding: 12px 16px !important; }
  .commute-summary-module--zero-trip-icon {
    font-size: 72px;
    color: rgba(0, 0, 0, 0.26); }
  .commute-summary-module--zero-trip-image {
    padding: 0px 0px 4px; }
  .commute-summary-module--zero-trip-text {
    color: rgba(0, 0, 0, 0.54); }
  .commute-summary-module--updated-info-action-area {
    border-top: 1px solid rgba(0, 0, 0, 0.12);
    display: -ms-flexbox;
    display: flex; }
    .commute-summary-module--updated-info-action-area.pad-right {
      padding-right: 2px !important; }
  .commute-summary-module--log-trip-text {
    width: 100%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
        justify-content: center;
    -ms-flex-align: center;
        align-items: center; }
  .commute-summary-module--log-trip-icon.rs-icon._plus {
    font-size: 14px;
    padding: 8px 16px; }
  .commute-summary-module--add-trip-button {
    margin-left: auto; }
    .commute-summary-module--add-trip-button.icon-button {
      width: 36px;
      height: 36px;
      background-color: #03a9f4; }
    .commute-summary-module--add-trip-button.icon-button > .rs-icon {
      width: 20px;
      height: 20px;
      font-size: 20px;
      margin: 8px;
      color: #fff; }
    .commute-summary-module--add-trip-button.alt--text-button {
      background-color: #fff; }
      .commute-summary-module--add-trip-button.alt--text-button .rs-icon {
        color: #03a9f4; }
    .commute-summary-module--add-trip-button.alt--full-width {
      width: 100%;
      display: -ms-flexbox;
      display: flex;
      -ms-flex-pack: center;
          justify-content: center;
      -ms-flex-align: center;
          align-items: center;
      text-decoration: none;
      background-color: transparent;
      color: #03a9f4; }
      .commute-summary-module--add-trip-button.alt--full-width:hover {
        background-color: #e6e6e6; }
  .commute-summary-module--add-trip-icon {
    font-size: 20px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
@media only print {
  .print-modal-root ~ * {
    display: none !important; }
  .print-modal-root {
    display: block;
    width: auto !important;
    height: auto !important;
    position: static;
    border: none; }
    .print-modal-root .modal-dialog {
      position: static !important;
      height: auto !important;
      width: auto !important;
      max-height: none !important;
      max-width: none !important;
      transform: none !important; }
    .print-modal-root .paper-card {
      width: 100% !important;
      height: auto !important;
      position: static !important;
      max-width: none !important;
      max-height: none !important;
      margin: 0;
      box-shadow: none;
      border: none;
      left: unset !important;
      right: unset !important;
      top: unset !important;
      bottom: unset !important;
      margin: auto !important; }
    .print-modal-root .paper-card-heading,
    .print-modal-root .paper-card-bottom-action-area {
      display: none !important; }
    .print-modal-root .paper-card-body {
      max-height: none !important;
      height: auto !important;
      padding: unset !important;
      margin: auto !important; }
      .print-modal-root .paper-card-body .paper-card-body-content {
        max-height: unset !important;
        padding-bottom: unset !important;
        position: static !important;
        overflow-y: unset !important; } }

@media only screen {
  .print-modal-root .modal-paper .paper-card .paper-card-body .paper-card-body-content {
    max-height: 510px;
    margin-bottom: 48px; } }

.table.print-table {
  page-break-after: always !important;
  page-break-inside: avoid !important;
  margin: auto !important;
  padding: unset !important; }
  .table.print-table td {
    page-break-inside: avoid !important; }
  .table.print-table .col-1-1 {
    max-width: 100%; }
  .table.print-table .col-1-2 {
    max-width: 50%; }
  .table.print-table .col-1-3 {
    max-width: 33%; }
  .table.print-table .col-1-4 {
    max-width: 25%; }
  .table.print-table .col-1-5 {
    max-width: 20%; }
  .table.print-table .col-1-6 {
    max-width: 16%; }
  .table.print-table .col-1-7 {
    max-width: 14%; }
  .table.print-table .col-1-8 {
    max-width: 12.5%; }
  .table.print-table .col-1-9 {
    max-width: 12.5%; }
  .table.print-table .col-1-10 {
    max-width: 10%; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.schedule-summary-table:before, .schedule-summary-table:after {
  content: " ";
  display: table; }

.schedule-summary-table:after {
  clear: both; }

.schedule-summary-strip {
  -webkit-user-select: none;
  /* Chrome all / Safari all */
  -moz-user-select: none;
  /* Firefox all */
  -ms-user-select: none;
  /* IE 10+ */
  /* No support for these yet, use at own risk */
  -o-user-select: none;
  user-select: none;
  cursor: pointer;
  cursor: pointer; }
  .schedule-summary-strip > .schedule-summary-day {
    float: left;
    text-align: center;
    position: relative;
    width: 16px;
    height: 24px;
    padding: 2px 0;
    margin: 0 3px 0 0;
    -webkit-user-select: none;
    /* Chrome all / Safari all */
    -moz-user-select: none;
    /* Firefox all */
    -ms-user-select: none;
    /* IE 10+ */
    /* No support for these yet, use at own risk */
    -o-user-select: none;
    user-select: none;
    cursor: pointer; }
    .schedule-summary-strip > .schedule-summary-day:last-child {
      margin-right: 0; }
    .schedule-summary-strip > .schedule-summary-day .summary-day-indicator.depart-indicator {
      top: 0;
      right: 5px;
      position: absolute;
      margin: 0;
      padding: 0;
      width: 8px;
      height: 2px;
      background-color: #0FB62B; }
      .schedule-summary-strip > .schedule-summary-day .summary-day-indicator.depart-indicator:before {
        content: "";
        position: absolute;
        width: 0;
        height: 0;
        border: 3px solid transparent;
        border-left-color: #0FB62B;
        right: -6px;
        top: -2px; }
    .schedule-summary-strip > .schedule-summary-day .summary-day-indicator.return-indicator {
      bottom: -2px;
      left: 5px;
      position: absolute;
      margin: 0;
      padding: 0;
      width: 8px;
      height: 2px;
      background-color: #0FB62B; }
      .schedule-summary-strip > .schedule-summary-day .summary-day-indicator.return-indicator:before {
        content: "";
        position: absolute;
        width: 0;
        height: 0;
        border: 3px solid transparent;
        border-right-color: #0FB62B;
        left: -6px;
        top: -2px; }
    .schedule-summary-strip > .schedule-summary-day .summary-day-text {
      width: 13px;
      height: 16px;
      line-height: 16px;
      margin: 3px 1.5px;
      float: left; }
      .schedule-summary-strip > .schedule-summary-day .summary-day-text.day-match {
        background-color: transparent;
        color: #0FB62B; }

.schedule-summary-table {
  display: block;
  width: 100%;
  margin: 0 auto;
  position: relative;
  padding-top: 16px; }
  .schedule-summary-table .header-title-color-bar {
    width: 100%;
    height: 4px;
    background-color: #2ebcfc;
    position: absolute;
    top: 0;
    z-index: 0; }
  .schedule-summary-table .schedule-summary-table-header, .schedule-summary-table .schedule-summary-table-body {
    width: 320px;
    margin: 0 auto; }
  .schedule-summary-table .schedule-summary-table-header .column-title {
    color: #898989;
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 16px; }
  .schedule-summary-table .schedule-summary-table-body {
    position: relative; }
    .schedule-summary-table .schedule-summary-table-body .summary-table-day {
      list-style: none; }
    .schedule-summary-table .schedule-summary-table-body .day-value, .schedule-summary-table .schedule-summary-table-body .day-name {
      font-family: 'Roboto', Arial, sans-serif;
      font-size: 16px;
      color: #898989;
      font-weight: lighter; }
    .schedule-summary-table .schedule-summary-table-body .day-value.day-match {
      color: #0FB62B;
      font-weight: bold; }
    .schedule-summary-table .schedule-summary-table-body.center-divider {
      padding-left: 0; }
      .schedule-summary-table .schedule-summary-table-body.center-divider:before {
        content: "";
        display: block;
        height: 100%;
        border-left: 1px solid #4C4C4C;
        width: 1px;
        position: absolute;
        left: 176px;
        top: 0; }
  .schedule-summary-table .summary-table-row {
    width: 100%;
    float: left;
    min-height: 32px; }
    .schedule-summary-table .summary-table-row .label-column {
      width: 56px;
      float: left;
      text-align: right; }
      .schedule-summary-table .summary-table-row .label-column.label-column-large {
        width: 96px; }
    .schedule-summary-table .summary-table-row .left-column {
      width: 126px;
      float: left;
      margin-right: 8px;
      padding-left: 16px; }
    .schedule-summary-table .summary-table-row .right-column {
      width: 126px;
      float: left;
      padding-left: 16px; }
    .schedule-summary-table .summary-table-row .center-column {
      width: 112px;
      float: left;
      margin-left: 84px;
      padding-left: 16px; }

/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.next-single-trip.next-single-trip-one-line .departure-text, .next-single-trip.next-single-trip-one-line .departure-date {
  float: left;
  padding-left: 16px;
  padding-right: 16px; }

.next-single-trip.bottom-margin {
  margin-bottom: 16px; }

.next-single-trip.only-show-time .departure-date {
  display: none !important; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.matched-icon-set .matched-icon {
  line-height: 1;
  text-align: center;
  display: inline-block;
  width: 20px;
  height: 20px;
  padding-top: 0px;
  font-size: 20px;
  margin-right: 6px;
  vertical-align: top;
  float: left;
  color: #555; }
  .matched-icon-set .matched-icon:last-child {
    margin-right: 0; }
  .matched-icon-set .matched-icon.not-applicable {
    color: #f2f2f2; }

.matched-icon-set .matched-icon-text {
  display: inline-block;
  min-height: 20px;
  padding-top: 0px; }

.matched-icon._male {
  color: #3f51b5; }

.matched-icon._female {
  color: #bf82cc; }

.matched-icon._steering-wheel {
  color: #ff9d4d; }

.matched-icon._passenger {
  color: #ce467c; }

.matched-icon._smoking {
  color: #9ccc65; }

.matched-icon._non-smoking {
  color: #689f38; }

.matched-icon._briefcase {
  color: #b3b84f; }

.matched-icon._facebook {
  color: #4A6EA9; }

.matched-icon._mentor {
  color: #56A4A3; }

[class*="_star"].matched-icon {
  color: #DEBD5C;
  font-size: 24px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.row.row-ds {
  margin: 0;
  padding: 0;
  float: left;
  clear: left;
  width: 100%; }
  .row.row-ds .col-1 {
    float: left;
    width: 8.33333%; }
    .row.row-ds .col-1:last-child {
      float: right; }
  .row.row-ds .col-2 {
    float: left;
    width: 16.66667%; }
    .row.row-ds .col-2:last-child {
      float: right; }
  .row.row-ds .col-3 {
    float: left;
    width: 25%; }
    .row.row-ds .col-3:last-child {
      float: right; }
  .row.row-ds .col-4 {
    float: left;
    width: 33.33333%; }
    .row.row-ds .col-4:last-child {
      float: right; }
  .row.row-ds .col-5 {
    float: left;
    width: 41.66667%; }
    .row.row-ds .col-5:last-child {
      float: right; }
  .row.row-ds .col-6 {
    float: left;
    width: 50%; }
    .row.row-ds .col-6:last-child {
      float: right; }
  .row.row-ds .col-7 {
    float: left;
    width: 58.33333%; }
    .row.row-ds .col-7:last-child {
      float: right; }
  .row.row-ds .col-8 {
    float: left;
    width: 66.66667%; }
    .row.row-ds .col-8:last-child {
      float: right; }
  .row.row-ds .col-9 {
    float: left;
    width: 75%; }
    .row.row-ds .col-9:last-child {
      float: right; }
  .row.row-ds .col-10 {
    float: left;
    width: 83.33333%; }
    .row.row-ds .col-10:last-child {
      float: right; }
  .row.row-ds .col-11 {
    float: left;
    width: 91.66667%; }
    .row.row-ds .col-11:last-child {
      float: right; }
  .row.row-ds .col-12 {
    float: left;
    width: 100%; }
    .row.row-ds .col-12:last-child {
      float: right; }

.search-result {
  cursor: pointer; }

/*
        IE 8 modifications.
    */
body.ie8 .search-result {
  min-height: 0 !important;
  height: 68px !important; }
  body.ie8 .search-result .details-section {
    height: 68px; }
  body.ie8 .search-result.search-result-vanpool .details-section .bottom-half .col-5 {
    width: 80px; }
  body.ie8 .search-result.search-result-vanpool .details-section .bottom-half .col-7 {
    width: 140px; }

.no-flexbox .join-section .send-email-button {
  padding: 8px 0; }

.search-result {
  width: 100%;
  min-height: 68px;
  margin: 0;
  padding: 0;
  transition: background-color 0.06s ease-in-out;
  border: none;
  cursor: pointer; }
  .search-result .main-click-area {
    width: 79.54545%;
    height: 100%;
    float: left; }
  .search-result .avatar-section {
    float: left;
    width: 18.85714%; }
    .search-result .avatar-section .avatar-circle {
      float: left;
      margin-left: 9px;
      margin-top: 6px;
      border-radius: 50px;
      width: 50px;
      height: 50px; }
  .search-result .details-section {
    width: 81.14286%;
    float: left;
    padding-right: 8px; }
    .search-result .details-section:before, .search-result .details-section:after {
      content: " ";
      display: table; }
    .search-result .details-section:after {
      clear: both; }
    .search-result .details-section button {
      text-align: left; }
    .search-result .details-section .top-half, .search-result .details-section .bottom-half {
      width: 100%;
      min-height: 34px;
      float: left;
      clear: left; }
    .search-result .details-section .top-half {
      padding-top: 6px; }
    .search-result .details-section .bottom-half {
      padding-bottom: 6px; }
  .search-result .join-section {
    background-color: #fff;
    height: 68px;
    width: 18.18182%;
    float: right;
    border-left: 1px solid #f0f0f0; }
    .search-result .join-section.paper-button {
      padding: 0;
      margin: 0; }
  .search-result .admin-section {
    float: left;
    clear: left;
    width: 100%;
    padding-bottom: 16px; }
    .search-result .admin-section .admin-datum {
      float: left;
      width: 100%; }
  .search-result.list-group-item {
    border-top: 1px solid #ddd; }
  .search-result.is-expanded, .search-result.is-hovered {
    background-color: #e6e6e6; }
  .search-result.is-showing-admin {
    height: auto; }
  .search-result.search-result-commuter .join-section .send-email-button, .search-result.search-result-carpoolRide .join-section .send-email-button {
    width: 100%;
    margin: auto;
    height: 68px;
    background: no-repeat 0 0 url("/Images/SPA/envelope_bg.png");
    background-color: #03a9f4;
    text-transform: uppercase;
    color: #03a9f4;
    font-size: 12px;
    box-shadow: none;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-line-pack: center;
        align-content: center;
    -ms-flex-pack: center;
        justify-content: center; }
    .search-result.search-result-commuter .join-section .send-email-button .send-email-button-text, .search-result.search-result-carpoolRide .join-section .send-email-button .send-email-button-text {
      margin-top: auto;
      margin-bottom: auto; }
    .search-result.search-result-commuter .join-section .send-email-button:hover, .search-result.search-result-carpoolRide .join-section .send-email-button:hover {
      background-color: #60ccfd;
      background-image: url("/Images/SPA/envelope_bg-white.png");
      color: #fff;
      color: rgba(255, 255, 255, 0.9); }
    .search-result.search-result-commuter .join-section .send-email-button:active, .search-result.search-result-carpoolRide .join-section .send-email-button:active {
      background-color: #0286c2;
      background-image: url("/Images/SPA/envelope_bg-white.png");
      color: #fff; }
  .search-result.search-result-commuter .join-section:hover, .search-result.search-result-carpoolRide .join-section:hover {
    box-shadow: 0 0px 12px 1px rgba(0, 0, 0, 0.3); }
    .search-result.search-result-commuter .join-section:hover .send-email-button, .search-result.search-result-carpoolRide .join-section:hover .send-email-button {
      background-color: #60ccfd;
      background-image: url("/Images/SPA/envelope_bg-white.png");
      color: #fff;
      color: rgba(255, 255, 255, 0.9); }
  .search-result.search-result-vanpool .avatar-section {
    min-width: 36px;
    width: 8.18182%; }
  .search-result.search-result-vanpool .details-section {
    width: 56.81818%;
    padding-left: 8px; }
    .search-result.search-result-vanpool .details-section .top-half {
      padding-top: 2px; }
    .search-result.search-result-vanpool .details-section .bottom-half {
      padding-top: 4px;
      padding-bottom: 2px; }
      .search-result.search-result-vanpool .details-section .bottom-half > div {
        display: -ms-flexbox;
        display: flex;
        min-height: 24px;
        -ms-flex-line-pack: center;
            align-content: center;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap; }
        .search-result.search-result-vanpool .details-section .bottom-half > div > span {
          -ms-flex-item-align: center;
              -ms-grid-row-align: center;
              align-self: center;
          margin-bottom: 1px; }
  .search-result.search-result-vanpool .join-section {
    width: 33.63636%;
    padding-top: 16px;
    background-color: transparent; }
  .search-result.search-result-transit {
    padding: 0;
    margin: 0;
    height: 80px; }
    .search-result.search-result-transit .details-section {
      margin: 0;
      padding: 0;
      width: 100%; }
      .search-result.search-result-transit .details-section .top-half, .search-result.search-result-transit .details-section .bottom-half {
        width: 100%;
        float: left;
        clear: left;
        margin: 0;
        padding: 0; }
      .search-result.search-result-transit .details-section .top-half {
        height: 24px;
        padding: 8px 8px 0; }
      .search-result.search-result-transit .details-section .bottom-half {
        height: 56px;
        padding: 4px 20px 12px; }
    .search-result.search-result-transit._hover-style:hover {
      background-color: rgba(3, 169, 244, 0.1); }

.map-pin.map-pin-search-result {
  height: 27px;
  width: 20px;
  position: absolute;
  top: 28px;
  left: 3px;
  transform: none; }
  .map-pin.map-pin-search-result .pin-data {
    color: #1e64a6;
    background-color: #fff;
    border: 1px solid #1e64a6;
    border-radius: 20px;
    width: 20px;
    height: 20px; }
    .map-pin.map-pin-search-result .pin-data .pin-number {
      font-family: 'Roboto', Arial, sans-serif;
      font-size: 12px;
      font-weight: 500; }
    .map-pin.map-pin-search-result .pin-data img.pin-image {
      position: absolute;
      width: 125%;
      height: 125%;
      left: -12.5%;
      top: -12.5%; }
  .map-pin.map-pin-search-result .pin-tail {
    border-top-color: #1e64a6;
    top: 12px;
    left: 3px;
    border-width: 16px 7px 0 7px; }
  .map-pin.map-pin-search-result.map-pin-search-result-vanpool {
    width: 28px;
    height: 40px;
    bottom: 0;
    top: 14px;
    left: 5px; }
    .map-pin.map-pin-search-result.map-pin-search-result-vanpool .pin-data {
      width: 28px;
      height: 28px;
      border-radius: 28px;
      border-width: 3px;
      padding-top: 3px; }
    .map-pin.map-pin-search-result.map-pin-search-result-vanpool .pin-tail {
      border-width: 20px 10px 0 10px;
      top: 20px;
      left: 4px; }

@media only screen and (min-height: 665px) {
  .search-results-list {
    max-height: 300px !important; } }

@media only screen and (max-height: 830px) {
  .search-results-list {
    max-height: 260px !important; } }

@media only screen and (max-height: 800px) {
  .search-results-list {
    max-height: 220px !important; } }

@media only screen and (max-height: 760px) {
  .search-results-list {
    max-height: 180px !important; } }

@media only screen and (max-height: 720px) {
  .search-results-list {
    max-height: 130px !important; } }

.fco-search-results-list {
  position: relative;
  width: 100%;
  overflow-x: hidden;
  transition: height 0.15s ease-in-out;
  position: relative;
  overflow-y: auto;
  -ms-overflow-style: -ms-autohiding-scrollbar;
  /* Set width */
  /* Track */
  /* Handle */
  max-height: 180px;
  -ms-overflow-style: scrollbar !important; }
  .fco-search-results-list::-webkit-scrollbar {
    width: 8px; }
  .fco-search-results-list::-webkit-scrollbar-track {
    display: none; }
  .fco-search-results-list::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: rgba(200, 200, 200, 0.8);
    box-shadow: inset 0 0 6px rgba(200, 200, 200, 0.8); }
  .fco-search-results-list::-webkit-scrollbar-thumb:window-inactive {
    background: rgba(201, 201, 201, 0.8); }
  @media only screen and (min-height: 665px) {
    .fco-search-results-list {
      max-height: 300px; } }
  @media only screen and (min-height: 990px) {
    .fco-search-results-list {
      max-height: 300px; } }
  .fco-search-results-list.__show-larger-list {
    max-height: 300px; }
    @media only screen and (min-height: 665px) {
      .fco-search-results-list.__show-larger-list {
        max-height: 420px; } }
    @media only screen and (min-height: 990px) {
      .fco-search-results-list.__show-larger-list {
        max-height: 420px; } }
  .fco-search-results-list.__animated:not(:empty) {
    min-height: 60px; }
  .fco-search-results-list.__animated .paper-list {
    position: relative;
    left: 0;
    opacity: 1; }
    .fco-search-results-list.__animated .paper-list.ng-animate {
      transition: left 0.1s ease-in-out, opacity 0.1s ease-in-out; }
      .fco-search-results-list.__animated .paper-list.ng-animate.ng-enter {
        position: absolute;
        left: -100%;
        opacity: 0;
        top: 0; }
        .fco-search-results-list.__animated .paper-list.ng-animate.ng-enter.ng-enter-active {
          left: 0;
          opacity: 1; }
      .fco-search-results-list.__animated .paper-list.ng-animate.ng-leave {
        left: 0; }
        .fco-search-results-list.__animated .paper-list.ng-animate.ng-leave.ng-leave-active {
          left: 100%;
          opacity: 0; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.option-statistics {
  padding-right: 8px;
  width: 100%; }
  .option-statistics .statistic {
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 12px;
    font-weight: 400;
    float: left;
    color: #898989;
    white-space: nowrap;
    text-align: right;
    text-overflow: clip; }
    .option-statistics .statistic.duration {
      text-align: left;
      font-weight: bold;
      width: 20%; }
    .option-statistics .statistic.distance {
      width: 20%; }
    .option-statistics .statistic.co2 {
      width: 35%; }
    .option-statistics .statistic.calories {
      width: 25%; }
    .option-statistics .statistic.good-statistic {
      color: #26a69a; }
    .option-statistics .statistic.bad-statistic {
      color: #ef5350; }

@media only screen and (max-height: 800px) {
  .commute-options-list {
    max-height: 310px !important; } }

@media only screen and (max-height: 760px) {
  .commute-options-list {
    max-height: 270px !important; } }

@media only screen and (max-height: 720px) {
  .commute-options-list {
    max-height: 220px !important; } }

@media only screen and (max-height: 660px) {
  .commute-options-list {
    max-height: 190px !important; } }

@media only screen and (max-height: 660px) {
  .commute-options-list {
    max-height: 190px !important; } }

@media only screen and (max-height: 600px) {
  .commute-options-list {
    max-height: 140px !important; } }

@media only screen and (max-height: 580px) {
  .commute-options-list {
    max-height: 120px !important; } }

.paper-list .list-group-item.commute-option {
  margin: 0;
  padding: 0;
  width: 100%;
  float: left;
  border: none; }

.commute-options-list {
  overflow-x: hidden;
  overflow-y: auto;
  max-height: 240px; }

@media only screen and (max-height: 530px) {
  .commute-options-list {
    overflow-x: hidden;
    overflow-y: auto;
    max-height: 240px; } }

@media only screen and (min-height: 530px) {
  .commute-options-list {
    max-height: 320px; } }

@media only screen and (min-height: 665px) {
  .commute-options-list {
    max-height: 380px; } }

@media only screen and (min-height: 800px) {
  .commute-options-list {
    max-height: none; } }

.commute-option {
  cursor: pointer;
  width: 100%;
  height: 68px;
  float: left;
  margin: 0;
  padding: 0; }
  .commute-option .avatar-section {
    width: 16.36364%;
    height: 100%;
    float: left;
    text-align: center;
    padding: 20px 16px;
    overflow: hidden;
    position: relative; }
    .commute-option .avatar-section .rs-icon {
      color: #fff;
      font-size: 32px; }
    .commute-option .avatar-section .rs-icon.faded-background {
      color: rgba(0, 0, 0, 0);
      color: rgba(255, 255, 255, 0.12);
      font-size: 70px;
      position: absolute;
      left: -32px;
      top: 4px; }
      .commute-option .avatar-section .rs-icon.faded-background._walking {
        left: -24px; }
      .commute-option .avatar-section .rs-icon.faded-background._bicycle {
        font-size: 90px;
        top: -4px;
        left: -48px; }
      .commute-option .avatar-section .rs-icon.faded-background._car-icon {
        font-size: 82px;
        top: 0;
        left: -44px; }
  .commute-option .details-section {
    width: 83.63636%;
    float: right;
    padding: 8px;
    height: 100%; }
    .commute-option .details-section .details {
      height: 100%;
      float: left;
      padding-left: 8px;
      width: 89.13043%; }
    .commute-option .details-section .matches-count {
      width: 10.86957%;
      display: block;
      text-align: right;
      font-size: 22px;
      height: 100%;
      float: left;
      text-overflow: clip;
      white-space: nowrap; }
    .commute-option .details-section .top-half, .commute-option .details-section .bottom-half {
      width: 100%;
      float: left;
      clear: left; }
    .commute-option .details-section .bottom-half {
      margin-top: 8px; }
    .commute-option .details-section .primary-text {
      font-family: 'Roboto', Arial, sans-serif;
      font-size: 20px;
      font-weight: 300;
      line-height: 22px;
      float: left;
      color: #464646; }
    .commute-option .details-section .secondary-text {
      font-family: 'Roboto', Arial, sans-serif;
      font-size: 12px;
      font-weight: 300;
      line-height: 16px;
      float: left;
      clear: left;
      color: #898989;
      position: absolute;
      bottom: 16px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.data-section {
  margin-top: 16px; }
  .data-section:first-child {
    margin-top: 0; }

.data-columns {
  float: left;
  clear: left;
  margin-bottom: 0; }
  .data-columns .data-number {
    display: inline-block;
    width: 20px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
body.ie8 .paper-card.paper-card-searchbox.is-collapsed-searchbox .row {
  display: none; }

.paper-card.paper-card-searchbox {
  margin-bottom: 4px;
  position: relative;
  transition: height 0.1s linear;
  box-shadow: 0px 0px 9px 1px rgba(0, 0, 0, 0.2); }
  .paper-card.paper-card-searchbox:before, .paper-card.paper-card-searchbox:after {
    content: " ";
    display: table; }
  .paper-card.paper-card-searchbox:after {
    clear: both; }
  .paper-card.paper-card-searchbox > .paper-card-heading {
    padding: 12px 16px;
    padding-bottom: 4px;
    transition: box-shadow 0.1s ease-in-out; }
    .paper-card.paper-card-searchbox > .paper-card-heading .primary-text {
      font-family: 'Roboto', Arial, sans-serif;
      font-size: 20px;
      line-height: 21px; }
  .paper-card.paper-card-searchbox > .paper-card-body {
    padding: 0 8px;
    height: auto;
    transition: height 0.1s ease-in-out; }
  .paper-card.paper-card-searchbox .collapse-target {
    transition: height 0.1s ease-in-out; }
  .paper-card.paper-card-searchbox .searchbox-ptb-row {
    overflow: visible;
    height: 88px; }
  .paper-card.paper-card-searchbox.is-collapsed-searchbox .collapse-target {
    overflow: hidden;
    height: 0; }
  .paper-card.paper-card-searchbox .weekly-schedule-preview ._edit-panel {
    top: -150px;
    min-width: 440px; }
  .paper-card.paper-card-searchbox.ng-animate.is-collapsed-searchbox-add .collapse-target, .paper-card.paper-card-searchbox.ng-animate.is-collapsed-searchbox-remove .collapse-target {
    overflow: hidden; }
  .paper-card.paper-card-searchbox.ng-animate.is-collapsed-searchbox-remove.ng-animate-active .searchbox-ptb-row {
    overflow: hidden;
    height: 88px; }
  .paper-card.paper-card-searchbox .paper-button-fab {
    position: absolute;
    right: 8px;
    bottom: 8px;
    z-index: 3;
    transition: bottom 0.1s ease-in-out; }

body.ie8 .flyout .flyout-card.flyout-favorite-trips .card-body {
  height: 170px; }
  body.ie8 .flyout .flyout-card.flyout-favorite-trips .card-body .paper-list {
    height: 120px;
    max-height: none; }

.flyout {
  position: absolute; }
  .flyout.is-open .card-body {
    width: auto; }
  .flyout.is-open .flyout-tab {
    border-bottom: transparent; }
  .flyout.is-open + .flyout {
    z-index: -1; }
  .flyout.is-open.with-custom-text .flyout-card {
    height: auto !important;
    overflow-y: auto; }
  .flyout.is-open.with-custom-text .paper-card-bottom-action-area {
    position: relative;
    top: auto;
    right: auto;
    left: auto;
    bottom: auto;
    border-top: 0;
    padding-top: 0; }
  .flyout.flyout-right {
    right: 0; }
    .flyout.flyout-right .flyout-tab {
      border-top-right-radius: 32px;
      border-bottom-right-radius: 32px;
      border-left: transparent;
      left: 0;
      transition: left 0.3s ease-in-out, background-color 0.3s ease-in-out, color 0.1s step-end 0.2s, border-color 0.3s ease-in-out;
      box-shadow: 5px 2px 9px 0px rgba(0, 0, 0, 0.2); }
    .flyout.flyout-right .flyout-card {
      left: 0; }
      .flyout.flyout-right .flyout-card .card-body {
        box-shadow: inset 8px 0px 9px -4px rgba(0, 0, 0, 0.2); }
    .flyout.flyout-right .card-heading {
      padding-left: 8px; }
      .flyout.flyout-right .card-heading .rs-icon {
        padding-right: 8px; }
    .flyout.flyout-right.is-open .flyout-tab {
      height: 33px;
      border-top-color: #bdbdbd !important; }
    .flyout.flyout-right.is-open .flyout-card {
      box-shadow: 8px 2px 22px -4px rgba(0, 0, 0, 0.2); }
  .flyout.flyout-left {
    left: 0; }
    .flyout.flyout-left .flyout-tab {
      border-top-left-radius: 32px;
      border-bottom-left-radius: 32px;
      border-right: transparent;
      right: 0;
      transition: right 0.3s ease-in-out, background-color 0.3s ease-in-out, color 0.1s step-end 0.2s, border-color 0.3s ease-in-out;
      box-shadow: -5px 2px 9px 0px rgba(0, 0, 0, 0.2); }
    .flyout.flyout-left .flyout-card {
      right: 0; }
      .flyout.flyout-left .flyout-card .card-body {
        box-shadow: inset -8px 0px 9px -4px rgba(0, 0, 0, 0.2); }
    .flyout.flyout-left .card-heading {
      padding-right: 8px; }
      .flyout.flyout-left .card-heading .rs-icon {
        padding-left: 8px; }
    .flyout.flyout-left.is-open .flyout-tab {
      height: 33px;
      border-top-color: #bdbdbd !important; }
    .flyout.flyout-left.is-open .flyout-card {
      box-shadow: -8px 2px 22px -4px rgba(0, 0, 0, 0.2); }
  .flyout.flyout-favorite-trips {
    top: -1px;
    height: 100%; }
    .flyout.flyout-favorite-trips .flyout-tab .paper-button.paper-button-icon {
      color: #0FB62B; }
    .flyout.flyout-favorite-trips .card-heading {
      background-color: #0FB62B; }
    .flyout.flyout-favorite-trips .flyout-card {
      height: 100%; }
    .flyout.flyout-favorite-trips.is-open .flyout-tab {
      left: 263px;
      background-color: #0FB62B;
      color: #fff !important; }
      .flyout.flyout-favorite-trips.is-open .flyout-tab .rs-icon {
        color: #fff !important; }
        .flyout.flyout-favorite-trips.is-open .flyout-tab .rs-icon:before, .flyout.flyout-favorite-trips.is-open .flyout-tab .rs-icon:after {
          color: #fff !important; }
        .flyout.flyout-favorite-trips.is-open .flyout-tab .rs-icon._exit {
          font-size: 12px; }
    .flyout.flyout-favorite-trips.is-open .flyout-card {
      width: 264px; }
      .flyout.flyout-favorite-trips.is-open .flyout-card .card-heading .rs-icon {
        color: #fff !important; }
        .flyout.flyout-favorite-trips.is-open .flyout-card .card-heading .rs-icon:before, .flyout.flyout-favorite-trips.is-open .flyout-card .card-heading .rs-icon:after {
          color: #fff !important; }
      .flyout.flyout-favorite-trips.is-open .flyout-card .card-body, .flyout.flyout-favorite-trips.is-open .flyout-card .card-heading {
        width: 264px; }
    .flyout.flyout-favorite-trips .flyout-card {
      height: calc(100% + 1px); }
      .flyout.flyout-favorite-trips .flyout-card .card-heading .rs-icon._favorite-trip {
        position: relative;
        top: 4px; }
      .flyout.flyout-favorite-trips .flyout-card .paper-list {
        max-height: 115px;
        max-height: calc(100% - 56px); }
  .flyout.flyout-trip-types {
    top: 30px;
    height: 112px; }
    .flyout.flyout-trip-types .flyout-tab .paper-button.paper-button-icon {
      color: #9573BB; }
    .flyout.flyout-trip-types .card-heading {
      background-color: #9573BB; }
    .flyout.flyout-trip-types .flyout-card {
      height: 112px; }
    .flyout.flyout-trip-types.is-open .flyout-tab {
      left: 173px;
      background-color: #9573BB;
      color: #fff !important; }
      .flyout.flyout-trip-types.is-open .flyout-tab .rs-icon {
        color: #fff !important; }
        .flyout.flyout-trip-types.is-open .flyout-tab .rs-icon:before, .flyout.flyout-trip-types.is-open .flyout-tab .rs-icon:after {
          color: #fff !important; }
        .flyout.flyout-trip-types.is-open .flyout-tab .rs-icon._exit {
          font-size: 12px; }
    .flyout.flyout-trip-types.is-open .flyout-card {
      width: 174px; }
      .flyout.flyout-trip-types.is-open .flyout-card .card-heading .rs-icon {
        color: #fff !important; }
        .flyout.flyout-trip-types.is-open .flyout-card .card-heading .rs-icon:before, .flyout.flyout-trip-types.is-open .flyout-card .card-heading .rs-icon:after {
          color: #fff !important; }
      .flyout.flyout-trip-types.is-open .flyout-card .card-body, .flyout.flyout-trip-types.is-open .flyout-card .card-heading {
        width: 174px; }
  .flyout + .flyout .flyout-tab {
    border-top-color: #fff; }
  .flyout.flyout-back-button {
    top: -1px; }
    .flyout.flyout-back-button .flyout-tab {
      width: 52px; }

.flyout-tab {
  -webkit-user-select: none;
  /* Chrome all / Safari all */
  -moz-user-select: none;
  /* Firefox all */
  -ms-user-select: none;
  /* IE 10+ */
  /* No support for these yet, use at own risk */
  -o-user-select: none;
  user-select: none;
  cursor: pointer; }

.flyout-tab {
  position: absolute;
  background-color: #fff;
  width: auto;
  min-width: 32px;
  height: 32px;
  border-radius: 0;
  z-index: 1;
  border: 1px solid #bdbdbd;
  text-align: center; }
  .flyout-tab:before, .flyout-tab:after {
    content: " ";
    display: table; }
  .flyout-tab:after {
    clear: both; }
  .flyout-tab .paper-button {
    margin: 3px auto; }

.flyout-card {
  position: absolute;
  width: 0;
  overflow-x: hidden;
  overflow-y: hidden;
  background-color: #fff;
  border-color: #bdbdbd;
  border-top-color: rgba(255, 255, 255, 0.7);
  border: 1px solid #bdbdbd;
  transition: width 0.3s ease-in-out; }
  .flyout-card:before, .flyout-card:after {
    content: " ";
    display: table; }
  .flyout-card:after {
    clear: both; }
  .flyout-card .card-heading {
    height: 32px;
    color: #fff;
    background-color: #03a9f4; }
  .flyout-card .card-body {
    height: calc(100% - 32px);
    padding: 0 16px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.paper-card.paper-card-expanded-commuter {
  position: relative;
  min-height: 480px; }
  .paper-card.paper-card-expanded-commuter .max-height-panel {
    max-height: 340px; }
    .paper-card.paper-card-expanded-commuter .max-height-panel.max-height-panel-body {
      max-height: 360px; }
  .paper-card.paper-card-expanded-commuter .tab-content {
    max-height: 320px; }
    .paper-card.paper-card-expanded-commuter .tab-content .row {
      margin-left: 0;
      margin-right: 0; }
  .paper-card.paper-card-expanded-commuter.commuter-contact-card textarea.text-field {
    min-height: 192px;
    margin-bottom: 8px;
    border: 1px solid #dfdfdf;
    cursor: text;
    padding: 8px; }
  .paper-card.paper-card-expanded-commuter.commuter-contact-card textarea:focus {
    border-color: #03a9f4; }

.paper-card-heading.paper-card-heading-commuter {
  padding: 16px 0;
  padding-bottom: 0;
  height: 66px; }
  .paper-card-heading.paper-card-heading-commuter .top-half, .paper-card-heading.paper-card-heading-commuter .bottom-half {
    width: 100%;
    float: left;
    clear: left;
    margin: 0;
    padding: 0; }
  .paper-card-heading.paper-card-heading-commuter .avatar-section {
    position: relative;
    float: left;
    width: 16.36364%;
    padding: 0 8px;
    height: 66px; }
    .paper-card-heading.paper-card-heading-commuter .avatar-section .MapPin {
      left: 8px;
      bottom: 0; }
  .paper-card-heading.paper-card-heading-commuter .details-section {
    float: right;
    width: 83.63636%; }
    .paper-card-heading.paper-card-heading-commuter .details-section .schedule-summary-table {
      float: right;
      margin-right: 24px; }
    .paper-card-heading.paper-card-heading-commuter .details-section .top-half {
      height: 32px; }
    .paper-card-heading.paper-card-heading-commuter .details-section .bottom-half {
      height: 32px; }
  .paper-card-heading.paper-card-heading-commuter .primary-text {
    margin-left: 40px; }
  .paper-card-heading.paper-card-heading-commuter .row .primary-text {
    margin-left: 0; }
  .paper-card-heading.paper-card-heading-commuter .avatar {
    margin-top: 8px; }
  .paper-card-heading.paper-card-heading-commuter .vanpool-pin-container {
    position: relative;
    left: 24px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.route-stops-table td {
  color: #464646;
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 12px;
  font-weight: 300;
  line-height: 16px; }

.route-stops-table .route-stop-number {
  color: #03a9f4; }
  .route-stops-table .route-stop-number .rs-icon {
    color: #464646;
    font-size: 16px;
    position: relative;
    top: 2px;
    width: 16px;
    padding-left: 4px; }

.paper-card.paper-card-expanded-vanpool {
  position: relative;
  width: 440px;
  height: 460px; }
  .paper-card.paper-card-expanded-vanpool .paper-tabs .tab-content {
    height: 276px; }
  .paper-card.paper-card-expanded-vanpool .PaperCardExpanded-body--maxHeight {
    max-height: 300px;
    position: relative;
    overflow-y: auto;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    /* Set width */
    /* Track */
    /* Handle */ }
    .paper-card.paper-card-expanded-vanpool .PaperCardExpanded-body--maxHeight::-webkit-scrollbar {
      width: 8px; }
    .paper-card.paper-card-expanded-vanpool .PaperCardExpanded-body--maxHeight::-webkit-scrollbar-track {
      display: none; }
    .paper-card.paper-card-expanded-vanpool .PaperCardExpanded-body--maxHeight::-webkit-scrollbar-thumb {
      border-radius: 10px;
      background-color: rgba(200, 200, 200, 0.8);
      box-shadow: inset 0 0 6px rgba(200, 200, 200, 0.8); }
    .paper-card.paper-card-expanded-vanpool .PaperCardExpanded-body--maxHeight::-webkit-scrollbar-thumb:window-inactive {
      background: rgba(201, 201, 201, 0.8); }

.paper-card-heading.paper-card-heading-vanpool {
  padding: 16px 0;
  padding-bottom: 0;
  height: 88px; }
  .paper-card-heading.paper-card-heading-vanpool .top-half, .paper-card-heading.paper-card-heading-vanpool .bottom-half {
    width: 100%;
    float: left;
    clear: left;
    margin: 0;
    padding: 0; }
  .paper-card-heading.paper-card-heading-vanpool .avatar-section {
    position: relative;
    float: left;
    width: 10.90909%;
    padding: 0 8px;
    height: 88px; }
    .paper-card-heading.paper-card-heading-vanpool .avatar-section .map-pin {
      top: 0;
      left: 8px;
      bottom: auto;
      right: auto; }
  .paper-card-heading.paper-card-heading-vanpool .details-section {
    float: right;
    width: 89.09091%; }
    .paper-card-heading.paper-card-heading-vanpool .details-section .vanpool-capacity-summary {
      /*width: grid-sections(4) + grid-units(3);*/
      width: 240px;
      /*This is equivalent to 240 px on Desktop and   6 * 56 = 330px on Mobile*/ }
    .paper-card-heading.paper-card-heading-vanpool .details-section .schedule-summary-table {
      float: right;
      margin-right: 24px; }
    .paper-card-heading.paper-card-heading-vanpool .details-section .top-half {
      min-height: 32px; }
    .paper-card-heading.paper-card-heading-vanpool .details-section .bottom-half {
      min-height: 48px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.paper-card.paper-card-expanded {
  position: relative;
  transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 8px 17px rgba(0, 0, 0, 0.2);
  width: 440px;
  position: relative; }

.paper-card-expanded-overlay-container {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 205; }

.paper-card-body.paper-card-body-expanded-data {
  padding: 0;
  padding-top: 8px; }
  .paper-card-body.paper-card-body-expanded-data .tab-pane {
    padding: 0 8px; }
  .paper-card-body.paper-card-body-expanded-data .aligned-row {
    padding: 0 40px; }
  .paper-card-body.paper-card-body-expanded-data .paper-tabs {
    position: absolute;
    width: 100%;
    margin-top: 8px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.searchSection:before, .searchSection:after {
  content: " ";
  display: table; }

.searchSection:after {
  clear: both; }

.searchSection {
  position: relative;
  margin-bottom: 40px;
  width: 440px; }
  .searchSection:last-child {
    margin-bottom: 0; }
  .searchSection .searchSection-overlay {
    position: absolute;
    width: 440px;
    left: 66px;
    z-index: 204; }
    .searchSection .searchSection-overlay.searchSection-overlay-vanpool {
      left: 36px; }
    .searchSection .searchSection-overlay.searchSection-overlay-expandedResult {
      width: 400px;
      top: -217px; }
      .searchSection .searchSection-overlay.searchSection-overlay-expandedResult.with-collapsed-searchbox {
        top: -85px; }
      @media only screen and (min-height: 665px) {
        .searchSection .searchSection-overlay.searchSection-overlay-expandedResult {
          top: -144px; }
          .searchSection .searchSection-overlay.searchSection-overlay-expandedResult.with-collapsed-searchbox {
            top: 40px; } }
      @media only screen and (min-height: 990px) {
        .searchSection .searchSection-overlay.searchSection-overlay-expandedResult {
          top: -144px; }
          .searchSection .searchSection-overlay.searchSection-overlay-expandedResult.with-collapsed-searchbox {
            top: 40px; } }

.searchSection.searchSection-with-drawer .searchSection-drawer-menu {
  position: absolute;
  width: 48px;
  left: -96px;
  top: 36px; }

.searchSection.searchSection-with-drawer .searchSection-main-content {
  position: absolute;
  left: 0; }

.searchSection.searchSection-with-drawer .searchSection-drawer-menu, .searchSection.searchSection-with-drawer .searchSection-main-content {
  transition: left 0.25s ease-in-out 0s; }

.searchSection.searchSection-with-drawer.drawer-is-open .searchSection-drawer-menu {
  left: 0px; }

.searchSection.searchSection-with-drawer.drawer-is-open .searchSection-main-content {
  left: 52px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.summarized-text {
  float: left;
  width: 100%; }
  .summarized-text .summarized-text-summary {
    float: left;
    width: 100%; }
  .summarized-text .summarized-text-expanded {
    float: left;
    width: 100%; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.email-preview-modal {
  bottom: 0 !important;
  /**
            Counteract styling which is set by the grid system
        */ }
  .email-preview-modal table {
    box-sizing: content-box; }
    .email-preview-modal table tr, .email-preview-modal table td, .email-preview-modal table tbody, .email-preview-modal table thead, .email-preview-modal table th, .email-preview-modal table p, .email-preview-modal table span, .email-preview-modal table div, .email-preview-modal table img, .email-preview-modal table a, .email-preview-modal table h1, .email-preview-modal table h2, .email-preview-modal table h3, .email-preview-modal table h4, .email-preview-modal table h5, .email-preview-modal table h6 {
      box-sizing: content-box; }
  .email-preview-modal table.row {
    margin-left: initial;
    margin-right: initial; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.SearchFilter {
  float: left;
  width: 100%; }
  .SearchFilter .SearchFilter-text {
    float: left;
    font-size: 14px !important;
    margin: 0;
    font-weight: normal;
    display: inline-block;
    line-height: 32px; }
  .SearchFilter .SearchFilter-textWithIcon {
    padding-left: 8px; }
  .SearchFilter .SearchFilter-icon {
    margin-right: 8px; }
  .SearchFilter .SearchFilter-checkbox {
    position: relative; }
  .SearchFilter .SearchFilter-radio {
    position: relative; }
  .SearchFilter.SearchFilter--withSelectInput:last-child {
    margin-bottom: 16px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.SearchFilters-groupedList {
  width: 50%;
  margin-bottom: 8px;
  float: left; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.map-controls {
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 100; }
  .map-controls > .paper-button, .map-controls > .multi-button {
    float: right;
    clear: right;
    margin-bottom: 8px; }
  .map-controls .custom-dropdown {
    position: absolute;
    right: 0; }
    .map-controls .custom-dropdown.custom-dropdown--pois {
      bottom: -40px; }
      .map-controls .custom-dropdown.custom-dropdown--pois .row-text {
        display: block;
        float: left;
        width: 150px; }
      .map-controls .custom-dropdown.custom-dropdown--pois .poi-icons {
        font-size: 20px;
        display: block;
        width: 24px;
        height: 24px;
        float: left; }
      .map-controls .custom-dropdown.custom-dropdown--pois .poi-label {
        max-width: 120px; }
    .map-controls .custom-dropdown.custom-dropdown--custom-routes {
      bottom: -88px; }
    .map-controls .custom-dropdown .close-button {
      top: 4px; }
    .map-controls .custom-dropdown .paper-dropdown-content {
      width: 290px !important; }
    .map-controls .custom-dropdown .paper-button-icon {
      display: -ms-flexbox;
      display: flex;
      -ms-flex-align: center;
          align-items: center;
      -ms-flex-pack: center;
          justify-content: center; }
    .map-controls .custom-dropdown .paper-list {
      position: relative;
      overflow-y: auto;
      -ms-overflow-style: -ms-autohiding-scrollbar;
      /* Set width */
      /* Track */
      /* Handle */
      position: static;
      overflow-y: auto;
      max-height: 300px; }
      .map-controls .custom-dropdown .paper-list::-webkit-scrollbar {
        width: 8px; }
      .map-controls .custom-dropdown .paper-list::-webkit-scrollbar-track {
        display: none; }
      .map-controls .custom-dropdown .paper-list::-webkit-scrollbar-thumb {
        border-radius: 10px;
        background-color: rgba(200, 200, 200, 0.8);
        box-shadow: inset 0 0 6px rgba(200, 200, 200, 0.8); }
      .map-controls .custom-dropdown .paper-list::-webkit-scrollbar-thumb:window-inactive {
        background: rgba(201, 201, 201, 0.8); }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.directions-summary:before, .directions-summary:after {
  content: " ";
  display: table; }

.directions-summary:after {
  clear: both; }

.directions-summary-leg:before, .directions-summary-leg:after {
  content: " ";
  display: table; }

.directions-summary-leg:after {
  clear: both; }

directions-summary-step {
  cursor: pointer; }

.directions-summary-leg {
  float: left;
  width: 100%;
  position: relative;
  margin: 0;
  padding: 0; }
  .directions-summary-leg .directions-summary-step {
    float: left;
    width: 100%;
    position: relative;
    padding-left: 0; }
    .directions-summary-leg .directions-summary-step .step-time {
      display: none; }
    .directions-summary-leg .directions-summary-step .step-icon {
      display: none; }
    .directions-summary-leg .directions-summary-step .step-line {
      display: none; }
    .directions-summary-leg .directions-summary-step .step-summary {
      margin-top: 2px; }
  .directions-summary-leg.show-times .directions-summary-step {
    padding-left: 96px; }
    .directions-summary-leg.show-times .directions-summary-step .step-time {
      display: block;
      position: absolute;
      top: 0;
      left: 0;
      color: #898989; }
    .directions-summary-leg.show-times .directions-summary-step .step-icon {
      display: block;
      position: absolute;
      top: 6px;
      left: 60px;
      z-index: 1; }
    .directions-summary-leg.show-times .directions-summary-step .step-line {
      display: block;
      position: absolute;
      top: 6px;
      left: 70px;
      z-index: 0;
      width: 3px;
      height: 100%; }
      .directions-summary-leg.show-times .directions-summary-step .step-line.step-line-transit, .directions-summary-leg.show-times .directions-summary-step .step-line.step-line-driving, .directions-summary-leg.show-times .directions-summary-step .step-line.step-line-cycling {
        background-color: #61A5F0; }
      .directions-summary-leg.show-times .directions-summary-step .step-line.step-line-walking {
        width: 4px;
        left: 70px;
        background-image: url("../../../Images/SPA/vertical_spritesheet.png");
        background-repeat: repeat-y;
        background-position: 0 0;
        background-color: #fff; }
    .directions-summary-leg.show-times .directions-summary-step.first-step .step-icon, .directions-summary-leg.show-times .directions-summary-step.last-step .step-icon {
      width: 24px;
      height: 32px;
      top: 0;
      font-size: 24px;
      color: #666;
      background-color: #fff; }
    .directions-summary-leg.show-times .directions-summary-step.last-step .step-icon {
      left: 66px;
      padding-top: 3px; }
    .directions-summary-leg.show-times .directions-summary-step.last-step .step-line {
      display: none; }
    .directions-summary-leg.show-times .directions-summary-step.intermediary-step .step-icon {
      width: 12px;
      height: 12px;
      left: 66px;
      border: 2px solid #61A5F0;
      background-color: #fff;
      border-radius: 50px; }

.directions-summary-step-heading {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
  margin-bottom: 16px; }
  .directions-summary-step-heading .step-description {
    float: left;
    width: 100%; }
    .directions-summary-step-heading .step-description .step-address {
      float: left;
      width: 100%;
      position: relative;
      padding-right: 32px; }
      .directions-summary-step-heading .step-description .step-address .primary-text {
        font-family: 'Roboto', Arial, sans-serif;
        font-size: 16px;
        font-weight: normal;
        line-height: 20px;
        color: #464646; }
      .directions-summary-step-heading .step-description .step-address .secondary-text {
        font-family: 'Roboto', Arial, sans-serif;
        font-size: 11px;
        font-weight: 300;
        line-height: 16px;
        color: #898989; }
  .directions-summary-step-heading .step-details-toggle {
    width: 16px;
    height: 16px;
    position: absolute;
    top: 0;
    right: 16px;
    color: #bebebe;
    border: 0;
    background: transparent;
    padding: 0; }

.directions-summary {
  float: left;
  width: 100%;
  margin: 0;
  padding: 0; }
  .directions-summary .step-summary {
    float: left;
    width: 100%;
    position: relative; }
    .directions-summary .step-summary .step-summary-icon {
      width: 24px;
      height: 24px;
      position: absolute;
      left: 0;
      top: 0;
      font-size: 20px;
      color: #898989; }
    .directions-summary .step-summary .step-summary-instructions, .directions-summary .step-summary .step-summary-deltas {
      font-family: 'Roboto', Arial, sans-serif;
      font-size: 11px;
      font-weight: 300;
      line-height: 16px;
      color: #898989; }
    .directions-summary .step-summary .step-summary-instructions {
      float: left;
      width: 100%; }
    .directions-summary .step-summary .step-summary-deltas {
      float: left;
      width: 100%;
      clear: left; }
    .directions-summary .step-summary.with-icon {
      padding-left: 24px; }
  .directions-summary .step-details {
    float: left; }
    .directions-summary .step-details .step-summary {
      margin-top: 16px; }
      .directions-summary .step-details .step-summary:last-child {
        margin-bottom: 16px; }

.directions-summary-warnings {
  margin-top: 16px;
  margin-bottom: 12px;
  font-family: 'Roboto', Arial, sans-serif;
  font-size: 12px;
  line-height: 16px; }

.paper-card.paper-card-directions {
  width: 400px;
  height: 440px; }
  .paper-card.paper-card-directions.mobile-transit-detail {
    width: 100%;
    height: 400px; }
  .paper-card.paper-card-directions .paper-card-heading {
    padding-bottom: 12px; }
  .paper-card.paper-card-directions .paper-card-body {
    max-height: 328px;
    overflow-y: scroll;
    padding-top: 0; }
    .paper-card.paper-card-directions .paper-card-body .directions-summary-leg:first-child {
      min-height: 264px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.paper-card.paper-card-poi-details {
  position: relative;
  min-width: 260px;
  max-width: 420px;
  transform-origin: center bottom;
  transform: scale(0);
  transition: transform 0.3s ease-in-out; }
  .paper-card.paper-card-poi-details.is-open {
    transform: scale(1); }
  .paper-card.paper-card-poi-details .paper-card-heading {
    padding-top: 10px;
    padding-right: 40px; }
  .paper-card.paper-card-poi-details .paper-card-body {
    padding-top: 0; }
  .paper-card.paper-card-poi-details .paper-card-bottom-action-area {
    padding-top: 0; }
    .paper-card.paper-card-poi-details .paper-card-bottom-action-area .rs-icon {
      font-size: 17px;
      padding-right: 8px;
      position: relative;
      top: 2px; }
      .paper-card.paper-card-poi-details .paper-card-bottom-action-area .rs-icon._initial-location {
        color: #0fb62b; }
      .paper-card.paper-card-poi-details .paper-card-bottom-action-area .rs-icon._end-location {
        color: #e73d38; }
  .paper-card.paper-card-poi-details .paper-button.set-address-button {
    display: inline;
    float: none !important;
    width: 50%;
    padding: 0; }
  .paper-card.paper-card-poi-details .paper-arrow {
    position: absolute; }
    .paper-card.paper-card-poi-details .paper-arrow.paper-arrow-down {
      position: absolute;
      bottom: -32px;
      left: 50%;
      margin-left: -16px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*

    This is NOT used in Desktop.scss. Look in core/paper-card for that.

*/
/*

    This is NOT used in Desktop.scss. Look in core/paper-card for that.

*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
body.ie8 .directions-waypoint-pin:after {
  display: none; }

body.ie8 .directions-waypoint-pin:hover:after {
  display: block; }

.directions-waypoint-pin {
  position: relative;
  border-radius: 12px;
  width: 12px;
  height: 12px;
  background-color: #fff;
  border: 2px solid #06AFF8; }
  .directions-waypoint-pin:after {
    content: attr(data-after-content);
    position: absolute;
    left: 16px;
    top: 16px;
    background-color: #fff;
    border: 1px solid #bdbdbd;
    border-radius: 2px;
    transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 8px 17px rgba(0, 0, 0, 0.2);
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 13px;
    white-space: nowrap;
    padding: 8px;
    display: block;
    opacity: 0;
    transition: opacity 0.5s ease-in-out; }
  .directions-waypoint-pin:hover:after {
    opacity: 1; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
hr.hr, .hr {
  margin-top: 8px;
  margin-bottom: 8px;
  border: 0;
  border-top: 1px solid #eee; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.nudge-left {
  position: relative;
  left: -8px; }

.nudge-right {
  position: relative;
  right: -8px; }

.nudge-top {
  position: relative;
  top: -8px; }

.nudge-bottom {
  position: relative;
  bottom: -8px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.paper-button.paper-button-icon ._exit {
  font-size: 24px; }

.paper-button.paper-button-icon.close-button {
  cursor: pointer;
  z-index: 100;
  position: absolute;
  right: 8px;
  top: 8px; }
  .paper-button.paper-button-icon.close-button:focus {
    outline: -webkit-focus-ring-color auto 5px; }
  .paper-button.paper-button-icon.close-button.close-button-sm {
    right: 4px;
    top: 4px; }
    .paper-button.paper-button-icon.close-button.close-button-sm .rs-icon {
      font-size: 10px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.multi-button-group:before, .multi-button-group:after {
  content: " ";
  display: table; }

.multi-button-group:after {
  clear: both; }

.multi-button.is-open.multi-button-span-1 {
  width: 36px; }

.multi-button.is-open.multi-button-span-2 {
  width: 72px; }

.multi-button.is-open.multi-button-span-3 {
  width: 108px; }

.multi-button.is-open.multi-button-span-4 {
  width: 144px; }

.multi-button.is-open.multi-button-span-5 {
  width: 180px; }

.multi-button.is-open.multi-button-span-6 {
  width: 216px; }

.multi-button.is-open.multi-button-span-7 {
  width: 252px; }

.multi-button.is-open.multi-button-span-8 {
  width: 288px; }

.multi-button.is-open.multi-button-span-9 {
  width: 324px; }

.multi-button.is-open.multi-button-span-10 {
  width: 360px; }

.multi-button.is-open.multi-button-span-11 {
  width: 396px; }

.multi-button.is-open.multi-button-span-12 {
  width: 432px; }

.multi-button.is-open.multi-button-span-13 {
  width: 468px; }

.multi-button.is-open.multi-button-span-14 {
  width: 504px; }

.multi-button.is-open.multi-button-span-15 {
  width: 540px; }

.multi-button.is-open.multi-button-span-16 {
  width: 576px; }

.multi-button.is-open.multi-button-span-17 {
  width: 612px; }

.multi-button.is-open.multi-button-span-18 {
  width: 648px; }

.multi-button.is-open.multi-button-span-19 {
  width: 684px; }

.multi-button.is-open.multi-button-span-20 {
  width: 720px; }

.multi-button.is-open.multi-button-span-21 {
  width: 756px; }

.multi-button.is-open.multi-button-span-22 {
  width: 792px; }

.multi-button.is-open.multi-button-span-23 {
  width: 828px; }

.multi-button.is-open.multi-button-span-24 {
  width: 864px; }

.multi-button.is-open.multi-button-span-25 {
  width: 900px; }

.multi-button.is-open.multi-button-span-26 {
  width: 936px; }

.multi-button.is-open.multi-button-span-27 {
  width: 972px; }

.multi-button.is-open.multi-button-span-28 {
  width: 1008px; }

.multi-button.is-open.multi-button-span-29 {
  width: 1044px; }

.multi-button.is-open.multi-button-span-30 {
  width: 1080px; }

.multi-button.is-open.multi-button-span-31 {
  width: 1116px; }

.multi-button.is-open.multi-button-span-32 {
  width: 1152px; }

.multi-button.is-open.multi-button-span-33 {
  width: 1188px; }

.multi-button.is-open.multi-button-span-34 {
  width: 1224px; }

.multi-button.is-open.multi-button-span-35 {
  width: 1260px; }

.multi-button.is-open.multi-button-span-36 {
  width: 1296px; }

.multi-button-group.multi-button-span-1 {
  width: 36px; }

.multi-button-group.multi-button-span-2 {
  width: 72px; }

.multi-button-group.multi-button-span-3 {
  width: 108px; }

.multi-button-group.multi-button-span-4 {
  width: 144px; }

.multi-button-group.multi-button-span-5 {
  width: 180px; }

.multi-button-group.multi-button-span-6 {
  width: 216px; }

.multi-button-group.multi-button-span-7 {
  width: 252px; }

.multi-button-group.multi-button-span-8 {
  width: 288px; }

.multi-button-group.multi-button-span-9 {
  width: 324px; }

.multi-button-group.multi-button-span-10 {
  width: 360px; }

.multi-button-group.multi-button-span-11 {
  width: 396px; }

.multi-button-group.multi-button-span-12 {
  width: 432px; }

.multi-button-group.multi-button-span-13 {
  width: 468px; }

.multi-button-group.multi-button-span-14 {
  width: 504px; }

.multi-button-group.multi-button-span-15 {
  width: 540px; }

.multi-button-group.multi-button-span-16 {
  width: 576px; }

.multi-button-group.multi-button-span-17 {
  width: 612px; }

.multi-button-group.multi-button-span-18 {
  width: 648px; }

.multi-button-group.multi-button-span-19 {
  width: 684px; }

.multi-button-group.multi-button-span-20 {
  width: 720px; }

.multi-button-group.multi-button-span-21 {
  width: 756px; }

.multi-button-group.multi-button-span-22 {
  width: 792px; }

.multi-button-group.multi-button-span-23 {
  width: 828px; }

.multi-button-group.multi-button-span-24 {
  width: 864px; }

.multi-button-group.multi-button-span-25 {
  width: 900px; }

.multi-button-group.multi-button-span-26 {
  width: 936px; }

.multi-button-group.multi-button-span-27 {
  width: 972px; }

.multi-button-group.multi-button-span-28 {
  width: 1008px; }

.multi-button-group.multi-button-span-29 {
  width: 1044px; }

.multi-button-group.multi-button-span-30 {
  width: 1080px; }

.multi-button-group.multi-button-span-31 {
  width: 1116px; }

.multi-button-group.multi-button-span-32 {
  width: 1152px; }

.multi-button-group.multi-button-span-33 {
  width: 1188px; }

.multi-button-group.multi-button-span-34 {
  width: 1224px; }

.multi-button-group.multi-button-span-35 {
  width: 1260px; }

.multi-button-group.multi-button-span-36 {
  width: 1296px; }

.multi-button {
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
  position: relative;
  width: 36px;
  height: 36px;
  overflow-x: hidden;
  overflow-y: visible;
  transition: width 0.2s ease-in-out; }
  .multi-button .multi-button-main-button {
    position: absolute;
    top: 0;
    width: 36px;
    height: 36px;
    float: left;
    z-index: 2; }
    .multi-button .multi-button-main-button .glyphicons, .multi-button .multi-button-main-button .rs-icon {
      line-height: 36px; }
    .multi-button .multi-button-main-button .glyphicons {
      margin: 0 !important; }
  .multi-button .multi-button-group {
    background-color: #fff;
    border-color: #bdbdbd;
    border-top-color: rgba(255, 255, 255, 0.7);
    float: left;
    height: 36px;
    background-color: #fff;
    position: absolute;
    top: 0;
    left: 36px;
    z-index: 1; }
    .multi-button .multi-button-group .paper-button {
      float: left;
      width: 36px;
      height: 36px;
      margin-bottom: 0; }
  .multi-button.is-open {
    max-width: none;
    box-shadow: 0 8px 17px rgba(0, 0, 0, 0.2); }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
label.paper-checkbox {
  margin: 0; }

.paper-checkbox {
  float: left;
  position: relative;
  display: block;
  width: 48px;
  height: 48px; }
  .paper-checkbox.paper-checkbox-sm {
    width: 32px;
    height: 32px; }
    .paper-checkbox.paper-checkbox-sm .paper-checkbox-display-element {
      cursor: pointer;
      margin: 0;
      position: relative;
      outline: none;
      float: left;
      float: left;
      padding: 16px;
      width: 48px;
      height: 48px;
      width: 32px;
      height: 32px; }
      .paper-checkbox.paper-checkbox-sm .paper-checkbox-display-element .paper-checkbox-color-block {
        display: block;
        width: 16px;
        height: 16px;
        left: 8px;
        top: 8px;
        border-radius: 2px;
        border: 2px solid #999999;
        background-color: transparent;
        position: absolute;
        z-index: 0;
        text-align: center; }
      .paper-checkbox.paper-checkbox-sm .paper-checkbox-display-element:focus, .paper-checkbox.paper-checkbox-sm .paper-checkbox-display-element:active {
        outline: none !important; }
        .paper-checkbox.paper-checkbox-sm .paper-checkbox-display-element:focus::after, .paper-checkbox.paper-checkbox-sm .paper-checkbox-display-element:active::after {
          outline: none !important; }
      .paper-checkbox.paper-checkbox-sm .paper-checkbox-display-element::after {
        font-family: "Glyphicons Regular";
        content: "";
        font-size: 9px;
        line-height: 12px;
        top: 10px;
        left: 11.5px;
        opacity: 0;
        color: #fff;
        position: absolute;
        z-index: 1;
        text-align: center; }
      .paper-checkbox.paper-checkbox-sm .paper-checkbox-display-element.is-checked .paper-checkbox-color-block {
        background-color: #0FB62B;
        border-color: #0FB62B; }
      .paper-checkbox.paper-checkbox-sm .paper-checkbox-display-element.is-checked::after {
        opacity: 1; }
      .paper-checkbox.paper-checkbox-sm .paper-checkbox-display-element.is-indeterminate .paper-checkbox-color-block {
        background-color: #0FB62B;
        border-color: #0FB62B; }
      .paper-checkbox.paper-checkbox-sm .paper-checkbox-display-element.is-indeterminate::after {
        opacity: 1;
        font-family: "Glyphicons Halflings";
        content: "\2212"; }
  .paper-checkbox .paper-checkbox-display-element {
    cursor: pointer;
    margin: 0;
    position: relative;
    outline: none;
    float: left;
    float: left;
    padding: 12px;
    width: 48px;
    height: 48px; }
    .paper-checkbox .paper-checkbox-display-element .paper-checkbox-color-block {
      display: block;
      width: 24px;
      height: 24px;
      left: 12px;
      top: 12px;
      border-radius: 2px;
      border: 2px solid #999999;
      background-color: transparent;
      position: absolute;
      z-index: 0;
      text-align: center; }
    .paper-checkbox .paper-checkbox-display-element:focus, .paper-checkbox .paper-checkbox-display-element:active {
      outline: none !important; }
      .paper-checkbox .paper-checkbox-display-element:focus::after, .paper-checkbox .paper-checkbox-display-element:active::after {
        outline: none !important; }
    .paper-checkbox .paper-checkbox-display-element::after {
      font-family: "Glyphicons Regular";
      content: "";
      font-size: 16px;
      line-height: 20px;
      top: 14px;
      left: 16px;
      opacity: 0;
      color: #fff;
      position: absolute;
      z-index: 1;
      text-align: center; }
    .paper-checkbox .paper-checkbox-display-element.is-checked .paper-checkbox-color-block {
      background-color: #0FB62B;
      border-color: #0FB62B; }
    .paper-checkbox .paper-checkbox-display-element.is-checked::after {
      opacity: 1; }
    .paper-checkbox .paper-checkbox-display-element.is-indeterminate .paper-checkbox-color-block {
      background-color: #0FB62B;
      border-color: #0FB62B; }
    .paper-checkbox .paper-checkbox-display-element.is-indeterminate::after {
      opacity: 1;
      font-family: "Glyphicons Halflings";
      content: "\2212"; }
  .paper-checkbox.paper-checkbox-toggle .paper-checkbox-display-element {
    cursor: pointer;
    background-color: transparent;
    border-color: transparent; }
    .paper-checkbox.paper-checkbox-toggle .paper-checkbox-display-element .paper-checkbox-color-block {
      content: "";
      display: block;
      width: 24px;
      height: 2px;
      background-color: #999999;
      position: absolute;
      top: 23px;
      transition: background-color 0.05s ease-out; }
    .paper-checkbox.paper-checkbox-toggle .paper-checkbox-display-element::after {
      border-radius: 16px;
      width: 16px;
      height: 16px;
      border: 2px solid #999999;
      background-color: #fff;
      opacity: 1;
      content: "";
      position: absolute;
      top: 17px;
      left: 8px;
      transition: background-color 0.05s ease-out, border-color 0.05s ease-out, left 0.1s ease-in-out 0.05s; }
    .paper-checkbox.paper-checkbox-toggle .paper-checkbox-display-element.is-checked .paper-checkbox-color-block {
      background-color: #0FB62B; }
    .paper-checkbox.paper-checkbox-toggle .paper-checkbox-display-element.is-checked::after {
      background-color: #0FB62B;
      border-color: #0FB62B;
      left: 20px; }
  .paper-checkbox.paper-checkbox-radio .paper-checkbox-display-element {
    cursor: pointer;
    float: left;
    padding: 12px;
    width: 48px;
    height: 48px; }
    .paper-checkbox.paper-checkbox-radio .paper-checkbox-display-element .paper-checkbox-color-block {
      border-radius: 24px;
      width: 24px;
      height: 24px;
      left: 12px;
      top: 12px; }
    .paper-checkbox.paper-checkbox-radio .paper-checkbox-display-element::after {
      border-radius: 16px;
      width: 16px;
      height: 16px;
      position: absolute;
      left: 16px;
      top: 16px;
      content: "";
      background-color: #0FB62B;
      transform: scale(0);
      transition: transform 0.1s ease-out; }
    .paper-checkbox.paper-checkbox-radio .paper-checkbox-display-element.is-checked .paper-checkbox-color-block {
      background-color: transparent;
      border-color: #0FB62B; }
    .paper-checkbox.paper-checkbox-radio .paper-checkbox-display-element.is-checked::after {
      transform: scale(1); }
  .paper-checkbox.paper-checkbox-radio.paper-checkbox-radio-sm .paper-checkbox-display-element {
    left: 8px;
    cursor: pointer;
    float: left;
    padding: 16px;
    width: 48px;
    height: 48px; }
    .paper-checkbox.paper-checkbox-radio.paper-checkbox-radio-sm .paper-checkbox-display-element .paper-checkbox-color-block {
      border-radius: 16px;
      width: 16px;
      height: 16px;
      left: 16px;
      top: 16px; }
    .paper-checkbox.paper-checkbox-radio.paper-checkbox-radio-sm .paper-checkbox-display-element::after {
      border-radius: 8px;
      width: 8px;
      height: 8px;
      position: absolute;
      left: 20px;
      top: 20px;
      content: "";
      background-color: #0FB62B;
      transform: scale(0);
      transition: transform 0.1s ease-out; }
    .paper-checkbox.paper-checkbox-radio.paper-checkbox-radio-sm .paper-checkbox-display-element.is-checked .paper-checkbox-color-block {
      background-color: transparent;
      border-color: #0FB62B; }
    .paper-checkbox.paper-checkbox-radio.paper-checkbox-radio-sm .paper-checkbox-display-element.is-checked::after {
      transform: scale(1); }

body.ie8 .paper-checkbox label.paper-checkbox-display-element {
  background-image: url("../../../Images/SPA/checkbox-sprites.png");
  background-position: -96px 0; }
  body.ie8 .paper-checkbox label.paper-checkbox-display-element::before {
    display: none; }
  body.ie8 .paper-checkbox label.paper-checkbox-display-element::after {
    display: none; }
  body.ie8 .paper-checkbox label.paper-checkbox-display-element.is-checked {
    background-position: -144px 0; }

body.ie8 .paper-checkbox.paper-checkbox-radio .paper-checkbox-display-element {
  background-position: -192px 0; }
  body.ie8 .paper-checkbox.paper-checkbox-radio .paper-checkbox-display-element.is-checked {
    background-position: -240px 0; }

body.ie8 .paper-checkbox.paper-checkbox-sm label.paper-checkbox-display-element {
  background-position: 0 0;
  right: 8px;
  top: -8px; }
  body.ie8 .paper-checkbox.paper-checkbox-sm label.paper-checkbox-display-element.is-checked {
    background-position: -48px 0; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.form-input-row {
  float: left;
  clear: left;
  position: relative;
  margin: 0;
  cursor: pointer;
  padding: 0 16px;
  height: 72px;
  /**
         ------ Thin version (used for settings on the FCO Settings panel)


        */ }
  .form-input-row.animation-fixture {
    height: 72px; }
  .form-input-row .paper-checkbox {
    margin: 0;
    margin-top: 12px; }
    .form-input-row .paper-checkbox:first-child {
      position: relative;
      right: 12px; }
  .form-input-row .row-text {
    font-size: 16px;
    line-height: 28px;
    font-weight: normal;
    margin-top: 22px; }
  .form-input-row .text-field {
    margin: 0; }
  .form-input-row .row-icon.row-icon-secondary {
    position: absolute;
    top: 24px;
    right: 16px; }
  .form-input-row.form-input-row-thin {
    margin-bottom: 4px;
    min-height: 24px;
    height: auto; }
    .form-input-row.form-input-row-thin .paper-checkbox, .form-input-row.form-input-row-thin .matched-icon, .form-input-row.form-input-row-thin .primary-text {
      float: left; }
    .form-input-row.form-input-row-thin .paper-checkbox {
      margin-top: -10px;
      margin-bottom: -10px; }
      .form-input-row.form-input-row-thin .paper-checkbox.paper-checkbox-sm {
        margin-top: -4px; }
    .form-input-row.form-input-row-thin .matched-icon {
      width: 20px;
      height: 20px;
      font-size: 20px;
      margin: 0 8px; }
    .form-input-row.form-input-row-thin .primary-text {
      font-family: 'Roboto', Arial, sans-serif;
      font-size: 14px;
      font-weight: 300;
      line-height: 16px;
      float: left; }
    .form-input-row.form-input-row-thin .row-text {
      float: left;
      margin-top: 0;
      margin-bottom: 0;
      margin-left: 8px;
      font-weight: normal;
      display: block; }
      .form-input-row.form-input-row-thin .row-text.with-icon {
        margin-left: 0; }
    .form-input-row.form-input-row-thin.with-select-input {
      margin-top: 8px; }
      .form-input-row.form-input-row-thin.with-select-input .row-text {
        margin-top: 10px; }
      .form-input-row.form-input-row-thin.with-select-input .paper-select {
        margin-left: 8px;
        margin-top: 2px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.paper-select {
  cursor: pointer; }

.paper-select .paper-select-list-item {
  cursor: pointer; }

.paper-select {
  background-color: transparent;
  height: 32px;
  float: left; }
  .paper-select:before, .paper-select:after {
    content: " ";
    display: table; }
  .paper-select:after {
    clear: both; }
  .paper-select:hover .paper-dropdown.is-closed .paper-dropdown-title, .paper-select:focus .paper-dropdown.is-closed .paper-dropdown-title, .paper-select:active .paper-dropdown.is-closed .paper-dropdown-title {
    background-color: #f6f6f6; }
  .paper-select .paper-select-title {
    position: relative;
    float: left;
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 14px;
    font-weight: 300;
    line-height: 24px;
    padding: 4px 24px 0 8px;
    vertical-align: bottom;
    width: 100%;
    white-space: nowrap;
    overflow-x: hidden;
    text-overflow: ellipsis; }
  .paper-select .paper-select-list-item:hover, .paper-select .paper-select-list-item:focus, .paper-select .paper-select-list-item:active {
    background-color: #f6f6f6; }
  .paper-select .paper-select-list-item.is-selected {
    background-color: #e9e9e9; }
  .paper-select .paper-dropdown-title {
    width: 100%; }
    .paper-select .paper-dropdown-title button {
      width: 100%; }
  .paper-select .paper-select-title-caret {
    position: absolute;
    right: 8px;
    top: 6px; }
  .paper-select.paper-select-no-padding .paper-select-title {
    padding: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis; }
  .paper-select.paper-select-span-2 {
    width: 80px; }
  .paper-select.paper-select-span-2_5 {
    width: 100px; }
  .paper-select.paper-select-span-3 {
    width: 120px; }
  .paper-select.paper-select-span-3_5 {
    width: 140px; }
  .paper-select.paper-select-span-4 {
    width: 160px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.paper-timepicker {
  float: left;
  position: relative;
  height: 32px;
  padding: 0 8px; }
  .paper-timepicker input {
    background-color: transparent; }
  .paper-timepicker .timepicker-entry-wrapper {
    float: left;
    height: 100%;
    position: relative; }
    .paper-timepicker .timepicker-entry-wrapper .timepicker-button, .paper-timepicker .timepicker-entry-wrapper .timepicker-entry {
      float: left; }
    .paper-timepicker .timepicker-entry-wrapper .timepicker-button {
      width: 16px;
      height: 32px;
      padding-top: 3px;
      text-align: center;
      -webkit-appearance: none;
      -moz-appearance: none;
      appearance: none;
      border: none;
      background-color: transparent;
      -webkit-border-fit: border !important;
      padding: 0;
      text-align: center;
      padding: 0;
      margin: 0;
      border: none;
      display: block;
      border-radius: 0;
      overflow: hidden;
      color: #959595; }
      .paper-timepicker .timepicker-entry-wrapper .timepicker-button:focus {
        outline: none; }
      .paper-timepicker .timepicker-entry-wrapper .timepicker-button::-moz-focus-inner {
        border: none;
        /* overrides extra padding in Firefox */ }
      .paper-timepicker .timepicker-entry-wrapper .timepicker-button .paper-button:hover {
        background-color: transparent !important; }
      .paper-timepicker .timepicker-entry-wrapper .timepicker-button::-moz-selection {
        background-color: transparent; }
      .paper-timepicker .timepicker-entry-wrapper .timepicker-button::selection {
        background-color: transparent; }
      .paper-timepicker .timepicker-entry-wrapper .timepicker-button::moz-selection {
        background-color: transparent; }
      .paper-timepicker .timepicker-entry-wrapper .timepicker-button .rs-icon {
        font-size: 21px; }
        .paper-timepicker .timepicker-entry-wrapper .timepicker-button .rs-icon._filters {
          font-size: 14px; }
      .paper-timepicker .timepicker-entry-wrapper .timepicker-button.with-ink:active {
        background-color: #efefef;
        background-color: rgba(230, 230, 230, 0.8); }
    .paper-timepicker .timepicker-entry-wrapper .timepicker-entry {
      height: 100%; }
      .paper-timepicker .timepicker-entry-wrapper .timepicker-entry .primary-text {
        font-family: 'Roboto', Arial, sans-serif;
        font-size: 12px;
        font-weight: 300;
        line-height: 16px;
        color: #5bc0de; }
      .paper-timepicker .timepicker-entry-wrapper .timepicker-entry input[type=text] {
        -moz-appearance: none;
        -webkit-appearance: none;
        outline: none;
        border: none;
        float: left;
        text-align: center;
        height: 24px;
        margin-top: 4px;
        padding: 4px 4px; }
    .paper-timepicker .timepicker-entry-wrapper.timepicker-entry-wrapper-time {
      overflow: hidden; }
      .paper-timepicker .timepicker-entry-wrapper.timepicker-entry-wrapper-time input[type=text] {
        width: 64px; }
    .paper-timepicker .timepicker-entry-wrapper.timepicker-entry-wrapper-date {
      margin-left: 8px;
      float: left; }
      .paper-timepicker .timepicker-entry-wrapper.timepicker-entry-wrapper-date input[type=text] {
        width: 64px; }
      .paper-timepicker .timepicker-entry-wrapper.timepicker-entry-wrapper-date .timepicker-entry {
        position: relative; }
        .paper-timepicker .timepicker-entry-wrapper.timepicker-entry-wrapper-date .timepicker-entry .timepicker-button-group {
          float: right; }
        .paper-timepicker .timepicker-entry-wrapper.timepicker-entry-wrapper-date .timepicker-entry .dropdown-menu {
          left: -88px !important; }
          .paper-timepicker .timepicker-entry-wrapper.timepicker-entry-wrapper-date .timepicker-entry .dropdown-menu .btn {
            border: none;
            border-radius: 0; }
          .paper-timepicker .timepicker-entry-wrapper.timepicker-entry-wrapper-date .timepicker-entry .dropdown-menu .selected-date {
            border-bottom: 1px solid;
            background-color: transparent;
            box-shadow: none; }
  .paper-timepicker .timepicker-dropdown {
    display: none;
    position: absolute; }
    .paper-timepicker .timepicker-dropdown.is-open {
      display: block;
      top: 40px;
      left: 8px;
      z-index: 2; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.loading-spinner.loading-spinner-filling-cube {
  display: inline-block;
  width: 30px;
  height: 30px;
  position: relative;
  border: 4px solid #03a9f4;
  top: -30px;
  animation: filling-cube-loader 4s infinite ease; }
  .loading-spinner.loading-spinner-filling-cube .loader-inner {
    vertical-align: top;
    display: inline-block;
    width: 100%;
    background-color: #03a9f4;
    animation: filling-cube-loader-inner 4s infinite ease-in; }

@keyframes filling-cube-loader {
  0% {
    transform: rotate(0deg); }
  25% {
    transform: rotate(180deg); }
  50% {
    transform: rotate(180deg); }
  75% {
    transform: rotate(360deg); }
  100% {
    transform: rotate(360deg); } }

@keyframes filling-cube-loader-inner {
  0% {
    height: 0%; }
  25% {
    height: 0%; }
  50% {
    height: 100%; }
  75% {
    height: 100%; }
  100% {
    height: 0%; } }

.dashboard {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 5;
  padding: 8px;
  width: 638px; }
  .dashboard .content-loading-container {
    position: relative; }
    .dashboard .content-loading-container .loading-cover {
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      background: #fff; }
    .dashboard .content-loading-container .loading-symbol {
      position: relative;
      width: 30px;
      margin: 0 auto; }
  .dashboard .dashboard-card {
    margin: 4px;
    box-shadow: 1px 2px 7px 0px #bdbdbd; }
    .dashboard .dashboard-card .paper-card-heading {
      background-color: #03a9f4;
      height: 32px; }
      .dashboard .dashboard-card .paper-card-heading .heading-text {
        padding: 5px 16px;
        font-size: 16px;
        color: #fff; }
  .dashboard .grey-text {
    color: #aaa;
    line-height: 20px;
    /* font-weight: bold; */
    font-size: 12px; }
  .dashboard .row.row-ds.dashboard-row {
    /*width: 648px;*/ }
    .dashboard .row.row-ds.dashboard-row .col-6 .profile-card {
      margin-left: 48px;
      position: relative;
      z-index: 1; }
      .dashboard .row.row-ds.dashboard-row .col-6 .profile-card .arrow {
        position: absolute;
        bottom: 8px;
        right: 8px;
        font-size: 20px;
        cursor: pointer;
        color: #aaa; }
      .dashboard .row.row-ds.dashboard-row .col-6 .profile-card .rs-icon._edit {
        position: absolute;
        top: 8px;
        right: 8px; }
      .dashboard .row.row-ds.dashboard-row .col-6 .profile-card .profile-image {
        float: left;
        width: 96px;
        height: 96px;
        margin-left: -48px;
        border: 3px solid #03a9f4;
        top: -1px;
        position: relative; }
      .dashboard .row.row-ds.dashboard-row .col-6 .profile-card .profile-info {
        float: left;
        padding: 8px;
        max-width: 208px; }
        .dashboard .row.row-ds.dashboard-row .col-6 .profile-card .profile-info h2 {
          color: #03a9f4;
          font-size: 20px; }
        .dashboard .row.row-ds.dashboard-row .col-6 .profile-card .profile-info div {
          padding-left: 4px; }
      .dashboard .row.row-ds.dashboard-row .col-6 .profile-card .profile-extention {
        background: #fff;
        box-shadow: 0px 6px 10px 0px #BDBDBD;
        position: absolute;
        top: 93%;
        left: -24px;
        right: 0;
        z-index: -1; }
        .dashboard .row.row-ds.dashboard-row .col-6 .profile-card .profile-extention .color-strip {
          position: absolute;
          top: 0;
          bottom: 0;
          left: 0;
          width: 48px;
          background-color: #03a9f4; }
        .dashboard .row.row-ds.dashboard-row .col-6 .profile-card .profile-extention .profile-extention-body {
          position: relative;
          padding: 8px; }
          .dashboard .row.row-ds.dashboard-row .col-6 .profile-card .profile-extention .profile-extention-body .row {
            margin: 8px 0; }
            .dashboard .row.row-ds.dashboard-row .col-6 .profile-card .profile-extention .profile-extention-body .row .row-icon {
              float: left;
              width: 48px;
              color: #fff;
              font-size: 30px;
              padding-top: 2px;
              padding-left: 2px; }
            .dashboard .row.row-ds.dashboard-row .col-6 .profile-card .profile-extention .profile-extention-body .row .row-text {
              float: left;
              padding-left: 16px; }
              .dashboard .row.row-ds.dashboard-row .col-6 .profile-card .profile-extention .profile-extention-body .row .row-text .row-text-primary {
                color: #03a9f4;
                font-size: 14px; }
    .dashboard .row.row-ds.dashboard-row .col-6 .stats-card {
      margin-top: 10px;
      min-height: 64px; }
      .dashboard .row.row-ds.dashboard-row .col-6 .stats-card .loading-symbol {
        top: 45px; }
      .dashboard .row.row-ds.dashboard-row .col-6 .stats-card .stat-section {
        text-align: center;
        padding: 8px; }
        .dashboard .row.row-ds.dashboard-row .col-6 .stats-card .stat-section .stat-text {
          font-size: 20px; }
        .dashboard .row.row-ds.dashboard-row .col-6 .stats-card .stat-section.logged-trips .stat-text {
          color: #F38234; }
        .dashboard .row.row-ds.dashboard-row .col-6 .stats-card .stat-section.distance-travelled .stat-text {
          color: #82B842; }
        .dashboard .row.row-ds.dashboard-row .col-6 .stats-card .stat-section.money-saved .stat-text {
          color: #9B6AB8; }
    .dashboard .row.row-ds.dashboard-row .col-6 .commute-finder-card .btn {
      margin: 0 8px; }
    .dashboard .row.row-ds.dashboard-row .col-6 .commute-finder-card .paper-card-heading {
      background-color: #03a9f4; }
    .dashboard .row.row-ds.dashboard-row .col-6 .commute-finder-card .commute-finder-body {
      padding: 8px 0; }
    .dashboard .row.row-ds.dashboard-row .col-12 .instructions-card .paper-card-heading .heading-text {
      /*color: #333;*/ }
    .dashboard .row.row-ds.dashboard-row .col-12 .instructions-card .paper-card-body {
      padding: 8px;
      max-height: 220px;
      overflow: auto; }
    .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card {
      max-height: 356px; }
      .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .paper-card-heading {
        height: 40px; }
        .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .paper-card-heading .heading-text {
          padding: 8px;
          text-align: center; }
      .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds {
        height: 100%; }
        .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 {
          height: 100%; }
          .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .calendar-area {
            background: #f9f9f9;
            height: auto; }
            .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .calendar-area .loading-cover {
              top: 40px; }
            .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .calendar-area .loading-symbol {
              top: 175px;
              background: none; }
            .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .calendar-area .paper-card-heading {
              background-color: #03a9f4;
              position: relative; }
              .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .calendar-area .paper-card-heading .triangle {
                position: absolute;
                width: 0;
                height: 0;
                border-top: 20px solid transparent;
                border-left: 20px solid #03a9f4;
                border-bottom: 20px solid transparent;
                left: 100%; }
              .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .calendar-area .paper-card-heading .rs-icon {
                color: #fff;
                height: 100%;
                font-size: 25px;
                line-height: 40px;
                padding: 0 10px;
                cursor: pointer; }
                .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .calendar-area .paper-card-heading .rs-icon:hover {
                  background: rgba(255, 255, 255, 0.3); }
                .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .calendar-area .paper-card-heading .rs-icon._back-btn2 {
                  float: left; }
                .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .calendar-area .paper-card-heading .rs-icon._next-btn {
                  float: right; }
            .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .calendar-area table {
              width: 100%;
              margin: 0; }
              .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .calendar-area table thead tr th {
                border: none;
                text-align: center;
                font-weight: normal;
                font-size: 16px; }
              .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .calendar-area table tbody tr td {
                border: none;
                text-align: center;
                font-weight: lighter;
                font-size: 14px;
                height: 46px;
                width: 46px;
                padding: 6px;
                cursor: pointer; }
                .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .calendar-area table tbody tr td .day-number {
                  height: 32px;
                  width: 32px;
                  border-radius: 16px;
                  border: 1px solid transparent;
                  line-height: 30px;
                  padding-right: 2px;
                  margin: 0 auto; }
                .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .calendar-area table tbody tr td.otherMonth {
                  color: #b5b5b5;
                  cursor: default; }
                  .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .calendar-area table tbody tr td.otherMonth:hover {
                    background: none; }
                .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .calendar-area table tbody tr td.hasTrips {
                  color: #03a9f4; }
                  .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .calendar-area table tbody tr td.hasTrips .day-number {
                    border: 1px solid #03a9f4; }
                .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .calendar-area table tbody tr td:hover .day-number {
                  background: #efefef; }
                .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .calendar-area table tbody tr td.selected .day-number {
                  color: #fff;
                  border: 1px solid #03a9f4;
                  background-color: #03a9f4; }
                  .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .calendar-area table tbody tr td.selected .day-number.future-date {
                    border: 1px solid #b5b5b5;
                    background-color: #b5b5b5; }
          .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .info-area {
            height: 100%;
            padding-bottom: 36px; }
            .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .info-area .paper-card-heading {
              background-color: #0286c2; }
            .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .info-area .btn {
              line-height: 36px; }
            .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .info-area .info-body {
              height: 278px;
              overflow: auto; }
              .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .info-area .info-body .help-text {
                text-align: center;
                padding: 16px 24px;
                padding-top: 50px; }
                .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .info-area .info-body .help-text h4 {
                  font-weight: bold;
                  font-size: 14px;
                  color: #464646;
                  margin-bottom: 16px; }
                .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .info-area .info-body .help-text p {
                  font-weight: normal;
                  font-size: 12px;
                  color: #868686;
                  line-height: 18px;
                  padding: 0 10px; }
              .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .info-area .info-body ul {
                padding-top: 0;
                padding-bottom: 0;
                position: relative; }
                .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .info-area .info-body ul .calendar-day-icon {
                  width: 36px;
                  height: 36px; }
              .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .info-area .info-body ul.trip-items-list .trip-item-row {
                margin: 0;
                border-bottom: 1px solid #eee;
                padding: 8px;
                padding-bottom: 0;
                /*&:nth-child(1){
                                                border-top:none;
                                            }*/ }
                .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .info-area .info-body ul.trip-items-list .trip-item-row .row-icon {
                  display: block;
                  float: left;
                  text-align: center;
                  width: 48px;
                  height: 48px; }
                .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .info-area .info-body ul.trip-items-list .trip-item-row .row-icon-secondary {
                  display: block;
                  float: right;
                  text-align: center;
                  width: 48px;
                  height: 48px; }
                  .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .info-area .info-body ul.trip-items-list .trip-item-row .row-icon-secondary .rs-icon {
                    line-height: 40px;
                    color: #666;
                    font-size: 20px;
                    font-weight: bold;
                    cursor: pointer; }
                    .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .info-area .info-body ul.trip-items-list .trip-item-row .row-icon-secondary .rs-icon:hover {
                      color: red; }
                .dashboard .row.row-ds.dashboard-row .col-12 .calendar-card .row.row-ds .col-6 .info-area .info-body ul.trip-items-list .trip-item-row .row-text {
                  float: left;
                  margin-top: 0;
                  margin-left: 16px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.panels-order {
  position: absolute;
  left: 880px;
  background: #fff;
  padding: 8px;
  width: 500px; }

.my-dashboard {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 5;
  width: 732px;
  background-color: #f1f1f1;
  overflow: hidden;
  /*padding-bottom: 80px;*/
  white-space: nowrap; }
  .my-dashboard:hover {
    overflow: auto; }
  .my-dashboard .dashboard-panels-holder {
    padding: 8px; }
    .my-dashboard .dashboard-panels-holder .dashboard-panel {
      float: left;
      margin: 8px;
      background: #fff;
      width: 216px;
      height: 200px;
      position: relative;
      border: 0; }
      .my-dashboard .dashboard-panels-holder .dashboard-panel .clickable {
        cursor: pointer; }
        .my-dashboard .dashboard-panels-holder .dashboard-panel .clickable:hover {
          transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
          box-shadow: 0 8px 17px rgba(0, 0, 0, 0.2); }
      .my-dashboard .dashboard-panels-holder .dashboard-panel.width-2 {
        width: 448px; }
      .my-dashboard .dashboard-panels-holder .dashboard-panel.height-2 {
        height: 416px; }
      .my-dashboard .dashboard-panels-holder .dashboard-panel .hide-icon {
        display: none;
        position: absolute;
        top: 0;
        left: 0;
        font-size: 16px;
        color: #bcbcbc;
        padding: 8px;
        cursor: pointer;
        z-index: 10; }
      .my-dashboard .dashboard-panels-holder .dashboard-panel .drag-icon {
        display: none;
        position: absolute;
        right: 0;
        top: 0;
        font-size: 16px;
        color: #bcbcbc;
        padding: 8px;
        cursor: move;
        z-index: 10; }
      .my-dashboard .dashboard-panels-holder .dashboard-panel:hover .hide-icon, .my-dashboard .dashboard-panels-holder .dashboard-panel:hover .drag-icon {
        display: block; }
    .my-dashboard .dashboard-panels-holder .padding-block {
      width: 100%;
      height: 80px;
      display: block;
      float: left;
      clear: both; }
  .my-dashboard .plus-button {
    position: fixed;
    bottom: 16px;
    left: 16px;
    width: 56px;
    height: 56px;
    border-radius: 28px;
    background-color: #03a9f4;
    font-size: 24px; }
  .my-dashboard .empty-text {
    position: fixed;
    top: 45%;
    text-align: center;
    color: #898989;
    width: inherit;
    padding: 0 24px;
    white-space: normal; }

@media (max-width: 1150px) {
  .my-dashboard {
    width: 497px; } }

.calendar-stats-module, .challenge-stats-module {
  position: relative; }
  .calendar-stats-module .buttons-holder .rs-icon, .challenge-stats-module .buttons-holder .rs-icon {
    position: absolute;
    top: 85px;
    padding: 7px;
    border-radius: 50%; }
    .calendar-stats-module .buttons-holder .rs-icon:hover, .challenge-stats-module .buttons-holder .rs-icon:hover {
      background: #efefef; }
    .calendar-stats-module .buttons-holder .rs-icon.rs-icon._back-btn2, .challenge-stats-module .buttons-holder .rs-icon.rs-icon._back-btn2 {
      left: 0; }
    .calendar-stats-module .buttons-holder .rs-icon.rs-icon._next-btn, .challenge-stats-module .buttons-holder .rs-icon.rs-icon._next-btn {
      right: 0; }

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  /* IE10+ CSS styles go here */
  .my-dashboard .plus-button, .my-dashboard .showHideBox {
    left: 66px;
    bottom: 32px; } }

.my-dashboard--show-hide-box-panel {
  background-color: #fff;
  box-shadow: 2px 4px 15px 3px rgba(0, 0, 0, 0.3);
  width: 400px; }

.my-dashboard--show-hide-box {
  background-color: #fff;
  min-width: 300px;
  height: auto;
  padding: 16px; }
  .my-dashboard--show-hide-box .title {
    font-size: 20px;
    color: #464646;
    margin-bottom: 16px; }
    .my-dashboard--show-hide-box .title .rs-icon {
      color: #bbb;
      padding: 4px; }
  .my-dashboard--show-hide-box .item-row {
    height: 48px;
    line-height: 48px;
    vertical-align: middle;
    font-size: 16px; }
    .my-dashboard--show-hide-box .item-row .rs-icon {
      font-size: 24px;
      float: left;
      padding-top: 12px;
      padding-right: 16px; }
  .my-dashboard--show-hide-box .show-button {
    margin-top: 6px;
    background-color: #03a9f4 !important;
    color: #fff !important; }
    .my-dashboard--show-hide-box .show-button.hide-button {
      background-color: #fff !important;
      color: #03a9f4 !important; }

/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.dashboard-popup {
  height: 600px;
  border: 0;
  /*style updated to fix button/popup-body overlap*/ }
  .dashboard-popup.personal-info-popup {
    height: auto;
    max-height: 600px; }
  .dashboard-popup.commute-stats .title {
    text-align: center; }
    .dashboard-popup.commute-stats .title .rs-icon {
      cursor: pointer; }
  .dashboard-popup .commuteTrackerSummaryNavAndTitle {
    display: none; }
  .dashboard-popup .title {
    height: 48px;
    line-height: 48px;
    vertical-align: middle;
    color: #fff;
    font-size: 20px;
    background-color: #03a9f4;
    padding-left: 16px;
    padding-right: 16px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3); }
    .dashboard-popup .title.contests {
      background-color: #F48234; }
    .dashboard-popup .title.purchases {
      background-color: #00A89C; }
    .dashboard-popup .title.milestones {
      background-color: #D4B01A; }
    .dashboard-popup .title.losepointscontests {
      background-color: #F48223; }
    .dashboard-popup .title.singleTrip {
      background-color: #4FB7A4; }
    .dashboard-popup .title.point {
      background-color: #679f42; }
    .dashboard-popup .title.challenge {
      background-color: #CF467C; }
    .dashboard-popup .title.info {
      background-color: #9ccc65; }
    .dashboard-popup .title .rs-icon {
      font-size: 24px;
      padding: 8px;
      color: white;
      text-decoration: none;
      height: 48px;
      width: 48px; }
      .dashboard-popup .title .rs-icon:hover {
        background-color: rgba(255, 255, 255, 0.2); }
    .dashboard-popup .title ._exit {
      margin-right: -16px; }
    .dashboard-popup .title ._right-btn, .dashboard-popup .title ._left-btn {
      padding-top: 15px; }
    .dashboard-popup .title .tab-text {
      font-size: 12px;
      padding: 16px 16px 13px 16px;
      cursor: pointer;
      opacity: 0.7; }
      .dashboard-popup .title .tab-text.active {
        opacity: 1;
        border-bottom: 3px solid #fff; }
  .dashboard-popup .profile .profile-text {
    color: #03a9f4; }
  .dashboard-popup .profile .caption {
    font-size: 12px; }
    .dashboard-popup .profile .caption .primary-text {
      font-size: 14px;
      color: #03a9f4; }
  .dashboard-popup .profile .profile-img {
    /*height: 280px;*/
    /*border-bottom:1px solid #DDDDDD;*/
    text-align: center;
    padding: 50px; }
  .dashboard-popup .profile .profile-detail {
    padding: 32px 80px; }
    .dashboard-popup .profile .profile-detail .row-icon {
      float: left;
      font-size: 24px;
      color: #03a9f4;
      margin: 6px 16px; }
  .dashboard-popup .selector {
    padding: 8px; }
    .dashboard-popup .selector .challenge-selector {
      width: 300px; }
      .dashboard-popup .selector .challenge-selector .paper-dropdown-title {
        width: 100%; }
        .dashboard-popup .selector .challenge-selector .paper-dropdown-title .selector-title {
          padding: 8px; }
          .dashboard-popup .selector .challenge-selector .paper-dropdown-title .selector-title:hover {
            background: #f1f1f1; }
      .dashboard-popup .selector .challenge-selector .challenge-selector-body .row {
        padding: 8px;
        cursor: pointer; }
        .dashboard-popup .selector .challenge-selector .challenge-selector-body .row .rs-icon {
          font-size: 24px;
          position: relative;
          top: 12px;
          left: 12px; }
        .dashboard-popup .selector .challenge-selector .challenge-selector-body .row:hover {
          background: #f1f1f1; }
  .dashboard-popup .sub-title {
    font-size: 16px;
    color: #3882F0;
    height: 48px;
    line-height: 48px;
    vertical-align: middle; }
    .dashboard-popup .sub-title.challenge {
      color: #B35162; }
  .dashboard-popup .text {
    font-size: 14px;
    color: #3882F0;
    font-weight: 400; }
    .dashboard-popup .text.challenge {
      color: #B35162; }
    .dashboard-popup .text.caption {
      color: #878787; }
  .dashboard-popup .top {
    padding: 16px;
    height: 152px;
    border-bottom: 1px solid #DDDDDD; }
    .dashboard-popup .top .summary-icon {
      font-size: 48px;
      color: #03a9f4; }
      .dashboard-popup .top .summary-icon.challenge {
        color: #B35162; }
  .dashboard-popup .bottom {
    padding: 16px;
    height: 400px; }
    .dashboard-popup .bottom .info-table {
      height: 332px; }
  .dashboard-popup .popup-body {
    max-height: 480px; }
    .dashboard-popup .popup-body .incentives-top {
      padding: 16px;
      height: 200px;
      color: #F48234;
      text-align: center; }
      .dashboard-popup .popup-body .incentives-top.purchases {
        color: #00A89C; }
        .dashboard-popup .popup-body .incentives-top.purchases .points-container {
          background-color: #00A89C; }
      .dashboard-popup .popup-body .incentives-top.milestones {
        color: #D4B01A; }
        .dashboard-popup .popup-body .incentives-top.milestones .points-container {
          background-color: #D4B01A; }
      .dashboard-popup .popup-body .incentives-top.losepointscontests {
        color: #F18023; }
        .dashboard-popup .popup-body .incentives-top.losepointscontests .points-container {
          background-color: #F18023; }
      .dashboard-popup .popup-body .incentives-top.point {
        color: #679f42; }
        .dashboard-popup .popup-body .incentives-top.point .points-container {
          background-color: #679f42; }
      .dashboard-popup .popup-body .incentives-top .points-container {
        height: 120px;
        width: 120px;
        margin: auto;
        border-radius: 60px;
        background-color: #F48234;
        margin-bottom: 16px; }
        .dashboard-popup .popup-body .incentives-top .points-container .points {
          font-size: 40px;
          color: #fff;
          position: relative;
          top: 30px;
          font-weight: 100; }
    .dashboard-popup .popup-body.popup-body-short {
      max-height: 434px; }
    .dashboard-popup .popup-body .incentive-table .header-row {
      height: 32px;
      line-height: 32px;
      display: table;
      vertical-align: middle;
      border-top: 1px #ddd solid;
      border-bottom: 1px #ddd solid;
      color: #bababa;
      width: 100%;
      text-align: center; }
      .dashboard-popup .popup-body .incentive-table .header-row.body-row {
        height: 56px;
        line-height: 56px;
        vertical-align: middle;
        border: none;
        color: #464646;
        border-bottom: 1px #ddd solid; }
        .dashboard-popup .popup-body .incentive-table .header-row.body-row .name-col {
          text-align: left; }
        .dashboard-popup .popup-body .incentive-table .header-row.body-row .points-col.contest {
          color: #F48234; }
        .dashboard-popup .popup-body .incentive-table .header-row.body-row .points-col.milestones {
          color: #D4B01A; }
        .dashboard-popup .popup-body .incentive-table .header-row.body-row .points-col.rewards {
          color: #00A89C; }
      .dashboard-popup .popup-body .incentive-table .header-row .name-col {
        width: 288px;
        float: left;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis; }
        .dashboard-popup .popup-body .incentive-table .header-row .name-col img {
          width: 56px;
          height: 56px;
          margin-left: 8px; }
        .dashboard-popup .popup-body .incentive-table .header-row .name-col.addr-col {
          width: 336px; }
          .dashboard-popup .popup-body .incentive-table .header-row .name-col.addr-col .rs-icon {
            font-size: 24px;
            transform: rotate(180deg);
            display: block; }
      .dashboard-popup .popup-body .incentive-table .header-row .departing-col {
        width: 88px;
        float: left; }
        .dashboard-popup .popup-body .incentive-table .header-row .departing-col .rs-icon {
          font-size: 20px;
          color: #bbbbbb;
          padding: 4px; }
          .dashboard-popup .popup-body .incentive-table .header-row .departing-col .rs-icon.driver {
            color: #F89C50; }
          .dashboard-popup .popup-body .incentive-table .header-row .departing-col .rs-icon.passenger {
            color: #CF467C; }
      .dashboard-popup .popup-body .incentive-table .header-row .booked-col {
        width: 176px;
        float: left; }
      .dashboard-popup .popup-body .incentive-table .header-row .two-rows {
        padding: 4px;
        text-align: center; }
        .dashboard-popup .popup-body .incentive-table .header-row .two-rows .top-row {
          line-height: 24px; }
        .dashboard-popup .popup-body .incentive-table .header-row .two-rows .second-row {
          line-height: 24px;
          font-size: 12px;
          font-weight: 300; }
      .dashboard-popup .popup-body .incentive-table .header-row .date-col {
        width: 160px;
        float: left; }
        .dashboard-popup .popup-body .incentive-table .header-row .date-col.trip-departing-col {
          width: 140px; }
      .dashboard-popup .popup-body .incentive-table .header-row .entries-col {
        width: 120px;
        float: left; }
        .dashboard-popup .popup-body .incentive-table .header-row .entries-col.trip-booked-col {
          width: 140px; }
      .dashboard-popup .popup-body .incentive-table .header-row .points-col {
        width: 120px;
        float: right; }
    .dashboard-popup .popup-body .incentive-table .bottom-row {
      width: 100%;
      height: 24px;
      line-height: 24px;
      font-size: 12px;
      text-align: center;
      color: #bababa; }
  .dashboard-popup .fixed-button {
    position: absolute;
    bottom: 0;
    padding: 16px; }
  .dashboard-popup ._reduce-spacing.profile .profile-img {
    padding: 32px 50px 16px; }
  .dashboard-popup ._reduce-spacing.profile .profile-detail {
    padding: 16px 80px 0; }
  .dashboard-popup ._align-button.fixed-button {
    position: relative; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.dashboard-module-panel {
  padding: 16px;
  text-align: center;
  height: 200px;
  width: 216px; }
  .dashboard-module-panel .progress-container {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    margin: 0 auto;
    display: table; }
  .dashboard-module-panel .img-container {
    width: 98px;
    height: 98px;
    margin: auto;
    border-radius: 50%; }
    .dashboard-module-panel .img-container.contests {
      background-color: #F18034; }
    .dashboard-module-panel .img-container.milestones {
      background-color: #D6B21A; }
    .dashboard-module-panel .img-container.rewards {
      background-color: #00A89C; }
    .dashboard-module-panel .img-container.losepointscontests {
      background-color: #F18023; }
    .dashboard-module-panel .img-container.losepointscontests {
      background-color: #F18023; }
    .dashboard-module-panel .img-container.challenges {
      background-color: #B35162; }
    .dashboard-module-panel .img-container.singletrip {
      background-color: #4FB7A4; }
    .dashboard-module-panel .img-container.tripprofiles {
      background-color: #6B51B7; }
    .dashboard-module-panel .img-container.points {
      background-color: #F0F0F0; }
    .dashboard-module-panel .img-container.infomation {
      background-color: #9ccc65; }
    .dashboard-module-panel .img-container img {
      width: 100%;
      height: 100%; }
      .dashboard-module-panel .img-container img.avatar {
        border-radius: 60px; }
      .dashboard-module-panel .img-container img.contests-img {
        height: 106px;
        position: relative;
        top: -5px; }
  .dashboard-module-panel .content-container {
    white-space: normal;
    text-align: left; }
  .dashboard-module-panel .name {
    color: #03a9f4;
    font-size: 16px;
    margin-top: 16px; }
  .dashboard-module-panel .text-danger {
    font-size: 10px; }
  .dashboard-module-panel .contests-module .green-number {
    font-size: 16px;
    color: #0fb52b; }
    .dashboard-module-panel .contests-module .green-number.number {
      color: #F18034; }
    .dashboard-module-panel .contests-module .green-number.ranking {
      color: #B35162; }
  .dashboard-module-panel .contests-module .caption {
    color: #595959 !important;
    font-weight: 400;
    line-height: 16px; }
  .dashboard-module-panel .module-name {
    font-size: 16px;
    color: #464646;
    position: relative;
    margin-bottom: 8px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.travel-planner-module {
  height: 200px;
  width: 448px;
  /*updated Log A Trip design*/ }
  .travel-planner-module--progress-container {
    position: relative;
    top: 50%;
    transform: translateY(-50%);
    margin: 0 auto;
    display: table; }
  .travel-planner-module--img-container {
    width: 120px;
    height: 198px;
    float: left;
    background-color: #4FB7A4; }
    .travel-planner-module--img-container img {
      width: 100%;
      height: 100%; }
  .travel-planner-module--fco-container {
    width: 328px;
    height: 198px;
    float: right;
    padding: 16px; }
  .travel-planner-module--fco-heading {
    font-size: 16px;
    color: #464646;
    padding-bottom: 8px; }
  .travel-planner-module--ptb-container {
    /*Editing the address picker on the desktop dashboard's FCO container*/ }
    .travel-planner-module--ptb-container .text-field.text-field-ptb.is-active {
      padding-right: 0;
      padding-left: 0; }
  .travel-planner-module--ptb {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    padding-right: 0 !important; }
    .travel-planner-module--ptb .address-picker--address-input {
      margin-left: 32px;
      padding: 4px 8px !important;
      background-color: #eeeeee !important; }
    .travel-planner-module--ptb.is-active {
      display: initial !important; }
      .travel-planner-module--ptb.is-active .address-picker--address-input {
        background-color: transparent !important;
        margin-bottom: 0 !important;
        padding-top: 0 !important; }
    .travel-planner-module--ptb .rs-ptb-list {
      border-top: 2px solid #03a9f4; }
  .travel-planner-module--search-button {
    padding-top: 16px !important; }
    .travel-planner-module--search-button button {
      padding: 0 32px !important; }
  .travel-planner-module .paper-card-heading {
    background-color: #03a9f4;
    color: #fff;
    line-height: 24px; }
    .travel-planner-module .paper-card-heading .heading-text {
      text-align: center;
      vertical-align: middle; }
    .travel-planner-module .paper-card-heading .rs-icon {
      height: 100%;
      font-size: 12px;
      line-height: 24px;
      padding: 0 10px;
      cursor: pointer; }
      .travel-planner-module .paper-card-heading .rs-icon:hover {
        background: rgba(255, 255, 255, 0.3); }
      .travel-planner-module .paper-card-heading .rs-icon._back-btn2 {
        float: left; }
      .travel-planner-module .paper-card-heading .rs-icon._next-btn {
        float: right; }
  .travel-planner-module .calendar-area {
    width: 216px;
    background: #f9f9f9;
    height: auto;
    float: left; }
    .travel-planner-module .calendar-area table {
      width: 100%;
      margin: 0; }
      .travel-planner-module .calendar-area table thead tr th {
        border: none;
        text-align: center;
        font-weight: normal;
        font-size: 12px;
        font-weight: 500;
        padding: 0; }
      .travel-planner-module .calendar-area table tbody tr td {
        border: none;
        text-align: center;
        font-weight: lighter;
        font-size: 12px;
        height: auto;
        width: 46px;
        padding: 1px;
        cursor: pointer; }
        .travel-planner-module .calendar-area table tbody tr td .day-number {
          height: 24px;
          width: 24px;
          border-radius: 12px;
          border: 1px solid transparent;
          padding-right: 2px;
          margin: 0 auto; }
        .travel-planner-module .calendar-area table tbody tr td.otherMonth {
          color: #b5b5b5;
          cursor: default; }
          .travel-planner-module .calendar-area table tbody tr td.otherMonth:hover {
            background: none; }
        .travel-planner-module .calendar-area table tbody tr td.hasTrips {
          color: #03a9f4; }
          .travel-planner-module .calendar-area table tbody tr td.hasTrips .day-number {
            border: 1px solid #03a9f4; }
        .travel-planner-module .calendar-area table tbody tr td:hover .day-number {
          background: #efefef; }
        .travel-planner-module .calendar-area table tbody tr td.selected .day-number {
          color: #fff;
          border: 1px solid #03a9f4;
          background-color: #03a9f4; }
          .travel-planner-module .calendar-area table tbody tr td.selected .day-number.future-date {
            border: 1px solid #b5b5b5;
            background-color: #b5b5b5; }
  .travel-planner-module .info-area {
    float: right;
    height: 200px;
    width: 232px; }
    .travel-planner-module .info-area .info-body {
      height: 138px;
      overflow: auto; }
      .travel-planner-module .info-area .info-body .help-text {
        text-align: center;
        padding: 16px 24px;
        padding-top: 50px;
        white-space: normal; }
        .travel-planner-module .info-area .info-body .help-text h4 {
          font-weight: bold;
          font-size: 14px;
          color: #464646;
          margin-bottom: 16px; }
        .travel-planner-module .info-area .info-body .help-text p {
          font-weight: normal;
          font-size: 12px;
          color: #868686;
          line-height: 18px;
          padding: 0 10px; }
      .travel-planner-module .info-area .info-body ul.trip-items-list {
        padding: 0 8px; }
        .travel-planner-module .info-area .info-body ul.trip-items-list .trip-item-row {
          margin: 0;
          padding: 0;
          padding-top: 4px;
          height: 32px;
          line-height: 24px;
          vertical-align: middle; }
          .travel-planner-module .info-area .info-body ul.trip-items-list .trip-item-row .row-icon {
            display: block;
            float: left;
            text-align: center;
            width: 24px;
            height: 24px; }
            .travel-planner-module .info-area .info-body ul.trip-items-list .trip-item-row .row-icon .mode-icon {
              width: 24px;
              height: 24px; }
          .travel-planner-module .info-area .info-body ul.trip-items-list .trip-item-row .row-text {
            float: left;
            margin-top: 0;
            margin-left: 12px;
            font-size: 12px;
            color: #878787; }
  .travel-planner-module--updated-info-area {
    border-left: 1px solid rgba(0, 0, 0, 0.12); }
  .travel-planner-module--info-header {
    height: 24px; }
  .travel-planner-module--help-text-with-icon.help-text {
    padding: 12px 16px !important; }
  .travel-planner-module--zero-trip-icon {
    font-size: 72px;
    color: rgba(0, 0, 0, 0.26); }
  .travel-planner-module--zero-trip-image {
    padding: 0px 0px 4px; }
  .travel-planner-module--zero-trip-text {
    color: rgba(0, 0, 0, 0.38); }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.paper-arrow {
  display: block;
  width: 0;
  height: 0;
  border: 16px solid transparent;
  position: relative; }
  .paper-arrow.with-shadow:after {
    content: "";
    display: block;
    position: absolute;
    border: 18px solid transparent;
    top: 0;
    left: 0;
    bottom: 0;
    width: 0;
    height: 0;
    z-index: -1; }
  .paper-arrow.paper-arrow-up {
    border-bottom-color: #fff; }
  .paper-arrow.paper-arrow-right {
    border-left-color: #fff; }
  .paper-arrow.paper-arrow-down {
    border-top-color: #fff; }
    .paper-arrow.paper-arrow-down:after {
      border-top-color: rgba(0, 0, 0, 0.1);
      margin-left: -17px;
      margin-top: -16px; }
  .paper-arrow.paper-arrow-left {
    border-right-color: #fff; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.modal-paper .paper-card {
  position: absolute;
  height: auto;
  width: 100%;
  left: 0;
  right: 0;
  top: 0;
  /*bottom:0;*/
  max-width: 760px;
  /*max-height: 90%;*/
  margin: 5% auto; }
  .modal-paper .paper-card.paper-card-small {
    max-width: 400px;
    /*max-height: 304px;*/ }
  .modal-paper .paper-card::before {
    display: none !important; }
  .modal-paper .paper-card .paper-card-body {
    height: 90%;
    height: calc(100% - 88px); }
    .modal-paper .paper-card .paper-card-body .paper-card-body-content {
      overflow-y: scroll;
      max-height: 95%;
      max-height: calc(100%);
      padding-bottom: 16px;
      position: relative;
      overflow-y: auto;
      -ms-overflow-style: -ms-autohiding-scrollbar;
      /* Set width */
      /* Track */
      /* Handle */ }
      .modal-paper .paper-card .paper-card-body .paper-card-body-content::-webkit-scrollbar {
        width: 8px; }
      .modal-paper .paper-card .paper-card-body .paper-card-body-content::-webkit-scrollbar-track {
        display: none; }
      .modal-paper .paper-card .paper-card-body .paper-card-body-content::-webkit-scrollbar-thumb {
        border-radius: 10px;
        background-color: rgba(200, 200, 200, 0.8);
        box-shadow: inset 0 0 6px rgba(200, 200, 200, 0.8); }
      .modal-paper .paper-card .paper-card-body .paper-card-body-content::-webkit-scrollbar-thumb:window-inactive {
        background: rgba(201, 201, 201, 0.8); }
  .modal-paper .paper-card.paper-card-lg {
    max-height: 600px;
    max-width: 704px; }
    .modal-paper .paper-card.paper-card-lg .paper-card-body {
      height: calc(100% - 110px); }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.popover-content.travelmode-content {
  width: 280px;
  height: auto;
  padding: 0; }
  .popover-content.travelmode-content img {
    height: auto;
    width: 280px;
    background-color: #efefef; }
  .popover-content.travelmode-content .desc {
    padding: 16px;
    font-size: 14px;
    color: #898989; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
body.spa-sticky-header-footer md-toast ~ div .MasterFooterContent {
  z-index: 90 !important; }

body.spa-sticky-header-footer .md-dialog-container ~ div .MasterFooterContent,
body.spa-sticky-header-footer md-backdrop ~ div .MasterFooterContent {
  z-index: 70 !important; }

body.spa-sticky-header-footer .md-dialog-container ~ form #MasterHeaderContent .main-header,
body.spa-sticky-header-footer md-backdrop ~ form #MasterHeaderContent .main-header {
  z-index: 70 !important; }

body.spa-sticky-header-footer #MasterHeaderContent .main-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 99; }

body.spa-sticky-header-footer #spaRemoveContentTarget #MasterMainContent {
  position: fixed;
  top: 128px;
  left: 0;
  right: 0;
  bottom: 16px; }
  body.spa-sticky-header-footer #spaRemoveContentTarget #MasterMainContent .ContentSection.main-content-section {
    height: 100%; }
    body.spa-sticky-header-footer #spaRemoveContentTarget #MasterMainContent .ContentSection.main-content-section .bootstrap {
      height: 100%; }
      body.spa-sticky-header-footer #spaRemoveContentTarget #MasterMainContent .ContentSection.main-content-section .bootstrap div#desktop-app-root-element {
        height: 100%; }
        body.spa-sticky-header-footer #spaRemoveContentTarget #MasterMainContent .ContentSection.main-content-section .bootstrap div#desktop-app-root-element .map-overlay-content {
          position: absolute;
          top: 0;
          bottom: 0;
          right: 0;
          left: 0;
          overflow: auto; }

body.spa-sticky-header-footer #spaRemoveContentTarget #MasterFooterContent {
  transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 17px 50px rgba(0, 0, 0, 0.19);
  position: fixed;
  left: 0;
  right: 0;
  top: 100%;
  z-index: 999;
  border-top: 16px solid #666;
  margin-top: -16px; }
  body.spa-sticky-header-footer #spaRemoveContentTarget #MasterFooterContent .footer-tab {
    display: block;
    position: absolute;
    top: -52px;
    left: 50%;
    margin-left: -30px;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: #666;
    color: #e0e0e0;
    font-size: 19.5px;
    text-align: center;
    cursor: pointer;
    box-sizing: border-box;
    /*z-index:-1;*/
    padding: 2.4px;
    transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    transition: top 0.1s linear, transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1); }
    body.spa-sticky-header-footer #spaRemoveContentTarget #MasterFooterContent .footer-tab:hover {
      /*background:$site-map-backgroundcolor-10-lighter;*/
      transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
      box-shadow: 0 17px 50px rgba(0, 0, 0, 0.19);
      transition: top 0.1s linear, transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
      top: -57px; }
  body.spa-sticky-header-footer #spaRemoveContentTarget #MasterFooterContent .footer-slide-out-content {
    border-top: 16px solid #666;
    position: relative;
    top: 0;
    transition: ease-in-out all .5s; }
    body.spa-sticky-header-footer #spaRemoveContentTarget #MasterFooterContent .footer-slide-out-content .footer-tab .rs-icon._show-more {
      display: none; }
    body.spa-sticky-header-footer #spaRemoveContentTarget #MasterFooterContent .footer-slide-out-content .footer-tab .rs-icon._show-less {
      display: block; }
    body.spa-sticky-header-footer #spaRemoveContentTarget #MasterFooterContent .footer-slide-out-content .footer-tab .footer-tab-text {
      font-size: 13px;
      position: relative;
      top: -10px; }
      body.spa-sticky-header-footer #spaRemoveContentTarget #MasterFooterContent .footer-slide-out-content .footer-tab .footer-tab-text .dnt {
        white-space: nowrap;
        background-color: #666; }
  body.spa-sticky-header-footer #spaRemoveContentTarget #MasterFooterContent.is-open .footer-slide-out-content .footer-tab {
    top: -50px; }
    body.spa-sticky-header-footer #spaRemoveContentTarget #MasterFooterContent.is-open .footer-slide-out-content .footer-tab .rs-icon._show-more {
      display: block;
      position: relative;
      top: 32px; }
    body.spa-sticky-header-footer #spaRemoveContentTarget #MasterFooterContent.is-open .footer-slide-out-content .footer-tab .rs-icon._show-less {
      display: none; }

.footer-tab {
  display: none; }

body.spa-sticky-header-footer.French #spaRemoveContentTarget #MasterFooterContent .footer-slide-out-content .footer-tab .footer-tab-text {
  font-size: 9px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.toasts-container {
  position: fixed;
  bottom: 0;
  right: 0;
  z-index: 99999999;
  margin: 0 16px; }
  .toasts-container .toast {
    min-width: 280px;
    max-width: 500px;
    margin: 0;
    margin-bottom: 16px;
    padding: 8px;
    border-radius: 5px;
    background: #333;
    display: table; }
    .toasts-container .toast .row-text {
      color: #ebebeb !important;
      margin: 8px 0;
      padding-left: 8px;
      float: left; }
      .toasts-container .toast .row-text h4 {
        font-size: 16px;
        line-height: 28px;
        font-weight: normal; }
    .toasts-container .toast .row-icon {
      width: 32px;
      font-size: 21px;
      text-align: center;
      display: table-cell;
      vertical-align: middle; }
    .toasts-container .toast.success .row-icon {
      color: forestgreen; }
    .toasts-container .toast.error .row-icon {
      color: crimson; }
  .toasts-container.toasts-container-bottom-right .toast.ng-animate {
    position: relative;
    right: 0;
    transition: right 0.5s cubic-bezier(0.56, -0.02, 0.52, 1.02); }
    .toasts-container.toasts-container-bottom-right .toast.ng-animate.ng-leave {
      right: 0; }
      .toasts-container.toasts-container-bottom-right .toast.ng-animate.ng-leave.ng-leave-active {
        right: -200%; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.tooltip {
  position: absolute;
  z-index: 1070;
  display: block;
  visibility: visible;
  font-size: 12px;
  line-height: 1.4;
  opacity: 0;
  filter: alpha(opacity=0);
  height: auto; }
  .tooltip.in {
    opacity: 0.9;
    filter: alpha(opacity=90); }
  .tooltip.top {
    margin-top: -3px;
    padding: 5px 0; }
  .tooltip.right {
    margin-left: 3px;
    padding: 0 5px; }
  .tooltip.bottom {
    margin-top: 3px;
    padding: 5px 0; }
  .tooltip.left {
    margin-left: -3px;
    padding: 0 5px; }

.tooltip-inner {
  max-width: 200px;
  padding: 3px 8px;
  color: #fff;
  text-align: center;
  text-decoration: none;
  background-color: #000;
  border-radius: 4px; }

.tooltip-arrow {
  position: absolute;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid; }

.tooltip.top .tooltip-arrow {
  bottom: -5px;
  left: 50%;
  margin-left: -5px;
  border-width: 5px 5px 0;
  border-top-color: #000; }

.tooltip.top-left .tooltip-arrow {
  bottom: 0;
  left: 5px;
  border-width: 5px 5px 0;
  border-top-color: #000; }

.tooltip.top-right .tooltip-arrow {
  bottom: 0;
  right: 5px;
  border-width: 5px 5px 0;
  border-top-color: #000; }

.tooltip.right .tooltip-arrow {
  top: 50%;
  left: -5px;
  margin-top: -5px;
  border-width: 5px 5px 5px 0;
  border-right-color: #000; }

.tooltip.left .tooltip-arrow {
  top: 50%;
  right: -5px;
  margin-top: -5px;
  border-width: 5px 0 5px 5px;
  border-left-color: #000; }

.tooltip.bottom .tooltip-arrow {
  top: -5px;
  left: 50%;
  margin-left: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000; }

.tooltip.bottom-left .tooltip-arrow {
  top: 0;
  left: 5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000; }

.tooltip.bottom-right .tooltip-arrow {
  top: 0;
  right: 5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.animate-me {
  transition: all 1s ease-in-out !important;
  z-index: 9999999999;
  position: relative; }
  .animate-me.ng-enter {
    top: -100%;
    /*opacity: 0;*/
    /*transition-delay: -$transition-length;*/ }
  .animate-me.ng-enter.ng-enter-active {
    top: 0;
    /*opacity: 1;*/ }
  .animate-me.ng-leave {
    top: 0;
    /*opacity: 1;*/ }
  .animate-me.ng-leave.ng-leave-active {
    top: 100%;
    /*opacity: 0;*/ }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
@keyframes shake {
  0% {
    transform: translateX(0); }
  12.5% {
    transform: translateX(-6px) rotateY(-5deg); }
  37.5% {
    transform: translateX(5px) rotateY(4deg); }
  62.5% {
    transform: translateX(-3px) rotateY(-2deg); }
  87.5% {
    transform: translateX(2px) rotateY(1deg); }
  100% {
    transform: translateX(0); } }

.animate-shake {
  animation: shake 400ms ease-in-out; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.map-overlay-content-ui-view.ng-enter {
  transition: all 0.4s ease-in-out;
  transition-delay: 0.4s;
  left: -100%; }
  .map-overlay-content-ui-view.ng-enter.ng-enter-active {
    left: 0; }

.map-overlay-content-ui-view.ng-leave {
  transition: all 0.4s ease-in-out;
  transition-delay: 0s;
  left: 0; }
  .map-overlay-content-ui-view.ng-leave.ng-leave-active {
    left: -100%; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.visibility-selector {
  margin-left: -8px; }
  .visibility-selector .paper-dropdown-title {
    width: 100%; }
    .visibility-selector .paper-dropdown-title button {
      width: 100%;
      text-align: left; }
      .visibility-selector .paper-dropdown-title button .visibility-selector-title {
        padding: 8px; }
        .visibility-selector .paper-dropdown-title button .visibility-selector-title:hover {
          background: #f1f1f1; }
  .visibility-selector .visibility-selector-body .row {
    padding: 8px;
    cursor: pointer; }
    .visibility-selector .visibility-selector-body .row .rs-icon {
      font-size: 24px;
      position: relative;
      top: 12px;
      left: 12px; }
    .visibility-selector .visibility-selector-body .row:hover {
      background: #f1f1f1; }
  .visibility-selector label span.selector-icon {
    padding-right: 8px; }
    .visibility-selector label span.selector-icon.selected {
      color: #0FB62B; }

.trip-profiles {
  font-family: 'Roboto';
  position: absolute;
  width: 440px;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 5;
  color: #464646;
  background-color: white;
  border: none;
  /*.account-view{
            position:absolute;
            top:0;
            bottom:80px;       
        }
        .bottom-row{
            padding:0 16px;
            position:absolute;
            bottom:32px;
        }*/ }
  .trip-profiles.account-edit .paper-dropdown-title {
    cursor: pointer;
    width: 100%; }
    .trip-profiles.account-edit .paper-dropdown-title:hover {
      background: #f1f1f1; }
    .trip-profiles.account-edit .paper-dropdown-title.no-hover-state:hover {
      background: none;
      cursor: default; }
    .trip-profiles.account-edit .paper-dropdown-title .select-title {
      padding: 8px;
      text-align: left; }
  .trip-profiles.account-edit .select-body .row {
    padding: 8px;
    cursor: pointer; }
    .trip-profiles.account-edit .select-body .row:hover {
      background: #f1f1f1; }
  .trip-profiles .unconfirm-text {
    color: #f89c50;
    font-size: 12px;
    position: absolute;
    top: 4px;
    right: 16px;
    text-align: right; }
  .trip-profiles .unconfirm-cell-text {
    color: #f89c50;
    font-size: 12px;
    text-align: right;
    margin-top: 22px; }
  .trip-profiles .confirm-cell-text {
    color: #0FB72B;
    font-size: 12px;
    text-align: right;
    margin-top: 38px; }
  .trip-profiles .help-icon {
    position: absolute;
    top: 0;
    right: 16px;
    width: 20px;
    height: 20px; }
    .trip-profiles .help-icon .rs-icon {
      font-size: 20px;
      cursor: pointer; }
    .trip-profiles .help-icon .popover {
      position: absolute;
      top: -5px;
      left: 56px;
      height: 400px;
      width: 400px;
      padding: 16px 0;
      z-index: 999;
      background: #fff;
      transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
      box-shadow: 0 8px 17px rgba(0, 0, 0, 0.2); }
      .trip-profiles .help-icon .popover .arrow {
        position: absolute;
        top: 0;
        left: -16px;
        width: 0;
        height: 0;
        border-top: 16px solid transparent;
        border-right: 16px solid #fff;
        border-bottom: 16px solid transparent; }
      .trip-profiles .help-icon .popover .container-fluid {
        height: 100%;
        padding-bottom: 56px;
        position: relative;
        font-size: 14px; }
        .trip-profiles .help-icon .popover .container-fluid .popover-content {
          height: 100%;
          overflow: auto; }
        .trip-profiles .help-icon .popover .container-fluid .popover-footer {
          position: absolute;
          bottom: 0;
          left: 16px;
          right: 16px; }
  .trip-profiles .trip-profiles-header {
    color: #666;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    background-color: #f9f9f9;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26);
    z-index: 10; }
    .trip-profiles .trip-profiles-header .icon {
      padding: 4px; }
    .trip-profiles .trip-profiles-header a {
      font-size: 12px; }
    .trip-profiles .trip-profiles-header .rs-icon._arrow-back {
      font-size: 24px; }
    .trip-profiles .trip-profiles-header.trip-profiles-header-placeholder {
      position: static;
      visibility: hidden; }
  .trip-profiles .paper-button.paper-button-raised.btn.btn-primary.invalid, .trip-profiles .btn.btn-primary.invalid.raised-button {
    opacity: 1;
    background: #aaa; }
  .trip-profiles .paper-button.paper-button-raised.btn.btn-primary.fab, .trip-profiles .btn.btn-primary.fab.raised-button {
    position: absolute;
    margin: 0;
    z-index: 50;
    min-width: 50px;
    height: 50px;
    border-radius: 50%;
    padding: 0 4px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center; }
    .trip-profiles .paper-button.paper-button-raised.btn.btn-primary.fab.bottom, .trip-profiles .btn.btn-primary.fab.bottom.raised-button {
      top: auto;
      bottom: 16px; }
    .trip-profiles .paper-button.paper-button-raised.btn.btn-primary.fab span.rs-icon.rs-icon._checkmark_fco, .trip-profiles .btn.btn-primary.fab.raised-button span.rs-icon.rs-icon._checkmark_fco {
      font-size: 17px;
      position: relative;
      left: -2px; }
  .trip-profiles.trip-profiles-list .paper-button.paper-button-raised.btn.btn-primary.fab, .trip-profiles.trip-profiles-list .btn.btn-primary.fab.raised-button {
    top: 40px;
    right: -25px;
    margin-top: -25px; }
  .trip-profiles.trip-profiles-list .trip-profiles-header {
    min-height: 80px;
    padding-top: 16px;
    padding-bottom: 16px; }
    .trip-profiles.trip-profiles-list .trip-profiles-header h3 {
      font-size: 24px;
      font-weight: 300;
      min-height: 24px;
      line-height: 26px;
      margin-top: -2px; }
  .trip-profiles.trip-profiles-editor .fab-button {
    position: fixed;
    top: 110px;
    left: 415px; }
  .trip-profiles.trip-profiles-editor .trip-profiles-header {
    padding-top: 16px;
    padding-bottom: 16px;
    min-height: 80px;
    z-index: 1; }
    .trip-profiles.trip-profiles-editor .trip-profiles-header .glyphicons.chevron-left {
      display: block;
      height: 100%;
      width: 100%;
      font-size: 22px; }
    .trip-profiles.trip-profiles-editor .trip-profiles-header h3 {
      padding: 0;
      font-size: 24px;
      font-weight: 300;
      min-height: 24px;
      line-height: 26px;
      margin-top: -2px; }
  .trip-profiles.trip-profiles-editor .trip-profiles-body {
    position: relative; }
  .trip-profiles.trip-profiles-editor.first-trip {
    padding-top: 103px; }
    .trip-profiles.trip-profiles-editor.first-trip .trip-profiles-header {
      padding-top: 16px;
      padding-bottom: 16px;
      min-height: 78px;
      /*background:#8E6CF4;
                    color:#fff;*/ }
    .trip-profiles.trip-profiles-editor.first-trip .trip-profiles-body {
      padding-bottom: 36px; }
  .trip-profiles .trip-profiles-body {
    height: 100%;
    overflow: auto;
    padding-top: 4px; }
  .trip-profiles .text-field-label {
    margin-top: 16px; }
  .trip-profiles textarea.text-field {
    margin-top: 8px;
    border: 1px solid #efefef;
    padding: 8px; }
  .trip-profiles .saving-indicator {
    top: auto;
    bottom: 0;
    width: 100%;
    position: absolute;
    left: 0;
    right: 0; }
    .trip-profiles .saving-indicator .paper-emphasis-linearProgress.is-active {
      background-color: #03a9f4; }
    .trip-profiles .saving-indicator .paper-emphasis-linearProgress.is-active:after,
    .trip-profiles .saving-indicator .paper-emphasis-linearProgress.is-active:before {
      background-color: rgba(255, 255, 255, 0.5); }
  .trip-profiles .container-fluid {
    /*height: 100%;
            overflow: hidden;*/ }
  .trip-profiles p {
    margin: 16px 0; }
  .trip-profiles .commute-mode-indicators .travel-mode {
    float: left;
    font-size: 16px;
    margin: 8px; }
    .trip-profiles .commute-mode-indicators .travel-mode .rs-icon {
      color: #cdcdcd; }
    .trip-profiles .commute-mode-indicators .travel-mode.active .rs-icon._car-icon {
      color: #64B3F4; }
    .trip-profiles .commute-mode-indicators .travel-mode.active .rs-icon._van {
      color: #5C6BBE; }
    .trip-profiles .commute-mode-indicators .travel-mode.active .rs-icon._bicycle {
      color: #26A498; }
    .trip-profiles .commute-mode-indicators .travel-mode.active .rs-icon._taxi {
      color: #FFCC33; }
    .trip-profiles .commute-mode-indicators .travel-mode.active .rs-icon._bus {
      color: #A947BA; }
    .trip-profiles .commute-mode-indicators .travel-mode.active .rs-icon._walking {
      color: #EF5350; }
  .trip-profiles .trip-profile-editor-header {
    /*background:#6f5499;
            color:#fff;*/
    padding-top: 16px;
    padding-bottom: 16px; }
  .trip-profiles .visibility-filter-button, .trip-profiles .visibility-filter-indicator {
    float: left;
    cursor: pointer; }
    .trip-profiles .visibility-filter-button .rs-icon, .trip-profiles .visibility-filter-indicator .rs-icon {
      color: #ccc; }
    .trip-profiles .visibility-filter-button.selected .rs-icon._male, .trip-profiles .visibility-filter-indicator.selected .rs-icon._male {
      color: blue; }
    .trip-profiles .visibility-filter-button.selected .rs-icon._female, .trip-profiles .visibility-filter-indicator.selected .rs-icon._female {
      color: deeppink; }
    .trip-profiles .visibility-filter-button.selected .rs-icon._smoking, .trip-profiles .visibility-filter-indicator.selected .rs-icon._smoking {
      color: orange; }
    .trip-profiles .visibility-filter-button.selected .rs-icon._non-smoking, .trip-profiles .visibility-filter-indicator.selected .rs-icon._non-smoking {
      color: darkred; }
  .trip-profiles .visibility-filter-indicator {
    font-size: 16px;
    line-height: 20px;
    margin: 0 6px;
    margin-top: 2px; }
    .trip-profiles .visibility-filter-indicator:hover {
      background: #e9e9e9; }
  .trip-profiles .visibility-filter-button {
    width: 36px;
    height: 36px;
    font-size: 24px;
    padding: 6px;
    margin: 7px; }
    .trip-profiles .visibility-filter-button:hover {
      background: #f1f1f1; }
  .trip-profiles .panel-group .form-input-row {
    padding: 0; }
  .trip-profiles .panel-group .panel.panel-default {
    border-bottom: 1px solid #efefef; }
  .trip-profiles .panel-group .panel-heading h4.panel-title {
    font-size: inherit;
    font: inherit;
    margin: 0;
    padding: 0; }
    .trip-profiles .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width {
      display: block;
      margin: -14px -15px;
      padding: 8px 15px;
      position: relative; }
      .trip-profiles .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width .accordion-number {
        float: left;
        display: block;
        width: 30px;
        height: 30px;
        border-radius: 50%;
        background: #bcbcbc;
        color: #fff;
        padding: 5px;
        text-align: center;
        position: relative;
        top: 0;
        left: -4px;
        font-size: 14px;
        transition: all linear .1s; }
      .trip-profiles .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width .section-title {
        font-size: 20px;
        color: #03a9f4;
        display: block;
        transition: all linear .1s; }
      .trip-profiles .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width .section-data-summary {
        display: none; }
      .trip-profiles .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width span.rs-icon._edit {
        display: none; }
      .trip-profiles .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width .unconfirm-text {
        color: #f89c50;
        font-size: 12px;
        position: absolute;
        top: 4px;
        right: 16px;
        text-align: right; }
      .trip-profiles .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width.isOpen .accordion-number {
        background-color: #03a9f4; }
      .trip-profiles .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width.isOpen.unconfirmed .accordion-number {
        background-color: #f89c50;
        transform: rotate(90deg); }
        .trip-profiles .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width.isOpen.unconfirmed .accordion-number .rs-icon._menu-v1 {
          position: relative;
          top: 3px; }
      .trip-profiles .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width.isOpen.incomplete .accordion-number {
        background-color: #ddd;
        transform: rotate(90deg); }
        .trip-profiles .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width.isOpen.incomplete .accordion-number .rs-icon._menu-v1 {
          position: relative;
          top: 3px; }
      .trip-profiles .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width.isClosed.isDisable:hover {
        color: #fff; }
      .trip-profiles .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width.isClosed.isDisable .section-title {
        color: #bcbcbc; }
      .trip-profiles .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width.isClosed .accordion-number {
        font-size: 10px;
        width: 15px;
        height: 15px;
        color: #fff;
        padding: 0;
        position: relative;
        top: 6px;
        left: 6px; }
      .trip-profiles .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width.isClosed .section-title {
        font-size: 16px;
        margin-top: 5px; }
      .trip-profiles .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width.isClosed:hover {
        background-color: #f6f6f6; }
      .trip-profiles .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width.isClosed.visited .accordion-number {
        background: #0FB72B; }
      .trip-profiles .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width.isClosed.visited.unconfirmed .accordion-number {
        background: #f89c50;
        transform: rotate(90deg); }
        .trip-profiles .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width.isClosed.visited.unconfirmed .accordion-number .rs-icon._menu-v1 {
          position: relative;
          top: 3px; }
      .trip-profiles .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width.isClosed.visited.incomplete .accordion-number {
        background: #ddd;
        transform: rotate(90deg); }
        .trip-profiles .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width.isClosed.visited.incomplete .accordion-number .rs-icon._menu-v1 {
          position: relative;
          top: 3px; }
      .trip-profiles .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width.isClosed.visited .section-title {
        font-size: 12px;
        color: #bcbcbc; }
      .trip-profiles .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width.isClosed.visited .section-data-summary {
        display: block; }
      .trip-profiles .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width.isClosed.visited .section-sub-title {
        display: inline;
        font-size: 12px;
        color: #bcbcbc; }
      .trip-profiles .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width.isClosed.visited:hover .section-data-summary {
        position: relative;
        display: table;
        width: 100%; }
      .trip-profiles .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width.isClosed.visited:hover span.rs-icon._edit {
        position: absolute;
        display: block;
        color: #bcbcbc;
        right: 16px;
        top: 40%;
        width: 18px;
        height: 18px; }
  .trip-profiles .panel-group .panel-collapse .panel-body {
    border-top: none; }
    .trip-profiles .panel-group .panel-collapse .panel-body .swap-icon {
      padding: 30px 8px;
      font-size: 24px; }
      .trip-profiles .panel-group .panel-collapse .panel-body .swap-icon .icon-rotate {
        transition-duration: .2s; }
        .trip-profiles .panel-group .panel-collapse .panel-body .swap-icon .icon-rotate.active {
          transform: rotate(180deg); }
    .trip-profiles .panel-group .panel-collapse .panel-body .who-can-find-me {
      /*margin-top:16px;*/ }
      .trip-profiles .panel-group .panel-collapse .panel-body .who-can-find-me .col-xs-4 {
        padding-top: 8px; }
    .trip-profiles .panel-group .panel-collapse .panel-body .save-row {
      margin-top: 8px; }
  .trip-profiles .travel-mode-options-text {
    font-size: 12px;
    color: #BBBBBB; }
  .trip-profiles .radio-group {
    margin-left: 48px; }
  .trip-profiles .travel-mode-section {
    padding: 8px 0; }
    .trip-profiles .travel-mode-section .travel-mode-toggle .desktop-icon-container {
      left: -8px; }
    .trip-profiles .travel-mode-section .travel-mode-options .desktop-icon-container {
      margin-left: 8px; }
    .trip-profiles .travel-mode-section .desktop-icon-container {
      display: block;
      float: left;
      position: relative;
      text-align: center;
      width: 48px;
      height: 48px;
      font-size: 24px;
      cursor: pointer; }
    .trip-profiles .travel-mode-section span.travel-mode {
      background-color: #BBBBBB;
      color: white;
      width: 32px;
      height: 32px;
      text-align: center;
      border-radius: 32px;
      /*&:hover{
                    @include depth-2;
                }*/
      box-sizing: border-box;
      position: absolute;
      top: 8px;
      left: 8px; }
      .trip-profiles .travel-mode-section span.travel-mode .rs-icon {
        position: relative;
        top: 4px; }
      .trip-profiles .travel-mode-section span.travel-mode.active {
        background-color: #64B3F4;
        /*@include depth-2;*/ }
    .trip-profiles .travel-mode-section span.active:before {
      position: absolute;
      content: "";
      border-radius: 40px;
      width: 40px;
      height: 40px;
      top: -4px;
      left: -4px;
      background-color: transparent;
      border-style: solid;
      border-width: 1px;
      border-color: inherit; }
    .trip-profiles .travel-mode-section .level-icon {
      font-size: 20px;
      margin: 4px;
      color: #D9B85C; }
    .trip-profiles .travel-mode-section .arrow-icon {
      position: relative;
      top: -4px;
      right: 0px; }
    .trip-profiles .travel-mode-section .level-dropdown .paper-list-dropdown-menu {
      min-width: 250px;
      padding: 0; }
    .trip-profiles .travel-mode-section .level-dropdown .paper-dropdown-content-wrapper {
      min-width: 250px; }
    .trip-profiles .travel-mode-section .level-dropdown .paper-dropdown.is-open {
      position: absolute;
      z-index: 100; }
    .trip-profiles .travel-mode-section .level-dropdown .list-group-item {
      padding: 8px; }
      .trip-profiles .travel-mode-section .level-dropdown .list-group-item .row-text {
        float: left; }
        .trip-profiles .travel-mode-section .level-dropdown .list-group-item .row-text .row-text-primary {
          font-size: 16px;
          font-weight: 400;
          color: #464646;
          text-align: left; }
        .trip-profiles .travel-mode-section .level-dropdown .list-group-item .row-text .row-text-secondary {
          font-size: 12px;
          font-weight: 300;
          text-align: left; }
      .trip-profiles .travel-mode-section .level-dropdown .list-group-item .row-icon {
        color: #D9B85C;
        float: left;
        margin-right: 16px;
        margin-top: -8px; }
        .trip-profiles .travel-mode-section .level-dropdown .list-group-item .row-icon .rs-icon {
          position: relative;
          top: 12px; }
      .trip-profiles .travel-mode-section .level-dropdown .list-group-item .row-icon-level {
        color: #D9B85C;
        float: left;
        margin-top: 12px;
        font-size: 24px; }
  .trip-profiles .paper-list {
    /*border-bottom:1px solid #ddd;*/ }
    .trip-profiles .paper-list .trip-profile-item {
      border-bottom: 1px solid #ddd;
      padding: 8px 16px;
      cursor: pointer; }
      .trip-profiles .paper-list .trip-profile-item.hover, .trip-profiles .paper-list .trip-profile-item:hover {
        background: #f6f6f6;
        border-left: 5px solid #03a9f4; }
      .trip-profiles .paper-list .trip-profile-item .trip-profile-item-heading-label {
        max-width: 312px;
        text-overflow: ellipsis; }
        .trip-profiles .paper-list .trip-profile-item .trip-profile-item-heading-label.is-defaultTrip {
          max-width: 220px; }
      .trip-profiles .paper-list .trip-profile-item .trip-profile-item-heading .default-text {
        top: 6px;
        position: relative;
        font-size: 12px;
        color: #898989;
        margin-left: 8px; }
      .trip-profiles .paper-list .trip-profile-item .trip-profile-item-heading .heading-items {
        margin-top: -8px;
        margin-right: -8px; }
        .trip-profiles .paper-list .trip-profile-item .trip-profile-item-heading .heading-items .heading-item {
          float: right;
          display: block;
          height: 48px;
          min-width: 48px;
          padding: 8px;
          text-align: center; }
          .trip-profiles .paper-list .trip-profile-item .trip-profile-item-heading .heading-items .heading-item .rs-icon._menu-v1 {
            font-size: 20px;
            line-height: 34px; }
          .trip-profiles .paper-list .trip-profile-item .trip-profile-item-heading .heading-items .heading-item .visibility-icon {
            border-radius: 50%;
            color: #fff;
            height: 100%;
            width: 100%;
            font-size: 22px;
            padding: 5px; }
            .trip-profiles .paper-list .trip-profile-item .trip-profile-item-heading .heading-items .heading-item .visibility-icon.visible {
              color: #0FB72B; }
            .trip-profiles .paper-list .trip-profile-item .trip-profile-item-heading .heading-items .heading-item .visibility-icon.not-visible {
              color: #aaa; }
        .trip-profiles .paper-list .trip-profile-item .trip-profile-item-heading .heading-items li.list-group-item.with-icon.with-ink {
          white-space: nowrap; }
      .trip-profiles .paper-list .trip-profile-item .trip-profile-item-body {
        padding-top: 8px; }
        .trip-profiles .paper-list .trip-profile-item .trip-profile-item-body .schedule {
          float: right;
          padding-left: 16px;
          width: 150px; }
        .trip-profiles .paper-list .trip-profile-item .trip-profile-item-body span.travel-mode {
          font-size: 16px;
          margin: 4px; }
          .trip-profiles .paper-list .trip-profile-item .trip-profile-item-body span.travel-mode .rs-icon {
            color: #cdcdcd; }
          .trip-profiles .paper-list .trip-profile-item .trip-profile-item-body span.travel-mode.active .rs-icon._car-icon {
            color: #64B3F4; }
          .trip-profiles .paper-list .trip-profile-item .trip-profile-item-body span.travel-mode.active .rs-icon._van {
            color: #5C6BBE; }
          .trip-profiles .paper-list .trip-profile-item .trip-profile-item-body span.travel-mode.active .rs-icon._bicycle {
            color: #26A498; }
          .trip-profiles .paper-list .trip-profile-item .trip-profile-item-body span.travel-mode.active .rs-icon._taxi {
            color: #FFCC33; }
          .trip-profiles .paper-list .trip-profile-item .trip-profile-item-body span.travel-mode.active .rs-icon._bus {
            color: #A947BA; }
          .trip-profiles .paper-list .trip-profile-item .trip-profile-item-body span.travel-mode.active .rs-icon._walking {
            color: #EF5350; }
  .trip-profiles .create-btn {
    margin-top: 16px; }
  .trip-profiles .addresses-preview {
    float: left;
    max-width: 232px;
    overflow-x: hidden; }
    .trip-profiles .addresses-preview .address-text {
      white-space: nowrap;
      text-overflow: ellipsis;
      overflow-x: hidden; }
    .trip-profiles .addresses-preview .rs-icon._initial-location {
      color: #0fb62b; }
    .trip-profiles .addresses-preview .rs-icon._end-location {
      color: #e73d38; }

.lang-accordion-number {
  font-size: 10px;
  width: 15px;
  height: 15px;
  color: #fff;
  padding-top: 8px;
  position: relative;
  top: 6px;
  left: 6px;
  float: left;
  display: block;
  border-radius: 50%;
  background: #0FB72B;
  color: #fff;
  text-align: center;
  position: relative;
  top: 4px;
  left: -2px;
  font-size: 14px;
  transition: all linear .1s; }

.lang-padding-top {
  padding-top: 8px; }

.auto-match-check {
  position: relative;
  top: -8px;
  left: 8px; }

.link-text {
  position: relative;
  margin-right: 16px;
  top: -4px; }

.paper-card-comment {
  position: absolute;
  z-index: 100;
  left: 0;
  bottom: 0;
  transform-origin: left bottom;
  transform: scale(0);
  transition: all ease 0.2s; }
  .paper-card-comment.open {
    transform: scale(1); }
  .paper-card-comment .text-field {
    border: 1px solid #dfdfdf;
    min-height: 192px;
    cursor: text;
    margin-bottom: 16px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.map-overlay-content-ui-view {
  perspective: 1000px;
  top: 0;
  bottom: 0;
  left: 0;
  position: absolute;
  z-index: 9;
  perspective-origin: left; }

.trip-profiles-ui-view {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 440px;
  z-index: 12;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden; }
  .trip-profiles-ui-view .trip-profile-item {
    transition: opacity 0.1s linear, top 0.3s cubic-bezier(0, 0, 0.09, 0.64);
    opacity: 1;
    position: relative;
    top: 0; }
    .trip-profiles-ui-view .trip-profile-item:nth-child(1) {
      transition-delay: 0.1s; }
    .trip-profiles-ui-view .trip-profile-item:nth-child(2) {
      transition-delay: 0.2s; }
    .trip-profiles-ui-view .trip-profile-item:nth-child(3) {
      transition-delay: 0.3s; }
    .trip-profiles-ui-view .trip-profile-item:nth-child(4) {
      transition-delay: 0.4s; }
    .trip-profiles-ui-view .trip-profile-item:nth-child(5) {
      transition-delay: 0.5s; }
    .trip-profiles-ui-view .trip-profile-item:nth-child(6) {
      transition-delay: 0.6s; }
    .trip-profiles-ui-view .trip-profile-item:nth-child(7) {
      transition-delay: 0.7s; }
    .trip-profiles-ui-view .trip-profile-item:nth-child(8) {
      transition-delay: 0.8s; }
    .trip-profiles-ui-view .trip-profile-item:nth-child(9) {
      transition-delay: 0.9s; }
    .trip-profiles-ui-view .trip-profile-item:nth-child(10) {
      transition-delay: 1s; }
  .trip-profiles-ui-view.ng-enter {
    transition: all 0.4s ease-in-out;
    transition-delay: 0.4s;
    transform: translateZ(-500px) rotateY(-90deg); }
    .trip-profiles-ui-view.ng-enter.ng-enter-active {
      transform: translateZ(0px) rotateY(0deg); }
  .trip-profiles-ui-view.ng-leave {
    transition: all 0.4s ease-in-out;
    transition-delay: 0s;
    transform: translateZ(0px) rotateY(0deg); }
    .trip-profiles-ui-view.ng-leave.ng-leave-active {
      transform: translateZ(-500px) rotateY(90deg); }

.ng-enter .trip-profile-item {
  top: 100px;
  opacity: 0; }

/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.account-edit .account-nav {
  background-color: #f9f9f9;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); }
  .account-edit .account-nav .nav-tabs.nav, .account-edit .account-nav .nav-justified.nav-tabs.nav {
    overflow-x: visible; }

.account-edit--dropdown-blocker {
  position: absolute;
  width: 100%;
  height: 68px;
  left: 0;
  z-index: 10;
  background-color: rgba(255, 255, 255, 0.6); }

.account-edit .form-input-row.form-input-row-thin .row-text {
  width: 151px; }

.account-edit .paper-dropdown .paper-dropdown-content-wrapper.anchor-to-top {
  top: 33px; }

.account-edit .paper-dropdown.complete .select-title .label {
  color: #03a9f4; }

.account-edit .paper-dropdown .select-title .label {
  font-size: 12px; }

.account-edit .UserIDLine {
  font-size: 12px;
  color: #999; }

.account-edit .ContactEmailLine {
  font-size: 12px;
  color: #444; }

.account-edit .alt-email-msg-label {
  font-size: 12px;
  color: #3A3A3A; }

.account-edit .alt-email-msg {
  font-size: 12px; }

.account-edit .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width.contact .section-data-summary {
  display: block; }

.account-edit .alt-email-row {
  position: relative; }
  .account-edit .alt-email-row .alt-email-remove-btn {
    position: absolute;
    bottom: 16px;
    right: 0;
    color: red;
    /*text-transform:capitalize;*/
    cursor: pointer;
    z-index: 1; }

.account-edit .row.row-ds.about-section .col-6:last-child {
  float: left; }

.account-top {
  height: 112px;
  background-color: #f9f9f9;
  padding: 16px;
  position: relative; }
  .account-top .confirm-email-warning {
    font-size: 10px; }
  .account-top .paper-dropdown .paper-dropdown-content-wrapper.anchor-to-vCenter {
    bottom: -120px; }
  .account-top .paper-list-dropdown-menu {
    font-size: 14px; }
    .account-top .paper-list-dropdown-menu .list-item {
      padding: 8px;
      width: 200px;
      cursor: pointer; }
    .account-top .paper-list-dropdown-menu .rs-icon {
      padding: 8px; }
  .account-top ._menu-v1 {
    padding: 8px; }
  .account-top .profile-img {
    position: relative; }
    .account-top .profile-img ._camera {
      position: absolute;
      bottom: -6px;
      right: -6px;
      width: 24px;
      height: 24px;
      border-radius: 50%;
      background-color: #03a9f4;
      color: #fff;
      padding: 3px;
      font-size: 12px;
      border: 2px solid #fff; }
      .account-top .profile-img ._camera:hover {
        background-color: #2ebcfc; }
  .account-top .profile-name {
    font-size: 20px;
    font-weight: 300;
    /*margin-top:8px;*/
    color: #03a9f4; }

.map-overlay-content-right-ui-view {
  perspective: 1000px;
  top: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: 1000;
  perspective-origin: left; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.schedule-day-time-picker {
  height: 48px;
  padding: 8px 0;
  /**
            For the disabled editor, make the day name always grey.
        */ }
  .schedule-day-time-picker ._day-name {
    /*float: left;*/
    /*margin: 0 20px;*/
    padding: 8px;
    border-radius: 36px;
    width: 36px;
    height: 36px;
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 12px;
    cursor: pointer;
    text-align: center;
    border: 1px solid #03a9f4;
    color: #03a9f4;
    background-color: transparent;
    position: relative;
    left: -16px; }
    .schedule-day-time-picker ._day-name.mobile-day-name {
      margin-top: 20px;
      margin-left: 16px; }
    .schedule-day-time-picker ._day-name span {
      display: block;
      width: 36px;
      text-align: center;
      margin-top: -1px;
      margin-left: -10px; }
    .schedule-day-time-picker ._day-name.__mon-fri {
      width: 70px;
      margin: 0 1px;
      /*&.mobile-mon-fri{
                    margin-top: 20px;
                    margin-left: 4px;
                }*/ }
      .schedule-day-time-picker ._day-name.__mon-fri span {
        display: inline-block;
        width: 100%;
        text-align: center;
        margin-left: -4px; }
  .schedule-day-time-picker .mobile-time-label {
    font-weight: 300;
    padding-top: 28px;
    padding-left: 16px; }
  .schedule-day-time-picker ._dropdowns {
    /*._time-dropdown {
                float: right;

                &:first-child {
                    float: left;
                }


            }*/ }
    .schedule-day-time-picker ._dropdowns .type-subhead-1, .schedule-day-time-picker ._dropdowns .paper-list-subheader .primary-text, .paper-list-subheader .schedule-day-time-picker ._dropdowns .primary-text, .schedule-day-time-picker ._dropdowns .paper-list .list-group-item .primary-text, .paper-list .list-group-item .schedule-day-time-picker ._dropdowns .primary-text, .schedule-day-time-picker ._dropdowns .accordion-group .accordion-heading .row-text, .accordion-group .accordion-heading .schedule-day-time-picker ._dropdowns .row-text {
      color: #bbb;
      text-align: center;
      position: relative;
      left: -16px; }
    .schedule-day-time-picker ._dropdowns .time-label {
      padding-top: 8px;
      padding-left: 12px;
      font-weight: 300; }
    .schedule-day-time-picker ._dropdowns.__offset-1 ._time-dropdown .paper-dropdown-content-wrapper {
      top: -48px; }
    .schedule-day-time-picker ._dropdowns.__offset-2 ._time-dropdown .paper-dropdown-content-wrapper {
      top: -96px; }
    .schedule-day-time-picker ._dropdowns.__offset-3 ._time-dropdown .paper-dropdown-content-wrapper {
      top: -144px; }
    .schedule-day-time-picker ._dropdowns.__offset-4 ._time-dropdown .paper-dropdown-content-wrapper {
      top: -192px; }
    .schedule-day-time-picker ._dropdowns.__offset-5 ._time-dropdown .paper-dropdown-content-wrapper {
      top: -240px; }
    .schedule-day-time-picker ._dropdowns.__offset-6 ._time-dropdown .paper-dropdown-content-wrapper {
      top: -288px; }
  .schedule-day-time-picker.__is-commuting ._day-name {
    background-color: #03a9f4;
    color: #fff; }
  .schedule-day-time-picker.__no-day ._dropdowns {
    margin-left: 72px; }
  .schedule-day-time-picker.__disabled ._day-name {
    border-color: #222222;
    color: #222222; }
  .schedule-day-time-picker.__disabled.__is-commuting ._day-name {
    background-color: #222222; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.weekly-schedule-picker {
  width: 100%;
  /*.schedule-day-time-picker
            {
            clear:left;
            float:left;
            width: 100%; 
        }*/
  /*.editor_save-area{
            float:left;
            width:100%;
        }*/ }
  .weekly-schedule-picker li.list-group-item.paper-select-list-item.ng-scope {
    padding: 4px 8px; }
  .weekly-schedule-picker .schedule-type-section {
    border: 1px solid #03a9f4;
    border-color: #03a9f4;
    border-radius: 5px;
    text-align: center;
    font-size: 12px;
    line-height: 16px;
    display: table;
    min-height: 32px; }
    .weekly-schedule-picker .schedule-type-section .col-xs-4 {
      border-right: 1px solid #03a9f4;
      cursor: pointer;
      padding: 8px;
      display: table-cell;
      float: none; }
      .weekly-schedule-picker .schedule-type-section .col-xs-4:hover, .weekly-schedule-picker .schedule-type-section .col-xs-4.selected {
        background-color: #03a9f4;
        color: #fff; }
      .weekly-schedule-picker .schedule-type-section .col-xs-4:last-child {
        border-right: none; }
  .weekly-schedule-picker .time-headers .type-subhead-1, .weekly-schedule-picker .time-headers .paper-list-subheader .primary-text, .paper-list-subheader .weekly-schedule-picker .time-headers .primary-text, .weekly-schedule-picker .time-headers .paper-list .list-group-item .primary-text, .paper-list .list-group-item .weekly-schedule-picker .time-headers .primary-text, .weekly-schedule-picker .time-headers .accordion-group .accordion-heading .row-text, .accordion-group .accordion-heading .weekly-schedule-picker .time-headers .row-text {
    text-align: left; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
@keyframes sliderFocusThumb {
  0% {
    opacity: 0;
    transform: scale(0); }
  50% {
    transform: scale(1);
    opacity: 1; }
  100% {
    opacity: 0; } }

@media screen and (-ms-high-contrast: active) {
  .PaperSlider .PaperSlider-track {
    border-bottom: 1px solid #fff; } }

.PaperSlider {
  height: 48px;
  position: relative;
  display: block;
  margin-left: 4px;
  margin-right: 4px;
  padding: 0;
  /**
          * Track
          */
  /**
   * Slider thumb
   */
  /* The sign that's focused in discrete mode */
  /**
          * The border/background that comes in when focused in non-discrete mode
          */
  /* Don't animate left/right while panning */
  /**
            A 32px version of the PaperSlider
        */ }
  .PaperSlider .PaperSlider-wrapper {
    position: relative; }
  .PaperSlider .PaperSlider-trackContainer {
    width: 100%;
    position: absolute;
    top: 23px;
    height: 2px; }
  .PaperSlider .PaperSlider-track {
    position: absolute;
    left: 0;
    right: 0;
    height: 100%; }
  .PaperSlider .PaperSlider-trackFill {
    transition: width 0.05s linear; }
  .PaperSlider .PaperSlider-trackTicks {
    position: absolute;
    left: 0;
    right: 0;
    height: 100%; }
  .PaperSlider .PaperSlider-thumbContainer {
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate3d(-50%, -50%, 0);
    transition: left 0.1s linear; }
  .PaperSlider .PaperSlider-thumb {
    z-index: 1;
    position: absolute;
    left: -19px;
    top: 5px;
    width: 38px;
    height: 38px;
    border-radius: 38px;
    transform: scale(0.5);
    transition: all 0.1s linear; }
    .PaperSlider .PaperSlider-thumb:after {
      content: '';
      position: absolute;
      left: 3px;
      top: 3px;
      width: 32px;
      height: 32px;
      border-radius: 32px;
      border-width: 3px;
      border-style: solid; }
  .PaperSlider .PaperSlider-sign {
    /* Center the children (slider-thumb-text) */
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center;
    position: absolute;
    left: -14px;
    top: -20px;
    width: 28px;
    height: 28px;
    border-radius: 28px;
    transform: scale(0.4) translate3d(0, 70px, 0);
    transition: all 0.2s ease-in-out;
    /* The arrow pointing down under the sign */ }
    .PaperSlider .PaperSlider-sign:after {
      position: absolute;
      content: '';
      left: 0px;
      border-radius: 16px;
      top: 19px;
      border-left: 14px solid transparent;
      border-right: 14px solid transparent;
      border-top-width: 16px;
      border-top-style: solid;
      opacity: 0;
      transform: translate3d(0, -8px, 0);
      transition: all 0.2s ease-in-out; }
    .PaperSlider .PaperSlider-sign .PaperSlider-thumbText {
      z-index: 1;
      font-size: 12px;
      font-weight: bold; }
  .PaperSlider .PaperSlider-focusThumb {
    position: absolute;
    left: -24px;
    top: 0px;
    width: 48px;
    height: 48px;
    border-radius: 48px;
    display: none;
    opacity: 0;
    background-color: #C0C0C0;
    animation: sliderFocusThumb 0.4s linear; }
  .PaperSlider .PaperSlider-focusRing {
    position: absolute;
    left: -24px;
    top: 0px;
    width: 48px;
    height: 48px;
    border-radius: 48px;
    border: 2px solid #D6D6D6;
    background-color: transparent;
    transform: scale(0);
    transition: all 0.2s linear; }
  .PaperSlider .PaperSlider-disabledThumb {
    position: absolute;
    left: -22px;
    top: 2px;
    width: 44px;
    height: 44px;
    border-radius: 44px;
    transform: scale(0.35);
    border-width: 6px;
    border-style: solid;
    display: none; }
  .PaperSlider:focus {
    outline: none; }
  .PaperSlider:not([discrete]) {
    /* Hide the sign and ticks in non-discrete mode */ }
    .PaperSlider:not([discrete]) .PaperSlider-trackTicks,
    .PaperSlider:not([discrete]) .PaperSlider-sign {
      display: none; }
    .PaperSlider:not([discrete]):not([disabled]):hover .PaperSlider-thumb {
      transform: scale(0.6); }
    .PaperSlider:not([discrete]):not([disabled]):focus .PaperSlider-focusThumb, .PaperSlider:not([discrete]):not([disabled]).is-active .PaperSlider-focusThumb {
      display: block; }
    .PaperSlider:not([discrete]):not([disabled]):focus .PaperSlider-focusRing, .PaperSlider:not([discrete]):not([disabled]).is-active .PaperSlider-focusRing {
      transform: scale(1); }
    .PaperSlider:not([discrete]):not([disabled]):focus .PaperSlider-thumb, .PaperSlider:not([discrete]):not([disabled]).is-active .PaperSlider-thumb {
      transform: scale(0.85); }
  .PaperSlider[discrete] {
    /* Hide the focus thumb in discrete mode */ }
    .PaperSlider[discrete] .PaperSlider-focusThumb,
    .PaperSlider[discrete] .PaperSlider-focusRing {
      display: none; }
    .PaperSlider[discrete]:not([disabled]):focus .PaperSlider-sign,
    .PaperSlider[discrete]:not([disabled]):focus .PaperSlider-sign:after, .PaperSlider[discrete]:not([disabled]).is-active .PaperSlider-sign,
    .PaperSlider[discrete]:not([disabled]).is-active .PaperSlider-sign:after {
      opacity: 1;
      transform: translate3d(0, 0, 0) scale(1); }
  .PaperSlider[disabled] .PaperSlider-trackFill {
    display: none; }
  .PaperSlider[disabled] .PaperSlider-sign {
    display: none; }
  .PaperSlider[disabled] .PaperSlider-thumb {
    transform: scale(0.35); }
  .PaperSlider[disabled] .PaperSlider-disabledThumb {
    display: block; }
  .PaperSlider.is-dragging .PaperSlider-thumbContainer,
  .PaperSlider.is-dragging .PaperSlider-trackFill {
    transition: none; }
  .PaperSlider.is-min .PaperSlider-thumb:after {
    background-color: white; }
  .PaperSlider.is-min .PaperSlider-sign {
    opacity: 0; }
  .PaperSlider .PaperSlider-track {
    background-color: #bdbdbd;
    background-color: rgba(0, 0, 0, 0.26); }
  .PaperSlider .PaperSlider-trackTicks {
    background-color: #e0e0e0;
    background-color: rgba(0, 0, 0, 0.12); }
  .PaperSlider .PaperSlider-focusThumb {
    background-color: #757575;
    background-color: rgba(0, 0, 0, 0.54); }
  .PaperSlider .PaperSlider-focusRing {
    border-color: #e0e0e0;
    border-color: rgba(0, 0, 0, 0.12); }
  .PaperSlider .PaperSlider-disabledThumb {
    border-color: #fff; }
  .PaperSlider.is-min .PaperSlider-thumb:after {
    background-color: #fff; }
  .PaperSlider .PaperSlider-track.PaperSlider-trackFill {
    background-color: #5bc0de; }
  .PaperSlider .PaperSlider-thumb:after {
    border-color: #5bc0de;
    background-color: #5bc0de; }
  .PaperSlider .PaperSlider-sign {
    background-color: #5bc0de; }
    .PaperSlider .PaperSlider-sign:after {
      border-top-color: #5bc0de; }
  .PaperSlider .PaperSlider-thumbText {
    color: #fff; }
  .PaperSlider[disabled] .PaperSlider-thumb:after {
    border-color: #bdbdbd;
    border-color: rgba(0, 0, 0, 0.26); }
  .PaperSlider[disabled]:not(.PaperSlider-min) .PaperSlider-thumb:after {
    background-color: #bdbdbd;
    background-color: rgba(0, 0, 0, 0.26); }
  .PaperSlider.PaperSlider-warn .PaperSlider-track.PaperSlider-trackFill {
    background-color: #d9534f; }
  .PaperSlider.PaperSlider-warn .PaperSlider-thumb:after {
    border-color: #d9534f;
    background-color: #d9534f; }
  .PaperSlider.PaperSlider-warn .PaperSlider-sign {
    background-color: #d9534f; }
    .PaperSlider.PaperSlider-warn .PaperSlider-sign:after {
      border-top-color: #d9534f; }
  .PaperSlider.PaperSlider-warn .PaperSlider-thumbText {
    color: #fff; }
  .PaperSlider.PaperSlider--brandPrimary .PaperSlider-track.PaperSlider-trackFill {
    background-color: #03a9f4; }
  .PaperSlider.PaperSlider--brandPrimary .PaperSlider-thumb:after {
    border-color: #03a9f4;
    background-color: #03a9f4; }
  .PaperSlider.PaperSlider--brandPrimary .PaperSlider-sign {
    background-color: #03a9f4; }
    .PaperSlider.PaperSlider--brandPrimary .PaperSlider-sign:after {
      border-top-color: #03a9f4; }
  .PaperSlider.PaperSlider--brandPrimary .PaperSlider-thumbText {
    color: #ffffff; }
  .PaperSlider.PaperSlider--initialLocation .PaperSlider-track.PaperSlider-trackFill {
    background-color: #0fb62b; }
  .PaperSlider.PaperSlider--initialLocation .PaperSlider-thumb:after {
    border-color: #0fb62b;
    background-color: #0fb62b; }
  .PaperSlider.PaperSlider--initialLocation .PaperSlider-sign {
    background-color: #0fb62b; }
    .PaperSlider.PaperSlider--initialLocation .PaperSlider-sign:after {
      border-top-color: #0fb62b; }
  .PaperSlider.PaperSlider--initialLocation .PaperSlider-thumbText {
    color: #fff; }
  .PaperSlider.PaperSlider--endLocation .PaperSlider-track.PaperSlider-trackFill {
    background-color: #e73d38; }
  .PaperSlider.PaperSlider--endLocation .PaperSlider-thumb:after {
    border-color: #e73d38;
    background-color: #e73d38; }
  .PaperSlider.PaperSlider--endLocation .PaperSlider-sign {
    background-color: #e73d38; }
    .PaperSlider.PaperSlider--endLocation .PaperSlider-sign:after {
      border-top-color: #e73d38; }
  .PaperSlider.PaperSlider--endLocation .PaperSlider-thumbText {
    color: #fff; }
  .PaperSlider.PaperSlider--thin {
    height: 32px;
    /**
              * The border/background that comes in when focused in non-discrete mode
              */ }
    .PaperSlider.PaperSlider--thin .PaperSlider-trackContainer {
      top: 15px; }
    .PaperSlider.PaperSlider--thin .PaperSlider-thumb {
      position: absolute;
      left: -19px;
      top: -3px;
      width: 38px;
      height: 38px;
      border-radius: 38px; }
    .PaperSlider.PaperSlider--thin .PaperSlider-focusThumb {
      position: absolute;
      left: -24px;
      top: -8px;
      width: 48px;
      height: 48px;
      border-radius: 48px; }
    .PaperSlider.PaperSlider--thin .PaperSlider-focusThumb {
      position: absolute;
      left: -24px;
      top: -8px;
      width: 48px;
      height: 48px;
      border-radius: 48px; }
    .PaperSlider.PaperSlider--thin .PaperSlider-focusRing {
      position: absolute;
      left: -21px;
      top: -5px;
      width: 42px;
      height: 42px;
      border-radius: 42px; }
    .PaperSlider.PaperSlider--thin .PaperSlider-disabledThumb {
      position: absolute;
      left: -22px;
      top: -6px;
      width: 44px;
      height: 44px;
      border-radius: 44px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.paper-comment-box {
  clear: both;
  position: relative;
  max-height: 52px; }
  .paper-comment-box .closed-content {
    padding: 8px 16px;
    border-top: 1px solid #f6f6f6;
    border-bottom: 1px solid #f6f6f6; }
    .paper-comment-box .closed-content:hover {
      background: #f1f1f1;
      cursor: pointer; }
    .paper-comment-box .closed-content .icon {
      font-size: 16px;
      float: left;
      width: 28px;
      padding: 6px;
      margin-right: 10px; }
      .paper-comment-box .closed-content .icon.green-icon {
        color: #0FB72B; }
    .paper-comment-box .closed-content .comments-text {
      line-height: 25px; }
    .paper-comment-box .closed-content .text {
      line-height: 12px;
      font-size: 12px;
      color: #bbbbbb; }
    .paper-comment-box .closed-content .comments {
      height: 24px;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis; }
  .paper-comment-box textarea.text-field {
    margin-top: 8px;
    border: 1px solid #efefef;
    padding: 8px;
    width: 100%;
    transition: none; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.modal-dialog.modal-sm {
  max-width: 500px;
  overflow: hidden; }

.rs-timepicker {
  padding: 4px 8px;
  margin-bottom: 4px;
  min-height: 16px;
  width: 100%;
  cursor: pointer;
  border-bottom: 1px solid #ddd; }
  .rs-timepicker .title {
    font-size: 12px;
    color: #999; }
  .rs-timepicker:hover {
    background: #f1f1f1; }

.rs-timepicker-inline {
  box-sizing: border-box;
  transition: transform 0.1s ease-out, box-shadow 0.18s cubic-bezier(0.4, 0, 0.2, 1);
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); }
  .rs-timepicker-inline .timepicker-header {
    padding: 8px;
    background-color: #03a9f4;
    color: #fff;
    text-align: center; }
    .rs-timepicker-inline .timepicker-header .close-btn {
      height: 32px;
      width: 32px;
      padding: 8px;
      font-size: 16px;
      cursor: pointer;
      border-radius: 50%;
      position: absolute;
      right: 8px;
      top: 8px;
      display: -ms-flexbox;
      display: flex; }
      .rs-timepicker-inline .timepicker-header .close-btn:hover {
        background: rgba(255, 255, 255, 0.2); }
  .rs-timepicker-inline .timepicker-body {
    padding: 16px; }
  .rs-timepicker-inline .slider-label {
    color: #999;
    font-weight: bold;
    font-size: 14px; }
  .rs-timepicker-inline .PaperSlider {
    margin-bottom: 8px; }
  .rs-timepicker-inline .AmPmSwitch {
    cursor: pointer;
    padding-top: 8px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center;
    -ms-flex-pack: center;
        justify-content: center; }
    .rs-timepicker-inline .AmPmSwitch md-switch {
      margin-left: 8px; }
    .rs-timepicker-inline .AmPmSwitch .selectionText, .rs-timepicker-inline .AmPmSwitch [md-switch], .rs-timepicker-inline .AmPmSwitch .md-switch {
      float: left;
      margin: 0 4px; }
    .rs-timepicker-inline .AmPmSwitch [md-switch] .md-container,
    .rs-timepicker-inline .AmPmSwitch .md-switch .md-container {
      margin-left: 8px; }
    .rs-timepicker-inline .AmPmSwitch .selectionText {
      color: #aaa;
      font-weight: bold; }
      .rs-timepicker-inline .AmPmSwitch .selectionText.selected {
        color: #03a9f4; }
  .rs-timepicker-inline--btn {
    margin-left: auto; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.desktop-nav-bar {
  height: 48px;
  line-height: 48px;
  vertical-align: middle;
  /*border-bottom-style : Solid;
        border-bottom-color : #DDDDDD;
        border-bottom-width : 1px;*/
  font-size: 16px;
  position: relative;
  transition: .1s all ease;
  box-shadow: 1px 2px 7px 0 #bdbdbd;
  z-index: 10;
  /*.drop-down{
            width:200px;
            font-size:14px;
            color:#464646;
            .item{
                padding:0 16px;
                line-height:32px;
                &.last-item{
                    border-top:1px solid #ececec;
                    color:$brand-primary;
                    text-align:center;              
                }
            }
            
        }*/ }
  .desktop-nav-bar .nav-icon {
    padding: 16px;
    line-height: 16px; }
  .desktop-nav-bar.title-white {
    color: #fff; }
    .desktop-nav-bar.title-white .title-text {
      padding: 16px 16px 13px 16px;
      font-size: 12px;
      cursor: pointer;
      opacity: 0.7; }
      .desktop-nav-bar.title-white .title-text.active {
        opacity: 1;
        border-bottom: 3px solid rgba(0, 0, 0, 0.3); }
      .desktop-nav-bar.title-white .title-text:hover {
        background-color: rgba(200, 200, 200, 0.25); }

.contests-detail {
  height: auto;
  max-height: 500px;
  width: 704px; }
  .contests-detail .new-user-img img {
    position: absolute;
    bottom: 70px;
    left: 0; }
  .contests-detail .new-user-img .text-container {
    position: absolute;
    bottom: 58px;
    left: 30px;
    padding-left: 4px;
    font-size: 12px;
    border-top: 18px solid yellow;
    border-right: 10px solid transparent; }
    .contests-detail .new-user-img .text-container .text {
      top: -18px;
      position: relative; }
  .contests-detail .enrolled-text {
    color: #0FB62B;
    font-size: 12px;
    margin-top: 6px; }
  .contests-detail .img-container {
    width: 160px;
    height: 160px; }
    .contests-detail .img-container img {
      height: 100%;
      max-width: 100%; }
  .contests-detail .body-container {
    padding: 16px 0; }
  .contests-detail .contests-body {
    max-height: 320px;
    padding: 16px; }
    .contests-detail .contests-body .contests-points {
      text-align: center;
      padding-left: 16px; }
      .contests-detail .contests-body .contests-points .valid-points {
        color: #389AD3;
        font-size: 32px;
        line-height: 36px; }
        .contests-detail .contests-body .contests-points .valid-points.grey {
          color: #838383; }
      .contests-detail .contests-body .contests-points .required-points {
        line-height: 16px;
        margin-top: 12px; }
      .contests-detail .contests-body .contests-points.details-points {
        text-align: left;
        padding: 16px; }
    .contests-detail .contests-body .detail-text {
      margin: 0 16px; }
    .contests-detail .contests-body .date-text {
      font-size: 14px;
      color: #F18034; }
    .contests-detail .contests-body .line-divider-row {
      height: 16px;
      width: calc(100% + 32px);
      margin-left: -16px;
      margin-right: -16px; }
  .contests-detail .content-border {
    border-right-style: solid;
    border-right-color: #dfdfdf;
    border-right-width: 1px; }
  .contests-detail .enter-button {
    margin: auto;
    bottom: -20px; }
  .contests-detail .detail-bottom {
    height: 68px;
    padding: 16px;
    border-top: solid 1px #bcbcbc; }
    .contests-detail .detail-bottom .detail-bottom-entryWidget {
      float: right;
      display: inline-block; }
    .contests-detail .detail-bottom .wish-icon {
      font-size: 20px;
      color: #bcbcbc;
      padding: 12px;
      position: relative;
      top: 4px; }
      .contests-detail .detail-bottom .wish-icon.active {
        color: #E70A9D; }
    .contests-detail .detail-bottom .number-select {
      text-align: center;
      width: 100px; }
    .contests-detail .detail-bottom .trapezoid {
      width: 148px;
      height: 0;
      right: 0;
      bottom: 16px;
      border-bottom: 40px solid #0FB62B;
      border-left: 12px solid transparent;
      display: block;
      position: absolute; }
      .contests-detail .detail-bottom .trapezoid .text {
        color: white;
        font-size: 12px;
        height: 40px; }
        .contests-detail .detail-bottom .trapezoid .text .inner {
          position: relative;
          top: 50%;
          transform: translateY(-50%);
          text-align: center; }
      .contests-detail .detail-bottom .trapezoid.inProgress {
        border-bottom-color: #D3CE1C; }
    .contests-detail .detail-bottom .status-container {
      position: absolute;
      right: 0;
      bottom: -32px; }
      .contests-detail .detail-bottom .status-container img {
        position: relative;
        width: 148px;
        right: 0; }
      .contests-detail .detail-bottom .status-container .enrolled-text {
        color: white;
        font-size: 12px;
        height: 40px;
        position: relative;
        top: -46px;
        text-align: center; }
        .contests-detail .detail-bottom .status-container .enrolled-text .inner {
          position: relative;
          top: 50%;
          transform: translateY(-50%); }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.incentives-instructions-panel {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: #fff;
  z-index: 20; }

.incentives-header {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 96px; }

.desktop-contests {
  font-family: 'Roboto';
  position: absolute;
  width: 784px;
  top: 0;
  z-index: 5;
  background-color: #eeeeee;
  color: #464646;
  height: 100%;
  transition: .1s all linear;
  padding-top: 96px; }
  .desktop-contests .help-section {
    position: absolute;
    right: -204px;
    top: 0px;
    max-height: 192px; }
    .desktop-contests .help-section .content-container {
      background-color: white;
      position: relative;
      height: 144px;
      transition: .2s ease all;
      box-shadow: 1px 2px 7px 0 #bdbdbd; }
      .desktop-contests .help-section .content-container .content {
        padding: 8px;
        height: 100px;
        overflow: hidden; }
      .desktop-contests .help-section .content-container.content-hide {
        height: 0; }
        .desktop-contests .help-section .content-container.content-hide .content, .desktop-contests .help-section .content-container.content-hide .row {
          display: none; }
  .desktop-contests.contests-grid-view {
    width: 658px; }
  .desktop-contests .title-bar {
    position: relative;
    width: 100%;
    height: 48px;
    line-height: 48px;
    vertical-align: middle;
    background-color: #F18034;
    color: #ffffff;
    font-size: 14px;
    font-weight: 500;
    top: 24px;
    z-index: 6; }
    .desktop-contests .title-bar.wishlist {
      background-color: #E70A9D; }
    .desktop-contests .title-bar.eligibility {
      background-color: #8446A7; }
    .desktop-contests .title-bar.contests-entered {
      background-color: #0FB62B; }
    .desktop-contests .title-bar.contests {
      background-color: #F18034; }
    .desktop-contests .title-bar.purchases {
      background-color: #00A89C; }
    .desktop-contests .title-bar.milestones {
      background-color: #D6B21A; }
    .desktop-contests .title-bar.losepointscontests {
      background-color: #F18023; }
    .desktop-contests .title-bar .text-1 {
      position: absolute;
      left: 192px; }
    .desktop-contests .title-bar .text-2 {
      position: absolute;
      line-height: 16px;
      left: 414px;
      margin-top: 6px;
      width: 80px; }
    .desktop-contests .title-bar .text-3 {
      position: absolute;
      line-height: 16px;
      left: 528px;
      margin-top: 6px;
      width: 50px; }
    .desktop-contests .title-bar .text-4 {
      position: absolute;
      right: 32px; }
  .desktop-contests .contests-list {
    overflow: scroll;
    overflow-x: hidden;
    background-color: white;
    position: relative;
    z-index: 7;
    box-shadow: 1px 2px 7px 0 #bdbdbd;
    transition: 0.2s ease all;
    max-height: 100%; }
    .desktop-contests .contests-list.contests-list--underCollapsedMenu {
      max-height: 100%; }
    .desktop-contests .contests-list.help-section {
      top: 16px;
      padding: 16px; }
    .desktop-contests .contests-list .won-list {
      width: 100%;
      line-height: 48px;
      vertical-align: middle;
      border-bottom-style: solid;
      border-bottom-width: 1px;
      border-bottom-color: #dfdfdf;
      padding: 0 16px;
      float: left;
      clear: left; }
      .desktop-contests .contests-list .won-list .title-text {
        font-size: 16px; }
  .desktop-contests .small-text {
    font-size: 12px;
    font-weight: 300;
    color: #858585; }
  .desktop-contests .contests-gridview {
    max-height: 528px;
    overflow: scroll;
    overflow-x: hidden;
    background-color: white;
    position: relative;
    top: 32px;
    box-shadow: 1px 2px 7px 0 #bdbdbd; }

.enter-contest {
  height: auto;
  width: 704px;
  color: #898989; }
  .enter-contest .page-top {
    height: 128px;
    line-height: 128px;
    background-color: #F48234;
    color: #fff;
    font-size: 40px;
    text-align: center;
    vertical-align: middle;
    background-image: url("/Images/SPA/contest_AfterEntry.png");
    background-repeat: no-repeat;
    position: relative;
    z-index: 2; }
    .enter-contest .page-top.milestone {
      background-color: #D6B21A;
      background-image: url("/Images/SPA/Milestone_AfterEntry.png"); }
    .enter-contest .page-top.purchased {
      background-color: #00A89C;
      background-image: url("/Images/SPA/Purchase_AfterEntry.png"); }
  .enter-contest .page-middle {
    height: 128px;
    padding: 16px;
    position: relative;
    z-index: 1;
    top: 0px;
    transition: top .3s ease; }
    .enter-contest .page-middle .enter-contests-title {
      text-align: center;
      transition: all .3s ease; }
      .enter-contest .page-middle .enter-contests-title .large-text {
        font-size: 24px;
        color: #F48234; }
        .enter-contest .page-middle .enter-contests-title .large-text.milestones-large-text {
          color: #D6B21A; }
        .enter-contest .page-middle .enter-contests-title .large-text.purchased-large-text {
          color: #00A89C; }
      .enter-contest .page-middle .enter-contests-title div.small-text {
        font-size: 20px;
        margin: 16px;
        position: relative; }
        .enter-contest .page-middle .enter-contests-title div.small-text:after {
          content: '';
          width: 160px;
          height: 2px;
          position: absolute;
          bottom: -20px;
          left: 240px;
          background: #ddd; }
    .enter-contest .page-middle .about-point {
      height: auto; }
    .enter-contest .page-middle.slide-page {
      top: -112px; }
    .enter-contest .page-middle .ok-button {
      background-color: #F48234;
      padding: 0 32px;
      margin: 16px auto; }
      .enter-contest .page-middle .ok-button.milestones-button {
        background-color: #D6B21A; }
      .enter-contest .page-middle .ok-button.purchased-button {
        background-color: #00A89C; }

.filters-bar {
  width: 100%;
  position: relative;
  background-color: white; }
  .filters-bar span.filters-icon {
    position: relative; }
    .filters-bar span.filters-icon.icon-one {
      color: #F18034; }
      .filters-bar span.filters-icon.icon-one.purchases-icon {
        color: #00A89C; }
      .filters-bar span.filters-icon.icon-one.milestones-icon {
        color: #D6B21A; }
      .filters-bar span.filters-icon.icon-one.losepointscontests-icon {
        color: #F18023; }
    .filters-bar span.filters-icon.icon-two {
      color: #E70A9D; }
    .filters-bar span.filters-icon.icon-three {
      color: #8446A7; }
    .filters-bar span.filters-icon.icon-four {
      color: #0FB62B; }
    .filters-bar span.filters-icon.icon-five {
      color: #D3CE1C; }
  .filters-bar span.active:before {
    position: absolute;
    content: "";
    border-bottom-style: solid;
    width: 48px;
    height: 51px;
    background-color: transparent;
    border-bottom: 3px solid;
    top: 0;
    left: 2px; }
  .filters-bar .mailing-info {
    z-index: 20;
    position: absolute;
    top: 0;
    right: 0;
    width: 320px;
    height: auto;
    transform-origin: right top;
    transform: scale(0);
    display: block;
    transition: .2s all ease-in-out;
    opacity: 0; }
    .filters-bar .mailing-info.open {
      transform: scale(1);
      opacity: 1; }
    .filters-bar .mailing-info .paper-card-heading {
      height: 48px;
      background-color: #ececec; }
      .filters-bar .mailing-info .paper-card-heading .close-icon {
        font-size: 16px;
        padding: 16px;
        width: 48px;
        height: 48px; }
      .filters-bar .mailing-info .paper-card-heading .type-title {
        position: relative;
        top: 8px;
        padding-left: 16px; }

.purchases-detail {
  height: 346px;
  width: 470px; }
  .purchases-detail .page-top {
    height: 192px;
    background-color: #00A89C;
    color: #fff;
    padding: 16px; }
    .purchases-detail .page-top .points {
      text-align: center;
      color: #fff; }
  .purchases-detail .page-middle {
    height: 84px;
    text-align: center;
    padding: 16px; }
  .purchases-detail .page-bottom {
    padding: 16px; }

.losepointscontests-detail {
  height: 346px;
  width: 470px; }
  .losepointscontests-detail .page-top {
    height: 192px;
    background-color: #F18023;
    color: #fff;
    padding: 16px; }
    .losepointscontests-detail .page-top .points {
      text-align: center;
      color: #fff; }
  .losepointscontests-detail .page-middle {
    height: 84px;
    text-align: center;
    padding: 16px; }
  .losepointscontests-detail .page-bottom {
    padding: 16px; }

.popover-item {
  width: 368px;
  height: auto;
  font-size: 12px; }
  .popover-item .img-container {
    width: 160px;
    height: 160px;
    text-align: center;
    vertical-align: middle; }
    .popover-item .img-container img {
      height: 160px;
      max-width: 100%; }
  .popover-item .title {
    position: absolute;
    top: 9px;
    width: 200px;
    height: 160px;
    left: 182px; }
    .popover-item .title .contests-title {
      height: 48px;
      overflow: hidden;
      font-size: 14px;
      color: #464646;
      font-weight: 500; }
  .popover-item .period {
    color: #0FB72B; }
  .popover-item .deadline {
    color: #F18034; }
  .popover-item .points-1 {
    color: #389FD8;
    font-size: 16px; }
  .popover-item .points-2 {
    font-size: 16px; }

.help-popup .close-button {
  padding: 16px; }

.help-popup .content-container {
  height: 552px;
  overflow: auto;
  padding: 8px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        This class is used for the IncentiveSummaryDisplay. It can be configured to display the data for list view (default) 
        or in the grid configuration popup.

        HTML Structure:

        --List View
        IncentiveSummaryDisplay
            -title
                -enteredIcon
                -titleText
            -detailContainer
                -timeDetailContainer
                    -subtitle
                    -qualifyingPeriod
                        -qualifyingPeriodTextLabel
                        -qualifyingPeriodTimeText
                -pointsDetailContainer
                    -pointDetail
                        -pointDetailNumber --highlighted
                        -pointDetailText
                    -pointDetail
                        -pointDetailNumber
                        -pointDetailText
                    -deadlineText
                        -pointDetailText
                        -pointDetailText --deadline

    

    */
.IncentiveSummaryDisplay {
  width: 100%;
  /**
            The title section spreads across the width of the entire component
        */
  /**
            The text for the title (eventually this should be replaced with 
            a standardized style, following the RideShark Design Guidelines)
        */
  /**
            This container breaks the rest of the content up into two columns
        */
  /**
            The subtitle should be top left inside the detailContainer
        */
  /**
            Qualifying period should be bottom left inside the detailContainer
        */
  /**
            The points Detail container takes up the right column of detailContainer.
                The elements inside it are vertically stacked.
        */
  /*
        &.IncentiveSummaryDisplay-pointDetail--deadline{
            color: #F44336 !important;

             .IncentiveSummaryDisplay-pointDetailText{
                 color: #F44336 !important;
            }
        }*/ }
  .IncentiveSummaryDisplay-title {
    width: 100%; }
  .IncentiveSummaryDisplay-enteredIcon {
    display: inline;
    padding: 4px;
    color: #0FB62B;
    font-size: 16px; }
  .IncentiveSummaryDisplay-titleText {
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 16px;
    font-weight: 500;
    display: inline; }
  .IncentiveSummaryDisplay-detailContainer {
    width: 100%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap; }
  .IncentiveSummaryDisplay-timeDetailContainer {
    -ms-flex-item-align: start;
        align-self: flex-start;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex: 1 0 48%;
        flex: 1 0 48%; }
  .IncentiveSummaryDisplay-subtitle {
    width: 100%;
    -ms-flex-item-align: start;
        align-self: flex-start;
    margin-bottom: 16px;
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 12px;
    font-weight: 300; }
  .IncentiveSummaryDisplay-qualifyingPeriod {
    -ms-flex-item-align: start;
        align-self: flex-start;
    margin-top: auto;
    width: 100%;
    padding-right: 8px; }
  .IncentiveSummaryDisplay-qualifyingPeriodTextLabel {
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 12px;
    font-weight: 300;
    color: #858585;
    color: #0FB72B; }
  .IncentiveSummaryDisplay-qualifyingPeriodTimeText {
    font-size: 12px;
    font-weight: 300;
    color: #0FB72B; }
  .IncentiveSummaryDisplay-pointsDetailContainer {
    -ms-flex-item-align: start;
        align-self: flex-start;
    -ms-flex: 1 0 25%;
        flex: 1 0 25%;
    border-right: 1px solid #dfdfdf;
    border-left: 1px solid #dfdfdf;
    padding-left: 16px; }
  .IncentiveSummaryDisplay-pointDetail {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
        align-items: center; }
    .IncentiveSummaryDisplay-pointDetail.IncentiveSummaryDisplay-pointDetail--deadline {
      color: #F44336;
      padding-top: 6px; }
      .IncentiveSummaryDisplay-pointDetail.IncentiveSummaryDisplay-pointDetail--deadline .IncentiveSummaryDisplay-pointDetailText {
        color: #F44336; }
    .IncentiveSummaryDisplay-pointDetail.IncentiveSummaryDisplay-pointDetail--deadline > span:first-child {
      width: 35%;
      padding-right: 10px; }
  .IncentiveSummaryDisplay-pointDetailNumber {
    font-size: 16px;
    color: rgba(0, 0, 0, 0.54);
    width: 35%;
    text-align: right;
    padding-right: 10px; }
    .IncentiveSummaryDisplay-pointDetailNumber.IncentiveSummaryDisplay-pointDetailNumber--highlighted {
      font-size: 16px;
      color: rgba(0, 0, 0, 0.54); }
  .IncentiveSummaryDisplay-pointDetailText {
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 12px;
    font-weight: 300;
    color: #858585; }
    .IncentiveSummaryDisplay-pointDetailText.IncentiveSummaryDisplay-pointDetailText--deadline {
      color: #F44336 !important;
      font-size: 12px;
      font-weight: normal; }
  .IncentiveSummaryDisplay.IncentiveSummaryDisplay--singleColumn {
    padding-left: 8px;
    padding-right: 8px; }
    .IncentiveSummaryDisplay.IncentiveSummaryDisplay--singleColumn .IncentiveSummaryDisplay-timeDetailContainer {
      display: block;
      -ms-flex: 1 0 100%;
          flex: 1 0 100%; }
    .IncentiveSummaryDisplay.IncentiveSummaryDisplay--singleColumn .IncentiveSummaryDisplay-pointsDetailContainer {
      display: block;
      -ms-flex: 1 0 100%;
          flex: 1 0 100%;
      border: none; }
    .IncentiveSummaryDisplay.IncentiveSummaryDisplay--singleColumn .IncentiveSummaryDisplay-subtitle {
      margin-bottom: 8px; }
    .IncentiveSummaryDisplay.IncentiveSummaryDisplay--singleColumn .IncentiveSummaryDisplay-qualifyingPeriodTextLabel {
      display: block;
      line-height: 20px;
      font-size: 12px;
      color: #0FB72B; }
    .IncentiveSummaryDisplay.IncentiveSummaryDisplay--singleColumn .IncentiveSummaryDisplay-qualifyingPeriodTimeText {
      display: block;
      line-height: 20px;
      font-size: 13px; }
    .IncentiveSummaryDisplay.IncentiveSummaryDisplay--singleColumn .IncentiveSummaryDisplay-pointDetailText {
      display: block;
      line-height: 20px;
      font-size: 12px;
      margin-left: -16px; }
      .IncentiveSummaryDisplay.IncentiveSummaryDisplay--singleColumn .IncentiveSummaryDisplay-pointDetailText.IncentiveSummaryDisplay-pointDetailText--deadline {
        font-size: 13px;
        font-weight: 400;
        color: #f44336; }
  .IncentiveSummaryDisplay.IncentiveSummaryDisplay--hidePointsDisplay .IncentiveSummaryDisplay-pointDetail {
    display: none; }
    .IncentiveSummaryDisplay.IncentiveSummaryDisplay--hidePointsDisplay .IncentiveSummaryDisplay-pointDetail.IncentiveSummaryDisplay-pointDetail--deadline {
      display: block;
      color: #f44336; }
  .IncentiveSummaryDisplay.IncentiveSummaryDisplay--plainText .IncentiveSummaryDisplay-titleText {
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 16px;
    font-weight: 400;
    color: #020202;
    line-height: 28px; }
  .IncentiveSummaryDisplay.IncentiveSummaryDisplay--plainText .IncentiveSummaryDisplay-subtitle {
    font-family: 'Roboto', Arial, sans-serif;
    font-size: 12px;
    font-weight: 400;
    color: #898989;
    line-height: 20px; }
  .IncentiveSummaryDisplay.IncentiveSummaryDisplay--plainText .IncentiveSummaryDisplay-qualifyingPeriodTimeText {
    color: #0FB72B;
    font-weight: 400; }
  .IncentiveSummaryDisplay.IncentiveSummaryDisplay--plainText .IncentiveSummaryDisplay-pointDetailText {
    display: block;
    line-height: 20px;
    font-size: 12px; }
    .IncentiveSummaryDisplay.IncentiveSummaryDisplay--plainText .IncentiveSummaryDisplay-pointDetailText.IncentiveSummaryDisplay-pointDetailText--deadline {
      color: #F44336; }

.no-flexbox .IncentiveSummaryDisplay {
  /**
            The title section spreads across the width of the entire component
        */
  /**
            The text for the title (eventually this should be replaced with 
            a standardized style, following the RideShark Design Guidelines)
        */
  /**
            This container breaks the rest of the content up into two columns
        */
  /**
            The subtitle should be top left inside the detailContainer
        */
  /**
            Qualifying period should be bottom left inside the detailContainer
        */
  /**
            The points Detail container takes up the right column of detailContainer.
                The elements inside it are vertically stacked.
        */
  /***********************************
            The 
         ***********************************/ }
  .no-flexbox .IncentiveSummaryDisplay-detailContainer {
    display: block; }
  .no-flexbox .IncentiveSummaryDisplay-timeDetailContainer {
    float: left;
    display: block;
    max-width: 58%; }
  .no-flexbox .IncentiveSummaryDisplay-pointsDetailContainer {
    float: right;
    max-width: 41%; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        This class is used for the IncentiveItem in list view. A different class is used for each item in grid-view.

        HTML Structure:

        IncentiveEntryWidget
            -remaningText
            -userHistoryContainer
            -enterBtn
            -progressBarHolder
                progressbar
            -enrolledMessageContainer
                -enrolledMessageImgContainer
                    -enrolledMessageImg
                -enrolledMessageText

    */
.IncentiveEntryWidget {
  /******************
            The text which says how many of the item are still available
         ****************/
  /******************
            '3 entries made' etc.
         ****************/
  /******************
            The "Enter Contest" etc. button
         ****************/
  /******************
            For milestones which haven't been entered yet, this shows instead of the -enterBtn
         ****************/
  /******************
            The message shown to users when they have already enrolled. Shows in place of the enter button
         ****************/
  /******************
            Wraps the image which forms the background of the 'already entered' text
         ****************/
  /******************
            The image (a ribbon, green trapezoid, etc)
         ****************/
  /******************
            Is overlaid over top of -enrolledMessageImgContainer
         ****************/
  /**
            The buttonOnly mode is used to only display the button / progress bar / enrolled message. 
            The text about previous entries or inventory is not displayed.
        */ }
  .IncentiveEntryWidget-remaningText {
    min-height: 22px;
    margin-bottom: 4px;
    color: red;
    text-align: center; }
  .IncentiveEntryWidget-userHistoryContainer {
    font-weight: 500;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.38);
    text-align: center;
    margin-bottom: 4px; }
  .IncentiveEntryWidget-enterBtn {
    width: 136px !important;
    height: 40px !important;
    margin: 0 auto 8px;
    z-index: 101;
    line-height: normal !important;
    white-space: normal !important; }
    .IncentiveEntryWidget-enterBtn.is-ineligible {
      color: #464646 !important; }
  .IncentiveEntryWidget-enrolledMessageContainer {
    position: relative; }
  .IncentiveEntryWidget-enrolledMessageImgContainer {
    position: relative;
    width: 152px;
    height: 40px;
    text-align: center; }
  .IncentiveEntryWidget-enrolledMessageImg {
    position: absolute;
    width: 100%;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 0; }
  .IncentiveEntryWidget-enrolledMessageText {
    position: absolute;
    top: 0;
    width: 100%;
    margin: 0 auto;
    color: #fff;
    line-height: 40px;
    z-index: 1;
    text-align: center; }
  .IncentiveEntryWidget--buttonOnly .IncentiveEntryWidget {
    /******************
                    The text which says how many of the item are still available
                 ****************/ }
    .IncentiveEntryWidget--buttonOnly .IncentiveEntryWidget-remaningText, .IncentiveEntryWidget--buttonOnly .IncentiveEntryWidget-userHistoryContainer {
      display: none; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
        This is just a list of icons. Different sized icons should be done in conjunction with the 
        IncetnivePointsLegendComponent.ts code, and a modifer (eg. IncentivePointsLegend--sizeModifierHere)

        HTML Structure:

        IncentivePointsLegend
            -icon

    */
.IncentivePointsLegend {
  /**
            There will be many of these, all in a list. Each one has the tooltip attribute
        */ }

/**
        This class is used for the IncentiveItem in list view. A different class is used for each item in grid-view.

        HTML Structure:

        IncentiveListItem
                                    -newUsersImgContainer (positioned absolutely)
                                        -newUsersImg
                                        -newUsersText
            -mainImgContainer
                -mainImg
            -mainInfoContainer
                -summaryRow
                    -summaryDisplay                 IncentiveSummaryDisplay
                    -entryWidget                    IncentiveEntryWidget
                -iconsRow
                    -iconsRowModesColumn            
                        -commuteCalendarIcons       IncentivePointsLegend
                        -userActionIcons            IncentivePointsLegend
                    -iconsRowActionsColumn
                        -iconActionButton
                        -iconActionButton --wishlist
                -iconsRow _restrictions-row *only if restrictions are added
                    -iconsRowModesColumn            
                        -additionalRequirementIcons       IncentivePointsLegend
        
        IncentiveListItem--gridView
            -gridItemContent
                                    -newUsersImgContainer (positioned absolutely)
                                        -newUsersImg
                                        -newUsersText
                -mainImgContainer
                    -mainImg
                -mainInfoContainer
                    -userActionsBar
                        -iconActionButton
                        -iconActionButton --wishlist


    */
.IncentiveListItem {
  position: relative;
  display: -ms-flexbox;
  display: flex;
  padding: 16px;
  /***************************     
                New Users Image   
         ***************************/
  /***************************     
                Main Image   
         ***************************/
  /**
            The container for the main image for the incentive.
        */
  /**
            The img element that is inside mainImageContainer. This is the main image for the incentive
        */
  /***************************     
                Layout for Incentive
         ***************************/
  /**
            The rest of the incentive which is not the image
        */
  /**
            The summary row, which holds the Summary Display and Entry Widget
        */
  /**
            The row which contains the 'how to earn points' legend, and the share / wishlist icons.
        */
  /***************************     
                Summary Row Contents
         ***************************/
  /***************************     
                Icon Row Contents
         ***************************/
  /***************************     
                Modes Column Contents
         ***************************/
  /***************************     
                Share and Wishlist row contents
         ***************************/ }
  .IncentiveListItem:hover {
    background-color: #ececec; }
  .IncentiveListItem-newUsersImgContainer {
    position: absolute;
    top: 0px;
    left: 8px; }
  .IncentiveListItem-newUsersImg {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 4; }
  .IncentiveListItem-newUsersText {
    position: relative;
    color: #000;
    z-index: 1;
    display: block;
    min-width: 116px;
    top: 8px;
    left: 36px;
    padding-right: 4px; }
    .IncentiveListItem-newUsersText::before {
      content: " ";
      border-top: 18px solid #ff0;
      border-right: 10px solid transparent;
      width: 100%;
      position: absolute;
      left: -8px;
      z-index: -1; }
  .IncentiveListItem-mainImgContainer {
    min-width: 128px;
    height: 128px;
    display: flex;
    display: -ms-flexbox;
    display: -webkit-box;
    display: -moz-box;
    /*Center horizontally*/
    justify-content: center;
    -ms-flex-pack: center;
    /*Center vertically*/
    align-items: center;
    -ms-flex-align: center; }
  .IncentiveListItem-mainImg {
    max-height: 100%;
    max-width: 128px; }
  .IncentiveListItem-mainInfoContainer {
    margin-left: 16px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -ms-flex-positive: 1;
        flex-grow: 1; }
  .IncentiveListItem-summaryRow {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: stretch;
        align-items: stretch;
    -ms-flex: 1 0 100%;
        flex: 1 0 100%; }
  .IncentiveListItem-iconsRow {
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 1 0 100%;
        flex: 1 0 100%;
    -ms-flex-align: center;
        align-items: center; }
    .IncentiveListItem-iconsRow.alt--restrictions-row {
      margin-top: 4px; }
  .IncentiveListItem-summaryDisplay {
    max-width: 76%;
    margin-right: auto; }
  .IncentiveListItem-entryWidget {
    max-width: 23%;
    min-width: 150px;
    margin-left: auto;
    padding-left: 16px; }
  .IncentiveListItem-earnPointsText {
    display: -ms-flexbox;
    display: flex;
    -ms-flex: 1 0 10%;
        flex: 1 0 10%;
    color: rgba(0, 0, 0, 0.38); }
  .IncentiveListItem-iconsRowModesColumn {
    margin-right: auto;
    -ms-flex: 1 0 50%;
        flex: 1 0 50%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap; }
  .IncentiveListItem-iconsRowActionsColumn {
    margin-left: auto;
    -ms-flex: 1 0 18%;
        flex: 1 0 18%; }
  .IncentiveListItem-commuteCalendarIcons {
    margin-right: auto; }
  .IncentiveListItem-additionalRequirementIcons {
    margin-right: auto; }
  .IncentiveListItem-iconActionButton {
    font-size: 16px;
    color: #898989;
    padding-left: 8px;
    display: inline-block;
    margin-left: 16px;
    cursor: pointer; }
    .IncentiveListItem-iconActionButton.IncentiveListItem-iconActionButton--wishlist {
      margin-left: 80px; }
    .IncentiveListItem-iconActionButton.is-onWishlist {
      color: #E70A9D; }
  .IncentiveListItem.IncentiveListItem--gridView {
    height: 240px;
    width: 160px;
    position: relative;
    float: left;
    border-bottom: 1px #ececec solid;
    border-right: 1px #ececec solid;
    padding: 0; }
    .IncentiveListItem.IncentiveListItem--gridView:hover {
      z-index: 999;
      transform: scale(1.05);
      box-shadow: 0 2px 10px 0 rgba(0, 0, 0, 0.5);
      background-color: #fff; }
    .IncentiveListItem.IncentiveListItem--gridView .IncentiveListItem-gridItemContent {
      width: 100%; }
    .IncentiveListItem.IncentiveListItem--gridView .IncentiveListItem-newUsersImgContainer {
      top: 124px;
      left: 8px; }
    .IncentiveListItem.IncentiveListItem--gridView .IncentiveListItem-mainImgContainer {
      width: 100%;
      height: 160px; }
    .IncentiveListItem.IncentiveListItem--gridView .IncentiveListItem-incentiveTitleText {
      font-size: 12px;
      height: 36px;
      overflow: hidden;
      text-align: center;
      width: 100%; }
    .IncentiveListItem.IncentiveListItem--gridView .IncentiveListItem-userActionsBar {
      padding: 15px;
      width: 100%;
      position: absolute;
      bottom: 0; }
    .IncentiveListItem.IncentiveListItem--gridView .IncentiveListItem-iconActionButton {
      margin-left: 0; }
      .IncentiveListItem.IncentiveListItem--gridView .IncentiveListItem-iconActionButton--wishlist {
        float: right; }

.no-flexbox .IncentiveListItem {
  display: block;
  /***************************     
                New Users Image   
         ***************************/
  /***************************     
                Main Image   
         ***************************/
  /***************************     
                Layout for Incentive
         ***************************/
  /**
            The summary row, which holds the Summary Display and Entry Widget
        */
  /**
            The row which contains the 'how to earn points' legend, and the share / wishlist icons.
        */
  /***************************     
                Summary Row Contents
         ***************************/
  /***************************     
                Icon Row Contents
         ***************************/
  /***************************     
                Modes Column Contents
         ***************************/ }
  .no-flexbox .IncentiveListItem:before, .no-flexbox .IncentiveListItem:after {
    content: " ";
    display: table; }
  .no-flexbox .IncentiveListItem:after {
    clear: both; }
  .no-flexbox .IncentiveListItem-mainImgContainer {
    float: left;
    display: block; }
  .no-flexbox .IncentiveListItem-mainInfoContainer {
    float: left;
    max-width: 543px;
    display: block;
    width: 100%; }
  .no-flexbox .IncentiveListItem-summaryRow {
    float: left;
    width: 100%;
    display: block; }
  .no-flexbox .IncentiveListItem-iconsRow {
    float: left;
    width: 100%;
    display: block; }
    .no-flexbox .IncentiveListItem-iconsRow.alt--restrictions-row {
      margin-top: 4px; }
  .no-flexbox .IncentiveListItem-summaryDisplay {
    float: left; }
  .no-flexbox .IncentiveListItem-entryWidget {
    float: right; }
  .no-flexbox .IncentiveListItem-iconsRowModesColumn {
    width: 66%;
    float: left; }
    .no-flexbox .IncentiveListItem-iconsRowModesColumn.alt--full-width {
      width: 100%; }
  .no-flexbox .IncentiveListItem-iconsRowActionsColumn {
    width: 25%;
    float: right; }
  .no-flexbox .IncentiveListItem-commuteCalendarIcons {
    float: left; }
  .no-flexbox .IncentiveListItem-userActionIcons {
    float: right; }
  .no-flexbox .IncentiveListItem-additionalRequirementIcons {
    float: left; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.bg-selection-on-hover:hover {
  background-color: #eeeeee !important; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "materialSettings"; //This doesn't seem to be required. Also, I don't think this is the right address.*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
 * This mixin adds specific colors to rs-icon's which match a certain type of icon.
 */
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
 * This mixin adds specific colors to rs-icon's which match a certain type of icon.
 */
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*User Details*/
.matched-user-details {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
      justify-content: space-around;
  margin-bottom: 16px;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -ms-flex-align: center;
      align-items: center; }
  .matched-user-details--profile-left-display {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex-pack: justify;
        justify-content: space-between;
    -ms-flex-align: center;
        align-items: center; }
  .matched-user-details--divider-vertical {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    width: 1px;
    height: 50px;
    background: #eeeeee; }
  .matched-user-details--profile-right-display {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex-pack: start;
        justify-content: flex-start;
    -ms-flex-align: center;
        align-items: center; }

.user-avatar-img {
  padding-bottom: 8px;
  height: 72px;
  width: 72px; }

.rating-star-display {
  height: 24px;
  width: 100%; }

.matched-user-schedule-display {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
      justify-content: space-between;
  -ms-flex-align: center;
      align-items: center;
  -ms-flex-line-pack: center;
      align-content: center;
  height: 92px; }
  .matched-user-schedule-display--schedule-summary {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
        flex-direction: column;
    -ms-flex-pack: distribute;
        justify-content: space-around;
    -ms-flex-align: start;
        align-items: flex-start;
    height: 92px; }
  .matched-user-schedule-display--view-schedule-button {
    height: 32px;
    color: #65a5f2;
    color: #65a5f2;
    font-weight: bold; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*

    This is NOT used in Desktop.scss. Look in core/paper-card for that.

*/
/*

    This is NOT used in Desktop.scss. Look in core/paper-card for that.

*/
/*
    Hide any elements directly inside the parent element, after a given delay
*/
@keyframes sliding-tab-animation {
  0% {
    opacity: 1; }
  50% {
    opacity: 1; }
  100% {
    opacity: 0; } }

/**
    This should be applied to a container which contains multiple elements as direct children, which
    should all include the sliding-tab mixin.
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
trip-search-admin-controls {
  display: block;
  position: fixed;
  z-index: 2000;
  background-color: #fff;
  box-shadow: 0px 20px 32px -1px rgba(0, 0, 0, 0.52); }

.trip-search-admin-controls--heading {
  margin: 0 !important;
  padding: 16px !important;
  background-color: #242424 !important;
  color: #fff !important;
  font-weight: 500;
  cursor: move;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none; }

.trip-search-admin-controls--print-btn .rs-icon {
  margin-right: 8px; }

.trip-search-admin-controls--minimize-control {
  background-color: #03a9f4;
  padding: 8px 12px;
  color: #fff !important;
  cursor: pointer; }
  .trip-search-admin-controls--minimize-control-label {
    color: #fff !important; }
  .trip-search-admin-controls--minimize-control .rs-icon {
    margin: auto;
    color: #fff; }

.trip-search-admin-controls--pages {
  height: 330px;
  overflow-y: hidden;
  transition: height 0.2s ease-in-out; }
  .trip-search-admin-controls--pages.is-collapsed {
    height: 0; }

.trip-search-admin-controls--lists {
  padding: 16px; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
.profile-view--error-container-error-message {
  color: #f89c50;
  font-style: italic;
  margin: 8px 0; }

/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/**
    Add an .is-hidden modifier class, setting the div to display:none;
*/
/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.help-center {
  color: #464646; }
  .help-center .side-menu {
    width: 175px;
    max-height: 550px;
    overflow-y: auto;
    overflow-x: hidden;
    border-right: #ddd 1px solid; }
    .help-center .side-menu .menu-box {
      padding: 12px 0;
      border-bottom: #ddd 1px solid; }
      .help-center .side-menu .menu-box .menu-text {
        font-size: 14px;
        line-height: 24px;
        padding-left: 16px; }
        .help-center .side-menu .menu-box .menu-text:hover {
          color: #fff;
          background-color: #03a9f4;
          cursor: pointer; }
        .help-center .side-menu .menu-box .menu-text.second-menu {
          font-size: 12px;
          border-top: none;
          padding-left: 32px; }
  .help-center .content {
    width: 525px;
    max-height: 550px;
    overflow-y: auto;
    overflow-x: hidden;
    position: absolute;
    left: 176px;
    top: 49px; }
    .help-center .content .tab-body {
      padding: 16px 0; }

/*@import "../bundles/themes/_themeVariableDefinitions.scss";*/
/*$brand-primary: $brand-primary !default;*/
/*$brand-primary: #9573BB;*/
/* Foreground and background: */
/*

$foreground-87-opaque: #fff !default;
$foreground-26-opaque: #fff !default;
$foreground-0-opaque: #fff !default;
$foreground-100-opaque: #fff !default;

$background-87-opaque: #fff !default;
$background-26-opaque: #fff !default;
$background-0-opaque:#fff !default;
$background-100-opaque: #fff !default;



$background-20-lighter:  #fff !default;

$background-10-darker:  #fff !default;
$background-20-darker:  #fff !default;
$background-50-darker:  #fff !default;
$background-10-lighter:  #fff !default;

$background-20-ligher-87-opaque: #fff !default;
$background-20-darker-87-opaque: #fff !default;
$background-50-darker-100-opaque: #fff !default;
$background-50-darker-87-opaque: #fff !default;
$background-50-darker-26-opaque: #fff !default;*/
.account-edit .account-nav {
  background-color: #f9f9f9;
  box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.26); }
  .account-edit .account-nav .nav-tabs.nav, .account-edit .account-nav .nav-justified.nav-tabs.nav {
    overflow-x: visible; }

.account-edit--dropdown-blocker {
  position: absolute;
  width: 100%;
  height: 68px;
  left: 0;
  z-index: 10;
  background-color: rgba(255, 255, 255, 0.6); }

.account-edit .form-input-row.form-input-row-thin .row-text {
  width: 151px; }

.account-edit .paper-dropdown .paper-dropdown-content-wrapper.anchor-to-top {
  top: 33px; }

.account-edit .paper-dropdown.complete .select-title .label {
  color: #03a9f4; }

.account-edit .paper-dropdown .select-title .label {
  font-size: 12px; }

.account-edit .UserIDLine {
  font-size: 12px;
  color: #999; }

.account-edit .ContactEmailLine {
  font-size: 12px;
  color: #444; }

.account-edit .alt-email-msg-label {
  font-size: 12px;
  color: #3A3A3A; }

.account-edit .alt-email-msg {
  font-size: 12px; }

.account-edit .panel-group .panel-heading h4.panel-title a.accordion-toggle .accordion-header-full-width.contact .section-data-summary {
  display: block; }

.account-edit .alt-email-row {
  position: relative; }
  .account-edit .alt-email-row .alt-email-remove-btn {
    position: absolute;
    bottom: 16px;
    right: 0;
    color: red;
    /*text-transform:capitalize;*/
    cursor: pointer;
    z-index: 1; }

.account-edit .row.row-ds.about-section .col-6:last-child {
  float: left; }

.account-top {
  height: 112px;
  background-color: #f9f9f9;
  padding: 16px;
  position: relative; }
  .account-top .confirm-email-warning {
    font-size: 10px; }
  .account-top .paper-dropdown .paper-dropdown-content-wrapper.anchor-to-vCenter {
    bottom: -120px; }
  .account-top .paper-list-dropdown-menu {
    font-size: 14px; }
    .account-top .paper-list-dropdown-menu .list-item {
      padding: 8px;
      width: 200px;
      cursor: pointer; }
    .account-top .paper-list-dropdown-menu .rs-icon {
      padding: 8px; }
  .account-top ._menu-v1 {
    padding: 8px; }
  .account-top .profile-img {
    position: relative; }
    .account-top .profile-img ._camera {
      position: absolute;
      bottom: -6px;
      right: -6px;
      width: 24px;
      height: 24px;
      border-radius: 50%;
      background-color: #03a9f4;
      color: #fff;
      padding: 3px;
      font-size: 12px;
      border: 2px solid #fff; }
      .account-top .profile-img ._camera:hover {
        background-color: #2ebcfc; }
  .account-top .profile-name {
    font-size: 20px;
    font-weight: 300;
    /*margin-top:8px;*/
    color: #03a9f4; }

.map-overlay-content-right-ui-view {
  perspective: 1000px;
  top: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  z-index: 1000;
  perspective-origin: left; }

.popover {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1060;
  display: none;
  padding: 1px;
  text-align: left;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 6px;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
  white-space: normal; }
  .popover.top {
    margin-top: -10px; }
  .popover.right {
    margin-left: 10px; }
  .popover.bottom {
    margin-top: 10px; }
  .popover.left {
    margin-left: -10px; }
  .popover.calendar-popover {
    width: 95%; }

.popover-title {
  margin: 0;
  padding: 8px 14px;
  font-size: 14px;
  font-weight: normal;
  line-height: 18px;
  background-color: #f7f7f7;
  border-bottom: 1px solid #ebebeb;
  border-radius: 5px 5px 0 0; }

.popover-content {
  padding: 9px 14px; }

.popover > .arrow, .popover > .arrow:after {
  position: absolute;
  display: block;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid; }

.popover > .arrow {
  border-width: 11px; }

.popover > .arrow:after {
  border-width: 10px;
  content: ""; }

.popover.top > .arrow {
  left: 50%;
  margin-left: -11px;
  border-bottom-width: 0;
  border-top-color: #999999;
  border-top-color: rgba(0, 0, 0, 0.05);
  bottom: -11px; }
  .popover.top > .arrow:after {
    content: " ";
    bottom: 1px;
    margin-left: -10px;
    border-bottom-width: 0;
    border-top-color: #fff; }

.popover.right > .arrow {
  top: 50%;
  left: -11px;
  margin-top: -11px;
  border-left-width: 0;
  border-right-color: #999999;
  border-right-color: rgba(0, 0, 0, 0.05); }
  .popover.right > .arrow:after {
    content: " ";
    left: 1px;
    bottom: -10px;
    border-left-width: 0;
    border-right-color: #fff; }

.popover.bottom > .arrow {
  left: 50%;
  margin-left: -11px;
  border-top-width: 0;
  border-bottom-color: #999999;
  border-bottom-color: rgba(0, 0, 0, 0.05);
  top: -11px; }
  .popover.bottom > .arrow:after {
    content: " ";
    top: 1px;
    margin-left: -10px;
    border-top-width: 0;
    border-bottom-color: #fff; }

.popover.left > .arrow {
  top: 50%;
  right: -11px;
  margin-top: -11px;
  border-right-width: 0;
  border-left-color: #999999;
  border-left-color: rgba(0, 0, 0, 0.05); }
  .popover.left > .arrow:after {
    content: " ";
    right: 1px;
    border-right-width: 0;
    border-left-color: #fff;
    bottom: -10px; }

.Spanish .travel-planner-module .fco-container .heading {
  width: 305px;
  white-space: normal; }

.Spanish .dashboard-module-panel .contests-module .caption {
  font-size: 14px; }

.Spanish .profile-detail .row.row-ds .col-6:last-child {
  float: left; }

.Spanish .dashboard-popup .sub-title {
  line-height: 20px; }

.Spanish .dashboard-popup .popup-body .incentive-table .header-row .points-col {
  width: 116px; }

.Spanish .footer-tab .footer-tab-text .dnt {
  margin-left: -20px; }

.Spanish .accordion-group .accordion-heading .bootstrap .row-text, .Spanish .bootstrap .accordion-group .accordion-heading .row-text, .Spanish .bootstrap .paper-list .list-group-item .primary-text, .Spanish .bootstrap .paper-list-subheader .primary-text, .Spanish .bootstrap .type-subhead-1, .Spanish .bootstrap .paper-list-subheader .primary-text, .paper-list-subheader .Spanish .bootstrap .primary-text, .Spanish .bootstrap .paper-list .list-group-item .primary-text, .paper-list .list-group-item .Spanish .bootstrap .primary-text, .Spanish .bootstrap .accordion-group .accordion-heading .row-text, .accordion-group .accordion-heading .Spanish .bootstrap .row-text, .Spanish .paper-list .list-group-item .bootstrap .primary-text, .Spanish .paper-list-subheader .bootstrap .primary-text {
  font-size: 14px; }

.Spanish .form-input-row .row-text {
  font-size: 14px;
  line-height: 20px;
  white-space: normal;
  width: 300px; }

.Spanish .FCOSearchBox-headingText {
  font-size: 16px !important; }

.Spanish .SearchResult-sendEmailButton {
  font-size: 11px; }

.Spanish #UserCarpoolManagement td {
  max-width: 230px; }

.modal.modal-paper .modal-content {
  height: 100%;
  overflow: hidden; }

/*# sourceMappingURL=desktop.css.map */