﻿.scrolling-table {
  width: 100%;
  position: relative;
  display: none; }
  .scrolling-table::after {
    /* clearfix */
    content: '';
    display: table;
    clear: both; }
  .scrolling-table > .headers,
  .scrolling-table > .scrolling-container > .scrolling-body {
    display: table;
    table-layout: fixed;
    border-collapse: collapse;
    border-spacing: 0; }
    .scrolling-table > .headers.float-header,
    .scrolling-table > .scrolling-container > .scrolling-body.float-header {
      display: none;
      position: absolute; }
  .scrolling-table > .headers {
    position: absolute;
    left: 0;
    top: 0;
    /*background-color: white;*/
    pointer-events: none;
    border-right: 1px solid #ddd;
    z-index: 10; }
    .scrolling-table > .headers.float-header {
      z-index: 15; }
      .scrolling-table > .headers.float-header .scrolling-row > div:first-child {
        border-right: none; }
  .scrolling-table > .scrolling-container {
    width: 100%;
    overflow-x: auto;
    position: relative;
    /* smooth scrolling on touch devices */
    -webkit-overflow-scrolling: touch; }
  .scrolling-table > .scrolling-container > .scrolling-body.float-header {
    z-index: 12; }
  .scrolling-table .scrolling-row {
    display: table-row;
    overflow: hidden;
    background-color: white; }
    .scrolling-table .scrolling-row > div {
      /*display: table-cell;*/
      display: inline-block;
      /* Allow JS to compute the total width for scrolling */
      /*background-color: white;*/
      position: relative;
      border-bottom: 1px solid #ddd; }
    .scrolling-table .scrolling-row > div:first-child {
      border-right: 1px solid #ddd; }
    .scrolling-table .scrolling-row.column-header > div {
      overflow: hidden; }
    .scrolling-table .scrolling-row.column-control {
      pointer-events: auto; }
      .scrolling-table .scrolling-row.column-control > div {
        text-align: center;
        padding: 2px 0; }
  .scrolling-table.has-width .scrolling-row > div {
    display: table-cell; }
  .scrolling-table > .headers {
    width: 149px; }
  .scrolling-table .scrolling-row > div {
    width: 70px; }
  .scrolling-table .scrolling-row > div:first-child {
    width: 149px; }
  .scrolling-table .scrolling-row.column-header {
    height: 190px; }
    .scrolling-table .scrolling-row.column-header > div {
      height: 190px; }
  .scrolling-table .scrolling-row.taller-column-header {
    height: 230px; }
    .scrolling-table .scrolling-row.taller-column-header > div {
      height: 230px; }
  .scrolling-table.single-column .scrolling-row > div {
    width: 110px; }
  .scrolling-table.single-column .scrolling-row > div:first-child {
    width: 149px; }
  @media only screen and (min-width: 361px) {
    .scrolling-table > .headers {
      width: 214px; }
    .scrolling-table .scrolling-row > div {
      width: 70px; }
    .scrolling-table .scrolling-row > div:first-child {
      width: 214px; }
    .scrolling-table .scrolling-row.column-header {
      height: 190px; }
      .scrolling-table .scrolling-row.column-header > div {
        height: 190px; }
    .scrolling-table .scrolling-row.taller-column-header {
      height: 230px; }
      .scrolling-table .scrolling-row.taller-column-header > div {
        height: 230px; }
    .scrolling-table.single-column .scrolling-row > div {
      width: 210px; }
    .scrolling-table.single-column .scrolling-row > div:first-child {
      width: 214px; } }

.spec-table .fixed-height {
  /*position: absolute;
        width: 100%;
        height: 100%;*/
  overflow: hidden; }

.spec-table .scrolling-row.column-header > div {
  /*border-bottom-width: 0;*/
  vertical-align: top; }

.spec-table .float-header .scrolling-row.column-header > div {
  border-bottom-width: 1px; }

.spec-table .spec-legend {
  text-align: center;
  padding-top: 25px; }
  .spec-table .spec-legend ul {
    list-style: none;
    display: inline-block;
    top: 80px;
    text-align: left; }
    .spec-table .spec-legend ul li {
      font-size: 12px; }
  .spec-table .spec-legend .btn-spec-compare {
    position: absolute;
    bottom: 5px;
    width: 100%;
    text-align: center; }

.spec-table .trim-column {
  font-size: 0.65rem;
  line-height: 0.65rem;
  text-align: center;
  border-top: 1px solid #ddd;
  margin-top: 31px;
  position: relative;
  height: 158px;
  /*box-sizing: content-box;
        position: absolute;
        top: 31px;
        margin-top: 31px;*/ }
  .spec-table .trim-column .car-name {
    /*position: absolute;*/
    text-align: center;
    width: 100%;
    height: 90px;
    overflow: hidden; }
    .spec-table .trim-column .car-name p {
      font-size: 0.65rem;
      line-height: 0.7rem;
      position: relative;
      top: 50%;
      -moz-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      -o-transform: translateY(-50%);
      -webkit-transform: translateY(-50%);
      transform: translateY(-50%); }
  .spec-table .trim-column .car-msrp {
    /*position: absolute;*/
    text-align: center;
    width: 100%;
    bottom: 10px; }
    .spec-table .trim-column .car-msrp .subheader {
      font-family: "Open Sans", Helvetica, Arial, sans-serif;
      color: #333;
      font-weight: 300;
      padding: 3px 0;
      margin: 0; }
  .spec-table .trim-column .car-package {
    /*position: absolute;*/
    text-align: center;
    width: 100%;
    margin-top: 0.5em; }
    .spec-table .trim-column .car-package .subheader {
      font-family: "Open Sans", Helvetica, Arial, sans-serif;
      color: #333;
      font-weight: 300;
      padding: 3px 0;
      margin: 0; }
      .spec-table .trim-column .car-package .subheader span {
        display: block;
        line-height: 0.5em; }

.spec-table .taller-fixed-height {
  height: 198px; }

.spec-table .swipe-intro {
  position: absolute;
  right: 0;
  top: 0;
  -moz-transform: translateX(100%);
  -ms-transform: translateX(100%);
  -o-transform: translateX(100%);
  -webkit-transform: translateX(100%);
  transform: translateX(100%);
  padding: 2px 5px; }

.spec-table .scrolling-row .spec-title,
.spec-table .scrolling-row .spec-value {
  font-size: 0.65rem;
  padding: 3px 5px 3px 0; }

.spec-table .scrolling-row .spec-title ul {
  list-style: none;
  margin: 0; }
  .spec-table .scrolling-row .spec-title ul li {
    font-size: 0.65rem;
    line-height: 0.65rem; }

.spec-table .scrolling-row h4 {
  padding-top: 15px; }

.spec-table .scrolling-row > div {
  vertical-align: middle; }
  .spec-table .scrolling-row > div .spec-value {
    text-align: center; }

.spec-table.single-column .column-control {
  display: none; }

#spec-by-category {
  border-top: 1px solid #ddd; }

.btn-spec-by-category {
  margin-top: 8px;
  border-bottom: 1px solid #ddd; }

