#kss-wrapper .kss-mod-example .colors div {
  color: #fff;
  padding: 20px;
  max-width: 320px;
  margin: 0 auto; }
  #kss-wrapper .kss-mod-example .colors div.midnight-blue {
    background-color: #0b162f; }
  #kss-wrapper .kss-mod-example .colors div.dark-blue {
    background-color: #2354ac; }
  #kss-wrapper .kss-mod-example .colors div.blue {
    background-color: #5b92f4; }
  #kss-wrapper .kss-mod-example .colors div.light-blue {
    background-color: #b1cdff; }
  #kss-wrapper .kss-mod-example .colors div.orange {
    background-color: #f7941d; }
  #kss-wrapper .kss-mod-example .colors div.light-orange {
    background-color: #ffc891; }
  #kss-wrapper .kss-mod-example .colors div.dark-gray {
    background-color: #8a8a8a; }
  #kss-wrapper .kss-mod-example .colors div.gray {
    background-color: #e1e1e1;
    color: #8a8a8a; }
  #kss-wrapper .kss-mod-example .colors div.light-gray {
    background-color: #f1f1f1;
    color: #8a8a8a; }

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

@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/baseline-raleway/raleway-300.woff2');
  src: url('fonts/baseline-raleway/raleway-300.woff2') format('woff2'), url('fonts/baseline-raleway/raleway-300.woff') format('woff'), url('fonts/baseline-raleway/raleway-300.ttf') format('truetype'), url('fonts/baseline-raleway/raleway-300.eot?#iefix') format("embedded-opentype"); }

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

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

@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 600;
  src: url('fonts/baseline-raleway/raleway-600.woff2');
  src: url('fonts/baseline-raleway/raleway-600.woff2') format('woff2'), url('fonts/baseline-raleway/raleway-600.woff') format('woff'), url('fonts/baseline-raleway/raleway-600.ttf') format('truetype'), url('fonts/baseline-raleway/raleway-600.eot?#iefix') format("embedded-opentype"); }

@font-face {
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 700;
  src: url('fonts/baseline-raleway/raleway-700.woff2');
  src: url('fonts/baseline-raleway/raleway-700.woff2') format('woff2'), url('fonts/baseline-raleway/raleway-700.woff') format('woff'), url('fonts/baseline-raleway/raleway-700.ttf') format('truetype'), url('fonts/baseline-raleway/raleway-700.eot?#iefix') format("embedded-opentype"); }

.page-wrap {
  min-width: 320px;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 20px; }

@media (min-width: 1300px) {
  .page-wrap {
    padding: 0; } }

#kss-wrapper .site-header, #kss-wrapper .site-footer, #kss-wrapper .page-content {
  background-color: #ccc;
  border-bottom: 1px solid #555; }
#kss-wrapper .site-footer {
  border: 0 none; }
#kss-wrapper .page-wrap {
  min-width: 100px;
  max-width: 400px;
  background-color: #ddd; }
  #kss-wrapper .page-wrap .content {
    background-color: #eee; }

body {
  font-family: 'raleway';
  font-size: 14px;
  line-height: 1.2;
  color: #363636; }

#kss-wrapper h1, #kss-wrapper h2, #kss-wrapper h3, #kss-wrapper h4, #kss-wrapper h5, #kss-wrapper h6 {
  font-family: 'raleway'; }
#kss-wrapper .kss-markup pre, #kss-wrapper .kss-mod-name p, #kss-wrapper code {
  font-family: Consolas, "Liberation Mono", Menlo, Courier, monospace;
  background-color: #f8f8f8;
  border: 1px solid #ddd;
  font-size: 14px;
  line-height: 1.2;
  vertical-align: middle;
  padding: 2px 5px;
  border-radius: 3px; }
#kss-wrapper .kss-markup pre {
  margin: 0;
  padding: 10px; }
#kss-wrapper .kss-markup:before {
  content: "Markup";
  display: block;
  padding: 10px 0;
  font-size: 14px;
  line-height: 1em; }
#kss-wrapper .kss-mod-name {
  width: auto; }
  #kss-wrapper .kss-mod-name p {
    display: inline-block; }
#kss-wrapper .kss-mod-desc-group {
  border-top: 1px solid #ddd; }

