.comparator-root {}

.comparator-root .vehicleComparePage {}

.comparator-root .no-selected-vehicles-found-message {}

.comparator-root h1.title {}

.comparator-root .breadcrumbs {
    margin-bottom: 15px;
}

.comparator-root h3.missing-vehicle-message {}

.comparator-root .scroll-body {
    overflow-x: auto;
}

.comparator-root .comparator-wrapper {

}

.comparator-root .vehicle-overview-title {
    color: #5b6773;
    font-size: .75em;
    width: 100%;
    padding: 8px 10px;
}

.comparator-root .comparator-feature-group {
    display: flex;
    justify-content: space-between;
}

.comparator-root .comparator-feature-cell-container {
    max-width: 305px;
    position: relative;
}

.comparator-root .comparator-feature-cell-container--hidden {
    overflow: hidden;
}

.comparator-feature-cell-container--hidden .comparator-feature-label {
    display: none;
}

.vehicle-card-top {
    height: 100%;
}

.vehicle-card-root {
    height: 100%;
}

.vehicle-card-thumbnail {
    height: 100%;
    overflow: hidden;
}

.vehicle-card-bottom {
    height: 100%;
}


.comparator-root .comparator-feature-cell-container.comparator-feature-row {
    border-radius: 0 0 3px 3px;
    line-height: 1.2em;
}

.comparator-root .comparator-feature-label {
    color: #5b6773;
    font-size: .75em;
    background: #f7f7f7;
    border-bottom: 1px solid #ebebeb;
    font-weight: bold;
    padding-bottom: 2px;
    padding-left: 10px;
    padding-top: 3px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.comparator-root .comparator-feature-label:nth-child(even) {
    background: transparent;
}

.comparator-root .comparator-feature-row-title {
    color: #5b6773;
    font-size: .75em;
    width: 100%;
    padding: 8px 10px;
}

.comparator-root .comparator-feature-toggle-button {
    cursor: pointer;
    line-height: 0;
    position: absolute;
    top: 3px;
    right: 5px;
    transform: rotate(180deg);
}

.comparator-root .comparator-feature-toggle-button--on {
     transform: rotate(0);
}

.comparator-root a.comparator_toggle_section_button {
    display: inline-block;
}

.comparator-root i.toggle-icon {
    color: #5a6770;
    cursor: pointer;
    font-size: 2rem;
}

.comparator-root .comparator-feature-group:nth-child(2) .comparator-feature-cell-container {
    border-radius: 3px 3px 0 0;
    border-top: 1px solid #bebebe;
}

.comparator-root .comparator-feature-group:not(:first-child) .comparator-feature-cell-container {
    border-left: 1px solid #bebebe;
    border-right: 1px solid #bebebe;
}

.comparator-root .comparator-feature-group:not(:first-child).comparator-feature-group--outlined .comparator-feature-cell-container {
    border-bottom: 1px solid #bebebe;
}

.comparator-root .comparator-feature-group:last-child .comparator-feature-cell-container {
    border-radius: 0 0 3px 3px;
}

.comparator-root .comparator-remove-button {
    text-align: right;
}

.comparator-root .comparator-remove-button .comparator_remove_button {
    display: inline-block;
}

.comparator-root .comparator-remove-button .remove-button {
    border-radius: 50%;
    border-style: solid;
    border-width: 1px;
    font-size: 1.125rem;
    vertical-align: text-bottom;
}

.comparator-root .vehicle-thumbnail-root {

}

.comparator-root .vehicle-thumbnail-root .vehicle-thumbnail-image {
    vertical-align: bottom;
}

.comparator-root .vehicle-title-root {
    padding: 0.375rem 0.25rem .25rem 0.25rem;
    text-align: center;
}

.comparator-root .vehicle-title-root .vehicle-title-link {
    display: flex;
    flex-direction: column;
    line-height: 1.25rem;
}

.comparator-root .vehicle-title-root .vehicle-title-title {
    font-size: .875rem;
    color: #0056b3;
}

.comparator-root .vehicle-title-root .vehicle-title-subtitle {
    font-size: .875rem;
    color: rgba(0,0,0,.87);
}

.comparator-root .vehicle-favorite-button-root {
    padding: 0.1rem 0.25rem;
}

.comparator-root .vehicle-favorite-button-root .select-button-root {
    width: 100%;
    cursor: pointer;
}

.comparator-root .vehicle-favorite-button-root .select-button-root .select-button {
    justify-content: center;
    align-items: center;
    font-size: 12px;
    text-transform: uppercase;
}
.comparator-root .vehicle-favorite-button-root .select-button-root .select-button.normal {
    display: flex;
}
.comparator-root .vehicle-favorite-button-root .select-button-root.active .select-button.normal {
    display: none;
}
.comparator-root .vehicle-favorite-button-root .select-button-root .select-button.selected {
    display: none;
}
.comparator-root .vehicle-favorite-button-root .select-button-root.active .select-button.selected {
    color: rgb(219, 167, 9);
    display: flex;
}

.comparator-root .vehicle-details-button-root {
    padding: 0.25rem 0 22px;
}
.comparator-root .vehicle-details-button-root .comparator_details_button {
    background-color: #a43cbd;
    border-radius: 0.125rem;
    color: white;
    display: block;
    font-size: .875rem;
    margin: 0 auto;
    padding: 0.375rem 0;
    text-align: center;
    width: 12rem;
}

.comparator-root .vehicle-section-divider {
    background-color: #f1f1f1;
    height: 6px;
}

.comparator-root .vehicle-overview-section {
    height: 100%;
}

.comparator-root .vehicle-overview-section .vehicle-info-section-root {
    color: #515f6a;
    font-size: .75rem;
    line-height: 1.25rem;
    padding-bottom: 8px;
    padding-left: 10px;
    padding-right: 10px;
}

.comparator-root .vehicle-overview-section .vehicle-info-section-root .vehicle-info-item-root {
    display: flex;
    align-items: center;
    line-height: normal;
    margin: 5px 0;
}
.comparator-root .vehicle-overview-section .vehicle-info-section-root .vehicle-info-item-root .vehicle-info-label {
    min-width: 30%;
}
.comparator-root .vehicle-overview-section .vehicle-info-section-root .vehicle-info-item-root .vehicle-info-value {
    flex-grow: 1;
    text-align: right;
}
.comparator-root .vehicle-overview-section .vehicle-info-section-root .vehicle-info-item-root .vehicle-info-swatch {
    border: 1px solid #000;
    border-radius: 50%;
    display: inline-block;
    min-width: 22px;
    height: 22px;
    margin-right: 0.2rem;
}

.comparator-root .comparator-pricing-root {
    padding: 20px 10px 4px;
}

.comparator-root .comparator-pricing-root .jzl-pricing-viewer-root {
    font-size: .875rem;
    font-weight: bold;
    line-height: 1.5;
}

.comparator-root .comparator-pricing-root .jzl-pricing-viewer-root .label {
    display: inline-block;
    line-height: 1;
    padding-right: 5px;
}
.comparator-root .comparator-pricing-root .jzl-pricing-viewer-root .value {
    display: inline-block;
    line-height: 1;
    text-align: right;
}
.comparator-root .comparator-pricing-root .jzl-pricing-viewer-root .row {
    font-weight: bold;
    margin-bottom: 10px;
    display: flex;
    justify-content: space-between;
}