.header {
  font-weight: bold; }
  .header--h1 {
    font-size: 24px; }
  .header--h2 {
    font-size: 22px; }
  .header--h3 {
    font-size: 18px; }
  .header--h4 {
    font-size: 16px; }
  .header--h5 {
    font-size: 14px; }
  .header--h6 {
    font-size: 12px; }
  .header--inline {
    display: inline; }

@font-face {
  font-family: "ksl-icons";
  src: url('icons/font/ksl-icons.eot');
  src: url('icons/font/ksl-icons.eot?#iefix') format('eot'), url('icons/font/ksl-icons.woff') format('woff'), url('icons/font/ksl-icons.ttf') format('truetype'), url('icons/font/ksl-icons.svg#ksl-icons') format('svg'); }

.icon {
  display: inline-block;
  border: none;
  cursor: pointer;
  text-align: center; }
  .icon:before {
    font-family: "ksl-icons";
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
    /* speak: none; only necessary if not using the private unicode range (firstGlyph option) */
    text-decoration: none;
    text-transform: none; }

.icon {
  height: 24px;
  width: 24px;
  font-size: 24px;
  line-height: 24px;
  padding: 4px;
  box-sizing: content-box; }
  .icon--base {
    height: 24px;
    width: 24px;
    font-size: 24px;
    line-height: 24px;
    padding: 4px;
    box-sizing: content-box; }
  .icon--xsmall {
    height: 16px;
    width: 16px;
    font-size: 16px;
    line-height: 16px;
    padding: 2.66667px;
    box-sizing: content-box; }
  .icon--small {
    height: 20px;
    width: 20px;
    font-size: 20px;
    line-height: 20px;
    padding: 3.33333px;
    box-sizing: content-box; }
  .icon--medium {
    height: 24px;
    width: 24px;
    font-size: 24px;
    line-height: 24px;
    padding: 4px;
    box-sizing: content-box; }
  .icon--large {
    height: 32px;
    width: 32px;
    font-size: 32px;
    line-height: 32px;
    padding: 5.33333px;
    box-sizing: content-box; }
  .icon--xlarge {
    height: 40px;
    width: 40px;
    font-size: 40px;
    line-height: 40px;
    padding: 6.66667px;
    box-sizing: content-box; }

.icon--add:before {
  content: '\e601'; }

.icon--agent:before {
  content: '\e602'; }

.icon--calculator:before {
  content: '\e603'; }

.icon--camera:before {
  content: '\e604'; }

.icon--car:before {
  content: '\e605'; }

.icon--cart:before {
  content: '\e606'; }

.icon--cellphone:before {
  content: '\e607'; }

.icon--check:before {
  content: '\e608'; }

.icon--circle-add:before {
  content: '\e609'; }

.icon--circle-close:before {
  content: '\e60a'; }

.icon--circle-left-arrow:before {
  content: '\e60b'; }

.icon--circle-play:before {
  content: '\e60c'; }

.icon--circle-right-arrow:before {
  content: '\e60d'; }

.icon--clock:before {
  content: '\e60e'; }

.icon--close:before {
  content: '\e60f'; }

.icon--compact:before {
  content: '\e610'; }

.icon--conductor:before {
  content: '\e611'; }

.icon--convertible:before, .icon--convetible:before {
  content: '\e612'; }

.icon--coupe:before {
  content: '\e613'; }

.icon--crossover:before {
  content: '\e614'; }

.icon--dog:before {
  content: '\e615'; }

.icon--dumb-bell:before {
  content: '\e616'; }

.icon--email:before {
  content: '\e617'; }

.icon--facebook:before {
  content: '\e618'; }

.icon--finance:before {
  content: '\e619'; }

.icon--flag:before {
  content: '\e61a'; }

.icon--flower:before {
  content: '\e61b'; }

.icon--fork-knife:before {
  content: '\e61c'; }

.icon--glasses:before {
  content: '\e61d'; }

.icon--google:before {
  content: '\e61e'; }

.icon--hatchback:before {
  content: '\e61f'; }

.icon--heart:before {
  content: '\e620'; }

.icon--house-2:before {
  content: '\e621'; }

.icon--house:before {
  content: '\e622'; }

.icon--left-arrow:before {
  content: '\e623'; }

.icon--linkedin:before {
  content: '\e624'; }

.icon--list:before {
  content: '\e625'; }

.icon--map-pin:before {
  content: '\e626'; }

.icon--menu-text:before {
  content: '\e627'; }

.icon--menu:before {
  content: '\e628'; }

.icon--minivan:before {
  content: '\e629'; }

.icon--movie:before {
  content: '\e62a'; }

.icon--music:before {
  content: '\e62b'; }

.icon--open-sign:before {
  content: '\e62c'; }

.icon--open-star:before {
  content: '\e62d'; }

.icon--pencil:before {
  content: '\e62e'; }

.icon--phone:before {
  content: '\e62f'; }

.icon--pinterest:before {
  content: '\e630'; }

.icon--printer:before {
  content: '\e631'; }

.icon--quote:before {
  content: '\e632'; }

.icon--right-arrow:before {
  content: '\e633'; }

.icon--ring:before {
  content: '\e634'; }

.icon--search:before {
  content: '\e635'; }

.icon--sedan:before {
  content: '\e636'; }

.icon--semi:before, .icon--industrial-semi:before {
  content: '\e637'; }

.icon--share:before {
  content: '\e638'; }

.icon--shovel-broom:before {
  content: '\e639'; }

.icon--skier:before {
  content: '\e63a'; }

.icon--star:before {
  content: '\e63b'; }

.icon--suv:before {
  content: '\e63c'; }

.icon--tag:before {
  content: '\e63d'; }

.icon--triangle-down:before {
  content: '\e63e'; }

.icon--triangle-right:before {
  content: '\e63f'; }

.icon--truck:before {
  content: '\e640'; }

.icon--twitter:before {
  content: '\e641'; }

.icon--umbrella:before {
  content: '\e642'; }

.icon--update:before {
  content: '\e643'; }

.icon--user-logged-in:before {
  content: '\e644'; }

.icon--user:before {
  content: '\e645'; }

.icon--van:before {
  content: '\e646'; }

.icon--video-play:before {
  content: '\e647'; }

.icon--view:before {
  content: '\e648'; }

.icon--wagon:before {
  content: '\e649'; }

.icon--waste-bin:before {
  content: '\e64a'; }

.icon--weighted-heart-empty:before {
  content: '\e64b'; }

.icon--weighted-heart:before {
  content: '\e64c'; }

.icon--x-refresh:before {
  content: '\e64d'; }

.icon--z-alert:before {
  content: '\e64e'; }

.icon--z-mylistings:before {
  content: '\e64f'; }

.icon--z-newpage:before {
  content: '\e650'; }

.icon--z-ribbon:before {
  content: '\e651'; }

.icon--z-savedsearches:before {
  content: '\e652'; }

.icon--z-tag:before {
  content: '\e653'; }

.icon--z-thumbs-up:before {
  content: '\e654'; }

.icon--zarrow-left:before {
  content: '\e655'; }

.icon--zarrow-right:before {
  content: '\e656'; }

/**
 * @deprecated Please use .icon--convertible
 */
/**
 * @deprecated Please use .icon--industrial-semi
 */
.icon {
  /* social icons */ }
  .icon--inverted {
    background-color: #8a8a8a;
    color: #fff; }
  .icon--twitter {
    color: #28aae1; }
    .icon--twitter.icon--inverted {
      color: #fff;
      background-color: #28aae1; }
  .icon--facebook {
    color: #3460a1; }
    .icon--facebook.icon--inverted {
      color: #fff;
      background-color: #3460a1; }
  .icon--google {
    color: #de5543; }
    .icon--google.icon--inverted {
      color: #fff;
      background-color: #de5543; }
  .icon--pinterest {
    color: #c7221d; }
    .icon--pinterest.icon--inverted {
      color: #fff;
      background-color: #c7221d; }
  .icon--linkedin {
    color: #0079b8; }
    .icon--linkedin.icon--inverted {
      color: #fff;
      background-color: #0079b8; }
  .icon--email {
    color: #8a8a8a; }
    .icon--email.icon--inverted {
      color: #fff;
      background-color: #8a8a8a; }

/* kss styles */
#kss-wrapper .icon:hover {
  outline: 1px dashed #f7941d; }

.rating-stars {
  display: inline-block;
  width: 80px;
  height: 14px;
  font-size: 14px !important;
  line-height: 14px;
  vertical-align: middle;
  letter-spacing: 3px;
  position: relative;
  /* copied from icon font stylesheet */
  font-family: 'ksl-icons';
  font-style: normal !important;
  font-weight: normal !important;
  font-variant: normal !important;
  text-transform: none !important;
  speak: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  /* end copy */ }
  .rating-stars:before, .rating-stars:after {
    content: "\e639\e639\e639\e639\e639";
    /* .icon--star */
    display: block;
    height: 100%;
    width: 83px;
    position: absolute;
    top: 0;
    left: 0px; }
  .rating-stars:before {
    color: #9F9F9F;
    z-index: 1; }
  .rating-stars:after {
    color: #FA9E49;
    z-index: 2;
    overflow: hidden;
    width: 0; }
  .rating-stars.rating-0:after {
    width: 0; }
  .rating-stars.rating-0-5:after {
    width: 7px; }
  .rating-stars.rating-1:after {
    width: 17px; }
  .rating-stars.rating-1-5:after {
    width: 24px; }
  .rating-stars.rating-2:after {
    width: 34px; }
  .rating-stars.rating-2-5:after {
    width: 41px; }
  .rating-stars.rating-3:after {
    width: 51px; }
  .rating-stars.rating-3-5:after {
    width: 58px; }
  .rating-stars.rating-4:after {
    width: 68px; }
  .rating-stars.rating-4-5:after {
    width: 75px; }
  .rating-stars.rating-5:after {
    width: 83px; }

.link {
  color: #2354ac;
  font-family: inherit;
  text-decoration: none; }
  .link:visited {
    color: #2354ac; }
  .link:hover, .link:focus {
    color: #2354ac;
    text-decoration: underline;
    cursor: pointer; }
  .link:active {
    color: #f7941d; }
  .link--forward:after {
    content: " \00bb";
    /* » */ }
  .link--backward:before {
    content: "\00ab  ";
    /* « */ }

.button, a.button {
  border: 0 none;
  color: #fff;
  display: inline-block;
  text-align: center;
  cursor: pointer;
  vertical-align: baseline;
  text-decoration: none;
  -webkit-transition: background-color 300ms;
          transition: background-color 300ms;
  outline: none;
  font-family: inherit;
  background-color: #5b92f4;
  height: 28px;
  line-height: 28px;
  font-size: 14px;
  padding: 0 10px; }
  .button:active, .button--active, a.button:active, a.button--active {
    outline: none;
    -webkit-transform: translate(1px, 1px);
        -ms-transform: translate(1px, 1px);
            transform: translate(1px, 1px); }
  .button:hover, .button--hover, a.button:hover, a.button--hover {
    background-color: #4d88f3; }
  .button:active, .button--active, a.button:active, a.button--active {
    background-color: #3579f1; }
  .button--action, a.button--action {
    font-size: 16px;
    font-weight: bold; }
  .button--forward:after, a.button--forward:after {
    content: " \00bb";
    /* » */ }
  .button--backward:before, a.button--backward:before {
    content: "\00ab ";
    /* « */
    margin-right: 3px; }

.label {
  color: #2354ac; }

.text-input, .textarea {
  width: 100%;
  height: 24px;
  border: 1px solid #8a8a8a;
  padding: 5px;
  box-shadow: 0 0 1px 1px #e1e1e1 inset;
  background: #fff;
  border-radius: 0; }

.select {
  height: 24px;
  width: 100%;
  border: 1px solid #8a8a8a;
  border-radius: 2px; }

.textarea {
  width: 100%;
  height: auto; }

.checkbox-group .checkbox {
  margin-left: 10px; }
  .checkbox-group .checkbox:first-child {
    margin-left: 0; }
.checkbox-group--vertical .checkbox {
  margin-left: 0;
  display: block;
  padding: 5px 0; }

.radio-group .radio {
  margin-left: 10px; }
  .radio-group .radio:first-child {
    margin-left: 0; }
.radio-group--vertical .radio {
  margin-left: 0;
  display: block;
  padding: 5px 0; }

.panel__head {
  padding: 10px 20px;
  background-color: #f1f1f1;
  font-size: 22px;
  color: #2354ac;
  font-weight: normal; }
  .panel__head h1, .panel__head h2, .panel__head h3, .panel__head h4, .panel__head h5, .panel__head h6 {
    color: #2354ac;
    font-weight: normal;
    margin: 0; }
.panel__body {
  padding: 20px; }
  .panel__body :first-child, .panel__body :last-child {
    padding-top: 0;
    margin-top: 0; }

.margin-bottom--none {
  margin-bottom: 0 !important; }