/*! vendor.css */
@charset "UTF-8";

/*!
 * Cropper v2.3.4
 * https://github.com/fengyuanchen/cropper
 *
 * Copyright (c) 2014-2016 Fengyuan Chen and contributors
 * Released under the MIT license
 *
 * Date: 2016-09-03T05:50:45.412Z
 */
.cropper-container {
    font-size: 0;
    line-height: 0;
    position: relative;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    direction: ltr !important;
}

    .cropper-container img {
        display: block;
        width: 100%;
        min-width: 0 !important;
        max-width: none !important;
        height: 100%;
        min-height: 0 !important;
        max-height: none !important;
        image-orientation: 0deg !important;
    }

.cropper-wrap-box,
.cropper-canvas,
.cropper-drag-box,
.cropper-crop-box,
.cropper-modal {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
}

.cropper-wrap-box {
    overflow: hidden;
}

.cropper-drag-box {
    opacity: 0;
    background-color: #fff;
    filter: alpha(opacity=0);
}

.cropper-modal {
    opacity: .5;
    background-color: #000;
    filter: alpha(opacity=50);
}

.cropper-view-box {
    display: block;
    overflow: hidden;
    width: 100%;
    height: 100%;
    outline: 1px solid #39f;
    outline-color: rgba(51, 153, 255, .75);
}

.cropper-dashed {
    position: absolute;
    display: block;
    opacity: .5;
    border: 0 dashed #eee;
    filter: alpha(opacity=50);
}

    .cropper-dashed.dashed-h {
        top: 33.33333%;
        left: 0;
        width: 100%;
        height: 33.33333%;
        border-top-width: 1px;
        border-bottom-width: 1px;
    }

    .cropper-dashed.dashed-v {
        top: 0;
        left: 33.33333%;
        width: 33.33333%;
        height: 100%;
        border-right-width: 1px;
        border-left-width: 1px;
    }

.cropper-center {
    position: absolute;
    top: 50%;
    left: 50%;
    display: block;
    width: 0;
    height: 0;
    opacity: .75;
    filter: alpha(opacity=75);
}

    .cropper-center:before,
    .cropper-center:after {
        position: absolute;
        display: block;
        content: ' ';
        background-color: #eee;
    }

    .cropper-center:before {
        top: 0;
        left: -3px;
        width: 7px;
        height: 1px;
    }

    .cropper-center:after {
        top: -3px;
        left: 0;
        width: 1px;
        height: 7px;
    }

.cropper-face,
.cropper-line,
.cropper-point {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    opacity: .1;
    filter: alpha(opacity=10);
}

.cropper-face {
    top: 0;
    left: 0;
    background-color: #fff;
}

.cropper-line {
    background-color: #39f;
}

    .cropper-line.line-e {
        top: 0;
        right: -3px;
        width: 5px;
        cursor: e-resize;
    }

    .cropper-line.line-n {
        top: -3px;
        left: 0;
        height: 5px;
        cursor: n-resize;
    }

    .cropper-line.line-w {
        top: 0;
        left: -3px;
        width: 5px;
        cursor: w-resize;
    }

    .cropper-line.line-s {
        bottom: -3px;
        left: 0;
        height: 5px;
        cursor: s-resize;
    }

.cropper-point {
    width: 5px;
    height: 5px;
    opacity: .75;
    background-color: #39f;
    filter: alpha(opacity=75);
}

    .cropper-point.point-e {
        top: 50%;
        right: -3px;
        margin-top: -3px;
        cursor: e-resize;
    }

    .cropper-point.point-n {
        top: -3px;
        left: 50%;
        margin-left: -3px;
        cursor: n-resize;
    }

    .cropper-point.point-w {
        top: 50%;
        left: -3px;
        margin-top: -3px;
        cursor: w-resize;
    }

    .cropper-point.point-s {
        bottom: -3px;
        left: 50%;
        margin-left: -3px;
        cursor: s-resize;
    }

    .cropper-point.point-ne {
        top: -3px;
        right: -3px;
        cursor: ne-resize;
    }

    .cropper-point.point-nw {
        top: -3px;
        left: -3px;
        cursor: nw-resize;
    }

    .cropper-point.point-sw {
        bottom: -3px;
        left: -3px;
        cursor: sw-resize;
    }

    .cropper-point.point-se {
        right: -3px;
        bottom: -3px;
        width: 20px;
        height: 20px;
        cursor: se-resize;
        opacity: 1;
        filter: alpha(opacity=100);
    }

        .cropper-point.point-se:before {
            position: absolute;
            right: -50%;
            bottom: -50%;
            display: block;
            width: 200%;
            height: 200%;
            content: ' ';
            opacity: 0;
            background-color: #39f;
            filter: alpha(opacity=0);
        }

@media (min-width: 768px) {
    .cropper-point.point-se {
        width: 15px;
        height: 15px;
    }
}

@media (min-width: 992px) {
    .cropper-point.point-se {
        width: 10px;
        height: 10px;
    }
}

@media (min-width: 1200px) {
    .cropper-point.point-se {
        width: 5px;
        height: 5px;
        opacity: .75;
        filter: alpha(opacity=75);
    }
}

.cropper-invisible {
    opacity: 0;
    filter: alpha(opacity=0);
}

.cropper-bg {
    background-image: url(/Content/data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz/TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC);
}

.cropper-hide {
    position: absolute;
    display: block;
    width: 0;
    height: 0;
}

.cropper-hidden {
    display: none !important;
}

.cropper-move {
    cursor: move;
}

.cropper-crop {
    cursor: crosshair;
}

.cropper-disabled .cropper-drag-box,
.cropper-disabled .cropper-face,
.cropper-disabled .cropper-line,
.cropper-disabled .cropper-point {
    cursor: not-allowed;
}
/*
 * jQuery FlexSlider v2.6.3
 * http://www.woothemes.com/flexslider/
 *
 * Copyright 2012 WooThemes
 * Free to use under the GPLv2 and later license.
 * http://www.gnu.org/licenses/gpl-2.0.html
 *
 * Contributing author: Tyler Smith (@mbmufffin)
 *
 */
/* ====================================================================================================================
 * FONT-FACE
 * ====================================================================================================================*/
@font-face {
    font-family: 'flexslider-icon';
    src: url(/Content/fonts/flexslider-icon.eot);
    src: url(/Content/fonts/flexslider-icon.eot?#iefix) format('embedded-opentype'), url(/Content/fonts/flexslider-icon.woff) format('woff'), url(/Content/fonts/flexslider-icon.ttf) format('truetype'), url(/Content/fonts/flexslider-icon.svg#flexslider-icon) format('svg');
    font-weight: normal;
    font-style: normal;
}
/* ====================================================================================================================
 * RESETS
 * ====================================================================================================================*/
.flex-container a:hover,
.flex-slider a:hover {
    outline: none;
}

.slides,
.slides > li,
.flex-control-nav,
.flex-direction-nav {
    margin: 0;
    padding: 0;
    list-style: none;
}

.flex-pauseplay span {
    text-transform: capitalize;
}
/* ====================================================================================================================
 * BASE STYLES
 * ====================================================================================================================*/
.flexslider {
    margin: 0;
    padding: 0;
}

    .flexslider .slides > li {
        display: none;
        -webkit-backface-visibility: hidden;
    }

    .flexslider .slides img {
        width: 100%;
        display: block;
    }

    .flexslider .slides:after {
        content: "\0020";
        display: block;
        clear: both;
        visibility: hidden;
        line-height: 0;
        height: 0;
    }

html[xmlns] .flexslider .slides {
    display: block;
}

* html .flexslider .slides {
    height: 1%;
}

.no-js .flexslider .slides > li:first-child {
    display: block;
}
/* ====================================================================================================================
 * DEFAULT THEME
 * ====================================================================================================================*/
.flexslider {
    margin: 0 0 60px;
    background: #fff;
    border: 4px solid #fff;
    position: relative;
    zoom: 1;
    border-radius: 4px;
    -webkit-box-shadow: '' 0 1px 4px rgba(0, 0, 0, 0.2);
    -o-box-shadow: '' 0 1px 4px rgba(0, 0, 0, 0.2);
    box-shadow: '' 0 1px 4px rgba(0, 0, 0, 0.2);
}

    .flexslider .slides {
        zoom: 1;
    }

        .flexslider .slides img {
            height: auto;
            -moz-user-select: none;
        }

.flex-viewport {
    max-height: 2000px;
    -webkit-transition: all 1s ease;
    -o-transition: all 1s ease;
    transition: all 1s ease;
}

.loading .flex-viewport {
    max-height: 300px;
}

.carousel li {
    margin-right: 5px;
}

.flex-direction-nav {
    *height: 0;
}

    .flex-direction-nav a {
        text-decoration: none;
        display: block;
        width: 40px;
        height: 40px;
        margin: -20px 0 0;
        position: absolute;
        top: 50%;
        z-index: 10;
        overflow: hidden;
        opacity: 0;
        cursor: pointer;
        color: rgba(0, 0, 0, 0.8);
        text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3);
        -webkit-transition: all 0.3s ease-in-out;
        -o-transition: all 0.3s ease-in-out;
        transition: all 0.3s ease-in-out;
    }

        .flex-direction-nav a:before {
            font-family: "flexslider-icon";
            font-size: 40px;
            display: inline-block;
            content: '\f001';
            color: rgba(0, 0, 0, 0.8);
            text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.3);
        }

        .flex-direction-nav a.flex-next:before {
            content: '\f002';
        }

    .flex-direction-nav .flex-prev {
        left: -50px;
    }

    .flex-direction-nav .flex-next {
        right: -50px;
        text-align: right;
    }

.flexslider:hover .flex-direction-nav .flex-prev {
    opacity: 0.7;
    left: 10px;
}

    .flexslider:hover .flex-direction-nav .flex-prev:hover {
        opacity: 1;
    }

.flexslider:hover .flex-direction-nav .flex-next {
    opacity: 0.7;
    right: 10px;
}

    .flexslider:hover .flex-direction-nav .flex-next:hover {
        opacity: 1;
    }

.flex-direction-nav .flex-disabled {
    opacity: 0 !important;
    filter: alpha(opacity=0);
    cursor: default;
    z-index: -1;
}

.flex-pauseplay a {
    display: block;
    width: 20px;
    height: 20px;
    position: absolute;
    bottom: 5px;
    left: 10px;
    opacity: 0.8;
    z-index: 10;
    overflow: hidden;
    cursor: pointer;
    color: #000;
}

    .flex-pauseplay a:before {
        font-family: "flexslider-icon";
        font-size: 20px;
        display: inline-block;
        content: '\f004';
    }

    .flex-pauseplay a:hover {
        opacity: 1;
    }

    .flex-pauseplay a.flex-play:before {
        content: '\f003';
    }

.flex-control-nav {
    width: 100%;
    position: absolute;
    bottom: -40px;
    text-align: center;
}

    .flex-control-nav li {
        margin: 0 6px;
        display: inline-block;
        zoom: 1;
        *display: inline;
    }

.flex-control-paging li a {
    width: 11px;
    height: 11px;
    display: block;
    background: #666;
    background: rgba(0, 0, 0, 0.5);
    cursor: pointer;
    text-indent: -9999px;
    -webkit-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
    -o-box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
    box-shadow: inset 0 0 3px rgba(0, 0, 0, 0.3);
    border-radius: 20px;
}

    .flex-control-paging li a:hover {
        background: #333;
        background: rgba(0, 0, 0, 0.7);
    }

    .flex-control-paging li a.flex-active {
        background: #000;
        background: rgba(0, 0, 0, 0.9);
        cursor: default;
    }

.flex-control-thumbs {
    margin: 5px 0 0;
    position: static;
    overflow: hidden;
}

    .flex-control-thumbs li {
        width: 25%;
        float: left;
        margin: 0;
    }

    .flex-control-thumbs img {
        width: 100%;
        height: auto;
        display: block;
        opacity: .7;
        cursor: pointer;
        -moz-user-select: none;
        -webkit-transition: all 1s ease;
        -o-transition: all 1s ease;
        transition: all 1s ease;
    }

        .flex-control-thumbs img:hover {
            opacity: 1;
        }

    .flex-control-thumbs .flex-active {
        opacity: 1;
        cursor: default;
    }
/* ====================================================================================================================
 * RESPONSIVE
 * ====================================================================================================================*/
@media screen and (max-width: 860px) {
    .flex-direction-nav .flex-prev {
        opacity: 1;
        left: 10px;
    }

    .flex-direction-nav .flex-next {
        opacity: 1;
        right: 10px;
    }
}

.jqvmap-label {
    position: absolute;
    display: none;
    border-radius: 3px;
    background: #292929;
    color: white;
    font-family: sans-serif, Verdana;
    font-size: smaller;
    padding: 3px;
    pointer-events: none;
}

.jqvmap-pin {
    pointer-events: none;
}

.jqvmap-zoomin, .jqvmap-zoomout {
    position: absolute;
    left: 10px;
    border-radius: 3px;
    background: #000000;
    padding: 3px;
    color: white;
    width: 10px;
    height: 10px;
    cursor: pointer;
    line-height: 10px;
    text-align: center;
}

.jqvmap-zoomin {
    top: 10px;
}

.jqvmap-zoomout {
    top: 30px;
}

.jqvmap-region {
    cursor: pointer;
}

.jqvmap-ajax_response {
    width: 100%;
    height: 500px;
}
/*
 * metismenu - v2.6.1
 * A jQuery menu plugin
 * https://github.com/onokumus/metisMenu#readme
 *
 * Made by Osman Nuri Okumuş <onokumus@gmail.com> (https://github.com/onokumus)
 * Under MIT License
 */
.metismenu .arrow {
    float: right;
    line-height: 1.42857;
}

*[dir="rtl"] .metismenu .arrow {
    float: left;
}
/*
 * Require Bootstrap
 * https://github.com/twbs/bootstrap
*/
.metismenu .glyphicon.arrow:before {
    content: "\e079";
}

.metismenu .active > a > .glyphicon.arrow:before {
    content: "\e114";
}
/*
 * Require Font-Awesome
 * http://fortawesome.github.io/Font-Awesome/
*/
.metismenu .fa.arrow:before {
    content: "\f104";
}

.metismenu .active > a > .fa.arrow:before {
    content: "\f107";
}
/*
 * Require Ionicons
 * http://ionicons.com/
*/
.metismenu .ion.arrow:before {
    content: "\f3d2"
}

.metismenu .active > a > .ion.arrow:before {
    content: "\f3d0";
}

.metismenu .plus-times {
    float: right;
}

*[dir="rtl"] .metismenu .plus-times {
    float: left;
}

.metismenu .fa.plus-times:before {
    content: "\f067";
}

.metismenu .active > a > .fa.plus-times {
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
}

.metismenu .plus-minus {
    float: right;
}

*[dir="rtl"] .metismenu .plus-minus {
    float: left;
}

.metismenu .fa.plus-minus:before {
    content: "\f067";
}

.metismenu .active > a > .fa.plus-minus:before {
    content: "\f068";
}

.metismenu .collapse {
    display: none;
}

    .metismenu .collapse.in {
        display: block;
    }

.metismenu .collapsing {
    position: relative;
    height: 0;
    overflow: hidden;
    -webkit-transition-timing-function: ease;
    -o-transition-timing-function: ease;
    transition-timing-function: ease;
    -webkit-transition-duration: .35s;
    -o-transition-duration: .35s;
    transition-duration: .35s;
    -webkit-transition-property: height, visibility;
    -o-transition-property: height, visibility;
    transition-property: height, visibility;
}

.metismenu .has-arrow {
    position: relative;
}

    .metismenu .has-arrow::after {
        position: absolute;
        content: '';
        width: .5em;
        height: .5em;
        border-width: 1px 0 0 1px;
        border-style: solid;
        border-color: #fff;
        right: 1em;
        -webkit-transform: rotate(-45deg) translate(0, -50%);
        -ms-transform: rotate(-45deg) translate(0, -50%);
        -o-transform: rotate(-45deg) translate(0, -50%);
        transform: rotate(-45deg) translate(0, -50%);
        -webkit-transform-origin: top;
        -ms-transform-origin: top;
        -o-transform-origin: top;
        transform-origin: top;
        top: 50%;
        -webkit-transition: all .3s ease-out;
        -o-transition: all .3s ease-out;
        transition: all .3s ease-out;
    }

*[dir="rtl"] .metismenu .has-arrow::after {
    right: auto;
    left: 1em;
    -webkit-transform: rotate(135deg) translate(0, -50%);
    -ms-transform: rotate(135deg) translate(0, -50%);
    -o-transform: rotate(135deg) translate(0, -50%);
    transform: rotate(135deg) translate(0, -50%);
}

.metismenu .active > .has-arrow::after,
.metismenu .has-arrow[aria-expanded="true"]::after {
    -webkit-transform: rotate(-135deg) translate(0, -50%);
    -ms-transform: rotate(-135deg) translate(0, -50%);
    -o-transform: rotate(-135deg) translate(0, -50%);
    transform: rotate(-135deg) translate(0, -50%);
}

.cropper {
    position: relative;
}

.cropper-toolbar {
    background-color: rgba(0, 0, 0, 0.75);
    border-radius: 4px;
    bottom: 15px;
    display: block;
    left: 50%;
    margin-bottom: 0;
    margin-right: -50%;
    position: absolute;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    z-index: 1000;
}

    .cropper-toolbar .btn {
        border: none;
        display: block;
        float: left;
        height: 36px;
        line-height: 36px;
        padding: 0;
        width: 36px;
    }

.table.dataTable {
    border-collapse: separate;
    clear: both;
    margin-bottom: 5px;
    margin-top: 5px;
    max-width: none;
    table-layout: fixed;
}

    .table.dataTable > tbody > tr {
        cursor: pointer;
    }

    .table.dataTable.noclick > tbody > tr {
        cursor: default;
    }

    .table.dataTable > thead > tr > th,
    .table.dataTable > thead > tr > td {
    }

    .table.dataTable > thead > tr > th,
    .table.dataTable > thead > tr > td,
    .table.dataTable > tbody > tr > th,
    .table.dataTable > tbody > tr > td,
    .table.dataTable > tfoot > tr > th,
    .table.dataTable > tfoot > tr > td {
        -webkit-box-sizing: content-box;
        box-sizing: content-box;
        outline: none;
        max-width: 0;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .table.dataTable .sorting,
    .table.dataTable .sorting_asc,
    .table.dataTable .sorting_desc {
        cursor: pointer;
        position: relative;
        white-space: nowrap;
    }

        .table.dataTable .sorting:after,
        .table.dataTable .sorting_asc:after,
        .table.dataTable .sorting_desc:after {
            display: inline-block;
            font-family: FontAwesome;
            font-size: 12px;
            height: 20px;
            line-height: 20px;
            margin-left: 5px;
            text-align: center;
            width: 20px;
        }

    .table.dataTable .sorting_asc,
    .table.dataTable .sorting_desc {
        border-bottom-color: #d9230f;
        color: #d9230f;
    }

    .table.dataTable .sorting:after {
        color: #808080;
        content: "\f0dc";
    }

    .table.dataTable .sorting_asc:after {
        color: #d9230f;
        content: "\f0de";
    }

    .table.dataTable .sorting_desc:after {
        color: #d9230f;
        content: "\f0dd";
    }

.dataTables_length {
    margin-bottom: 5px;
    margin-top: 5px;
    text-align: left;
    margin-left: -15px; /* causing page to be 30 wider than visible on smartphone - see elephant.css .row style */
}

    .dataTables_length > label {
        font-weight: normal;
        text-align: left;
        white-space: nowrap;
    }

        .dataTables_length > label > select {
            display: inline-block;
            width: 50px;
        }
/*@media screen and (max-width: 767px) {
  .dataTables_length {
    text-align: center;
  }
}*/
.dataTables_filter {
    text-align: right;
}

    .dataTables_filter > label {
        background-color: transparent;
        border: 0;
        color: transparent;
        font: 0/0 a;
        font-weight: normal;
        position: relative;
        text-shadow: none;
    }

        .dataTables_filter > label:after {
            color: #ddd;
            content: "\f002";
            display: block;
            font-family: FontAwesome;
            font-size: 13px;
            height: 30px;
            left: 0;
            line-height: 30px;
            margin-left: 1px;
            pointer-events: none;
            position: absolute;
            text-align: center;
            top: 0;
            width: 30px;
            z-index: 5;
        }

        .dataTables_filter > label > input {
            display: inline-block;
            font-family: "Roboto", sans-serif;
            padding-left: 30px;
            width: auto;
        }

@media screen and (max-width: 767px) {
    .dataTables_filter > label {
        display: block;
        margin-bottom: 10px;
        margin-top: 10px;
    }

        .dataTables_filter > label > input {
            display: block;
            width: 100%;
        }
}

.dataTables_info {
    line-height: 30px;
    white-space: nowrap;
}

@media screen and (max-width: 767px) {
    .dataTables_info {
        text-align: center;
    }
}

.dataTables_paginate {
    margin-top: 5px;
    text-align: right;
    white-space: nowrap;
}

    .dataTables_paginate .pagination {
        margin-bottom: 0;
        margin-top: 0;
        white-space: nowrap;
    }

/*@media screen and (max-width: 767px) {
    .dataTables_paginate {
        margin-top: 10px;
        text-align: center;
        margin-bottom: 50px;
    }
}*/

.dataTables_processing {
    left: 50%;
    margin-left: -100px;
    margin-top: -26px;
    padding-bottom: 15px;
    padding-top: 15px;
    position: absolute;
    text-align: center;
    top: 50%;
    width: 200px;
}

.table-bordered.dataTable > thead > tr > th,
.table-bordered.dataTable > thead > tr > td,
.table-bordered.dataTable > tbody > tr > th,
.table-bordered.dataTable > tbody > tr > td,
.table-bordered.dataTable > tfoot > tr > th,
.table-bordered.dataTable > tfoot > tr > td {
    border-left-width: 0;
}

    .table-bordered.dataTable > thead > tr > th:last-child,
    .table-bordered.dataTable > thead > tr > td:last-child,
    .table-bordered.dataTable > tbody > tr > th:last-child,
    .table-bordered.dataTable > tbody > tr > td:last-child,
    .table-bordered.dataTable > tfoot > tr > th:last-child,
    .table-bordered.dataTable > tfoot > tr > td:last-child {
        border-right-width: 0;
    }

.table-bordered.dataTable > tbody > tr > th,
.table-bordered.dataTable > tbody > tr > td {
    border-bottom-width: 0;
}

.table-bordered.dataTable .sorting,
.table-bordered.dataTable .sorting_asc,
.table-bordered.dataTable .sorting_desc {
    border-color: #ddd;
    padding-right: 30px;
}

    .table-bordered.dataTable .sorting:after,
    .table-bordered.dataTable .sorting_asc:after,
    .table-bordered.dataTable .sorting_desc:after {
        bottom: 8px;
        display: block;
        position: absolute;
        right: 4px;
    }

.dataTables_scrollHead .table {
    margin-bottom: 0;
}

    .dataTables_scrollHead .table.table-bordered {
        border-bottom-width: 0;
    }

.dataTables_scrollBody .table {
    border-top: none;
    margin-bottom: 0;
    margin-top: 0;
}

    .dataTables_scrollBody .table > tbody > tr:first-child > td,
    .dataTables_scrollBody .table > tbody > tr:first-child > td {
        border-top: none;
    }

    .dataTables_scrollBody .table .sorting:after,
    .dataTables_scrollBody .table .sorting_asc:after,
    .dataTables_scrollBody .table .sorting_desc:after {
        display: none;
    }

.dataTables_scrollFoot .table {
    border-top: none;
    margin-top: 0;
}

.table-responsive > .dataTables_wrapper > .row {
    margin-left: 0;
    margin-right: 0;
}

    .table-responsive > .dataTables_wrapper > .row > [class^="col-"]:first-child {
        padding-left: 0;
    }

    .table-responsive > .dataTables_wrapper > .row > [class^="col-"]:last-child {
        padding-right: 0;
    }

.dt-button-info {
    background-color: #fff;
    border: 2px solid #d9230f;
    border-radius: 4px;
    -webkit-box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.5);
    box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.5);
    left: 50%;
    margin-left: -200px;
    margin-top: -100px;
    padding: 15px;
    position: fixed;
    text-align: center;
    top: 50%;
    width: 400px;
    z-index: 21;
}

    .dt-button-info h2 {
        margin-bottom: 10px;
        margin-top: 0;
    }

.dt-button-collection.dropdown-menu {
    -webkit-column-gap: 8px;
    column-gap: 8px;
    display: block;
    z-index: 2002;
}

    .dt-button-collection.dropdown-menu > li:not(.active) > a {
        background-color: transparent;
        color: #444;
    }

    .dt-button-collection.dropdown-menu.fixed {
        border-radius: 0;
        left: 50%;
        margin-left: -75px;
        position: fixed;
        top: 50%;
    }

        .dt-button-collection.dropdown-menu.fixed.two-column {
            margin-left: -150px;
        }

        .dt-button-collection.dropdown-menu.fixed.three-column {
            margin-left: -225px;
        }

        .dt-button-collection.dropdown-menu.fixed.four-column {
            margin-left: -300px;
        }

    .dt-button-collection.dropdown-menu > * {
        -webkit-column-break-inside: avoid;
        break-inside: avoid;
    }

    .dt-button-collection.dropdown-menu.two-column {
        -webkit-column-count: 2;
        column-count: 2;
        padding-bottom: 1px;
        width: 300px;
    }

    .dt-button-collection.dropdown-menu.three-column {
        -webkit-column-count: 3;
        column-count: 3;
        padding-bottom: 1px;
        width: 450px;
    }

    .dt-button-collection.dropdown-menu.four-column {
        -webkit-column-count: 4;
        column-count: 4;
        padding-bottom: 1px;
        width: 600px;
    }

.dt-button-background {
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 2001;
}

@media screen and (max-width: 767px) {
    .dt-buttons {
        float: none;
        margin-bottom: 5px;
        text-align: center;
        width: 100%;
    }

        .dt-buttons > a.btn {
            float: none;
        }
}

.dataTable.DTCR_clonedTable {
    background-color: rgba(255, 255, 255, 0.7);
    position: absolute;
    z-index: 202;
}

.DTCR_pointer {
    background-color: #d9230f;
    width: 1px;
    z-index: 201;
}

.dataTable.fixedHeader-floating,
.dataTable.fixedHeader-locked {
    background-color: #fff;
    margin-bottom: 0;
    margin-top: 0;
}

.dataTable.fixedHeader-floating {
    position: fixed;
}

.dataTable.fixedHeader-locked {
    position: absolute;
}

@media print {
    .dataTable.fixedHeader-floating {
        display: none;
    }
}

.dtr-inline.collapsed > tbody > tr > td.child,
.dtr-inline.collapsed > tbody > tr > th.child,
.dtr-inline.collapsed > tbody > tr > td.dataTables_empty {
    cursor: default;
}

    .dtr-inline.collapsed > tbody > tr > td.child:before,
    .dtr-inline.collapsed > tbody > tr > th.child:before,
    .dtr-inline.collapsed > tbody > tr > td.dataTables_empty:before {
        display: none;
    }

.dtr-inline.collapsed > tbody > tr > td:first-child,
.dtr-inline.collapsed > tbody > tr > th:first-child {
    cursor: pointer;
    padding-left: 30px;
    position: relative;
}

    .dtr-inline.collapsed > tbody > tr > td:first-child:before,
    .dtr-inline.collapsed > tbody > tr > th:first-child:before {
        color: #808080;
        content: "\f196";
        display: block;
        font-family: FontAwesome;
        font-size: 16px;
        height: 16px;
        left: 5px;
        line-height: 16px;
        position: absolute;
        text-align: center;
        top: 10px;
        width: 16px;
    }

.dtr-inline.collapsed > tbody > tr.parent > td:first-child:before,
.dtr-inline.collapsed > tbody > tr.parent > th:first-child:before {
    content: "\f147";
}

.dtr-inline.collapsed > tbody > tr.child > td:before,
.dtr-inline.collapsed > tbody > tr.child > th:before {
    display: none;
}

.dtr-inline.collapsed > tbody > tr.child > td > ul,
.dtr-inline.collapsed > tbody > tr.child > th > ul {
    display: table;
    list-style: none;
    margin: 0;
    padding: 0;
    width: 100%;
}

    .dtr-inline.collapsed > tbody > tr.child > td > ul > li,
    .dtr-inline.collapsed > tbody > tr.child > th > ul > li {
        display: table-row;
    }

.dtr-inline.collapsed > tbody > tr.child > td .dtr-title,
.dtr-inline.collapsed > tbody > tr.child > th .dtr-title {
    display: table-cell;
    font-weight: 500;
    padding-right: 16px;
    white-space: nowrap;
    width: 1%;
}

.dtr-inline.collapsed > tbody > tr.child > td .dtr-data,
.dtr-inline.collapsed > tbody > tr.child > th .dtr-data {
    display: table-cell;
    padding-bottom: 8px;
    padding-top: 8px;
    width: 99%;
}

.dtr-column > tbody > tr > td.control,
.dtr-column > tbody > tr > th.control {
    cursor: pointer;
    position: relative;
}

    .dtr-column > tbody > tr > td.control:before,
    .dtr-column > tbody > tr > th.control:before {
        color: #808080;
        content: "\f196";
        display: block;
        font-family: FontAwesome;
        font-size: 16px;
        height: 16px;
        left: 5px;
        line-height: 16px;
        position: absolute;
        text-align: center;
        top: 10px;
        width: 16px;
    }

.dtr-column > tbody > tr.parent > td.control:before,
.dtr-column > tbody > tr.parent > th.control:before {
    content: "\f147";
}

.dtr-column > tbody > tr.child {
    padding: 10px 15px;
}

    .dtr-column > tbody > tr.child:hover {
        background-color: transparent;
    }

    .dtr-column > tbody > tr.child > td.control:before,
    .dtr-column > tbody > tr.child > th.control:before {
        display: none;
    }

.dataTable.dt-rowReorder > tbody > tr > td:first-child,
.dataTable.dt-rowReorder > tbody > tr > th:first-child {
    white-space: nowrap;
}

    .dataTable.dt-rowReorder > tbody > tr > td:first-child:before,
    .dataTable.dt-rowReorder > tbody > tr > th:first-child:before {
        color: #808080;
        content: "\f0c9";
        cursor: move;
        display: inline-block;
        font-family: FontAwesome;
        font-size: 12px;
        height: 20px;
        line-height: 20px;
        margin-right: 5px;
        text-align: center;
        width: 20px;
    }

.dataTable.dt-rowReorder-float {
    opacity: 0.8;
    outline: 2px solid #d9230f;
    outline-offset: -2px;
    position: absolute !important;
    table-layout: fixed;
    z-index: 2001;
}

.dt-rowReorder-moving {
    outline: 2px solid #444;
    outline-offset: -2px;
}

.dt-rowReorder-noOverflow {
    overflow-x: hidden;
}

.dataTable td.reorder {
    cursor: move;
    text-align: center;
}

.DTS {
    display: block;
}

    .DTS .table > tbody > tr > th,
    .DTS .table > tbody > tr > td {
        white-space: nowrap;
    }

    .DTS .DTS_Loading {
        z-index: 1;
    }

    .DTS .dataTables_scrollBody {
        background: -webkit-repeating-linear-gradient(45deg, #f9f9f9, #f9f9f9 10px, #fff 10px, #fff 20px);
        background: -o-repeating-linear-gradient(45deg, #f9f9f9, #f9f9f9 10px, #fff 10px, #fff 20px);
        background: repeating-linear-gradient(45deg, #f9f9f9, #f9f9f9 10px, #fff 10px, #fff 20px);
    }

        .DTS .dataTables_scrollBody .table {
            z-index: 2;
        }

    .DTS .dataTables_paginate,
    .DTS .dataTables_length {
        display: none;
    }

div.DTS tbody tr.even {
    background-color: #fff;
}

.bootstrap-table .table {
    background-color: transparent;
    border-bottom: 1px solid #ddd;
    border-collapse: collapse !important;
    border-radius: 0;
    margin-bottom: 0 !important;
}

    .bootstrap-table .table:not(.table-condensed),
    .bootstrap-table .table:not(.table-condensed) > tbody > tr > th,
    .bootstrap-table .table:not(.table-condensed) > tfoot > tr > th,
    .bootstrap-table .table:not(.table-condensed) > thead > tr > td,
    .bootstrap-table .table:not(.table-condensed) > tbody > tr > td,
    .bootstrap-table .table:not(.table-condensed) > tfoot > tr > td {
        padding: 8px;
    }

    .bootstrap-table .table.table-no-bordered > thead > tr > th,
    .bootstrap-table .table.table-no-bordered > tbody > tr > td {
        border-right: 2px solid transparent;
    }

        .bootstrap-table .table.table-no-bordered > tbody > tr > td:last-child {
            border-right: none;
        }

.fixed-table-container {
    position: relative;
    clear: both;
    border: 1px solid #ddd;
    border-radius: #ddd;
}

    .fixed-table-container.table-no-bordered {
        border: 1px solid transparent;
    }

.fixed-table-footer,
.fixed-table-header {
    overflow: hidden;
}

.fixed-table-footer {
    border-top: 1px solid #ddd;
}

.fixed-table-body {
    overflow-x: auto;
    overflow-y: scroll;
    height: 100%;
}

.fixed-table-container table {
    width: 100%;
}

.fixed-table-container thead th {
    height: 0;
    padding: 0;
    margin: 0;
    border-left: 1px solid #ddd;
}

    .fixed-table-container thead th:focus {
        outline: 0 solid transparent;
    }

    .fixed-table-container thead th:first-child {
        border-left: none;
        border-top-left-radius: 4px;
    }

    .fixed-table-container thead th .th-inner,
    .fixed-table-container tbody td .th-inner {
        padding: 8px;
        line-height: 24px;
        vertical-align: top;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .fixed-table-container thead th .sortable {
        cursor: pointer;
        padding-right: 30px;
        position: relative;
    }

        .fixed-table-container thead th .sortable:after {
            bottom: 8px;
            display: block;
            font-family: FontAwesome;
            font-size: 12px;
            height: 20px;
            line-height: 20px;
            margin-left: 5px;
            position: absolute;
            right: 4px;
            text-align: center;
            width: 20px;
        }

    .fixed-table-container thead th .both:after {
        color: #808080;
        content: "\f0dc";
    }

    .fixed-table-container thead th .asc:after {
        color: #d9230f;
        content: "\f0de";
    }

    .fixed-table-container thead th .desc:after {
        color: #d9230f;
        content: "\f0dd";
    }

.fixed-table-container th.detail {
    width: 30px;
}

.fixed-table-container tbody td {
    border-left: 1px solid #ddd;
}

.fixed-table-container tbody tr:first-child td {
    border-top: none;
}

.fixed-table-container tbody td:first-child {
    border-left: none;
}
/* the same color with .active */
.fixed-table-container tbody .selected td {
    background-color: #f5f5f5;
}

.fixed-table-container .bs-checkbox {
    text-align: center;
}

    .fixed-table-container .bs-checkbox .th-inner {
        padding: 8px 0;
    }

.fixed-table-container input[type="radio"],
.fixed-table-container input[type="checkbox"] {
    margin: 0 auto !important;
}

.fixed-table-container .no-records-found {
    text-align: center;
}

.fixed-table-pagination div.pagination,
.fixed-table-pagination .pagination-detail {
    margin-top: 10px;
    margin-bottom: 10px;
}

    .fixed-table-pagination div.pagination .pagination {
        margin: 0;
    }

.fixed-table-pagination .pagination a {
    padding: 6px 12px;
    line-height: 1.428571429;
}

.fixed-table-pagination .pagination-info {
    line-height: 34px;
    margin-right: 5px;
}

.fixed-table-pagination .btn-group {
    position: relative;
    display: inline-block;
    vertical-align: middle;
}

.fixed-table-pagination .dropup .dropdown-menu {
    margin-bottom: 0;
}

.fixed-table-pagination .page-list {
    display: inline-block;
}

.fixed-table-toolbar .columns-left {
    margin-right: 5px;
}

.fixed-table-toolbar .columns-right {
    margin-left: 5px;
}

.fixed-table-toolbar .columns label {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: normal;
    line-height: 1.428571429;
}

.fixed-table-toolbar .bs-bars,
.fixed-table-toolbar .search,
.fixed-table-toolbar .columns {
    position: relative;
    margin-top: 10px;
    margin-bottom: 10px;
    line-height: 34px;
}

.fixed-table-pagination li.disabled a {
    pointer-events: none;
    cursor: default;
}

.fixed-table-loading {
    background-color: #fff;
    bottom: 0;
    display: none;
    left: 0;
    position: absolute;
    right: 0;
    text-align: center;
    top: 42px;
    z-index: 99;
}

.fixed-table-body .card-view .title {
    font-weight: bold;
    display: inline-block;
    min-width: 30%;
    text-align: left !important;
}
/* support bootstrap 2 */
.fixed-table-body thead th .th-inner {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.table th, .table td {
    vertical-align: middle;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

.fixed-table-toolbar .dropdown-menu {
    text-align: left;
    max-height: 300px;
    overflow: auto;
}

.fixed-table-toolbar .btn-group > .btn-group {
    display: inline-block;
    margin-left: -1px !important;
}

    .fixed-table-toolbar .btn-group > .btn-group > .btn {
        border-radius: 0;
    }

    .fixed-table-toolbar .btn-group > .btn-group:first-child > .btn {
        border-top-left-radius: 4px;
        border-bottom-left-radius: 4px;
    }

    .fixed-table-toolbar .btn-group > .btn-group:last-child > .btn {
        border-top-right-radius: 4px;
        border-bottom-right-radius: 4px;
    }

.bootstrap-table .table > thead > tr > th {
    vertical-align: bottom;
    border-bottom: 1px solid #ddd;
}
/* support bootstrap 3 */
.bootstrap-table .table thead > tr > th {
    padding: 0;
    margin: 0;
}

.bootstrap-table .fixed-table-footer tbody > tr > td {
    padding: 0 !important;
}

.bootstrap-table .fixed-table-footer .table {
    border-bottom: none;
    border-radius: 0;
    padding: 0 !important;
}

.pull-right .dropdown-menu {
    right: 0;
    left: auto;
}
/* calculate scrollbar width */
p.fixed-table-scroll-inner {
    width: 100%;
    height: 200px;
}

div.fixed-table-scroll-outer {
    top: 0;
    left: 0;
    visibility: hidden;
    width: 200px;
    height: 150px;
    overflow: hidden;
}

.datepicker {
    border-radius: 4px;
    direction: ltr;
    padding: 5px;
}

    .datepicker table {
        margin: 0;
        -webkit-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

        .datepicker table tr th,
        .datepicker table tr td {
            border: none;
            border-radius: 4px;
            height: 30px;
            text-align: center;
            width: 30px;
        }

            .datepicker table tr td.old, .datepicker table tr td.new {
                color: #ddd;
            }

            .datepicker table tr td.highlighted, .datepicker table tr td.range {
                border-radius: 0;
            }

            .datepicker table tr td.day:hover, .datepicker table tr td.focused {
                background-color: #d9230f;
                color: #fff;
                cursor: pointer;
            }

            .datepicker table tr td.disabled, .datepicker table tr td.disabled:hover {
                background-color: transparent;
                color: #ddd;
                cursor: default;
            }

        .datepicker table tr span {
            border-radius: 4px;
            cursor: pointer;
            display: block;
            float: left;
            height: 54px;
            line-height: 54px;
            margin: 1%;
            width: 23%;
        }

            .datepicker table tr span.old, .datepicker table tr span.new {
                color: #ddd;
            }

            .datepicker table tr span:hover, .datepicker table tr span.focused {
                background-color: #d9230f;
                color: #fff;
            }

            .datepicker table tr span.active {
                background-color: #d9230f;
                color: #fff;
            }

                .datepicker table tr span.active:hover {
                    background-color: #a91b0c;
                    color: #fff;
                }

            .datepicker table tr span.disabled, .datepicker table tr span.disabled:hover {
                background-color: transparent;
                color: #ddd;
                cursor: default;
            }

.datepicker-rtl {
    direction: rtl;
}

    .datepicker-rtl table tr span {
        float: right;
    }

.datepicker .datepicker-switch {
    width: 150px;
}

.datepicker .datepicker-switch,
.datepicker .next,
.datepicker .prev,
.datepicker .today,
.datepicker .clear {
    cursor: pointer;
}

    .datepicker .datepicker-switch:hover,
    .datepicker .next:hover,
    .datepicker .prev:hover,
    .datepicker .today:hover,
    .datepicker .clear:hover {
        background-color: #d9230f;
        color: #fff;
    }

.datepicker .cw {
    font-size: 10px;
    padding: 0 5px;
    vertical-align: middle;
    width: 12px;
}

.datepicker-inline {
    width: 220px;
}

.dropdown-menu.datepicker-orient-top:before {
    border-top-color: #ddd;
    top: 100%;
}

.dropdown-menu.datepicker-orient-top:after {
    border-top-color: #fff;
    top: 100%;
    margin-top: -1px;
}

.dropdown-menu.datepicker-orient-right:before,
.dropdown-menu.datepicker-orient-right:after {
    left: auto;
    right: 7px;
}

.dropdown-menu.datepicker-orient-bottom:before {
    border-bottom-color: #ddd;
    bottom: 100%;
}

.dropdown-menu.datepicker-orient-bottom:after {
    border-bottom-color: #fff;
    bottom: 100%;
    margin-bottom: -1px;
}

.dropdown-menu.datepicker-orient-left:before,
.dropdown-menu.datepicker-orient-left:after {
    left: 7px;
    right: auto;
}

.datepicker table tr td.highlighted {
    background-color: #029acf;
    color: #fff;
}

    .datepicker table tr td.highlighted:hover {
        background-color: #02749c;
        color: #fff;
    }

    .datepicker table tr td.highlighted.disabled, .datepicker table tr td.highlighted.disabled:hover {
        background-color: #029acf;
        color: #ddd;
    }

.datepicker table tr td.today {
    background-color: #9b479f;
    color: #fff;
}

    .datepicker table tr td.today:hover {
        background-color: #79377c;
        color: #fff;
    }

    .datepicker table tr td.today.disabled, .datepicker table tr td.today.disabled:hover {
        background-color: #9b479f;
        color: #ddd;
    }

.datepicker table tr td.range {
    background-color: #ddd;
    color: #777;
}

    .datepicker table tr td.range:hover {
        background-color: #c4c4c4;
        color: #777;
    }

    .datepicker table tr td.range.disabled, .datepicker table tr td.range.disabled:hover {
        background-color: #ddd;
        color: #ddd;
    }

    .datepicker table tr td.range.highlighted {
        background-color: #70bcd6;
        color: #000;
    }

        .datepicker table tr td.range.highlighted:hover {
            background-color: #48a9cb;
            color: #000;
        }

        .datepicker table tr td.range.highlighted.disabled, .datepicker table tr td.range.highlighted.disabled:hover {
            background-color: #70bcd6;
            color: #ddd;
        }

    .datepicker table tr td.range.today {
        background-color: #bc92be;
        color: #000;
    }

        .datepicker table tr td.range.today:hover {
            background-color: #a872ab;
            color: #000;
        }

        .datepicker table tr td.range.today.disabled, .datepicker table tr td.range.today.disabled:hover {
            background-color: #bc92be;
            color: #ddd;
        }

.datepicker table tr td.selected {
    background-color: #777;
    color: #fff;
}

    .datepicker table tr td.selected:hover {
        background-color: #5e5e5e;
        color: #fff;
    }

    .datepicker table tr td.selected.disabled, .datepicker table tr td.selected.disabled:hover {
        background-color: #777;
        color: #ddd;
    }

.datepicker table tr td.active {
    background-color: #d9230f;
    color: #fff;
}

    .datepicker table tr td.active:hover {
        background-color: #a91b0c;
        color: #fff;
    }

    .datepicker table tr td.active.disabled, .datepicker table tr td.active.disabled:hover {
        background-color: #d9230f;
        color: #ddd;
    }

.input-daterange {
    width: 100%;
}

    .input-daterange .form-control {
        text-align: center;
    }

    .input-daterange .input-group-addon {
        border-width: 1px 0;
        cursor: pointer;
        min-width: 16px;
        padding-left: 5px;
        padding-right: 5px;
        width: auto;
    }

.slider {
    direction: ltr;
    position: relative;
}

    .slider,
    .slider * {
        -ms-touch-action: none;
        touch-action: none;
        -webkit-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

.slider-base {
    height: 100%;
    position: relative;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    width: 100%;
    z-index: 1;
}

.slider-origin {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}

.slider-background {
    background-color: #f5f5f5;
}

.slider-connect {
    -webkit-transition: background-color 0.45s;
    -o-transition: background-color 0.45s;
    transition: background-color 0.45s;
}

.slider-handle {
    border: 2px solid transparent;
    border-radius: 3px;
    cursor: pointer;
    position: relative;
    -webkit-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
    z-index: 1;
}

.slider-circle .slider-handle {
    border-radius: 50%;
}

.slider-stacking .slider-handle {
    z-index: 10;
}

.slider-state-tap .slider-origin {
    -webkit-transition: left 0.3s, top 0.3s;
    -o-transition: left 0.3s, top 0.3s;
    transition: left 0.3s, top 0.3s;
}

.slider-state-drag * {
    cursor: inherit !important;
}

.slider-horizontal {
    display: block;
    height: 2px;
    margin: 20px 0;
}

    .slider-horizontal .slider-handle {
        height: 12px;
        left: -6px;
        top: -5px;
        width: 12px;
    }

    .slider-horizontal .slider-draggable {
        cursor: w-resize;
    }

.slider-vertical {
    display: inline-block;
    margin: 0 20px;
    width: 2px;
}

    .slider-vertical .slider-handle {
        height: 12px;
        left: -5px;
        top: -6px;
        width: 12px;
    }

    .slider-vertical .slider-draggable {
        cursor: n-resize;
    }

.slider-default .slider-connect, .slider-default.slider-connect {
    background-color: #777;
}

.slider-default .slider-handle {
    background-color: #777;
    border-color: #777;
}

.slider-primary .slider-connect, .slider-primary.slider-connect {
    background-color: #d9230f;
}

.slider-primary .slider-handle {
    background-color: #d9230f;
    border-color: #d9230f;
}

.slider-success .slider-connect, .slider-success.slider-connect {
    background-color: #469408;
}

.slider-success .slider-handle {
    background-color: #469408;
    border-color: #469408;
}

.slider-info .slider-connect, .slider-info.slider-connect {
    background-color: #029acf;
}

.slider-info .slider-handle {
    background-color: #029acf;
    border-color: #029acf;
}

.slider-warning .slider-connect, .slider-warning.slider-connect {
    background-color: #9b479f;
}

.slider-warning .slider-handle {
    background-color: #9b479f;
    border-color: #9b479f;
}

.slider-danger .slider-connect, .slider-danger.slider-connect {
    background-color: #d9831f;
}

.slider-danger .slider-handle {
    background-color: #d9831f;
    border-color: #d9831f;
}

.slider-background[style^="top: 0"] .slider-handle,
.slider-background[style^="left: 0"] .slider-handle {
    background-color: #fff;
    border-color: #f5f5f5;
}

.slider-connect[style^="top: 100"] .slider-handle,
.slider-connect[style^="left: 100"] .slider-handle {
    background-color: #fff;
    border-color: #f5f5f5;
}

.slider-handle.slider-active {
    -webkit-transform: scale(1.5);
    -ms-transform: scale(1.5);
    -o-transform: scale(1.5);
    transform: scale(1.5);
}

.slider[disabled] .slider-connect, .slider[disabled].slider-connect {
    background-color: #808080;
}

.slider[disabled] .slider-handle {
    background-color: #808080;
    border-color: #808080;
    cursor: not-allowed;
}

.slider-tooltip {
    background-color: #ddd;
    border: 1px solid #ddd;
    border-radius: 3px;
    display: block;
    font-size: 12px;
    padding: 2px 4px;
    position: absolute;
    text-align: center;
}

.slider-horizontal .slider-tooltip {
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
}

.slider-horizontal .slider-handle-lower .slider-tooltip {
    bottom: 100%;
    margin-bottom: 5px;
}

.slider-horizontal .slider-handle-upper .slider-tooltip {
    margin-top: 5px;
    top: 100%;
}

.slider-vertical .slider-tooltip {
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.slider-vertical .slider-handle-lower .slider-tooltip {
    left: 100%;
    margin-left: 5px;
}

.slider-vertical .slider-handle-upper .slider-tooltip {
    margin-right: 5px;
    right: 100%;
}

.slider-pips {
    position: absolute;
}

.slider-value {
    color: #777;
    font-size: 12px;
    line-height: 1;
    position: absolute;
    text-align: center;
}

.slider-value-sub {
    color: #808080;
    font-size: 10px;
}

.slider-marker {
    background-color: #808080;
    position: absolute;
}

.slider-marker-sub,
.slider-marker-large {
    background-color: #777;
}

.slider-pips-horizontal {
    left: 0;
    min-height: 52px;
    padding: 10px 0;
    top: 100%;
    width: 100%;
}

    .slider-pips-horizontal .slider-value {
        margin-left: -20px;
        padding-top: 20px;
        width: 40px;
    }

@media (max-width: 992px) {
    .slider-pips-horizontal .slider-value {
        display: none;
    }
}

.slider-pips-horizontal .slider-value-sub {
    padding-top: 15px;
}

.slider-pips-horizontal .slider-marker {
    height: 5px;
    width: 1px;
}

.slider-pips-horizontal .slider-marker-sub {
    height: 10px;
}

.slider-pips-horizontal .slider-marker-large {
    height: 15px;
}

.slider-pips-vertical {
    height: 100%;
    left: 100%;
    min-width: 52px;
    padding: 0 10px;
    top: 0;
}

    .slider-pips-vertical .slider-value {
        margin-left: 20px;
        margin-top: -6px;
        width: 15px;
    }

    .slider-pips-vertical .slider-value-sub {
        margin-top: -5px;
    }

    .slider-pips-vertical .slider-marker {
        height: 1px;
        width: 5px;
    }

    .slider-pips-vertical .slider-marker-sub {
        width: 10px;
    }

    .slider-pips-vertical .slider-marker-large {
        width: 15px;
    }

.ui-timepicker-wrapper {
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25);
    float: left;
    height: 162px;
    min-width: 120px;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 5px 0;
    z-index: 1000;
}

.ui-timepicker-list {
    list-style: none;
    margin-bottom: 0;
    padding-left: 0;
}

.ui-timepicker-am,
.ui-timepicker-pm {
    color: #444;
    cursor: pointer;
    display: block;
    line-height: 1.538462;
    padding: 5px 15px;
    white-space: nowrap;
}

    .ui-timepicker-am:hover,
    .ui-timepicker-pm:hover {
        background-color: #d9230f;
        color: #fff;
    }

.ui-timepicker-selected,
.ui-timepicker-selected:hover {
    background-color: #d9230f;
    color: #fff;
}

.ui-timepicker-duration {
    margin-left: 5px;
}

.ui-timepicker-selected .ui-timepicker-duration {
    color: #fff;
}

.ui-timepicker-disabled,
.ui-timepicker-disabled:hover {
    background-color: transparent;
    color: #ddd;
    cursor: default;
}
/*.toast {
  background-position: left top;
  background-repeat: no-repeat;
  -webkit-background-size: 50px 50px;
          background-size: 50px 50px;
  border-radius: 3px;
  -webkit-box-shadow: 0 0 3px #999;
          box-shadow: 0 0 3px #999;
  color: #fff;
  margin-bottom: 6px;
  overflow: hidden;
  padding: 15px 15px 15px 50px;
  position: relative;
  width: 300px;
}
.toast:last-child {
  margin-bottom: 0;
}
.toast:hover {
  -webkit-box-shadow: 0 0 4px #999;
          box-shadow: 0 0 4px #999;
  cursor: pointer;
  opacity: 1;
}
@media (max-width: 480px) {
  .toast {
    width: 100%;
  }
}
.toast-title {
  font-weight: 700;
}
.toast-message {
  word-wrap: break-word;
}
.toast-message a,
.toast-message label {
  color: #fff;
}
.toast-message a:hover {
  text-decoration: none;
}
.toast-close-button {
  background-color: transparent;
  background-image: none;
  border: 0;
  cursor: pointer;
  display: inline-block;
  float: right;
  font-size: 20px;
  font-weight: 700;
  opacity: 0.8;
  padding: 0;
  position: relative;
  right: -0.3em;
  text-align: center;
  top: -0.3em;
  -webkit-appearance: none;
}
.toast-close-button:hover, .toast-close-button:focus {
  opacity: 1;
}
.toast-progress {
  background-color: #f5f5f5;
  bottom: 0;
  height: 4px;
  left: 0;
  opacity: 0.5;
  position: absolute;
}
#toast-container {
  position: fixed;
  z-index: 1080;
}
@media (max-width: 480px) {
  #toast-container {
    left: 12px;
    right: 12px;
  }
}
.toast-top-left {
  left: 12px;
  top: 12px;
}
.toast-top-center {
  right: 0;
  top: 12px;
  width: 100%;
}
.toast-top-right {
  right: 12px;
  top: 12px;
}
.toast-bottom-left {
  bottom: 12px;
  left: 12px;
}
.toast-bottom-center {
  bottom: 12px;
  right: 0;
  width: 100%;
}
.toast-bottom-right {
  bottom: 12px;
  right: 12px;
}
.toast-top-center > .toast,
.toast-bottom-center > .toast {
  margin-left: auto;
  margin-right: auto;
}
.toast-top-full-width {
  left: 12px;
  right: 12px;
  top: 12px;
}
.toast-top-full-width > .toast {
  width: 100%;
}
.toast-bottom-full-width {
  bottom: 12px;
  left: 12px;
  right: 12px;
}
.toast-bottom-full-width > .toast {
  width: 100%;
}
.toast-success {
  background-color: #469408;
  background-image: url(/Content/data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http:/www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M17.737 10.757c0 .185-.074.37-.207.504l-6.366 6.366a.718.718 0 0 1-1.008 0L6.469 13.94a.718.718 0 0 1 0-1.008l1.007-1.007a.718.718 0 0 1 1.008 0l2.177 2.184 4.856-4.864a.718.718 0 0 1 1.008 0l1.007 1.007a.718.718 0 0 1 .207.504z'/%3E%3C/svg%3E);
  color: #fff;
}
.toast-info {
  background-color: #029acf;
  background-image: url(/Content/data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http:/www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M14.129 18.623c-.005.002-.503.168-.935.168-.239 0-.335-.05-.365-.071-.151-.105-.432-.303.049-1.26l.9-1.795c.534-1.066.613-2.096.22-2.903-.32-.66-.935-1.113-1.728-1.274a4.26 4.26 0 0 0-.862-.088c-1.664 0-2.785.972-2.832 1.014a.45.45 0 1 0 .443.764c.005-.002.503-.168.935-.168.237 0 .332.05.362.07.152.106.434.306-.046 1.262l-.9 1.795c-.535 1.066-.613 2.097-.22 2.903.32.66.934 1.113 1.729 1.274.282.057.573.088.859.088 1.665 0 2.787-.972 2.833-1.014a.452.452 0 0 0-.442-.765zM15.623 8.25a2.25 2.25 0 1 1-4.5 0 2.25 2.25 0 0 1 4.5 0z'/%3E%3C/svg%3E);
  color: #fff;
}
.toast-warning {
  background-color: #9b479f;
  background-image: url(/Content/data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http:/www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M14.115 10.2c0 .159-.141.3-.3.3s-.3-.141-.3-.3c0-.647-1.003-.9-1.5-.9-.159 0-.3-.141-.3-.3s.141-.3.3-.3c.872 0 2.1.46 2.1 1.5zm1.5 0c0-1.875-1.903-3-3.6-3s-3.6 1.125-3.6 3c0 .6.244 1.228.637 1.688.178.206.384.403.572.619.666.797 1.228 1.734 1.322 2.794h2.138c.094-1.059.656-1.997 1.322-2.794.187-.216.394-.412.572-.619.394-.46.637-1.087.637-1.688zm1.201 0c0 .966-.319 1.8-.966 2.513s-1.5 1.716-1.575 2.719c.272.159.441.46.441.769a.875.875 0 0 1-.234.6c.15.159.234.375.234.6a.898.898 0 0 1-.422.759.917.917 0 0 1 .122.441c0 .609-.478.9-1.022.9-.244.544-.788.9-1.378.9s-1.135-.356-1.378-.9c-.544 0-1.022-.291-1.022-.9a.92.92 0 0 1 .122-.441.9.9 0 0 1-.422-.759c0-.225.084-.441.234-.6a.875.875 0 0 1-.234-.6c0-.309.169-.609.441-.769-.075-1.003-.928-2.006-1.575-2.719s-.966-1.547-.966-2.513c0-2.55 2.428-4.2 4.8-4.2s4.8 1.65 4.8 4.2z'/%3E%3C/svg%3E);
  color: #fff;
}
.toast-error {
  background-color: #d9831f;
  background-image: url(/Content/data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http:/www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='%23fff'%3E%3Cpath d='M12.964 17.292V15.86a.245.245 0 0 0-.241-.249h-1.447a.244.244 0 0 0-.241.249v1.432c0 .136.106.249.241.249h1.447a.244.244 0 0 0 .241-.249zm-.015-2.818l.136-3.459a.179.179 0 0 0-.076-.143c-.045-.038-.113-.083-.181-.083H11.17c-.068 0-.136.045-.181.083a.21.21 0 0 0-.076.158l.128 3.443c0 .098.113.174.256.174h1.394c.136 0 .249-.076.256-.174zm-.105-7.038l5.787 10.61a.965.965 0 0 1-.844 1.424H6.213c-.339 0-.655-.181-.829-.475s-.181-.655-.015-.949l5.787-10.61a.96.96 0 0 1 1.688 0z'/%3E%3C/svg%3E);
  color: #fff;
}*/
select.bs-select-hidden,
select.selectpicker {
    display: none !important;
}

.bootstrap-select {
    width: 220px \0;
    /*IE9 and below*/
}

    .bootstrap-select > .dropdown-toggle {
        width: 100%;
        padding-right: 25px;
        z-index: 1;
    }

        .bootstrap-select > .dropdown-toggle.bs-placeholder, .bootstrap-select > .dropdown-toggle.bs-placeholder:hover, .bootstrap-select > .dropdown-toggle.bs-placeholder:focus, .bootstrap-select > .dropdown-toggle.bs-placeholder:active {
            color: #ddd;
        }

    .bootstrap-select > select {
        position: absolute !important;
        bottom: 0;
        left: 50%;
        display: block !important;
        width: 0.5px !important;
        height: 100% !important;
        padding: 0 !important;
        opacity: 0 !important;
        border: none;
    }

        .bootstrap-select > select.mobile-device {
            top: 0;
            left: 0;
            display: block !important;
            width: 100% !important;
            z-index: 2;
        }

.has-error .bootstrap-select .dropdown-toggle,
.error .bootstrap-select .dropdown-toggle {
    border-color: #b94a48;
}

.bootstrap-select.fit-width {
    width: auto !important;
}

.bootstrap-select:not([class*="col-"]):not([class*="form-control"]):not(.input-group-btn) {
    width: 220px;
}

.bootstrap-select .dropdown-toggle:focus {
    outline: thin dotted #333333 !important;
    outline: 5px auto -webkit-focus-ring-color !important;
    outline-offset: -2px;
}

.bootstrap-select.form-control {
    margin-bottom: 0;
    padding: 0;
    border: none;
}

    .bootstrap-select.form-control:not([class*="col-"]) {
        width: 100%;
    }

    .bootstrap-select.form-control.input-group-btn {
        z-index: auto;
    }

        .bootstrap-select.form-control.input-group-btn:not(:first-child):not(:last-child) > .btn {
            border-radius: 0;
        }

.bootstrap-select.btn-group:not(.input-group-btn), .bootstrap-select.btn-group[class*="col-"] {
    float: none;
    display: inline-block;
    margin-left: 0;
}

    .bootstrap-select.btn-group.dropdown-menu-right, .bootstrap-select.btn-group[class*="col-"].dropdown-menu-right,
    .row .bootstrap-select.btn-group[class*="col-"].dropdown-menu-right {
        float: right;
    }

.form-inline .bootstrap-select.btn-group,
.form-horizontal .bootstrap-select.btn-group,
.form-group .bootstrap-select.btn-group {
    margin-bottom: 0;
}

.form-group-lg .bootstrap-select.btn-group.form-control,
.form-group-sm .bootstrap-select.btn-group.form-control {
    padding: 0;
}

.form-inline .bootstrap-select.btn-group .form-control {
    width: 100%;
}

.bootstrap-select.btn-group.disabled,
.bootstrap-select.btn-group > .disabled {
    cursor: not-allowed;
}

    .bootstrap-select.btn-group.disabled:focus,
    .bootstrap-select.btn-group > .disabled:focus {
        outline: none !important;
    }

.bootstrap-select.btn-group.bs-container {
    position: absolute;
    height: 0 !important;
    padding: 0 !important;
}

    .bootstrap-select.btn-group.bs-container .dropdown-menu {
        z-index: 1060;
    }

.bootstrap-select.btn-group .dropdown-toggle .filter-option {
    display: inline-block;
    overflow: hidden;
    width: 100%;
    text-align: left;
}

.bootstrap-select.btn-group .dropdown-toggle .caret {
    position: absolute;
    top: 50%;
    right: 12px;
    margin-top: -2px;
    vertical-align: middle;
}

.bootstrap-select.btn-group[class*="col-"] .dropdown-toggle {
    width: 100%;
}

.bootstrap-select.btn-group .dropdown-menu {
    min-width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

    .bootstrap-select.btn-group .dropdown-menu.inner {
        position: static;
        float: none;
        border: 0;
        padding: 0;
        margin: 0;
        border-radius: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

    .bootstrap-select.btn-group .dropdown-menu li {
        position: relative;
    }

        .bootstrap-select.btn-group .dropdown-menu li.active small {
            color: #fff;
        }

        .bootstrap-select.btn-group .dropdown-menu li.disabled a {
            cursor: not-allowed;
        }

        .bootstrap-select.btn-group .dropdown-menu li a {
            cursor: pointer;
            -webkit-user-select: none;
            -ms-user-select: none;
            user-select: none;
        }

            .bootstrap-select.btn-group .dropdown-menu li a.opt {
                position: relative;
                padding-left: 2.25em;
            }

            .bootstrap-select.btn-group .dropdown-menu li a span.check-mark {
                display: none;
            }

            .bootstrap-select.btn-group .dropdown-menu li a span.text {
                display: inline-block;
            }

        .bootstrap-select.btn-group .dropdown-menu li small {
            padding-left: 0.5em;
        }

    .bootstrap-select.btn-group .dropdown-menu .notify {
        position: absolute;
        bottom: 5px;
        width: 96%;
        margin: 0 2%;
        min-height: 26px;
        padding: 3px 5px;
        background: whitesmoke;
        border: 1px solid #e3e3e3;
        -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
        box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
        pointer-events: none;
        opacity: 0.9;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }

.bootstrap-select.btn-group .no-results {
    padding: 3px;
    background: #f5f5f5;
    margin: 0 5px;
    white-space: nowrap;
}

.bootstrap-select.btn-group.fit-width .dropdown-toggle .filter-option {
    position: static;
}

.bootstrap-select.btn-group.fit-width .dropdown-toggle .caret {
    position: static;
    top: auto;
    margin-top: -1px;
}

.bootstrap-select.btn-group.show-tick .dropdown-menu li.selected a span.check-mark {
    position: absolute;
    display: inline-block;
    right: 15px;
    margin-top: 5px;
}

.bootstrap-select.btn-group.show-tick .dropdown-menu li a span.text {
    margin-right: 34px;
}

.bootstrap-select.show-menu-arrow.open > .dropdown-toggle {
    z-index: 1061;
}

.bootstrap-select.show-menu-arrow .dropdown-toggle:before {
    content: '';
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 7px solid rgba(204, 204, 204, 0.2);
    position: absolute;
    bottom: -4px;
    left: 9px;
    display: none;
}

.bootstrap-select.show-menu-arrow .dropdown-toggle:after {
    content: '';
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid white;
    position: absolute;
    bottom: -4px;
    left: 10px;
    display: none;
}

.bootstrap-select.show-menu-arrow.dropup .dropdown-toggle:before {
    bottom: auto;
    top: -3px;
    border-top: 7px solid rgba(204, 204, 204, 0.2);
    border-bottom: 0;
}

.bootstrap-select.show-menu-arrow.dropup .dropdown-toggle:after {
    bottom: auto;
    top: -3px;
    border-top: 6px solid white;
    border-bottom: 0;
}

.bootstrap-select.show-menu-arrow.pull-right .dropdown-toggle:before {
    right: 12px;
    left: auto;
}

.bootstrap-select.show-menu-arrow.pull-right .dropdown-toggle:after {
    right: 13px;
    left: auto;
}

.bootstrap-select.show-menu-arrow.open > .dropdown-toggle:before, .bootstrap-select.show-menu-arrow.open > .dropdown-toggle:after {
    display: block;
}

.bs-searchbox,
.bs-actionsbox,
.bs-donebutton {
    padding: 4px 8px;
}

.bs-actionsbox {
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

    .bs-actionsbox .btn-group button {
        width: 50%;
    }

.bs-donebutton {
    float: left;
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

    .bs-donebutton .btn-group button {
        width: 100%;
    }

.bs-searchbox + .bs-actionsbox {
    padding: 0 8px 4px;
}

.bs-searchbox .form-control {
    margin-bottom: 0;
    width: 100%;
    float: none;
}

@charset "UTF-8";
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
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,
menu,
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-color: 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;
}

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 {
    -webkit-box-sizing: content-box;
    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"] {
        -webkit-box-sizing: border-box;
        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;
        -webkit-box-sizing: content-box;
        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;
}


/*! Source: https://github.com/h5bp/html5-boilerplate/blob/master/src/css/main.css */
@media print {
    *, *:before, *:after {
        background: transparent !important;
        color: #000 !important;
        -webkit-box-shadow: none !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

        a[href]:after {
            content: " (" attr(href) ")";
        }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    a[href^="#"]:after,
    a[href^="javascript:"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group;
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }

    .navbar {
        display: none;
    }

    .btn > .caret,
    .dropup > .btn > .caret {
        border-top-color: #000 !important;
    }

    .label {
        border: 1px solid #000;
    }

    .table {
        border-collapse: collapse !important;
    }

        .table td,
        .table th {
            background-color: #fff !important;
        }

    .table-bordered th,
    .table-bordered td {
        border: 1px solid #ddd !important;
    }
}

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

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

html {
    font-size: 10px;
    -webkit-tap-highlight-color: transparent;
}

body {
    font-family: "Roboto", sans-serif;
    font-size: 13px;
    line-height: 1.538462;
    color: #777;
    background-color: #fcfcfc;
}

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

a {
    color: #E52423;
    text-decoration: none;
}

    a:hover, a:focus {
        color: #E52423;
        text-decoration: none;
    }

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.538462;
    background-color: #fcfcfc;
    border: 1px solid #ddd;
    border-radius: 4px;
    -webkit-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    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 #ddd;
}

.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;
}

[role="button"] {
    cursor: pointer;
}

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
    font-family: inherit;
    font-weight: 500;
    line-height: 1.1;
    color: inherit;
}

    h1 small,
    h1 .small, h2 small,
    h2 .small, h3 small,
    h3 .small, h4 small,
    h4 .small, h5 small,
    h5 .small, h6 small,
    h6 .small,
    .h1 small,
    .h1 .small, .h2 small,
    .h2 .small, .h3 small,
    .h3 .small, .h4 small,
    .h4 .small, .h5 small,
    .h5 .small, .h6 small,
    .h6 .small {
        font-weight: normal;
        line-height: 1;
        color: #808080;
    }

h1, .h1,
h2, .h2,
h3, .h3 {
    margin-top: 20px;
    margin-bottom: 10px;
}

    h1 small,
    h1 .small, .h1 small,
    .h1 .small,
    h2 small,
    h2 .small, .h2 small,
    .h2 .small,
    h3 small,
    h3 .small, .h3 small,
    .h3 .small {
        font-size: 65%;
    }

h4, .h4,
h5, .h5,
h6, .h6 {
    margin-top: 10px;
    margin-bottom: 10px;
}

    h4 small,
    h4 .small, .h4 small,
    .h4 .small,
    h5 small,
    h5 .small, .h5 small,
    .h5 .small,
    h6 small,
    h6 .small, .h6 small,
    .h6 .small {
        font-size: 75%;
    }

h1, .h1 {
    font-size: 36px;
}

h2, .h2 {
    font-size: 30px;
}

h3, .h3 {
    font-size: 24px;
}

h4, .h4 {
    font-size: 18px;
}

.black {
    color: #000;
}

h5, .h5 {
    font-size: 13px;
}

h6, .h6 {
    font-size: 12px;
}

p {
    margin: 0 0 10px;
}

.lead {
    margin-bottom: 20px;
    font-size: 14px;
    font-weight: 300;
    line-height: 1.4;
}

@media (min-width: 768px) {
    .lead {
        font-size: 19.5px;
    }
}

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

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

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

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

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

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

.text-nowrap {
    white-space: nowrap;
}

.text-lowercase {
    text-transform: lowercase;
}

.text-uppercase, .initialism {
    text-transform: uppercase;
}

.text-capitalize {
    text-transform: capitalize;
}

.text-muted {
    color: #808080;
}

.text-primary {
    color: #d9230f;
}

a.text-primary:hover,
a.text-primary:focus {
    color: #a91b0c;
}

.text-success {
    color: #469408;
}

a.text-success:hover,
a.text-success:focus {
    color: #2f6405;
}

.text-info {
    color: #029acf;
}

a.text-info:hover,
a.text-info:focus {
    color: #02749c;
}

.text-warning {
    color: #9b479f;
}

a.text-warning:hover,
a.text-warning:focus {
    color: #79377c;
}

.text-danger {
    color: #E52423;
}

a.text-danger:hover,
a.text-danger:focus {
    color: #E52423;
}

.bg-primary {
    color: #fff;
}

.bg-primary {
    background-color: #d9230f;
}

a.bg-primary:hover,
a.bg-primary:focus {
    background-color: #a91b0c;
}

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

a.bg-success:hover,
a.bg-success:focus {
    background-color: #a5d6a7;
}

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

a.bg-info:hover,
a.bg-info:focus {
    background-color: #82d4fa;
}

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

a.bg-warning:hover,
a.bg-warning:focus {
    background-color: #d099d9;
}

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

a.bg-danger:hover,
a.bg-danger:focus {
    background-color: #ffcb7f;
}

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

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

    ul ul,
    ul ol,
    ol ul,
    ol ol {
        margin-bottom: 0;
    }

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

.list-inline {
    padding-left: 0;
    list-style: none;
    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.538462;
}

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 #808080;
}

.initialism {
    font-size: 90%;
}

blockquote {
    padding: 10px 20px;
    margin: 0 0 20px;
    font-size: 16.25px;
    border-left: 5px solid #ddd;
}

    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.538462;
        color: #808080;
    }

        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 #ddd;
        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';
        }

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

code,
kbd,
pre,
samp {
    font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
}

code {
    padding: 2px 4px;
    font-size: 90%;
    color: #c7254e;
    background-color: #f9f2f4;
    border-radius: 4px;
}

kbd {
    padding: 2px 4px;
    font-size: 90%;
    color: #fff;
    background-color: #333;
    border-radius: 3px;
    -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25);
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.25);
}

    kbd kbd {
        padding: 0;
        font-size: 100%;
        font-weight: bold;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

pre {
    display: block;
    padding: 9.5px;
    margin: 0 0 10px;
    font-size: 12px;
    line-height: 1.538462;
    word-break: break-all;
    word-wrap: break-word;
    color: #444;
    background-color: #f5f5f5;
    border: 1px solid #ccc;
    border-radius: 4px;
}

    pre code {
        padding: 0;
        font-size: inherit;
        color: inherit;
        white-space: pre-wrap;
        background-color: transparent;
        border-radius: 0;
    }

.pre-scrollable {
    max-height: 340px;
    overflow-y: scroll;
}

.container {
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px;
}

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

    .container:after {
        clear: both;
    }

@media (min-width: 768px) {
    .container {
        width: 750px;
    }
}

@media (min-width: 992px) {
    .container {
        width: 970px;
    }
}

@media (min-width: 1200px) {
    .container {
        width: 1170px;
    }
}

.container-fluid {
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px;
}

    .container-fluid:before, .container-fluid:after {
        content: " ";
        display: table;
    }

    .container-fluid:after {
        clear: both;
    }

.row {
    /* causing page to be 30 wider than visible on smartphone */
    /*margin-left: -15px;
    margin-right: -15px;*/
}

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

    .row:after {
        clear: both;
    }

.col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-lg-2-img, .col-xs-3, .col-sm-3, .col-sm-3-img, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-xs-6-img, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
    position: relative;
    min-height: 1px;
    padding-left: 15px;
    padding-right: 15px;
}

.col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-6-img, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {
    float: left;
}

.col-xs-1 {
    width: 8.333333%;
}

.col-xs-2 {
    width: 16.666667%;
}

.col-xs-3 {
    width: 25%;
}

.col-xs-4 {
    width: 33.333333%;
}

.col-xs-5 {
    width: 41.666667%;
}

.col-xs-6 {
    width: 50%;
}

.col-xs-6-imh {
    width: 172px;
}

.col-xs-7 {
    width: 58.333333%;
}

.col-xs-8 {
    width: 66.666667%;
}

.col-xs-9 {
    width: 75%;
}

.col-xs-10 {
    width: 83.333333%;
}

.col-xs-11 {
    width: 91.666667%;
}

.col-xs-12 {
    width: 100%;
}

.col-xs-pull-0 {
    right: auto;
}

.col-xs-pull-1 {
    right: 8.333333%;
}

.col-xs-pull-2 {
    right: 16.666667%;
}

.col-xs-pull-3 {
    right: 25%;
}

.col-xs-pull-4 {
    right: 33.333333%;
}

.col-xs-pull-5 {
    right: 41.666667%;
}

.col-xs-pull-6 {
    right: 50%;
}

.col-xs-pull-7 {
    right: 58.333333%;
}

.col-xs-pull-8 {
    right: 66.666667%;
}

.col-xs-pull-9 {
    right: 75%;
}

.col-xs-pull-10 {
    right: 83.333333%;
}

.col-xs-pull-11 {
    right: 91.666667%;
}

.col-xs-pull-12 {
    right: 100%;
}

.col-xs-push-0 {
    left: auto;
}

.col-xs-push-1 {
    left: 8.333333%;
}

.col-xs-push-2 {
    left: 16.666667%;
}

.col-xs-push-3 {
    left: 25%;
}

.col-xs-push-4 {
    left: 33.333333%;
}

.col-xs-push-5 {
    left: 41.666667%;
}

.col-xs-push-6 {
    left: 50%;
}

.col-xs-push-7 {
    left: 58.333333%;
}

.col-xs-push-8 {
    left: 66.666667%;
}

.col-xs-push-9 {
    left: 75%;
}

.col-xs-push-10 {
    left: 83.333333%;
}

.col-xs-push-11 {
    left: 91.666667%;
}

.col-xs-push-12 {
    left: 100%;
}

.col-xs-offset-0 {
    margin-left: 0%;
}

.col-xs-offset-1 {
    margin-left: 8.333333%;
}

.col-xs-offset-2 {
    margin-left: 16.666667%;
}

.col-xs-offset-3 {
    margin-left: 25%;
}

.col-xs-offset-4 {
    margin-left: 33.333333%;
}

.col-xs-offset-5 {
    margin-left: 41.666667%;
}

.col-xs-offset-6 {
    margin-left: 50%;
}

.col-xs-offset-7 {
    margin-left: 58.333333%;
}

.col-xs-offset-8 {
    margin-left: 66.666667%;
}

.col-xs-offset-9 {
    margin-left: 75%;
}

.col-xs-offset-10 {
    margin-left: 83.333333%;
}

.col-xs-offset-11 {
    margin-left: 91.666667%;
}

.col-xs-offset-12 {
    margin-left: 100%;
}

@media (min-width: 768px) {
    .col-sm-1, .col-sm-2, .col-sm-3, col-sm-3-img, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {
        float: left;
    }

    .col-sm-1 {
        width: 8.333333%;
    }

    .col-sm-2 {
        width: 16.666667%;
    }

    .col-sm-3 {
        width: 25%;
    }

    .col-sm-3-img {
        width: 170px;
    }

    .col-sm-4 {
        width: 33.333333%;
    }

    .col-sm-5 {
        width: 41.666667%;
    }

    .col-sm-6 {
        width: 50%;
    }

    .col-sm-7 {
        width: 58.333333%;
    }

    .col-sm-8 {
        width: 66.666667%;
    }

    .col-sm-9 {
        width: 75%;
    }

    .col-sm-10 {
        width: 83.333333%;
    }

    .col-sm-11 {
        width: 91.666667%;
    }

    .col-sm-12 {
        width: 100%;
    }

    .col-sm-pull-0 {
        right: auto;
    }

    .col-sm-pull-1 {
        right: 8.333333%;
    }

    .col-sm-pull-2 {
        right: 16.666667%;
    }

    .col-sm-pull-3 {
        right: 25%;
    }

    .col-sm-pull-4 {
        right: 33.333333%;
    }

    .col-sm-pull-5 {
        right: 41.666667%;
    }

    .col-sm-pull-6 {
        right: 50%;
    }

    .col-sm-pull-7 {
        right: 58.333333%;
    }

    .col-sm-pull-8 {
        right: 66.666667%;
    }

    .col-sm-pull-9 {
        right: 75%;
    }

    .col-sm-pull-10 {
        right: 83.333333%;
    }

    .col-sm-pull-11 {
        right: 91.666667%;
    }

    .col-sm-pull-12 {
        right: 100%;
    }

    .col-sm-push-0 {
        left: auto;
    }

    .col-sm-push-1 {
        left: 8.333333%;
    }

    .col-sm-push-2 {
        left: 16.666667%;
    }

    .col-sm-push-3 {
        left: 25%;
    }

    .col-sm-push-4 {
        left: 33.333333%;
    }

    .col-sm-push-5 {
        left: 41.666667%;
    }

    .col-sm-push-6 {
        left: 50%;
    }

    .col-sm-push-7 {
        left: 58.333333%;
    }

    .col-sm-push-8 {
        left: 66.666667%;
    }

    .col-sm-push-9 {
        left: 75%;
    }

    .col-sm-push-10 {
        left: 83.333333%;
    }

    .col-sm-push-11 {
        left: 91.666667%;
    }

    .col-sm-push-12 {
        left: 100%;
    }

    .col-sm-offset-0 {
        margin-left: 0%;
    }

    .col-sm-offset-1 {
        margin-left: 8.333333%;
    }

    .col-sm-offset-2 {
        margin-left: 16.666667%;
    }

    .col-sm-offset-3 {
        margin-left: 25%;
    }

    .col-sm-offset-4 {
        margin-left: 33.333333%;
    }

    .col-sm-offset-5 {
        margin-left: 41.666667%;
    }

    .col-sm-offset-6 {
        margin-left: 50%;
    }

    .col-sm-offset-7 {
        margin-left: 58.333333%;
    }

    .col-sm-offset-8 {
        margin-left: 66.666667%;
    }

    .col-sm-offset-9 {
        margin-left: 75%;
    }

    .col-sm-offset-10 {
        margin-left: 83.333333%;
    }

    .col-sm-offset-11 {
        margin-left: 91.666667%;
    }

    .col-sm-offset-12 {
        margin-left: 100%;
    }
}

@media (min-width: 992px) {
    .col-md-1, .col-md-2, .col-md-3, .col-sm-3-img, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
        float: left;
    }

    .col-md-1 {
        width: 8.333333%;
    }

    .col-md-2 {
        width: 16.666667%;
    }

    .col-md-3 {
        width: 25%;
    }

    .col-sm-3-img {
        width: 164px;
    }

    .col-md-4 {
        width: 33.333333%;
    }

    .col-md-5 {
        width: 41.666667%;
    }

    .col-md-6 {
        width: 50%;
    }

    .col-md-7 {
        width: 58.333333%;
    }

    .col-md-8 {
        width: 66.666667%;
    }

    .col-md-9 {
        width: 75%;
    }

    .col-md-10 {
        width: 83.333333%;
    }

    .col-md-11 {
        width: 91.666667%;
    }

    .col-md-12 {
        width: 100%;
    }

    .col-md-pull-0 {
        right: auto;
    }

    .col-md-pull-1 {
        right: 8.333333%;
    }

    .col-md-pull-2 {
        right: 16.666667%;
    }

    .col-md-pull-3 {
        right: 25%;
    }

    .col-md-pull-4 {
        right: 33.333333%;
    }

    .col-md-pull-5 {
        right: 41.666667%;
    }

    .col-md-pull-6 {
        right: 50%;
    }

    .col-md-pull-7 {
        right: 58.333333%;
    }

    .col-md-pull-8 {
        right: 66.666667%;
    }

    .col-md-pull-9 {
        right: 75%;
    }

    .col-md-pull-10 {
        right: 83.333333%;
    }

    .col-md-pull-11 {
        right: 91.666667%;
    }

    .col-md-pull-12 {
        right: 100%;
    }

    .col-md-push-0 {
        left: auto;
    }

    .col-md-push-1 {
        left: 8.333333%;
    }

    .col-md-push-2 {
        left: 16.666667%;
    }

    .col-md-push-3 {
        left: 25%;
    }

    .col-md-push-4 {
        left: 33.333333%;
    }

    .col-md-push-5 {
        left: 41.666667%;
    }

    .col-md-push-6 {
        left: 50%;
    }

    .col-md-push-7 {
        left: 58.333333%;
    }

    .col-md-push-8 {
        left: 66.666667%;
    }

    .col-md-push-9 {
        left: 75%;
    }

    .col-md-push-10 {
        left: 83.333333%;
    }

    .col-md-push-11 {
        left: 91.666667%;
    }

    .col-md-push-12 {
        left: 100%;
    }

    .col-md-offset-0 {
        margin-left: 0%;
    }

    .col-md-offset-1 {
        margin-left: 8.333333%;
    }

    .col-md-offset-2 {
        margin-left: 16.666667%;
    }

    .col-md-offset-3 {
        margin-left: 25%;
    }

    .col-md-offset-4 {
        margin-left: 33.333333%;
    }

    .col-md-offset-5 {
        margin-left: 41.666667%;
    }

    .col-md-offset-6 {
        margin-left: 50%;
    }

    .col-md-offset-7 {
        margin-left: 58.333333%;
    }

    .col-md-offset-8 {
        margin-left: 66.666667%;
    }

    .col-md-offset-9 {
        margin-left: 75%;
    }

    .col-md-offset-10 {
        margin-left: 83.333333%;
    }

    .col-md-offset-11 {
        margin-left: 91.666667%;
    }

    .col-md-offset-12 {
        margin-left: 100%;
    }
}

@media (min-width: 1200px) {
    .col-lg-1, .col-lg-2, .col-lg-2-img, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 {
        float: left;
    }

    .col-lg-1 {
        width: 8.333333%;
    }

    .col-lg-2 {
        width: 16.666667%;
    }

    .col-lg-2-img {
        width: 165px;
    }

    .col-lg-3 {
        width: 25%;
    }

    .col-lg-4 {
        width: 33.333333%;
    }

    .col-lg-5 {
        width: 41.666667%;
    }

    .col-lg-6 {
        width: 50%;
    }

    .col-lg-7 {
        width: 58.333333%;
    }

    .col-lg-8 {
        width: 66.666667%;
    }

    .col-lg-9 {
        width: 75%;
    }

    .col-lg-10 {
        width: 83.333333%;
    }

    .col-lg-11 {
        width: 91.666667%;
    }

    .col-lg-12 {
        width: 100%;
    }

    .col-lg-pull-0 {
        right: auto;
    }

    .col-lg-pull-1 {
        right: 8.333333%;
    }

    .col-lg-pull-2 {
        right: 16.666667%;
    }

    .col-lg-pull-3 {
        right: 25%;
    }

    .col-lg-pull-4 {
        right: 33.333333%;
    }

    .col-lg-pull-5 {
        right: 41.666667%;
    }

    .col-lg-pull-6 {
        right: 50%;
    }

    .col-lg-pull-7 {
        right: 58.333333%;
    }

    .col-lg-pull-8 {
        right: 66.666667%;
    }

    .col-lg-pull-9 {
        right: 75%;
    }

    .col-lg-pull-10 {
        right: 83.333333%;
    }

    .col-lg-pull-11 {
        right: 91.666667%;
    }

    .col-lg-pull-12 {
        right: 100%;
    }

    .col-lg-push-0 {
        left: auto;
    }

    .col-lg-push-1 {
        left: 8.333333%;
    }

    .col-lg-push-2 {
        left: 16.666667%;
    }

    .col-lg-push-3 {
        left: 25%;
    }

    .col-lg-push-4 {
        left: 33.333333%;
    }

    .col-lg-push-5 {
        left: 41.666667%;
    }

    .col-lg-push-6 {
        left: 50%;
    }

    .col-lg-push-7 {
        left: 58.333333%;
    }

    .col-lg-push-8 {
        left: 66.666667%;
    }

    .col-lg-push-9 {
        left: 75%;
    }

    .col-lg-push-10 {
        left: 83.333333%;
    }

    .col-lg-push-11 {
        left: 91.666667%;
    }

    .col-lg-push-12 {
        left: 100%;
    }

    .col-lg-offset-0 {
        margin-left: 0%;
    }

    .col-lg-offset-1 {
        margin-left: 8.333333%;
    }

    .col-lg-offset-2 {
        margin-left: 16.666667%;
    }

    .col-lg-offset-3 {
        margin-left: 25%;
    }

    .col-lg-offset-4 {
        margin-left: 33.333333%;
    }

    .col-lg-offset-5 {
        margin-left: 41.666667%;
    }

    .col-lg-offset-6 {
        margin-left: 50%;
    }

    .col-lg-offset-7 {
        margin-left: 58.333333%;
    }

    .col-lg-offset-8 {
        margin-left: 66.666667%;
    }

    .col-lg-offset-9 {
        margin-left: 75%;
    }

    .col-lg-offset-10 {
        margin-left: 83.333333%;
    }

    .col-lg-offset-11 {
        margin-left: 91.666667%;
    }

    .col-lg-offset-12 {
        margin-left: 100%;
    }
}

table {
    background-color: #fff;
}

caption {
    padding-top: 8px;
    padding-bottom: 8px;
    color: #808080;
    text-align: left;
}

th {
    text-align: left;
}

.table {
    width: 100%;
    max-width: 100%;
    margin-bottom: 20px;
}

    .table > thead > tr > th,
    .table > thead > tr > td,
    .table > tbody > tr > th,
    .table > tbody > tr > td,
    .table > tfoot > tr > th,
    .table > tfoot > tr > td {
        padding: 8px;
        line-height: 1.538462;
        vertical-align: top;
        border-top: 1px solid #ddd;
    }

    .table > thead > tr > th {
        vertical-align: bottom;
        border-bottom: 2px solid #ddd;
    }

    .table > caption + thead > tr:first-child > th,
    .table > caption + thead > tr:first-child > td,
    .table > colgroup + thead > tr:first-child > th,
    .table > colgroup + thead > tr:first-child > td,
    .table > thead:first-child > tr:first-child > th,
    .table > thead:first-child > tr:first-child > td {
        border-top: 0;
    }

    .table > tbody + tbody {
        border-top: 2px solid #ddd;
    }

    .table .table {
        background-color: #fff;
    }

.table-condensed > thead > tr > th,
.table-condensed > thead > tr > td,
.table-condensed > tbody > tr > th,
.table-condensed > tbody > tr > td,
.table-condensed > tfoot > tr > th,
.table-condensed > tfoot > tr > td {
    padding: 5px;
}

.table-bordered {
    border: 1px solid #ddd;
}

    .table-bordered > thead > tr > th,
    .table-bordered > thead > tr > td,
    .table-bordered > tbody > tr > th,
    .table-bordered > tbody > tr > td,
    .table-bordered > tfoot > tr > th,
    .table-bordered > tfoot > tr > td {
        border: 1px solid #ddd;
    }

    .table-bordered > thead > tr > th,
    .table-bordered > thead > tr > td {
        border-bottom-width: 2px;
    }

.table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #f9f9f9;
}

.table-hover > tbody > tr:hover {
    background-color: #ddd;
}

table col[class*="col-"] {
    position: static;
    float: none;
    display: table-column;
}

table td[class*="col-"],
table th[class*="col-"] {
    position: static;
    float: none;
    display: table-cell;
}

.table > thead > tr > td.active,
.table > thead > tr > th.active,
.table > thead > tr.active > td,
.table > thead > tr.active > th,
.table > tbody > tr > td.active,
.table > tbody > tr > th.active,
.table > tbody > tr.active > td,
.table > tbody > tr.active > th,
.table > tfoot > tr > td.active,
.table > tfoot > tr > th.active,
.table > tfoot > tr.active > td,
.table > tfoot > tr.active > th {
    background-color: #f5f5f5;
}

.table-hover > tbody > tr > td.active:hover,
.table-hover > tbody > tr > th.active:hover,
.table-hover > tbody > tr.active:hover > td,
.table-hover > tbody > tr:hover > .active,
.table-hover > tbody > tr.active:hover > th {
    background-color: #e8e8e8;
}

.table > thead > tr > td.success,
.table > thead > tr > th.success,
.table > thead > tr.success > td,
.table > thead > tr.success > th,
.table > tbody > tr > td.success,
.table > tbody > tr > th.success,
.table > tbody > tr.success > td,
.table > tbody > tr.success > th,
.table > tfoot > tr > td.success,
.table > tfoot > tr > th.success,
.table > tfoot > tr.success > td,
.table > tfoot > tr.success > th {
    background-color: #c8e6c9;
}

.table-hover > tbody > tr > td.success:hover,
.table-hover > tbody > tr > th.success:hover,
.table-hover > tbody > tr.success:hover > td,
.table-hover > tbody > tr:hover > .success,
.table-hover > tbody > tr.success:hover > th {
    background-color: #b6deb8;
}

.table > thead > tr > td.info,
.table > thead > tr > th.info,
.table > thead > tr.info > td,
.table > thead > tr.info > th,
.table > tbody > tr > td.info,
.table > tbody > tr > th.info,
.table > tbody > tr.info > td,
.table > tbody > tr.info > th,
.table > tfoot > tr > td.info,
.table > tfoot > tr > th.info,
.table > tfoot > tr.info > td,
.table > tfoot > tr.info > th {
    background-color: #b3e5fc;
}

.table-hover > tbody > tr > td.info:hover,
.table-hover > tbody > tr > th.info:hover,
.table-hover > tbody > tr.info:hover > td,
.table-hover > tbody > tr:hover > .info,
.table-hover > tbody > tr.info:hover > th {
    background-color: #9addfb;
}

.table > thead > tr > td.warning,
.table > thead > tr > th.warning,
.table > thead > tr.warning > td,
.table > thead > tr.warning > th,
.table > tbody > tr > td.warning,
.table > tbody > tr > th.warning,
.table > tbody > tr.warning > td,
.table > tbody > tr.warning > th,
.table > tfoot > tr > td.warning,
.table > tfoot > tr > th.warning,
.table > tfoot > tr.warning > td,
.table > tfoot > tr.warning > th {
    background-color: #e1bee7;
}

.table-hover > tbody > tr > td.warning:hover,
.table-hover > tbody > tr > th.warning:hover,
.table-hover > tbody > tr.warning:hover > td,
.table-hover > tbody > tr:hover > .warning,
.table-hover > tbody > tr.warning:hover > th {
    background-color: #d8abe0;
}

.table > thead > tr > td.danger,
.table > thead > tr > th.danger,
.table > thead > tr.danger > td,
.table > thead > tr.danger > th,
.table > tbody > tr > td.danger,
.table > tbody > tr > th.danger,
.table > tbody > tr.danger > td,
.table > tbody > tr.danger > th,
.table > tfoot > tr > td.danger,
.table > tfoot > tr > th.danger,
.table > tfoot > tr.danger > td,
.table > tfoot > tr.danger > th {
    background-color: #ffe0b2;
}

.table-hover > tbody > tr > td.danger:hover,
.table-hover > tbody > tr > th.danger:hover,
.table-hover > tbody > tr.danger:hover > td,
.table-hover > tbody > tr:hover > .danger,
.table-hover > tbody > tr.danger:hover > th {
    background-color: #ffd699;
}

.table-responsive {
    overflow-x: auto;
    min-height: 0.01%;
}

@media screen and (max-width: 767px) {
    .no_padding_right_5 {
        padding: 0 5px 0 10px;
        margin: 0;
    }

    .margin_bt_10 {
        margin-bottom: 10px;
    }

    .table-responsive {
        width: 100%;
        margin-bottom: 15px;
        overflow-y: hidden;
        -ms-overflow-style: -ms-autohiding-scrollbar;
        /*border: 1px solid #ddd;*/
    }

        .table-responsive > .table {
            margin-bottom: 0;
        }

            .table-responsive > .table > thead > tr > th,
            .table-responsive > .table > thead > tr > td,
            .table-responsive > .table > tbody > tr > th,
            .table-responsive > .table > tbody > tr > td,
            .table-responsive > .table > tfoot > tr > th,
            .table-responsive > .table > tfoot > tr > td {
                white-space: nowrap;
            }

        .table-responsive > .table-bordered {
            border: 0;
        }

            .table-responsive > .table-bordered > thead > tr > th:first-child,
            .table-responsive > .table-bordered > thead > tr > td:first-child,
            .table-responsive > .table-bordered > tbody > tr > th:first-child,
            .table-responsive > .table-bordered > tbody > tr > td:first-child,
            .table-responsive > .table-bordered > tfoot > tr > th:first-child,
            .table-responsive > .table-bordered > tfoot > tr > td:first-child {
                border-left: 0;
            }

            .table-responsive > .table-bordered > thead > tr > th:last-child,
            .table-responsive > .table-bordered > thead > tr > td:last-child,
            .table-responsive > .table-bordered > tbody > tr > th:last-child,
            .table-responsive > .table-bordered > tbody > tr > td:last-child,
            .table-responsive > .table-bordered > tfoot > tr > th:last-child,
            .table-responsive > .table-bordered > tfoot > tr > td:last-child {
                border-right: 0;
            }

            .table-responsive > .table-bordered > tbody > tr:last-child > th,
            .table-responsive > .table-bordered > tbody > tr:last-child > td,
            .table-responsive > .table-bordered > tfoot > tr:last-child > th,
            .table-responsive > .table-bordered > tfoot > tr:last-child > td {
                border-bottom: 0;
            }
}

fieldset {
    padding: 0;
    margin: 0;
    border: 0;
    min-width: 0;
}

legend {
    display: block;
    width: 100%;
    padding: 0;
    margin-bottom: 20px;
    font-size: 19.5px;
    line-height: inherit;
    color: #777;
    border: 0;
    border-bottom: 1px solid #ddd;
}

label {
    display: inline-block;
    max-width: 100%;
    margin-bottom: 5px;
    font-weight: bold;
}

input[type="search"] {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}

input[type="radio"],
input[type="checkbox"] {
    margin: 4px 0 0;
    margin-top: 1px \9;
    line-height: normal;
}

input[type="file"] {
    display: block;
}

input[type="range"] {
    display: block;
    width: 100%;
}

select[multiple],
select[size] {
    height: auto;
}

output {
    display: block;
    padding-top: 7px;
    font-size: 13px;
    line-height: 1.538462;
    color: #777;
}

.form-control {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    font-size: 13px;
    line-height: 1.538462;
    color: #777;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ddd;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
    -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    -webkit-transition: border-color ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
    transition: border-color ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
    transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
    transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
}

    .form-control.ng-not-empty:disabled,
    .form-control[disabled].ng-not-empty {
        -webkit-text-fill-color: #777;
    }

    .form-control:focus {
        border-color: #66afe9;
        outline: none;
    }

    .form-control::-moz-placeholder {
        color: #ddd;
        opacity: 1;
    }

    .form-control:-ms-input-placeholder {
        color: #ddd;
    }

    .form-control::-webkit-input-placeholder {
        color: #ddd;
    }

    .form-control::-ms-expand {
        border: 0;
        background-color: transparent;
    }

    .form-control[disabled], .form-control[readonly],
    fieldset[disabled] .form-control {
        background-color: #eee;
        opacity: 1;
    }

    .form-control[disabled],
    fieldset[disabled] .form-control {
        cursor: not-allowed;
    }

textarea.form-control {
    height: auto;
}

input[type="search"] {
    -webkit-appearance: none;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
    input[type="date"].form-control,
    input[type="time"].form-control,
    input[type="datetime-local"].form-control,
    input[type="month"].form-control {
        line-height: 34px;
    }

    input[type="date"].input-sm, .input-group-sm > input[type="date"].form-control,
    .input-group-sm > input[type="date"].input-group-addon,
    .input-group-sm > .input-group-btn > input[type="date"].btn,
    .input-group-sm input[type="date"],
    input[type="time"].input-sm,
    .input-group-sm > input[type="time"].form-control,
    .input-group-sm > input[type="time"].input-group-addon,
    .input-group-sm > .input-group-btn > input[type="time"].btn,
    .input-group-sm input[type="time"],
    input[type="datetime-local"].input-sm,
    .input-group-sm > input[type="datetime-local"].form-control,
    .input-group-sm > input[type="datetime-local"].input-group-addon,
    .input-group-sm > .input-group-btn > input[type="datetime-local"].btn,
    .input-group-sm input[type="datetime-local"],
    input[type="month"].input-sm,
    .input-group-sm > input[type="month"].form-control,
    .input-group-sm > input[type="month"].input-group-addon,
    .input-group-sm > .input-group-btn > input[type="month"].btn,
    .input-group-sm input[type="month"] {
        line-height: 30px;
    }

    input[type="date"].input-lg, .input-group-lg > input[type="date"].form-control,
    .input-group-lg > input[type="date"].input-group-addon,
    .input-group-lg > .input-group-btn > input[type="date"].btn,
    .input-group-lg input[type="date"],
    input[type="time"].input-lg,
    .input-group-lg > input[type="time"].form-control,
    .input-group-lg > input[type="time"].input-group-addon,
    .input-group-lg > .input-group-btn > input[type="time"].btn,
    .input-group-lg input[type="time"],
    input[type="datetime-local"].input-lg,
    .input-group-lg > input[type="datetime-local"].form-control,
    .input-group-lg > input[type="datetime-local"].input-group-addon,
    .input-group-lg > .input-group-btn > input[type="datetime-local"].btn,
    .input-group-lg input[type="datetime-local"],
    input[type="month"].input-lg,
    .input-group-lg > input[type="month"].form-control,
    .input-group-lg > input[type="month"].input-group-addon,
    .input-group-lg > .input-group-btn > input[type="month"].btn,
    .input-group-lg input[type="month"] {
        line-height: 46px;
    }
}

.form-group {
    margin-bottom: 15px;
}

.radio,
.checkbox {
    position: relative;
    display: block;
    margin-top: 10px;
    margin-bottom: 10px;
}

    .radio label,
    .checkbox label {
        min-height: 20px;
        padding-left: 20px;
        margin-bottom: 0;
        font-weight: normal;
        cursor: pointer;
    }

    .radio input[type="radio"],
    .radio-inline input[type="radio"],
    .checkbox input[type="checkbox"],
    .checkbox-inline input[type="checkbox"] {
        position: absolute;
        margin-left: -20px;
        margin-top: 4px \9;
    }

    .radio + .radio,
    .checkbox + .checkbox {
        margin-top: -5px;
    }

.radio-inline,
.checkbox-inline {
    position: relative;
    display: inline-block;
    padding-left: 20px;
    margin-bottom: 0;
    vertical-align: middle;
    font-weight: normal;
    cursor: pointer;
}

    .radio-inline + .radio-inline,
    .checkbox-inline + .checkbox-inline {
        margin-top: 0;
        margin-left: 10px;
    }

input[type="radio"][disabled], input[type="radio"].disabled,
fieldset[disabled] input[type="radio"],
input[type="checkbox"][disabled],
input[type="checkbox"].disabled,
fieldset[disabled] input[type="checkbox"] {
    cursor: not-allowed;
}

.radio-inline.disabled,
fieldset[disabled] .radio-inline,
.checkbox-inline.disabled,
fieldset[disabled] .checkbox-inline {
    cursor: not-allowed;
}

.radio.disabled label,
fieldset[disabled] .radio label,
.checkbox.disabled label,
fieldset[disabled] .checkbox label {
    cursor: not-allowed;
}

.form-control-static {
    padding-top: 7px;
    padding-bottom: 7px;
    margin-bottom: 0;
    min-height: 33px;
}

    .form-control-static.input-lg, .input-group-lg > .form-control-static.form-control,
    .input-group-lg > .form-control-static.input-group-addon,
    .input-group-lg > .input-group-btn > .form-control-static.btn, .form-control-static.input-sm, .input-group-sm > .form-control-static.form-control,
    .input-group-sm > .form-control-static.input-group-addon,
    .input-group-sm > .input-group-btn > .form-control-static.btn {
        padding-left: 0;
        padding-right: 0;
    }

.input-sm, .input-group-sm > .form-control,
.input-group-sm > .input-group-addon,
.input-group-sm > .input-group-btn > .btn {
    height: 30px;
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}

select.input-sm, .input-group-sm > select.form-control,
.input-group-sm > select.input-group-addon,
.input-group-sm > .input-group-btn > select.btn {
    height: 30px;
    line-height: 30px;
}

textarea.input-sm, .input-group-sm > textarea.form-control,
.input-group-sm > textarea.input-group-addon,
.input-group-sm > .input-group-btn > textarea.btn,
select[multiple].input-sm,
.input-group-sm > select[multiple].form-control,
.input-group-sm > select[multiple].input-group-addon,
.input-group-sm > .input-group-btn > select[multiple].btn {
    height: auto;
}

.form-group-sm .form-control {
    height: 30px;
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}

.form-group-sm select.form-control {
    height: 30px;
    line-height: 30px;
}

.form-group-sm textarea.form-control,
.form-group-sm select[multiple].form-control {
    height: auto;
}

.form-group-sm .form-control-static {
    height: 30px;
    min-height: 32px;
    padding: 6px 10px;
    font-size: 12px;
    line-height: 1.5;
}

.input-lg, .input-group-lg > .form-control,
.input-group-lg > .input-group-addon,
.input-group-lg > .input-group-btn > .btn {
    height: 46px;
    padding: 10px 16px;
    font-size: 18px;
    line-height: 1.333333;
    border-radius: 6px;
}

select.input-lg, .input-group-lg > select.form-control,
.input-group-lg > select.input-group-addon,
.input-group-lg > .input-group-btn > select.btn {
    height: 46px;
    line-height: 46px;
}

textarea.input-lg, .input-group-lg > textarea.form-control,
.input-group-lg > textarea.input-group-addon,
.input-group-lg > .input-group-btn > textarea.btn,
select[multiple].input-lg,
.input-group-lg > select[multiple].form-control,
.input-group-lg > select[multiple].input-group-addon,
.input-group-lg > .input-group-btn > select[multiple].btn {
    height: auto;
}

.form-group-lg .form-control {
    height: 46px;
    padding: 10px 16px;
    font-size: 18px;
    line-height: 1.333333;
    border-radius: 6px;
}

.form-group-lg select.form-control {
    height: 46px;
    line-height: 46px;
}

.form-group-lg textarea.form-control,
.form-group-lg select[multiple].form-control {
    height: auto;
}

.form-group-lg .form-control-static {
    height: 46px;
    min-height: 38px;
    padding: 11px 16px;
    font-size: 18px;
    line-height: 1.333333;
}

.has-feedback {
    position: relative;
}

    .has-feedback .form-control {
        padding-right: 12px; /*42.5px;*/
    }

.form-control-feedback {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    display: block;
    width: 34px;
    height: 34px;
    line-height: 34px;
    text-align: center;
    pointer-events: none;
}

.input-lg + .form-control-feedback, .input-group-lg > .form-control + .form-control-feedback,
.input-group-lg > .input-group-addon + .form-control-feedback,
.input-group-lg > .input-group-btn > .btn + .form-control-feedback,
.input-group-lg + .form-control-feedback,
.form-group-lg .form-control + .form-control-feedback {
    width: 46px;
    height: 46px;
    line-height: 46px;
}

.input-sm + .form-control-feedback, .input-group-sm > .form-control + .form-control-feedback,
.input-group-sm > .input-group-addon + .form-control-feedback,
.input-group-sm > .input-group-btn > .btn + .form-control-feedback,
.input-group-sm + .form-control-feedback,
.form-group-sm .form-control + .form-control-feedback {
    width: 30px;
    height: 30px;
    line-height: 30px;
}

.has-success .help-block,
.has-success .control-label,
.has-success .radio,
.has-success .checkbox,
.has-success .radio-inline,
.has-success .checkbox-inline,
.has-success.radio label,
.has-success.checkbox label,
.has-success.radio-inline label,
.has-success.checkbox-inline label {
    color: #469408;
}

.has-success .form-control {
    border-color: #469408;
}

.has-success .input-group-addon {
    background-color: #c8e6c9;
    border-color: #469408;
    color: #469408;
}

.has-success .form-control-feedback {
    color: #469408;
}

.has-warning .help-block,
.has-warning .control-label,
.has-warning .radio,
.has-warning .checkbox,
.has-warning .radio-inline,
.has-warning .checkbox-inline,
.has-warning.radio label,
.has-warning.checkbox label,
.has-warning.radio-inline label,
.has-warning.checkbox-inline label {
    color: #9b479f;
}

.has-warning .form-control {
    border-color: #9b479f;
}

.has-warning .input-group-addon {
    background-color: #e1bee7;
    border-color: #9b479f;
    color: #9b479f;
}

.has-warning .form-control-feedback {
    color: #9b479f;
}

.has-error .help-block,
.has-error .control-label,
.has-error .radio,
.has-error .checkbox,
.has-error .radio-inline,
.has-error .checkbox-inline,
.has-error.radio label,
.has-error.checkbox label,
.has-error.radio-inline label,
.has-error.checkbox-inline label {
    color: #d9831f;
}

.has-error .form-control {
    border-color: #d9831f;
}

.has-error .input-group-addon {
    background-color: #ffe0b2;
    border-color: #d9831f;
    color: #d9831f;
}

.has-error .form-control-feedback {
    color: #d9831f;
}

.has-feedback label ~ .form-control-feedback {
    top: 25px;
}

.has-feedback label.sr-only ~ .form-control-feedback {
    top: 0;
}

.help-block {
    display: block;
    margin-top: 5px;
    margin-bottom: 10px;
    color: #b7b7b7;
}

@media (min-width: 768px) {
    .form-inline .form-group {
        display: inline-block;
        margin-bottom: 0;
        vertical-align: middle;
    }

    .form-inline .form-control {
        display: inline-block;
        width: auto;
        vertical-align: middle;
    }

    .form-inline .form-control-static {
        display: inline-block;
    }

    .form-inline .input-group {
        display: inline-table;
        vertical-align: middle;
    }

        .form-inline .input-group .input-group-addon,
        .form-inline .input-group .input-group-btn,
        .form-inline .input-group .form-control {
            width: auto;
        }

        .form-inline .input-group > .form-control {
            width: 100%;
        }

    .form-inline .control-label {
        margin-bottom: 0;
        vertical-align: middle;
    }

    .form-inline .radio,
    .form-inline .checkbox {
        display: inline-block;
        margin-top: 0;
        margin-bottom: 0;
        vertical-align: middle;
    }

        .form-inline .radio label,
        .form-inline .checkbox label {
            padding-left: 0;
        }

        .form-inline .radio input[type="radio"],
        .form-inline .checkbox input[type="checkbox"] {
            position: relative;
            margin-left: 0;
        }

    .form-inline .has-feedback .form-control-feedback {
        top: 0;
    }
}

.form-horizontal .radio,
.form-horizontal .checkbox,
.form-horizontal .radio-inline,
.form-horizontal .checkbox-inline {
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 7px;
}

.form-horizontal .radio,
.form-horizontal .checkbox {
    min-height: 27px;
}

.form-horizontal .form-group {
    margin-left: -15px;
    margin-right: -15px;
}

    .form-horizontal .form-group:before, .form-horizontal .form-group:after {
        content: " ";
        display: table;
    }

    .form-horizontal .form-group:after {
        clear: both;
    }

@media (min-width: 768px) {
    .form-horizontal .control-label {
        text-align: right;
        margin-bottom: 0;
        padding-top: 7px;
    }
}

.form-horizontal .has-feedback .form-control-feedback {
    right: 15px;
}

@media (min-width: 768px) {
    .form-horizontal .form-group-lg .control-label {
        padding-top: 11px;
        font-size: 18px;
    }
}

@media (min-width: 768px) {
    .form-horizontal .form-group-sm .control-label {
        padding-top: 6px;
        font-size: 12px;
    }
}

.btn {
    display: inline-block;
    margin-bottom: 0;
    font-weight: normal;
    text-align: center;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    background-image: none;
    border: 1px solid transparent;
    white-space: nowrap;
    padding: 6px 12px;
    font-size: 13px;
    line-height: 1.538462;
    border-radius: 4px;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    .btn:hover, .btn:focus, .btn.focus {
        color: #fff;
        text-decoration: none;
    }

    .btn:active, .btn.active {
        outline: 0;
        background-image: none;
        -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
        box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    }

    .btn.disabled, .btn[disabled],
    fieldset[disabled] .btn {
        cursor: not-allowed;
        opacity: 0.65;
        filter: alpha(opacity=65);
        -webkit-box-shadow: none;
        box-shadow: none;
    }

a.btn.disabled,
fieldset[disabled] a.btn {
    pointer-events: none;
}

.btn-default {
    background-color: #fff;
    border-color: #e7e7ec;
    color: #7d7d8e;
}

    .btn-default:focus, .btn-default.focus {
        background-color: #fff;
        border-color: #e7e7ec;
        color: #7d7d8e;
    }

    .btn-default:hover {
        background-color: #e6e6e6;
        border-color: #cbcbd5;
        color: #7d7d8e;
    }

    .btn-default:active, .btn-default.active,
    .open > .btn-default.dropdown-toggle {
        background-color: #e6e6e6;
        border-color: #cbcbd5;
        color: #7d7d8e;
    }

        .btn-default:active:hover, .btn-default:active:focus, .btn-default:active.focus, .btn-default.active:hover, .btn-default.active:focus, .btn-default.active.focus,
        .open > .btn-default.dropdown-toggle:hover,
        .open > .btn-default.dropdown-toggle:focus,
        .open > .btn-default.dropdown-toggle.focus {
            background-color: #d9d9d9;
            border-color: #bcbcca;
            color: #7d7d8e;
        }

    .btn-default.disabled:hover, .btn-default.disabled:focus, .btn-default.disabled.focus, .btn-default[disabled]:hover, .btn-default[disabled]:focus, .btn-default[disabled].focus,
    fieldset[disabled] .btn-default:hover,
    fieldset[disabled] .btn-default:focus,
    fieldset[disabled] .btn-default.focus {
        background-color: #fff;
        border-color: #e7e7ec;
    }

    .btn-default .badge {
        background-color: #7d7d8e;
        color: #fff;
    }

.btn-primary {
    background-color: #d9230f;
    border-color: #d9230f;
    color: #fff;
}

    .btn-primary:focus, .btn-primary.focus {
        background-color: #d9230f;
        border-color: #d9230f;
        color: #fff;
    }

    .btn-primary:hover {
        background-color: #a91b0c;
        border-color: #a91b0c;
        color: #fff;
    }

    .btn-primary:active, .btn-primary.active,
    .open > .btn-primary.dropdown-toggle {
        background-color: #a91b0c;
        border-color: #a91b0c;
        color: #fff;
    }

        .btn-primary:active:hover, .btn-primary:active:focus, .btn-primary:active.focus, .btn-primary.active:hover, .btn-primary.active:focus, .btn-primary.active.focus,
        .open > .btn-primary.dropdown-toggle:hover,
        .open > .btn-primary.dropdown-toggle:focus,
        .open > .btn-primary.dropdown-toggle.focus {
            background-color: #91170a;
            border-color: #91170a;
            color: #fff;
        }

    .btn-primary.disabled:hover, .btn-primary.disabled:focus, .btn-primary.disabled.focus, .btn-primary[disabled]:hover, .btn-primary[disabled]:focus, .btn-primary[disabled].focus,
    fieldset[disabled] .btn-primary:hover,
    fieldset[disabled] .btn-primary:focus,
    fieldset[disabled] .btn-primary.focus {
        background-color: #d9230f;
        border-color: #d9230f;
    }

    .btn-primary .badge {
        background-color: #fff;
        color: #d9230f;
    }

.btn-success {
    background-color: #469408;
    border-color: #469408;
    color: #fff;
}

    .btn-success:focus, .btn-success.focus {
        background-color: #469408;
        border-color: #469408;
        color: #fff;
    }

    .btn-success:hover {
        background-color: #2f6405;
        border-color: #2f6405;
        color: #fff;
    }

    .btn-success:active, .btn-success.active,
    .open > .btn-success.dropdown-toggle {
        background-color: #2f6405;
        border-color: #2f6405;
        color: #fff;
    }

        .btn-success:active:hover, .btn-success:active:focus, .btn-success:active.focus, .btn-success.active:hover, .btn-success.active:focus, .btn-success.active.focus,
        .open > .btn-success.dropdown-toggle:hover,
        .open > .btn-success.dropdown-toggle:focus,
        .open > .btn-success.dropdown-toggle.focus {
            background-color: #244b04;
            border-color: #244b04;
            color: #fff;
        }

    .btn-success.disabled:hover, .btn-success.disabled:focus, .btn-success.disabled.focus, .btn-success[disabled]:hover, .btn-success[disabled]:focus, .btn-success[disabled].focus,
    fieldset[disabled] .btn-success:hover,
    fieldset[disabled] .btn-success:focus,
    fieldset[disabled] .btn-success.focus {
        background-color: #469408;
        border-color: #469408;
    }

    .btn-success .badge {
        background-color: #fff;
        color: #469408;
    }

.btn-info {
    background-color: #029acf;
    border-color: #029acf;
    color: #fff;
}

    .btn-info:focus, .btn-info.focus {
        background-color: #029acf;
        border-color: #029acf;
        color: #fff;
    }

    .btn-info:hover {
        background-color: #02749c;
        border-color: #02749c;
        color: #fff;
    }

    .btn-info:active, .btn-info.active,
    .open > .btn-info.dropdown-toggle {
        background-color: #02749c;
        border-color: #02749c;
        color: #fff;
    }

        .btn-info:active:hover, .btn-info:active:focus, .btn-info:active.focus, .btn-info.active:hover, .btn-info.active:focus, .btn-info.active.focus,
        .open > .btn-info.dropdown-toggle:hover,
        .open > .btn-info.dropdown-toggle:focus,
        .open > .btn-info.dropdown-toggle.focus {
            background-color: #016283;
            border-color: #016283;
            color: #fff;
        }

    .btn-info.disabled:hover, .btn-info.disabled:focus, .btn-info.disabled.focus, .btn-info[disabled]:hover, .btn-info[disabled]:focus, .btn-info[disabled].focus,
    fieldset[disabled] .btn-info:hover,
    fieldset[disabled] .btn-info:focus,
    fieldset[disabled] .btn-info.focus {
        background-color: #029acf;
        border-color: #029acf;
    }

    .btn-info .badge {
        background-color: #fff;
        color: #029acf;
    }

.btn-warning {
    background-color: #9b479f;
    border-color: #9b479f;
    color: #fff;
}

    .btn-warning:focus, .btn-warning.focus {
        background-color: #9b479f;
        border-color: #9b479f;
        color: #fff;
    }

    .btn-warning:hover {
        background-color: #79377c;
        border-color: #79377c;
        color: #fff;
    }

    .btn-warning:active, .btn-warning.active,
    .open > .btn-warning.dropdown-toggle {
        background-color: #79377c;
        border-color: #79377c;
        color: #fff;
    }

        .btn-warning:active:hover, .btn-warning:active:focus, .btn-warning:active.focus, .btn-warning.active:hover, .btn-warning.active:focus, .btn-warning.active.focus,
        .open > .btn-warning.dropdown-toggle:hover,
        .open > .btn-warning.dropdown-toggle:focus,
        .open > .btn-warning.dropdown-toggle.focus {
            background-color: #672f6a;
            border-color: #672f6a;
            color: #fff;
        }

    .btn-warning.disabled:hover, .btn-warning.disabled:focus, .btn-warning.disabled.focus, .btn-warning[disabled]:hover, .btn-warning[disabled]:focus, .btn-warning[disabled].focus,
    fieldset[disabled] .btn-warning:hover,
    fieldset[disabled] .btn-warning:focus,
    fieldset[disabled] .btn-warning.focus {
        background-color: #9b479f;
        border-color: #9b479f;
    }

    .btn-warning .badge {
        background-color: #fff;
        color: #9b479f;
    }

.btn-danger {
    background-color: #d9831f;
    border-color: #d9831f;
    color: #fff;
}

    .btn-danger:focus, .btn-danger.focus {
        background-color: #d9831f;
        border-color: #d9831f;
        color: #fff;
    }

    .btn-danger:hover {
        background-color: #ac6819;
        border-color: #ac6819;
        color: #fff;
    }

    .btn-danger:active, .btn-danger.active,
    .open > .btn-danger.dropdown-toggle {
        background-color: #ac6819;
        border-color: #ac6819;
        color: #fff;
    }

        .btn-danger:active:hover, .btn-danger:active:focus, .btn-danger:active.focus, .btn-danger.active:hover, .btn-danger.active:focus, .btn-danger.active.focus,
        .open > .btn-danger.dropdown-toggle:hover,
        .open > .btn-danger.dropdown-toggle:focus,
        .open > .btn-danger.dropdown-toggle.focus {
            background-color: #965b15;
            border-color: #965b15;
            color: #fff;
        }

    .btn-danger.disabled:hover, .btn-danger.disabled:focus, .btn-danger.disabled.focus, .btn-danger[disabled]:hover, .btn-danger[disabled]:focus, .btn-danger[disabled].focus,
    fieldset[disabled] .btn-danger:hover,
    fieldset[disabled] .btn-danger:focus,
    fieldset[disabled] .btn-danger.focus {
        background-color: #d9831f;
        border-color: #d9831f;
    }

    .btn-danger .badge {
        background-color: #fff;
        color: #d9831f;
    }

.btn-link {
    color: #d9230f;
    font-weight: normal;
    border-radius: 0;
}

    .btn-link, .btn-link:active, .btn-link.active, .btn-link[disabled],
    fieldset[disabled] .btn-link {
        background-color: transparent;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

        .btn-link, .btn-link:hover, .btn-link:focus, .btn-link:active {
            border-color: transparent;
        }

            .btn-link:hover, .btn-link:focus {
                color: #d9230f;
                text-decoration: underline;
                background-color: transparent;
            }

            .btn-link[disabled]:hover, .btn-link[disabled]:focus,
            fieldset[disabled] .btn-link:hover,
            fieldset[disabled] .btn-link:focus {
                color: #808080;
                text-decoration: none;
            }

.btn-lg, .btn-group-lg > .btn {
    padding: 10px 16px;
    font-size: 18px;
    line-height: 1.333333;
    border-radius: 6px;
}

.btn-sm, .btn-group-sm > .btn {
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}

.btn-xs, .btn-group-xs > .btn {
    padding: 1px 5px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px;
}

.btn-block {
    display: block;
    width: 100%;
}

    .btn-block + .btn-block {
        margin-top: 5px;
    }

input[type="submit"].btn-block,
input[type="reset"].btn-block,
input[type="button"].btn-block {
    width: 100%;
}

.fade {
    opacity: 0;
    -webkit-transition: opacity 0.15s linear;
    -o-transition: opacity 0.15s linear;
    transition: opacity 0.15s linear;
}

    .fade.in {
        opacity: 1;
    }

.collapse {
    display: none;
}

    .collapse.in {
        display: block;
    }

nav.collapse.in {
    height: 100%;
    background-color: #191919;
}

tr.collapse.in {
    display: table-row;
}

tbody.collapse.in {
    display: table-row-group;
}

.collapsing {
    position: relative;
    height: 0;
    overflow: hidden;
    -webkit-transition-property: height, visibility;
    -o-transition-property: height, visibility;
    transition-property: height, visibility;
    -webkit-transition-duration: 0.1s;
    -o-transition-duration: 0.1s;
    transition-duration: 0.1s;
    -webkit-transition-timing-function: ease;
    -o-transition-timing-function: ease;
    transition-timing-function: ease;
    -webkit-transition: height 0.1s;
    -moz-transition: height 0.1s;
    -ms-transition: height 0.1s;
    -o-transition: height 0.1s;
    transition: height 0.1s;
}


.caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 2px;
    vertical-align: middle;
    border-top: 4px dashed;
    border-top: 4px solid \9;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
}

.dropup,
.dropdown {
    position: relative;
}

.dropdown-toggle:focus {
    outline: 0;
}

.dropdown-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 160px;
    padding: 5px 0;
    margin: 2px 0 0;
    list-style: none;
    font-size: 13px;
    text-align: left;
    background-color: #fff;
    border: 1px solid #ddd;
    border: 1px solid #ddd;
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
}

@media(max-width: 767px) {
    .dropdown-menu {
        min-width: 300px;
        top: 50px;
    }
}

.dropdown-menu.small {
    min-width: 160px !important;
}

.dropdown-menu.pull-right {
    right: 0;
    left: auto;
}

.dropdown-menu .divider {
    height: 1px;
    margin: 9px 0;
    overflow: hidden;
    background-color: #ddd;
}

.dropdown-menu > li a {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: normal;
    line-height: 1.538462;
    color: #777;
    font-size: 15px;
    white-space: nowrap;
}

    .dropdown-menu > li a:hover {
        text-decoration: none;
        color: #fff;
        background-color: #d9230f;
    }

    .dropdown-menu > li a:focus {
        text-decoration: none;
    }

.dropdown-menu > .active a, .dropdown-menu > .active a:hover, .dropdown-menu > .active a:focus {
    color: #fff;
    text-decoration: none;
    outline: 0;
    background-color: #d9230f;
}

.dropdown-menu > .disabled a, .dropdown-menu > .disabled a:hover, .dropdown-menu > .disabled a:focus {
    color: #808080;
}

    .dropdown-menu > .disabled a:hover, .dropdown-menu > .disabled > a:focus {
        text-decoration: none;
        background-color: transparent;
        background-image: none;
        /*filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);*/
        cursor: not-allowed;
    }

.open > .dropdown-menu {
    display: block;
}

.open > a {
    outline: 0;
}

.dropdown-menu-right {
    left: auto;
    right: 0;
}

    .dropdown-menu-right li a img {
        width: 12px;
        height: 12px;
    }

.dropdown-menu-left {
    left: 0;
    right: auto;
}

.dropdown-header {
    display: block;
    padding: 3px 20px;
    font-size: 12px;
    line-height: 1.538462;
    color: inherit;
    white-space: nowrap;
}

.dropdown-backdrop {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    z-index: 990;
}

.pull-right > .dropdown-menu {
    right: 0;
    left: auto;
}

.dropup .caret,
.navbar-fixed-bottom .dropdown .caret {
    border-top: 0;
    border-bottom: 4px dashed;
    border-bottom: 4px solid \9;
    content: "";
}

.dropup .dropdown-menu,
.navbar-fixed-bottom .dropdown .dropdown-menu {
    top: auto;
    bottom: 100%;
    margin-bottom: 2px;
}

/*@media (min-width: 768px) {*/
.navbar-right .dropdown-menu {
    right: 0;
    left: auto;
}

.navbar-right .dropdown-menu-left {
    left: 0;
    right: auto;
}
/*}*/

.btn-group,
.btn-group-vertical {
    position: relative;
    display: inline-block;
    vertical-align: middle;
}

    .btn-group > .btn,
    .btn-group-vertical > .btn {
        position: relative;
        float: left;
    }

        .btn-group > .btn:hover, .btn-group > .btn:focus, .btn-group > .btn:active, .btn-group > .btn.active,
        .btn-group-vertical > .btn:hover,
        .btn-group-vertical > .btn:focus,
        .btn-group-vertical > .btn:active,
        .btn-group-vertical > .btn.active {
            z-index: 2;
        }

    .btn-group .btn + .btn,
    .btn-group .btn + .btn-group,
    .btn-group .btn-group + .btn,
    .btn-group .btn-group + .btn-group {
        margin-left: -1px;
    }

.btn-toolbar {
    margin-left: -5px;
}

    .btn-toolbar:before, .btn-toolbar:after {
        content: " ";
        display: table;
    }

    .btn-toolbar:after {
        clear: both;
    }

    .btn-toolbar .btn,
    .btn-toolbar .btn-group,
    .btn-toolbar .input-group {
        float: left;
    }

    .btn-toolbar > .btn,
    .btn-toolbar > .btn-group,
    .btn-toolbar > .input-group {
        margin-left: 5px;
    }

.btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {
    border-radius: 0;
}

.btn-group > .btn:first-child {
    margin-left: 0;
}

    .btn-group > .btn:first-child:not(:last-child):not(.dropdown-toggle) {
        border-bottom-right-radius: 0;
        border-top-right-radius: 0;
    }

.btn-group > .btn:last-child:not(:first-child),
.btn-group > .dropdown-toggle:not(:first-child) {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
}

.btn-group > .btn-group {
    float: left;
}

    .btn-group > .btn-group:not(:first-child):not(:last-child) > .btn {
        border-radius: 0;
    }

    .btn-group > .btn-group:first-child:not(:last-child) > .btn:last-child,
    .btn-group > .btn-group:first-child:not(:last-child) > .dropdown-toggle {
        border-bottom-right-radius: 0;
        border-top-right-radius: 0;
    }

    .btn-group > .btn-group:last-child:not(:first-child) > .btn:first-child {
        border-bottom-left-radius: 0;
        border-top-left-radius: 0;
    }

.btn-group .dropdown-toggle:active,
.btn-group.open .dropdown-toggle {
    outline: 0;
}

.btn-group > .btn + .dropdown-toggle {
    padding-left: 8px;
    padding-right: 8px;
}

.btn-group > .btn-lg + .dropdown-toggle, .btn-group-lg.btn-group > .btn + .dropdown-toggle {
    padding-left: 12px;
    padding-right: 12px;
}

.btn-group.open .dropdown-toggle {
    -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}

    .btn-group.open .dropdown-toggle.btn-link {
        -webkit-box-shadow: none;
        box-shadow: none;
    }

.btn .caret {
    margin-left: 0;
}

.btn-lg .caret, .btn-group-lg > .btn .caret {
    border-width: 5px 5px 0;
    border-bottom-width: 0;
}

.dropup .btn-lg .caret, .dropup .btn-group-lg > .btn .caret {
    border-width: 0 5px 5px;
}

.btn-group-vertical > .btn,
.btn-group-vertical > .btn-group,
.btn-group-vertical > .btn-group > .btn {
    display: block;
    float: none;
    width: 100%;
    max-width: 100%;
}

    .btn-group-vertical > .btn-group:before, .btn-group-vertical > .btn-group:after {
        content: " ";
        display: table;
    }

    .btn-group-vertical > .btn-group:after {
        clear: both;
    }

    .btn-group-vertical > .btn-group > .btn {
        float: none;
    }

    .btn-group-vertical > .btn + .btn,
    .btn-group-vertical > .btn + .btn-group,
    .btn-group-vertical > .btn-group + .btn,
    .btn-group-vertical > .btn-group + .btn-group {
        margin-top: -1px;
        margin-left: 0;
    }

    .btn-group-vertical > .btn:not(:first-child):not(:last-child) {
        border-radius: 0;
    }

    .btn-group-vertical > .btn:first-child:not(:last-child) {
        border-top-right-radius: 4px;
        border-top-left-radius: 4px;
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 0;
    }

    .btn-group-vertical > .btn:last-child:not(:first-child) {
        border-top-right-radius: 0;
        border-top-left-radius: 0;
        border-bottom-right-radius: 4px;
        border-bottom-left-radius: 4px;
    }

    .btn-group-vertical > .btn-group:not(:first-child):not(:last-child) > .btn {
        border-radius: 0;
    }

    .btn-group-vertical > .btn-group:first-child:not(:last-child) > .btn:last-child,
    .btn-group-vertical > .btn-group:first-child:not(:last-child) > .dropdown-toggle {
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 0;
    }

    .btn-group-vertical > .btn-group:last-child:not(:first-child) > .btn:first-child {
        border-top-right-radius: 0;
        border-top-left-radius: 0;
    }

.btn-group-justified {
    display: table;
    width: 100%;
    table-layout: fixed;
    border-collapse: separate;
}

    .btn-group-justified > .btn,
    .btn-group-justified > .btn-group {
        float: none;
        display: table-cell;
        width: 1%;
    }

        .btn-group-justified > .btn-group .btn {
            width: 100%;
        }

        .btn-group-justified > .btn-group .dropdown-menu {
            left: auto;
        }

[data-toggle="buttons"] > .btn input[type="radio"],
[data-toggle="buttons"] > .btn input[type="checkbox"],
[data-toggle="buttons"] > .btn-group > .btn input[type="radio"],
[data-toggle="buttons"] > .btn-group > .btn input[type="checkbox"] {
    position: absolute;
    clip: rect(0, 0, 0, 0);
    pointer-events: none;
}

.input-group {
    position: relative;
    display: table;
    border-collapse: separate;
}

    .input-group[class*="col-"] {
        float: none;
        padding-left: 0;
        padding-right: 0;
    }

    .input-group .form-control {
        position: relative;
        z-index: 2;
        float: left;
        width: 100%;
        margin-bottom: 0;
    }

        .input-group .form-control:focus {
            z-index: 3;
        }

    .input-group-addon,
    .input-group-btn,
    .input-group .form-control {
        display: table-cell;
    }

        .input-group-addon:not(:first-child):not(:last-child),
        .input-group-btn:not(:first-child):not(:last-child),
        .input-group .form-control:not(:first-child):not(:last-child) {
            border-radius: 0;
        }

.input-group-addon,
.input-group-btn {
    width: 1%;
    white-space: nowrap;
    vertical-align: middle;
}

.input-group-addon {
    padding: 6px 12px;
    font-size: 13px;
    font-weight: normal;
    line-height: 1;
    color: #777;
    text-align: center;
    background-color: #ddd;
    border: 1px solid #ddd;
    border-radius: 4px;
}

    .input-group-addon.input-sm,
    .input-group-sm > .input-group-addon,
    .input-group-sm > .input-group-btn > .input-group-addon.btn {
        padding: 5px 10px;
        font-size: 12px;
        border-radius: 3px;
    }

    .input-group-addon.input-lg,
    .input-group-lg > .input-group-addon,
    .input-group-lg > .input-group-btn > .input-group-addon.btn {
        padding: 10px 16px;
        font-size: 18px;
        border-radius: 6px;
    }

    .input-group-addon input[type="radio"],
    .input-group-addon input[type="checkbox"] {
        margin-top: 0;
    }

    .input-group .form-control:first-child,
    .input-group-addon:first-child,
    .input-group-btn:first-child > .btn,
    .input-group-btn:first-child > .btn-group > .btn,
    .input-group-btn:first-child > .dropdown-toggle,
    .input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle),
    .input-group-btn:last-child > .btn-group:not(:last-child) > .btn {
        border-bottom-right-radius: 0;
        border-top-right-radius: 0;
    }

    .input-group-addon:first-child {
        border-right: 0;
    }

    .input-group .form-control:last-child,
    .input-group-addon:last-child,
    .input-group-btn:last-child > .btn,
    .input-group-btn:last-child > .btn-group > .btn,
    .input-group-btn:last-child > .dropdown-toggle,
    .input-group-btn:first-child > .btn:not(:first-child),
    .input-group-btn:first-child > .btn-group:not(:first-child) > .btn {
        border-bottom-left-radius: 0;
        border-top-left-radius: 0;
    }

    .input-group-addon:last-child {
        border-left: 0;
    }

.input-group-btn {
    position: relative;
    font-size: 0;
    white-space: nowrap;
}

    .input-group-btn > .btn {
        position: relative;
    }

        .input-group-btn > .btn + .btn {
            margin-left: -1px;
        }

        .input-group-btn > .btn:hover, .input-group-btn > .btn:focus, .input-group-btn > .btn:active {
            z-index: 2;
        }

    .input-group-btn:first-child > .btn,
    .input-group-btn:first-child > .btn-group {
        margin-right: -1px;
    }

    .input-group-btn:last-child > .btn,
    .input-group-btn:last-child > .btn-group {
        z-index: 2;
        margin-left: -1px;
    }

.nav {
    margin-bottom: 0;
    padding-left: 0;
    list-style: none;
}

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

    .nav:after {
        clear: both;
    }

    .nav > li {
        position: relative;
        display: block;
    }

        .nav > li > a {
            position: relative;
            display: block;
            padding: 10px 12px;
        }

            .nav > li > a:hover, .nav > li > a:focus {
                text-decoration: none;
                background-color: #ddd;
            }

        .nav > li.disabled > a {
            color: #808080;
        }

            .nav > li.disabled > a:hover, .nav > li.disabled > a:focus {
                color: #808080;
                text-decoration: none;
                background-color: transparent;
                cursor: not-allowed;
            }

    .nav .open > a, .nav .open > a:hover, .nav .open > a:focus {
        background-color: #ddd;
        border-color: #d9230f;
    }

    .nav .nav-divider {
        height: 1px;
        margin: 9px 0;
        overflow: hidden;
        background-color: #e5e5e5;
    }

    .nav > li > a > img {
        max-width: none;
    }

.nav-tabs {
    border-bottom: 1px solid #ddd;
}

    .nav-tabs > li {
        float: left;
        margin-bottom: -1px;
    }

        .nav-tabs > li > a {
            margin-right: 2px;
            line-height: 1.538462;
            border: 1px solid transparent;
            border-radius: 4px 4px 0 0;
        }

            .nav-tabs > li > a:hover {
                border-color: #ddd #ddd #ddd;
            }

        .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
            color: #444;
            background-color: #fcfcfc;
            border: 1px solid #ddd;
            border-bottom-color: transparent;
            cursor: default;
        }

.nav-pills > li {
    float: left;
}

    .nav-pills > li > a {
        border-radius: 4px;
    }

    .nav-pills > li + li {
        margin-left: 2px;
    }

    .nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus {
        color: #fff;
        background-color: #d9230f;
    }

.nav-stacked > li {
    float: none;
}

    .nav-stacked > li + li {
        margin-top: 2px;
        margin-left: 0;
    }

.nav-justified, .nav-tabs.nav-justified {
    width: 100%;
}

    .nav-justified > li, .nav-tabs.nav-justified > li {
        float: none;
    }

        .nav-justified > li > a, .nav-tabs.nav-justified > li > a {
            text-align: center;
            margin-bottom: 5px;
        }

    .nav-justified > .dropdown .dropdown-menu {
        top: auto;
        left: auto;
    }

@media (min-width: 768px) {
    .nav-justified > li, .nav-tabs.nav-justified > li {
        display: table-cell;
        width: 1%;
    }

        .nav-justified > li > a, .nav-tabs.nav-justified > li > a {
            margin-bottom: 0;
        }
}

.nav-tabs-justified, .nav-tabs.nav-justified {
    border-bottom: 0;
}

    .nav-tabs-justified > li > a, .nav-tabs.nav-justified > li > a {
        margin-right: 0;
        border-radius: 4px;
    }

    .nav-tabs-justified > .active > a, .nav-tabs.nav-justified > .active > a,
    .nav-tabs-justified > .active > a:hover, .nav-tabs.nav-justified > .active > a:hover,
    .nav-tabs-justified > .active > a:focus, .nav-tabs.nav-justified > .active > a:focus {
        border: 1px solid #ddd;
    }

@media (min-width: 768px) {
    .nav-tabs-justified > li > a, .nav-tabs.nav-justified > li > a {
        border-bottom: 1px solid #ddd;
        border-radius: 4px 4px 0 0;
    }

    .nav-tabs-justified > .active > a, .nav-tabs.nav-justified > .active > a,
    .nav-tabs-justified > .active > a:hover, .nav-tabs.nav-justified > .active > a:hover,
    .nav-tabs-justified > .active > a:focus, .nav-tabs.nav-justified > .active > a:focus {
        border-bottom-color: #fcfcfc;
    }
}

.tab-content > .tab-pane {
    display: none;
}

.tab-content > .active {
    display: block;
}

.nav-tabs .dropdown-menu {
    margin-top: -1px;
    border-top-right-radius: 0;
    border-top-left-radius: 0;
}

.navbar {
    position: relative;
    min-height: 50px;
    margin-bottom: 20px;
    border: 1px solid transparent;
}

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

    .navbar:after {
        clear: both;
    }


/*@media (min-width: 768px) {*/
.navbar {
    border-radius: 4px;
}
/*}*/

.navbar-header:before, .navbar-header:after {
    content: " ";
    display: table;
}

.navbar-header:after {
    clear: both;
}

/*@media (min-width: 768px) {*/
.navbar-header {
    float: left;
}
/*}*/

.navbar-collapse {
    overflow-x: visible;
    padding-right: 15px;
    padding-left: 15px;
    border-top: 1px solid transparent;
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1);
    -webkit-overflow-scrolling: touch;
}

    .navbar-collapse:before, .navbar-collapse:after {
        content: " ";
        display: table;
    }

    .navbar-collapse:after {
        clear: both;
    }

    .navbar-collapse.in {
        overflow-y: auto;
    }

/*@media (min-width: 768px) {*/
.navbar-collapse {
    width: auto;
    border-top: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
}

    .navbar-collapse.collapse {
        display: block !important;
        /*height: auto !important;*/
        height: 50px; /*Anton Fix*/
        padding-bottom: 0;
        overflow: visible !important;
    }

    .navbar-collapse.in {
        overflow-y: visible;
    }

.navbar-fixed-top .navbar-collapse,
.navbar-static-top .navbar-collapse,
.navbar-fixed-bottom .navbar-collapse {
    padding-left: 0;
    padding-right: 0;
}
/*}*/

.navbar-fixed-top .navbar-collapse,
.navbar-fixed-bottom .navbar-collapse {
    max-height: 340px;
}

@media (max-device-width: 480px) and (orientation: landscape) {
    .navbar-fixed-top .navbar-collapse,
    .navbar-fixed-bottom .navbar-collapse {
        max-height: 200px;
    }

    .align_right_left_mobile {
        text-align: left;
    }
}

@media (max-width: 480px) {
    .align_right_left_mobile {
        text-align: left;
    }
}

.container > .navbar-header,
.container > .navbar-collapse,
.container-fluid > .navbar-header,
.container-fluid > .navbar-collapse {
    margin-right: -15px;
    margin-left: -15px;
}

@media (min-width: 768px) {
    .container > .navbar-header,
    .container > .navbar-collapse,
    .container-fluid > .navbar-header,
    .container-fluid > .navbar-collapse {
        margin-right: 0;
        margin-left: 0;
    }
}

.navbar-static-top {
    z-index: 1000;
    border-width: 0 0 1px;
}

@media (min-width: 768px) {
    .navbar-static-top {
        border-radius: 0;
    }
}

.navbar-fixed-top,
.navbar-fixed-bottom {
    position: fixed;
    right: 0;
    left: 0;
    z-index: 1030;
}

@media (min-width: 768px) {
    .navbar-fixed-top,
    .navbar-fixed-bottom {
        border-radius: 0;
    }
}

.navbar-fixed-top {
    top: 0;
    border-width: 0 0 1px;
}

.navbar-fixed-bottom {
    bottom: 0;
    margin-bottom: 0;
    border-width: 1px 0 0;
}

.navbar-brand {
    float: left;
    padding: 15px 15px;
    font-size: 18px;
    line-height: 20px;
    height: 50px;
}

    .navbar-brand:hover, .navbar-brand:focus {
        text-decoration: none;
    }

    .navbar-brand > img {
        display: block;
    }

@media (min-width: 768px) {
    .navbar > .container .navbar-brand,
    .navbar > .container-fluid .navbar-brand {
        margin-left: -15px;
    }
}

.navbar-toggle {
    position: relative;
    float: right;
    margin-right: 15px;
    padding: 9px 10px;
    margin-top: 8px;
    margin-bottom: 8px;
    background-color: transparent;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
}

    .navbar-toggle:focus {
        outline: 0;
    }

    .navbar-toggle .icon-bar {
        display: block;
        width: 22px;
        height: 2px;
        border-radius: 1px;
    }

        .navbar-toggle .icon-bar + .icon-bar {
            margin-top: 4px;
        }

@media (min-width: 768px) {
    .navbar-toggle {
        display: none;
    }
}

.navbar-nav {
    margin: 7.5px -15px;
}

    .navbar-nav > li > a {
        padding-top: 10px;
        padding-bottom: 10px;
        line-height: 20px;
    }

/*@media (max-width: 767px) {
    .navbar-nav .open .dropdown-menu {
        position: static;
        float: none;
        width: auto;
        margin-top: 0;
        background-color: transparent;
        border: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

        .navbar-nav .open .dropdown-menu > li > a,
        .navbar-nav .open .dropdown-menu .dropdown-header {
            padding: 5px 15px 5px 25px;
        }

        .navbar-nav .open .dropdown-menu > li > a {
            line-height: 20px;
        }

            .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-nav .open .dropdown-menu > li > a:focus {
                background-image: none;
            }

    .white_text_dt_black_mb {
        color: #333333;
    }

    .nav > li > a {
        padding: 10px 0;
    }
}*/
@media (min-width: 768px) {
    .navbar-nav {
        float: left;
        margin: 0;
    }

        .navbar-nav > li {
            float: left;
        }

            .navbar-nav > li > a {
                padding-top: 15px;
                padding-bottom: 15px;
            }
}

@media (max-width: 767px) {
    .navbar-nav {
        float: right;
        margin: 0;
    }

        .navbar-nav > li {
            float: right;
        }

            .navbar-nav > li > a {
                padding-top: 15px;
                padding-bottom: 15px;
            }
}

.navbar-form {
    margin-left: -15px;
    margin-right: -15px;
    padding: 10px 15px;
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
    -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1);
    margin-top: 8px;
    margin-bottom: 8px;
}

/* width fix? */
@media (min-width: 768px) {
    .navbar-form .form-group {
        display: inline-block;
        margin-bottom: 0;
        vertical-align: middle;
    }

    .navbar-form .form-control {
        display: inline-block;
        width: auto;
        vertical-align: middle;
    }

    .navbar-form .form-control-static {
        display: inline-block;
    }

    .navbar-form .input-group {
        display: inline-table;
        vertical-align: middle;
    }

        .navbar-form .input-group .input-group-addon,
        .navbar-form .input-group .input-group-btn,
        .navbar-form .input-group .form-control {
            width: auto;
        }

        .navbar-form .input-group > .form-control {
            width: 100%;
        }

    .navbar-form .control-label {
        margin-bottom: 0;
        vertical-align: middle;
    }

    .navbar-form .radio,
    .navbar-form .checkbox {
        display: inline-block;
        margin-top: 0;
        margin-bottom: 0;
        vertical-align: middle;
    }

        .navbar-form .radio label,
        .navbar-form .checkbox label {
            padding-left: 0;
        }

        .navbar-form .radio input[type="radio"],
        .navbar-form .checkbox input[type="checkbox"] {
            position: relative;
            margin-left: 0;
        }

    .navbar-form .has-feedback .form-control-feedback {
        top: 0;
    }
}

@media (max-width: 767px) {
    .navbar-form .form-group {
        margin-bottom: 5px;
    }

        .navbar-form .form-group:last-child {
            margin-bottom: 0;
        }
}

/* width fix? */
@media (min-width: 768px) {
    .navbar-form {
        width: auto;
        border: 0;
        margin-left: 0;
        margin-right: 0;
        padding-top: 0;
        padding-bottom: 0;
        -webkit-box-shadow: none;
        box-shadow: none;
    }
}

.navbar-nav > li > .dropdown-menu {
    margin-top: 0;
    border-top-right-radius: 0;
    border-top-left-radius: 0;
}

.navbar-fixed-bottom .navbar-nav > li > .dropdown-menu {
    margin-bottom: 0;
    border-top-right-radius: 4px;
    border-top-left-radius: 4px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

.navbar-btn {
    margin-top: 8px;
    margin-bottom: 8px;
}

    .navbar-btn.btn-sm, .btn-group-sm > .navbar-btn.btn {
        margin-top: 10px;
        margin-bottom: 10px;
    }

    .navbar-btn.btn-xs, .btn-group-xs > .navbar-btn.btn {
        margin-top: 14px;
        margin-bottom: 14px;
    }

.navbar-text {
    margin-top: 15px;
    margin-bottom: 15px;
}

@media (min-width: 768px) {
    .navbar-text {
        float: left;
        margin-left: 15px;
        margin-right: 15px;
    }
}

/*@media (min-width: 768px) {*/
.navbar-left {
    float: left !important;
}

.navbar-right {
    float: right !important;
    margin-right: -15px;
}

    .navbar-right ~ .navbar-right {
        margin-right: 0;
    }
/*}*/

.navbar-default {
    background-color: #E52423;
    border-color: #f6f6f6;
}

    .navbar-default .navbar-brand {
        color: #777;
    }

        .navbar-default .navbar-brand:hover, .navbar-default .navbar-brand:focus {
            color: #777;
            background-color: transparent;
        }

    .navbar-default .navbar-text {
        color: #777;
    }

    .navbar-default .navbar-nav > li > a {
        color: #777;
    }

        .navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
            color: #d9230f;
            background-color: #fff;
        }

    .navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus {
        color: #222;
        background-color: #ddd;
    }

    .navbar-default .navbar-nav > .disabled > a, .navbar-default .navbar-nav > .disabled > a:hover, .navbar-default .navbar-nav > .disabled > a:focus {
        color: #ccc;
        background-color: transparent;
    }

    .navbar-default .navbar-toggle {
        border-color: transparent;
    }

        .navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
            background-color: #ddd;
        }

        .navbar-default .navbar-toggle .icon-bar {
            background-color: #222;
        }

    .navbar-default .navbar-collapse,
    .navbar-default .navbar-form {
        border-color: #f6f6f6;
    }

    .navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
        background-color: #ddd;
        color: #222;
    }

    /*@media (max-width: 767px) {
    .navbar-default .navbar-nav .open .dropdown-menu > li > a {
        color: #777;
    }

        .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
            color: #d9230f;
            background-color: #fff;
        }

    .navbar-default .navbar-nav .open .dropdown-menu > .active > a, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
        color: #222;
        background-color: #ddd;
    }

    .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a, .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > .disabled > a:focus {
        color: #ccc;
        background-color: transparent;
    }
}*/

    .navbar-default .navbar-link {
        color: #777;
    }

        .navbar-default .navbar-link:hover {
            color: #d9230f;
        }

    .navbar-default .btn-link {
        color: #777;
    }

        .navbar-default .btn-link:hover, .navbar-default .btn-link:focus {
            color: #d9230f;
        }

        .navbar-default .btn-link[disabled]:hover, .navbar-default .btn-link[disabled]:focus,
        fieldset[disabled] .navbar-default .btn-link:hover,
        fieldset[disabled] .navbar-default .btn-link:focus {
            color: #ccc;
        }

.navbar-inverse {
    background-color: #d9230f;
    border-color: #c8200e;
}

    .navbar-inverse .navbar-brand {
        color: #fff;
    }

        .navbar-inverse .navbar-brand:hover, .navbar-inverse .navbar-brand:focus {
            color: #fff;
            background-color: transparent;
        }

    .navbar-inverse .navbar-text {
        color: #fff;
    }

    .navbar-inverse .navbar-nav > li > a {
        color: #fff;
    }

        .navbar-inverse .navbar-nav > li > a:hover, .navbar-inverse .navbar-nav > li > a:focus {
            color: #fff;
            background-color: #ea2610;
        }

    .navbar-inverse .navbar-nav > .active > a, .navbar-inverse .navbar-nav > .active > a:hover, .navbar-inverse .navbar-nav > .active > a:focus {
        color: #fff;
        background-color: #ea2610;
    }

    .navbar-inverse .navbar-nav > .disabled > a, .navbar-inverse .navbar-nav > .disabled > a:hover, .navbar-inverse .navbar-nav > .disabled > a:focus {
        color: #ccc;
        background-color: transparent;
    }

    .navbar-inverse .navbar-toggle {
        border-color: transparent;
    }

        .navbar-inverse .navbar-toggle:hover, .navbar-inverse .navbar-toggle:focus {
            background-color: #ea2610;
        }

        .navbar-inverse .navbar-toggle .icon-bar {
            background-color: #fff;
        }

    .navbar-inverse .navbar-collapse,
    .navbar-inverse .navbar-form {
        border-color: #b81e0d;
    }

    .navbar-inverse .navbar-nav > .open > a, .navbar-inverse .navbar-nav > .open > a:hover, .navbar-inverse .navbar-nav > .open > a:focus {
        background-color: #ea2610;
        color: #fff;
    }

    /*@media (max-width: 767px) {
    .navbar-inverse .navbar-nav .open .dropdown-menu > .dropdown-header {
        border-color: #c8200e;
    }

    .navbar-inverse .navbar-nav .open .dropdown-menu .divider {
        background-color: #c8200e;
    }

    .navbar-inverse .navbar-nav .open .dropdown-menu > li > a {
        color: #fff;
    }

        .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-inverse .navbar-nav .open .dropdown-menu > li > a:focus {
            color: #fff;
            background-color: #ea2610;
        }

    .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a, .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:hover, .navbar-inverse .navbar-nav .open .dropdown-menu > .active > a:focus {
        color: #fff;
        background-color: #ea2610;
    }

    .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a, .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:hover, .navbar-inverse .navbar-nav .open .dropdown-menu > .disabled > a:focus {
        color: #ccc;
        background-color: transparent;
    }
}*/

    .navbar-inverse .navbar-link {
        color: #fff;
    }

        .navbar-inverse .navbar-link:hover {
            color: #fff;
        }

    .navbar-inverse .btn-link {
        color: #fff;
    }

        .navbar-inverse .btn-link:hover, .navbar-inverse .btn-link:focus {
            color: #fff;
        }

        .navbar-inverse .btn-link[disabled]:hover, .navbar-inverse .btn-link[disabled]:focus,
        fieldset[disabled] .navbar-inverse .btn-link:hover,
        fieldset[disabled] .navbar-inverse .btn-link:focus {
            color: #ccc;
        }

.breadcrumb {
    padding: 8px 15px;
    margin-bottom: 20px;
    list-style: none;
    background-color: transparent;
    border-radius: 4px;
}

    .breadcrumb > li {
        display: inline-block;
    }

        .breadcrumb > li + li:before {
            content: "/ ";
            padding: 0 5px;
            color: #777;
        }

    .breadcrumb > .active {
        color: #808080;
    }

.pagination {
    display: inline-block;
    padding-left: 0;
    margin: 20px 0;
    border-radius: 4px;
}

    .pagination > li {
        display: inline;
    }

        .pagination > li > a,
        .pagination > li > span {
            position: relative;
            float: left;
            padding: 6px 12px;
            line-height: 1.538462;
            text-decoration: none;
            color: #777;
            background-color: #fff;
            border: 1px solid #ddd;
            margin-left: -1px;
        }

        .pagination > li:first-child > a,
        .pagination > li:first-child > span {
            margin-left: 0;
            border-bottom-left-radius: 4px;
            border-top-left-radius: 4px;
        }

        .pagination > li:last-child > a,
        .pagination > li:last-child > span {
            border-bottom-right-radius: 4px;
            border-top-right-radius: 4px;
        }

        .pagination > li > a:hover, .pagination > li > a:focus,
        .pagination > li > span:hover,
        .pagination > li > span:focus {
            z-index: 2;
            color: #fff;
            background-color: #d9230f;
            border-color: #d9230f;
        }

    .pagination > .active > a, .pagination > .active > a:hover, .pagination > .active > a:focus,
    .pagination > .active > span,
    .pagination > .active > span:hover,
    .pagination > .active > span:focus {
        z-index: 3;
        color: #fff;
        background-color: #d9230f;
        border-color: #d9230f;
        cursor: default;
    }

    .pagination > .disabled > span,
    .pagination > .disabled > span:hover,
    .pagination > .disabled > span:focus,
    .pagination > .disabled > a,
    .pagination > .disabled > a:hover,
    .pagination > .disabled > a:focus {
        color: #ddd;
        background-color: #fff;
        border-color: #ddd;
        cursor: not-allowed;
    }

.pagination-lg > li > a,
.pagination-lg > li > span {
    padding: 10px 16px;
    font-size: 18px;
    line-height: 1.333333;
}

.pagination-lg > li:first-child > a,
.pagination-lg > li:first-child > span {
    border-bottom-left-radius: 6px;
    border-top-left-radius: 6px;
}

.pagination-lg > li:last-child > a,
.pagination-lg > li:last-child > span {
    border-bottom-right-radius: 6px;
    border-top-right-radius: 6px;
}

.pagination-sm > li > a,
.pagination-sm > li > span {
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
}

.pagination-sm > li:first-child > a,
.pagination-sm > li:first-child > span {
    border-bottom-left-radius: 3px;
    border-top-left-radius: 3px;
}

.pagination-sm > li:last-child > a,
.pagination-sm > li:last-child > span {
    border-bottom-right-radius: 3px;
    border-top-right-radius: 3px;
}

.pager {
    padding-left: 0;
    margin: 20px 0;
    list-style: none;
    text-align: center;
}

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

    .pager:after {
        clear: both;
    }

    .pager li {
        display: inline;
    }

        .pager li > a,
        .pager li > span {
            display: inline-block;
            padding: 5px 14px;
            background-color: #fff;
            border: 1px solid #ddd;
            border-radius: 15px;
        }

            .pager li > a:hover,
            .pager li > a:focus {
                text-decoration: none;
                background-color: #d9230f;
            }

    .pager .next > a,
    .pager .next > span {
        float: right;
    }

    .pager .previous > a,
    .pager .previous > span {
        float: left;
    }

    .pager .disabled > a,
    .pager .disabled > a:hover,
    .pager .disabled > a:focus,
    .pager .disabled > span {
        color: #ddd;
        background-color: #fff;
        cursor: not-allowed;
    }

.label {
    display: inline;
    padding: .2em .6em .3em;
    font-size: 75%;
    font-weight: bold;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25em;
}

    .label:empty {
        display: none;
    }

.btn .label {
    position: relative;
    top: -1px;
}

a.label:hover, a.label:focus {
    color: #fff;
    text-decoration: none;
    cursor: pointer;
}

.label-default {
    background-color: #474949;
}

    .label-default[href]:hover, .label-default[href]:focus {
        background-color: #2e2f2f;
    }

.label-primary {
    background-color: #d9230f;
}

    .label-primary[href]:hover, .label-primary[href]:focus {
        background-color: #a91b0c;
    }

.label-success {
    background-color: #469408;
}

    .label-success[href]:hover, .label-success[href]:focus {
        background-color: #2f6405;
    }

.label-info {
    background-color: #029acf;
}

    .label-info[href]:hover, .label-info[href]:focus {
        background-color: #02749c;
    }

.label-warning {
    background-color: #9b479f;
}

    .label-warning[href]:hover, .label-warning[href]:focus {
        background-color: #79377c;
    }

.label-danger {
    background-color: #d9831f;
}

    .label-danger[href]:hover, .label-danger[href]:focus {
        background-color: #ac6819;
    }

.badge {
    display: inline-block;
    min-width: 10px;
    padding: 3px 7px;
    font-size: 12px;
    font-weight: bold;
    color: #fff;
    line-height: 1;
    vertical-align: middle;
    white-space: nowrap;
    text-align: center;
    background-color: #d9230f;
    border-radius: 10px;
}

    .badge:empty {
        display: none;
    }

.btn .badge {
    position: relative;
    top: -1px;
}

.btn-xs .badge, .btn-group-xs > .btn .badge,
.btn-group-xs > .btn .badge {
    top: 0;
    padding: 1px 5px;
}

.list-group-item.active > .badge,
.nav-pills > .active > a > .badge {
    color: #d9230f;
    background-color: #fff;
}

.list-group-item > .badge {
    float: right;
}

    .list-group-item > .badge + .badge {
        margin-right: 5px;
    }

.nav-pills > li > a > .badge {
    margin-left: 3px;
}

a.badge:hover, a.badge:focus {
    color: #fff;
    text-decoration: none;
    cursor: pointer;
}

.jumbotron {
    padding-top: 30px;
    padding-bottom: 30px;
    margin-bottom: 30px;
    color: inherit;
    background-color: #f3f3f3;
}

    .jumbotron h1,
    .jumbotron .h1 {
        color: inherit;
    }

    .jumbotron p {
        margin-bottom: 15px;
        font-size: 20px;
        font-weight: 200;
    }

    .jumbotron > hr {
        border-top-color: #dadada;
    }

.container .jumbotron,
.container-fluid .jumbotron {
    border-radius: 6px;
    padding-left: 15px;
    padding-right: 15px;
}

.jumbotron .container {
    max-width: 100%;
}

@media screen and (min-width: 768px) {
    .jumbotron {
        padding-top: 48px;
        padding-bottom: 48px;
    }

    .container .jumbotron,
    .container-fluid .jumbotron {
        padding-left: 60px;
        padding-right: 60px;
    }

    .jumbotron h1,
    .jumbotron .h1 {
        font-size: 59px;
    }
}

.thumbnail {
    display: block;
    padding: 4px;
    margin-bottom: 20px;
    line-height: 1.538462;
    background-color: #fcfcfc;
    border: 1px solid #ddd;
    border-radius: 4px;
    -webkit-transition: border 0.2s ease-in-out;
    -o-transition: border 0.2s ease-in-out;
    transition: border 0.2s ease-in-out;
}

    .thumbnail > img,
    .thumbnail a > img {
        display: block;
        max-width: 100%;
        height: auto;
        margin-left: auto;
        margin-right: auto;
    }

    .thumbnail .caption {
        padding: 9px;
        color: #777;
    }

a.thumbnail:hover,
a.thumbnail:focus,
a.thumbnail.active {
    border-color: #d9230f;
}

.alert {
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px;
}

    .alert h4 {
        margin-top: 0;
        color: inherit;
    }

    .alert .alert-link {
        font-weight: bold;
    }

    .alert > p,
    .alert > ul {
        margin-bottom: 0;
    }

        .alert > p + p {
            margin-top: 5px;
        }

.alert-dismissable,
.alert-dismissible {
    padding-right: 35px;
}

    .alert-dismissable .close,
    .alert-dismissible .close {
        position: relative;
        top: -2px;
        right: -21px;
        color: inherit;
    }

.alert-success {
    background-color: #469408;
    border-color: #469408;
    color: #fff;
}

    .alert-success hr {
        border-top-color: #3b7c07;
    }

    .alert-success .alert-link {
        color: #e6e6e6;
    }

.alert-info {
    background-color: #029acf;
    border-color: #029acf;
    color: #fff;
}

    .alert-info hr {
        border-top-color: #0287b6;
    }

    .alert-info .alert-link {
        color: #e6e6e6;
    }

.alert-warning {
    background-color: #9b479f;
    border-color: #9b479f;
    color: #fff;
}

    .alert-warning hr {
        border-top-color: #8a3f8d;
    }

    .alert-warning .alert-link {
        color: #e6e6e6;
    }

.alert-danger {
    background-color: #d9831f;
    border-color: #d9831f;
    color: #fff;
}

    .alert-danger hr {
        border-top-color: #c3761c;
    }

    .alert-danger .alert-link {
        color: #e6e6e6;
    }

@-webkit-keyframes progress-bar-stripes {
    from {
        background-position: 40px 0;
    }

    to {
        background-position: 0 0;
    }
}

@-o-keyframes progress-bar-stripes {
    from {
        background-position: 40px 0;
    }

    to {
        background-position: 0 0;
    }
}

@keyframes progress-bar-stripes {
    from {
        background-position: 40px 0;
    }

    to {
        background-position: 0 0;
    }
}

.progress {
    overflow: hidden;
    height: 20px;
    background-color: #f5f5f5;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
}

.progress-bar {
    float: left;
    width: 0%;
    height: 100%;
    font-size: 12px;
    line-height: 20px;
    color: #fff;
    text-align: center;
    background-color: #d9230f;
    -webkit-box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
    box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.15);
    -webkit-transition: width 0.6s ease;
    -o-transition: width 0.6s ease;
    transition: width 0.6s ease;
}

.progress-striped .progress-bar,
.progress-bar-striped {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    -webkit-background-size: 40px 40px;
    background-size: 40px 40px;
}

.progress.active .progress-bar,
.progress-bar.active {
    -webkit-animation: progress-bar-stripes 2s linear infinite;
    -o-animation: progress-bar-stripes 2s linear infinite;
    animation: progress-bar-stripes 2s linear infinite;
}

.progress-bar-success {
    background-color: #469408;
}

.progress-striped .progress-bar-success {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}

.progress-bar-info {
    background-color: #029acf;
}

.progress-striped .progress-bar-info {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}

.progress-bar-warning {
    background-color: #9b479f;
}

.progress-striped .progress-bar-warning {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}

.progress-bar-danger {
    background-color: #d9831f;
}

.progress-striped .progress-bar-danger {
    background-image: -webkit-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: -o-linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
    background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
}

.media {
    margin-top: 15px;
}

    .media:first-child {
        margin-top: 0;
    }

.media,
.media-body {
    zoom: 1;
    overflow: hidden;
}

.media-body {
    width: 10000px;
}

.media-object {
    display: block;
}

    .media-object.img-thumbnail {
        max-width: none;
    }

.media-right,
.media > .pull-right {
    padding-left: 10px;
}

.media-left,
.media > .pull-left {
    padding-right: 10px;
}

.media-left,
.media-right,
.media-body {
    display: table-cell;
    vertical-align: top;
}

.media-middle {
    vertical-align: middle;
}

.media-bottom {
    vertical-align: bottom;
}

.media-heading {
    margin-top: 0;
    margin-bottom: 5px;
}

.media-list {
    padding-left: 0;
    list-style: none;
}

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

.list-group-item {
    position: relative;
    display: block;
    padding: 10px 15px;
    margin-bottom: -1px;
    background-color: #fff;
    border: 1px solid #ddd;
}

    .list-group-item:first-child {
        border-top-right-radius: 4px;
        border-top-left-radius: 4px;
    }

    .list-group-item:last-child {
        margin-bottom: 0;
        border-bottom-right-radius: 4px;
        border-bottom-left-radius: 4px;
    }

a.list-group-item,
button.list-group-item {
    color: #777;
}

    a.list-group-item .list-group-item-heading,
    button.list-group-item .list-group-item-heading {
        color: #222;
    }

    a.list-group-item:hover, a.list-group-item:focus,
    button.list-group-item:hover,
    button.list-group-item:focus {
        text-decoration: none;
        color: #444;
        background-color: #f5f5f5;
    }

button.list-group-item {
    width: 100%;
    text-align: left;
}

.list-group-item.disabled, .list-group-item.disabled:hover, .list-group-item.disabled:focus {
    background-color: #eee;
    color: #808080;
    cursor: not-allowed;
}

    .list-group-item.disabled .list-group-item-heading, .list-group-item.disabled:hover .list-group-item-heading, .list-group-item.disabled:focus .list-group-item-heading {
        color: inherit;
    }

    .list-group-item.disabled .list-group-item-text, .list-group-item.disabled:hover .list-group-item-text, .list-group-item.disabled:focus .list-group-item-text {
        color: #808080;
    }

.list-group-item.active, .list-group-item.active:hover, .list-group-item.active:focus {
    z-index: 2;
    color: #fff;
    background-color: #d9230f;
    border-color: #d9230f;
}

    .list-group-item.active .list-group-item-heading,
    .list-group-item.active .list-group-item-heading > small,
    .list-group-item.active .list-group-item-heading > .small, .list-group-item.active:hover .list-group-item-heading,
    .list-group-item.active:hover .list-group-item-heading > small,
    .list-group-item.active:hover .list-group-item-heading > .small, .list-group-item.active:focus .list-group-item-heading,
    .list-group-item.active:focus .list-group-item-heading > small,
    .list-group-item.active:focus .list-group-item-heading > .small {
        color: inherit;
    }

    .list-group-item.active .list-group-item-text, .list-group-item.active:hover .list-group-item-text, .list-group-item.active:focus .list-group-item-text {
        color: #777;
    }

.list-group-item-success {
    color: #469408;
    background-color: #c8e6c9;
}

a.list-group-item-success,
button.list-group-item-success {
    color: #469408;
}

    a.list-group-item-success .list-group-item-heading,
    button.list-group-item-success .list-group-item-heading {
        color: inherit;
    }

    a.list-group-item-success:hover, a.list-group-item-success:focus,
    button.list-group-item-success:hover,
    button.list-group-item-success:focus {
        color: #469408;
        background-color: #b6deb8;
    }

    a.list-group-item-success.active, a.list-group-item-success.active:hover, a.list-group-item-success.active:focus,
    button.list-group-item-success.active,
    button.list-group-item-success.active:hover,
    button.list-group-item-success.active:focus {
        color: #fff;
        background-color: #469408;
        border-color: #469408;
    }

.list-group-item-info {
    color: #029acf;
    background-color: #b3e5fc;
}

a.list-group-item-info,
button.list-group-item-info {
    color: #029acf;
}

    a.list-group-item-info .list-group-item-heading,
    button.list-group-item-info .list-group-item-heading {
        color: inherit;
    }

    a.list-group-item-info:hover, a.list-group-item-info:focus,
    button.list-group-item-info:hover,
    button.list-group-item-info:focus {
        color: #029acf;
        background-color: #9addfb;
    }

    a.list-group-item-info.active, a.list-group-item-info.active:hover, a.list-group-item-info.active:focus,
    button.list-group-item-info.active,
    button.list-group-item-info.active:hover,
    button.list-group-item-info.active:focus {
        color: #fff;
        background-color: #029acf;
        border-color: #029acf;
    }

.list-group-item-warning {
    color: #9b479f;
    background-color: #e1bee7;
}

a.list-group-item-warning,
button.list-group-item-warning {
    color: #9b479f;
}

    a.list-group-item-warning .list-group-item-heading,
    button.list-group-item-warning .list-group-item-heading {
        color: inherit;
    }

    a.list-group-item-warning:hover, a.list-group-item-warning:focus,
    button.list-group-item-warning:hover,
    button.list-group-item-warning:focus {
        color: #9b479f;
        background-color: #d8abe0;
    }

    a.list-group-item-warning.active, a.list-group-item-warning.active:hover, a.list-group-item-warning.active:focus,
    button.list-group-item-warning.active,
    button.list-group-item-warning.active:hover,
    button.list-group-item-warning.active:focus {
        color: #fff;
        background-color: #9b479f;
        border-color: #9b479f;
    }

.list-group-item-danger {
    color: #d9831f;
    background-color: #ffe0b2;
}

a.list-group-item-danger,
button.list-group-item-danger {
    color: #d9831f;
}

    a.list-group-item-danger .list-group-item-heading,
    button.list-group-item-danger .list-group-item-heading {
        color: inherit;
    }

    a.list-group-item-danger:hover, a.list-group-item-danger:focus,
    button.list-group-item-danger:hover,
    button.list-group-item-danger:focus {
        color: #d9831f;
        background-color: #ffd699;
    }

    a.list-group-item-danger.active, a.list-group-item-danger.active:hover, a.list-group-item-danger.active:focus,
    button.list-group-item-danger.active,
    button.list-group-item-danger.active:hover,
    button.list-group-item-danger.active:focus {
        color: #fff;
        background-color: #d9831f;
        border-color: #d9831f;
    }

.list-group-item-heading {
    margin-top: 0;
    margin-bottom: 5px;
}

.list-group-item-text {
    margin-bottom: 0;
    line-height: 1.3;
}

.panel {
    margin-bottom: 10px;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.panel-body {
    padding: 0px 15px 5px 15px;
}

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

    .panel-body:after {
        clear: both;
    }

.panel-heading {
    padding: 10px 15px;
    border-bottom: 1px solid transparent;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px;
}

    .panel-heading > .dropdown .dropdown-toggle {
        color: inherit;
    }

.panel-title {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 15px;
    color: inherit;
}

    .panel-title > a,
    .panel-title > small,
    .panel-title > .small,
    .panel-title > small > a,
    .panel-title > .small > a {
        color: inherit;
        text-decoration: none;
    }

.panel-footer {
    padding: 10px 15px;
    background-color: #fcfcfc;
    border-top: 1px solid #ddd;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
}

.panel > .list-group,
.panel > .panel-collapse > .list-group {
    margin-bottom: 0;
}

    .panel > .list-group .list-group-item,
    .panel > .panel-collapse > .list-group .list-group-item {
        border-width: 1px 0;
        border-radius: 0;
    }

    .panel > .list-group:first-child .list-group-item:first-child,
    .panel > .panel-collapse > .list-group:first-child .list-group-item:first-child {
        border-top: 0;
        border-top-right-radius: 3px;
        border-top-left-radius: 3px;
    }

    .panel > .list-group:last-child .list-group-item:last-child,
    .panel > .panel-collapse > .list-group:last-child .list-group-item:last-child {
        border-bottom: 0;
        border-bottom-right-radius: 3px;
        border-bottom-left-radius: 3px;
    }

.panel > .panel-heading + .panel-collapse > .list-group .list-group-item:first-child {
    border-top-right-radius: 0;
    border-top-left-radius: 0;
}

.panel-heading + .list-group .list-group-item:first-child {
    border-top-width: 0;
}

.list-group + .panel-footer {
    border-top-width: 0;
}

.panel > .table,
.panel > .table-responsive > .table,
.panel > .panel-collapse > .table {
    margin-bottom: 0;
}

    .panel > .table caption,
    .panel > .table-responsive > .table caption,
    .panel > .panel-collapse > .table caption {
        padding-left: 15px;
        padding-right: 15px;
    }

    .panel > .table:first-child,
    .panel > .table-responsive:first-child > .table:first-child {
        border-top-right-radius: 3px;
        border-top-left-radius: 3px;
    }

        .panel > .table:first-child > thead:first-child > tr:first-child,
        .panel > .table:first-child > tbody:first-child > tr:first-child,
        .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child,
        .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child {
            border-top-left-radius: 3px;
            border-top-right-radius: 3px;
        }

            .panel > .table:first-child > thead:first-child > tr:first-child td:first-child,
            .panel > .table:first-child > thead:first-child > tr:first-child th:first-child,
            .panel > .table:first-child > tbody:first-child > tr:first-child td:first-child,
            .panel > .table:first-child > tbody:first-child > tr:first-child th:first-child,
            .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:first-child,
            .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:first-child,
            .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:first-child,
            .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:first-child {
                border-top-left-radius: 3px;
            }

            .panel > .table:first-child > thead:first-child > tr:first-child td:last-child,
            .panel > .table:first-child > thead:first-child > tr:first-child th:last-child,
            .panel > .table:first-child > tbody:first-child > tr:first-child td:last-child,
            .panel > .table:first-child > tbody:first-child > tr:first-child th:last-child,
            .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child td:last-child,
            .panel > .table-responsive:first-child > .table:first-child > thead:first-child > tr:first-child th:last-child,
            .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child td:last-child,
            .panel > .table-responsive:first-child > .table:first-child > tbody:first-child > tr:first-child th:last-child {
                border-top-right-radius: 3px;
            }

    .panel > .table:last-child,
    .panel > .table-responsive:last-child > .table:last-child {
        border-bottom-right-radius: 3px;
        border-bottom-left-radius: 3px;
    }

        .panel > .table:last-child > tbody:last-child > tr:last-child,
        .panel > .table:last-child > tfoot:last-child > tr:last-child,
        .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child,
        .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child {
            border-bottom-left-radius: 3px;
            border-bottom-right-radius: 3px;
        }

            .panel > .table:last-child > tbody:last-child > tr:last-child td:first-child,
            .panel > .table:last-child > tbody:last-child > tr:last-child th:first-child,
            .panel > .table:last-child > tfoot:last-child > tr:last-child td:first-child,
            .panel > .table:last-child > tfoot:last-child > tr:last-child th:first-child,
            .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:first-child,
            .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:first-child,
            .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:first-child,
            .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:first-child {
                border-bottom-left-radius: 3px;
            }

            .panel > .table:last-child > tbody:last-child > tr:last-child td:last-child,
            .panel > .table:last-child > tbody:last-child > tr:last-child th:last-child,
            .panel > .table:last-child > tfoot:last-child > tr:last-child td:last-child,
            .panel > .table:last-child > tfoot:last-child > tr:last-child th:last-child,
            .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child td:last-child,
            .panel > .table-responsive:last-child > .table:last-child > tbody:last-child > tr:last-child th:last-child,
            .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child td:last-child,
            .panel > .table-responsive:last-child > .table:last-child > tfoot:last-child > tr:last-child th:last-child {
                border-bottom-right-radius: 3px;
            }

    .panel > .panel-body + .table,
    .panel > .panel-body + .table-responsive,
    .panel > .table + .panel-body,
    .panel > .table-responsive + .panel-body {
        border-top: 1px solid #ddd;
    }

    .panel > .table > tbody:first-child > tr:first-child th,
    .panel > .table > tbody:first-child > tr:first-child td {
        border-top: 0;
    }

.panel > .table-bordered,
.panel > .table-responsive > .table-bordered {
    border: 0;
}

    .panel > .table-bordered > thead > tr > th:first-child,
    .panel > .table-bordered > thead > tr > td:first-child,
    .panel > .table-bordered > tbody > tr > th:first-child,
    .panel > .table-bordered > tbody > tr > td:first-child,
    .panel > .table-bordered > tfoot > tr > th:first-child,
    .panel > .table-bordered > tfoot > tr > td:first-child,
    .panel > .table-responsive > .table-bordered > thead > tr > th:first-child,
    .panel > .table-responsive > .table-bordered > thead > tr > td:first-child,
    .panel > .table-responsive > .table-bordered > tbody > tr > th:first-child,
    .panel > .table-responsive > .table-bordered > tbody > tr > td:first-child,
    .panel > .table-responsive > .table-bordered > tfoot > tr > th:first-child,
    .panel > .table-responsive > .table-bordered > tfoot > tr > td:first-child {
        border-left: 0;
    }

    .panel > .table-bordered > thead > tr > th:last-child,
    .panel > .table-bordered > thead > tr > td:last-child,
    .panel > .table-bordered > tbody > tr > th:last-child,
    .panel > .table-bordered > tbody > tr > td:last-child,
    .panel > .table-bordered > tfoot > tr > th:last-child,
    .panel > .table-bordered > tfoot > tr > td:last-child,
    .panel > .table-responsive > .table-bordered > thead > tr > th:last-child,
    .panel > .table-responsive > .table-bordered > thead > tr > td:last-child,
    .panel > .table-responsive > .table-bordered > tbody > tr > th:last-child,
    .panel > .table-responsive > .table-bordered > tbody > tr > td:last-child,
    .panel > .table-responsive > .table-bordered > tfoot > tr > th:last-child,
    .panel > .table-responsive > .table-bordered > tfoot > tr > td:last-child {
        border-right: 0;
    }

    .panel > .table-bordered > thead > tr:first-child > td,
    .panel > .table-bordered > thead > tr:first-child > th,
    .panel > .table-bordered > tbody > tr:first-child > td,
    .panel > .table-bordered > tbody > tr:first-child > th,
    .panel > .table-responsive > .table-bordered > thead > tr:first-child > td,
    .panel > .table-responsive > .table-bordered > thead > tr:first-child > th,
    .panel > .table-responsive > .table-bordered > tbody > tr:first-child > td,
    .panel > .table-responsive > .table-bordered > tbody > tr:first-child > th {
        border-bottom: 0;
    }

    .panel > .table-bordered > tbody > tr:last-child > td,
    .panel > .table-bordered > tbody > tr:last-child > th,
    .panel > .table-bordered > tfoot > tr:last-child > td,
    .panel > .table-bordered > tfoot > tr:last-child > th,
    .panel > .table-responsive > .table-bordered > tbody > tr:last-child > td,
    .panel > .table-responsive > .table-bordered > tbody > tr:last-child > th,
    .panel > .table-responsive > .table-bordered > tfoot > tr:last-child > td,
    .panel > .table-responsive > .table-bordered > tfoot > tr:last-child > th {
        border-bottom: 0;
    }

.panel > .table-responsive {
    border: 0;
    margin-bottom: 0;
}

.panel-group {
    margin-bottom: 20px;
}

    .panel-group .panel {
        margin-bottom: 5px;
        border-radius: 4px;
    }

        .panel-group .panel:last-child {
            margin-bottom: 0;
        }

    .panel-group .panel-heading {
        border-bottom: 0;
    }

        .panel-group .panel-heading + .panel-collapse > .panel-body,
        .panel-group .panel-heading + .panel-collapse > .list-group {
            border-top: 1px solid #ddd;
        }

    .panel-group .panel-footer {
        border-top: 0;
    }

        .panel-group .panel-footer + .panel-collapse .panel-body {
            border-bottom: 1px solid #ddd;
        }

.panel-default {
    border-color: #ddd;
}

    .panel-default > .panel-heading {
        color: #444;
        background-color: #f5f5f5;
        border-color: #ddd;
    }

        .panel-default > .panel-heading + .panel-collapse > .panel-body {
            border-top-color: #ddd;
        }

        .panel-default > .panel-heading .badge {
            color: #fcfcfc;
            background-color: #444;
        }

    .panel-default > .panel-footer + .panel-collapse > .panel-body {
        border-bottom-color: #ddd;
    }

.panel-highlight {
    border-color: #ddd;
}

    .panel-highlight > .panel-heading {
        color: #444;
        background-color: lightgoldenrodyellow;
        border-color: #ddd;
    }

        .panel-highlight > .panel-heading + .panel-collapse > .panel-body {
            border-top-color: #ddd;
        }

        .panel-highlight > .panel-heading .badge {
            color: lightgoldenrodyellow;
            background-color: #444;
        }

    .panel-highlight > .panel-footer + .panel-collapse > .panel-body {
        border-bottom-color: #ddd;
    }

.panel-primary {
    border-color: #d9230f;
}

    .panel-primary > .panel-heading {
        color: #fff;
        background-color: #d9230f;
        border-color: #d9230f;
    }

        .panel-primary > .panel-heading + .panel-collapse > .panel-body {
            border-top-color: #d9230f;
        }

        .panel-primary > .panel-heading .badge {
            color: #d9230f;
            background-color: #fff;
        }

    .panel-primary > .panel-footer + .panel-collapse > .panel-body {
        border-bottom-color: #d9230f;
    }

.panel-success {
    border-color: #469408;
}

    .panel-success > .panel-heading {
        color: #fff;
        background-color: #469408;
        border-color: #469408;
    }

        .panel-success > .panel-heading + .panel-collapse > .panel-body {
            border-top-color: #469408;
        }

        .panel-success > .panel-heading .badge {
            color: #469408;
            background-color: #fff;
        }

    .panel-success > .panel-footer + .panel-collapse > .panel-body {
        border-bottom-color: #469408;
    }

.panel-info {
    border-color: #029acf;
}

    .panel-info > .panel-heading {
        color: #fff;
        background-color: #029acf;
        border-color: #029acf;
    }

        .panel-info > .panel-heading + .panel-collapse > .panel-body {
            border-top-color: #029acf;
        }

        .panel-info > .panel-heading .badge {
            color: #029acf;
            background-color: #fff;
        }

    .panel-info > .panel-footer + .panel-collapse > .panel-body {
        border-bottom-color: #029acf;
    }

.panel-warning {
    border-color: #9b479f;
}

    .panel-warning > .panel-heading {
        color: #fff;
        background-color: #9b479f;
        border-color: #9b479f;
    }

        .panel-warning > .panel-heading + .panel-collapse > .panel-body {
            border-top-color: #9b479f;
        }

        .panel-warning > .panel-heading .badge {
            color: #9b479f;
            background-color: #fff;
        }

    .panel-warning > .panel-footer + .panel-collapse > .panel-body {
        border-bottom-color: #9b479f;
    }

.panel-danger {
    border-color: #d9831f;
}

    .panel-danger > .panel-heading {
        color: #fff;
        background-color: #d9831f;
        border-color: #d9831f;
    }

        .panel-danger > .panel-heading + .panel-collapse > .panel-body {
            border-top-color: #d9831f;
        }

        .panel-danger > .panel-heading .badge {
            color: #d9831f;
            background-color: #fff;
        }

    .panel-danger > .panel-footer + .panel-collapse > .panel-body {
        border-bottom-color: #d9831f;
    }

.embed-responsive {
    position: relative;
    display: block;
    height: 0;
    padding: 0;
    overflow: hidden;
}

    .embed-responsive .embed-responsive-item,
    .embed-responsive iframe,
    .embed-responsive embed,
    .embed-responsive object,
    .embed-responsive video {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        height: 100%;
        width: 100%;
        border: 0;
    }

.embed-responsive-16by9 {
    padding-bottom: 56.25%;
}

.embed-responsive-4by3 {
    padding-bottom: 75%;
}

.well {
    min-height: 20px;
    padding: 19px;
    margin-bottom: 20px;
    background-color: #f3f3f3;
    border: 1px solid #eaeaea;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
}

    .well blockquote {
        border-color: #ddd;
        border-color: rgba(0, 0, 0, 0.15);
    }

.well-lg {
    padding: 24px;
    border-radius: 6px;
}

.well-sm {
    padding: 9px;
    border-radius: 3px;
}

.close {
    float: right;
    font-size: 19.5px;
    font-weight: bold;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    opacity: 0.2;
    filter: alpha(opacity=20);
}

    .close:hover, .close:focus {
        color: #000;
        text-decoration: none;
        cursor: pointer;
        opacity: 0.5;
        filter: alpha(opacity=50);
    }

button.close {
    padding: 0;
    cursor: pointer;
    background: transparent;
    border: 0;
    -webkit-appearance: none;
}

.modal-open {
    overflow: hidden;
}

.modal {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1050;
    display: none;
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
    outline: 0;
}

@media (max-width: 767px) {
    .modal {
        /* position was fixed but caused caret issues on iOS 11.
        SPW-225
        See https://hackernoon.com/how-to-fix-the-ios-11-input-element-in-fixed-modals-bug-aaf66c7ba3f8 */
        position: absolute;
    }
}

.modal.fade .modal-dialog {
    -webkit-transform: translate(0, -25%);
    -ms-transform: translate(0, -25%);
    -o-transform: translate(0, -25%);
    transform: translate(0, -25%);
    -webkit-transition: -webkit-transform 0.3s ease-out;
    -o-transition: -o-transform 0.3s ease-out;
    transition: -webkit-transform 0.3s ease-out;
    transition: transform 0.3s ease-out;
    transition: transform 0.3s ease-out, -webkit-transform 0.3s ease-out, -o-transform 0.3s ease-out;
}

.modal.in .modal-dialog {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
}

.modal-open .modal {
    overflow-x: hidden;
    overflow-y: scroll;
}

.modal-dialog {
    position: relative;
    width: auto;
    margin: 10px;
}

.modal-content {
    position: relative;
    background-color: #fff;
    border: 1px solid #ddd;
    border: 1px solid #ddd;
    border-radius: 6px;
    -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
    box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    outline: 0;
}

.modal-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1040;
    background-color: #000;
}

    .modal-backdrop.fade {
        opacity: 0;
        filter: alpha(opacity=0);
    }

    .modal-backdrop.in {
        opacity: 0.5;
        filter: alpha(opacity=50);
    }

.modal-header {
    padding: 15px;
    border-bottom: 1px solid #ddd;
    cursor: default;
}

    .modal-header:before, .modal-header:after {
        content: " ";
        display: table;
    }

    .modal-header:after {
        clear: both;
    }

    .modal-header .close {
        margin-top: -2px;
    }

.modal-title {
    margin: 0;
    line-height: 1.538462;
}

.modal-body {
    position: relative;
    padding: 15px;
    cursor: default;
}

.modal-footer {
    padding: 15px;
    text-align: right;
    border-top: 1px solid #ddd;
}

    .modal-footer:before, .modal-footer:after {
        content: " ";
        display: table;
    }

    .modal-footer:after {
        clear: both;
    }

    .modal-footer .btn + .btn {
        margin-left: 5px;
        margin-bottom: 0;
    }

    .modal-footer .btn-group .btn + .btn {
        margin-left: -1px;
    }

    .modal-footer .btn-block + .btn-block {
        margin-left: 0;
    }

.modal-scrollbar-measure {
    position: absolute;
    top: -9999px;
    width: 50px;
    height: 50px;
    overflow: scroll;
}

@media (min-width: 768px) {

    .modal-dialog {
        width: 600px;
        position: fixed;
        /*top: 50px;*/
        left: 50%;
        margin-left: -300px;
    }

    /*LightBox Center*/
    div.lightbox-modal div.modal-dialog {
        position: relative;
        top: 30px;
        left: auto;
        margin: 0 auto;
    }

    /*New Additions for maodal*/
    .autoplay-modal-desktop-opened {
        /*position: fixed;*/
    }

    .model {
        position: fixed;
    }
    /*New Additions for maodal*/
    .modal-content {
        -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
    }

    .modal-sm {
        width: 300px;
        margin-left: -150px;
    }

    .modal-md {
        width: 450px;
        margin-left: -225px;
    }
}

@media (min-width: 992px) {
    .modal-lg {
        width: 900px;
        margin-left: -450px;
    }

    .modal-xl {
        width: 60vw;
        margin-left: -30vw;
    }

    .modal-xxl {
        width: 70vw;
        margin-left: -35vw;
    }

    .modal-xxxl {
        width: 80vw;
        margin-left: -40vw;
    }

    .modal-xxxxl {
        width: 90vw;
        margin-left: -45vw;
    }
}

.tooltip {
    position: absolute;
    z-index: 1070;
    display: block;
    font-family: "Roboto", sans-serif;
    font-style: normal;
    font-weight: normal;
    letter-spacing: normal;
    line-break: auto;
    line-height: 1.538462;
    text-align: left;
    text-align: start;
    text-decoration: none;
    text-shadow: none;
    text-transform: none;
    white-space: normal;
    word-break: normal;
    word-spacing: normal;
    word-wrap: normal;
    font-size: 12px;
    opacity: 0;
    filter: alpha(opacity=0);
}

    .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;
    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: 0;
    left: 50%;
    margin-left: -5px;
    border-width: 5px 5px 0;
    border-top-color: #000;
}

.tooltip.top-left .tooltip-arrow {
    bottom: 0;
    right: 5px;
    margin-bottom: -5px;
    border-width: 5px 5px 0;
    border-top-color: #000;
}

.tooltip.top-right .tooltip-arrow {
    bottom: 0;
    left: 5px;
    margin-bottom: -5px;
    border-width: 5px 5px 0;
    border-top-color: #000;
}

.tooltip.right .tooltip-arrow {
    top: 50%;
    left: 0;
    margin-top: -5px;
    border-width: 5px 5px 5px 0;
    border-right-color: #000;
}

.tooltip.left .tooltip-arrow {
    top: 50%;
    right: 0;
    margin-top: -5px;
    border-width: 5px 0 5px 5px;
    border-left-color: #000;
}

.tooltip.bottom .tooltip-arrow {
    top: 0;
    left: 50%;
    margin-left: -5px;
    border-width: 0 5px 5px;
    border-bottom-color: #000;
}

.tooltip.bottom-left .tooltip-arrow {
    top: 0;
    right: 5px;
    margin-top: -5px;
    border-width: 0 5px 5px;
    border-bottom-color: #000;
}

.tooltip.bottom-right .tooltip-arrow {
    top: 0;
    left: 5px;
    margin-top: -5px;
    border-width: 0 5px 5px;
    border-bottom-color: #000;
}

.popover {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1060;
    display: none;
    max-width: 276px;
    padding: 1px;
    font-family: "Roboto", sans-serif;
    font-style: normal;
    font-weight: normal;
    letter-spacing: normal;
    line-break: auto;
    line-height: 1.538462;
    text-align: left;
    text-align: start;
    text-decoration: none;
    text-shadow: none;
    text-transform: none;
    white-space: normal;
    word-break: normal;
    word-spacing: normal;
    word-wrap: normal;
    font-size: 13px;
    background-color: #fff;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #ddd;
    border: 1px solid #ddd;
    border-radius: 6px;
    -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
}

    .popover.top {
        margin-top: -10px;
    }

    .popover.right {
        margin-left: 10px;
    }

    .popover.bottom {
        margin-top: 10px;
    }

    .popover.left {
        margin-left: -10px;
    }

.popover-title {
    margin: 0;
    padding: 8px 14px;
    font-size: 13px;
    background-color: #f6f6f6;
    border-bottom: 1px solid #e9e9e9;
    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: #aaaaaa;
    border-top-color: fadein(#ddd, 5%);
    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: #aaaaaa;
    border-right-color: fadein(#ddd, 5%);
}

    .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: #aaaaaa;
    border-bottom-color: fadein(#ddd, 5%);
    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: #aaaaaa;
    border-left-color: fadein(#ddd, 5%);
}

    .popover.left > .arrow:after {
        content: " ";
        right: 1px;
        border-right-width: 0;
        border-left-color: #fff;
        bottom: -10px;
    }

.carousel {
    position: relative;
}

.carousel-inner {
    position: relative;
    overflow: hidden;
    width: 100%;
}

    .carousel-inner > .item {
        display: none;
        position: relative;
        -webkit-transition: 0.6s ease-in-out left;
        -o-transition: 0.6s ease-in-out left;
        transition: 0.6s ease-in-out left;
    }

        .carousel-inner > .item > img,
        .carousel-inner > .item > a > img {
            display: block;
            max-width: 100%;
            height: auto;
            line-height: 1;
        }

@media all and (transform-3d), (-webkit-transform-3d) {
    .carousel-inner > .item {
        -webkit-transition: -webkit-transform 0.6s ease-in-out;
        -o-transition: -o-transform 0.6s ease-in-out;
        transition: -webkit-transform 0.6s ease-in-out;
        transition: transform 0.6s ease-in-out;
        transition: transform 0.6s ease-in-out, -webkit-transform 0.6s ease-in-out, -o-transform 0.6s ease-in-out;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        -webkit-perspective: 1000px;
        perspective: 1000px;
    }

        .carousel-inner > .item.next, .carousel-inner > .item.active.right {
            -webkit-transform: translate3d(100%, 0, 0);
            transform: translate3d(100%, 0, 0);
            left: 0;
        }

        .carousel-inner > .item.prev, .carousel-inner > .item.active.left {
            -webkit-transform: translate3d(-100%, 0, 0);
            transform: translate3d(-100%, 0, 0);
            left: 0;
        }

            .carousel-inner > .item.next.left, .carousel-inner > .item.prev.right, .carousel-inner > .item.active {
                -webkit-transform: translate3d(0, 0, 0);
                transform: translate3d(0, 0, 0);
                left: 0;
            }
}

.carousel-inner > .active,
.carousel-inner > .next,
.carousel-inner > .prev {
    display: block;
}

.carousel-inner > .active {
    left: 0;
}

.carousel-inner > .next,
.carousel-inner > .prev {
    position: absolute;
    top: 0;
    width: 100%;
}

.carousel-inner > .next {
    left: 100%;
}

.carousel-inner > .prev {
    left: -100%;
}

    .carousel-inner > .next.left,
    .carousel-inner > .prev.right {
        left: 0;
    }

.carousel-inner > .active.left {
    left: -100%;
}

.carousel-inner > .active.right {
    left: 100%;
}

.carousel-control {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 15%;
    opacity: 0.5;
    filter: alpha(opacity=50);
    font-size: 20px;
    color: #fff;
    text-align: center;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
    background-color: transparent;
}

    .carousel-control.left {
        background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
        background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
        background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.5)), to(rgba(0, 0, 0, 0.0001)));
        background-image: linear-gradient(to right, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0.0001) 100%);
        background-repeat: repeat-x;
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#80000000', endColorstr='#00000000', GradientType=1);
    }

    .carousel-control.right {
        left: auto;
        right: 0;
        background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%);
        background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%);
        background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, 0.0001)), to(rgba(0, 0, 0, 0.5)));
        background-image: linear-gradient(to right, rgba(0, 0, 0, 0.0001) 0%, rgba(0, 0, 0, 0.5) 100%);
        background-repeat: repeat-x;
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#80000000', GradientType=1);
    }

    .carousel-control:hover, .carousel-control:focus {
        outline: 0;
        color: #fff;
        text-decoration: none;
        opacity: 0.9;
        filter: alpha(opacity=90);
    }

    .carousel-control .icon-prev,
    .carousel-control .icon-next,
    .carousel-control .glyphicon-chevron-left,
    .carousel-control .glyphicon-chevron-right {
        position: absolute;
        top: 50%;
        margin-top: -10px;
        z-index: 5;
        display: inline-block;
    }

    .carousel-control .icon-prev,
    .carousel-control .glyphicon-chevron-left {
        left: 50%;
        margin-left: -10px;
    }

    .carousel-control .icon-next,
    .carousel-control .glyphicon-chevron-right {
        right: 50%;
        margin-right: -10px;
    }

    .carousel-control .icon-prev,
    .carousel-control .icon-next {
        width: 20px;
        height: 20px;
        line-height: 1;
        font-family: serif;
    }

        .carousel-control .icon-prev:before {
            content: '\2039';
        }

        .carousel-control .icon-next:before {
            content: '\203a';
        }

.carousel-indicators {
    position: absolute;
    bottom: 10px;
    left: 50%;
    z-index: 15;
    width: 60%;
    margin-left: -30%;
    padding-left: 0;
    list-style: none;
    text-align: center;
}

    .carousel-indicators li {
        display: inline-block;
        width: 10px;
        height: 10px;
        margin: 1px;
        text-indent: -999px;
        border: 1px solid #fff;
        border-radius: 10px;
        cursor: pointer;
        background-color: #000 \9;
        background-color: transparent;
    }

    .carousel-indicators .active {
        margin: 0;
        width: 12px;
        height: 12px;
        background-color: #fff;
    }

.carousel-caption {
    position: absolute;
    left: 15%;
    right: 15%;
    bottom: 20px;
    z-index: 10;
    padding-top: 20px;
    padding-bottom: 20px;
    color: #fff;
    text-align: center;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}

    .carousel-caption .btn {
        text-shadow: none;
    }

@media screen and (min-width: 768px) {
    .carousel-control .glyphicon-chevron-left,
    .carousel-control .glyphicon-chevron-right,
    .carousel-control .icon-prev,
    .carousel-control .icon-next {
        width: 30px;
        height: 30px;
        margin-top: -10px;
        font-size: 30px;
    }

    .carousel-control .glyphicon-chevron-left,
    .carousel-control .icon-prev {
        margin-left: -10px;
    }

    .carousel-control .glyphicon-chevron-right,
    .carousel-control .icon-next {
        margin-right: -10px;
    }

    .carousel-caption {
        left: 20%;
        right: 20%;
        padding-bottom: 30px;
    }

    .carousel-indicators {
        bottom: 20px;
    }
}

.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;
}

.hidden {
    display: none !important;
}

.affix {
    position: fixed;
}

@-ms-viewport {
    width: device-width;
}

.visible-xs {
    display: none !important;
}

.visible-sm {
    display: none !important;
}

.visible-md {
    display: none !important;
}

.visible-lg {
    display: none !important;
}

/* SPW-11468 */
visible-xs-landscape {
    display: none !important;
}

.visible-xs-block,
.visible-xs-inline,
.visible-xs-inline-block,
.visible-sm-block,
.visible-sm-inline,
.visible-sm-inline-block,
.visible-md-block,
.visible-md-inline,
.visible-md-inline-block,
.visible-lg-block,
.visible-lg-inline,
.visible-lg-inline-block {
    display: none !important;
}

@media (max-width: 767px) {
    .visible-xs {
        display: block !important;
    }

    table.visible-xs {
        display: table !important;
    }

    tr.visible-xs {
        display: table-row !important;
    }

    th.visible-xs,
    td.visible-xs {
        display: table-cell !important;
    }
}

@media (max-width: 767px) {
    .visible-xs-block {
        display: block !important;
    }
}

@media (max-width: 767px) {
    .visible-xs-inline {
        display: inline !important;
    }
}

@media (max-width: 767px) {
    .visible-xs-inline-block {
        display: inline-block !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .visible-sm {
        display: block !important;
    }

    table.visible-sm {
        display: table !important;
    }

    tr.visible-sm {
        display: table-row !important;
    }

    th.visible-sm,
    td.visible-sm {
        display: table-cell !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .visible-sm-block {
        display: block !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .visible-sm-inline {
        display: inline !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .visible-sm-inline-block {
        display: inline-block !important;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .visible-md {
        display: block !important;
    }

    table.visible-md {
        display: table !important;
    }

    tr.visible-md {
        display: table-row !important;
    }

    th.visible-md,
    td.visible-md {
        display: table-cell !important;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .visible-md-block {
        display: block !important;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .visible-md-inline {
        display: inline !important;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .visible-md-inline-block {
        display: inline-block !important;
    }
}

@media (min-width: 1200px) {
    .visible-lg {
        display: block !important;
    }

    table.visible-lg {
        display: table !important;
    }

    tr.visible-lg {
        display: table-row !important;
    }

    th.visible-lg,
    td.visible-lg {
        display: table-cell !important;
    }
}

@media (min-width: 1200px) {
    .visible-lg-block {
        display: block !important;
    }
}

@media (min-width: 1200px) {
    .visible-lg-inline {
        display: inline !important;
    }
}

@media (min-width: 1200px) {
    .visible-lg-inline-block {
        display: inline-block !important;
    }
}

@media (max-width: 767px) {
    .hidden-xs {
        display: none !important;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .hidden-sm {
        display: none !important;
    }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .hidden-md {
        display: none !important;
    }
}

@media (min-width: 1200px) {
    .hidden-lg {
        display: none !important;
    }
}

/* SPW-11468 */
@media (orientation: landscape) {
    .visible-xs-landscape {
        display: block !important;
    }
}

.visible-print {
    display: none !important;
}

@media print {
    .visible-print {
        display: block !important;
    }

    table.visible-print {
        display: table !important;
    }

    tr.visible-print {
        display: table-row !important;
    }

    th.visible-print,
    td.visible-print {
        display: table-cell !important;
    }
}

.visible-print-block {
    display: none !important;
}

@media print {
    .visible-print-block {
        display: block !important;
    }
}

.visible-print-inline {
    display: none !important;
}

@media print {
    .visible-print-inline {
        display: inline !important;
    }
}

.visible-print-inline-block {
    display: none !important;
}

@media print {
    .visible-print-inline-block {
        display: inline-block !important;
    }
}

@media print {
    .hidden-print {
        display: none !important;
    }
}

@font-face {
    font-family: 'FontAwesome';
    src: url(/Content/fonts/fontawesome-webfont.eot?v=4.6.3);
    src: url(/Content/fonts/fontawesome-webfont.eot?#iefix&v=4.6.3) format("embedded-opentype"), url(/Content/fonts/fontawesome-webfont.woff2?v=4.6.3) format("woff2"), url(/Content/fonts/fontawesome-webfont.woff?v=4.6.3) format("woff"), url(/Content/fonts/fontawesome-webfont.ttf?v=4.6.3) format("truetype"), url(/Content/fonts/fontawesome-webfont.svg?v=4.6.3#fontawesomeregular) format("svg");
    font-weight: normal;
    font-style: normal;
}

.icon {
    cursor: pointer;
    display: inline-block;
    font-family: FontAwesome;
    font-size: inherit;
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    text-align: center;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-with-child {
    display: inline-block;
    line-height: 1;
    position: relative;
}

.icon-child {
    bottom: 0;
    -webkit-box-shadow: 0px 0px 0px 2px #fff;
    box-shadow: 0px 0px 0px 2px #fff;
    display: block;
    position: absolute;
    right: 0;
    z-index: 2;
}

.icon-lg {
    font-size: 1.333333em;
    line-height: 0.75em;
    vertical-align: -15%;
}

.icon-2x {
    font-size: 2em;
}

.icon-3x {
    font-size: 3em;
}

.icon-4x {
    font-size: 4em;
}

.icon-5x {
    font-size: 5em;
}

.icon-fw {
    width: 1.285714em;
}

.icon-glass:before {
    content: "\f000";
}

.icon-music:before {
    content: "\f001";
}

.icon-search:before {
    content: "\f002";
}

.icon-envelope-o:before {
    content: "\f003";
}

.icon-heart:before {
    content: "\f004";
}

.icon-star:before {
    content: "\f005";
}

.icon-star-o:before {
    content: "\f006";
}

.icon-user:before {
    content: "\f007";
}

.icon-film:before {
    content: "\f008";
}

.icon-th-large:before {
    content: "\f009";
}

.icon-th:before {
    content: "\f00a";
}

.icon-th-list:before {
    content: "\f00b";
}

.icon-check:before {
    content: "\f00c";
}

.icon-remove:before,
.icon-close:before,
.icon-times:before {
    content: "\f00d";
}

.icon-search-plus:before {
    content: "\f00e";
}

.icon-search-minus:before {
    content: "\f010";
}

.icon-power-off:before {
    content: "\f011";
}

.icon-signal:before {
    content: "\f012";
}

.icon-gear:before,
.icon-cog:before {
    content: "\f013";
}

.icon-trash-o:before {
    content: "\f014";
}

.icon-home:before {
    content: "\f015";
}

.icon-file-o:before {
    content: "\f016";
}

.icon-clock-o:before {
    content: "\f017";
}

.icon-road:before {
    content: "\f018";
}

.icon-download:before {
    content: "\f019";
}

.icon-arrow-circle-o-down:before {
    content: "\f01a";
}

.icon-arrow-circle-o-up:before {
    content: "\f01b";
}

.icon-inbox:before {
    content: "\f01c";
}

.icon-play-circle-o:before {
    content: "\f01d";
}

.icon-rotate-right:before,
.icon-repeat:before {
    content: "\f01e";
}

.icon-refresh:before {
    content: "\f021";
}

.icon-list-alt:before {
    content: "\f022";
}

.icon-lock:before {
    content: "\f023";
}

.icon-flag:before {
    content: "\f024";
}

.icon-headphones:before {
    content: "\f025";
}

.icon-volume-off:before {
    content: "\f026";
}

.icon-volume-down:before {
    content: "\f027";
}

.icon-volume-up:before {
    content: "\f028";
}

.icon-qrcode:before {
    content: "\f029";
}

.icon-barcode:before {
    content: "\f02a";
}

.icon-tag:before {
    content: "\f02b";
}

.icon-tags:before {
    content: "\f02c";
}

.icon-book:before {
    content: "\f02d";
}

.icon-bookmark:before {
    content: "\f02e";
}

.icon-print:before {
    content: "\f02f";
}

.icon-camera:before {
    content: "\f030";
}

.icon-font:before {
    content: "\f031";
}

.icon-bold:before {
    content: "\f032";
}

.icon-italic:before {
    content: "\f033";
}

.icon-text-height:before {
    content: "\f034";
}

.icon-text-width:before {
    content: "\f035";
}

.icon-align-left:before {
    content: "\f036";
}

.icon-align-center:before {
    content: "\f037";
}

.icon-align-right:before {
    content: "\f038";
}

.icon-align-justify:before {
    content: "\f039";
}

.icon-list:before {
    content: "\f03a";
}

.icon-dedent:before,
.icon-outdent:before {
    content: "\f03b";
}

.icon-indent:before {
    content: "\f03c";
}

.icon-video-camera:before {
    content: "\f03d";
}

.icon-photo:before,
.icon-image:before,
.icon-picture-o:before {
    content: "\f03e";
}

.icon-pencil:before {
    content: "\f040";
}

.icon-map-marker:before {
    content: "\f041";
}

.icon-adjust:before {
    content: "\f042";
}

.icon-tint:before {
    content: "\f043";
}

.icon-edit:before,
.icon-pencil-square-o:before {
    content: "\f044";
}

.icon-share-square-o:before {
    content: "\f045";
}

.icon-check-square-o:before {
    content: "\f046";
}

.icon-arrows:before {
    content: "\f047";
}

.icon-step-backward:before {
    content: "\f048";
}

.icon-fast-backward:before {
    content: "\f049";
}

.icon-backward:before {
    content: "\f04a";
}

.icon-play:before {
    content: "\f04b";
}

.icon-pause:before {
    content: "\f04c";
}

.icon-stop:before {
    content: "\f04d";
}

.icon-forward:before {
    content: "\f04e";
}

.icon-fast-forward:before {
    content: "\f050";
}

.icon-step-forward:before {
    content: "\f051";
}

.icon-eject:before {
    content: "\f052";
}

.icon-chevron-left:before {
    content: "\f053";
}

.icon-chevron-right:before {
    content: "\f054";
}

.icon-plus-circle:before {
    content: "\f055";
}

.icon-minus-circle:before {
    content: "\f056";
}

.icon-times-circle:before {
    content: "\f057";
}

.icon-check-circle:before {
    content: "\f058";
}

.icon-question-circle:before {
    content: "\f059";
}

.icon-info-circle:before {
    content: "\f05a";
}

.icon-crosshairs:before {
    content: "\f05b";
}

.icon-times-circle-o:before {
    content: "\f05c";
}

.icon-check-circle-o:before {
    content: "\f05d";
}

.icon-ban:before {
    content: "\f05e";
}

.icon-arrow-left:before {
    content: "\f060";
}

.icon-arrow-right:before {
    content: "\f061";
}

.icon-arrow-up:before {
    content: "\f062";
}

.icon-arrow-down:before {
    content: "\f063";
}

.icon-mail-forward:before,
.icon-share:before {
    content: "\f064";
}

.icon-expand:before {
    content: "\f065";
}

.icon-compress:before {
    content: "\f066";
}

.icon-plus:before {
    content: "\f067";
}

.icon-minus:before {
    content: "\f068";
}

.icon-asterisk:before {
    content: "\f069";
}

.icon-exclamation-circle:before {
    content: "\f06a";
}

.icon-gift:before {
    content: "\f06b";
}

.icon-leaf:before {
    content: "\f06c";
}

.icon-fire:before {
    content: "\f06d";
}

.icon-eye:before {
    content: "\f06e";
}

.icon-eye-slash:before {
    content: "\f070";
}

.icon-warning:before,
.icon-exclamation-triangle:before {
    content: "\f071";
}

.icon-plane:before {
    content: "\f072";
}

.icon-calendar:before {
    content: "\f073";
}

.icon-random:before {
    content: "\f074";
}

.icon-comment:before {
    content: "\f075";
}

.icon-magnet:before {
    content: "\f076";
}

.icon-chevron-up:before {
    content: "\f077";
}

.icon-chevron-down:before {
    content: "\f078";
}

.icon-retweet:before {
    content: "\f079";
}

.icon-shopping-cart:before {
    content: "\f07a";
}

.icon-folder:before {
    content: "\f07b";
}

.icon-folder-open:before {
    content: "\f07c";
}

.icon-arrows-v:before {
    content: "\f07d";
}

.icon-arrows-h:before {
    content: "\f07e";
}

.icon-bar-chart-o:before,
.icon-bar-chart:before {
    content: "\f080";
}

.icon-twitter-square:before {
    content: "\f081";
}

.icon-facebook-square:before {
    content: "\f082";
}

.icon-camera-retro:before {
    content: "\f083";
}

.icon-key:before {
    content: "\f084";
}

.icon-gears:before,
.icon-cogs:before {
    content: "\f085";
}

.icon-comments:before {
    content: "\f086";
}

.icon-thumbs-o-up:before {
    content: "\f087";
}

.icon-thumbs-o-down:before {
    content: "\f088";
}

.icon-star-half:before {
    content: "\f089";
}

.icon-heart-o:before {
    content: "\f08a";
}

.icon-sign-out:before {
    content: "\f08b";
}

.icon-linkedin-square:before {
    content: "\f08c";
}

.icon-thumb-tack:before {
    content: "\f08d";
}

.icon-external-link:before {
    content: "\f08e";
}

.icon-sign-in:before {
    content: "\f090";
}

.icon-trophy:before {
    content: "\f091";
}

.icon-github-square:before {
    content: "\f092";
}

.icon-upload:before {
    content: "\f093";
}

.icon-lemon-o:before {
    content: "\f094";
}

.icon-phone:before {
    content: "\f095";
}

.icon-square-o:before {
    content: "\f096";
}

.icon-bookmark-o:before {
    content: "\f097";
}

.icon-phone-square:before {
    content: "\f098";
}

.icon-twitter:before {
    content: "\f099";
}

.icon-facebook-f:before,
.icon-facebook:before {
    content: "\f09a";
}

.icon-github:before {
    content: "\f09b";
}

.icon-unlock:before {
    content: "\f09c";
}

.icon-credit-card:before {
    content: "\f09d";
}

.icon-feed:before,
.icon-rss:before {
    content: "\f09e";
}

.icon-hdd-o:before {
    content: "\f0a0";
}

.icon-bullhorn:before {
    content: "\f0a1";
}

.icon-bell:before {
    content: "\f0f3";
}

.icon-certificate:before {
    content: "\f0a3";
}

.icon-hand-o-right:before {
    content: "\f0a4";
}

.icon-hand-o-left:before {
    content: "\f0a5";
}

.icon-hand-o-up:before {
    content: "\f0a6";
}

.icon-hand-o-down:before {
    content: "\f0a7";
}

.icon-arrow-circle-left:before {
    content: "\f0a8";
}

.icon-arrow-circle-right:before {
    content: "\f0a9";
}

.icon-arrow-circle-up:before {
    content: "\f0aa";
}

.icon-arrow-circle-down:before {
    content: "\f0ab";
}

.icon-globe:before {
    content: "\f0ac";
}

.icon-wrench:before {
    content: "\f0ad";
}

.icon-tasks:before {
    content: "\f0ae";
}

.icon-filter:before {
    content: "\f0b0";
}

.icon-briefcase:before {
    content: "\f0b1";
}

.icon-arrows-alt:before {
    content: "\f0b2";
}

.icon-group:before,
.icon-users:before {
    content: "\f0c0";
}

.icon-chain:before,
.icon-link:before {
    content: "\f0c1";
}

.icon-cloud:before {
    content: "\f0c2";
}

.icon-flask:before {
    content: "\f0c3";
}

.icon-cut:before,
.icon-scissors:before {
    content: "\f0c4";
}

.icon-copy:before,
.icon-files-o:before {
    content: "\f0c5";
}

.icon-paperclip:before {
    content: "\f0c6";
}

.icon-save:before,
.icon-floppy-o:before {
    content: "\f0c7";
}

.icon-square:before {
    content: "\f0c8";
}

.icon-navicon:before,
.icon-reorder:before,
.icon-bars:before {
    content: "\f0c9";
}

.icon-list-ul:before {
    content: "\f0ca";
}

.icon-list-ol:before {
    content: "\f0cb";
}

.icon-strikethrough:before {
    content: "\f0cc";
}

.icon-underline:before {
    content: "\f0cd";
}

.icon-table:before {
    content: "\f0ce";
}

.icon-magic:before {
    content: "\f0d0";
}

.icon-truck:before {
    content: "\f0d1";
}

.icon-pinterest:before {
    content: "\f0d2";
}

.icon-pinterest-square:before {
    content: "\f0d3";
}

.icon-google-plus-square:before {
    content: "\f0d4";
}

.icon-google-plus:before {
    content: "\f0d5";
}

.icon-money:before {
    content: "\f0d6";
}

.icon-caret-down:before {
    content: "\f0d7";
}

.icon-caret-up:before {
    content: "\f0d8";
}

.icon-caret-left:before {
    content: "\f0d9";
}

.icon-caret-right:before {
    content: "\f0da";
}

.icon-columns:before {
    content: "\f0db";
}

.icon-unsorted:before,
.icon-sort:before {
    content: "\f0dc";
}

.icon-sort-down:before,
.icon-sort-desc:before {
    content: "\f0dd";
}

.icon-sort-up:before,
.icon-sort-asc:before {
    content: "\f0de";
}

.icon-envelope:before {
    content: "\f0e0";
}

.icon-linkedin:before {
    content: "\f0e1";
}

.icon-rotate-left:before,
.icon-undo:before {
    content: "\f0e2";
}

.icon-legal:before,
.icon-gavel:before {
    content: "\f0e3";
}

.icon-dashboard:before,
.icon-tachometer:before {
    content: "\f0e4";
}

.icon-comment-o:before {
    content: "\f0e5";
}

.icon-comments-o:before {
    content: "\f0e6";
}

.icon-flash:before,
.icon-bolt:before {
    content: "\f0e7";
}

.icon-sitemap:before {
    content: "\f0e8";
}

.icon-umbrella:before {
    content: "\f0e9";
}

.icon-paste:before,
.icon-clipboard:before {
    content: "\f0ea";
}

.icon-lightbulb-o:before {
    content: "\f0eb";
}

.icon-exchange:before {
    content: "\f0ec";
}

.icon-cloud-download:before {
    content: "\f0ed";
}

.icon-cloud-upload:before {
    content: "\f0ee";
}

.icon-user-md:before {
    content: "\f0f0";
}

.icon-stethoscope:before {
    content: "\f0f1";
}

.icon-suitcase:before {
    content: "\f0f2";
}

.icon-bell-o:before {
    content: "\f0a2";
}

.icon-coffee:before {
    content: "\f0f4";
}

.icon-cutlery:before {
    content: "\f0f5";
}

.icon-file-text-o:before {
    content: "\f0f6";
}

.icon-building-o:before {
    content: "\f0f7";
}

.icon-hospital-o:before {
    content: "\f0f8";
}

.icon-ambulance:before {
    content: "\f0f9";
}

.icon-medkit:before {
    content: "\f0fa";
}

.icon-fighter-jet:before {
    content: "\f0fb";
}

.icon-beer:before {
    content: "\f0fc";
}

.icon-h-square:before {
    content: "\f0fd";
}

.icon-plus-square:before {
    content: "\f0fe";
}

.icon-angle-double-left:before {
    content: "\f100";
}

.icon-angle-double-right:before {
    content: "\f101";
}

.icon-angle-double-up:before {
    content: "\f102";
}

.icon-angle-double-down:before {
    content: "\f103";
}

.icon-angle-left:before {
    content: "\f104";
}

.icon-angle-right:before {
    content: "\f105";
}

.icon-angle-up:before {
    content: "\f106";
}

.icon-angle-down:before {
    content: "\f107";
}

.icon-desktop:before {
    content: "\f108";
}

.icon-laptop:before {
    content: "\f109";
}

.icon-tablet:before {
    content: "\f10a";
}

.icon-mobile-phone:before,
.icon-mobile:before {
    content: "\f10b";
}

.icon-circle-o:before {
    content: "\f10c";
}

.icon-quote-left:before {
    content: "\f10d";
}

.icon-quote-right:before {
    content: "\f10e";
}

.icon-spinner:before {
    content: "\f110";
}

.icon-circle:before {
    content: "\f111";
}

.icon-mail-reply:before,
.icon-reply:before {
    content: "\f112";
}

.icon-github-alt:before {
    content: "\f113";
}

.icon-folder-o:before {
    content: "\f114";
}

.icon-folder-open-o:before {
    content: "\f115";
}

.icon-smile-o:before {
    content: "\f118";
}

.icon-frown-o:before {
    content: "\f119";
}

.icon-meh-o:before {
    content: "\f11a";
}

.icon-gamepad:before {
    content: "\f11b";
}

.icon-keyboard-o:before {
    content: "\f11c";
}

.icon-flag-o:before {
    content: "\f11d";
}

.icon-flag-checkered:before {
    content: "\f11e";
}

.icon-terminal:before {
    content: "\f120";
}

.icon-code:before {
    content: "\f121";
}

.icon-mail-reply-all:before,
.icon-reply-all:before {
    content: "\f122";
}

.icon-star-half-empty:before,
.icon-star-half-full:before,
.icon-star-half-o:before {
    content: "\f123";
}

.icon-location-arrow:before {
    content: "\f124";
}

.icon-crop:before {
    content: "\f125";
}

.icon-code-fork:before {
    content: "\f126";
}

.icon-unlink:before,
.icon-chain-broken:before {
    content: "\f127";
}

.icon-question:before {
    content: "\f128";
}

.icon-info:before {
    content: "\f129";
}

.icon-exclamation:before {
    content: "\f12a";
}

.icon-superscript:before {
    content: "\f12b";
}

.icon-subscript:before {
    content: "\f12c";
}

.icon-eraser:before {
    content: "\f12d";
}

.icon-puzzle-piece:before {
    content: "\f12e";
}

.icon-microphone:before {
    content: "\f130";
}

.icon-microphone-slash:before {
    content: "\f131";
}

.icon-shield:before {
    content: "\f132";
}

.icon-calendar-o:before {
    content: "\f133";
}

.icon-fire-extinguisher:before {
    content: "\f134";
}

.icon-rocket:before {
    content: "\f135";
}

.icon-maxcdn:before {
    content: "\f136";
}

.icon-chevron-circle-left:before {
    content: "\f137";
}

.icon-chevron-circle-right:before {
    content: "\f138";
}

.icon-chevron-circle-up:before {
    content: "\f139";
}

.icon-chevron-circle-down:before {
    content: "\f13a";
}

.icon-html5:before {
    content: "\f13b";
}

.icon-css3:before {
    content: "\f13c";
}

.icon-anchor:before {
    content: "\f13d";
}

.icon-unlock-alt:before {
    content: "\f13e";
}

.icon-bullseye:before {
    content: "\f140";
}

.icon-ellipsis-h:before {
    content: "\f141";
}

.icon-ellipsis-v:before {
    content: "\f142";
}

.icon-rss-square:before {
    content: "\f143";
}

.icon-play-circle:before {
    content: "\f144";
}

.icon-ticket:before {
    content: "\f145";
}

.icon-minus-square:before {
    content: "\f146";
}

.icon-minus-square-o:before {
    content: "\f147";
}

.icon-level-up:before {
    content: "\f148";
}

.icon-level-down:before {
    content: "\f149";
}

.icon-check-square:before {
    content: "\f14a";
}

.icon-pencil-square:before {
    content: "\f14b";
}

.icon-external-link-square:before {
    content: "\f14c";
}

.icon-share-square:before {
    content: "\f14d";
}

.icon-compass:before {
    content: "\f14e";
}

.icon-toggle-down:before,
.icon-caret-square-o-down:before {
    content: "\f150";
}

.icon-toggle-up:before,
.icon-caret-square-o-up:before {
    content: "\f151";
}

.icon-toggle-right:before,
.icon-caret-square-o-right:before {
    content: "\f152";
}

.icon-euro:before,
.icon-eur:before {
    content: "\f153";
}

.icon-gbp:before {
    content: "\f154";
}

.icon-dollar:before,
.icon-usd:before {
    content: "\f155";
}

.icon-rupee:before,
.icon-inr:before {
    content: "\f156";
}

.icon-cny:before,
.icon-rmb:before,
.icon-yen:before,
.icon-jpy:before {
    content: "\f157";
}

.icon-ruble:before,
.icon-rouble:before,
.icon-rub:before {
    content: "\f158";
}

.icon-won:before,
.icon-krw:before {
    content: "\f159";
}

.icon-bitcoin:before,
.icon-btc:before {
    content: "\f15a";
}

.icon-file:before {
    content: "\f15b";
}

.icon-file-text:before {
    content: "\f15c";
}

.icon-sort-alpha-asc:before {
    content: "\f15d";
}

.icon-sort-alpha-desc:before {
    content: "\f15e";
}

.icon-sort-amount-asc:before {
    content: "\f160";
}

.icon-sort-amount-desc:before {
    content: "\f161";
}

.icon-sort-numeric-asc:before {
    content: "\f162";
}

.icon-sort-numeric-desc:before {
    content: "\f163";
}

.icon-thumbs-up:before {
    content: "\f164";
}

.icon-thumbs-down:before {
    content: "\f165";
}

.icon-youtube-square:before {
    content: "\f166";
}

.icon-youtube:before {
    content: "\f167";
}

.icon-xing:before {
    content: "\f168";
}

.icon-xing-square:before {
    content: "\f169";
}

.icon-youtube-play:before {
    content: "\f16a";
}

.icon-dropbox:before {
    content: "\f16b";
}

.icon-stack-overflow:before {
    content: "\f16c";
}

.icon-instagram:before {
    content: "\f16d";
}

.icon-flickr:before {
    content: "\f16e";
}

.icon-adn:before {
    content: "\f170";
}

.icon-bitbucket:before {
    content: "\f171";
}

.icon-bitbucket-square:before {
    content: "\f172";
}

.icon-tumblr:before {
    content: "\f173";
}

.icon-tumblr-square:before {
    content: "\f174";
}

.icon-long-arrow-down:before {
    content: "\f175";
}

.icon-long-arrow-up:before {
    content: "\f176";
}

.icon-long-arrow-left:before {
    content: "\f177";
}

.icon-long-arrow-right:before {
    content: "\f178";
}

.icon-apple:before {
    content: "\f179";
}

.icon-windows:before {
    content: "\f17a";
}

.icon-android:before {
    content: "\f17b";
}

.icon-linux:before {
    content: "\f17c";
}

.icon-dribbble:before {
    content: "\f17d";
}

.icon-skype:before {
    content: "\f17e";
}

.icon-foursquare:before {
    content: "\f180";
}

.icon-trello:before {
    content: "\f181";
}

.icon-female:before {
    content: "\f182";
}

.icon-male:before {
    content: "\f183";
}

.icon-gittip:before,
.icon-gratipay:before {
    content: "\f184";
}

.icon-sun-o:before {
    content: "\f185";
}

.icon-moon-o:before {
    content: "\f186";
}

.icon-archive:before {
    content: "\f187";
}

.icon-bug:before {
    content: "\f188";
}

.icon-vk:before {
    content: "\f189";
}

.icon-weibo:before {
    content: "\f18a";
}

.icon-renren:before {
    content: "\f18b";
}

.icon-pagelines:before {
    content: "\f18c";
}

.icon-stack-exchange:before {
    content: "\f18d";
}

.icon-arrow-circle-o-right:before {
    content: "\f18e";
}

.icon-arrow-circle-o-left:before {
    content: "\f190";
}

.icon-toggle-left:before,
.icon-caret-square-o-left:before {
    content: "\f191";
}

.icon-dot-circle-o:before {
    content: "\f192";
}

.icon-wheelchair:before {
    content: "\f193";
}

.icon-vimeo-square:before {
    content: "\f194";
}

.icon-turkish-lira:before,
.icon-try:before {
    content: "\f195";
}

.icon-plus-square-o:before {
    content: "\f196";
}

.icon-space-shuttle:before {
    content: "\f197";
}

.icon-slack:before {
    content: "\f198";
}

.icon-envelope-square:before {
    content: "\f199";
}

.icon-wordpress:before {
    content: "\f19a";
}

.icon-openid:before {
    content: "\f19b";
}

.icon-institution:before,
.icon-bank:before,
.icon-university:before {
    content: "\f19c";
}

.icon-mortar-board:before,
.icon-graduation-cap:before {
    content: "\f19d";
}

.icon-yahoo:before {
    content: "\f19e";
}

.icon-google:before {
    content: "\f1a0";
}

.icon-reddit:before {
    content: "\f1a1";
}

.icon-reddit-square:before {
    content: "\f1a2";
}

.icon-stumbleupon-circle:before {
    content: "\f1a3";
}

.icon-stumbleupon:before {
    content: "\f1a4";
}

.icon-delicious:before {
    content: "\f1a5";
}

.icon-digg:before {
    content: "\f1a6";
}

.icon-pied-piper-pp:before {
    content: "\f1a7";
}

.icon-pied-piper-alt:before {
    content: "\f1a8";
}

.icon-drupal:before {
    content: "\f1a9";
}

.icon-joomla:before {
    content: "\f1aa";
}

.icon-language:before {
    content: "\f1ab";
}

.icon-fax:before {
    content: "\f1ac";
}

.icon-building:before {
    content: "\f1ad";
}

.icon-kid:before {
    content: "\f1ae";
}

.icon-paw:before {
    content: "\f1b0";
}

.icon-spoon:before {
    content: "\f1b1";
}

.icon-cube:before {
    content: "\f1b2";
}

.icon-cubes:before {
    content: "\f1b3";
}

.icon-behance:before {
    content: "\f1b4";
}

.icon-behance-square:before {
    content: "\f1b5";
}

.icon-steam:before {
    content: "\f1b6";
}

.icon-steam-square:before {
    content: "\f1b7";
}

.icon-recycle:before {
    content: "\f1b8";
}

.icon-automobile:before,
.icon-car:before {
    content: "\f1b9";
}

.icon-cab:before,
.icon-taxi:before {
    content: "\f1ba";
}

.icon-tree:before {
    content: "\f1bb";
}

.icon-spotify:before {
    content: "\f1bc";
}

.icon-deviantart:before {
    content: "\f1bd";
}

.icon-soundcloud:before {
    content: "\f1be";
}

.icon-database:before {
    content: "\f1c0";
}

.icon-file-pdf-o:before {
    content: "\f1c1";
}

.icon-file-word-o:before {
    content: "\f1c2";
}

.icon-file-excel-o:before {
    content: "\f1c3";
}

.icon-file-powerpoint-o:before {
    content: "\f1c4";
}

.icon-file-photo-o:before,
.icon-file-picture-o:before,
.icon-file-image-o:before {
    content: "\f1c5";
}

.icon-file-zip-o:before,
.icon-file-archive-o:before {
    content: "\f1c6";
}

.icon-file-sound-o:before,
.icon-file-audio-o:before {
    content: "\f1c7";
}

.icon-file-movie-o:before,
.icon-file-video-o:before {
    content: "\f1c8";
}

.icon-file-code-o:before {
    content: "\f1c9";
}

.icon-vine:before {
    content: "\f1ca";
}

.icon-codepen:before {
    content: "\f1cb";
}

.icon-jsfiddle:before {
    content: "\f1cc";
}

.icon-life-bouy:before,
.icon-life-buoy:before,
.icon-life-saver:before,
.icon-support:before,
.icon-life-ring:before {
    content: "\f1cd";
}

.icon-circle-o-notch:before {
    content: "\f1ce";
}

.icon-ra:before,
.icon-resistance:before,
.icon-rebel:before {
    content: "\f1d0";
}

.icon-ge:before,
.icon-empire:before {
    content: "\f1d1";
}

.icon-git-square:before {
    content: "\f1d2";
}

.icon-git:before {
    content: "\f1d3";
}

.icon-y-combinator-square:before,
.icon-yc-square:before,
.icon-hacker-news:before {
    content: "\f1d4";
}

.icon-tencent-weibo:before {
    content: "\f1d5";
}

.icon-qq:before {
    content: "\f1d6";
}

.icon-wechat:before,
.icon-weixin:before {
    content: "\f1d7";
}

.icon-send:before,
.icon-paper-plane:before {
    content: "\f1d8";
}

.icon-send-o:before,
.icon-paper-plane-o:before {
    content: "\f1d9";
}

.icon-history:before {
    content: "\f1da";
}

.icon-circle-thin:before {
    content: "\f1db";
}

.icon-header:before {
    content: "\f1dc";
}

.icon-paragraph:before {
    content: "\f1dd";
}

.icon-sliders:before {
    content: "\f1de";
}

.icon-share-alt:before {
    content: "\f1e0";
}

.icon-share-alt-square:before {
    content: "\f1e1";
}

.icon-bomb:before {
    content: "\f1e2";
}

.icon-soccer-ball-o:before,
.icon-futbol-o:before {
    content: "\f1e3";
}

.icon-tty:before {
    content: "\f1e4";
}

.icon-binoculars:before {
    content: "\f1e5";
}

.icon-plug:before {
    content: "\f1e6";
}

.icon-slideshare:before {
    content: "\f1e7";
}

.icon-twitch:before {
    content: "\f1e8";
}

.icon-yelp:before {
    content: "\f1e9";
}

.icon-newspaper-o:before {
    content: "\f1ea";
}

.icon-wifi:before {
    content: "\f1eb";
}

.icon-calculator:before {
    content: "\f1ec";
}

.icon-paypal:before {
    content: "\f1ed";
}

.icon-google-wallet:before {
    content: "\f1ee";
}

.icon-cc-visa:before {
    content: "\f1f0";
}

.icon-cc-mastercard:before {
    content: "\f1f1";
}

.icon-cc-discover:before {
    content: "\f1f2";
}

.icon-cc-amex:before {
    content: "\f1f3";
}

.icon-cc-paypal:before {
    content: "\f1f4";
}

.icon-cc-stripe:before {
    content: "\f1f5";
}

.icon-bell-slash:before {
    content: "\f1f6";
}

.icon-bell-slash-o:before {
    content: "\f1f7";
}

.icon-trash:before {
    content: "\f1f8";
}

.icon-copyright:before {
    content: "\f1f9";
}

.icon-at:before {
    content: "\f1fa";
}

.icon-eyedropper:before {
    content: "\f1fb";
}

.icon-paint-brush:before {
    content: "\f1fc";
}

.icon-birthday-cake:before {
    content: "\f1fd";
}

.icon-area-chart:before {
    content: "\f1fe";
}

.icon-pie-chart:before {
    content: "\f200";
}

.icon-line-chart:before {
    content: "\f201";
}

.icon-lastfm:before {
    content: "\f202";
}

.icon-lastfm-square:before {
    content: "\f203";
}

.icon-toggle-off:before {
    content: "\f204";
}

.icon-toggle-on:before {
    content: "\f205";
}

.icon-bicycle:before {
    content: "\f206";
}

.icon-bus:before {
    content: "\f207";
}

.icon-ioxhost:before {
    content: "\f208";
}

.icon-angellist:before {
    content: "\f209";
}

.icon-cc:before {
    content: "\f20a";
}

.icon-shekel:before,
.icon-sheqel:before,
.icon-ils:before {
    content: "\f20b";
}

.icon-meanpath:before {
    content: "\f20c";
}

.icon-buysellads:before {
    content: "\f20d";
}

.icon-connectdevelop:before {
    content: "\f20e";
}

.icon-dashcube:before {
    content: "\f210";
}

.icon-forumbee:before {
    content: "\f211";
}

.icon-leanpub:before {
    content: "\f212";
}

.icon-sellsy:before {
    content: "\f213";
}

.icon-shirtsinbulk:before {
    content: "\f214";
}

.icon-simplybuilt:before {
    content: "\f215";
}

.icon-skyatlas:before {
    content: "\f216";
}

.icon-cart-plus:before {
    content: "\f217";
}

.icon-cart-arrow-down:before {
    content: "\f218";
}

.icon-diamond:before {
    content: "\f219";
}

.icon-ship:before {
    content: "\f21a";
}

.icon-user-secret:before {
    content: "\f21b";
}

.icon-motorcycle:before {
    content: "\f21c";
}

.icon-street-view:before {
    content: "\f21d";
}

.icon-heartbeat:before {
    content: "\f21e";
}

.icon-venus:before {
    content: "\f221";
}

.icon-mars:before {
    content: "\f222";
}

.icon-mercury:before {
    content: "\f223";
}

.icon-intersex:before,
.icon-transgender:before {
    content: "\f224";
}

.icon-transgender-alt:before {
    content: "\f225";
}

.icon-venus-double:before {
    content: "\f226";
}

.icon-mars-double:before {
    content: "\f227";
}

.icon-venus-mars:before {
    content: "\f228";
}

.icon-mars-stroke:before {
    content: "\f229";
}

.icon-mars-stroke-v:before {
    content: "\f22a";
}

.icon-mars-stroke-h:before {
    content: "\f22b";
}

.icon-neuter:before {
    content: "\f22c";
}

.icon-genderless:before {
    content: "\f22d";
}

.icon-facebook-official:before {
    content: "\f230";
}

.icon-pinterest-p:before {
    content: "\f231";
}

.icon-whatsapp:before {
    content: "\f232";
}

.icon-server:before {
    content: "\f233";
}

.icon-user-plus:before {
    content: "\f234";
}

.icon-user-times:before {
    content: "\f235";
}

.icon-hotel:before,
.icon-bed:before {
    content: "\f236";
}

.icon-viacoin:before {
    content: "\f237";
}

.icon-train:before {
    content: "\f238";
}

.icon-subway:before {
    content: "\f239";
}

.icon-medium:before {
    content: "\f23a";
}

.icon-yc:before,
.icon-y-combinator:before {
    content: "\f23b";
}

.icon-optin-monster:before {
    content: "\f23c";
}

.icon-opencart:before {
    content: "\f23d";
}

.icon-expeditedssl:before {
    content: "\f23e";
}

.icon-battery-4:before,
.icon-battery-full:before {
    content: "\f240";
}

.icon-battery-3:before,
.icon-battery-three-quarters:before {
    content: "\f241";
}

.icon-battery-2:before,
.icon-battery-half:before {
    content: "\f242";
}

.icon-battery-1:before,
.icon-battery-quarter:before {
    content: "\f243";
}

.icon-battery-0:before,
.icon-battery-empty:before {
    content: "\f244";
}

.icon-mouse-pointer:before {
    content: "\f245";
}

.icon-i-cursor:before {
    content: "\f246";
}

.icon-object-group:before {
    content: "\f247";
}

.icon-object-ungroup:before {
    content: "\f248";
}

.icon-sticky-note:before {
    content: "\f249";
}

.icon-sticky-note-o:before {
    content: "\f24a";
}

.icon-cc-jcb:before {
    content: "\f24b";
}

.icon-cc-diners-club:before {
    content: "\f24c";
}

.icon-clone:before {
    content: "\f24d";
}

.icon-balance-scale:before {
    content: "\f24e";
}

.icon-hourglass-o:before {
    content: "\f250";
}

.icon-hourglass-1:before,
.icon-hourglass-start:before {
    content: "\f251";
}

.icon-hourglass-2:before,
.icon-hourglass-half:before {
    content: "\f252";
}

.icon-hourglass-3:before,
.icon-hourglass-end:before {
    content: "\f253";
}

.icon-hourglass:before {
    content: "\f254";
}

.icon-hand-grab-o:before,
.icon-hand-rock-o:before {
    content: "\f255";
}

.icon-hand-stop-o:before,
.icon-hand-paper-o:before {
    content: "\f256";
}

.icon-hand-scissors-o:before {
    content: "\f257";
}

.icon-hand-lizard-o:before {
    content: "\f258";
}

.icon-hand-spock-o:before {
    content: "\f259";
}

.icon-hand-pointer-o:before {
    content: "\f25a";
}

.icon-hand-peace-o:before {
    content: "\f25b";
}

.icon-trademark:before {
    content: "\f25c";
}

.icon-registered:before {
    content: "\f25d";
}

.icon-creative-commons:before {
    content: "\f25e";
}

.icon-gg:before {
    content: "\f260";
}

.icon-gg-circle:before {
    content: "\f261";
}

.icon-tripadvisor:before {
    content: "\f262";
}

.icon-odnoklassniki:before {
    content: "\f263";
}

.icon-odnoklassniki-square:before {
    content: "\f264";
}

.icon-get-pocket:before {
    content: "\f265";
}

.icon-wikipedia-w:before {
    content: "\f266";
}

.icon-safari:before {
    content: "\f267";
}

.icon-chrome:before {
    content: "\f268";
}

.icon-firefox:before {
    content: "\f269";
}

.icon-opera:before {
    content: "\f26a";
}

.icon-internet-explorer:before {
    content: "\f26b";
}

.icon-tv:before,
.icon-television:before {
    content: "\f26c";
}

.icon-contao:before {
    content: "\f26d";
}

.icon-500px:before {
    content: "\f26e";
}

.icon-amazon:before {
    content: "\f270";
}

.icon-calendar-plus-o:before {
    content: "\f271";
}

.icon-calendar-minus-o:before {
    content: "\f272";
}

.icon-calendar-times-o:before {
    content: "\f273";
}

.icon-calendar-check-o:before {
    content: "\f274";
}

.icon-industry:before {
    content: "\f275";
}

.icon-map-pin:before {
    content: "\f276";
}

.icon-map-signs:before {
    content: "\f277";
}

.icon-map-o:before {
    content: "\f278";
}

.icon-map:before {
    content: "\f279";
}

.icon-commenting:before {
    content: "\f27a";
}

.icon-commenting-o:before {
    content: "\f27b";
}

.icon-houzz:before {
    content: "\f27c";
}

.icon-vimeo:before {
    content: "\f27d";
}

.icon-black-tie:before {
    content: "\f27e";
}

.icon-fonticons:before {
    content: "\f280";
}

.icon-reddit-alien:before {
    content: "\f281";
}

.icon-edge:before {
    content: "\f282";
}

.icon-credit-card-alt:before {
    content: "\f283";
}

.icon-codiepie:before {
    content: "\f284";
}

.icon-modx:before {
    content: "\f285";
}

.icon-fort-awesome:before {
    content: "\f286";
}

.icon-usb:before {
    content: "\f287";
}

.icon-product-hunt:before {
    content: "\f288";
}

.icon-mixcloud:before {
    content: "\f289";
}

.icon-scribd:before {
    content: "\f28a";
}

.icon-pause-circle:before {
    content: "\f28b";
}

.icon-pause-circle-o:before {
    content: "\f28c";
}

.icon-stop-circle:before {
    content: "\f28d";
}

.icon-stop-circle-o:before {
    content: "\f28e";
}

.icon-shopping-bag:before {
    content: "\f290";
}

.icon-shopping-basket:before {
    content: "\f291";
}

.icon-hashtag:before {
    content: "\f292";
}

.icon-bluetooth:before {
    content: "\f293";
}

.icon-bluetooth-b:before {
    content: "\f294";
}

.icon-percent:before {
    content: "\f295";
}

.icon-gitlab:before {
    content: "\f296";
}

.icon-wpbeginner:before {
    content: "\f297";
}

.icon-wpforms:before {
    content: "\f298";
}

.icon-envira:before {
    content: "\f299";
}

.icon-universal-access:before {
    content: "\f29a";
}

.icon-wheelchair-alt:before {
    content: "\f29b";
}

.icon-question-circle-o:before {
    content: "\f29c";
}

.icon-blind:before {
    content: "\f29d";
}

.icon-audio-description:before {
    content: "\f29e";
}

.icon-volume-control-phone:before {
    content: "\f2a0";
}

.icon-braille:before {
    content: "\f2a1";
}

.icon-assistive-listening-systems:before {
    content: "\f2a2";
}

.icon-asl-interpreting:before,
.icon-american-sign-language-interpreting:before {
    content: "\f2a3";
}

.icon-deafness:before,
.icon-hard-of-hearing:before,
.icon-deaf:before {
    content: "\f2a4";
}

.icon-glide:before {
    content: "\f2a5";
}

.icon-glide-g:before {
    content: "\f2a6";
}

.icon-signing:before,
.icon-sign-language:before {
    content: "\f2a7";
}

.icon-low-vision:before {
    content: "\f2a8";
}

.icon-viadeo:before {
    content: "\f2a9";
}

.icon-viadeo-square:before {
    content: "\f2aa";
}

.icon-snapchat:before {
    content: "\f2ab";
}

.icon-snapchat-ghost:before {
    content: "\f2ac";
}

.icon-snapchat-square:before {
    content: "\f2ad";
}

.icon-pied-piper:before {
    content: "\f2ae";
}

.icon-first-order:before {
    content: "\f2b0";
}

.icon-yoast:before {
    content: "\f2b1";
}

.icon-themeisle:before {
    content: "\f2b2";
}

.icon-google-plus-circle:before,
.icon-google-plus-official:before {
    content: "\f2b3";
}

.icon-fa:before,
.icon-font-awesome:before {
    content: "\f2b4";
}

@-ms-viewport {
    width: device-width;
}

[tabindex="-1"]:focus {
    outline: none !important;
}

a,
area,
button,
[role="button"],
input,
label,
select,
summary,
textarea {
    -ms-touch-action: manipulation;
    touch-action: manipulation;
}

    input[type="date"],
    input[type="time"],
    input[type="datetime-local"],
    input[type="month"] {
        -webkit-appearance: listbox;
    }

textarea {
    resize: vertical;
}

.row.gutter-xs {
    margin-left: -5px;
    margin-right: -5px;
}

    .row.gutter-xs > .col-xs-1, .row.gutter-xs > .col-sm-1, .row.gutter-xs > .col-md-1, .row.gutter-xs > .col-lg-1, .row.gutter-xs > .col-xs-2, .row.gutter-xs > .col-sm-2, .row.gutter-xs > .col-md-2, .row.gutter-xs > .col-lg-2, .row.gutter-xs > .col-lg-2-img, .row.gutter-xs > .col-xs-3, .row.gutter-xs > .col-sm-3, .row.gutter-xs > .col-sm-3-img, .row.gutter-xs > .col-md-3, .row.gutter-xs > .col-lg-3, .row.gutter-xs > .col-xs-4, .row.gutter-xs > .col-sm-4, .row.gutter-xs > .col-md-4, .row.gutter-xs > .col-lg-4, .row.gutter-xs > .col-xs-5, .row.gutter-xs > .col-sm-5, .row.gutter-xs > .col-md-5, .row.gutter-xs > .col-lg-5, .row.gutter-xs > .col-xs-6, .row.gutter-xs > .col-xs-6-img, .row.gutter-xs > .col-sm-6, .row.gutter-xs > .col-md-6, .row.gutter-xs > .col-lg-6, .row.gutter-xs > .col-xs-7, .row.gutter-xs > .col-sm-7, .row.gutter-xs > .col-md-7, .row.gutter-xs > .col-lg-7, .row.gutter-xs > .col-xs-8, .row.gutter-xs > .col-sm-8, .row.gutter-xs > .col-md-8, .row.gutter-xs > .col-lg-8, .row.gutter-xs > .col-xs-9, .row.gutter-xs > .col-sm-9, .row.gutter-xs > .col-md-9, .row.gutter-xs > .col-lg-9, .row.gutter-xs > .col-xs-10, .row.gutter-xs > .col-sm-10, .row.gutter-xs > .col-md-10, .row.gutter-xs > .col-lg-10, .row.gutter-xs > .col-xs-11, .row.gutter-xs > .col-sm-11, .row.gutter-xs > .col-md-11, .row.gutter-xs > .col-lg-11, .row.gutter-xs > .col-xs-12, .row.gutter-xs > .col-sm-12, .row.gutter-xs > .col-md-12, .row.gutter-xs > .col-lg-12 {
        padding-left: 5px;
        padding-right: 5px;
    }

.row.gutter-sm {
    margin-left: -10px;
    margin-right: -10px;
}

    .row.gutter-sm > .col-xs-1, .row.gutter-sm > .col-sm-1, .row.gutter-sm > .col-md-1, .row.gutter-sm > .col-lg-1, .row.gutter-sm > .col-xs-2, .row.gutter-sm > .col-sm-2, .row.gutter-sm > .col-md-2, .row.gutter-sm > .col-lg-2, .row.gutter-sm > .col-lg-2-img, .row.gutter-sm > .col-xs-3, .row.gutter-sm > .col-sm-3, .row.gutter-sm > .col-sm-3-img, .row.gutter-sm > .col-md-3, .row.gutter-sm > .col-lg-3, .row.gutter-sm > .col-xs-4, .row.gutter-sm > .col-sm-4, .row.gutter-sm > .col-md-4, .row.gutter-sm > .col-lg-4, .row.gutter-sm > .col-xs-5, .row.gutter-sm > .col-sm-5, .row.gutter-sm > .col-md-5, .row.gutter-sm > .col-lg-5, .row.gutter-sm > .col-xs-6, .row.gutter-sm > .col-xs-6-img, .row.gutter-sm > .col-sm-6, .row.gutter-sm > .col-md-6, .row.gutter-sm > .col-lg-6, .row.gutter-sm > .col-xs-7, .row.gutter-sm > .col-sm-7, .row.gutter-sm > .col-md-7, .row.gutter-sm > .col-lg-7, .row.gutter-sm > .col-xs-8, .row.gutter-sm > .col-sm-8, .row.gutter-sm > .col-md-8, .row.gutter-sm > .col-lg-8, .row.gutter-sm > .col-xs-9, .row.gutter-sm > .col-sm-9, .row.gutter-sm > .col-md-9, .row.gutter-sm > .col-lg-9, .row.gutter-sm > .col-xs-10, .row.gutter-sm > .col-sm-10, .row.gutter-sm > .col-md-10, .row.gutter-sm > .col-lg-10, .row.gutter-sm > .col-xs-11, .row.gutter-sm > .col-sm-11, .row.gutter-sm > .col-md-11, .row.gutter-sm > .col-lg-11, .row.gutter-sm > .col-xs-12, .row.gutter-sm > .col-sm-12, .row.gutter-sm > .col-md-12, .row.gutter-sm > .col-lg-12 {
        padding-left: 10px;
        padding-right: 10px;
    }

.row.gutter-lg {
    margin-left: -20px;
    margin-right: -20px;
}

    .row.gutter-lg > .col-xs-1, .row.gutter-lg > .col-sm-1, .row.gutter-lg > .col-md-1, .row.gutter-lg > .col-lg-1, .row.gutter-lg > .col-xs-2, .row.gutter-lg > .col-sm-2, .row.gutter-lg > .col-md-2, .row.gutter-lg > .col-lg-2, .row.gutter-lg > .col-lg-2-img, .row.gutter-lg > .col-xs-3, .row.gutter-lg > .col-sm-3, .row.gutter-lg > .col-sm-3-img, .row.gutter-lg > .col-md-3, .row.gutter-lg > .col-lg-3, .row.gutter-lg > .col-xs-4, .row.gutter-lg > .col-sm-4, .row.gutter-lg > .col-md-4, .row.gutter-lg > .col-lg-4, .row.gutter-lg > .col-xs-5, .row.gutter-lg > .col-sm-5, .row.gutter-lg > .col-md-5, .row.gutter-lg > .col-lg-5, .row.gutter-lg > .col-xs-6, .row.gutter-lg > .col-xs-6-img, .row.gutter-lg > .col-sm-6, .row.gutter-lg > .col-md-6, .row.gutter-lg > .col-lg-6, .row.gutter-lg > .col-xs-7, .row.gutter-lg > .col-sm-7, .row.gutter-lg > .col-md-7, .row.gutter-lg > .col-lg-7, .row.gutter-lg > .col-xs-8, .row.gutter-lg > .col-sm-8, .row.gutter-lg > .col-md-8, .row.gutter-lg > .col-lg-8, .row.gutter-lg > .col-xs-9, .row.gutter-lg > .col-sm-9, .row.gutter-lg > .col-md-9, .row.gutter-lg > .col-lg-9, .row.gutter-lg > .col-xs-10, .row.gutter-lg > .col-sm-10, .row.gutter-lg > .col-md-10, .row.gutter-lg > .col-lg-10, .row.gutter-lg > .col-xs-11, .row.gutter-lg > .col-sm-11, .row.gutter-lg > .col-md-11, .row.gutter-lg > .col-lg-11, .row.gutter-lg > .col-xs-12, .row.gutter-lg > .col-sm-12, .row.gutter-lg > .col-md-12, .row.gutter-lg > .col-lg-12 {
        padding-left: 20px;
        padding-right: 20px;
    }

.table-bordered > thead > tr > th,
.table-bordered > thead > tr > td {
    border-bottom-width: 1px;
}

.table-borderless > thead > tr > th,
.table-borderless > thead > tr > td,
.table-borderless > tbody > tr > th,
.table-borderless > tbody > tr > td,
.table-borderless > tfoot > tr > th,
.table-borderless > tfoot > tr > td {
    border: none;
}

.table-nowrap > thead > tr > th,
.table-nowrap > thead > tr > td,
.table-nowrap > tbody > tr > th,
.table-nowrap > tbody > tr > td,
.table-nowrap > tfoot > tr > th,
.table-nowrap > tfoot > tr > td {
    white-space: nowrap;
}

.table-center > thead > tr > th,
.table-center > thead > tr > td,
.table-center > tbody > tr > th,
.table-center > tbody > tr > td,
.table-center > tfoot > tr > th,
.table-center > tfoot > tr > td {
    text-align: center;
}

.table-middle > thead > tr > th,
.table-middle > thead > tr > td,
.table-middle > tbody > tr > th,
.table-middle > tbody > tr > td,
.table-middle > tfoot > tr > th,
.table-middle > tfoot > tr > td {
    vertical-align: middle;
}

@media screen and (max-width: 767px) {
    .table-flip-scroll:before, .table-flip-scroll:after {
        content: " ";
        display: table;
    }

    .table-flip-scroll:after {
        clear: both;
    }

    .table-flip-scroll > .table {
        border: 1px solid #ddd;
        display: block;
        position: relative;
    }

        .table-flip-scroll > .table > thead > tr > th,
        .table-flip-scroll > .table > thead > tr > td,
        .table-flip-scroll > .table > tbody > tr > th,
        .table-flip-scroll > .table > tbody > tr > td {
            border: none;
            display: block;
            text-align: left;
        }

        .table-flip-scroll > .table > thead {
            display: block;
            float: left;
        }

            .table-flip-scroll > .table > thead > tr {
                display: block;
            }

                .table-flip-scroll > .table > thead > tr > th,
                .table-flip-scroll > .table > thead > tr > td {
                    text-align: right;
                }

        .table-flip-scroll > .table > tbody {
            border-left: 1px solid #ddd;
            display: block;
            overflow-x: auto;
            position: relative;
            white-space: nowrap;
            width: auto;
        }

            .table-flip-scroll > .table > tbody:before, .table-flip-scroll > .table > tbody:after {
                content: " ";
                display: table;
            }

            .table-flip-scroll > .table > tbody:after {
                clear: both;
            }

            .table-flip-scroll > .table > tbody > tr {
                display: inline-block;
                vertical-align: top;
            }
}

.table-fixed {
    table-layout: fixed;
}

.form-control {
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.form-group .form-group {
    margin-bottom: 0;
}

.input-pill {
    border-radius: 10em;
    padding-left: 1.25em;
    padding-right: 1.25em;
}

.input-thick {
    border-width: 2px;
}

.input-contrast {
    background-color: #f2f2f2;
    -webkit-transition: background-color 0.15s ease-in-out;
    -o-transition: background-color 0.15s ease-in-out;
    transition: background-color 0.15s ease-in-out;
}

    .input-contrast:focus {
        background-color: #fff;
    }

.form-actions:before, .form-actions:after {
    content: " ";
    display: table;
}

.form-actions:after {
    clear: both;
}

.form-actions .btn {
    float: right;
    margin-left: 5px;
}

.input-with-icon {
    position: relative;
}

    .input-with-icon .form-control {
        padding-left: 34px;
    }

.input-icon {
    color: #ddd;
    display: block;
    height: 34px;
    left: 1px;
    line-height: 34px;
    pointer-events: none;
    position: absolute;
    text-align: center;
    top: 0;
    width: 34px;
    z-index: 5;
}

.form-group-lg .input-with-icon .form-control {
    padding-left: 46px;
}

.form-group-lg .input-with-icon .input-icon {
    font-size: 18px;
    height: 46px;
    line-height: 46px;
    width: 46px;
}

.form-group-sm .input-with-icon .form-control {
    padding-left: 30px;
}

.form-group-sm .input-with-icon .input-icon {
    font-size: 12px;
    height: 30px;
    line-height: 30px;
    width: 30px;
}

.btn {
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: none;
    position: relative;
    text-decoration: none;
    text-transform: none;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
    height: 30px;
}

    .btn:active, .btn.active {
        background-image: none;
        -webkit-box-shadow: none;
        box-shadow: none;
    }

.btn-link, .btn-link:active, .btn-link.active {
    background-color: transparent;
    background-image: none;
    -webkit-background-size: auto auto;
    background-size: auto;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.btn-icon {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    padding: 0;
}

    .btn-icon .badge-above {
        position: absolute;
        top: -9px;
    }

.btn-pill {
    border-radius: 10em;
    padding-left: 1.25em;
    padding-right: 1.25em;
}

.btn-thick {
    border-width: 2px;
    font-weight: 600;
}

.btn-expander {
    border: 0;
    border-radius: 3px;
    font-family: sans-serif;
    font-size: 12px;
    font-weight: bold;
    height: 12px;
    line-height: 6px;
    margin-left: 5px;
    padding: 0 5px;
    position: relative;
    top: -1px;
}

.btn-outline-default {
    background-color: transparent;
    border-color: #474949;
    color: #474949;
}

    .btn-outline-default:focus, .btn-outline-default.focus {
        background-color: transparent;
        border-color: #474949;
        color: #474949;
    }

    .btn-outline-default:hover {
        background-color: #474949;
        border-color: #474949;
        color: #fff;
    }

    .btn-outline-default:active, .btn-outline-default.active,
    .open > .btn-outline-default.dropdown-toggle {
        background-color: #474949;
        border-color: #474949;
        color: #fff;
    }

        .btn-outline-default:active:hover, .btn-outline-default:active:focus, .btn-outline-default:active.focus, .btn-outline-default.active:hover, .btn-outline-default.active:focus, .btn-outline-default.active.focus,
        .open > .btn-outline-default.dropdown-toggle:hover,
        .open > .btn-outline-default.dropdown-toggle:focus,
        .open > .btn-outline-default.dropdown-toggle.focus {
            background-color: #212222;
            border-color: #212222;
            color: #fff;
        }

    .btn-outline-default.disabled:hover, .btn-outline-default.disabled:focus, .btn-outline-default.disabled.focus, .btn-outline-default[disabled]:hover, .btn-outline-default[disabled]:focus, .btn-outline-default[disabled].focus,
    fieldset[disabled] .btn-outline-default:hover,
    fieldset[disabled] .btn-outline-default:focus,
    fieldset[disabled] .btn-outline-default.focus {
        background-color: transparent;
        border-color: #474949;
        color: #474949;
    }

    .btn-outline-default .badge {
        background-color: #474949;
        border-color: transparent;
        color: #fff;
    }

.btn-outline-primary {
    background-color: transparent;
    border-color: #d9230f;
    color: #d9230f;
}

    .btn-outline-primary:focus, .btn-outline-primary.focus {
        background-color: transparent;
        border-color: #d9230f;
        color: #d9230f;
    }

    .btn-outline-primary:hover {
        background-color: #d9230f;
        border-color: #d9230f;
        color: #fff;
    }

    .btn-outline-primary:active, .btn-outline-primary.active,
    .open > .btn-outline-primary.dropdown-toggle {
        background-color: #d9230f;
        border-color: #d9230f;
        color: #fff;
    }

        .btn-outline-primary:active:hover, .btn-outline-primary:active:focus, .btn-outline-primary:active.focus, .btn-outline-primary.active:hover, .btn-outline-primary.active:focus, .btn-outline-primary.active.focus,
        .open > .btn-outline-primary.dropdown-toggle:hover,
        .open > .btn-outline-primary.dropdown-toggle:focus,
        .open > .btn-outline-primary.dropdown-toggle.focus {
            background-color: #91170a;
            border-color: #91170a;
            color: #fff;
        }

    .btn-outline-primary.disabled:hover, .btn-outline-primary.disabled:focus, .btn-outline-primary.disabled.focus, .btn-outline-primary[disabled]:hover, .btn-outline-primary[disabled]:focus, .btn-outline-primary[disabled].focus,
    fieldset[disabled] .btn-outline-primary:hover,
    fieldset[disabled] .btn-outline-primary:focus,
    fieldset[disabled] .btn-outline-primary.focus {
        background-color: transparent;
        border-color: #d9230f;
        color: #d9230f;
    }

    .btn-outline-primary .badge {
        background-color: #d9230f;
        border-color: transparent;
        color: #fff;
    }

.btn-outline-success {
    background-color: transparent;
    border-color: #469408;
    color: #469408;
}

    .btn-outline-success:focus, .btn-outline-success.focus {
        background-color: transparent;
        border-color: #469408;
        color: #469408;
    }

    .btn-outline-success:hover {
        background-color: #469408;
        border-color: #469408;
        color: #fff;
    }

    .btn-outline-success:active, .btn-outline-success.active,
    .open > .btn-outline-success.dropdown-toggle {
        background-color: #469408;
        border-color: #469408;
        color: #fff;
    }

        .btn-outline-success:active:hover, .btn-outline-success:active:focus, .btn-outline-success:active.focus, .btn-outline-success.active:hover, .btn-outline-success.active:focus, .btn-outline-success.active.focus,
        .open > .btn-outline-success.dropdown-toggle:hover,
        .open > .btn-outline-success.dropdown-toggle:focus,
        .open > .btn-outline-success.dropdown-toggle.focus {
            background-color: #244b04;
            border-color: #244b04;
            color: #fff;
        }

    .btn-outline-success.disabled:hover, .btn-outline-success.disabled:focus, .btn-outline-success.disabled.focus, .btn-outline-success[disabled]:hover, .btn-outline-success[disabled]:focus, .btn-outline-success[disabled].focus,
    fieldset[disabled] .btn-outline-success:hover,
    fieldset[disabled] .btn-outline-success:focus,
    fieldset[disabled] .btn-outline-success.focus {
        background-color: transparent;
        border-color: #469408;
        color: #469408;
    }

    .btn-outline-success .badge {
        background-color: #469408;
        border-color: transparent;
        color: #fff;
    }

.btn-outline-info {
    background-color: transparent;
    border-color: #029acf;
    color: #029acf;
}

    .btn-outline-info:focus, .btn-outline-info.focus {
        background-color: transparent;
        border-color: #029acf;
        color: #029acf;
    }

    .btn-outline-info:hover {
        background-color: #029acf;
        border-color: #029acf;
        color: #fff;
    }

    .btn-outline-info:active, .btn-outline-info.active,
    .open > .btn-outline-info.dropdown-toggle {
        background-color: #029acf;
        border-color: #029acf;
        color: #fff;
    }

        .btn-outline-info:active:hover, .btn-outline-info:active:focus, .btn-outline-info:active.focus, .btn-outline-info.active:hover, .btn-outline-info.active:focus, .btn-outline-info.active.focus,
        .open > .btn-outline-info.dropdown-toggle:hover,
        .open > .btn-outline-info.dropdown-toggle:focus,
        .open > .btn-outline-info.dropdown-toggle.focus {
            background-color: #016283;
            border-color: #016283;
            color: #fff;
        }

    .btn-outline-info.disabled:hover, .btn-outline-info.disabled:focus, .btn-outline-info.disabled.focus, .btn-outline-info[disabled]:hover, .btn-outline-info[disabled]:focus, .btn-outline-info[disabled].focus,
    fieldset[disabled] .btn-outline-info:hover,
    fieldset[disabled] .btn-outline-info:focus,
    fieldset[disabled] .btn-outline-info.focus {
        background-color: transparent;
        border-color: #029acf;
        color: #029acf;
    }

    .btn-outline-info .badge {
        background-color: #029acf;
        border-color: transparent;
        color: #fff;
    }

.btn-outline-warning {
    background-color: transparent;
    border-color: #9b479f;
    color: #9b479f;
}

    .btn-outline-warning:focus, .btn-outline-warning.focus {
        background-color: transparent;
        border-color: #9b479f;
        color: #9b479f;
    }

    .btn-outline-warning:hover {
        background-color: #9b479f;
        border-color: #9b479f;
        color: #fff;
    }

    .btn-outline-warning:active, .btn-outline-warning.active,
    .open > .btn-outline-warning.dropdown-toggle {
        background-color: #9b479f;
        border-color: #9b479f;
        color: #fff;
    }

        .btn-outline-warning:active:hover, .btn-outline-warning:active:focus, .btn-outline-warning:active.focus, .btn-outline-warning.active:hover, .btn-outline-warning.active:focus, .btn-outline-warning.active.focus,
        .open > .btn-outline-warning.dropdown-toggle:hover,
        .open > .btn-outline-warning.dropdown-toggle:focus,
        .open > .btn-outline-warning.dropdown-toggle.focus {
            background-color: #672f6a;
            border-color: #672f6a;
            color: #fff;
        }

    .btn-outline-warning.disabled:hover, .btn-outline-warning.disabled:focus, .btn-outline-warning.disabled.focus, .btn-outline-warning[disabled]:hover, .btn-outline-warning[disabled]:focus, .btn-outline-warning[disabled].focus,
    fieldset[disabled] .btn-outline-warning:hover,
    fieldset[disabled] .btn-outline-warning:focus,
    fieldset[disabled] .btn-outline-warning.focus {
        background-color: transparent;
        border-color: #9b479f;
        color: #9b479f;
    }

    .btn-outline-warning .badge {
        background-color: #9b479f;
        border-color: transparent;
        color: #fff;
    }

.btn-outline-danger {
    background-color: transparent;
    border-color: #d9831f;
    color: #d9831f;
}

    .btn-outline-danger:focus, .btn-outline-danger.focus {
        background-color: transparent;
        border-color: #d9831f;
        color: #d9831f;
    }

    .btn-outline-danger:hover {
        background-color: #d9831f;
        border-color: #d9831f;
        color: #fff;
    }

    .btn-outline-danger:active, .btn-outline-danger.active,
    .open > .btn-outline-danger.dropdown-toggle {
        background-color: #d9831f;
        border-color: #d9831f;
        color: #fff;
    }

        .btn-outline-danger:active:hover, .btn-outline-danger:active:focus, .btn-outline-danger:active.focus, .btn-outline-danger.active:hover, .btn-outline-danger.active:focus, .btn-outline-danger.active.focus,
        .open > .btn-outline-danger.dropdown-toggle:hover,
        .open > .btn-outline-danger.dropdown-toggle:focus,
        .open > .btn-outline-danger.dropdown-toggle.focus {
            background-color: #965b15;
            border-color: #965b15;
            color: #fff;
        }

    .btn-outline-danger.disabled:hover, .btn-outline-danger.disabled:focus, .btn-outline-danger.disabled.focus, .btn-outline-danger[disabled]:hover, .btn-outline-danger[disabled]:focus, .btn-outline-danger[disabled].focus,
    fieldset[disabled] .btn-outline-danger:hover,
    fieldset[disabled] .btn-outline-danger:focus,
    fieldset[disabled] .btn-outline-danger.focus {
        background-color: transparent;
        border-color: #d9831f;
        color: #d9831f;
    }

    .btn-outline-danger .badge {
        background-color: #d9831f;
        border-color: transparent;
        color: #fff;
    }

.badge {
    border: 1px solid transparent;
    font-size: 11px;
    padding: 2px 5px;
    position: relative;
}

.badge-above {
    margin-right: -9px;
    position: absolute;
    right: 100%;
    top: -9px;
    z-index: 3;
}

    .badge-above.right {
        left: 100%;
        margin-left: -9px;
        margin-right: 0;
        right: auto;
    }

.badge-default {
    background-color: #474949;
}

    .badge-default[href]:hover, .badge-default[href]:focus {
        background-color: #2e2f2f;
    }

.badge-primary {
    background-color: #d9230f;
}

    .badge-primary[href]:hover, .badge-primary[href]:focus {
        background-color: #a91b0c;
    }

.badge-success {
    background-color: #469408;
}

    .badge-success[href]:hover, .badge-success[href]:focus {
        background-color: #2f6405;
    }

.badge-info {
    background-color: #029acf;
}

    .badge-info[href]:hover, .badge-info[href]:focus {
        background-color: #02749c;
    }

.badge-warning {
    background-color: #9b479f;
}

    .badge-warning[href]:hover, .badge-warning[href]:focus {
        background-color: #79377c;
    }

.badge-danger {
    background-color: #d9831f;
}

    .badge-danger[href]:hover, .badge-danger[href]:focus {
        background-color: #ac6819;
    }

.badge-outline-default {
    background-color: transparent;
    border-color: #474949;
    color: #474949;
}

    .badge-outline-default[href]:hover, .badge-outline-default[href]:focus {
        background-color: #474949;
        color: #fff;
    }

.badge-outline-primary {
    background-color: transparent;
    border-color: #d9230f;
    color: #d9230f;
}

    .badge-outline-primary[href]:hover, .badge-outline-primary[href]:focus {
        background-color: #d9230f;
        color: #fff;
    }

.badge-outline-success {
    background-color: transparent;
    border-color: #469408;
    color: #469408;
}

    .badge-outline-success[href]:hover, .badge-outline-success[href]:focus {
        background-color: #469408;
        color: #fff;
    }

.badge-outline-info {
    background-color: transparent;
    border-color: #029acf;
    color: #029acf;
}

    .badge-outline-info[href]:hover, .badge-outline-info[href]:focus {
        background-color: #029acf;
        color: #fff;
    }

.badge-outline-warning {
    background-color: transparent;
    border-color: #9b479f;
    color: #9b479f;
}

    .badge-outline-warning[href]:hover, .badge-outline-warning[href]:focus {
        background-color: #9b479f;
        color: #fff;
    }

.badge-outline-danger {
    background-color: transparent;
    border-color: #d9831f;
    color: #d9831f;
}

    .badge-outline-danger[href]:hover, .badge-outline-danger[href]:focus {
        background-color: #d9831f;
        color: #fff;
    }

.bars {
    display: block;
    height: 2px;
    left: 50%;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 22px;
}

.bar-line {
    background-color: #fff;
    border-radius: 1px;
    display: block;
    height: 100%;
    position: absolute;
    /*-webkit-transition: all 0.1s ease-in-out 0s;
  -o-transition: all 0.1s ease-in-out 0s;
  transition: all 0.1s ease-in-out 0s;*/
}

.bar-line-1, .bar-line-4 {
    top: -7px;
}

.bar-line-3, .bar-line-6 {
    top: 7px;
}

.bar-line.out {
    right: 0;
    width: 0;
}

button.collapsed .bar-line.out {
    width: 100%;
}

.bar-line.in {
    left: 0;
    width: 100%;
}

button.collapsed .bar-line.in {
    width: 0;
}

.bar-line-1,
button.collapsed .bar-line-6 {
    -webkit-transition-delay: 0s;
    -o-transition-delay: 0s;
    transition-delay: 0s;
}

.bar-line-2,
button.collapsed .bar-line-5 {
    -webkit-transition-delay: 0.1s;
    -o-transition-delay: 0.1s;
    transition-delay: 0.1s;
}

.bar-line-3,
button.collapsed .bar-line-4 {
    -webkit-transition-delay: 0.2s;
    -o-transition-delay: 0.2s;
    transition-delay: 0.2s;
}

.bar-line-4,
button.collapsed .bar-line-3 {
    -webkit-transition-delay: 0.3s;
    -o-transition-delay: 0.3s;
    transition-delay: 0.3s;
}

.bar-line-5,
button.collapsed .bar-line-2 {
    -webkit-transition-delay: 0.4s;
    -o-transition-delay: 0.4s;
    transition-delay: 0.4s;
}

.bar-line-6,
button.collapsed .bar-line-1 {
    -webkit-transition-delay: 0.5s;
    -o-transition-delay: 0.5s;
    transition-delay: 0.5s;
}

.bars-x {
    height: 22px;
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    -ms-transform: translate(-50%, -50%) rotate(45deg);
    -o-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg);
}

    .bars-x .bar-line:first-child {
        height: 2px;
        left: 0;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
        width: 100%;
    }

button.collapsed .bars-x .bar-line:first-child {
    width: 0;
}

.bars-x .bar-line:last-child {
    bottom: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    width: 2px;
}

button.collapsed .bars-x .bar-line:last-child {
    height: 0;
}

.btn-group .btn-thick + .btn-thick,
.btn-group .btn-thick + .btn-group,
.btn-group .btn-group + .btn-thick {
    margin-left: -2px;
}

.btn-group-vertical > .btn-thick + .btn-thick,
.btn-group-vertical > .btn-thick + .btn-group,
.btn-group-vertical > .btn-group + .btn-thick {
    margin-top: -2px;
    margin-left: 0;
}

.btn-labeled {
    padding-bottom: 0;
    padding-top: 0;
}

.btn-label {
    background-color: rgba(0, 0, 0, 0.15);
    display: inline-block;
    position: relative;
    border-radius: 3px 0 0 3px;
    left: -12px;
    padding: 6px;
}

.btn-label-right {
    border-radius: 0 3px 3px 0;
    left: auto;
    right: -12px;
}

.btn-group > .btn:last-child:not(:first-child) .btn-label,
.btn-group > .dropdown-toggle:not(:first-child) .btn-label {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
}

.btn-lg .btn-label, .btn-group-lg > .btn .btn-label {
    border-radius: 5px 0 0 5px;
    left: -16px;
    padding: 10px;
}

.btn-lg .btn-label-right, .btn-group-lg > .btn .btn-label-right {
    border-radius: 0 5px 5px 0;
    left: auto;
    right: -16px;
}

.btn-sm .btn-label, .btn-group-sm > .btn .btn-label {
    border-radius: 2px 0 0 2px;
    left: -10px;
    padding: 5px;
}

.btn-sm .btn-label-right, .btn-group-sm > .btn .btn-label-right {
    border-radius: 0 2px 2px 0;
    left: auto;
    right: -10px;
}

.btn-xs .btn-label, .btn-group-xs > .btn .btn-label {
    border-radius: 2px 0 0 2px;
    left: -5px;
    padding: 1px;
}

.btn-xs .btn-label-right, .btn-group-xs > .btn .btn-label-right {
    border-radius: 0 2px 2px 0;
    left: auto;
    right: -5px;
}

.card {
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    display: block;
    margin-bottom: 10px;
    position: relative;
}

.card-title {
    margin-bottom: 5px;
    margin-top: 0;
}

.card-subtitle {
    margin-bottom: 5px;
    margin-top: -2px;
}

.card-text:last-child {
    margin-bottom: 0;
}

.card-header {
    border-bottom: 1px solid #ddd;
    padding: 10px 15px;
    position: relative;
}

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

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

    .card-header:first-child {
        border-top-right-radius: 3px;
        border-top-left-radius: 3px;
    }

.card-body {
    padding: 15px;
    position: relative;
}

.card-border {
    border: 1px solid #aaa;
}

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

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

.card-footer {
    border-top: 1px solid #ddd;
    padding: 10px 15px;
    position: relative;
}

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

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

    .card-footer:last-child {
        border-bottom-right-radius: 3px;
        border-bottom-left-radius: 3px;
    }

.card-img {
    border-radius: 3px;
}

.card-img-top {
    border-top-right-radius: 3px;
    border-top-left-radius: 3px;
}

.card-img-bottom {
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
}

.card-thumbnail {
    background-color: #fff;
    border: 3px solid #fff;
    display: inline-block;
    height: auto;
    max-width: 100%;
    position: relative;
    z-index: 15;
}

    .card-thumbnail[class*="sq-"] {
        display: block;
        margin-left: auto;
        margin-right: auto;
        margin-top: -1em;
    }

.card .table {
    margin-bottom: 0;
}

.card .list-group {
    margin-bottom: 0;
}

.custom-control {
    cursor: pointer;
    font-weight: normal;
    line-height: 14px;
    margin-bottom: 0;
    min-height: 14px;
    min-width: 14px;
    position: relative;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    vertical-align: middle;
}

    .custom-control + .custom-control {
        margin-left: 15px;
    }

.custom-control-input {
    opacity: 0;
    position: absolute;
    z-index: -1;
}

    .custom-control-input:checked ~ .custom-control-indicator,
    .custom-control-input:active ~ .custom-control-indicator {
        border: none;
    }

.custom-control-indicator {
    background-color: #fff;
    background-position: center center;
    background-repeat: no-repeat;
    border-color: #ddd;
    border-style: solid;
    border-width: 1px;
    display: block;
    height: 14px;
    left: 0;
    position: absolute;
    top: 0;
    width: 14px;
}

.custom-control-label {
    display: block;
    line-height: 14px;
    margin-left: 21px;
    -webkit-user-select: text;
    -ms-user-select: text;
    user-select: text;
}

.custom-checkbox .custom-control-indicator {
    -webkit-background-size: 75% 75%;
    background-size: 75% 75%;
    border-radius: 2px;
}

/*.custom-checkbox .custom-control-input:checked ~ .custom-control-indicator {
    background-image: url(/Content/data:image/svg xml;charset=utf-8,<svg xmlns='http:/www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 28 28' fill='#fff'><path d='M26.109 8.844q0 .625-.438 1.062L12.233 23.344q-.438.438-1.062.438t-1.062-.438l-7.781-7.781q-.438-.438-.438-1.062t.438-1.062l2.125-2.125q.438-.438 1.062-.438t1.062.438l4.594 4.609 10.25-10.266q.438-.438 1.062-.438t1.062.438l2.125 2.125q.438.437.438 1.062z'/></svg>);
}*/

.custom-radio .custom-control-indicator {
    -webkit-background-size: 60% 60%;
    background-size: 60% 60%;
    border-radius: 50%;
}

/*.custom-radio .custom-control-input:checked ~ .custom-control-indicator {
    background-image: url(/Content/data:image/svg xml;charset=utf-8,<svg xmlns='http:/www.w3.org/2000/svg' width='24' height='28' viewBox='0 0 24 28' fill='#fff'><path d='M24 14q0 3.266-1.609 6.023t-4.367 4.367-6.023 1.609-6.023-1.609-4.367-4.367T.002 14t1.609-6.023T5.978 3.61t6.023-1.609 6.023 1.609 4.367 4.367T24 14z'/></svg>);
}*/

.custom-control-default .custom-control-input:checked ~ .custom-control-indicator {
    background-color: #777;
}

.custom-control-default .custom-control-input:active ~ .custom-control-indicator {
    background-color: #b7b7b7;
}

.custom-control-primary .custom-control-input:checked ~ .custom-control-indicator {
    background-color: #d9230f;
}

.custom-control-primary .custom-control-input:active ~ .custom-control-indicator {
    background-color: #f57f72;
}

.custom-control-success .custom-control-input:checked ~ .custom-control-indicator {
    background-color: #469408;
}

.custom-control-success .custom-control-input:active ~ .custom-control-indicator {
    background-color: #82f328;
}

.custom-control-info .custom-control-input:checked ~ .custom-control-indicator {
    background-color: #029acf;
}

.custom-control-info .custom-control-input:active ~ .custom-control-indicator {
    background-color: #53d1fd;
}

.custom-control-warning .custom-control-input:checked ~ .custom-control-indicator {
    background-color: #9b479f;
}

.custom-control-warning .custom-control-input:active ~ .custom-control-indicator {
    background-color: #cd96d0;
}

.custom-control-danger .custom-control-input:checked ~ .custom-control-indicator {
    background-color: #d9831f;
}

.custom-control-danger .custom-control-input:active ~ .custom-control-indicator {
    background-color: #eec089;
}

.has-error .custom-control-indicator {
    border-color: #d9831f;
}

.custom-control .custom-control-input:disabled ~ .custom-control-indicator {
    cursor: not-allowed;
}

.custom-control .custom-control-input:disabled:checked ~ .custom-control-indicator {
    background-color: #ddd;
}

.custom-controls-stacked .custom-control {
    display: block;
}

    .custom-controls-stacked .custom-control + .custom-control {
        margin-left: 0;
        margin-top: 15px;
    }

/*.custom-select {
    -webkit-appearance: none;
    appearance: none;
    background-color: #fff;
    background-image: url(/Content/data:image/svg xml;charset=utf-8,<svg xmlns='http:/www.w3.org/2000/svg' width='16' height='28' viewBox='0 0 16 28' fill='#777'><path d='M16 17q0 .406-.297.703l-7 7Q8.406 25 8 25t-.703-.297l-7-7Q0 17.406 0 17t.297-.703T1 16h14q.406 0 .703.297T16 17zm0-6q0 .406-.297.703T15 12H1q-.406 0-.703-.297T0 11t.297-.703l7-7Q7.594 3 8 3t.703.297l7 7Q16 10.594 16 11z'/></svg>);
    background-position: right 8px center;
    background-repeat: no-repeat;
    -webkit-background-size: 8px 16px;
    background-size: 8px 16px;
    border: 1px solid #ddd;
    color: #777;
    display: block;
    -webkit-transition: border-color 0.15s ease-in-out;
    -o-transition: border-color 0.15s ease-in-out;
    transition: border-color 0.15s ease-in-out;
    vertical-align: middle;
    width: 100%;
    border-radius: 4px;
    font-size: 13px;
    height: 34px;
    line-height: 1.538462;
    padding: 6px 24px 6px 12px;
    padding-right: 12px \9;
    background-image: none \9;
}

    .custom-select:focus {
        border-color: #66afe9;
        outline: 0;
    }

    .custom-select::-ms-expand {
        opacity: 0;
    }

.custom-select-sm {
    border-radius: 3px;
    font-size: 12px;
    height: 30px;
    line-height: 1.5;
    padding: 5px 24px 5px 10px;
    padding-right: 10px \9;
}

.custom-select-lg {
    border-radius: 6px;
    font-size: 18px;
    height: 46px;
    line-height: 1.333333;
    padding: 10px 24px 10px 16px;
    padding-right: 16px \9;
}

.has-error .custom-select {
    border-color: #ac6819;
}

.has-warning .custom-select {
    border-color: #79377c;
}

.has-success .custom-select {
    border-color: #2f6405;
}*/

.divider {
    display: block;
    margin: 20px 0;
    overflow: hidden;
    text-align: center;
}

.divider-content {
    display: inline-block;
    padding: 0 15px;
    position: relative;
}

    .divider-content:before, .divider-content:after {
        background-color: #2F96B4;
        content: "";
        display: block;
        height: 1px;
        margin-top: -1px;
        position: absolute;
        top: 50%;
        width: 100vw;
    }

    .divider-content:before {
        right: 100%;
    }

    .divider-content:after {
        left: 100%;
    }

@media (min-width: 768px) {
    .divider-vertical {
        height: 100%;
        left: 50%;
        margin: 0;
        position: absolute;
        top: 0;
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        -o-transform: translateX(-50%);
        transform: translateX(-50%);
        z-index: 2;
    }

        .divider-vertical .divider-content {
            padding: 5px 0;
            top: 50%;
            -webkit-transform: translateY(-50%);
            -ms-transform: translateY(-50%);
            -o-transform: translateY(-50%);
            transform: translateY(-50%);
        }

            .divider-vertical .divider-content:before, .divider-vertical .divider-content:after {
                height: 600px;
                left: 50%;
                margin-left: -1px;
                margin-top: 0;
                right: auto;
                width: 1px;
            }

            .divider-vertical .divider-content:before {
                bottom: 100%;
                top: auto;
            }

            .divider-vertical .divider-content:after {
                bottom: auto;
                top: 100%;
            }
}

.dropdown-menu {
    -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.25);
}

    .dropdown-menu .divider {
        margin: 5px 2px;
    }

    .dropdown-menu > li > a {
        padding: 5px 15px;
    }

    .dropdown-menu:before,
    .dropdown-menu:after {
        border-color: transparent;
        border-style: solid;
        border-width: 8px;
        content: " ";
        height: 0;
        left: 15px;
        pointer-events: none;
        position: absolute;
        width: 0;
    }

.dropdown:not(.dropup) .dropdown-menu:before {
    border-bottom-color: #ddd;
    bottom: 100%;
}

.dropdown:not(.dropup) .dropdown-menu:after {
    border-bottom-color: #fff;
    bottom: 100%;
    margin-bottom: -1px;
}

.dropup:not(.dropdown) .dropdown-menu:before {
    border-top-color: #ddd;
    top: 100%;
}

.dropup:not(.dropdown) .dropdown-menu:after {
    border-top-color: #fff;
    margin-top: -1px;
    top: 100%;
}

.dropdown-menu-right:before,
.dropdown-menu-right:after {
    left: auto;
    right: 8px;
}

.ellipsis {
    background-color: #fff;
    border-radius: 50%;
    height: 32px;
    left: 50%;
    position: absolute;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-transition: all 0.2s ease-in-out 0.2s;
    -o-transition: all 0.2s ease-in-out 0.2s;
    transition: all 0.2s ease-in-out 0.2s;
    width: 32px;
}

    .ellipsis:before, .ellipsis:after {
        background-color: inherit;
        border-radius: 50%;
        content: "";
        height: 100%;
        left: 0;
        position: absolute;
        top: 0;
        -webkit-transition: all 0.2s ease-in-out 0s;
        -o-transition: all 0.2s ease-in-out 0s;
        transition: all 0.2s ease-in-out 0s;
        width: 100%;
    }

.ellipsis-object {
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border-radius: 50%;
    display: block;
    height: 32px;
    line-height: 32px;
    opacity: 1;
    position: relative;
    text-align: center;
    -webkit-transition: all 0.2s ease-in-out 0.4s;
    -o-transition: all 0.2s ease-in-out 0.4s;
    transition: all 0.2s ease-in-out 0.4s;
    width: 32px;
    z-index: 3;
}

.ellipsis-object-large {
    height: 64px;
    width: 64px;
    line-height: 64px;
}

button.collapsed .ellipsis {
    height: 4px;
    width: 4px;
}

    button.collapsed .ellipsis:before, button.collapsed .ellipsis:after {
        -webkit-transition-delay: 0.4s;
        -o-transition-delay: 0.4s;
        transition-delay: 0.4s;
    }

button.collapsed .ellipsis-horizontal:before {
    left: -8px;
}

button.collapsed .ellipsis-horizontal:after {
    left: 8px;
}

button.collapsed .ellipsis-vertical:before {
    top: -8px;
}

button.collapsed .ellipsis-vertical:after {
    top: 8px;
}

button.collapsed .ellipsis-object {
    opacity: 0;
    -webkit-transition-delay: 0s;
    -o-transition-delay: 0s;
    transition-delay: 0s;
}

/*.file {
    display: block;
    float: left;
    margin-bottom: 10px;
    padding-left: 5px;
    padding-right: 5px;
    position: relative;
    width: 25%;
}

    .file[class*="sq-"] {
        height: auto;
    }

.file-thumbnail {
    background-color: #efefef;
    background-position: center;
    background-repeat: no-repeat;
    -webkit-background-size: cover;
    background-size: cover;
    border-radius: 3px;
    color: #777;
    display: block;
    padding-bottom: 100%;
    position: relative;
    width: 100%;
}

.file-info {
    display: block;
    font-size: 12px;
    height: 20px;
    line-height: 20px;
    width: 100%;
}

.file-name {
    display: block;
    overflow: hidden;
    text-align: right;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.file-ext {
    display: block;
    float: right;
}

.file-link {
    color: inherit;
    display: block;
}

    .file-link:hover, .file-link:focus {
        text-decoration: none;
    }

.file-delete-btn {
    background-color: rgba(0, 0, 0, 0.4);
    background-image: none;
    border: none;
    border-radius: 0 3px 0 3px;
    color: #fff;
    cursor: pointer;
    display: block;
    font-size: 12px;
    height: 18px;
    line-height: 18px;
    padding: 0;
    position: absolute;
    right: 5px;
    text-align: center;
    top: 0;
    width: 18px;
}

    .file-delete-btn:hover, .file-delete-btn:focus {
        background-color: #d9230f;
    }

.file-list {
    list-style: none;
    margin-bottom: 0;
    margin-left: -5px;
    margin-right: -5px;
    padding-left: 0;
}

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

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

.file-upload-btn {
    display: inline-block;
    overflow: hidden;
    position: relative;
}

.file-upload-input {
    bottom: 0;
    cursor: inherit;
    font-size: 1000px;
    margin: 0;
    opacity: 0;
    padding: 0;
    position: absolute;
    right: 0;
}

.file-thumbnail-doc {
    background-color: #029acf;
    background-image: url(/Content/data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http:/www.w3.org/2000/svg' viewBox='0 0 32 32' fill='%23fff'%3E%3Cpath d='M20 10.9h1.4L19.8 18 17.7 8h-3.3L12 17.9 10.2 8H6.7l3.5 16h3.4l2.4-9.5 2.1 9.5h3.1l4.1-16H20v2.9z'/%3E%3C/svg%3E);
    -webkit-background-size: 50% 50%;
    background-size: 50% 50%;
}

.file-thumbnail-xls {
    background-color: #469408;
    background-image: url(/Content/data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http:/www.w3.org/2000/svg' viewBox='0 0 32 32' fill='%23fff'%3E%3Cpath d='M23.2 8H19l-3 4.4L13 8H8.8l5.1 7.6L8.1 24H16v-2.9h-1.6l1.6-2.3 3.5 5.2h4.4l-5.7-8.4 5-7.6z'/%3E%3C/svg%3E);
    -webkit-background-size: 50% 50%;
    background-size: 50% 50%;
}

.file-thumbnail-pdf {
    background-color: #d9831f;
    background-image: url(/Content/data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http:/www.w3.org/2000/svg' viewBox='0 0 32 32' fill='%23fff'%3E%3Cpath d='M26.3 18.4c-.4-.4-1.4-.6-2.8-.7-1 0-2.1.1-3.4.2-.6-.3-1.1-.7-1.6-1.1-1.2-1.1-2.2-2.7-2.8-4.4 0-.2.1-.3.1-.4 0 0 .7-3.8.5-5.1 0-.2 0-.2-.1-.4l-.1-.2c-.1-.3-.5-.8-1-.7h-.3c-.6 0-1.1.3-1.3.8-.4 1.5 0 3.8.8 6.7l-.3.5c-.6 1.3-1.2 2.7-1.8 3.9l-.1.2c-.6 1.3-1.2 2.3-1.7 3.2l-.5.3-1.2.6c-1.9 1.1-3.1 2.4-3.3 3.4-.1.3 0 .7.3.9l.5.3c.2.1.5.2.7.2 1.3 0 2.9-1.6 5-5.3 2.4-.8 5.2-1.5 7.6-1.8 1.9 1 4.1 1.8 5.6 1.8.3 0 .5 0 .7-.1.3-.1.5-.2.6-.4.3-.4.3-1 .3-1.6-.1-.4-.2-.6-.4-.8zm-19.7 7c.2-.7 1.2-2 2.6-3.1l.5-.5c-1.4 2.4-2.4 3.3-3.1 3.6zM15 6.2c.4 0 .7 1.1.7 2.1s-.2 1.7-.5 2.2c-.2-.8-.4-2-.4-2.8 0 .1 0-1.5.2-1.5zm-2.5 13.7c.3-.5.6-1.1.9-1.7.8-1.4 1.2-2.6 1.6-3.5.7 1.3 1.6 2.4 2.7 3.3.1.1.3.2.4.3-2.2.5-4 1-5.6 1.6zm13.4-.1c-.1.1-.5.1-.7.1-.8 0-1.7-.4-3.1-.9.5 0 1-.1 1.4-.1.8 0 1 0 1.8.2s.7.6.6.7z'/%3E%3C/svg%3E);
    -webkit-background-size: 50% 50%;
    background-size: 50% 50%;
}

.file-thumbnail-zip {
    background-color: #9b479f;
    background-image: url(/Content/data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http:/www.w3.org/2000/svg' viewBox='0 0 32 32' fill='%23fff'%3E%3Cpath d='M12 3h4v2h-4V3zm4 2h4v2h-4V5zm-4 2h4v2h-4V7zm4 2h4v2h-4V9zm-4 2h4v2h-4v-2zm4 2h4v2h-4v-2zm-4 2h4v2h-4v-2zm4 2h4v2h-4v-2zm-4 10.5c0 .8.7 1.5 1.5 1.5h5c.8 0 1.5-.7 1.5-1.5v-5c0-.8-.7-1.5-1.5-1.5H16v-2h-4v8.5zm6-2.5v2h-4v-2h4z'/%3E%3C/svg%3E);
    -webkit-background-size: 50% 50%;
    background-size: 50% 50%;
}

.file-thumbnail-att {
    background-color: #474949;
    background-image: url(/Content/data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http:/www.w3.org/2000/svg' viewBox='0 0 32 32' fill='%23fff'%3E%3Cpath d='M19.4 11.7l-1.5-1.5-7.6 7.6C9 19 9 21.1 10.2 22.3c1.3 1.3 3.3 1.3 4.6 0l9.1-9.1c2.1-2.1 2.1-5.5 0-7.6-2.1-2.1-5.5-2.1-7.6 0l-9.6 9.6c-2.9 2.9-2.9 7.7 0 10.6 2.9 2.9 7.7 2.9 10.6 0l6.5-6.5-1.5-1.5-6.5 6.5c-2.1 2.1-5.5 2.1-7.6 0-2.1-2.1-2.1-5.5 0-7.6l9.6-9.6c1.3-1.3 3.3-1.3 4.6 0 1.3 1.3 1.3 3.3 0 4.6l-9.1 9.1c-.4.4-1.1.4-1.5 0-.4-.4-.4-1.1 0-1.5l7.6-7.6z'/%3E%3C/svg%3E);
    -webkit-background-size: 50% 50%;
    background-size: 50% 50%;
}

@media (min-width: 768px) {
    .file {
        width: 16.666667%;
    }
}

@media (min-width: 992px) {
    .file {
        width: 12.5%;
    }
}

@media (min-width: 1200px) {
    .file {
        width: 10%;
    }
}*/

.label {
    border: 1px solid transparent;
    display: inline-block;
    font-size: 85%;
    font-weight: 600;
    padding: 0.3em 0.6em;
    position: relative;
}

.label-pill {
    border-radius: 10em;
    padding-left: 1.25em;
    padding-right: 1.25em;
}

.label-remove-btn {
    background-color: transparent;
    background-image: none;
    border: none;
    cursor: pointer;
    display: inline-block;
    line-height: 1;
    margin-left: 5px;
    opacity: 0.5;
    padding: 0;
}

    .label-remove-btn:hover, .label-remove-btn:focus {
        opacity: 1;
    }

.label-outline-default {
    background-color: transparent;
    border-color: #474949;
    color: #474949;
}

    .label-outline-default[href]:hover, .label-outline-default[href]:focus {
        background-color: #474949;
        color: #fff;
    }

.label-outline-primary {
    background-color: transparent;
    border-color: #d9230f;
    color: #d9230f;
}

    .label-outline-primary[href]:hover, .label-outline-primary[href]:focus {
        background-color: #d9230f;
        color: #fff;
    }

.label-outline-success {
    background-color: transparent;
    border-color: #469408;
    color: #469408;
}

    .label-outline-success[href]:hover, .label-outline-success[href]:focus {
        background-color: #469408;
        color: #fff;
    }

.label-outline-info {
    background-color: transparent;
    border-color: #029acf;
    color: #029acf;
}

    .label-outline-info[href]:hover, .label-outline-info[href]:focus {
        background-color: #029acf;
        color: #fff;
    }

.label-outline-warning {
    background-color: transparent;
    border-color: #9b479f;
    color: #9b479f;
}

    .label-outline-warning[href]:hover, .label-outline-warning[href]:focus {
        background-color: #9b479f;
        color: #fff;
    }

.label-outline-danger {
    background-color: transparent;
    border-color: #d9831f;
    color: #d9831f;
}

    .label-outline-danger[href]:hover, .label-outline-danger[href]:focus {
        background-color: #d9831f;
        color: #fff;
    }

.layout {
    height: 100%;
    margin: 0;
    max-height: 100%;
    overflow-x: hidden;
    /*padding-top: 50px;*/
    width: 100%;
}

.layout-header {
    /*background-color: #fff;
  -webkit-box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.5);
          box-shadow: 0 2px 2px -2px rgba(0, 0, 0, 0.5);*/
    left: 0;
    min-height: 50px;
    /*position: absolute;*/
    top: 0;
    width: 100%;
    z-index: 9000;
    padding-right: 0 !important;
}

@media (min-width: 768px) {
    .layout-header {
        z-index: 1049;
    }
}

/*@media (min-width: 768px) {*/
.layout-header-fixed .layout-header {
    position: fixed;
}
/*}*/


.layout-main {
    height: auto;
    min-height: 100%; /* Fallback for browsers do NOT support vh unit */
    min-height: 100vh;
    position: relative;
    width: 100%;
}

@media (min-width: 768px) {
    .layout-main {
        padding-top: 95px;
    }
}

.layout-sidebar {
    background-color: #222;
    color: #a6a6a6;
    padding-top: 50px;
}

@media (min-width: 768px) {
    .layout-sidebar {
        display: block;
        float: left;
        position: relative;
        -webkit-transition: width 0.3s;
        -o-transition: width 0.3s;
        transition: width 0.3s;
        width: 220px;
        z-index: 1000;
        overflow-y: visible; /* SPW-1402 Changed from auto because apples and androids were hiding the menu background when scrolling off the bottom edge of the screen */
        min-height: 100vh;
    }
}

@media (min-width: 768px) {
    .layout-sidebar-fixed .layout-sidebar {
        bottom: 0;
        left: 0;
        position: fixed;
        top: 50px;
    }

    .layout-sidebar-collapsed .layout-sidebar {
        width: 0px;
    }
}

@media (min-width: 768px) {
    .layout-sidebar-backdrop {
        background-color: #191919;
        display: block;
        height: 100%;
        left: 0;
        max-height: 100%;
        position: fixed;
        top: 0;
        -webkit-transition: width 0.3s;
        -o-transition: width 0.3s;
        transition: width 0.3s;
        width: 220px;
        z-index: -1;
    }
}

@media (min-width: 768px) {
    .layout-sidebar-fixed .layout-sidebar-backdrop {
        display: none;
        position: static;
    }

    .layout-sidebar-collapsed .layout-sidebar-backdrop {
        width: 0px;
    }
}

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

.layout-content:after {
    clear: both;
}

@media (min-width: 768px) {
    .layout-content {
        margin-left: 220px;
        -webkit-transition: margin-left 0.3s;
        -o-transition: margin-left 0.3s;
        transition: margin-left 0.3s;
    }
}

@media (min-width: 768px) {
    .layout-sidebar-collapsed .layout-content {
        margin-left: 0px;
    }
}

.layout-footer {
    background-color: #f3f3f3;
    border-top: 1px solid #eaeaea;
    bottom: 0;
    color: #777;
    left: 0;
    position: absolute;
    right: 0;
}

@media (min-width: 768px) {
    .layout-footer {
        margin-left: 220px;
        -webkit-transition: margin-left 0.3s;
        -o-transition: margin-left 0.3s;
        transition: margin-left 0.3s;
    }
}

@media (min-width: 768px) {
    .layout-footer-fixed .layout-footer {
        position: fixed;
    }

    .layout-sidebar-collapsed .layout-footer {
        margin-left: 0px;
    }
}

.list-group-divided .list-group-item {
    background-color: transparent;
    border-width: 1px 0;
}

    .list-group-divided .list-group-item:first-child {
        border-top-right-radius: 0;
        border-top-left-radius: 0;
        border-top: none;
    }

    .list-group-divided .list-group-item:last-child {
        border-bottom-right-radius: 0;
        border-bottom-left-radius: 0;
        border-bottom: none;
    }

/*.md-form-control {
    background-color: transparent;
    background-image: none;
    border-color: #ddd;
    border-radius: 0;
    border-style: solid;
    border-width: 0 0 1px;
    color: #777;
    display: block;
    font-size: 16px;
    line-height: 20px;
    padding: 4px 0;
    width: 100%;
}

    .md-form-control:focus {
        outline: 0;
    }

    .md-form-control::-moz-placeholder {
        color: #777;
        opacity: 1;
    }

    .md-form-control:-ms-input-placeholder {
        color: #777;
    }

    .md-form-control::-webkit-input-placeholder {
        color: #777;
    }

    .md-form-control[type="number"] {
        -moz-appearance: textfield;
    }

        .md-form-control[type="number"]::-webkit-inner-spin-button, .md-form-control[type="number"]::-webkit-outer-spin-button {
            -webkit-appearance: none;
            margin: 0;
        }

fieldset[disabled] .md-form-group .md-form-control,
.md-form-group.is-disabled .md-form-control {
    background-color: transparent;
    border-bottom: 1px dotted #ddd;
    color: #ddd;
    cursor: not-allowed;
}

.md-control-label {
    bottom: 0;
    color: #777;
    display: block;
    font-size: 16px;
    font-weight: normal;
    left: 0;
    line-height: 20px;
    margin-bottom: 0;
    overflow: hidden;
    pointer-events: none;
    position: absolute;
    top: 24px;
    white-space: nowrap;
    width: 100%;
}

    .md-control-label:after {
        background-color: #d9230f;
        bottom: 20px;
        content: '';
        height: 2px;
        left: 45%;
        position: absolute;
        -webkit-transition-duration: 0.2s;
        -o-transition-duration: 0.2s;
        transition-duration: 0.2s;
        -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        -o-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
        visibility: hidden;
        width: 10px;
    }

.md-form-group.is-focused .md-control-label {
    color: #d9230f;
}

    .md-form-group.is-focused .md-control-label:after {
        left: 0;
        visibility: visible;
        width: 100%;
    }

.md-label-static .md-control-label {
    font-size: 12px;
    top: 4px;
    visibility: visible;
}

.md-label-floating .md-control-label {
    -webkit-transition-duration: 0.2s;
    -o-transition-duration: 0.2s;
    transition-duration: 0.2s;
    -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    -o-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.md-label-floating.is-focused .md-control-label,
.md-label-floating.has-value .md-control-label {
    font-size: 12px;
    top: 4px;
    visibility: visible;
}

.md-form-group {
    margin-bottom: 20px;
    padding: 20px 0;
    position: relative;
}

    .md-form-group .md-form-group {
        margin-bottom: -20px;
        margin-top: -20px;
    }

select.md-form-control {
    -webkit-appearance: none;
    appearance: none;
    background-image: url(/Content/data:image/svg xml;charset=utf-8,<svg xmlns='http:/www.w3.org/2000/svg' width='18' height='32' viewBox='0 0 18 32' fill='#777'><path d='M18.286 12.571q0 .464-.339.804l-8 8q-.339.339-.804.339t-.804-.339l-8-8Q0 13.036 0 12.571t.339-.804.804-.339h16q.464 0 .804.339t.339.804z'/></svg>);
    background-position: right center;
    background-repeat: no-repeat;
    -webkit-background-size: 8px 16px;
    background-size: 8px 16px;
}

    select.md-form-control option {
        background-color: #fff;
        color: #777;
    }

.md-form-group-lg .md-form-control,
.md-form-group-lg .md-control-label {
    font-size: 18px;
    line-height: 1.333333;
}

.md-form-group-sm .md-form-control,
.md-form-group-sm .md-control-label {
    font-size: 12px;
    line-height: 1.5;
}

.md-form-group.has-success .md-form-control {
    border-color: #469408;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.md-form-group.has-success .md-control-label,
.md-form-group.has-success .md-help-block {
    color: #469408;
}

    .md-form-group.has-success .md-control-label:after {
        background-color: #469408;
    }

.md-form-group.has-warning .md-form-control {
    border-color: #9b479f;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.md-form-group.has-warning .md-control-label,
.md-form-group.has-warning .md-help-block {
    color: #9b479f;
}

    .md-form-group.has-warning .md-control-label:after {
        background-color: #9b479f;
    }

.md-form-group.has-error .md-form-control {
    border-color: #d9831f;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.md-form-group.has-error .md-control-label,
.md-form-group.has-error .md-help-block {
    color: #d9831f;
}

    .md-form-group.has-error .md-control-label:after {
        background-color: #d9831f;
    }

.md-help-block {
    display: block;
    margin-top: 3px;
    position: absolute;
    visibility: visible;
    width: 100%;
}*/

.navbar-header {
    min-height: 50px;
    position: relative;
}

.navbar-brand-logo {
    height: 20px;
    width: auto;
}

.navbar-toggler {
    background-color: transparent;
    background-image: none;
    border: none;
    display: block;
    float: left;
    height: 50px;
    line-height: 50px;
    outline: none;
    overflow: hidden;
    padding: 0;
    position: relative;
    width: 50px;
}

    .navbar-toggler + .navbar-toggler {
        float: right;
    }

/*@media (max-width: 767px) {
    .navbar-nav .open .dropdown-menu:before,
    .navbar-nav .open .dropdown-menu:after {
        content: normal;
        display: none;
    }
}*/

/*@media (max-width: 767px) {
    .navbar-default .list-group .list-group-item {
        background-color: transparent;
        border-color: #f6f6f6;
        color: #777;
    }

        .navbar-default .list-group .list-group-item:hover, .navbar-default .list-group .list-group-item:focus {
            background-color: #fff;
            color: #d9230f;
        }

        .navbar-default .list-group .list-group-item.active, .navbar-default .list-group .list-group-item.active:hover, .navbar-default .list-group .list-group-item.active:focus {
            background-color: #ddd;
            color: #222;
        }

        .navbar-default .list-group .list-group-item.disabled, .navbar-default .list-group .list-group-item.disabled:hover, .navbar-default .list-group .list-group-item.disabled:focus {
            background-color: transparent;
            color: #ccc;
        }
}

@media (max-width: 767px) {
    .navbar-inverse .list-group .list-group-item {
        background-color: transparent;
        border-color: #c8200e;
        color: #fff;
    }

        .navbar-inverse .list-group .list-group-item:hover, .navbar-inverse .list-group .list-group-item:focus {
            background-color: #ea2610;
            color: #fff;
        }

        .navbar-inverse .list-group .list-group-item.active, .navbar-inverse .list-group .list-group-item.active:hover, .navbar-inverse .list-group .list-group-item.active:focus {
            background-color: #ea2610;
            color: #fff;
        }

        .navbar-inverse .list-group .list-group-item.disabled, .navbar-inverse .list-group .list-group-item.disabled:hover, .navbar-inverse .list-group .list-group-item.disabled:focus {
            background-color: transparent;
            color: #ccc;
        }
}*/

.overlay {
    display: block;
    overflow: hidden;
    position: relative;
}

.overlay-title {
    margin-bottom: 0;
    margin-top: 0;
}

.overlay-content {
    bottom: 0;
    color: #fff;
    display: block;
    left: 0;
    overflow: hidden;
    padding: 15px;
    position: absolute;
    right: 0;
    top: 0;
}

.overlay-hover .overlay-content {
    opacity: 0;
    -webkit-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    -o-transition-property: opacity, -o-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform, -o-transform;
    -webkit-transition-timing-function: ease-out;
    -o-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}

.overlay-hover:hover .overlay-content {
    opacity: 1;
}

.overlay-top {
    bottom: auto;
}

.overlay-right {
    left: auto;
}

.overlay-bottom {
    top: auto;
}

.overlay-left {
    right: auto;
}

.overlay-gradient:before {
    background-color: #777;
    background-image: none;
    border-radius: inherit;
    bottom: 0;
    content: "";
    display: block;
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    -webkit-transition: opacity 0.3s;
    -o-transition: opacity 0.3s;
    transition: opacity 0.3s;
    width: 100%;
}

.overlay-gradient:after {
    background-color: transparent;
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, rgba(34, 34, 34, 0)), to(rgba(34, 34, 34, 0.75)));
    background-image: -webkit-linear-gradient(top, rgba(34, 34, 34, 0) 0, rgba(34, 34, 34, 0.75) 100%);
    background-image: -o-linear-gradient(top, rgba(34, 34, 34, 0) 0, rgba(34, 34, 34, 0.75) 100%);
    background-image: linear-gradient(to bottom, rgba(34, 34, 34, 0) 0, rgba(34, 34, 34, 0.75) 100%);
    border-radius: inherit;
    bottom: 0;
    content: "";
    display: block;
    height: 50%;
    left: 0;
    position: absolute;
    width: 100%;
}

.overlay-hover:hover .overlay-gradient:before {
    opacity: 0.35;
}

.overlay-slide-up {
    -webkit-transform: translateY(100%);
    -ms-transform: translateY(100%);
    -o-transform: translateY(100%);
    transform: translateY(100%);
}

.overlay-hover:hover .overlay-slide-up {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
}

.overlay-slide-down {
    -webkit-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    -o-transform: translateY(-100%);
    transform: translateY(-100%);
}

.overlay-hover:hover .overlay-slide-down {
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
}

.overlay-slide-left {
    -webkit-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    -o-transform: translateX(-100%);
    transform: translateX(-100%);
}

.overlay-hover:hover .overlay-slide-left {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
}

.overlay-slide-right {
    -webkit-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -o-transform: translateX(100%);
    transform: translateX(100%);
}

.overlay-hover:hover .overlay-slide-right {
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
}

.pricing-card {
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
    display: block;
    margin-bottom: 10px;
    position: relative;
    text-align: center;
}

.pricing-card-header {
    border-bottom: 1px solid #ddd;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    padding: 10px 15px;
}

.pricing-card-body {
    padding: 15px;
    position: relative;
}

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

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

.pricing-card-footer {
    border-top: 1px solid #ddd;
    padding: 10px 15px;
}

.pricing-card-price {
    display: inline-block;
    line-height: 1;
    margin-bottom: 0;
    margin-top: 0;
    position: relative;
}

.pricing-card-currency {
    font-size: 65%;
    position: relative;
    top: -0.35em;
}

.pricing-card-decimal {
    font-size: 65%;
    position: relative;
    top: -0.35em;
}

.pricing-card-unit {
    font-size: 65%;
}

.pricing-card-details {
    list-style: none;
    margin-bottom: 10px;
    margin-top: 10px;
    padding-left: 0;
}

    .pricing-card-details > li {
        border-top: 1px dotted #ddd;
        padding-bottom: 5px;
        padding-top: 5px;
    }

        .pricing-card-details > li:first-child {
            border-top: 0;
        }

.pricing-card-recommended {
    background-color: #fff;
    border-color: #d9230f;
    border-width: 3px;
    color: #222;
    z-index: 15;
}

@media (min-width: 768px) {
    .pricing-card-recommended {
        margin: -15px -15px 0;
        padding: 15px;
    }
}

@-webkit-keyframes progress-bar-indicating {
    0% {
        opacity: 0.5;
        width: 0;
    }

    90% {
    }

    100% {
        opacity: 0;
        width: 100%;
    }
}

@-o-keyframes progress-bar-indicating {
    0% {
        opacity: 0.5;
        width: 0;
    }

    90% {
    }

    100% {
        opacity: 0;
        width: 100%;
    }
}

@keyframes progress-bar-indicating {
    0% {
        opacity: 0.5;
        width: 0;
    }

    90% {
    }

    100% {
        opacity: 0;
        width: 100%;
    }
}

.progress {
    -webkit-box-shadow: none;
    box-shadow: none;
    height: 20px;
}

.progress-bar {
    border-radius: 4px;
    -webkit-box-shadow: none;
    box-shadow: none;
    line-height: 20px;
    position: relative;
}

.progress-value {
    float: right;
    margin-right: 5px;
}

.progress-bar-indicating:after {
    -webkit-animation: progress-bar-indicating 3s infinite;
    -o-animation: progress-bar-indicating 3s infinite;
    animation: progress-bar-indicating 3s infinite;
    background-color: #fff;
    border-radius: 4px;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 100%;
}

.progress-lg {
    height: 20px;
}

    .progress-lg .progress-bar {
        line-height: 20px;
    }

.progress-sm {
    height: 10px;
}

    .progress-sm .progress-bar {
        line-height: 10px;
    }

.progress-xs {
    height: 5px;
}

    .progress-xs .progress-bar {
        line-height: 5px;
    }

.sidenav {
    list-style: none;
    margin-bottom: 0;
    padding-left: 0;
}

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

    .sidenav:after {
        clear: both;
    }

    .sidenav > li {
        display: block;
        position: relative;
    }

        .sidenav > li > a {
            color: #a6a6a6;
            background-color: #323232;
            font-weight: bold;
            display: block;
            font-size: 15px;
            line-height: 18px;
            padding: 10px 15px;
            position: relative;
            text-decoration: none;
            -webkit-transition: all 0.3s;
            -o-transition: all 0.3s;
            transition: all 0.3s;
        }

        .sidenav > li.has-subnav > a:before {
            content: "\f0da";
            float: right;
            font-family: FontAwesome;
            height: 18px;
            line-height: 18px;
            margin-left: 5px;
            text-align: right;
            -webkit-transform: none;
            -ms-transform: none;
            -o-transform: none;
            transform: none;
            -webkit-transition: -webkit-transform 0.3s;
            transition: -webkit-transform 0.3s;
            -o-transition: -o-transform 0.3s;
            transition: transform 0.3s;
            transition: transform 0.3s, -webkit-transform 0.3s, -o-transform 0.3s;
            width: 18px;
        }

        .sidenav > li:hover > a,
        .sidenav > li.hover > a {
            /*background-color: #191919;*/
            color: #fff;
        }
        /*.sidenav > li.open > a {
  background-color: #191919;
  color: #a6a6a6;
}*/
        .sidenav > li.open > a:before {
            -webkit-transform: rotate(90deg);
            -ms-transform: rotate(90deg);
            -o-transform: rotate(90deg);
            transform: rotate(90deg);
        }

        .sidenav > li.active > a {
            color: #fff;
        }

            .sidenav > li.active > a:after {
                border-color: transparent #fcfcfc transparent transparent;
                border-style: solid;
                border-width: 6px;
                content: "";
                height: 0;
                pointer-events: none;
                position: absolute;
                right: 0;
                top: 50%;
                -webkit-transform: translateY(-50%);
                -ms-transform: translateY(-50%);
                -o-transform: translateY(-50%);
                transform: translateY(-50%);
                width: 0;
            }

    .sidenav .badge {
        float: right;
    }

.sidenav-heading {
    color: #777;
    font-size: 12px;
    font-weight: 500;
    line-height: 1;
    margin-bottom: 0;
    margin-top: 15px;
    overflow: hidden;
    padding: 10px 15px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sidenav-icon {
    display: block;
    float: left;
    font-size: 18px;
    height: 18px;
    line-height: 18px;
    margin-right: 10px;
    text-align: center;
    width: 18px;
}

    .sidenav-icon img {
        height: 14px;
        width: 14px;
    }

.sidenav-label {
    display: inline;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sidenav2-icon {
    display: block;
    float: left;
    font-size: 18px;
    height: 18px;
    line-height: 18px;
    margin-left: 20px;
    margin-right: 10px;
    text-align: center;
    width: 18px;
}

.sidenav-level1 {
}

.sidenav-form {
    padding: 15px;
    position: relative;
}

    .sidenav-form .form-control {
        background-color: #2b2b2b;
        border: 1px solid #343434;
        color: #a6a6a6;
    }

.sidenav-subnav {
    list-style: none;
    margin-bottom: 0;
    padding-left: 0;
}

    .sidenav-subnav:before, .sidenav-subnav:after {
        content: " ";
        display: table;
    }

    .sidenav-subnav:after {
        clear: both;
    }

    .sidenav-subnav > li > a {
        background-color: #191919;
        color: #a6a6a6;
        display: block;
        font-size: 15px;
        line-height: 18px;
        padding: 8px 15px 8px 15px;
        position: relative;
        text-decoration: none;
    }

    .sidenav-subnav > li:hover > a,
    .sidenav-subnav > li.hover > a {
        color: #fff;
    }

    .sidenav-subnav > li.open > a {
        color: #fff;
    }

    .sidenav-subnav > li.active > a {
        color: #fff;
        /*cursor: default;*/
    }

.sidenav-level1 {
    display: none;
}

@media (min-width: 768px) {
    .sidenav-collapsed > li > a {
        height: 45px;
        line-height: 45px;
        padding: 0;
    }

    .sidenav-collapsed > li.has-subnav > a:before {
        content: normal;
        display: none;
    }

    .sidenav-collapsed > li:hover > a:after,
    .sidenav-collapsed > li.hover > a:after {
        content: normal;
        display: none;
    }

    .sidenav-collapsed .sidenav-heading {
        margin: 0;
        padding: 0;
        visibility: hidden;
    }

    .sidenav-collapsed .sidenav-icon .sidenav2-icon {
        float: none;
        font-size: 18px;
        height: 45px;
        left: 0;
        line-height: 45px;
        margin-left: 0;
        position: absolute;
        top: 0;
        -webkit-transition: font-size 0.3s;
        -o-transition: font-size 0.3s;
        transition: font-size 0.3s;
        width: 100%;
    }

    .sidenav-collapsed .sidenav-label,
    .sidenav-collapsed .sidenav-level1,
    .sidenav-collapsed .badge {
        display: none;
    }

    .sidenav-collapsed .sidenav-badge {
        display: block;
        position: absolute;
        right: 5px;
        top: 5px;
    }

    .sidenav-collapsed .sidenav-subnav {
        background-color: black;
        display: none !important;
        height: auto !important;
        left: 100%;
        min-width: 160px;
        overflow: visible !important;
        position: absolute;
        top: 0;
        z-index: 1030;
    }

    .sidenav-collapsed > .has-subnav:hover > .sidenav-subnav,
    .sidenav-collapsed > .has-subnav.hover > .sidenav-subnav {
        display: block !important;
    }

    .sidenav-collapsed .sidenav-subnav > li > a {
        border-left: 1px solid #343434;
        padding-left: 15px;
        padding-right: 15px;
        white-space: nowrap;
    }

    .sidenav-collapsed .sidenav-level1 {
        background-color: #191919;
        color: #a6a6a6;
        cursor: default;
        display: block;
        font-size: 13px;
        line-height: 45px;
        overflow: hidden;
        padding: 0 15px;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .sidenav-collapsed .active .sidenav-level1 {
        color: #fff;
    }

    .sidenav-collapsed .sidenav-form {
        display: none;
    }
}

@-webkit-keyframes spinner-animation {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-o-keyframes spinner-animation {
    from {
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes spinner-animation {
    from {
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.spinner:before, .spinner:after {
    border-color: rgba(0, 0, 0, 0.1);
    border-radius: 50%;
    border-style: solid;
    content: "";
    left: 50%;
    position: absolute;
    top: 50%;
    border-width: 2px;
    height: 24px;
    margin: -12px 0 0 -12px;
    width: 24px;
}

.spinner:after {
    -webkit-animation: spinner-animation 0.6s linear;
    -o-animation: spinner-animation 0.6s linear;
    animation: spinner-animation 0.6s linear;
    -webkit-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}

.spinner-slow:after {
    -webkit-animation: spinner-animation 2s linear;
    -o-animation: spinner-animation 2s linear;
    animation: spinner-animation 2s linear;
    -webkit-animation-iteration-count: infinite;
    -o-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}

button.spinner {
    color: transparent;
    position: relative;
}

    button.spinner:hover, button.spinner:focus, button.spinner.focus {
        color: transparent;
    }

    button.spinner:active:hover, button.spinner:active:focus, button.spinner:active.focus, button.spinner.active:hover, button.spinner.active:focus, button.spinner.active.focus {
        color: transparent;
    }

.spinner-default:after {
    border-color: #777 transparent transparent;
}

.spinner-primary:after {
    border-color: #d9230f transparent transparent;
}

.spinner-success:after {
    border-color: #469408 transparent transparent;
}

.spinner-info:after {
    border-color: #029acf transparent transparent;
}

.spinner-warning:after {
    border-color: #9b479f transparent transparent;
}

.spinner-danger:after {
    border-color: #d9831f transparent transparent;
}

.spinner-lg:before,
.spinner-lg:after {
    border-width: 3px;
    height: 48px;
    margin: -24px 0 0 -24px;
    width: 48px;
}

.spinner-sm:before,
.spinner-sm:after {
    height: 18px;
    margin: -9px 0 0 -9px;
    width: 18px;
}

.steps {
    list-style: none;
    margin-bottom: 0;
    padding-left: 0;
}

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

    .steps:after {
        clear: both;
    }

.step {
    color: #777;
    display: block;
    padding: 0;
    text-align: center;
}

.step-segment {
    display: block;
    padding-bottom: 5px;
    padding-top: 5px;
    position: relative;
}

    .step-segment:after {
        background-color: #d9230f;
        content: "";
        display: block;
        height: 2px;
        position: absolute;
        right: 50%;
        top: 50%;
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        -o-transform: translateY(-50%);
        transform: translateY(-50%);
        width: 100%;
    }

.step:first-child .step-segment:after {
    display: none;
}

.step-icon {
    background-color: #d9230f;
    border: 2px solid #d9230f;
    border-radius: 50%;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    color: #fff;
    display: inline-block;
    position: relative;
    text-align: center;
    z-index: 2;
    display: inline-block;
    font-size: 24px;
    height: 48px;
    line-height: 48px;
    text-align: center;
    width: 48px;
}

.step.active .step-icon {
    background-color: #fff;
    color: #d9230f;
}

.step.active ~ .step .step-segment:after {
    background-color: #474949;
}

.step.active ~ .step .step-icon {
    background-color: #474949;
    border-color: #474949;
    color: #fff;
}

.switch {
    cursor: pointer;
    display: inline-block;
    height: 20px;
    margin: 0;
    position: relative;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    vertical-align: middle;
    width: 44px;
}

.switch-input {
    opacity: 0;
    filter: alpha(opacity=0);
    position: absolute;
    z-index: -1;
}

    .switch-input:checked ~ .switch-thumb {
        left: 24px;
    }

.switch-track {
    background-color: #777;
    border-radius: 10px;
    height: 100%;
    left: 0;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 100%;
}

.switch-thumb {
    background-color: #ddd;
    border-color: #777;
    border-radius: 50%;
    border-style: solid;
    border-width: 2px;
    height: 20px;
    left: 0;
    position: absolute;
    top: 0;
    -webkit-transition: left 0.15s ease-out;
    -o-transition: left 0.15s ease-out;
    transition: left 0.15s ease-out;
    width: 20px;
}

.switch-default .switch-input:checked ~ .switch-track {
    background-color: #5cb85c;
}

.switch-default .switch-input:checked ~ .switch-thumb {
    border-color: #5cb85c;
}

.switch-primary .switch-input:checked ~ .switch-track {
    background-color: #d9230f;
}

.switch-primary .switch-input:checked ~ .switch-thumb {
    border-color: #d9230f;
}

.switch-success .switch-input:checked ~ .switch-track {
    background-color: #469408;
}

.switch-success .switch-input:checked ~ .switch-thumb {
    border-color: #469408;
}

.switch-info .switch-input:checked ~ .switch-track {
    background-color: #029acf;
}

.switch-info .switch-input:checked ~ .switch-thumb {
    border-color: #029acf;
}

.switch-warning .switch-input:checked ~ .switch-track {
    background-color: #9b479f;
}

.switch-warning .switch-input:checked ~ .switch-thumb {
    border-color: #9b479f;
}

.switch-danger .switch-input:checked ~ .switch-track {
    background-color: #d9831f;
}

.switch-danger .switch-input:checked ~ .switch-thumb {
    border-color: #d9831f;
}

.switch .switch-input:disabled ~ .switch-track {
    background-color: #ddd;
}

.switch .switch-input:disabled ~ .switch-thumb {
    border-color: #ddd;
    cursor: not-allowed;
}

.nav-tabs {
    border-bottom: none;
    border-radius: 4px 4px 0 0;
}

    .nav-tabs > li {
        margin-bottom: 0;
    }

        .nav-tabs > li > a {
            border: none;
            border-radius: 0;
            color: #444;
            margin-right: 0;
        }

            .nav-tabs > li > a:focus,
            .nav-tabs > li > a:hover {
                background-color: transparent;
                border: none;
            }

        .nav-tabs > li.active > a,
        .nav-tabs > li.active > a:focus,
        .nav-tabs > li.active > a:hover {
            background-color: transparent;
            border: none;
            border-bottom: 3px solid #E52423;
            font-weight: bold;
        }

    .nav-tabs .dropdown-toggle,
    .nav-tabs .dropdown-toggle:hover,
    .nav-tabs .dropdown-toggle:focus {
        color: #515151;
    }

    .nav-tabs .dropdown.open .dropdown-toggle {
        background-color: #f6f6f6;
        color: #515151;
    }

    .nav-tabs .dropdown.active.open .dropdown-toggle {
        color: #515151;
    }

        .nav-tabs .dropdown.active.open .dropdown-toggle .caret,
        .nav-tabs .dropdown.active .dropdown-toggle .caret {
            border-bottom-color: #515151;
            border-top-color: #515151;
        }

    .nav-tabs .dropdown.open .caret,
    .nav-tabs .dropdown.open.active .caret,
    .nav-tabs .dropdown.open a:hover .caret,
    .nav-tabs .dropdown.open a:focus,
    .nav-tabs .dropdown-toggle,
    .nav-tabs .dropdown-toggle:hover,
    .nav-tabs .dropdown-toggle:focus .caret {
        border-bottom-color: #515151;
        border-top-color: #515151;
    }

    .nav-tabs.nav-justified > li > a {
        margin-bottom: 0;
        text-align: center;
    }

    .nav-tabs.nav-justified > .dropdown .dropdown-menu {
        left: auto;
        top: auto;
    }

    .nav-tabs.nav-justified > li > a {
        border-radius: 0;
    }

    .nav-tabs.nav-justified > li:first-child > a {
        border-radius: 4px 0 0 0;
    }

    .nav-tabs.nav-justified > li:last-child > a {
        border-radius: 0 4px 0 0;
    }

    .nav-tabs.nav-justified > .active > a, .nav-tabs.nav-justified > .active > a:hover, .nav-tabs.nav-justified > .active > a:focus {
        border: none;
    }

/*@media (min-width: 768px) {
    .nav-tabs > li {
        border-left: 1px solid #d6d6d6;
    }

        .nav-tabs > li:first-child {
            border-left: none;
        }

    .nav-tabs.nav-justified > li > a {
        border-bottom: none;
        border-radius: 0;
    }

    .nav-tabs.nav-justified > .active > a, .nav-tabs.nav-justified > .active > a:hover, .nav-tabs.nav-justified > .active > a:focus {
        border-bottom: none;
    }
}*/

.tabs-below .nav-tabs {
    border-radius: 0 0 4px 4px;
}

    .tabs-below .nav-tabs > li:first-child > a {
        border-radius: 0 0 0 4px;
    }

    .tabs-below .nav-tabs.nav-justified > li:last-child > a {
        border-radius: 0 0 4px 0;
    }

.tabs-left .nav-tabs > li,
.tabs-right .nav-tabs > li {
    border-left: none;
    border-top: 1px solid #d6d6d6;
    float: none;
}

    .tabs-left .nav-tabs > li:first-child,
    .tabs-right .nav-tabs > li:first-child {
        border-top: none;
    }

    .tabs-left .nav-tabs > li > a,
    .tabs-right .nav-tabs > li > a {
        margin-right: 0;
        min-width: 75px;
    }

.tabs-left {
    overflow: hidden;
}

    .tabs-left .nav-tabs {
        border-radius: 4px 0 0 4px;
        float: left;
    }

        .tabs-left .nav-tabs > li:first-child > a {
            border-radius: 4px 0 0 0;
        }

        .tabs-left .nav-tabs > li:last-child > a {
            border-radius: 0 0 0 4px;
        }

.tabs-right {
    overflow: hidden;
}

    .tabs-right .nav-tabs {
        border-radius: 0 4px 4px 0;
        float: right;
    }

        .tabs-right .nav-tabs > li:first-child > a {
            border-radius: 0 4px 0 0;
        }

        .tabs-right .nav-tabs > li:last-child > a {
            border-radius: 0 0 4px 0;
        }

.tab-content {
    /*overflow: hidden;
    padding: 15px;*/
}

/*.timeline {
    display: table;
    width: 100%;
    padding-left: 0;
    margin-bottom: 0;
}

.timeline-item {
    border-collapse: collapse;
    display: table-row;
}

.timeline-segment {
    background-color: transparent;
    background-image: url(/Content/data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http:/www.w3.org/2000/svg' viewBox='0 0 4 1' fill='%23efefef'%3E%3Cpath d='M0 0h4v1H0z'/%3E%3C/svg%3E);
    background-position: center bottom;
    background-repeat: repeat-y;
    -webkit-background-size: 4px 1px;
    background-size: 4px 1px;
    display: table-cell;
    padding-bottom: 15px;
    text-align: center;
    vertical-align: top;
    white-space: nowrap;
    width: 1%;
}

.timeline-dots {
    background-color: transparent;
    background-image: url(/Content/data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http:/www.w3.org/2000/svg' viewBox='0 0 4 8' fill='%23efefef'%3E%3Ccircle cx='2' cy='2' r='2'/%3E%3C/svg%3E);
    background-position: center;
    background-repeat: repeat-y;
    -webkit-background-size: 4px 8px;
    background-size: 4px 8px;
    display: table-cell;
    padding-bottom: 15px;
    text-align: center;
    vertical-align: top;
    white-space: nowrap;
    width: 1%;
}

.timeline-content {
    display: table-cell;
    padding-bottom: 15px;
    padding-left: 15px;
    vertical-align: middle;
    width: 99%;
}

.timeline-divider {
    background-color: #efefef;
    border-radius: 50%;
    display: block;
    height: 10px;
    margin-left: auto;
    margin-right: auto;
    width: 10px;
}

.timeline-media {
    background-color: #efefef;
    border-color: #efefef;
    border-style: solid;
    border-width: 3px;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    display: inline-block;
}

.timeline-title {
    margin-bottom: 5px;
    margin-top: 0;
}

.timeline-meta {
    float: right;
    line-height: 1;
    margin-left: 10px;
}*/

.arrow-up:before, .arrow-down:before, .arrow-left:before, .arrow-right:before, .arrow-up:after, .arrow-down:after, .arrow-left:after, .arrow-right:after {
    border-color: transparent;
    border-style: solid;
    border-width: 6px;
    content: " ";
    height: 0;
    pointer-events: none;
    position: absolute;
    -webkit-transition: inherit;
    -o-transition: inherit;
    transition: inherit;
    width: 0;
    z-index: 15;
}

.arrow-up:before, .arrow-down:before, .arrow-up:after, .arrow-down:after {
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
}

.arrow-left:before, .arrow-right:before, .arrow-left:after, .arrow-right:after {
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}

.arrow-left.top:before, .arrow-right.top:before, .arrow-left.top:after, .arrow-right.top:after {
    top: 10px;
    -webkit-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
}

.arrow-up.right:before, .arrow-down.right:before, .arrow-up.right:after, .arrow-down.right:after {
    left: auto;
    right: 10px;
    -webkit-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
}

.arrow-left.bottom:before, .arrow-right.bottom:before, .arrow-left.bottom:after, .arrow-right.bottom:after {
    bottom: 10px;
    top: auto;
    -webkit-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
}

.arrow-up.left:before, .arrow-down.left:before, .arrow-up.left:after, .arrow-down.left:after {
    left: 10px;
    -webkit-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
}

.arrow-up:before, .arrow-up:after {
    bottom: 100%;
}

.arrow-up:after {
    margin-bottom: -1px;
}

.arrow-down:before, .arrow-down:after {
    top: 100%;
}

.arrow-down:after {
    margin-top: -1px;
}

.arrow-left:before, .arrow-left:after {
    right: 100%;
}

.arrow-left:after {
    margin-right: -1px;
}

.arrow-right:before, .arrow-right:after {
    left: 100%;
}

.arrow-right:after {
    margin-left: -1px;
}

.arrow-default {
    background-color: #474949;
    border-color: #474949;
    color: #fff;
}

a.arrow-default:hover, a.arrow-default:focus {
    background-color: #2e2f2f;
    border-color: #292a2a;
    color: #fff;
}

.arrow-up.arrow-default:before {
    border-bottom-color: #474949;
}

.arrow-up.arrow-default:after {
    border-bottom-color: #474949;
}

a.arrow-up.arrow-default:hover:before, a.arrow-up.arrow-default:focus:before {
    border-bottom-color: #292a2a;
}

a.arrow-up.arrow-default:hover:after, a.arrow-up.arrow-default:focus:after {
    border-bottom-color: #2e2f2f;
}

.arrow-down.arrow-default:before {
    border-top-color: #474949;
}

.arrow-down.arrow-default:after {
    border-top-color: #474949;
}

a.arrow-down.arrow-default:hover:before, a.arrow-down.arrow-default:focus:before {
    border-top-color: #292a2a;
}

a.arrow-down.arrow-default:hover:after, a.arrow-down.arrow-default:focus:after {
    border-top-color: #2e2f2f;
}

.arrow-left.arrow-default:before {
    border-right-color: #474949;
}

.arrow-left.arrow-default:after {
    border-right-color: #474949;
}

a.arrow-left.arrow-default:hover:before, a.arrow-left.arrow-default:focus:before {
    border-right-color: #292a2a;
}

a.arrow-left.arrow-default:hover:after, a.arrow-left.arrow-default:focus:after {
    border-right-color: #2e2f2f;
}

.arrow-right.arrow-default:before {
    border-left-color: #474949;
}

.arrow-right.arrow-default:after {
    border-left-color: #474949;
}

a.arrow-right.arrow-default:hover:before, a.arrow-right.arrow-default:focus:before {
    border-left-color: #292a2a;
}

a.arrow-right.arrow-default:hover:after, a.arrow-right.arrow-default:focus:after {
    border-left-color: #2e2f2f;
}

.arrow-primary {
    background-color: #d9230f;
    border-color: #d9230f;
    color: #fff;
}

a.arrow-primary:hover, a.arrow-primary:focus {
    background-color: #a91b0c;
    border-color: #a01a0b;
    color: #fff;
}

.arrow-up.arrow-primary:before {
    border-bottom-color: #d9230f;
}

.arrow-up.arrow-primary:after {
    border-bottom-color: #d9230f;
}

a.arrow-up.arrow-primary:hover:before, a.arrow-up.arrow-primary:focus:before {
    border-bottom-color: #a01a0b;
}

a.arrow-up.arrow-primary:hover:after, a.arrow-up.arrow-primary:focus:after {
    border-bottom-color: #a91b0c;
}

.arrow-down.arrow-primary:before {
    border-top-color: #d9230f;
}

.arrow-down.arrow-primary:after {
    border-top-color: #d9230f;
}

a.arrow-down.arrow-primary:hover:before, a.arrow-down.arrow-primary:focus:before {
    border-top-color: #a01a0b;
}

a.arrow-down.arrow-primary:hover:after, a.arrow-down.arrow-primary:focus:after {
    border-top-color: #a91b0c;
}

.arrow-left.arrow-primary:before {
    border-right-color: #d9230f;
}

.arrow-left.arrow-primary:after {
    border-right-color: #d9230f;
}

a.arrow-left.arrow-primary:hover:before, a.arrow-left.arrow-primary:focus:before {
    border-right-color: #a01a0b;
}

a.arrow-left.arrow-primary:hover:after, a.arrow-left.arrow-primary:focus:after {
    border-right-color: #a91b0c;
}

.arrow-right.arrow-primary:before {
    border-left-color: #d9230f;
}

.arrow-right.arrow-primary:after {
    border-left-color: #d9230f;
}

a.arrow-right.arrow-primary:hover:before, a.arrow-right.arrow-primary:focus:before {
    border-left-color: #a01a0b;
}

a.arrow-right.arrow-primary:hover:after, a.arrow-right.arrow-primary:focus:after {
    border-left-color: #a91b0c;
}

.arrow-success {
    background-color: #469408;
    border-color: #469408;
    color: #fff;
}

a.arrow-success:hover, a.arrow-success:focus {
    background-color: #2f6405;
    border-color: #2b5a05;
    color: #fff;
}

.arrow-up.arrow-success:before {
    border-bottom-color: #469408;
}

.arrow-up.arrow-success:after {
    border-bottom-color: #469408;
}

a.arrow-up.arrow-success:hover:before, a.arrow-up.arrow-success:focus:before {
    border-bottom-color: #2b5a05;
}

a.arrow-up.arrow-success:hover:after, a.arrow-up.arrow-success:focus:after {
    border-bottom-color: #2f6405;
}

.arrow-down.arrow-success:before {
    border-top-color: #469408;
}

.arrow-down.arrow-success:after {
    border-top-color: #469408;
}

a.arrow-down.arrow-success:hover:before, a.arrow-down.arrow-success:focus:before {
    border-top-color: #2b5a05;
}

a.arrow-down.arrow-success:hover:after, a.arrow-down.arrow-success:focus:after {
    border-top-color: #2f6405;
}

.arrow-left.arrow-success:before {
    border-right-color: #469408;
}

.arrow-left.arrow-success:after {
    border-right-color: #469408;
}

a.arrow-left.arrow-success:hover:before, a.arrow-left.arrow-success:focus:before {
    border-right-color: #2b5a05;
}

a.arrow-left.arrow-success:hover:after, a.arrow-left.arrow-success:focus:after {
    border-right-color: #2f6405;
}

.arrow-right.arrow-success:before {
    border-left-color: #469408;
}

.arrow-right.arrow-success:after {
    border-left-color: #469408;
}

a.arrow-right.arrow-success:hover:before, a.arrow-right.arrow-success:focus:before {
    border-left-color: #2b5a05;
}

a.arrow-right.arrow-success:hover:after, a.arrow-right.arrow-success:focus:after {
    border-left-color: #2f6405;
}

.arrow-info {
    background-color: #029acf;
    border-color: #029acf;
    color: #fff;
}

a.arrow-info:hover, a.arrow-info:focus {
    background-color: #02749c;
    border-color: #016d92;
    color: #fff;
}

.arrow-up.arrow-info:before {
    border-bottom-color: #029acf;
}

.arrow-up.arrow-info:after {
    border-bottom-color: #029acf;
}

a.arrow-up.arrow-info:hover:before, a.arrow-up.arrow-info:focus:before {
    border-bottom-color: #016d92;
}

a.arrow-up.arrow-info:hover:after, a.arrow-up.arrow-info:focus:after {
    border-bottom-color: #02749c;
}

.arrow-down.arrow-info:before {
    border-top-color: #029acf;
}

.arrow-down.arrow-info:after {
    border-top-color: #029acf;
}

a.arrow-down.arrow-info:hover:before, a.arrow-down.arrow-info:focus:before {
    border-top-color: #016d92;
}

a.arrow-down.arrow-info:hover:after, a.arrow-down.arrow-info:focus:after {
    border-top-color: #02749c;
}

.arrow-left.arrow-info:before {
    border-right-color: #029acf;
}

.arrow-left.arrow-info:after {
    border-right-color: #029acf;
}

a.arrow-left.arrow-info:hover:before, a.arrow-left.arrow-info:focus:before {
    border-right-color: #016d92;
}

a.arrow-left.arrow-info:hover:after, a.arrow-left.arrow-info:focus:after {
    border-right-color: #02749c;
}

.arrow-right.arrow-info:before {
    border-left-color: #029acf;
}

.arrow-right.arrow-info:after {
    border-left-color: #029acf;
}

a.arrow-right.arrow-info:hover:before, a.arrow-right.arrow-info:focus:before {
    border-left-color: #016d92;
}

a.arrow-right.arrow-info:hover:after, a.arrow-right.arrow-info:focus:after {
    border-left-color: #02749c;
}

.arrow-warning {
    background-color: #9b479f;
    border-color: #9b479f;
    color: #fff;
}

a.arrow-warning:hover, a.arrow-warning:focus {
    background-color: #79377c;
    border-color: #723475;
    color: #fff;
}

.arrow-up.arrow-warning:before {
    border-bottom-color: #9b479f;
}

.arrow-up.arrow-warning:after {
    border-bottom-color: #9b479f;
}

a.arrow-up.arrow-warning:hover:before, a.arrow-up.arrow-warning:focus:before {
    border-bottom-color: #723475;
}

a.arrow-up.arrow-warning:hover:after, a.arrow-up.arrow-warning:focus:after {
    border-bottom-color: #79377c;
}

.arrow-down.arrow-warning:before {
    border-top-color: #9b479f;
}

.arrow-down.arrow-warning:after {
    border-top-color: #9b479f;
}

a.arrow-down.arrow-warning:hover:before, a.arrow-down.arrow-warning:focus:before {
    border-top-color: #723475;
}

a.arrow-down.arrow-warning:hover:after, a.arrow-down.arrow-warning:focus:after {
    border-top-color: #79377c;
}

.arrow-left.arrow-warning:before {
    border-right-color: #9b479f;
}

.arrow-left.arrow-warning:after {
    border-right-color: #9b479f;
}

a.arrow-left.arrow-warning:hover:before, a.arrow-left.arrow-warning:focus:before {
    border-right-color: #723475;
}

a.arrow-left.arrow-warning:hover:after, a.arrow-left.arrow-warning:focus:after {
    border-right-color: #79377c;
}

.arrow-right.arrow-warning:before {
    border-left-color: #9b479f;
}

.arrow-right.arrow-warning:after {
    border-left-color: #9b479f;
}

a.arrow-right.arrow-warning:hover:before, a.arrow-right.arrow-warning:focus:before {
    border-left-color: #723475;
}

a.arrow-right.arrow-warning:hover:after, a.arrow-right.arrow-warning:focus:after {
    border-left-color: #79377c;
}

.arrow-danger {
    background-color: #d9831f;
    border-color: #d9831f;
    color: #fff;
}

a.arrow-danger:hover, a.arrow-danger:focus {
    background-color: #ac6819;
    border-color: #a36317;
    color: #fff;
}

.arrow-up.arrow-danger:before {
    border-bottom-color: #d9831f;
}

.arrow-up.arrow-danger:after {
    border-bottom-color: #d9831f;
}

a.arrow-up.arrow-danger:hover:before, a.arrow-up.arrow-danger:focus:before {
    border-bottom-color: #a36317;
}

a.arrow-up.arrow-danger:hover:after, a.arrow-up.arrow-danger:focus:after {
    border-bottom-color: #ac6819;
}

.arrow-down.arrow-danger:before {
    border-top-color: #d9831f;
}

.arrow-down.arrow-danger:after {
    border-top-color: #d9831f;
}

a.arrow-down.arrow-danger:hover:before, a.arrow-down.arrow-danger:focus:before {
    border-top-color: #a36317;
}

a.arrow-down.arrow-danger:hover:after, a.arrow-down.arrow-danger:focus:after {
    border-top-color: #ac6819;
}

.arrow-left.arrow-danger:before {
    border-right-color: #d9831f;
}

.arrow-left.arrow-danger:after {
    border-right-color: #d9831f;
}

a.arrow-left.arrow-danger:hover:before, a.arrow-left.arrow-danger:focus:before {
    border-right-color: #a36317;
}

a.arrow-left.arrow-danger:hover:after, a.arrow-left.arrow-danger:focus:after {
    border-right-color: #ac6819;
}

.arrow-right.arrow-danger:before {
    border-left-color: #d9831f;
}

.arrow-right.arrow-danger:after {
    border-left-color: #d9831f;
}

a.arrow-right.arrow-danger:hover:before, a.arrow-right.arrow-danger:focus:before {
    border-left-color: #a36317;
}

a.arrow-right.arrow-danger:hover:after, a.arrow-right.arrow-danger:focus:after {
    border-left-color: #ac6819;
}

.arrow-outline-default {
    background-color: #fff;
    border-color: #474949;
    color: #474949;
}

a.arrow-outline-default:hover, a.arrow-outline-default:focus {
    background-color: #474949;
    border-color: #474949;
    color: #fff;
}

.arrow-up.arrow-outline-default:before {
    border-bottom-color: #474949;
}

.arrow-up.arrow-outline-default:after {
    border-bottom-color: #fff;
}

a.arrow-up.arrow-outline-default:hover:after, a.arrow-up.arrow-outline-default:focus:after {
    border-bottom-color: #474949;
}

.arrow-down.arrow-outline-default:before {
    border-top-color: #474949;
}

.arrow-down.arrow-outline-default:after {
    border-top-color: #fff;
}

a.arrow-down.arrow-outline-default:hover:after, a.arrow-down.arrow-outline-default:focus:after {
    border-top-color: #474949;
}

.arrow-left.arrow-outline-default:before {
    border-right-color: #474949;
}

.arrow-left.arrow-outline-default:after {
    border-right-color: #fff;
}

a.arrow-left.arrow-outline-default:hover:after, a.arrow-left.arrow-outline-default:focus:after {
    border-right-color: #474949;
}

.arrow-right.arrow-outline-default:before {
    border-left-color: #474949;
}

.arrow-right.arrow-outline-default:after {
    border-left-color: #fff;
}

a.arrow-right.arrow-outline-default:hover:after, a.arrow-right.arrow-outline-default:focus:after {
    border-left-color: #474949;
}

.arrow-outline-primary {
    background-color: #fff;
    border-color: #d9230f;
    color: #d9230f;
}

a.arrow-outline-primary:hover, a.arrow-outline-primary:focus {
    background-color: #d9230f;
    border-color: #d9230f;
    color: #fff;
}

.arrow-up.arrow-outline-primary:before {
    border-bottom-color: #d9230f;
}

.arrow-up.arrow-outline-primary:after {
    border-bottom-color: #fff;
}

a.arrow-up.arrow-outline-primary:hover:after, a.arrow-up.arrow-outline-primary:focus:after {
    border-bottom-color: #d9230f;
}

.arrow-down.arrow-outline-primary:before {
    border-top-color: #d9230f;
}

.arrow-down.arrow-outline-primary:after {
    border-top-color: #fff;
}

a.arrow-down.arrow-outline-primary:hover:after, a.arrow-down.arrow-outline-primary:focus:after {
    border-top-color: #d9230f;
}

.arrow-left.arrow-outline-primary:before {
    border-right-color: #d9230f;
}

.arrow-left.arrow-outline-primary:after {
    border-right-color: #fff;
}

a.arrow-left.arrow-outline-primary:hover:after, a.arrow-left.arrow-outline-primary:focus:after {
    border-right-color: #d9230f;
}

.arrow-right.arrow-outline-primary:before {
    border-left-color: #d9230f;
}

.arrow-right.arrow-outline-primary:after {
    border-left-color: #fff;
}

a.arrow-right.arrow-outline-primary:hover:after, a.arrow-right.arrow-outline-primary:focus:after {
    border-left-color: #d9230f;
}

.arrow-outline-success {
    background-color: #fff;
    border-color: #469408;
    color: #469408;
}

a.arrow-outline-success:hover, a.arrow-outline-success:focus {
    background-color: #469408;
    border-color: #469408;
    color: #fff;
}

.arrow-up.arrow-outline-success:before {
    border-bottom-color: #469408;
}

.arrow-up.arrow-outline-success:after {
    border-bottom-color: #fff;
}

a.arrow-up.arrow-outline-success:hover:after, a.arrow-up.arrow-outline-success:focus:after {
    border-bottom-color: #469408;
}

.arrow-down.arrow-outline-success:before {
    border-top-color: #469408;
}

.arrow-down.arrow-outline-success:after {
    border-top-color: #fff;
}

a.arrow-down.arrow-outline-success:hover:after, a.arrow-down.arrow-outline-success:focus:after {
    border-top-color: #469408;
}

.arrow-left.arrow-outline-success:before {
    border-right-color: #469408;
}

.arrow-left.arrow-outline-success:after {
    border-right-color: #fff;
}

a.arrow-left.arrow-outline-success:hover:after, a.arrow-left.arrow-outline-success:focus:after {
    border-right-color: #469408;
}

.arrow-right.arrow-outline-success:before {
    border-left-color: #469408;
}

.arrow-right.arrow-outline-success:after {
    border-left-color: #fff;
}

a.arrow-right.arrow-outline-success:hover:after, a.arrow-right.arrow-outline-success:focus:after {
    border-left-color: #469408;
}

.arrow-outline-info {
    background-color: #fff;
    border-color: #029acf;
    color: #029acf;
}

a.arrow-outline-info:hover, a.arrow-outline-info:focus {
    background-color: #029acf;
    border-color: #029acf;
    color: #fff;
}

.arrow-up.arrow-outline-info:before {
    border-bottom-color: #029acf;
}

.arrow-up.arrow-outline-info:after {
    border-bottom-color: #fff;
}

a.arrow-up.arrow-outline-info:hover:after, a.arrow-up.arrow-outline-info:focus:after {
    border-bottom-color: #029acf;
}

.arrow-down.arrow-outline-info:before {
    border-top-color: #029acf;
}

.arrow-down.arrow-outline-info:after {
    border-top-color: #fff;
}

a.arrow-down.arrow-outline-info:hover:after, a.arrow-down.arrow-outline-info:focus:after {
    border-top-color: #029acf;
}

.arrow-left.arrow-outline-info:before {
    border-right-color: #029acf;
}

.arrow-left.arrow-outline-info:after {
    border-right-color: #fff;
}

a.arrow-left.arrow-outline-info:hover:after, a.arrow-left.arrow-outline-info:focus:after {
    border-right-color: #029acf;
}

.arrow-right.arrow-outline-info:before {
    border-left-color: #029acf;
}

.arrow-right.arrow-outline-info:after {
    border-left-color: #fff;
}

a.arrow-right.arrow-outline-info:hover:after, a.arrow-right.arrow-outline-info:focus:after {
    border-left-color: #029acf;
}

.arrow-outline-warning {
    background-color: #fff;
    border-color: #9b479f;
    color: #9b479f;
}

a.arrow-outline-warning:hover, a.arrow-outline-warning:focus {
    background-color: #9b479f;
    border-color: #9b479f;
    color: #fff;
}

.arrow-up.arrow-outline-warning:before {
    border-bottom-color: #9b479f;
}

.arrow-up.arrow-outline-warning:after {
    border-bottom-color: #fff;
}

a.arrow-up.arrow-outline-warning:hover:after, a.arrow-up.arrow-outline-warning:focus:after {
    border-bottom-color: #9b479f;
}

.arrow-down.arrow-outline-warning:before {
    border-top-color: #9b479f;
}

.arrow-down.arrow-outline-warning:after {
    border-top-color: #fff;
}

a.arrow-down.arrow-outline-warning:hover:after, a.arrow-down.arrow-outline-warning:focus:after {
    border-top-color: #9b479f;
}

.arrow-left.arrow-outline-warning:before {
    border-right-color: #9b479f;
}

.arrow-left.arrow-outline-warning:after {
    border-right-color: #fff;
}

a.arrow-left.arrow-outline-warning:hover:after, a.arrow-left.arrow-outline-warning:focus:after {
    border-right-color: #9b479f;
}

.arrow-right.arrow-outline-warning:before {
    border-left-color: #9b479f;
}

.arrow-right.arrow-outline-warning:after {
    border-left-color: #fff;
}

a.arrow-right.arrow-outline-warning:hover:after, a.arrow-right.arrow-outline-warning:focus:after {
    border-left-color: #9b479f;
}

.arrow-outline-danger {
    background-color: #fff;
    border-color: #d9831f;
    color: #d9831f;
}

a.arrow-outline-danger:hover, a.arrow-outline-danger:focus {
    background-color: #d9831f;
    border-color: #d9831f;
    color: #fff;
}

.arrow-up.arrow-outline-danger:before {
    border-bottom-color: #d9831f;
}

.arrow-up.arrow-outline-danger:after {
    border-bottom-color: #fff;
}

a.arrow-up.arrow-outline-danger:hover:after, a.arrow-up.arrow-outline-danger:focus:after {
    border-bottom-color: #d9831f;
}

.arrow-down.arrow-outline-danger:before {
    border-top-color: #d9831f;
}

.arrow-down.arrow-outline-danger:after {
    border-top-color: #fff;
}

a.arrow-down.arrow-outline-danger:hover:after, a.arrow-down.arrow-outline-danger:focus:after {
    border-top-color: #d9831f;
}

.arrow-left.arrow-outline-danger:before {
    border-right-color: #d9831f;
}

.arrow-left.arrow-outline-danger:after {
    border-right-color: #fff;
}

a.arrow-left.arrow-outline-danger:hover:after, a.arrow-left.arrow-outline-danger:focus:after {
    border-right-color: #d9831f;
}

.arrow-right.arrow-outline-danger:before {
    border-left-color: #d9831f;
}

.arrow-right.arrow-outline-danger:after {
    border-left-color: #fff;
}

a.arrow-right.arrow-outline-danger:hover:after, a.arrow-right.arrow-outline-danger:focus:after {
    border-left-color: #d9831f;
}

.arrow-lg:before, .arrow-lg:after {
    border-width: 8px;
}

.arrow-sm:before, .arrow-sm:after {
    border-width: 4px;
}

.no-background {
    background-color: transparent;
}

.bg-gray {
    background-color: #777;
    border-color: #777;
    color: #fff;
    cursor: default;
}

a.bg-gray:hover,
a.bg-gray:focus {
    background-color: #5e5e5e;
    border-color: #5e5e5e;
    color: #fff;
    text-decoration: none;
}

.bg-gray-clickable {
    background-color: #777;
    border-color: #777;
    color: #fff;
}

    .bg-gray-clickable:hover,
    .bg-gray-clickable:focus {
        background-color: #E52423;
        border-color: #E52423;
        color: #fff;
        text-decoration: none;
    }

.bg-default {
    background-color: #474949;
    border-color: #474949;
    color: #fff;
}

a.bg-default:hover,
a.bg-default:focus {
    background-color: #2e2f2f;
    border-color: #2e2f2f;
    color: #fff;
    text-decoration: none;
}

.bg-primary {
    background-color: #d9230f;
    border-color: #d9230f;
    color: #fff;
}

a.bg-primary:hover,
a.bg-primary:focus {
    background-color: #a91b0c;
    border-color: #a91b0c;
    color: #fff;
    text-decoration: none;
}

.bg-success {
    background-color: #469408;
    border-color: #469408;
    color: #fff;
}

a.bg-success:hover,
a.bg-success:focus {
    background-color: #2f6405;
    border-color: #2f6405;
    color: #fff;
    text-decoration: none;
}

.bg-info {
    background-color: #029acf;
    border-color: #029acf;
    color: #fff;
}

a.bg-info:hover,
a.bg-info:focus {
    background-color: #02749c;
    border-color: #02749c;
    color: #fff;
    text-decoration: none;
}

.bg-warning {
    background-color: #9b479f;
    border-color: #9b479f;
    color: #fff;
}

a.bg-warning:hover,
a.bg-warning:focus {
    background-color: #79377c;
    border-color: #79377c;
    color: #fff;
    text-decoration: none;
}

.bg-danger {
    background-color: #d9831f;
    border-color: #d9831f;
    color: #fff;
}

a.bg-danger:hover,
a.bg-danger:focus {
    background-color: #ac6819;
    border-color: #ac6819;
    color: #fff;
    text-decoration: none;
}

.bg-gray-inverse {
    background-color: #fff;
    border-color: #fff;
    color: #777;
}

a.bg-gray-inverse:hover,
a.bg-gray-inverse:focus {
    background-color: #e6e6e6;
    border-color: #e6e6e6;
    color: #777;
    text-decoration: none;
}

.bg-default-inverse {
    background-color: #fff;
    border-color: #fff;
    color: #474949;
}

a.bg-default-inverse:hover,
a.bg-default-inverse:focus {
    background-color: #e6e6e6;
    border-color: #e6e6e6;
    color: #474949;
    text-decoration: none;
}

.bg-primary-inverse {
    background-color: #fff;
    border-color: #fff;
    color: #d9230f;
}

a.bg-primary-inverse:hover,
a.bg-primary-inverse:focus {
    background-color: #e6e6e6;
    border-color: #e6e6e6;
    color: #d9230f;
    text-decoration: none;
}

.bg-success-inverse {
    background-color: #fff;
    border-color: #fff;
    color: #469408;
}

a.bg-success-inverse:hover,
a.bg-success-inverse:focus {
    background-color: #e6e6e6;
    border-color: #e6e6e6;
    color: #469408;
    text-decoration: none;
}

.bg-info-inverse {
    background-color: #fff;
    border-color: #fff;
    color: #029acf;
}

a.bg-info-inverse:hover,
a.bg-info-inverse:focus {
    background-color: #e6e6e6;
    border-color: #e6e6e6;
    color: #029acf;
    text-decoration: none;
}

.bg-warning-inverse {
    background-color: #fff;
    border-color: #fff;
    color: #9b479f;
}

a.bg-warning-inverse:hover,
a.bg-warning-inverse:focus {
    background-color: #e6e6e6;
    border-color: #e6e6e6;
    color: #9b479f;
    text-decoration: none;
}

.bg-danger-inverse {
    background-color: #fff;
    border-color: #fff;
    color: #d9831f;
}

a.bg-danger-inverse:hover,
a.bg-danger-inverse:focus {
    background-color: #e6e6e6;
    border-color: #e6e6e6;
    color: #d9831f;
    text-decoration: none;
}

.bg-gray-a75 {
    background-color: rgba(119, 119, 119, 0.75);
    border-color: #777777;
    color: #fff;
}

a.bg-gray-a75:hover,
a.bg-gray-a75:focus {
    background-color: rgba(94, 94, 94, 0.75);
    border-color: #5e5e5e;
    color: #fff;
    text-decoration: none;
}

.bg-info-a75 {
    background-color: rgba(2, 154, 207, 0.75);
    border-color: #029acf;
    color: #fff;
}

a.bg-info-a75:hover,
a.bg-info-a75:focus {
    background-color: rgba(2, 116, 156, 0.75);
    border-color: #02749c;
    color: #fff;
    text-decoration: none;
}

.bg-warning-a75 {
    background-color: rgba(155, 71, 159, 0.75);
    border-color: #9b479f;
    color: #fff;
}

a.bg-warning-a75:hover,
a.bg-warning-a75:focus {
    background-color: rgba(121, 55, 124, 0.75);
    border-color: #79377c;
    color: #fff;
    text-decoration: none;
}

.bg-facebook {
    background-color: #3b5998;
    border-color: #3b5998;
    color: #fff;
}

a.bg-facebook:hover,
a.bg-facebook:focus {
    background-color: #2d4373;
    border-color: #2d4373;
    color: #fff;
    text-decoration: none;
}

.bg-twitter {
    background-color: #00aced;
    border-color: #00aced;
    color: #fff;
}

a.bg-twitter:hover,
a.bg-twitter:focus {
    background-color: #0087ba;
    border-color: #0087ba;
    color: #fff;
    text-decoration: none;
}

.bg-linkedin {
    background-color: #007bb6;
    border-color: #007bb6;
    color: #fff;
}

a.bg-linkedin:hover,
a.bg-linkedin:focus {
    background-color: #005983;
    border-color: #005983;
    color: #fff;
    text-decoration: none;
}

.bg-googleplus {
    background-color: #dd4b39;
    border-color: #dd4b39;
    color: #fff;
}

a.bg-googleplus:hover,
a.bg-googleplus:focus {
    background-color: #c23321;
    border-color: #c23321;
    color: #fff;
    text-decoration: none;
}

.bg-youtube {
    background-color: #bb0000;
    border-color: #bb0000;
    color: #fff;
}

a.bg-youtube:hover,
a.bg-youtube:focus {
    background-color: #880000;
    border-color: #880000;
    color: #fff;
    text-decoration: none;
}

.bg-pinterest {
    background-color: #cb2027;
    border-color: #cb2027;
    color: #fff;
}

a.bg-pinterest:hover,
a.bg-pinterest:focus {
    background-color: #9f191f;
    border-color: #9f191f;
    color: #fff;
    text-decoration: none;
}

.bg-instagram {
    background-color: #517fa4;
    border-color: #517fa4;
    color: #fff;
}

a.bg-instagram:hover,
a.bg-instagram:focus {
    background-color: #406582;
    border-color: #406582;
    color: #fff;
    text-decoration: none;
}

.bg-tumblr {
    background-color: #32506d;
    border-color: #32506d;
    color: #fff;
}

a.bg-tumblr:hover,
a.bg-tumblr:focus {
    background-color: #22364a;
    border-color: #22364a;
    color: #fff;
    text-decoration: none;
}

.bg-flickr {
    background-color: #ff0084;
    border-color: #ff0084;
    color: #fff;
}

a.bg-flickr:hover,
a.bg-flickr:focus {
    background-color: #cc006a;
    border-color: #cc006a;
    color: #fff;
    text-decoration: none;
}

.bg-dribbble {
    background-color: #ea4c89;
    border-color: #ea4c89;
    color: #fff;
}

a.bg-dribbble:hover,
a.bg-dribbble:focus {
    background-color: #e51e6b;
    border-color: #e51e6b;
    color: #fff;
    text-decoration: none;
}

.no-border {
    border: none;
}

.border {
    border-style: solid;
    border-width: 1px;
}

.bt {
    border-top-style: solid;
    border-top-width: 1px;
}

.br {
    border-right-style: solid;
    border-right-width: 1px;
}

.bb {
    border-bottom-style: solid;
    border-bottom-width: 1px;
}

.bl {
    border-left-style: solid;
    border-left-width: 1px;
}

.pill {
    border-radius: 10em !important;
}

.circle {
    border-radius: 50%;
}

.rounded {
    border-radius: 4px;
}

.d-b {
    display: block;
}

.d-i {
    display: inline;
}

.d-ib {
    display: inline-block;
}

.d-tb {
    display: table;
}

.d-tbr {
    display: table-row;
}

.d-tbc {
    display: table-cell;
}

.ov-a {
    overflow: auto;
}

.ov-h {
    overflow: hidden;
}

.ov-s {
    overflow: scroll;
}

.clear {
    display: block;
    overflow: hidden;
}

.fh {
    display: table;
    height: 100%;
    width: 100%;
}

.fh-b {
    display: table-cell;
    vertical-align: bottom;
}

.fh-m {
    display: table-cell;
    vertical-align: middle;
}

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

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

.pull-xs-none {
    float: none !important;
}

@media (min-width: 768px) {
    .pull-sm-left {
        float: left !important;
    }

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

    .pull-sm-none {
        float: none !important;
    }
}

@media (min-width: 992px) {
    .pull-md-left {
        float: left !important;
    }

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

    .pull-md-none {
        float: none !important;
    }
}

@media (min-width: 1200px) {
    .pull-lg-left {
        float: left !important;
    }

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

    .pull-lg-none {
        float: none !important;
    }
}

.sq-8 {
    display: inline-block;
    font-size: 4px;
    height: 8px;
    line-height: 8px;
    text-align: center;
    width: 8px;
}

.sq-12 {
    display: inline-block;
    font-size: 6px;
    height: 12px;
    line-height: 12px;
    text-align: center;
    width: 12px;
}

.sq-16 {
    display: inline-block;
    font-size: 8px;
    height: 16px;
    line-height: 16px;
    text-align: center;
    width: 16px;
}

.sq-20 {
    display: inline-block;
    font-size: 10px;
    height: 20px;
    line-height: 20px;
    text-align: center;
    width: 20px;
}

.sq-24 {
    display: inline-block;
    font-size: 12px;
    height: 24px;
    line-height: 24px;
    text-align: center;
    width: 24px;
}

.sq-28 {
    display: inline-block;
    font-size: 14px;
    height: 28px;
    line-height: 28px;
    text-align: center;
    width: 28px;
}

.sq-32 {
    display: inline-block;
    font-size: 16px;
    height: 32px;
    line-height: 32px;
    text-align: center;
    width: 32px;
}

.sq-36 {
    display: inline-block;
    font-size: 18px;
    height: 36px;
    line-height: 36px;
    text-align: center;
    width: 36px;
}

.sq-40 {
    display: inline-block;
    font-size: 20px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    width: 40px;
}

.sq-44 {
    display: inline-block;
    font-size: 22px;
    height: 44px;
    line-height: 44px;
    text-align: center;
    width: 44px;
}

.sq-48 {
    display: inline-block;
    font-size: 24px;
    height: 48px;
    line-height: 48px;
    text-align: center;
    width: 48px;
}

.sq-52 {
    display: inline-block;
    font-size: 26px;
    height: 52px;
    line-height: 52px;
    text-align: center;
    width: 52px;
}

.sq-56 {
    display: inline-block;
    font-size: 28px;
    height: 56px;
    line-height: 56px;
    text-align: center;
    width: 56px;
}

.sq-60 {
    display: inline-block;
    font-size: 30px;
    height: 60px;
    line-height: 60px;
    text-align: center;
    width: 60px;
}

.sq-64 {
    display: inline-block;
    font-size: 32px;
    height: 64px;
    line-height: 64px;
    text-align: center;
    width: 64px;
}

.sq-68 {
    display: inline-block;
    font-size: 34px;
    height: 68px;
    line-height: 68px;
    text-align: center;
    width: 68px;
}

.sq-72 {
    display: inline-block;
    font-size: 36px;
    height: 72px;
    line-height: 72px;
    text-align: center;
    width: 72px;
}

.sq-76 {
    display: inline-block;
    font-size: 38px;
    height: 76px;
    line-height: 76px;
    text-align: center;
    width: 76px;
}

.sq-80 {
    display: inline-block;
    font-size: 40px;
    height: 80px;
    line-height: 80px;
    text-align: center;
    width: 80px;
}

.sq-84 {
    display: inline-block;
    font-size: 42px;
    height: 84px;
    line-height: 84px;
    text-align: center;
    width: 84px;
}

.sq-88 {
    display: inline-block;
    font-size: 44px;
    height: 88px;
    line-height: 88px;
    text-align: center;
    width: 88px;
}

.sq-92 {
    display: inline-block;
    font-size: 46px;
    height: 92px;
    line-height: 92px;
    text-align: center;
    width: 92px;
}

.sq-96 {
    display: inline-block;
    font-size: 48px;
    height: 96px;
    line-height: 96px;
    text-align: center;
    width: 96px;
}

.sq-100 {
    display: inline-block;
    font-size: 50px;
    height: 100px;
    line-height: 100px;
    text-align: center;
    width: 100px;
}

.pos-a {
    position: absolute;
}

.pos-f {
    position: fixed;
}

.pos-r {
    position: relative;
}

.t-0 {
    top: 0;
}

.r-0 {
    right: 0;
}

.b-0 {
    bottom: 0;
}

.l-0 {
    left: 0;
}

.m-a-0 {
    margin: 0 !important;
}

.m-t-0 {
    margin-top: 0 !important;
}

.m-r-0 {
    margin-right: 0 !important;
}

.m-b-0 {
    margin-bottom: 0 !important;
}

.m-l-0 {
    margin-left: 0 !important;
}

.m-x-0 {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

.m-y-0 {
    margin-bottom: 0 !important;
    margin-top: 0 !important;
}

.m-a-sm {
    margin: 5px !important;
}

.m-t-sm {
    margin-top: 5px !important;
}

.m-r-sm {
    margin-right: 5px !important;
}

.m-b-sm {
    margin-bottom: 5px !important;
}

.m-l-sm {
    margin-left: 5px !important;
}

.m-x-sm {
    margin-left: 5px !important;
    margin-right: 5px !important;
}

.m-y-sm {
    margin-bottom: 5px !important;
    margin-top: 5px !important;
}

.m-a {
    margin: 10px !important;
}

.m-t {
    margin-top: 10px !important;
}

.m-r {
    margin-right: 10px !important;
}

.m-b {
    margin-bottom: 10px !important;
}

.m-l {
    margin-left: 10px !important;
}

.m-x {
    margin-left: 10px !important;
    margin-right: 10px !important;
}

.m-y {
    margin-bottom: 10px !important;
    margin-top: 10px !important;
}

.m-a-md {
    margin: 15px !important;
}

.m-t-md {
    margin-top: 15px !important;
}

.m-r-md {
    margin-right: 15px !important;
}

.m-b-md {
    margin-bottom: 15px !important;
}

.m-l-md {
    margin-left: 15px !important;
}

.m-x-md {
    margin-left: 15px !important;
    margin-right: 15px !important;
}

.m-y-md {
    margin-bottom: 15px !important;
    margin-top: 15px !important;
}

.m-a-lg {
    margin: 30px !important;
}

.m-t-lg {
    margin-top: 30px !important;
}

.m-r-lg {
    margin-right: 30px !important;
}

.m-b-lg {
    margin-bottom: 30px !important;
}

.m-l-lg {
    margin-left: 30px !important;
}

.m-x-lg {
    margin-left: 30px !important;
    margin-right: 30px !important;
}

.m-y-lg {
    margin-bottom: 30px !important;
    margin-top: 30px !important;
}

.m-a-n {
    margin: -10px !important;
}

.m-t-n {
    margin-top: -10px !important;
}

.m-r-n {
    margin-right: -10px !important;
}

.m-b-n {
    margin-bottom: -10px !important;
}

.m-l-n {
    margin-left: -10px !important;
}

.m-x-n {
    margin-left: -10px !important;
    margin-right: -10px !important;
}

.m-y-n {
    margin-bottom: -10px !important;
    margin-top: -10px !important;
}

.p-a-0 {
    padding: 0 !important;
}

.p-t-0 {
    padding-top: 0 !important;
}

.p-r-0 {
    padding-right: 0 !important;
}

.p-b-0 {
    padding-bottom: 0 !important;
}

.p-l-0 {
    padding-left: 0 !important;
}

.p-x-0 {
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.p-y-0 {
    padding-bottom: 0 !important;
    padding-top: 0 !important;
}

.p-a-sm {
    padding: 5px !important;
}

.p-t-sm {
    padding-top: 5px !important;
}

.p-r-sm {
    padding-right: 5px !important;
}

.p-b-sm {
    padding-bottom: 5px !important;
}

.p-l-sm {
    padding-left: 5px !important;
}

.p-x-sm {
    padding-left: 5px !important;
    padding-right: 5px !important;
}

.p-y-sm {
    padding-bottom: 5px !important;
    padding-top: 5px !important;
}

.p-t-xs {
    padding-top: 3px !important;
}

.p-a {
    padding: 10px !important;
}

.p-t {
    padding-top: 10px !important;
}

.p-r {
    padding-right: 10px !important;
}

.p-b {
    padding-bottom: 10px !important;
}

.p-l {
    padding-left: 10px !important;
}

.p-x {
    padding-left: 10px !important;
    padding-right: 10px !important;
}

.p-y {
    padding-bottom: 10px !important;
    padding-top: 10px !important;
}

.p-a-md {
    padding: 15px !important;
}

.p-t-md {
    padding-top: 15px !important;
}

.p-r-md {
    padding-right: 15px !important;
}

.p-b-md {
    padding-bottom: 15px !important;
}

.p-l-md {
    padding-left: 15px !important;
}

.p-x-md {
    padding-left: 15px !important;
    padding-right: 15px !important;
}

.p-y-md {
    padding-bottom: 15px !important;
    padding-top: 15px !important;
}

.p-a-lg {
    padding: 30px !important;
}

.p-t-lg {
    padding-top: 30px !important;
}

.p-r-lg {
    padding-right: 30px !important;
}

.p-b-lg {
    padding-bottom: 30px !important;
}

.p-l-lg {
    padding-left: 30px !important;
}

.p-x-lg {
    padding-left: 30px !important;
    padding-right: 30px !important;
}

.p-y-lg {
    padding-bottom: 30px !important;
    padding-top: 30px !important;
}

.p-a-n {
    padding: -10px !important;
}

.p-t-n {
    padding-top: -10px !important;
}

.p-r-n {
    padding-right: -10px !important;
}

.p-b-n {
    padding-bottom: -10px !important;
}

.p-l-n {
    padding-left: -10px !important;
}

.p-x-n {
    padding-left: -10px !important;
    padding-right: -10px !important;
}

.p-y-n {
    padding-bottom: -10px !important;
    padding-top: -10px !important;
}

.truncate {
    display: inline-block; /* DJD - dont delete this line if there is truncation issues, find another way... */
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: top;
    white-space: nowrap;
}

.truncate-block {
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: top;
    white-space: nowrap;
}

.link-muted {
    color: #777;
}

    .link-muted:hover, .link-muted:focus {
        color: #d9230f;
        text-decoration: none;
    }

.link-inverted {
    color: #fff;
}

    .link-inverted:hover, .link-inverted:focus {
        color: #fff;
        text-decoration: none;
    }

.nowrap {
    white-space: nowrap;
}

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

.fz-lg {
    font-size: 18px;
}

.fz-sm {
    font-size: 12px;
}

.fz-2x {
    font-size: 2em;
}

.fz-3x {
    font-size: 3em;
}

.fz-4x {
    font-size: 4em;
}

.fz-5x {
    font-size: 5em;
}

.fw-l {
    font-weight: 300;
}

.fw-n {
    font-weight: 400;
}

.fw-sb {
    font-weight: 500;
}

.fw-b {
    font-weight: 600;
}

@font-face {
    font-family: 'Glyphicons Halflings';
    src: url(/Content/fonts/glyphicons-halflings-regular.eot);
    src: url(/Content/fonts/glyphicons-halflings-regular.eot?#iefix) format('embedded-opentype'), url(/Content/fonts/glyphicons-halflings-regular.woff2) format('woff2'), url(/Content/fonts/glyphicons-halflings-regular.woff) format('woff'), url(/Content/fonts/glyphicons-halflings-regular.ttf) format('truetype'), url(/Content/fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular) format('svg');
}

.glyphicon {
    position: relative;
    top: 1px;
    display: inline-block;
    font-family: 'Glyphicons Halflings';
    font-style: normal;
    font-weight: normal;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.glyphicon-asterisk:before {
    content: "\002a";
}

.glyphicon-plus:before {
    content: "\002b";
}

.glyphicon-euro:before,
.glyphicon-eur:before {
    content: "\20ac";
}

.glyphicon-minus:before {
    content: "\2212";
}

.glyphicon-cloud:before {
    content: "\2601";
}

.glyphicon-envelope:before {
    content: "\2709";
}

.glyphicon-pencil:before {
    content: "\270f";
}

.glyphicon-glass:before {
    content: "\e001";
}

.glyphicon-music:before {
    content: "\e002";
}

.glyphicon-search:before {
    content: "\e003";
}

.glyphicon-heart:before {
    content: "\e005";
}

.glyphicon-star:before {
    content: "\e006";
}

.glyphicon-star-empty:before {
    content: "\e007";
}

.glyphicon-user:before {
    content: "\e008";
}

.glyphicon-film:before {
    content: "\e009";
}

.glyphicon-th-large:before {
    content: "\e010";
}

.glyphicon-th:before {
    content: "\e011";
}

.glyphicon-th-list:before {
    content: "\e012";
}

.glyphicon-ok:before {
    content: "\e013";
}

.glyphicon-remove:before {
    content: "\e014";
}

.glyphicon-zoom-in:before {
    content: "\e015";
}

.glyphicon-zoom-out:before {
    content: "\e016";
}

.glyphicon-off:before {
    content: "\e017";
}

.glyphicon-signal:before {
    content: "\e018";
}

.glyphicon-cog:before {
    content: "\e019";
}

.glyphicon-trash:before {
    content: "\e020";
}

.glyphicon-home:before {
    content: "\e021";
}

.glyphicon-file:before {
    content: "\e022";
}

.glyphicon-time:before {
    content: "\e023";
}

.glyphicon-road:before {
    content: "\e024";
}

.glyphicon-download-alt:before {
    content: "\e025";
}

.glyphicon-download:before {
    content: "\e026";
}

.glyphicon-upload:before {
    content: "\e027";
}

.glyphicon-inbox:before {
    content: "\e028";
}

.glyphicon-play-circle:before {
    content: "\e029";
}

.glyphicon-repeat:before {
    content: "\e030";
}

.glyphicon-refresh:before {
    content: "\e031";
}

.glyphicon-list-alt:before {
    content: "\e032";
}

.glyphicon-lock:before {
    content: "\e033";
}

.glyphicon-flag:before {
    content: "\e034";
}

.glyphicon-headphones:before {
    content: "\e035";
}

.glyphicon-volume-off:before {
    content: "\e036";
}

.glyphicon-volume-down:before {
    content: "\e037";
}

.glyphicon-volume-up:before {
    content: "\e038";
}

.glyphicon-qrcode:before {
    content: "\e039";
}

.glyphicon-barcode:before {
    content: "\e040";
}

.glyphicon-tag:before {
    content: "\e041";
}

.glyphicon-tags:before {
    content: "\e042";
}

.glyphicon-book:before {
    content: "\e043";
}

.glyphicon-bookmark:before {
    content: "\e044";
}

.glyphicon-print:before {
    content: "\e045";
}

.glyphicon-camera:before {
    content: "\e046";
}

.glyphicon-font:before {
    content: "\e047";
}

.glyphicon-bold:before {
    content: "\e048";
}

.glyphicon-italic:before {
    content: "\e049";
}

.glyphicon-text-height:before {
    content: "\e050";
}

.glyphicon-text-width:before {
    content: "\e051";
}

.glyphicon-align-left:before {
    content: "\e052";
}

.glyphicon-align-center:before {
    content: "\e053";
}

.glyphicon-align-right:before {
    content: "\e054";
}

.glyphicon-align-justify:before {
    content: "\e055";
}

.glyphicon-list:before {
    content: "\e056";
}

.glyphicon-indent-left:before {
    content: "\e057";
}

.glyphicon-indent-right:before {
    content: "\e058";
}

.glyphicon-facetime-video:before {
    content: "\e059";
}

.glyphicon-picture:before {
    content: "\e060";
}

.glyphicon-map-marker:before {
    content: "\e062";
}

.glyphicon-adjust:before {
    content: "\e063";
}

.glyphicon-tint:before {
    content: "\e064";
}

.glyphicon-edit:before {
    content: "\e065";
}

.glyphicon-share:before {
    content: "\e066";
}

.glyphicon-check:before {
    content: "\e067";
}

.glyphicon-move:before {
    content: "\e068";
}

.glyphicon-step-backward:before {
    content: "\e069";
}

.glyphicon-fast-backward:before {
    content: "\e070";
}

.glyphicon-backward:before {
    content: "\e071";
}

.glyphicon-play:before {
    content: "\e072";
}

.glyphicon-pause:before {
    content: "\e073";
}

.glyphicon-stop:before {
    content: "\e074";
}

.glyphicon-forward:before {
    content: "\e075";
}

.glyphicon-fast-forward:before {
    content: "\e076";
}

.glyphicon-step-forward:before {
    content: "\e077";
}

.glyphicon-eject:before {
    content: "\e078";
}

.glyphicon-chevron-left:before {
    content: "\e079";
}

.glyphicon-chevron-right:before {
    content: "\e080";
}

.glyphicon-plus-sign:before {
    content: "\e081";
}

.glyphicon-minus-sign:before {
    content: "\e082";
}

.glyphicon-remove-sign:before {
    content: "\e083";
}

.glyphicon-ok-sign:before {
    content: "\e084";
}

.glyphicon-question-sign:before {
    content: "\e085";
}

.glyphicon-info-sign:before {
    content: "\e086";
}

.glyphicon-screenshot:before {
    content: "\e087";
}

.glyphicon-remove-circle:before {
    content: "\e088";
}

.glyphicon-ok-circle:before {
    content: "\e089";
}

.glyphicon-ban-circle:before {
    content: "\e090";
}

.glyphicon-arrow-left:before {
    content: "\e091";
}

.glyphicon-arrow-right:before {
    content: "\e092";
}

.glyphicon-arrow-up:before {
    content: "\e093";
}

.glyphicon-arrow-down:before {
    content: "\e094";
}

.glyphicon-share-alt:before {
    content: "\e095";
}

.glyphicon-resize-full:before {
    content: "\e096";
}

.glyphicon-resize-small:before {
    content: "\e097";
}

.glyphicon-exclamation-sign:before {
    content: "\e101";
}

.glyphicon-gift:before {
    content: "\e102";
}

.glyphicon-leaf:before {
    content: "\e103";
}

.glyphicon-fire:before {
    content: "\e104";
}

.glyphicon-eye-open:before {
    content: "\e105";
}

.glyphicon-eye-close:before {
    content: "\e106";
}

.glyphicon-warning-sign:before {
    content: "\e107";
}

.glyphicon-plane:before {
    content: "\e108";
}

.glyphicon-calendar:before {
    content: "\e109";
}

.glyphicon-random:before {
    content: "\e110";
}

.glyphicon-comment:before {
    content: "\e111";
}

.glyphicon-magnet:before {
    content: "\e112";
}

.glyphicon-chevron-up:before {
    content: "\e113";
}

.glyphicon-chevron-down:before {
    content: "\e114";
}

.glyphicon-retweet:before {
    content: "\e115";
}

.glyphicon-shopping-cart:before {
    content: "\e116";
}

.glyphicon-folder-close:before {
    content: "\e117";
}

.glyphicon-folder-open:before {
    content: "\e118";
}

.glyphicon-resize-vertical:before {
    content: "\e119";
}

.glyphicon-resize-horizontal:before {
    content: "\e120";
}

.glyphicon-hdd:before {
    content: "\e121";
}

.glyphicon-bullhorn:before {
    content: "\e122";
}

.glyphicon-bell:before {
    content: "\e123";
}

.glyphicon-certificate:before {
    content: "\e124";
}

.glyphicon-thumbs-up:before {
    content: "\e125";
}

.glyphicon-thumbs-down:before {
    content: "\e126";
}

.glyphicon-hand-right:before {
    content: "\e127";
}

.glyphicon-hand-left:before {
    content: "\e128";
}

.glyphicon-hand-up:before {
    content: "\e129";
}

.glyphicon-hand-down:before {
    content: "\e130";
}

.glyphicon-circle-arrow-right:before {
    content: "\e131";
}

.glyphicon-circle-arrow-left:before {
    content: "\e132";
}

.glyphicon-circle-arrow-up:before {
    content: "\e133";
}

.glyphicon-circle-arrow-down:before {
    content: "\e134";
}

.glyphicon-globe:before {
    content: "\e135";
}

.glyphicon-wrench:before {
    content: "\e136";
}

.glyphicon-tasks:before {
    content: "\e137";
}

.glyphicon-filter:before {
    content: "\e138";
}

.glyphicon-briefcase:before {
    content: "\e139";
}

.glyphicon-fullscreen:before {
    content: "\e140";
}

.glyphicon-dashboard:before {
    content: "\e141";
}

.glyphicon-paperclip:before {
    content: "\e142";
}

.glyphicon-heart-empty:before {
    content: "\e143";
}

.glyphicon-link:before {
    content: "\e144";
}

.glyphicon-phone:before {
    content: "\e145";
}

.glyphicon-pushpin:before {
    content: "\e146";
}

.glyphicon-usd:before {
    content: "\e148";
}

.glyphicon-gbp:before {
    content: "\e149";
}

.glyphicon-sort:before {
    content: "\e150";
}

.glyphicon-sort-by-alphabet:before {
    content: "\e151";
}

.glyphicon-sort-by-alphabet-alt:before {
    content: "\e152";
}

.glyphicon-sort-by-order:before {
    content: "\e153";
}

.glyphicon-sort-by-order-alt:before {
    content: "\e154";
}

.glyphicon-sort-by-attributes:before {
    content: "\e155";
}

.glyphicon-sort-by-attributes-alt:before {
    content: "\e156";
}

.glyphicon-unchecked:before {
    content: "\e157";
}

.glyphicon-expand:before {
    content: "\e158";
}

.glyphicon-collapse-down:before {
    content: "\e159";
}

.glyphicon-collapse-up:before {
    content: "\e160";
}

.glyphicon-log-in:before {
    content: "\e161";
}

.glyphicon-flash:before {
    content: "\e162";
}

.glyphicon-log-out:before {
    content: "\e163";
}

.glyphicon-new-window:before {
    content: "\e164";
}

.glyphicon-record:before {
    content: "\e165";
}

.glyphicon-save:before {
    content: "\e166";
}

.glyphicon-open:before {
    content: "\e167";
}

.glyphicon-saved:before {
    content: "\e168";
}

.glyphicon-import:before {
    content: "\e169";
}

.glyphicon-export:before {
    content: "\e170";
}

.glyphicon-send:before {
    content: "\e171";
}

.glyphicon-floppy-disk:before {
    content: "\e172";
}

.glyphicon-floppy-saved:before {
    content: "\e173";
}

.glyphicon-floppy-remove:before {
    content: "\e174";
}

.glyphicon-floppy-save:before {
    content: "\e175";
}

.glyphicon-floppy-open:before {
    content: "\e176";
}

.glyphicon-credit-card:before {
    content: "\e177";
}

.glyphicon-transfer:before {
    content: "\e178";
}

.glyphicon-cutlery:before {
    content: "\e179";
}

.glyphicon-header:before {
    content: "\e180";
}

.glyphicon-compressed:before {
    content: "\e181";
}

.glyphicon-earphone:before {
    content: "\e182";
}

.glyphicon-phone-alt:before {
    content: "\e183";
}

.glyphicon-tower:before {
    content: "\e184";
}

.glyphicon-stats:before {
    content: "\e185";
}

.glyphicon-sd-video:before {
    content: "\e186";
}

.glyphicon-hd-video:before {
    content: "\e187";
}

.glyphicon-subtitles:before {
    content: "\e188";
}

.glyphicon-sound-stereo:before {
    content: "\e189";
}

.glyphicon-sound-dolby:before {
    content: "\e190";
}

.glyphicon-sound-5-1:before {
    content: "\e191";
}

.glyphicon-sound-6-1:before {
    content: "\e192";
}

.glyphicon-sound-7-1:before {
    content: "\e193";
}

.glyphicon-copyright-mark:before {
    content: "\e194";
}

.glyphicon-registration-mark:before {
    content: "\e195";
}

.glyphicon-cloud-download:before {
    content: "\e197";
}

.glyphicon-cloud-upload:before {
    content: "\e198";
}

.glyphicon-tree-conifer:before {
    content: "\e199";
}

.glyphicon-tree-deciduous:before {
    content: "\e200";
}

.glyphicon-cd:before {
    content: "\e201";
}

.glyphicon-save-file:before {
    content: "\e202";
}

.glyphicon-open-file:before {
    content: "\e203";
}

.glyphicon-level-up:before {
    content: "\e204";
}

.glyphicon-copy:before {
    content: "\e205";
}

.glyphicon-paste:before {
    content: "\e206";
}

.glyphicon-alert:before {
    content: "\e209";
}

.glyphicon-equalizer:before {
    content: "\e210";
}

.glyphicon-king:before {
    content: "\e211";
}

.glyphicon-queen:before {
    content: "\e212";
}

.glyphicon-pawn:before {
    content: "\e213";
}

.glyphicon-bishop:before {
    content: "\e214";
}

.glyphicon-knight:before {
    content: "\e215";
}

.glyphicon-baby-formula:before {
    content: "\e216";
}

.glyphicon-tent:before {
    content: "\26fa";
}

.glyphicon-blackboard:before {
    content: "\e218";
}

.glyphicon-bed:before {
    content: "\e219";
}

.glyphicon-apple:before {
    content: "\f8ff";
}

.glyphicon-erase:before {
    content: "\e221";
}

.glyphicon-hourglass:before {
    content: "\231b";
}

.glyphicon-lamp:before {
    content: "\e223";
}

.glyphicon-duplicate:before {
    content: "\e224";
}

.glyphicon-piggy-bank:before {
    content: "\e225";
}

.glyphicon-scissors:before {
    content: "\e226";
}

.glyphicon-bitcoin:before {
    content: "\e227";
}

.glyphicon-btc:before {
    content: "\e227";
}

.glyphicon-xbt:before {
    content: "\e227";
}

.glyphicon-yen:before {
    content: "\00a5";
}

.glyphicon-jpy:before {
    content: "\00a5";
}

.glyphicon-ruble:before {
    content: "\20bd";
}

.glyphicon-rub:before {
    content: "\20bd";
}

.glyphicon-scale:before {
    content: "\e230";
}

.glyphicon-ice-lolly:before {
    content: "\e231";
}

.glyphicon-ice-lolly-tasted:before {
    content: "\e232";
}

.glyphicon-education:before {
    content: "\e233";
}

.glyphicon-option-horizontal:before {
    content: "\e234";
}

.glyphicon-option-vertical:before {
    content: "\e235";
}

.glyphicon-menu-hamburger:before {
    content: "\e236";
}

.glyphicon-modal-window:before {
    content: "\e237";
}

.glyphicon-oil:before {
    content: "\e238";
}

.glyphicon-grain:before {
    content: "\e239";
}

.glyphicon-sunglasses:before {
    content: "\e240";
}

.glyphicon-text-size:before {
    content: "\e241";
}

.glyphicon-text-color:before {
    content: "\e242";
}

.glyphicon-text-background:before {
    content: "\e243";
}

.glyphicon-object-align-top:before {
    content: "\e244";
}

.glyphicon-object-align-bottom:before {
    content: "\e245";
}

.glyphicon-object-align-horizontal:before {
    content: "\e246";
}

.glyphicon-object-align-left:before {
    content: "\e247";
}

.glyphicon-object-align-vertical:before {
    content: "\e248";
}

.glyphicon-object-align-right:before {
    content: "\e249";
}

.glyphicon-triangle-right:before {
    content: "\e250";
}

.glyphicon-triangle-left:before {
    content: "\e251";
}

.glyphicon-triangle-bottom:before {
    content: "\e252";
}

.glyphicon-triangle-top:before {
    content: "\e253";
}

.glyphicon-console:before {
    content: "\e254";
}

.glyphicon-superscript:before {
    content: "\e255";
}

.glyphicon-subscript:before {
    content: "\e256";
}

.glyphicon-menu-left:before {
    content: "\e257";
}

.glyphicon-menu-right:before {
    content: "\e258";
}

.glyphicon-menu-down:before {
    content: "\e259";
}

.glyphicon-menu-up:before {
    content: "\e260";
}

/*! Custom styles for this template */
html {
    height: 100%;
    -ms-overflow-style: scrollbar;
}

/*
    ##############################################
    Dorian -this code affects the scrolling in IOS
    commented - out - will delete on your return
    ##############################################
    body, html {
    overflow-x: hidden;
}
    */

/*AutoPlay Classes*/
.inline-block {
    display: inline-block;
}

.clearBlock {
    clear: both;
}

.float-right {
    float: right;
}

.float-left {
    float: left;
}

.autoplayCard {
    height: 210px;
}

.autoplayCardTestDrive {
    height: 230px;
}

.autoplayCardTradeIn {
    height: 150px;
}

.autoplayRed {
    color: #E52423;
}

.bg-autoplayRed {
    background-color: #E52423;
}

.bg-black {
    background-color: #000;
}


.cardImagePosition {
    width: 84px;
    margin: -35px 0 0;
}

.listingText {
    font-size: 13px;
    line-height: 20px;
    margin-bottom: 0;
}

.listingTextSmall {
    font-size: 11px;
    line-height: 17px;
    margin-bottom: 0;
}

.card-col2 {
    max-width: calc(80vw - 96px);
}

/* SPW-14059 - widen the label column so "Activity Type:" etc. aren't ellipsised;
   table-layout: fixed locks every row's column width to this table's first row */
.prospect-summary-table td.autoplay-image-80 {
    width: 110px;
    min-width: 110px;
}

/*SPW-13835 - wrap long unbreakable values (e.g. email) inside fixed-layout summary tables so they don't overflow the accordion */
.summary-value-wrap {
    overflow-wrap: anywhere;
    word-break: break-word;
}

.transformCircle img {
    border-radius: 100%;
    display: flex;
    flex: 0 0 80px;
    height: 60px;
    justify-content: center;
    overflow: hidden;
    position: relative;
    width: 80px;
}

.transformRectangle img {
    border-radius: 10%;
    display: flex;
    flex: 0 0 80px;
    height: 60px;
    justify-content: center;
    overflow: hidden;
    position: relative;
    width: 80px;
}

.spinnerCustomLocation {
    display: block !important;
    position: absolute !important;
    right: 30px !important;
    top: 10px !important;
    bottom: unset !important;
    left: unset !important;
}

.spinnerCenterContainer {
    display: block !important;
    position: absolute !important;
    right: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
}

.negativeLeft15 {
    margin-left: -15px;
}

.negativeLeft5 {
    margin-left: -5px;
}

.default-cursor {
    cursor: default !important;
}

/* DJD - seems to hide the dropdown icon on disabled select boxes. Hopefully it doesnt affect anything else...*/
select::-ms-expand {
    display: none;
}

select {
    -webkit-appearance: none;
    appearance: none;
}


/* DJD - end of select stuff for disabled select controls */

.white_text_dt_black_mb {
    color: #ffffff;
}

.padding_5_top {
    padding-top: 5px;
}

.no_padding_right_5 {
    padding: 0 5px 0 0;
    margin: 0;
}

.align_right_left_mobile {
    text-align: right;
}

.hr_1px {
    border-bottom: 1px solid #dddddd;
    margin: 0 0 6px;
    padding: 0;
    height: 1px;
    line-height: 1px;
}

.control-label-normal {
    font-weight: normal;
}

.clear15mb {
    clear: both;
    margin-bottom: 15px;
}
/* css stuff by Dorian */
.bodyoffer-dropdown-menu {
    color: #777;
    padding: 5px 10px 5px 10px;
    min-width: 300px;
    max-width: 300px;
    top: 28px;
    font-weight: normal;
}

    .bodyoffer-dropdown-menu > li {
        padding-bottom: 10px;
        white-space: normal;
    }

::-ms-clear {
    display: none;
}

.collapse-sub-menu {
    display: none;
}

.li-hover:hover {
    background-color: #E52423;
    color: #fff;
    cursor: pointer;
}

/*form.ng-submitted *.ng-invalid {
    border: 2px #E52423 solid;
}*/

/*form.ng-submitted input.ng-invalid {
    border: 2px #E52423 solid;
}*/

input.invalidHardMobileNumber:not(:focus) {
    border: 2px #E52423 solid !important;
}

input.invalidMobileNumber:not(:focus) {
    border: 2px orange solid;
}

select.invalidInsuranceValue + .select2-container--default {
    border: 2px orange solid !important;
}

input.ng-invalid.ng-dirty:not(:focus),
input.ng-invalid.ng-touched:not(:focus),
input.ng-invalid-oemrule:not(:focus),
input.ng-invalid-trademe:not(:focus) {
    border: 2px #E52423 solid;
}

input.ng-invalid.ng-dirty.date-input,
input.ng-invalid.ng-touched.date-input,
input.ng-invalid-oemrule.date-input,
input.ng-invalid-trademe.date-input {
    border: 1px #66afe9 solid;
}



input[name="contactMobile"].ng-invalid-remote.ng-dirty {
    border: 1px #66afe9 solid;
}

input[type="checkbox"].ng-invalid.ng-dirty:not(:focus),
input[type="checkbox"].ng-invalid.ng-touched:not(:focus),
input[type="checkbox"].ng-invalid.ng-untouched:not(:focus) {
    outline: 2px #E52423 solid;
}

textarea.ng-invalid.ng-dirty:not(:focus),
textarea.ng-invalid.ng-touched:not(:focus),
textarea.ng-invalid-oemrule:not(:focus),
textarea.ng-invalid-trademe:not(:focus) {
    border: 2px solid #E52423;
}


.select2-hidden-accessible.ng-invalid.ng-dirty + span .select2-selection--single,
.select2-hidden-accessible.ng-invalid-oemrule + span .select2-selection--single,
.select2-hidden-accessible.ng-invalid-trademe + span .select2-selection--single {
    border: 2px #E52423 solid !important;
    outline: none;
}

date-input.ng-invalid.ng-dirty div > span:first-child > span > input,
date-input.ng-invalid-oemrule div > span:first-child > span > input,
date-input.ng-invalid-trademe div > span:first-child > span > input {
    border: 2px #E52423 solid !important;
    outline: none;
}

/*SPW-10951*/
autoplay-text.ng-invalid.ng-dirty div > .cke_2 {
    border: 2px #E52423 solid !important;
    outline: none;
}

.autoplay-datepicker-invalid {
    border: 1px #66afe9 solid;
}

.autoplay-datepicker-valid {
    border: 1px solid #ddd !important;
}

.date-input-container input,
.date-input-container button {
    display: block;
    margin-bottom: 10px;
}

/*div.ng-empty.ng-dirty span.ui-select-toggle {
    border: 2px #E52423 solid;
}*/

.drop-box {
    background: #fff4f4;
    border: 2px dashed #E52423;
    border-radius: 8px;
    text-align: center;
}

    .drop-box.listing {
        width: 160px;
        height: 120px;
        padding: 35px 10px;
    }

    .drop-box.dragover {
        border: 2px dashed blue;
        cursor: pointer;
    }

.validation-summary {
    border: 2px #E52423 solid;
    color: #E52423;
    background-color: #fff;
    padding: 0 8px 0 8px;
    border-radius: 4px;
    margin-bottom: 10px;
}

.validation-item {
    color: #E52423;
}

.btn-banner-testdrive {
    color: #fff;
    background-color: #39a7aa;
}

.btn-banner-incentive {
    color: #fff;
    background-color: #db8f0d;
}

.btn-banner {
    border: none;
    margin-bottom: 5px;
}

    .btn-banner:hover {
        color: #fff;
    }

.m-b-5px {
    margin-bottom: 5px;
}

.btn-banner-promotion {
    color: #fff;
    background-color: #8a2051;
}

/* SPW-9789 */
.btn-banner-advertising {
    color: #fff;
    background-color: #8a2051;
}

.banner-central-database {
    color: #fff;
    background-color: #8a2051;
}

.btn-banner-location {
    color: #444;
    background-color: #ffdc00;
}

    .btn-banner-location:hover {
        color: #444;
    }

.btn-autoplay-label {
    border: none;
    margin-top: 6px;
    margin-bottom: 6px;
    font-weight: bold;
    text-transform: uppercase;
    color: #444;
    border-radius: 16px;
}

    .btn-autoplay-label:hover {
        color: #444;
    }

.btn-autoplay-label-sm {
    margin-bottom: 0px;
    font-size: 9px;
    font-weight: normal;
    height: 18px;
    padding-top: 2px;
    border-radius: 4px;
}

.btn-autoplay-label-xs {
    font-size: 9px;
    font-weight: normal;
    height: 14px;
    padding-top: 0;
    border-radius: 4px;
    margin-top: 0;
    margin-bottom: 0;
}

.autoplay-label-delete {
    position: absolute;
    top: -11px;
    right: -7px;
    height: 22px;
    width: 22px;
    border-radius: 50%;
    border: 2px solid #fff;
    line-height: 20px;
    vertical-align: central;
    text-align: center;
    background: radial-gradient(circle, #E52423, #E52423);
    color: #fff;
    cursor: pointer;
}

.panel-body-carousel {
    padding: 0px 15px 0px 15px;
}

.listing-price {
    font-weight: bold;
    color: #E52423;
}

.listing-price-original {
    color: #777;
    font-weight: normal;
    font-size: smaller;
    text-decoration: line-through;
}

.listing-price-cleanCarText {
    padding-left: 5px;
    font-weight: normal;
    font-size: smaller;
    color: #E52423;
    font-style: italic;
}

.listing-price-exGst {
    font-weight: normal;
    font-size: smaller;
    color: #E52423;
    display: block;
}

.glyphicon.glyphicon-remove {
    color: #777 !important;
}

.event-completed {
    text-decoration: line-through;
}

.noselect {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
}

/*custom row heights for datatables*/
#thumbnailTable tbody > tr {
    height: 77px;
}

#listingTable tbody > tr {
    height: 77px;
}

#prospectTable tbody > tr {
    height: 77px;
}

#testDriveTable tbody > tr {
    height: 77px;
}

#trademeTable tbody > tr {
    height: 77px;
}

#leadTable tbody > tr {
    height: 97px;
}

#selectContactTable tbody > tr {
    height: 77px;
}

#imageBankTable tbody > tr {
    height: 77px;
}

#bodyImageTable tbody > tr {
    height: 77px;
}

td.wrapok {
    white-space: normal !important
}

.company-name {
    font-size: 15px;
    font-weight: bold;
    display: inline-block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #000;
}

.user-name {
    font-size: 15px;
    font-weight: bold;
    display: inline-block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.spinner {
    position: fixed;
    z-index: 1060;
    margin: auto;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: rgba(255, 255, 255, .2) 50% 50% no-repeat;
    pointer-events: all;
}

/*SPW-12764*/
.spinner-click-through {
    pointer-events: none;
}

.autoplay-image .spinner {
    z-index: 998;
}

.spinner-fullscreen {
    z-index: 100;
    height: 100%;
    width: 100%;
}

/* used by text input search buttons */
.search-field-wrapper {
    position: relative;
    display: block;
    margin-top: -2px;
}

    .search-field-wrapper .pr14 {
        padding-right: 35px !important;
        height: 34px;
    }

    .search-field-wrapper .search {
        position: absolute;
        right: 25px;
        top: 11px;
        color: #777;
    }

        .search-field-wrapper .search:hover {
            cursor: pointer;
            color: #E52423;
        }

    .search-field-wrapper .clear {
        position: absolute;
        right: 7px;
        top: 9px;
        color: #777;
        font-size: 15px;
    }

        .search-field-wrapper .clear:hover {
            cursor: pointer;
            color: #E52423;
        }

.accordion-buttons {
    margin-top: -6px;
}

/* END used by text input clear buttons */
/*.icon:hover {
    cursor: pointer;
    color: #E52423;
    opacity: 0.8;
}*/
/* used by text input clear buttons */
.clear-field-wrapper {
    position: relative;
    display: inline-block;
}

    .clear-field-wrapper .pr14 {
        padding-right: 20px !important;
    }

    .clear-field-wrapper .clear {
        position: absolute;
        right: 7px;
        top: 9px;
        color: #777;
    }

        .clear-field-wrapper .clear:hover {
            cursor: pointer;
            color: #E52423;
        }

/* END used by text input clear buttons */

/* used by text input peekaboo buttons */
.peekaboo-field-wrapper {
    position: relative;
}

    .peekaboo-field-wrapper .peekaboo-text {
        position: absolute;
        left: 5px;
        bottom: 7px;
        width: 97%;
        padding-left: 5px;
        color: #f5f5f5;
        background-color: #777;
        text-align: center;
        cursor: pointer;
    }

    .peekaboo-field-wrapper .peekaboo-icon {
        position: absolute;
        left: 94%;
        bottom: 12px;
        color: #777;
        font-size: 18px;
    }

        .peekaboo-field-wrapper .peekaboo-icon:hover {
            cursor: pointer;
            color: #E52423;
        }

/* END used by text input peekaboo buttons */

.date-field-wrapper {
    position: relative;
    display: inline-block;
    width: 100%;
}

    .date-field-wrapper .calendar {
        position: absolute;
        right: 7px;
        top: 9px;
        color: #777;
    }

        .date-field-wrapper .calendar:hover {
            cursor: pointer;
            color: #E52423;
        }

/*Custom CSS For Placement of Calender with Time*/
.dateTimeDiv {
    position: relative;
    height: 60px;
}

.customDatePlacement {
    width: 50%;
    display: inline-block;
    position: absolute;
    top: 5px;
    left: 0;
}

.customTimePlacement {
    width: 48%;
    display: inline-block;
    position: absolute;
    top: -25px;
    right: 0;
}

.customInlineTimePlacement {
    margin-top: -10px;
    display: inline-block;
}

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

.font-size-36 {
    font-size: 36px;
}

.font-size-32 {
    font-size: 32px;
}

.font-size-28 {
    font-size: 28px;
}

.font-size-26 {
    font-size: 26px;
}

.font-size-24 {
    font-size: 24px;
}

.font-size-22 {
    font-size: 22px;
}

.font-size-20 {
    font-size: 20px;
}

.font-size-18 {
    font-size: 18px;
}

.font-size-17 {
    font-size: 17px;
}

.font-size-16 {
    font-size: 16px;
}

.font-size-15 {
    font-size: 15px;
}

.font-size-14 {
    font-size: 14px;
}

.font-size-13 {
    font-size: 13px;
}

.font-size-12 {
    font-size: 12px;
}

.font-size-11 {
    font-size: 11px;
}

.font-size-11-normal {
    font-size: 11px;
    font-weight: normal;
}

.font-size-10-normal {
    font-size: 11px;
    font-weight: normal;
}

.mobile-avatar-ellipsis {
    font-size: 24px;
    font-weight: 100;
    padding-top: 6px;
}

.mobile-avatar-dropdown {
    width: 75%;
    margin-left: 10px;
    margin-top: 7px;
}


/* END css stuff by Dorian */

.btn-clearfilters {
    color: #fff;
    background-color: #474949;
    border-color: #474949;
    border: none;
    text-transform: uppercase;
    font-size: 22px;
    padding-top: 4px;
    min-height: 34px !important;
}

    .btn-clearfilters:focus,
    .btn-clearfilters.focus {
        color: #fff;
        background-color: #474949;
        border-color: #474949;
        border: none;
    }

    .btn-clearfilters:hover {
        color: #fff;
        background-color: #474949 !important;
        border-color: #474949;
        border: none;
    }

    .btn-clearfilters:active,
    .btn-clearfilters.active {
        color: #fff;
        background-color: #474949;
        border-color: #474949;
        background-image: none;
        border: none;
    }

    .btn-clearfilters:disabled {
        color: #fff;
        background-color: #ddd !important;
        border-color: #ddd;
        border: none;
    }

.btn-grey {
    color: #fff;
    background-color: #888;
    border-color: #888;
    border: none;
    text-transform: uppercase;
    font-size: 13px;
}

    .btn-grey:focus,
    .btn-grey.focus {
        color: #fff;
        background-color: #888;
        border-color: #888;
        border: none;
    }

    .btn-grey:hover {
        color: #fff;
        background-color: #888 !important;
        border-color: #888;
        border: none;
    }

    .btn-grey:active,
    .btn-grey.active,
    .open > .dropdown-toggle.btn-grey {
        color: #fff;
        background-color: #888;
        border-color: #888;
        background-image: none;
        border: none;
    }

    .btn-grey.disabled, .btn-grey[disabled],
    fieldset[disabled] .btn-grey {
        opacity: 0.2;
        filter: alpha(opacity=20);
        cursor: default;
    }

.btn-edit {
    color: #fff;
    background-color: #5cb85c;
    border-color: #5cb85c;
    border: none;
    text-transform: uppercase;
    font-size: 13px;
}

    .btn-edit:focus,
    .btn-edit.focus {
        color: #fff;
        background-color: #5cb85c;
        border-color: #5cb85c;
        border: none;
    }

    .btn-edit:hover {
        color: #fff;
        background-color: #5cb85c;
        border-color: #5cb85c;
        border: none;
    }

    .btn-edit:active,
    .btn-edit.active,
    .open > .dropdown-toggle.btn-edit {
        color: #fff;
        background-color: #5cb85c;
        border-color: #5cb85c;
        background-image: none;
        border: none;
    }

    .btn-edit.disabled, .btn-edit[disabled],
    fieldset[disabled] .btn-edit {
        opacity: 0.2;
        filter: alpha(opacity=20);
        cursor: default;
    }

.btn-white {
    color: #5cb85c;
    background-color: #fff;
    border-color: #fff;
    border: none;
    text-transform: uppercase;
    font-size: 13px;
}

    .btn-white:focus,
    .btn-white.focus {
        color: #5cb85c;
        background-color: #fff;
        border-color: #fff;
        border: none;
    }

    .btn-white:hover {
        color: #5cb85c;
        background-color: #fff;
        border-color: #fff;
        border: none;
    }

    .btn-white:active,
    .btn-white.active,
    .open > .dropdown-toggle.btn-white {
        color: #5cb85c;
        background-color: #fff;
        border-color: #fff;
        border: none;
        background-image: none;
    }

.btn-red-icon {
    color: #fff;
    background-color: #E52423;
    border-color: #E52423;
    border: none;
}

    .btn-red-icon:focus,
    .btn-red-icon.focus {
        color: #fff;
        background-color: #E52423;
        border-color: #E52423;
        border: none;
    }

    .btn-red-icon:hover {
        color: #fff;
        background-color: #E52423;
        border-color: #E52423;
        border: none;
    }

    .btn-red-icon:active,
    .btn-red-icon.active,
    .open > .dropdown-toggle.btn-red-icon {
        color: #fff;
        background-color: #E52423;
        border-color: #E52423;
        border: none;
    }

    .btn-red-icon.disabled, .btn-red-icon[disabled],
    fieldset[disabled] .btn-red-icon {
        opacity: 0.2;
        filter: alpha(opacity=20);
        cursor: default;
    }

.btn-grey-icon {
    color: #fff;
    background-color: #888;
    border-color: #888;
    border: none;
}

    .btn-grey-icon:focus,
    .btn-grey-icon.focus {
        color: #fff;
        background-color: #888;
        border-color: #888;
        border: none;
    }

    .btn-grey-icon:hover {
        color: #fff;
        background-color: #888;
        border-color: #888;
        border: none;
    }

    .btn-grey-icon:active,
    .btn-grey-icon.active,
    .open > .dropdown-toggle.btn-grey-icon {
        color: #fff;
        background-color: #888;
        border-color: #888;
        border: none;
    }

    .btn-grey-icon.disabled, .btn-grey-icon[disabled],
    fieldset[disabled] .btn-grey-icon {
        opacity: 0.2;
        filter: alpha(opacity=20);
        cursor: default;
    }

.btn-grey-icon-2 {
    color: #888;
    background-color: #fff;
    border-color: #fff;
    border: none;
    padding: 0 !important;
}

    .btn-grey-icon-2:focus,
    .btn-grey-icon-2.focus {
        color: #888;
        background-color: #fff;
        border-color: #fff;
        border: none;
    }

    .btn-grey-icon-2:hover {
        color: #E52423;
        background-color: #fff;
        border-color: #fff;
        border: none;
    }

    .btn-grey-icon-2:active,
    .btn-grey-icon-2.active,
    .open > .dropdown-toggle.btn-grey-icon-2 {
        color: #888;
        background-color: #fff;
        border-color: #fff;
        border: none;
    }

    .btn-grey-icon-2.disabled, .btn-grey-icon-2[disabled],
    fieldset[disabled] .btn-grey-icon-2 {
        opacity: 0.2;
        filter: alpha(opacity=20);
        cursor: default;
    }

.btn-green-icon {
    color: #fff;
    background-color: #5cb85c;
    border-color: #5cb85c;
    border: none;
}

    .btn-green-icon:focus,
    .btn-green-icon.focus {
        color: #fff;
        background-color: #5cb85c;
        border-color: #5cb85c;
        border: none;
    }

    .btn-green-icon:hover {
        color: #fff;
        background-color: #5cb85c;
        border-color: #5cb85c;
        border: none;
    }

    .btn-green-icon:active,
    .btn-green-icon.active,
    .open > .dropdown-toggle.btn-green-icon {
        color: #fff;
        background-color: #5cb85c;
        border-color: #5cb85c;
        border: none;
    }

    .btn-green-icon.disabled, .btn-green-icon[disabled],
    fieldset[disabled] .btn-green-icon {
        opacity: 0.2;
        filter: alpha(opacity=20);
        cursor: default;
    }

.btn-small {
    height: 20px;
    padding: 0 10px;
    /*line-height: 1;*/
}

.btn-smaller {
    height: 20px;
    padding: 0 5px;
    font-size: 11px;
    /*line-height: 1;*/
}

.btn-autoplay {
    color: #fff;
    background-color: #E52423;
    border-color: #E52423;
    border: none;
    text-transform: uppercase;
    font-size: 13px;
}

    .btn-autoplay:focus,
    .btn-autoplay.focus {
        color: #fff;
        background-color: #E52423;
        border-color: #E52423;
    }

    .btn-autoplay:hover {
        color: #fff;
        background-color: #E52423;
        border-color: #E52423;
    }

    .btn-autoplay:active,
    .btn-autoplay.active,
    .open > .dropdown-toggle.btn-autoplay {
        color: #fff;
        background-color: #E52423;
        border-color: #E52423;
        background-image: none;
    }

        .btn-autoplay:active:hover,
        .btn-autoplay.active:hover,
        .open > .dropdown-toggle.btn-autoplay:hover,
        .btn-autoplay:active:focus,
        .btn-autoplay.active:focus,
        .open > .dropdown-toggle.btn-autoplay:focus,
        .btn-autoplay:active.focus,
        .btn-autoplay.active.focus,
        .open > .dropdown-toggle.btn-autoplay.focus {
            color: #fff;
            background-color: #E52423;
            border-color: #E52423;
        }

    .btn-autoplay.disabled:hover,
    .btn-autoplay[disabled]:hover,
    fieldset[disabled] .btn-autoplay:hover,
    .btn-autoplay.disabled:focus,
    .btn-autoplay[disabled]:focus,
    fieldset[disabled] .btn-autoplay:focus,
    .btn-autoplay.disabled.focus,
    .btn-autoplay[disabled].focus,
    fieldset[disabled] .btn-autoplay.focus {
        background-color: #E52423;
        border-color: #E52423;
    }

    .btn-autoplay.disabled, .btn-autoplay[disabled],
    fieldset[disabled] .btn-autoplay {
        opacity: 0.2;
        filter: alpha(opacity=20);
        cursor: default;
    }


    .btn-autoplay .badge {
        color: #E52423;
        background-color: #fff;
    }

.btn-transparent {
    background-color: transparent;
    border-color: #ccc;
}

.input-field-count {
    float: right;
    position: relative;
    bottom: 26px;
    right: 5px;
    color: #777;
    font-style: italic;
    top: -59px;
    margin-bottom: -15px;
}

.textarea-field-count {
    float: right;
    position: relative;
    right: 5px;
    color: #777;
    font-style: italic;
}

.autoplaytext-field-count {
    float: right;
    position: relative;
    right: 5px;
    color: #777;
    font-style: italic;
}

.field-metadata {
    float: right;
    position: relative;
    bottom: 26px;
    right: 5px;
    color: #777;
    font-style: italic;
    top: -59px;
    height: 0px;
}

.italic {
    font-style: italic;
}

.navbar {
    border: none;
    border-radius: 0;
    margin-bottom: 0;
}

.navbar-brand-center {
    display: block;
    left: 55%;
    position: absolute;
    top: 0;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    white-space: nowrap;
}

.autoplay-lbl-chb input {
    width: 15px;
    height: 15px;
    float: left;
    margin: 2px 5px 0;
}

.autoplay-lbl-chb label {
    font-size: 12px;
    line-height: 20px;
    padding: 0;
    margin: 0 0 5px 0;
    display: inline-flex; /* keeps the label left-aligned if it wraps on mobile device - SPW-662 */
}

@media (min-width: 768px) {
    .navbar-brand-center {
        left: 50%;
    }
}

.navbar-toggler .arrow-up:before,
.navbar-toggler .arrow-up:after {
    bottom: 0;
    -webkit-transition: bottom 0.3s;
    -o-transition: bottom 0.3s;
    transition: bottom 0.3s;
}

.navbar-toggler.collapsed .arrow-up:before,
.navbar-toggler.collapsed .arrow-up:after {
    bottom: -8px;
}

.navbar-toggler .ellipsis-object {
    background-color: #fff;
    border: 1px solid #fff;
}

.navbar-account-btn {
    background-color: transparent;
    background-image: none;
    border: none;
    cursor: pointer;
    display: inline-block;
    outline: none;
    /*padding-left: 15px;
    padding-right: 10px;*/
    height: 50px;
    text-align: center;
    vertical-align: middle;
    white-space: nowrap;
}

.navbar-upgrade-heading {
    line-height: 1.538462;
    margin-bottom: 0;
    margin-top: 0;
}

.navbar-upgrade-notification {
    color: inherit;
    display: block;
}

.navbar-upgrade-version {
    color: #808080;
    padding: 5px 15px;
}

.navbar-search {
    display: block;
    height: 50px;
    overflow: hidden;
    position: relative;
    -webkit-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: all;
    -o-transition-property: all;
    transition-property: all;
    width: 400px;
}

.navbar-search-toggler {
    background-color: transparent;
    background-image: none;
    border: none;
    cursor: pointer;
    display: block;
    font-size: 13px;
    height: 50px;
    left: 0;
    line-height: 50px;
    outline: none;
    padding: 0;
    position: absolute;
    text-align: center;
    top: 0;
    width: 50px;
}

.navbar-search-input {
    background-color: transparent;
    background-image: none;
    border: none;
    display: block;
    font-size: 13px;
    height: 50px;
    line-height: 50px;
    outline: none;
    padding-left: 50px;
    padding-right: 70px;
    text-overflow: ellipsis;
    width: 100%;
}

.navbar-search-adv-btn {
    background-color: transparent;
    background-image: none;
    border: none;
    cursor: pointer;
    display: block;
    font-size: 10px;
    line-height: 20px;
    min-width: 70px;
    outline: none;
    padding: 15px 10px;
    position: absolute;
    right: 0;
    text-align: right;
    top: 0;
    -webkit-transition-delay: 0.6s;
    -o-transition-delay: 0.6s;
    transition-delay: 0.6s;
    -webkit-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -webkit-transition-property: right;
    -o-transition-property: right;
    transition-property: right;
}

.navbar-search-collapsed {
    -webkit-transition-delay: 0.6s;
    -o-transition-delay: 0.6s;
    transition-delay: 0.6s;
    width: 50px;
}

    .navbar-search-collapsed .navbar-search-adv-btn {
        right: -70px;
        -webkit-transition-delay: 0s;
        -o-transition-delay: 0s;
        transition-delay: 0s;
    }

.dropdown-menu li > a.disabled {
    color: lightgray;
}

    .dropdown-menu li > a.disabled:hover {
        color: lightgray;
        background-color: white;
        cursor: default;
    }

.greyHeader_subMenu-dropdown-menu-right {
    left: auto;
    right: -4px !important;
    top: 29px;
    min-width: 210px;
    max-height: 70vh;
}

    .greyHeader_subMenu-dropdown-menu-right li a img {
        width: 12px;
        height: 12px;
    }

    .greyHeader_subMenu-dropdown-menu-right:before,
    .greyHeader_subMenu-dropdown-menu-right:after {
        left: auto;
        right: 8px;
    }

.redHeader_dropdown-menu-right {
    left: auto;
    right: 3px !important;
    min-width: 250px;
}

    .redHeader_dropdown-menu-right li a img {
        width: 12px;
        height: 12px;
    }

    .redHeader_dropdown-menu-right:before,
    .redHeader_dropdown-menu-right:after {
        left: auto;
        right: 8px;
    }

.dropdown-menu-right {
    left: auto;
    right: 3px !important;
    top: 29px;
    min-width: 250px;
}

    .dropdown-menu-right li a img {
        width: 12px;
        height: 12px;
    }

    .dropdown-menu-right:before,
    .dropdown-menu-right:after {
        left: auto;
        right: 8px;
    }

#greySubMenu_Fixed {
    width: 100%;
    position: fixed;
    top: 50px;
    z-index: 90;
}

#greyHeader_subMenu {
    background-color: #dddddd;
    height: 40px;
    padding-left: 5px;
    padding-right: 5px;
}

    #greyHeader_subMenu .greyHeader_subMenu_left {
        padding-top: 5px;
    }

    #greyHeader_subMenu .greyHeader_subMenu_left_advanced_search {
        padding-top: 11px;
        margin-left: 3px;
    }

    #greyHeader_subMenu .greyHeader_subMenu_right {
        padding-top: 8px;
    }

        #greyHeader_subMenu .greyHeader_subMenu_right li {
            margin-left: 7px;
        }

    #greyHeader_subMenu .greyHeader_subMenu_more li {
        margin-left: 0px;
        list-style-type: none;
    }

    #greyHeader_subMenu .greyHeader_subMenu_subItems li {
        margin-left: -30px;
    }

@media (max-width: 767px) {
    .greyHeader_subMenu_left.pull-left {
        margin-left: 0px !important;
    }
}

/*SPW-6750*/
@media (max-width: 340px) {

    .greyHeader_subMenu_right li {
        padding: 0 !important;
        margin: 0 !important;
    }
}

@media (max-width: 380px) {

    .greyHeader_subMenu_right li {
        margin: 0 !important;
    }
}

@media (min-width: 769px) and (max-width: 925px) {
    .filter-preset-container {
        width: 110px !important;
    }

    .greyHeader_subMenu_right li {
        margin: 0 !important;
        padding: 0 2px 0 2px !important;
    }
}


@media (max-width: 300px) {
    .greyHeader_subMenu_right li {
        display: none;
    }

        .greyHeader_subMenu_right li:nth-last-of-type(-n+2) {
            display: inline;
        }
}

.greyHeader_subMenu_support {
    padding-left: 0;
    width: 450px;
    overflow-x: hidden;
}

.greyHeader_subMenu_support_subItem {
    overflow: hidden;
    white-space: nowrap !important;
    text-overflow: ellipsis;
    display: inline-block !important;
    width: 425px;
    padding-top: 0;
    padding-bottom: 0;
}


@media (max-width: 480px) and (orientation:portrait) {
    .greyHeader_subMenu_support {
        width: 98vw;
    }

    .greyHeader_subMenu_support_subItem {
        width: 90vw;
    }
}



.greyHeader_subMenu_support li > a {
    padding-left: 10px;
    color: black;
    font-weight: bold;
}

/*.greyHeader_subMenu_support li > ul > li:hover {
    background-color: #2F96B4;
    color: white;
}*/

.greyHeader_subMenu_support li > ul > li > a {
    padding-left: 5px;
    font-weight: normal;
    font-size: 13px;
    color: #777;
}

    .greyHeader_subMenu_support li > ul > li > a.allarticles {
        font-style: italic;
        font-weight: bold;
        color: black;
    }

        .greyHeader_subMenu_support li > ul > li > a.allarticles:hover {
            color: white;
        }

.greyHeader_subMenu_right li > ul > li > a.disabled {
    color: lightgray;
}

    .greyHeader_subMenu_right li > ul > li > a.disabled:hover {
        color: lightgray;
        background-color: white;
        cursor: default;
    }

.dropdown-menu-lg {
    padding: 0;
    width: 420px;
}

.dropdown-header {
    border-bottom: 1px solid #ddd;
    padding: 10px 15px;
}

.dropdown-body {
    height: 304px;
    overflow-x: hidden;
    overflow-y: auto;
    position: relative;
}

.dropdown-heading {
    line-height: 20px;
    margin-bottom: 0;
    margin-top: 0;
    overflow: hidden;
}

.dropdown-link {
    float: right;
    line-height: 20px;
}

.dropdown-btn {
    background-color: transparent;
    background-image: none;
    border-color: #ddd;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
    border-style: solid;
    border-width: 1px 0 0;
    color: #444;
    cursor: pointer;
    display: block;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.5;
    outline: none;
    padding: 5px 10px;
    text-align: center;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    vertical-align: middle;
    white-space: nowrap;
    width: 100%;
}

    .dropdown-btn:hover,
    .dropdown-btn:focus {
        background-color: #d9230f;
        border-color: #d9230f;
        color: #fff;
        text-decoration: none;
    }

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

.notification:after {
    clear: both;
}

.notification-media {
    float: left;
    margin-right: 10px;
}

.notification-content {
    overflow: hidden;
}

.notification-heading {
    line-height: 20px;
    margin-bottom: 0;
    margin-top: 0;
}

.notification-timestamp {
    float: right;
    font-size: 12px;
    line-height: 20px;
}

.notification-text {
    margin-bottom: 0;
}

.sidenav-toggler {
    background-color: transparent;
    background-image: none;
    border: none;
    display: block;
    float: left;
    height: 50px;
    line-height: 50px;
    margin-left: -15px;
    outline: none;
    overflow: hidden;
    padding: 0;
    position: relative;
    -webkit-transition: background-color 1s;
    -o-transition: background-color 1s;
    transition: background-color 1s;
    width: 50px;
}

    .sidenav-toggler.collapsed {
        width: 50px;
    }

.navbar-default .navbar-header {
    background-color: #E52423;
}

.navbar-default .navbar-toggler .arrow-up:before,
.navbar-default .navbar-toggler .arrow-up:after {
    border-bottom-color: #fff;
}

.navbar-default .navbar-account-btn {
    color: #fff;
}

    .navbar-default .navbar-account-btn:hover,
    .navbar-default .navbar-account-btn:focus {
        /*background-color: #fff;*/
        color: #fff;
    }

.navbar-default .open .navbar-account-btn,
.navbar-default .open .user-account-btn:hover,
.navbar-default .open .user-account-btn:focus {
    background-color: #ddd;
    color: #222;
}

.navbar-default .navbar-search-collapsed {
    background-color: #fff;
    color: #777;
}

.navbar-default .navbar-search-toggler {
    color: #777;
}

    .navbar-default .navbar-search-toggler:hover {
        background-color: #fff;
        color: #d9230f;
    }

.navbar-default .navbar-search-input {
    color: #777;
}

    .navbar-default .navbar-search-input::-moz-placeholder {
        color: #ddd;
        opacity: 1;
    }

    .navbar-default .navbar-search-input:-ms-input-placeholder {
        color: #ddd;
    }

    .navbar-default .navbar-search-input::-webkit-input-placeholder {
        color: #ddd;
    }

.navbar-default .navbar-search-adv-btn {
    color: #777;
}

.navbar-default .sidenav-toggler.collapsed {
    background-color: #E52423;
}

.navbar-default .sidenav-toggler .bar-line.in {
    /*background-color: #d9230f;*/
}

.navbar-inverse .navbar-toggler .arrow-up:before,
.navbar-inverse .navbar-toggler .arrow-up:after {
    border-bottom-color: #d9230f;
}

.navbar-inverse .navbar-account-btn {
    color: #fff;
}

    .navbar-inverse .navbar-account-btn:hover,
    .navbar-inverse .navbar-account-btn:focus {
        background-color: #ea2610;
        color: #fff;
    }

.navbar-inverse .open .navbar-account-btn,
.navbar-inverse .open .user-account-btn:hover,
.navbar-inverse .open .user-account-btn:focus {
    background-color: #ea2610;
    color: #fff;
}

.navbar-inverse .navbar-search {
    background-color: #ea2610;
    color: #fff;
}

.navbar-inverse .navbar-search-collapsed {
    background-color: #d9230f;
    color: #fff;
}

.navbar-inverse .navbar-search-toggler {
    color: #fff;
}

    .navbar-inverse .navbar-search-toggler:hover {
        background-color: #ea2610;
        color: #fff;
    }

.navbar-inverse .navbar-search-input {
    color: #fff;
}

    .navbar-inverse .navbar-search-input::-moz-placeholder {
        color: rgba(255, 255, 255, 0.75);
        opacity: 1;
    }

    .navbar-inverse .navbar-search-input:-ms-input-placeholder {
        color: rgba(255, 255, 255, 0.75);
    }

    .navbar-inverse .navbar-search-input::-webkit-input-placeholder {
        color: rgba(255, 255, 255, 0.75);
    }

.navbar-inverse .navbar-search-adv-btn {
    color: #fff;
}

.navbar-inverse .sidenav-toggler.collapsed {
    background-color: #ea2610;
}

.sidenav-search .form-group {
    margin-bottom: 0;
}

.layout-content-body {
    -webkit-animation-duration: 1s;
    -o-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    -o-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: fadeInRight;
    -o-animation-name: fadeInRight;
    animation-name: fadeInRight;
    float: left;
    padding: 0px 3px 3px 3px;
    visibility: visible;
    width: 100%;
}

.layout-footer-body {
    padding: 5px 15px;
}

.title-bar {
    margin-bottom: 10px;
}

.title-bar-title {
    color: #fff;
    display: inline-block;
    font-size: 18px;
    margin-left: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

    .title-bar-title .title-bar-single-line {
        margin-top: 12px;
    }

    .title-bar-title .title-bar-two-lines {
        margin-top: 3px;
    }

    .title-bar-title .title-bar-subtitle {
        display: block;
        font-size: 12px;
        font-weight: normal;
        line-height: 1;
    }

/*To Fix user information, top right of screen*/
.relative_pos {
    position: relative;
    z-index: 1;
}

.absolute_pos {
    position: absolute !important;
    top: 0;
    right: 90px;
    z-index: 20;
}


@media (max-width: 767px) {
    .title-bar-title {
        font-size: 15px;
    }

        .title-bar-title .title-bar-single-line {
            margin-top: 14px;
        }

        .title-bar-title .title-bar-two-lines {
            margin-top: 5px;
        }
}

.sidenav-bottom-padding {
    padding-bottom: 0px;
}



.title-bar-title-full {
    width: 50%;
}

.title-bar-title-collapsed {
    width: 50%;
}

@media (min-width: 1024px) {
    .title-bar-title-full {
        width: 70%;
    }

    .title-bar-title-collapsed {
        width: 65%;
    }
}

.title-bar-actions {
    float: right;
}

.title-bar-shortcut {
    color: inherit;
    display: inline-block;
    font-family: FontAwesome;
    font-size: 20px;
    font-style: normal;
    line-height: 1;
    position: relative;
}

    .title-bar-shortcut:hover,
    .title-bar-shortcut:focus {
        color: inherit;
        text-decoration: none;
    }

    .title-bar-shortcut:before {
        color: transparent;
        content: "\f005";
        display: block;
        -webkit-transition: color 0.3s;
        -o-transition: color 0.3s;
        transition: color 0.3s;
    }

    .title-bar-shortcut:after {
        content: "\f006";
        display: block;
        height: 100%;
        left: 0;
        opacity: 0.5;
        position: absolute;
        top: 0;
        width: 100%;
    }

    .title-bar-shortcut:hover:before {
        color: #ffeb3b;
    }

    .title-bar-shortcut.active:before,
    .title-bar-shortcut.active:hover:before {
        color: #fbc02d;
    }

.title-bar-description {
    margin-bottom: 0;
    margin-top: -5px;
}

.version {
    float: right;
}

.page-layouts-link {
    display: block;
    opacity: 0.75;
}

    .page-layouts-link:hover,
    .page-layouts-link:focus {
        opacity: 1;
    }

.nav .open > a,
.nav .open > a:hover,
.nav .open > a:focus {
    border-color: transparent;
}

.custom-scrollbar-inner {
    padding: 20px 30px;
}

.dropdown-menu.inner:before,
.dropdown-menu.inner:after {
    content: normal;
    display: none;
}

.jqvmap-zoomin,
.jqvmap-zoomout {
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
}

.img-flag {
    display: inline-block;
    height: 15px;
    margin-right: 5px;
    width: 20px;
}

.select2-dropdown {
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.spinner-inverse:after {
    border-color: #fff transparent transparent;
}

.card-actions {
    /*right: 15px;*/
    list-style: none;
    margin-bottom: 0;
    /*margin-top: -8px;*/
    padding-left: 0;
    /*position: absolute;*/
    top: 50%;
}

.card-action {
    background-color: transparent;
    background-image: none;
    border: none;
    border-radius: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    color: inherit;
    cursor: pointer;
    display: block;
    float: left;
    font-family: FontAwesome;
    font-size: 13px;
    font-style: normal;
    font-weight: 400;
    height: 16px;
    line-height: 16px;
    margin-bottom: 0;
    -moz-osx-font-smoothing: grayscale;
    -ms-touch-action: manipulation;
    opacity: 0.75;
    padding: 0;
    position: relative;
    text-align: center;
    text-rendering: auto;
    touch-action: manipulation;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    vertical-align: middle;
    -webkit-font-smoothing: antialiased;
    white-space: nowrap;
    width: 16px;
}

    .card-action + .card-action {
        margin-left: 5px;
    }

    .card-action:hover,
    .card-action:focus {
        opacity: 1;
        outline: none;
    }

.card-toggler:before {
    content: "\f078";
}

.card-reload:before {
    content: "\f0e2";
}

.card-focus:before {
    content: "\f065";
}

.card-remove:before {
    content: "\f00d";
}

.card-collapsed:not(.card-focused) .card-header {
    border: none;
}

.card-collapsed .card-toggler:before {
    content: "\f077";
}

.card-focused {
    bottom: 0;
    left: 0;
    margin-bottom: 0;
    overflow: auto;
    position: fixed !important;
    right: 0;
    top: 0;
    z-index: 2030;
}

    .card-focused .card-toggler {
        display: none;
    }

    .card-focused .card-body {
        display: block !important;
        height: auto !important;
    }

    .card-focused .card-focus:before {
        content: "\f066";
    }

.card-focus-mode {
    overflow: hidden;
}

    .card-focus-mode .layout-content-body {
        -webkit-animation-duration: 0;
        -o-animation-duration: 0;
        animation-duration: 0;
        -webkit-animation-fill-mode: none;
        -o-animation-fill-mode: none;
        animation-fill-mode: none;
        -webkit-animation-name: none;
        -o-animation-name: none;
        animation-name: none;
    }

.card-draggable {
    cursor: move;
}

.card-placeholder {
    background-color: #efefef;
    border: 1px dashed #e3e3e3;
    margin-bottom: 15px;
}

.autoplay-modal-desktop-opened {
    /* set this to hidden if a vertical scrollbar on the body gets in the way... */
    /*overflow-y: auto;*/
    /*to test scrolling functionality on iphone 6, above rule allows for scrolling of main body at same time as modal body, this stops all but modal scrolling*/
    overflow: hidden;
}

    .autoplay-modal-desktop-opened + div {
        display: none;
    }

    .autoplay-modal-desktop-opened .modal-dialog {
        overflow-y: initial !important;
        top: 50px;
    }

    .autoplay-modal-desktop-opened .modal-header {
        border-bottom: none;
    }

        .autoplay-modal-desktop-opened .modal-header h3 {
            font-size: 17px;
        }

    /* SPW-12605: modal-content carries the border/shadow only - it is NOT capped to the viewport
       here. The only height cap on this modal shape is .modal-body's max-height: 80vh below; see
       the SPW-14213 note under .modal-body-small for what that costs a modal with a tall header. */
    .autoplay-modal-desktop-opened .modal-content {
        border: none;
        border-radius: 4px;
        -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
        outline: none;
        position: relative;
    }

    .autoplay-modal-desktop-opened .modal-body {
        max-height: 80vh;
        overflow-y: auto;
        overflow-x: hidden;
    }

    .autoplay-modal-desktop-opened .modal-body-small {
        max-height: 70vh;
        overflow-y: auto;
        overflow-x: hidden;
    }

/* SPW-14213: some modals put a lot outside .modal-body - the yard picker's header carries the
   title, Save/Cancel, a caption, Include Inactive and the search box (~157px, ~187px on the
   multi-body variant). The 80vh cap above applies to the body ALONE, so it stacks on top of that
   header plus the dialog's 50px top offset and 10px margin: at 1534x807 the content box ended at
   863px, i.e. 56px below the fold. Nothing could scroll it back - .modal-dialog is position: fixed
   so the .modal window has nothing to scroll, and .autoplay-modal-desktop-opened sets
   overflow: hidden on the page - which left the last yard rows and the bottom paginator
   unreachable. Opt a modal into this class via windowClass (NOT openedClass - other rules in
   application.css/elephant.css/autoplay-menu.css/wizard.css key off
   .autoplay-modal-desktop-opened and must keep applying) to cap .modal-content to the viewport
   instead and let the body flex into whatever the header leaves. No hard-coded header height, so
   it survives a header that wraps or a variant that adds a row. Mobile (< 768px) uses
   .autoplay-modal-mobile-opened, which is already a full-screen flex column - untouched. */
.autoplay-modal-desktop-opened .autoplay-modal-fit-viewport .modal-content {
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: column;
    flex-direction: column;
    /* 70px = the dialog's 50px top offset (.autoplay-modal-desktop-opened .modal-dialog) + its 10px
       top margin (.modal-dialog, elephant.css), both of which really do consume viewport above the
       content box, + 10px of cosmetic slack so the dialog does not sit flush on the bottom edge.
       Only the first 60px is load-bearing; the last 10px is breathing room, not an enforced gutter,
       so if the dialog's top offset or margin ever changes this number must change with it. */
    max-height: calc(100vh - 70px);
    overflow: hidden;
}

.autoplay-modal-desktop-opened .autoplay-modal-fit-viewport .modal-header {
    -webkit-flex: 0 0 auto;
    flex: 0 0 auto;
}

.autoplay-modal-desktop-opened .autoplay-modal-fit-viewport .modal-body {
    -webkit-flex: 1 1 auto;
    flex: 1 1 auto;
    min-height: 0; /* without this the flex item refuses to shrink below its content height */
    max-height: none; /* the flex basis is the cap now, replacing the 80vh rule above */
    overflow-y: auto;
    overflow-x: hidden;
}

.autoplay-modal-desktop-opened-tall {
    /* set this to hidden if a vertical scrollbar on the body gets in the way... */
    /*overflow-y: auto;*/
    /*to test scrolling functionality on iphone 6, above rule allows for scrolling of main body at same time as modal body, this stops all but modal scrolling*/
    overflow: hidden;
}

    .autoplay-modal-desktop-opened-tall + div {
        display: none;
    }

    .autoplay-modal-desktop-opened-tall .modal-dialog {
        overflow-y: initial !important;
    }

    .autoplay-modal-desktop-opened-tall .modal-header {
        border-bottom: none;
    }

        .autoplay-modal-desktop-opened-tall .modal-header h3 {
            font-size: 17px;
        }

    .autoplay-modal-desktop-opened-tall .modal-content {
        border: none;
        border-radius: 4px;
        -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
        outline: none;
        position: relative;
    }

    .autoplay-modal-desktop-opened-tall .modal-body {
        height: 90vh;
        overflow-y: auto;
        overflow-x: hidden;
    }

.modal-move {
    border-top: 15px solid transparent;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    cursor: move;
}

    .modal-move:hover {
        border-top-color: darkgray;
    }

#uiTarget ul {
    background-color: #f2f2f2;
}

.tableTdWidthOne {
    width: 160px;
}

.tableTdWidthTwo {
    width: 120px;
}

.tableTdWidthThree {
    width: 80px;
}

.tableTdWidthFour {
    width: 60px;
}

.tableTdWidthFive {
    width: 140px;
}

.tableTdWidthSix {
    width: 180px;
}

.tableTdWidth50Percent {
    width: 50%;
}

.tableTdWidth75Percent {
    width: 75%;
}

.tableTdWidth25Percent {
    width: 25%;
}

.tableTdWidth90Percent {
    width: 90%;
}

.tableTdWidth10Percent {
    width: 10%;
}

.tableTdWidth80Percent {
    width: 80%;
}

.tableTdWidth20Percent {
    width: 20%;
}

#accordionTestDrive div.panel-group,
#accordionCustomerStats div.panel-group,
#accordionEmailCampaignListings div.panel-group,
#accordionTradeIn div.panel-group {
    margin-bottom: 5px !important;
}

#accordionLeft div.panel-group {
    margin-bottom: 5px !important;
}

@media (max-width: 1024px) {
    .autoplayCard {
        height: auto;
    }

    .autoplayCardTestDrive {
        height: auto;
    }

    .autoplayCardTradeIn {
        height: auto;
    }

    .col-sm-12-ipad {
        width: 100%;
    }

    /* DJD - commented out because it makes modal popups full screen on ipads */

    /*.autoplay-modal-desktop-opened {
        width: 100%;
        height: 100%;
        position: fixed;
        z-index: 9999;
    }

        .autoplay-modal-desktop-opened + div {
            display: none;
        }

        .autoplay-modal-desktop-opened .modal-dialog {
            position: fixed;
            margin: 0 !important;
            top: 0;
            left: 0;
            width: 100% !important;
            height: 100% !important;
            display: flex !important;
        }

        .autoplay-modal-desktop-opened .modal-header h3 {
            font-size: 17px;
        }

        .autoplay-modal-desktop-opened .modal-content {
            display: flex;
            flex-direction: column;
            min-width: 100%;
            border-radius: 0;
        }

        .autoplay-modal-desktop-opened .modal-body {
            overflow-y: scroll;
        }*/
}

@media (max-width: 768px) {
    .tableTdWidthOne {
        width: 35%;
    }

    .tableTdWidthTwo {
        width: 80px;
    }

    .tableTdWidthFive {
        width: 30%
    }

    #greyHeader_subMenu {
        position: fixed;
        width: 100%;
        z-index: 100;
    }
}

@media (max-width: 767px) and (orientation:portrait) {

    .customDatePlacement {
        width: 40%;
        display: inline-block;
        position: absolute;
        top: 5px;
        left: 0;
    }

    .customTimePlacement {
        width: 48%;
        display: inline-block;
        position: absolute;
        top: -25px;
        left: 45%;
    }

    .col-xs-pot-12 {
        width: 100%;
    }
}

@media (max-width: 767px) and (orientation:landscape) {

    .hideLandscape {
        display: none;
    }

    .bodyLandscape {
        max-height: 60vh;
    }

    .col-xs-pot-12 {
        padding-left: 0;
    }
}

@media (max-width: 480px) and (orientation:portrait) {
    .col-xs-pot-12 {
        width: 100%;
    }
}

/* SPW-9243 see https://stackoverflow.com/questions/66469392/jquery-sortable-bug-wrong-top-left-offset-for-dragged-item-every-first-time-a */
.editImagesFitMobile {
    position: relative;
}

@media (max-width: 480px) {

    .search-field-wrapper .pr14 {
        padding-right: 10px !important;
    }
    /*iPhone Plus / Pixel*/
    .editImagesFitMobile {
        margin-left: 10px;
    }

    .mobileHeightClear {
        clear: both;
        height: 50px;
        margin: 0;
        padding: 0;
    }
}

@media (max-width: 400px) {
    /*iPhone 6,7 / Nexus*/
    .editImagesFitMobile {
        margin-left: -7px;
        width: 108%;
    }
}
/*iPhone 5 Edit Screen*/

@media (max-width: 320px) {

    .editImagesFitMobile {
        width: 110%;
        margin-left: -16px;
    }

    .small_mobile {
        width: 150px !important;
        height: 120px !important;
        margin: 2px 0 4px 2px !important;
        overflow: hidden;
    }

        .small_mobile img {
            width: 150px !important;
            height: 120px !important;
        }

    .autoplay-image .autoplay-image-select {
        right: 20px !important;
    }

    .smallMobileEditScreen {
        width: 150px !important;
        margin: 2px 0 4px 2px !important;
    }

        .smallMobileEditScreen div {
            width: 150px !important;
        }
}

.autoplay-modal-mobile-opened {
    width: 100%;
    height: 100%;
    position: fixed;
    z-index: 2000;
    overflow: hidden;
    -webkit-overflow-scrolling: touch;
}

    .autoplay-modal-mobile-opened + div {
        /*display: none;*/
        z-index: 1;
    }

        .autoplay-modal-mobile-opened + div > div {
            z-index: 1;
        }

    .autoplay-modal-mobile-opened div.subheader-index {
        z-index: 1 !important;
    }

    .autoplay-modal-mobile-opened .modal-dialog {
        position: fixed;
        margin: 0 !important;
        top: 0;
        left: 0;
        width: 100% !important;
        height: 100% !important;
        display: flex !important;
    }

    .autoplay-modal-mobile-opened .modal-header {
        border: none;
    }

        .autoplay-modal-mobile-opened .modal-header h3 {
            font-size: 17px;
        }

    .autoplay-modal-mobile-opened .modal-content {
        display: flex;
        flex-direction: column;
        min-width: 100%;
        border-radius: 0;
        border: none;
        overflow-y: scroll;
    }

    .autoplay-modal-mobile-opened .modal-body {
        max-height: 95vh;
        /*overflow-y: scroll !important;*/
    }

    .autoplay-modal-mobile-opened .modal-body-small {
        max-height: 95vh;
        /*overflow-y: scroll !important;*/
    }

.modal-fullscreen-open {
    overflow-y: hidden !important;
    position: fixed !important;
}

.modal-fullscreen .modal-dialog {
    width: 100% !important;
    height: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    left: 0 !important;
    top: 0 !important;
}

.modal-fullscreen .modal-content {
    height: 100% !important;
    min-height: 100% !important;
    height: auto !important;
    border-radius: 0 !important;
}

/*DJD - commented output for modal fixes*/
.modal-camera {
    z-index: 9001 !important;
}

    .modal-camera .modal-dialog {
        width: 100% !important;
        height: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
        background-color: #000 !important;
        left: 0 !important;
        top: 0 !important;
    }

    .modal-camera .modal-content {
        height: 100% !important;
        min-height: 100% !important;
        height: auto !important;
        border-radius: 0 !important;
        background-color: #000 !important;
    }

/*.theme-panel {
    background-color: #fff;
    border-color: #ddd;
    border-style: solid;
    border-width: 0 1px;
    -webkit-box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.2);
    box-shadow: 0 3px 3px 0 rgba(0, 0, 0, 0.2);
    color: #777;
    display: block;
    height: 100%;
    max-height: 100%;
    position: fixed;
    right: 0;
    top: 0;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
    transform: translateX(0);
    -webkit-transition: -webkit-transform 0.3s;
    transition: -webkit-transform 0.3s;
    -o-transition: -o-transform 0.3s;
    transition: transform 0.3s;
    transition: transform 0.3s, -webkit-transform 0.3s, -o-transform 0.3s;
    width: 280px;
    z-index: 1050;
}

.theme-panel-collapsed {
    -webkit-transform: translateX(282px);
    -ms-transform: translateX(282px);
    -o-transform: translateX(282px);
    transform: translateX(282px);
}

.theme-panel-toggler {
    background-color: #fff;
    background-image: none;
    border-color: #ddd;
    border-radius: 5px 0 0 5px;
    border-style: solid;
    border-width: 1px 0 1px 1px;
    cursor: pointer;
    display: block;
    font-size: 18px;
    height: 50px;
    line-height: 50px;
    outline: none;
    padding: 0;
    position: absolute;
    right: 100%;
    top: 150px;
    width: 40px;
}

.theme-panel-body {
    bottom: 57px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    overflow-y: auto;
    padding-top: 10px;
    padding-bottom: 10px;
    position: absolute;
    top: 0;
    width: 100%;
}

.theme-settings {
    list-style: none;
    margin-bottom: 0;
    padding-left: 0;
}

.theme-settings-heading {
    font-weight: 500;
    margin-bottom: 15px;
    margin-top: 15px;
}

.theme-settings-item {
    display: table;
    margin-top: 15px;
}

.theme-settings-label {
    display: table-cell;
    vertical-align: middle;
    width: 99%;
}

.theme-settings-switch {
    display: table-cell;
    vertical-align: middle;
    width: 1%;
}

.theme-settings-description {
    font-size: 11px;
    margin-top: 15px;
    text-align: center;
}

.theme-variants {
    list-style: none;
    margin-bottom: 0;
    padding-left: 0;
    margin: 0 -5px;
}

    .theme-variants:after,
    .theme-variants:before {
        display: table;
        content: " ";
    }

    .theme-variants:after {
        clear: both;
    }

.theme-variants-item {
    display: block;
    float: left;
    margin-bottom: 5px;
    margin-top: 5px;
    padding-left: 5px;
    padding-right: 5px;
    position: relative;
    width: 50%;
}

.theme-variants-current:after {
    background-color: #d9230f;
    background-image: url(/Content/data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http:/www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 28 28' fill='%23fff'%3E%3Cpath d='M26.109 8.844q0 .625-.438 1.062L12.233 23.344q-.438.438-1.062.438t-1.062-.438l-7.781-7.781q-.438-.438-.438-1.062t.438-1.062l2.125-2.125q.438-.438 1.062-.438t1.062.438l4.594 4.609 10.25-10.266q.438-.438 1.062-.438t1.062.438l2.125 2.125q.438.437.438 1.062z'/%3E%3C/svg%3E);
    background-position: center center;
    background-repeat: no-repeat;
    -webkit-background-size: 75% 75%;
    background-size: 75% 75%;
    border-radius: 50%;
    -webkit-box-sizing: content-box;
    box-sizing: content-box;
    content: "";
    display: block;
    height: 15px;
    position: absolute;
    right: 10px;
    top: 5px;
    width: 15px;
}

.theme-variants-link {
    display: block;
    position: relative;
}

.theme-variants-alt {
    background-color: #d9230f;
    border-top-right-radius: 5px;
    bottom: 0;
    color: #fff;
    display: block;
    font-size: 10px;
    left: 5px;
    padding: 1px 5px;
    position: absolute;
}

    .theme-variants-alt:hover,
    .theme-variants-alt:focus {
        color: #fff;
        text-decoration: none;
    }

.theme-panel-footer {
    background-color: #fff;
    border-top: 1px solid #ddd;
    bottom: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    min-height: 40px;
    padding: 10px;
    position: absolute;
    text-align: center;
    width: 100%;
}*/

@-o-keyframes icon-spin {
    0% {
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -o-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}

@keyframes icon-spin {
    0% {
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(359deg);
        -o-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}

.icon-spin {
    -webkit-animation: icon-spin 2s infinite linear;
    -o-animation: icon-spin 2s infinite linear;
    animation: icon-spin 2s infinite linear;
}


@-webkit-keyframes icon-spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}

.nav-tabs-in-accordion {
    margin-left: -15px;
    margin-right: -15px;
    margin-top: -11px;
    /*border-bottom: 1px solid #ddd;*/
    background-color: #f5f5f5;
}

.accordion-left, .accordion-right {
    padding-left: 0;
    padding-right: 0;
}

@media (min-width: 768px) {

    .accordion-left {
        width: 49.8%;
    }

    .accordion-right {
        width: 49.8%;
        float: right
    }
}

/* Google Address lookup predictions container */
.pac-container {
    z-index: 1060 !important;
}

.layout-mobile > .pac-container {
    z-index: 2011 !important;
}

/*ng-click doesnt always fire on a div when displayed on mobile and div is floated left - seems to be fixable with z-index setting > 0 */
.div-click-mobile-fix {
    z-index: 1;
}

.dashboard-customer-popup-col {
    width: 20px;
    min-width: 20px;
}

.secondary-listing-select {
    position: absolute;
    top: 3px;
    right: 3px;
    height: 22px;
    width: 22px;
    padding-top: 3px;
    border: 2px solid #E52423;
    font-size: 13px;
    vertical-align: central;
    text-align: center;
    background-color: #fff;
    color: #E52423;
    cursor: pointer;
    display: inline-block;
    pointer-events: all;
}

.badge-count {
    display: inline-block;
    height: 22px;
    width: 22px;
    border-radius: 50%;
    border: 2px solid #fff;
    font-size: 11px;
    line-height: 20px;
    vertical-align: central;
    text-align: center;
    background: radial-gradient(circle, #E52423, #E52423);
    color: #fff;
}

@media (min-width: 1200px) {
    .pull-right-lg {
        float: right;
    }
}

.select-checkbox.red {
    color: #e52423;
}

.select-checkbox.grey {
    color: #777;
}

    .select-checkbox.grey .apicon-select:hover:before {
        text-shadow: 1px 1px #ddd, -1px -1px #ddd, 1px -1px #ddd, -1px 1px #ddd;
    }

    .select-checkbox.grey .apicon-select:before {
        content: "\2714";
        color: #777;
        margin-left: 16px;
        margin-top: -14px;
        position: absolute;
        text-align: center;
        text-shadow: 1px 1px #fff, -1px -1px #fff, 1px -1px #fff, -1px 1px #fff;
    }

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

.form-buttons {
    /* SPW-9222 */
    /*position: fixed;*/
    position: sticky;
    float: right;
    /* end SPW-9222 */
    bottom: 10px;
    right: 15px;
    z-index: 999;
}

.autoplay-modal-desktop-opened .form-buttons, .autoplay-modal-mobile-opened .form-buttons {
    visibility: hidden;
}

/* SPW-14212: the sticky bar is transparent, so on a screen whose content runs underneath it the
   buttons appear to sit on top of that content - on the AI review screen they landed across a
   table's header row and it read as broken layout. Opt in to a solid backing where that happens. */
.form-buttons.form-buttons-solid {
    background-color: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .12);
    padding: 6px 8px;
}

.autoplay-modal-desktop-opened {
    overflow: hidden;
}

.abortData {
    z-index: 101;
    position: fixed;
    margin: auto;
    top: calc(50% - 17px);
    left: calc(50% - 18px);
    color: #cccccc;
}

    .abortData:hover {
        color: #E52423;
    }

.progress-container {
    width: 100%;
    height: 100px;
    position: fixed;
    margin: 0 auto;
    z-index: 1001;
    top: calc(50% - 18px);
    left: calc(50% - 18px);
}

.progressData {
    z-index: 101;
    position: relative;
    margin: auto;
    display: inline-block;
    color: #E52423;
    background: white;
    border-radius: 50%;
    height: 38px;
    width: 38px;
    line-height: 38px;
    text-align: center;
}

/*.progressData.no-sidebar {
    left: calc(50% - 20px);
}*/

/*@media (max-width: 768px) {
        .progressData {
        left: calc(50% - 20px);
    }

    .progress-container {

        top: calc(50% + 175px);
    }
}*/


/*testing only*/
.dataTable.table > thead > tr > th, .dataTable.table > thead > tr > td, .dataTable.table > tbody > tr > th, .dataTable.table > tbody > tr > td, .dataTable.table > tfoot > tr > th, .dataTable.table > tfoot > tr > td {
    max-width: none;
}

/* multi select scrollable tables*/
.table-multi thead {
    width: 97%;
}

.table-multi tbody {
    max-height: 230px;
    overflow-y: auto;
    width: 100%;
}

.table-multi thead, .table-multi tbody, .table-multi tr, .table-multi td, .table-multi th {
    display: block;
}

    .table-multi tbody td, .table-multi thead > tr > th {
        float: left;
        border-bottom-width: 0;
        white-space: nowrap;
    }

.tableSortOrder:after {
    content: '\25b2';
    font-size: 9px;
    top: 0;
}

.tableSortOrderReverse:after {
    content: '\25bc';
    font-size: 9px;
    top: 0;
}


/*style overrides for ckeditor*/
.cke_button_label.cke_button__editmodebutton_label {
    display: inline;
    background-color: #5cb85c;
    color: white;
    padding: 1px 5px 0;
    border-radius: 4px;
    margin-top: 0px;
}

.cke_button.cke_button__editmodebutton.cke_button_disabled .cke_button_label {
    background-color: #f8f8f8;
    color: #d1d1d1;
    cursor: not-allowed;
}

.cke_button_icon.cke_button__editmodebutton_icon {
    width: 0;
}

.cke_toolbox > span:not(:first-child) {
    display: none;
}

.cke_reset.cke_maximized .cke_toolbox > span {
    display: initial;
}

.cke_contents {
    width: 100% !important;
}

.cke_autocomplete_panel {
    position: absolute;
    display: none;
    box-sizing: border-box;
    width: 200px;
    max-height: 300px;
    overflow: auto;
    padding: 0;
    margin: 0;
    list-style: none;
    background: #FFF;
    border: 1px solid #b6b6b6;
    border-bottom-color: #999;
    border-radius: 3px;
    color: #777 !important;
    font: 13px "Roboto", Sans-Serif !important;
}

    .cke_autocomplete_panel > li:hover {
        background-color: #007bff !important;
        color: #fff !important;
    }

.cke_autocomplete_selected {
    background-color: #ddd !important;
}

.filter-button-container {
    float: left;
    clear: right;
    margin-right: 5px;
}

/*this rule is in place for the vehicle lookup images when in mobile view with the lhs menu open*/
/*@media (max-width: 768px) {

    .layout-sidebar-open .table-fixed.vehicle-lookup td img {
        width: 60px !important;
    }
}*/

/*styles for trade in svg and accordions*/

.accordion-body {
    background-color: #ddd
}

.carousel-3d-container {
    margin-top: 0px !important;
    padding-top: 30px;
}

.svg-container svg {
    max-height: 500px;
}

svg:focus {
    outline: none;
}

/* multiselect overrides in modals. stops from opening below bottom of modal.*/
@media (min-width: 482px) {

    .modal-dialog .checkboxLayer.show {
        position: absolute !important;
        min-width: 172px;
    }
}


.modal-dialog .multiSelect.inlineBlock.buttonClicked {
    position: relative !important;
}

.countdown-timer {
    color: #E52423;
    font-weight: bold;
}

    .countdown-timer.countdown-banner {
        font-weight: bold;
        bottom: 0;
        text-align: center;
        width: 100%;
        background: #E52423;
        color: white;
        height: 12px;
        font-size: 10px;
        line-height: 13px;
    }

.appraisal-bid-countdown {
    background: #888;
    color: #fff;
    padding: 5px;
    font-weight: normal !important;
}

    .appraisal-bid-countdown .countdown-timer {
        padding-left: 5px;
        color: #fff !important;
    }

.row.previousBid {
    background-color: #eee;
}


/* these styles are specifically for the bidding overlay and only tablet size and below*/
@media (max-width: 768px) {
    .trade-in-table > tbody > tr {
        position: relative;
        width: 100vw;
        height: 100%;
        display: inline-table;
    }

        .trade-in-table > tbody > tr .appraisal-bid-container {
            position: absolute;
            height: 30px;
            bottom: 0;
            left: 0px;
            z-index: 2;
            width: 100%;
        }

        .trade-in-table > tbody > tr .appraisal-bid-countdown {
            height: 30px;
        }

        .trade-in-table > tbody > tr .appraisal-bid .listing-price {
            color: #fff;
        }

    trade-in-table .appraisal-bid {
        position: relative;
        width: 100vw;
        left: -3px;
    }
}


/*terms and conditions styling*/
#pdf-viewer {
    width: 100%;
    max-height: 70vh;
    background: rgba(0, 0, 0, 0.1);
    overflow-y: scroll;
}


.adobe-pdf-viewer {
    height: 75vh !important;
    width: 100% !important;
}

@media (max-width: 480px) and (orientation:portrait) {
    #pdf-viewer {
        max-height: 80vh;
    }
}

#signature-container {
    width: 100%;
    max-height: 70vh;
    overflow-y: auto;
}

.pdf-page-canvas {
    display: block;
    margin: 5px auto;
    border: 1px solid rgba(0, 0, 0, 0.2);
}

.modal-body.terms-conditions {
    overflow: hidden;
}

    .modal-body.terms-conditions .tab-pane {
        overflow: hidden;
        max-height: 70vh;
    }

@media (max-width: 480px) and (orientation:portrait) {
    .modal-body.terms-conditions .tab-pane {
        max-height: 80vh;
    }
}

.angular-text {
    white-space: pre-line;
}

@media (max-width: 425px) {
    .privacy-channel-table input[type="checkbox"] {
        width: 10px;
    }

    .filter-button-container {
        clear: initial;
    }
}

.privacy-channel-table td {
    position: relative;
}

.privacy-channel-table .red-checkbox {
    opacity: 0;
    z-index: 1;
    position: absolute;
}

    .privacy-channel-table .red-checkbox + label {
        position: relative;
        margin-top: 4px;
    }

    .privacy-channel-table .red-checkbox + label, .red-checkbox + label:before {
        display: inline-block;
        width: 12px;
        height: 12px;
        border: 0.0625em solid rgb(119, 119, 119);
        border-radius: 0.25em;
        background: rgb(224,224,224);
        background-image: -moz-linear-gradient(rgb(240,240,240),rgb(224,224,224));
        background-image: -ms-linear-gradient(rgb(240,240,240),rgb(224,224,224));
        background-image: -o-linear-gradient(rgb(240,240,240),rgb(224,224,224));
        background-image: -webkit-linear-gradient(rgb(240,240,240),rgb(224,224,224));
        background-image: linear-gradient(rgb(240,240,240),rgb(224,224,224));
    }

.privacy-channel-table input[type=checkbox]:checked + label:before {
    content: "\2713";
    position: absolute;
    display: block;
    width: 1em;
    color: #E52423;
    font-size: 0.675em;
    width: 12px;
    height: 12px;
    border: none;
    background: transparent;
    left: -1px;
}

.html-viewer {
    overflow: auto;
    height: 68vh;
    padding: 20px;
}

    .html-viewer img {
        max-width: 100%
    }

@media (max-width: 480px) and (orientation:portrait) {
    .html-viewer {
        height: 79vh;
    }
}

.lead-actions {
    min-height: 80px;
}

    .lead-actions .media-middle, .lead-actions .media-middle .circle {
        position: relative;
    }

    .lead-actions .media {
        overflow: visible;
    }

    .lead-actions .media-overlay {
        position: absolute;
        top: -7px;
        right: 00px;
        height: 22px;
        width: 22px;
        border-radius: 50%;
        border: 2px solid #fff;
        font-size: 11px;
        line-height: 20px;
        vertical-align: central;
        text-align: center;
        background: radial-gradient(circle, #E52423, #E52423);
        color: #fff;
    }

    .lead-actions .media-middle.text-center .media-overlay {
        left: 25px;
    }

    .lead-actions .media-body {
        width: 100%;
    }

@media (min-width: 1200px) {
    .lead-actions {
        /*border-left: 1px solid #dddddd; DJD - commented out so that Lead Labels look better. */
        margin-bottom: 5px;
    }

        .lead-actions .media-middle.media-body {
            visibility: hidden;
        }
}

.lead-actions .bg-lightgray {
    background-color: #ddd;
}

    .lead-actions .bg-lightgray, .lead-actions .bg-lightgray .icon.apicon {
        color: #eee;
    }


.driver-check-result {
    display: inline-block;
    margin-bottom: 0;
    font-weight: normal;
    text-align: center;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: default;
    background-image: none;
    border: 1px solid transparent;
    white-space: nowrap;
    padding: 0px 12px;
    font-size: 13px;
    line-height: 1.538462;
    border-radius: 10px;
    width: 80px;
    height: 20px;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    border: none;
    text-transform: uppercase;
    font-size: 13px;
}

    .driver-check-result.PASS {
        color: #fff;
        background-color: #5cb85c;
        border-color: #5cb85c;
    }

        .driver-check-result.PASS:before {
            content: "PASS";
        }

    .driver-check-result.REFER {
        color: #fff;
        background-color: #ffa500;
        border-color: #ffa500;
    }

        .driver-check-result.REFER:before {
            content: "REFER";
        }

    .driver-check-result.FAIL {
        color: #fff;
        background-color: #ff0000;
        border-color: #ff0000;
    }

        .driver-check-result.FAIL:before {
            content: "FAIL";
        }

.address-lookup {
    color: #777;
    list-style-type: none;
    font-weight: normal;
    font-size: 15px;
    padding-left: 0px;
}

    .address-lookup li {
        padding-top: 3px;
        padding-top: 3px;
        padding-left: 10px;
    }

        .address-lookup li:hover {
            background-color: #E52423;
            color: white;
            cursor: pointer;
        }


/*rewards*/
.font-orange {
    color: orange;
}

.font-red {
    color: #E52423;
}

.font-green {
    color: #228B22;
}

.font-black-bold {
    color: #000;
    font-weight: bold;
}

.font-dark-blue {
    color: #2F96B4;
}

.list-inline.rewards {
    padding-left: 10px;
    margin-left: 0px;
}

    .list-inline.rewards:hover, .list-inline.rewards li a:hover, .list-inline.rewards li a:hover > span, .list-inline.rewards:hover li a > span {
        background-color: #E52423;
        color: #ffffff !important;
        /*background-color: #ddd;*/
    }

        .list-inline.rewards:hover li a > img, .list-inline.rewards li a:hover > img {
            -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
            filter: grayscale(100%);
        }

    .list-inline.rewards > li {
        vertical-align: middle;
        vertical-align: -webkit-baseline-middle;
    }

    .list-inline.rewards li a {
        padding: 0;
    }

#menu-rewards-pending {
    font-size: 10px;
    color: #000;
    font-weight: bold;
    /*top: -10px;*/
    position: relative;
}

#menu-rewards-points > span {
    font-weight: bold;
    color: #E52423;
}

#menu-rewards-logo > img {
    height: 15px;
    width: 55px;
}

#menu-rewards-logo > span {
    top: -5px;
    position: relative;
    font-size: 12px;
    color: #000;
    float: right;
}

.rewards-carousel {
    padding: 0 !important;
    position: relative;
}

    .rewards-carousel .arrow-right {
        position: absolute;
        width: 0;
        height: 0;
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;
        border-left: 10px solid #e52423;
        right: -10px;
        top: 40%;
    }

    .rewards-carousel .arrow-left {
        width: 0;
        height: 0;
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;
        border-right: 10px solid #e52423;
        position: absolute;
        left: -10px;
        top: 40%;
    }

.reward-container {
    max-width: 300px;
    height: 420px;
    border: 1px solid #f5f5f5;
    margin: auto;
    position: relative;
    background-color: white;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
}

    .reward-container.grey {
        background-color: #f5f5f5;
    }

    .reward-container .reward-image {
        height: 250px;
        background-color: white;
        position: relative;
    }

    .reward-container img {
        max-height: 100%;
        margin-left: auto;
        margin-right: auto;
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        padding: 10px;
    }

    .reward-container .reward-description {
        height: 3.2em;
        overflow: hidden;
    }

    .reward-container .reward-callout {
        background-color: #f5f5f5;
        min-height: 6em;
    }

    .reward-container .reward-callout-lg {
        min-height: 3em;
    }

    .reward-container .reward-callout .reward-available p {
        line-height: 1;
        margin-top: 5px;
        margin-bottom: 0;
        line-height: 1;
        margin-top: 5px;
        margin-bottom: 0;
        font-size: 12px;
    }

.points-balance-container {
    background-color: #e52423;
    position: relative;
    border-radius: 4px;
    margin: 0 auto 20px auto;
    padding: 40px 0;
    display: block;
    line-height: 1.3;
    height: 143px;
}

    .points-balance-container.grey, .points-balance-container.grey span {
        background-color: #f5f5f5;
        color: #e52423;
    }

a.points-balance-container {
    padding: 50px 10px;
    text-decoration: none;
}

@media (max-width: 1024px) {
    .points-balance-container {
        padding: 20px 0;
        height: 90px;
    }

    a.points-balance-container {
        padding: 20px 10px;
    }

    .points-balance-container .rewards-shop-link {
        top: -40px !important;
    }
}

a.points-balance-container:hover {
    color: #fff;
}

.points-balance {
    font-size: 40px;
    font-weight: bold;
    width: 100%;
    position: relative;
    display: inline-block;
}

    .points-balance > sup {
        top: -2em;
        font-size: 12px;
    }

.points-balance-container, .points-balance-container a, .points-balance-container span {
    color: #fff;
}

.points-shop-button .center {
    margin: auto;
    text-align: left;
    max-width: 160px;
}

.points-shop-button .apicon-cart {
    background-color: white;
    color: red;
    border-radius: 50%;
    width: 1.6em;
    height: 1.6em;
    line-height: 1.7em;
    font-size: 1.6em;
    float: left;
    margin: 0 20px 0 20px;
}

.points-earning-container .list-inline.tabs a {
    text-decoration: none !important;
}

.img-responsive.reward-banner {
    max-width: 295px;
    margin-left: auto;
    margin-right: auto;
}

/* tabs */
@media (min-width: 1024px) {
    .points-earning-container > .tabs-container {
        width: 100%;
        position: relative;
    }

    .points-earning-container > .divider {
        border: 1px solid #E52423;
        z-index: 1;
        position: relative;
        margin-top: 10px;
    }

    .points-earning-container .list-inline.tabs {
        z-index: 2;
        text-align: left;
        top: 12px;
        padding-right: 20px;
        font-weight: bold;
        margin-bottom: 0px;
        position: relative;
    }

        .points-earning-container .list-inline.tabs li {
            border-bottom: none;
            background-color: transparent;
            position: relative;
            z-index: 99999;
            margin: 0;
            padding: 5px 20px;
        }

        .points-earning-container .list-inline.tabs .active-tab.reward-tab {
            border-top: 2px solid #E52423;
            border-left: 2px solid #E52423;
            border-right: 2px solid #E52423;
            background-color: #fcfcfc;
            border-top-left-radius: 4px;
            border-top-right-radius: 4px;
        }
}

@media (max-width: 1023px) {
    .points-earning-container .list-inline.tabs li {
        display: block;
        margin-top: 10px;
        padding-left: 0;
    }

    .points-earning-container .list-inline.tabs .active-tab.reward-tab a {
        padding: 5px;
    }

    .points-earning-container .list-inline.tabs .active-tab.reward-tab {
        border-bottom: 2px solid #E52423;
    }

        .points-earning-container .list-inline.tabs .active-tab.reward-tab a {
            border-top: 2px solid #E52423;
            border-left: 2px solid #E52423;
            border-right: 2px solid #E52423;
            background-color: #fcfcfc;
            border-top-left-radius: 4px;
            border-top-right-radius: 4px;
        }
}

.reward-category-container {
    text-align: center;
}

    .reward-category-container > div {
        background-color: #f5f5f5;
        margin: 20px 15px;
        padding: 20px !important;
        height: 300px;
        position: relative;
        display: inline-block;
        vertical-align: top;
    }

        .reward-category-container > div .apicon-multiplier {
            position: absolute;
            top: 10px;
            right: 10px;
        }

    .reward-category-container .title {
        color: #000 !important;
        font-weight: bold;
    }

    .reward-category-container .video-link {
        display: block;
        min-height: 3em;
    }

        .reward-category-container .video-link a {
            text-decoration: none;
        }

    .reward-category-container .description {
        min-height: 9em;
        display: inline-block;
        width: 200px;
    }

.covid-yellow {
    color: #f6cd46
}

.covid-border {
    border: #f6cd46 solid 2px;
    border-radius: 5px;
    padding: 5px 5px 5px 10px;
}

#visitorBookTable .highlight {
    background-color: #fce8e8;
}

.user-visit-log {
    position: relative;
    top: -14px;
    right: -25px;
    height: 14px;
    width: 14px;
    border-radius: 50%;
    border: 2px solid #fff;
    margin-bottom: -9px;
}

    .user-visit-log.mobile {
        z-index: 9;
        margin-bottom: -15px;
        top: -20px;
        right: -42px;
        height: 24px;
        width: 24px;
        border: 3px solid #fff;
    }

    .user-visit-log.green {
        background: radial-gradient(circle, #5cb85c, #5cb85c);
    }

    .user-visit-log.orange {
        background: radial-gradient(circle, orange, orange);
    }

/* stops ui-sortable adding errant borders*/
.managers-table td {
    border: none !important;
}

/*role user table overflow*/
.table.role-users th, .table.role-users td {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

/*preserves and wraps text*/
.wrapped-text {
    white-space: pre-wrap;
}

.flexed {
    display: inline-flex;
}

/*keep adobe viwer within page*/
iframe#iframe-adobe-dc-view {
    height: 96% !important;
}

/*prevent checkboxes from resizing*/
input[type='checkbox'].fixed-checkbox-width {
    width: auto;
}

.dark-gray-anchor,
.dark-gray-anchor:hover,
.dark-gray-anchor:link,
.dark-gray-anchor:visited,
.dark-gray-anchor:active {
    color: #777777;
    text-decoration: none;
}

.progress-bar-red {
    background-color: red;
}

.progress-bar-orange {
    background-color: orange;
}

.progress-bar-green {
    background-color: #9bd0b7;
}

.progress-bar-lightgreen {
    background-color: lightgreen;
}

.progress-bar-darkgreen {
    background-color: darkgreen;
}

.listing-summary {
    margin-top: 10px;
    padding: 0px;
}

    .listing-summary ul {
        display: flex;
        align-items: stretch;
        justify-content: space-between;
        width: 100%;
        margin-bottom: 5px;
    }

        .listing-summary ul li {
            display: block;
            flex: 0 1 auto;
            list-style-type: none;
            background: white;
            margin-left: 8px;
            margin-right: 8px;
            border-radius: 4px;
            width: 20%;
        }

            .listing-summary ul li div:not(.listing-summary-imported) {
                padding-top: 5px;
                position: relative;
            }

            .listing-summary ul li:last-child {
                margin-right: 0px;
            }

            .listing-summary ul li autoplay-tooltip {
                position: absolute;
                right: 2px;
                top: 3px;
            }

            .listing-summary ul li span {
                display: block;
                text-align: center;
                margin-top: 3px;
            }

            .listing-summary ul li button {
                margin-left: auto;
                margin-right: auto;
                margin-bottom: 5px;
                margin-top: 5px;
                display: block;
            }

.listing-summary-imported {
    display: flex;
    justify-content: space-evenly;
}

@media (max-width: 600px) and (orientation:portrait) {
    .autograb-listing-button {
        font-size: 7px;
    }
}

@media (max-width: 600px) and (orientation:portrait) {
    .customer-accordion {
        font-size: 12px;
        padding: 0 8px;
    }
}

.tooltip {
    z-index: 2000 !important;
}

.address-lookup-modal {
    padding-right: 15px;
}

.CodeMirror {
    border: 1px solid #ccc;
    border-radius: 4px;
}

.list-icon {
    top: 5px;
    position: relative;
}

.checkMark {
    display: inline-block;
    width: 22px;
    height: 22px;
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    position: absolute;
    bottom: 0;
    right: 0px;
}

    .checkMark:before {
        content: "";
        position: absolute;
        width: 3px;
        height: 9px;
        background-color: #fff;
        left: 11px;
        top: 6px;
    }

    .checkMark:after {
        content: "";
        position: absolute;
        width: 3px;
        height: 3px;
        background-color: #fff;
        left: 8px;
        top: 12px;
    }

.justify-table-cell {
    display: flex;
    justify-content: space-evenly;
}

@media screen and (max-width: 991px) {
    .mobile-spacer {
        margin-top: 10px !important;
        margin-bottom: 10px;
    }
}

@media screen and (max-width: 991px) {
    .hidden-sm-xs {
        display: none;
    }
}

@media screen and (min-width: 992px) {
    .hidden-md-up {
        display: none;
    }
}

@media(max-width: 768px) {
    .hide-sm {
        display: none !important
    }
}

.text-wrap {
    word-wrap: break-word;
    white-space: normal;
    display: block;
}

.popup-tabs {
    display: flex;
    gap: 4px;
    margin-bottom: 10px;
    border-bottom: 1px solid #e0e0e0;
}

.popup-tab {
    flex: 1;
    background: none;
    border: none;
    padding: 6px 4px;
    font-size: 12px;
    color: #888;
    cursor: pointer;
    border-bottom: 2px solid transparent;
}

.popup-tab.active {
    color: #333;
    font-weight: 600;
    border-bottom-color: #E52423;
}


/* general menu overrides*/
.navbar-header {
    -webkit-transition: width 0.3s;
    -o-transition: width 0.3s;
    transition: width 0.3s;
    width: 330px;
}

.navbar-toggleable {
    margin-left: 330px;
    -webkit-transition: margin-left 0.3s;
    -o-transition: margin-left 0.3s;
    transition: margin-left 0.3s;
    background-color: #E52423;
}

.layout-mobile .layout-sidebar-collapsed .navbar-header {
    width: 220px;
}

.subheader-index {
    z-index: 8090;
}

.layout-mobile .subheader-index {
    z-index: 999;
}

/* menu overrides for ipad and large phone*/
@media (min-width: 481px) and (max-width: 768px) {
    .layout-sidebar-collapsed-ipad .navbar-header, .layout-desktop .layout-sidebar-collapsed .layout-sidebar-backdrop, .layout-sidebar-collapsed .layout-sidebar-collapsed-ipad .custom-scrollbar .mobile-menu {
        overflow: hidden;
        width: 0;
    }

    .layout-sidebar-collapsed-ipad .navbar-toggleable {
        margin-left: 0;
    }

    .layout-sidebar-collapsed-ipad .layout-sidebar {
        width: 0px;
    }

    .layout-sidebar-collapsed-ipad .layout-sidebar-backdrop {
        width: 0px;
    }

    .layout-sidebar-collapsed-ipad .layout-content {
        margin-left: 0px;
    }

    .layout-sidebar-collapsed-ipad .layout-footer {
        margin-left: 0px;
    }
}

.sidenav-image {
    height: 16px;
}

/* desktop overrides */
@media (min-width: 769px) {
    .sidenav-label {
        display: block;
    }

    .sidenav-label-image {
        display: block;
        overflow: unset;
        text-overflow: unset;
    }

    .navbar-header {
        width: 220px;
    }

    .navbar-toggleable {
        margin-left: 220px;
    }

    .layout-sidebar{
        position:fixed!important;
    }
    .custom-scrollbar {
        max-height: 100vh;
        overflow-y: auto;
    }

    .layout-sidebar-collapsed .navbar-header {
        overflow: hidden;
        width: 0;
    }

    .layout-sidebar-collapsed .navbar-toggleable {
        margin-left: 0;
    }

    .layout-sidebar-body {
        padding-bottom: 5px;
        padding-top: 0;
    }

    .layout-sidebar-fixed .layout-sidebar-body {
        height: 100%;
        overflow: hidden;
        width: 100%;
        
    }

    .sidenav-collapse {
        display: block !important;
        height: auto !important;
        padding-bottom: 50px;
    }

    .layout-mobile .sidenav-collapsed > li, .layout-sidebar-collapsed .sidenav-collapsed > li {
        display: none;
    }


    .layout-sidebar .custom-scrollbar::-webkit-scrollbar {
        width: 10px;
    }

    .layout-sidebar .custom-scrollbar::-webkit-scrollbar-thumb {
        border-radius: 13px;
        background-color: #c4ced9;
        padding-right: 40px;
    }

    .layout-sidebar .custom-scrollbar::-webkit-scrollbar-track {
        border-radius: 13px;
        background-color: transparent;
    }
}

/*menu overrides for mobiles and desktop view below mobile size*/
@media (max-width: 768px) {

    .custom-scrollbar.mobile-menu {
        position: fixed;
        width: 100%;
        z-index: 1000;
        max-height: 100%;
        height: 100%;
        overflow-y: scroll;
        background-color: #191919;
    }

    /* SI-147: the drawer is position:fixed with no top, so it sits at its static position
       of 50px but height:100% then measures from the viewport top - running it 50px past
       the bottom of the screen and stranding the last menu items below the fold.
       Pin the top explicitly and take the offset back out of the height.

       Deliberately NOT scoped to .layout-desktop: both shells were measured at 390x844 and
       both were wrong the same way - drawer top 50px, bottom 894px against an 844px
       viewport. Unscoping it recovered 50px of unreachable scroll area on layout-mobile too
       (scrollable area 248px -> 305px).

       The 50px is not arbitrary on either shell. On layout-mobile the drawer inherits it
       from the inline padding-top on .layout-sidebar in _Layout.Mobile.cshtml (50px while
       the drawer is open); on layout-desktop that div has no padding and the 50px is the
       fixed header's own height. If either of those ever changes, this top must change with
       it. */
    .custom-scrollbar.mobile-menu {
        top: 50px;
        height: calc(100% - 50px);
    }

    /* SI-147: the drawer covers the full width here, so the header strip is the only chrome
       still showing above it and it read as a white bar across the top of a dark menu. Paint
       it, and the subheader behind it, the same colour as the drawer. The two icons that sit
       on that strip are dark greys chosen for a white background, so lift them to white or
       they disappear into it. */
    .layout-desktop .layout-sidebar-open .navbar,
    .layout-desktop .layout-sidebar-open .navbar-toggleable,
    .layout-desktop .layout-sidebar-open #greyHeader_subMenu {
        background-color: var(--ap-shark, #191919);
    }

    .layout-desktop .layout-sidebar-open .header-collapse-toggle,
    .layout-desktop .layout-sidebar-open .header-page-icon {
        color: var(--white, #fff);
    }

    .layout-sidebar-collapsed.layout-sidebar-collapsed-ipad .custom-scrollbar.mobile-menu {
        width: 0%;
    }

    .sidenav-bottom-padding {
        padding-bottom: 50px;
    }

    .layout-desktop .layout-main {
        padding-top: 95px;
    }

    .layout-desktop .layout-sidebar-open .layout-content {
        margin-left: 220px;
        -webkit-transition: margin-left .3s;
        -o-transition: margin-left .3s;
        transition: margin-left .3s;
    }

    .layout-desktop .layout-sidebar-collapsed .layout-content {
        margin-left: 0;
    }

    .layout-desktop .layout-content-body {
        position: initial;
    }

    .layout-desktop .layout-sidebar {
        display: block;
        float: left;
        position: relative;
        -webkit-transition: width 0.3s;
        -o-transition: width 0.3s;
        transition: width 0.3s;
        width: 220px;
        z-index: 1000;
        /*overflow-y: auto;*/ /*SPW-1402 - improved menu background for smaller screens*/
        min-height: 100vh;
    }

    .layout-desktop .layout-sidebar-fixed .layout-sidebar {
        bottom: 0;
        left: 0;
        position: fixed;
        top: 50px;
    }

    .layout-desktop .layout-sidebar-collapsed .layout-sidebar {
        width: 0px;
    }

    .layout-desktop .sidenav-collapse {
        display: block !important;
        height: auto !important;
    }

    .layout-desktop .layout-sidebar-backdrop {
        background-color: #191919;
        display: block;
        height: 100%;
        left: 0;
        max-height: 100%;
        position: fixed;
        top: 0;
        -webkit-transition: width 0.3s;
        -o-transition: width 0.3s;
        transition: width 0.3s;
        width: 220px;
        z-index: -1;
    }

    .layout-desktop .layout-sidebar-fixed .layout-sidebar-backdrop {
        display: none;
        position: static;
    }

    .layout-desktop .layout-sidebar-collapsed .layout-sidebar-backdrop {
        width: 0px;
    }

    .layout-desktop .greyHeader_subMenu_right, .layout-desktop .navbar-right {
        visibility: hidden;
        height: 0;
    }

    .layout-desktop .layout-sidebar-collapsed .greyHeader_subMenu_right, .layout-desktop .layout-sidebar-collapsed .navbar-right, .layout-desktop.autoplay-modal-desktop-opened .greyHeader_subMenu_right {
        visibility: visible;
    }

    .layout-desktop .layout-header {
        z-index: 1049;
    }

    .layout-desktop .navbar-brand-center {
        left: 50%;
    }

    .layout-desktop .navbar-header {
        width: 140px;
    }

    .layout-desktop .layout-sidebar-collapsed .navbar-header {
        overflow: hidden;
        width: 0;
    }

    .layout-desktop .navbar-toggleable {
        margin-left: 140px;
    }

    .layout-desktop .layout-sidebar-collapsed .navbar-toggleable {
        margin-left: 0;
    }

    .layout-desktop .custom-scrollbar:not(.mobile-menu) {
        width: initial !important;
        position: relative;
        overflow: hidden;
    }


    .autoplay-modal-mobile-opened + .layout-sidebar-collapsed {
        position: fixed;
    }
}

/*SPW-10599*/
@media screen and (max-width: 440px) {

    .greyHeader_subMenu-dropdown-menu-right {
        top: 85px;
        position: fixed;
        left: 50% !important;
        transform: translate(-50%, 0%) !important;
        width: 100%;
    }

    .greyHeader_subMenu-dropdown-menu-right:before, .greyHeader_subMenu-dropdown-menu-right:after {
        display: none;
    }
}

/* SI-147: at phone widths the desktop shell is served to anyone whose UA carries no "mobile"
   token - notably iOS Safari with "Request Desktop Website" on. Opening the drawer there
   releases .navbar-header from its collapsed width:0 to 290px, which leaves .navbar-toggleable
   too little room and pushes the page title onto a second row. That grew the header from 50px
   to ~86px at 390px and ~112px at 360px, while the drawer stays pinned at top:50px, so the
   header (z-index 1049) covered the first menu group - Listings for a dealer user - and
   swallowed its taps. The drawer sits at scrollTop 0, so there was nothing to scroll up to.
   The title is redundant while a full-screen drawer covers the page (it only rendered as a
   truncated "L..." anyway), so hiding it keeps the header at the 50px the drawer assumes.
   Scoped to the phone tier: at 481px and up the header does not wrap far enough to occlude. */
@media (max-width: 480px) {

    /* The page icon goes with it: at 360px the strip has only ~70px of room, so
       leaving the icon in wrapped it onto a second line and grew the header right
       back to 62px. Both are redundant while a full-screen menu covers the page. */
    .layout-desktop .layout-sidebar-open .title-bar-title,
    .layout-desktop .layout-sidebar-open .header-page-icon {
        display: none;
    }

    /* ds-reskin pulls the collapse toggle up by 12px (position:relative) to meet
       .title-bar-title's first text line, because #navbar is a plain block rather
       than a flex row. With the title hidden there is no such line to meet and the
       pull put the toggle through the top of the screen, so centre it in the 50px
       bar instead: (50 - 36) / 2 = 7. */
    .layout-desktop .layout-sidebar-open .header-collapse-toggle {
        top: 7px;
    }
}


.layout-mobile .navbar-nav > li > .dropdown-menu {
    list-style: none;
    max-height: 80vh;
    overflow: scroll;
}


@supports (-ms-ime-align: auto) {
    .layout-sidebar { /* SPW-1402 - Added only for Edge as it was getting confused and letting the menu background display over some of the menu items.*/
        overflow-y: auto;
    }
}

.audio-border {
    border: solid 3px #E52423;
    box-sizing: content-box;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    margin: -3px;
}

.autoplay-image {
    position: relative;
    pointer-events: none;
}

    .autoplay-image .autoplay-image-select {
        position: absolute;
        top: 3px;
        right: 3px;
        height: 22px;
        width: 22px;
        padding-top: 3px;
        border: 2px solid #E52423;
        font-size: 13px;
        vertical-align: central;
        text-align: center;
        background-color: #fff;
        color: #E52423;
        cursor: pointer;
        display: inline-block;
        pointer-events: all;
    }

    .autoplay-image .listing-image-count {
        position: absolute;
        top: -7px;
        right: -7px;
        height: 22px;
        width: 22px;
        border-radius: 50%;
        border: 2px solid #fff;
        font-size: 11px;
        line-height: 20px;
        vertical-align: central;
        text-align: center;
        background: radial-gradient(circle, #E52423, #E52423);
        color: #fff;
    }

    .autoplay-image .listing-image-number {
        position: absolute;
        top: 3px;
        left: 3px;
        height: 22px;
        width: 22px;
        border-radius: 50%;
        border: 2px solid #fff;
        font-size: 11px;
        line-height: 20px;
        vertical-align: central;
        text-align: center;
        background: radial-gradient(circle, #E52423, #E52423);
        color: #fff;
    }

    .autoplay-image .listing-image-status-60 {
        height: 9px;
        width: 60px;
        font-size: 8px;
        line-height: 10px;
    }

    .autoplay-image .listing-image-status-80 {
        height: 12px;
        width: 80px;
        font-size: 11px;
        line-height: 13px;
    }

    .autoplay-image .listing-image-status-90 {
        height: 12px;
        width: 90px;
        font-size: 11px;
        line-height: 13px;
    }

    .autoplay-image .listing-image-status-220 {
        height: 12px;
        width: 220px;
        font-size: 11px;
        line-height: 13px;
    }

    .autoplay-image .listing-image-notification {
        position: absolute;
        top: -7px;
        right: -7px;
    }

    .autoplay-image .listing-image-status {
        position: absolute;
        bottom: 0px;
        vertical-align: central;
        text-align: center;
    }

        .autoplay-image .listing-image-status.listing-image-status-testdrive {
            color: #fff;
            background-color: #39a7aa;
        }

        .autoplay-image .listing-image-status.listing-image-status-incentive {
            color: #fff;
            background-color: #db8f0d;
        }

        .autoplay-image .listing-image-status.listing-image-status-promotion {
            color: #fff;
            background-color: #8a2051;
        }

        /* SPW-9789 */
        .autoplay-image .listing-image-status.listing-image-status-advertising {
            color: #fff;
            background-color: #8a2051;
        }

        .autoplay-image .listing-image-status.listing-image-status-location {
            color: #444;
            background-color: #ffdc00;
        }

        .autoplay-image .listing-image-status.listing-image-status-novideo {
            color: #fff;
            background-color: #E52423;
            font-size: 10px;
        }

        .autoplay-image .listing-image-status.listing-image-status-buildingvideo {
            color: #fff;
            background-color: #F89406;
            font-size: 10px;
        }

        .autoplay-image .listing-image-status.listing-image-status-videobuilt {
            color: #fff;
            background-color: #5cb85c;
            font-size: 10px;
        }

    .autoplay-image .listing-image-sold {
        position: absolute;
        top: 0px;
        left: -25px;
        text-transform: uppercase;
        color: white;
        overflow: hidden;
        font-size: 7pt;
        font-weight: bold;
        background-color: #E52423;
        border-bottom: 1px solid #fff;
        border-top: 1px solid #fff;
        width: 70px;
        text-align: center;
        line-height: 1.2;
        -ms-transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        -sand-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }

        .autoplay-image .listing-image-sold label {
            margin-bottom: 0px;
            margin-left: -3px;
        }

    .autoplay-image .listing-image-pending {
        position: absolute;
        top: 0px;
        left: -25px;
        text-transform: uppercase;
        color: white;
        overflow: hidden;
        font-size: 7pt;
        font-weight: bold;
        background-color: #0070c0;
        border-bottom: 1px solid #fff;
        border-top: 1px solid #fff;
        width: 70px;
        text-align: center;
        line-height: 1.2;
        -ms-transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        -sand-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }

        .autoplay-image .listing-image-pending label {
            margin-bottom: 0px;
            margin-left: -4px;
        }

    .autoplay-image .listing-image-onhold {
        position: absolute;
        top: 0px;
        left: -25px;
        text-transform: uppercase;
        color: white;
        overflow: hidden;
        font-size: 7pt;
        font-weight: bold;
        background-color: #F89406;
        border-bottom: 1px solid #fff;
        border-top: 1px solid #fff;
        width: 70px;
        text-align: center;
        line-height: 1.2;
        -ms-transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        -sand-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }

        .autoplay-image .listing-image-onhold label {
            margin-bottom: 0px;
            margin-left: -4px;
        }

.autoplay-image-18 {
    width: 18px;
    min-width: 18px;
}

.autoplay-image-24 {
    width: 24px;
    min-width: 24px;
}

.autoplay-image-60 {
    width: 60px;
    min-width: 60px;
}

.autoplay-image-80 {
    width: 80px;
    min-width: 80px;
}

.autoplay-image-100 {
    width: 100px;
    min-width: 100px;
}

.autoplay-image-120 {
    width: 120px;
    min-width: 120px;
}

.autoplay-image-160 {
    width: 160px;
    min-width: 160px;
}

.autoplay-image-220 {
    width: 220px;
    min-width: 220px;
}

.autoplay-image-238 {
    width: 238px;
    min-width: 238px;
}


.drop-box.attachment {
    width: 120px;
    height: 80px;
    padding: 16px 0px;
}

.autoplay-attachment {
    position: relative;
    pointer-events: none;
    background-color: #f5f5f5;
    border-radius: 8px;
    border: 1px solid #aaa;
}

    .autoplay-attachment .autoplay-attachment-select {
        position: absolute;
        top: 5px;
        right: 5px;
        height: 22px;
        width: 22px;
        padding-top: 3px;
        border: 1px solid #E52423;
        font-size: 13px;
        vertical-align: central;
        text-align: center;
        background-color: #fff;
        color: #E52423;
        cursor: pointer;
        display: inline-block;
        pointer-events: all;
    }

    .autoplay-attachment .autoplay-attachment-download {
        position: absolute;
        top: 5px;
        left: 5px;
        height: 22px;
        width: 22px;
        padding-top: 3px;
        font-size: 24px;
        vertical-align: central;
        text-align: center;
        cursor: pointer;
        display: inline-block;
        pointer-events: all;
    }

.autoplay-attachment-18 {
    width: 18px;
    min-width: 18px;
}

.autoplay-attachment-60 {
    width: 60px;
    min-width: 60px;
}

.autoplay-attachment-80 {
    width: 80px;
    min-width: 80px;
}

.autoplay-attachment-120 {
    width: 120px;
    height: 80px;
    min-width: 120px;
    min-height: 80px;
}

.autoplay-attachment-160 {
    width: 160px;
    min-width: 160px;
}

.autoplay-attachment-220 {
    width: 220px;
    min-width: 220px;
}

.autoplay-attachment-238 {
    width: 238px;
    min-width: 238px;
}

/* Specifying the name for animation keyframes and keyframes themselves */
@keyframes customticker {
    0% {
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
        visibility: visible;
    }

    100% {
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
}

.attachment-icon {
    position: absolute;
    top: 16%;
    left: 36%;
}

    .attachment-icon.clickable {
        pointer-events: all;
        cursor: pointer
    }

/* Formatting the full-width ticker wrapper background and font color */
.attachment-tickerwrap {
    width: 100%;
    overflow: hidden;
    background-color: transparent;
    position: absolute;
    bottom: 3px;
    color: #777;
    font-size: 11px;
}


/* Formatting the ticker content background, font color, padding and exit state */
.attachment-ticker {
    display: inline-block;
    white-space: nowrap;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
    -webkit-animation-name: customticker;
    animation-name: customticker;
    -webkit-animation-duration: 7s;
    animation-duration: 7s;
}

.attachment-filename {
    width: 100%;
    overflow: hidden;
    background-color: transparent;
    position: absolute;
    bottom: 3px;
    color: #777;
    font-size: 11px;
    text-align: center;
}

/*!
 * angular-confirm v1.1.0 (http://craftpip.github.io/angular-confirm/)
 * Author: boniface pereira
 * Website: www.craftpip.com
 * Contact: hey@craftpip.com
 *
 * Copyright 2016-2017 angular-confirm
 * Licensed under MIT (https://github.com/craftpip/angular-confirm/blob/master/LICENSE)
 */
@-webkit-keyframes ng-confirm-spin {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes ng-confirm-spin {
    from {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

body[class*=ng-confirm-no-scroll-] {
    overflow: hidden !important;
}

/* hide the timer part of the button */
.ng-confirm-timer {
  display:none;
}

.ng-confirm {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 3000; /*z-index: 99999999;  DJD - changed to 3000 so that select2 popups render OK in $ngConfirm-triggered forms*/
    font-family: inherit;
    overflow: hidden;
}

    .ng-confirm .ng-confirm-bg {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        -webkit-transition: opacity .4s, background .4s;
        transition: opacity .4s, background .4s;
    }

        .ng-confirm .ng-confirm-bg.ng-confirm-bg-h {
            opacity: 0 !important;
        }

    .ng-confirm .ng-confirm-scrollpane {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        overflow-y: auto;
        -webkit-perspective: 500px;
        perspective: 500px;
        -webkit-perspective-origin: center;
        perspective-origin: center;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

    .ng-confirm .ng-confirm-box {
        background: white;
        border-radius: 4px;
        position: relative;
        outline: none;
        padding: 15px 15px 0;
        overflow: hidden;
        margin-left: auto;
        margin-right: auto;
    }

        .ng-confirm .ng-confirm-box.ng-confirm-loading {
            min-height: 120px;
        }

            .ng-confirm .ng-confirm-box.ng-confirm-loading:before {
                content: '';
                position: absolute;
                left: 0;
                background: white;
                right: 0;
                top: 0;
                bottom: 0;
                border-radius: 10px;
                z-index: 1;
            }

            .ng-confirm .ng-confirm-box.ng-confirm-loading:after {
                opacity: 0.6;
                content: '';
                height: 30px;
                width: 30px;
                border: solid 3px transparent;
                position: absolute;
                left: 50%;
                margin-left: -15px;
                border-radius: 50%;
                -webkit-animation: ng-confirm-spin 1s infinite linear;
                animation: ng-confirm-spin 1s infinite linear;
                border-bottom-color: dodgerblue;
                top: 50%;
                margin-top: -15px;
                z-index: 2;
            }

        .ng-confirm .ng-confirm-box div.ng-confirm-closeIcon {
            height: 20px;
            width: 20px;
            position: absolute;
            top: 5px;
            right: 5px;
            cursor: pointer;
            opacity: .6;
            text-align: center;
            -webkit-transition: opacity 0.3s ease-in;
            transition: opacity 0.3s ease-in;
            font-size: 27px !important;
            line-height: 14px;
            font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
        }

            .ng-confirm .ng-confirm-box div.ng-confirm-closeIcon:empty {
                display: none;
            }

            .ng-confirm .ng-confirm-box div.ng-confirm-closeIcon .fa,
            .ng-confirm .ng-confirm-box div.ng-confirm-closeIcon .glyphicon,
            .ng-confirm .ng-confirm-box div.ng-confirm-closeIcon .zmdi {
                font-size: 16px;
                line-height: 25px;
                vertical-align: bottom;
            }

            .ng-confirm .ng-confirm-box div.ng-confirm-closeIcon:hover {
                opacity: 1;
            }

        .ng-confirm .ng-confirm-box div.ng-confirm-title-c {
            display: block;
            font-size: 22px;
            line-height: 20px;
            padding-bottom: 15px;
        }

            .ng-confirm .ng-confirm-box div.ng-confirm-title-c .ng-confirm-icon-c {
                font-size: inherit;
                display: inline-block;
                vertical-align: top;
            }

                .ng-confirm .ng-confirm-box div.ng-confirm-title-c .ng-confirm-icon-c i {
                    vertical-align: middle;
                }

                .ng-confirm .ng-confirm-box div.ng-confirm-title-c .ng-confirm-icon-c:empty {
                    display: none;
                }

            .ng-confirm .ng-confirm-box div.ng-confirm-title-c .ng-confirm-title {
                width: 100%; /* DJD - added so that AutoGrab popup title text and button take up whole width of modal */
                font-size: inherit;
                font-family: inherit;
                display: inline-block;
                vertical-align: middle;
                -webkit-user-select: initial;
                -moz-user-select: initial;
                -ms-user-select: initial;
                user-select: initial;
            }

                .ng-confirm .ng-confirm-box div.ng-confirm-title-c .ng-confirm-title:empty {
                    display: none;
                }

        .ng-confirm .ng-confirm-box div.ng-confirm-content-pane {
            margin-bottom: 15px;
            height: 0px;
            display: inline-block;
            width: 100%;
            position: relative;
            overflow: hidden;
        }

            .ng-confirm .ng-confirm-box div.ng-confirm-content-pane .ng-confirm-content {
                width: 100%;
                height: auto;
                -webkit-user-select: initial;
                -moz-user-select: initial;
                -ms-user-select: initial;
                user-select: initial;
            }

                .ng-confirm .ng-confirm-box div.ng-confirm-content-pane .ng-confirm-content img {
                    width: 100%;
                    height: auto;
                }

                .ng-confirm .ng-confirm-box div.ng-confirm-content-pane .ng-confirm-content:empty {
                    display: none;
                }

        .ng-confirm .ng-confirm-box .ng-confirm-buttons {
            padding-bottom: 11px;
        }

            .ng-confirm .ng-confirm-box .ng-confirm-buttons > button {
                margin-bottom: 4px;
                margin-left: 2px;
                margin-right: 2px;
            }

            .ng-confirm .ng-confirm-box .ng-confirm-buttons button {
                display: inline-block;
                padding: 6px 12px;
                font-size: 13px;
                font-weight: 400;
                line-height: 1.42857143;
                text-align: center;
                white-space: nowrap;
                vertical-align: middle;
                -ms-touch-action: manipulation;
                touch-action: manipulation;
                cursor: pointer;
                -webkit-user-select: none;
                -moz-user-select: none;
                -ms-user-select: none;
                user-select: none;
                border-radius: 4px;
                min-height: 1em;
                outline: 0;
                -webkit-transition: opacity 0.1s ease, background-color 0.1s ease, color 0.1s ease, box-shadow 0.1s ease, background 0.1s ease;
                transition: opacity 0.1s ease, background-color 0.1s ease, color 0.1s ease, box-shadow 0.1s ease, background 0.1s ease;
                -webkit-tap-highlight-color: transparent;
                border: none;
                background-image: none;
            }
/*.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-blue {
  background-color: #3498db;
  color: #FFF;
  text-shadow: none;
  -webkit-transition: background .2s;
          transition: background .2s;
}
.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-blue:hover {
  background-color: #2980b9;
  color: #FFF;
}
.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-green {
  background-color: #2ecc71;
  color: #FFF;
  text-shadow: none;
  -webkit-transition: background .2s;
          transition: background .2s;
}
.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-green:hover {
  background-color: #27ae60;
  color: #FFF;
}
.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-red {
  background-color: #e74c3c;
  color: #FFF;
  text-shadow: none;
  -webkit-transition: background .2s;
          transition: background .2s;
}
.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-red:hover {
  background-color: #c0392b;
  color: #FFF;
}
.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-orange {
  background-color: #f1c40f;
  color: #FFF;
  text-shadow: none;
  -webkit-transition: background .2s;
          transition: background .2s;
}
.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-orange:hover {
  background-color: #f39c12;
  color: #FFF;
}
.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-default {
  background-color: #ecf0f1;
  color: #000;
  text-shadow: none;
  -webkit-transition: background .2s;
          transition: background .2s;
}
.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-default:hover {
  background-color: #bdc3c7;
  color: #000;
}
.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-purple {
  background-color: #9b59b6;
  color: #FFF;
  text-shadow: none;
  -webkit-transition: background .2s;
          transition: background .2s;
}
.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-purple:hover {
  background-color: #8e44ad;
  color: #FFF;
}
.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-dark {
  background-color: #34495e;
  color: #FFF;
  text-shadow: none;
  -webkit-transition: background .2s;
          transition: background .2s;
}
.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-dark:hover {
  background-color: #2c3e50;
  color: #FFF;
}*/
@-webkit-keyframes type-blue {
    1%, 100% {
        border-color: #3498db;
    }

    50% {
        border-color: #5faee3;
    }
}

@keyframes type-blue {
    1%, 100% {
        border-color: #3498db;
    }

    50% {
        border-color: #5faee3;
    }
}

@-webkit-keyframes type-green {
    1%, 100% {
        border-color: #2ecc71;
    }

    50% {
        border-color: #54d98c;
    }
}

@keyframes type-green {
    1%, 100% {
        border-color: #2ecc71;
    }

    50% {
        border-color: #54d98c;
    }
}

@-webkit-keyframes type-red {
    1%, 100% {
        border-color: #e74c3c;
    }

    50% {
        border-color: #ed7669;
    }
}

@keyframes type-red {
    1%, 100% {
        border-color: #e74c3c;
    }

    50% {
        border-color: #ed7669;
    }
}

@-webkit-keyframes type-orange {
    1%, 100% {
        border-color: #f1c40f;
    }

    50% {
        border-color: #f4d03f;
    }
}

@keyframes type-orange {
    1%, 100% {
        border-color: #f1c40f;
    }

    50% {
        border-color: #f4d03f;
    }
}

@-webkit-keyframes type-purple {
    1%, 100% {
        border-color: #9b59b6;
    }

    50% {
        border-color: #b07cc6;
    }
}

@keyframes type-purple {
    1%, 100% {
        border-color: #9b59b6;
    }

    50% {
        border-color: #b07cc6;
    }
}

@-webkit-keyframes type-dark {
    1%, 100% {
        border-color: #34495e;
    }

    50% {
        border-color: #46627f;
    }
}

@keyframes type-dark {
    1%, 100% {
        border-color: #34495e;
    }

    50% {
        border-color: #46627f;
    }
}

.ng-confirm.ng-confirm-type-animated .ng-confirm-box {
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}

.ng-confirm.ng-confirm-type-blue .ng-confirm-box {
    border-top: solid 7px #3498db;
    -webkit-animation-name: type-blue;
    animation-name: type-blue;
}

.ng-confirm.ng-confirm-type-green .ng-confirm-box {
    border-top: solid 7px #2ecc71;
    -webkit-animation-name: type-green;
    animation-name: type-green;
}

.ng-confirm.ng-confirm-type-red .ng-confirm-box {
    border-top: solid 7px #e74c3c;
    -webkit-animation-name: type-red;
    animation-name: type-red;
}

.ng-confirm.ng-confirm-type-orange .ng-confirm-box {
    border-top: solid 7px #f1c40f;
    -webkit-animation-name: type-orange;
    animation-name: type-orange;
}

.ng-confirm.ng-confirm-type-purple .ng-confirm-box {
    border-top: solid 7px #9b59b6;
    -webkit-animation-name: type-purple;
    animation-name: type-purple;
}

.ng-confirm.ng-confirm-type-dark .ng-confirm-box {
    border-top: solid 7px #34495e;
    -webkit-animation-name: type-dark;
    animation-name: type-dark;
}

.ng-confirm .ng-confirm-clear {
    clear: both;
}

.ng-confirm.ng-confirm-rtl {
    direction: rtl;
}

.ng-confirm .ng-confirm-box.ng-confirm-hilight.ng-confirm-hilight-shake {
    -webkit-animation: shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
    animation: shake 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.ng-confirm .ng-confirm-box.ng-confirm-hilight.ng-confirm-hilight-glow {
    -webkit-animation: glow 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
    animation: glow 0.82s cubic-bezier(0.36, 0.07, 0.19, 0.97) both;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

@-webkit-keyframes shake {
    10%, 90% {
        -webkit-transform: translate3d(-2px, 0, 0);
        transform: translate3d(-2px, 0, 0);
    }

    20%, 80% {
        -webkit-transform: translate3d(4px, 0, 0);
        transform: translate3d(4px, 0, 0);
    }

    30%, 50%, 70% {
        -webkit-transform: translate3d(-8px, 0, 0);
        transform: translate3d(-8px, 0, 0);
    }

    40%, 60% {
        -webkit-transform: translate3d(8px, 0, 0);
        transform: translate3d(8px, 0, 0);
    }
}

@keyframes shake {
    10%, 90% {
        -webkit-transform: translate3d(-2px, 0, 0);
        transform: translate3d(-2px, 0, 0);
    }

    20%, 80% {
        -webkit-transform: translate3d(4px, 0, 0);
        transform: translate3d(4px, 0, 0);
    }

    30%, 50%, 70% {
        -webkit-transform: translate3d(-8px, 0, 0);
        transform: translate3d(-8px, 0, 0);
    }

    40%, 60% {
        -webkit-transform: translate3d(8px, 0, 0);
        transform: translate3d(8px, 0, 0);
    }
}

@-webkit-keyframes glow {
    0%, 100% {
        box-shadow: 0 0 3px red;
    }

    50% {
        box-shadow: 0 0 30px red;
    }
}

@keyframes glow {
    0%, 100% {
        box-shadow: 0 0 3px red;
    }

    50% {
        box-shadow: 0 0 30px red;
    }
}
/*Transition rules*/
.ng-confirm {
    -webkit-perspective: 400px;
    perspective: 400px;
}

    .ng-confirm .ng-confirm-box {
        opacity: 1;
    }

        .ng-confirm .ng-confirm-box.ng-confirm-animation-top,
        .ng-confirm .ng-confirm-box.ng-confirm-animation-left,
        .ng-confirm .ng-confirm-box.ng-confirm-animation-right,
        .ng-confirm .ng-confirm-box.ng-confirm-animation-bottom,
        .ng-confirm .ng-confirm-box.ng-confirm-animation-opacity,
        .ng-confirm .ng-confirm-box.ng-confirm-animation-zoom,
        .ng-confirm .ng-confirm-box.ng-confirm-animation-scale,
        .ng-confirm .ng-confirm-box.ng-confirm-animation-none,
        .ng-confirm .ng-confirm-box.ng-confirm-animation-rotate,
        .ng-confirm .ng-confirm-box.ng-confirm-animation-rotatex,
        .ng-confirm .ng-confirm-box.ng-confirm-animation-rotatey,
        .ng-confirm .ng-confirm-box.ng-confirm-animation-scaley,
        .ng-confirm .ng-confirm-box.ng-confirm-animation-scalex {
            opacity: 0;
        }

        .ng-confirm .ng-confirm-box.ng-confirm-animation-rotate {
            -webkit-transform: rotate(90deg);
            -ms-transform: rotate(90deg);
            transform: rotate(90deg);
        }

        .ng-confirm .ng-confirm-box.ng-confirm-animation-rotatex {
            -webkit-transform: rotateX(90deg);
            transform: rotateX(90deg);
            -webkit-transform-origin: center;
            -ms-transform-origin: center;
            transform-origin: center;
        }

        .ng-confirm .ng-confirm-box.ng-confirm-animation-rotatexr {
            -webkit-transform: rotateX(-90deg);
            transform: rotateX(-90deg);
            -webkit-transform-origin: center;
            -ms-transform-origin: center;
            transform-origin: center;
        }

        .ng-confirm .ng-confirm-box.ng-confirm-animation-rotatey {
            -webkit-transform: rotatey(90deg);
            -ms-transform: rotatey(90deg);
            transform: rotatey(90deg);
            -webkit-transform-origin: center;
            -ms-transform-origin: center;
            transform-origin: center;
        }

        .ng-confirm .ng-confirm-box.ng-confirm-animation-rotateyr {
            -webkit-transform: rotatey(-90deg);
            -ms-transform: rotatey(-90deg);
            transform: rotatey(-90deg);
            -webkit-transform-origin: center;
            -ms-transform-origin: center;
            transform-origin: center;
        }

        .ng-confirm .ng-confirm-box.ng-confirm-animation-scaley {
            -webkit-transform: scaley(1.5);
            -ms-transform: scaley(1.5);
            transform: scaley(1.5);
            -webkit-transform-origin: center;
            -ms-transform-origin: center;
            transform-origin: center;
        }

        .ng-confirm .ng-confirm-box.ng-confirm-animation-scalex {
            -webkit-transform: scalex(1.5);
            -ms-transform: scalex(1.5);
            transform: scalex(1.5);
            -webkit-transform-origin: center;
            -ms-transform-origin: center;
            transform-origin: center;
        }

        .ng-confirm .ng-confirm-box.ng-confirm-animation-top {
            -webkit-transform: translate(0px, -100px);
            -ms-transform: translate(0px, -100px);
            transform: translate(0px, -100px);
        }

        .ng-confirm .ng-confirm-box.ng-confirm-animation-left {
            -webkit-transform: translate(-100px, 0px);
            -ms-transform: translate(-100px, 0px);
            transform: translate(-100px, 0px);
        }

        .ng-confirm .ng-confirm-box.ng-confirm-animation-right {
            -webkit-transform: translate(100px, 0px);
            -ms-transform: translate(100px, 0px);
            transform: translate(100px, 0px);
        }

        .ng-confirm .ng-confirm-box.ng-confirm-animation-bottom {
            -webkit-transform: translate(0px, 100px);
            -ms-transform: translate(0px, 100px);
            transform: translate(0px, 100px);
        }

        .ng-confirm .ng-confirm-box.ng-confirm-animation-zoom {
            -webkit-transform: scale(1.2);
            -ms-transform: scale(1.2);
            transform: scale(1.2);
        }

        .ng-confirm .ng-confirm-box.ng-confirm-animation-scale {
            -webkit-transform: scale(0.5);
            -ms-transform: scale(0.5);
            transform: scale(0.5);
        }

        .ng-confirm .ng-confirm-box.ng-confirm-animation-none {
            visibility: hidden;
        }

    .ng-confirm.ng-confirm-light .ng-confirm-bg,
    .ng-confirm.ng-confirm-white .ng-confirm-bg {
        background-color: #444;
        opacity: .2;
    }

    .ng-confirm.ng-confirm-light .ng-confirm-icon-c,
    .ng-confirm.ng-confirm-white .ng-confirm-icon-c {
        margin-right: 8px;
    }

    .ng-confirm.ng-confirm-light.ng-confirm-rtl .ng-confirm-closeIcon,
    .ng-confirm.ng-confirm-white.ng-confirm-rtl .ng-confirm-closeIcon {
        left: 5px !important;
        right: auto !important;
    }

    .ng-confirm.ng-confirm-light.ng-confirm-rtl .ng-confirm-icon-c,
    .ng-confirm.ng-confirm-white.ng-confirm-rtl .ng-confirm-icon-c {
        margin-right: 0;
        margin-left: 8px;
    }

    .ng-confirm.ng-confirm-light .ng-confirm-box,
    .ng-confirm.ng-confirm-white .ng-confirm-box {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
        border-radius: 5px;
    }

        .ng-confirm.ng-confirm-light .ng-confirm-box .ng-confirm-closeIcon,
        .ng-confirm.ng-confirm-white .ng-confirm-box .ng-confirm-closeIcon {
            line-height: 20px;
        }

        .ng-confirm.ng-confirm-light .ng-confirm-box .ng-confirm-buttons,
        .ng-confirm.ng-confirm-white .ng-confirm-box .ng-confirm-buttons {
            float: right;
        }

            .ng-confirm.ng-confirm-light .ng-confirm-box .ng-confirm-buttons button,
            .ng-confirm.ng-confirm-white .ng-confirm-box .ng-confirm-buttons button {
                border: none;
                background-image: none;
                text-transform: uppercase;
                font-size: 13px;
                /*font-weight: bold;*/
                text-shadow: none;
                -webkit-transition: background .1s;
                transition: background .1s;
                color: white;
            }

                .ng-confirm.ng-confirm-light .ng-confirm-box .ng-confirm-buttons button.btn-default,
                .ng-confirm.ng-confirm-white .ng-confirm-box .ng-confirm-buttons button.btn-default {
                    box-shadow: none;
                    color: #333;
                }

                    .ng-confirm.ng-confirm-light .ng-confirm-box .ng-confirm-buttons button.btn-default:hover,
                    .ng-confirm.ng-confirm-white .ng-confirm-box .ng-confirm-buttons button.btn-default:hover {
                        background: #ddd;
                    }

    .ng-confirm.ng-confirm-dark .ng-confirm-bg,
    .ng-confirm.ng-confirm-black .ng-confirm-bg {
        background-color: darkslategray;
        opacity: .4;
    }

    .ng-confirm.ng-confirm-dark .ng-confirm-icon-c,
    .ng-confirm.ng-confirm-black .ng-confirm-icon-c {
        margin-right: 8px;
    }

    .ng-confirm.ng-confirm-dark.ng-confirm-rtl .ng-confirm-closeIcon,
    .ng-confirm.ng-confirm-black.ng-confirm-rtl .ng-confirm-closeIcon {
        left: 5px !important;
        right: auto !important;
    }

    .ng-confirm.ng-confirm-dark.ng-confirm-rtl .ng-confirm-icon-c,
    .ng-confirm.ng-confirm-black.ng-confirm-rtl .ng-confirm-icon-c {
        margin-right: 0;
        margin-left: 8px;
    }

    .ng-confirm.ng-confirm-dark .ng-confirm-box,
    .ng-confirm.ng-confirm-black .ng-confirm-box {
        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
        background: #444;
        border-radius: 5px;
    }

        .ng-confirm.ng-confirm-dark .ng-confirm-box .ng-confirm-closeIcon,
        .ng-confirm.ng-confirm-black .ng-confirm-box .ng-confirm-closeIcon {
            line-height: 20px;
        }

        .ng-confirm.ng-confirm-dark .ng-confirm-box.ng-confirm-loading:before,
        .ng-confirm.ng-confirm-black .ng-confirm-box.ng-confirm-loading:before {
            background: #444;
        }

        .ng-confirm.ng-confirm-dark .ng-confirm-box.ng-confirm-loading:after,
        .ng-confirm.ng-confirm-black .ng-confirm-box.ng-confirm-loading:after {
            border-bottom-color: deepskyblue;
        }

        .ng-confirm.ng-confirm-dark .ng-confirm-box *:not(input):not(textarea):not(select):not(option),
        .ng-confirm.ng-confirm-black .ng-confirm-box *:not(input):not(textarea):not(select):not(option) {
            color: white;
        }

        .ng-confirm.ng-confirm-dark .ng-confirm-box input,
        .ng-confirm.ng-confirm-black .ng-confirm-box input,
        .ng-confirm.ng-confirm-dark .ng-confirm-box textarea,
        .ng-confirm.ng-confirm-black .ng-confirm-box textarea,
        .ng-confirm.ng-confirm-dark .ng-confirm-box select,
        .ng-confirm.ng-confirm-black .ng-confirm-box select,
        .ng-confirm.ng-confirm-dark .ng-confirm-box option,
        .ng-confirm.ng-confirm-black .ng-confirm-box option {
            color: initial;
        }

        .ng-confirm.ng-confirm-dark .ng-confirm-box .ng-confirm-buttons,
        .ng-confirm.ng-confirm-black .ng-confirm-box .ng-confirm-buttons {
            float: right;
        }

            .ng-confirm.ng-confirm-dark .ng-confirm-box .ng-confirm-buttons button,
            .ng-confirm.ng-confirm-black .ng-confirm-box .ng-confirm-buttons button {
                border: none;
                background-image: none;
                text-transform: uppercase;
                font-size: 13px;
                font-weight: bold;
                text-shadow: none;
                -webkit-transition: background .1s;
                transition: background .1s;
                color: white;
            }

                .ng-confirm.ng-confirm-dark .ng-confirm-box .ng-confirm-buttons button.btn-default,
                .ng-confirm.ng-confirm-black .ng-confirm-box .ng-confirm-buttons button.btn-default {
                    box-shadow: none;
                    color: #fff;
                    background: none;
                }

                    .ng-confirm.ng-confirm-dark .ng-confirm-box .ng-confirm-buttons button.btn-default:hover,
                    .ng-confirm.ng-confirm-black .ng-confirm-box .ng-confirm-buttons button.btn-default:hover {
                        background: #666;
                    }

    .ng-confirm.ng-confirm-supervan .ng-confirm-bg {
        background: #36465D;
        opacity: 0.99;
    }

    .ng-confirm.ng-confirm-supervan.ng-confirm-type-blue .ng-confirm-box {
        border: none;
    }

    .ng-confirm.ng-confirm-supervan.ng-confirm-type-blue .ng-confirm-bg {
        background: #217dbb;
    }

    .ng-confirm.ng-confirm-supervan.ng-confirm-type-green .ng-confirm-box {
        border: none;
    }

    .ng-confirm.ng-confirm-supervan.ng-confirm-type-green .ng-confirm-bg {
        background: #25a25a;
    }

    .ng-confirm.ng-confirm-supervan.ng-confirm-type-red .ng-confirm-box {
        border: none;
    }

    .ng-confirm.ng-confirm-supervan.ng-confirm-type-red .ng-confirm-bg {
        background: #d62c1a;
    }

    .ng-confirm.ng-confirm-supervan.ng-confirm-type-orange .ng-confirm-box {
        border: none;
    }

    .ng-confirm.ng-confirm-supervan.ng-confirm-type-orange .ng-confirm-bg {
        background: #c29d0b;
    }

    .ng-confirm.ng-confirm-supervan.ng-confirm-type-purple .ng-confirm-box {
        border: none;
    }

    .ng-confirm.ng-confirm-supervan.ng-confirm-type-purple .ng-confirm-bg {
        background: #804399;
    }

    .ng-confirm.ng-confirm-supervan.ng-confirm-type-dark .ng-confirm-box {
        border: none;
    }

    .ng-confirm.ng-confirm-supervan.ng-confirm-type-dark .ng-confirm-bg {
        background: #222f3d;
    }

    .ng-confirm.ng-confirm-supervan .ng-confirm-box {
        background-color: transparent;
    }

        .ng-confirm.ng-confirm-supervan .ng-confirm-box.ng-confirm-loading:before {
            background: transparent;
        }

        .ng-confirm.ng-confirm-supervan .ng-confirm-box.ng-confirm-loading:after {
            border-bottom-color: transparent;
        }

        .ng-confirm.ng-confirm-supervan .ng-confirm-box div.ng-confirm-closeIcon {
            color: white;
            border-radius: 50px;
            height: 26px;
            width: 26px;
            line-height: 26px;
            top: 2px;
            right: 2px;
            box-shadow: 0 0 0 2px #ddd;
        }

        .ng-confirm.ng-confirm-supervan .ng-confirm-box *:not(input):not(textarea):not(select):not(option) {
            color: white;
        }

        .ng-confirm.ng-confirm-supervan .ng-confirm-box input,
        .ng-confirm.ng-confirm-supervan .ng-confirm-box textarea,
        .ng-confirm.ng-confirm-supervan .ng-confirm-box select,
        .ng-confirm.ng-confirm-supervan .ng-confirm-box option {
            color: initial;
        }

        .ng-confirm.ng-confirm-supervan .ng-confirm-box div.ng-confirm-closeIcon {
            color: white;
        }

        .ng-confirm.ng-confirm-supervan .ng-confirm-box div.ng-confirm-title-c {
            text-align: center;
            font-size: 28px;
            font-weight: normal;
            padding-bottom: 25px;
        }

            .ng-confirm.ng-confirm-supervan .ng-confirm-box div.ng-confirm-title-c > * {
                display: block;
            }

            .ng-confirm.ng-confirm-supervan .ng-confirm-box div.ng-confirm-title-c .ng-confirm-icon-c {
                margin: 0 0 20px;
                font-size: 50px;
            }

        .ng-confirm.ng-confirm-supervan .ng-confirm-box div.ng-confirm-content-pane {
            margin-bottom: 25px;
        }

        .ng-confirm.ng-confirm-supervan .ng-confirm-box div.ng-confirm-content {
            text-align: center;
        }

        .ng-confirm.ng-confirm-supervan .ng-confirm-box .ng-confirm-buttons {
            text-align: center;
        }

            .ng-confirm.ng-confirm-supervan .ng-confirm-box .ng-confirm-buttons button {
                font-size: 16px;
                border-radius: 2px;
                text-shadow: none;
                border: none;
                color: white;
                padding: 10px;
                min-width: 100px;
            }

                .ng-confirm.ng-confirm-supervan .ng-confirm-box .ng-confirm-buttons button.btn-default {
                    background: #303f53;
                }

                    .ng-confirm.ng-confirm-supervan .ng-confirm-box .ng-confirm-buttons button.btn-default:hover {
                        background: #2f3c50;
                        color: white;
                    }

    .ng-confirm.ng-confirm-material .ng-confirm-bg {
        background: dimgray;
        opacity: .6;
    }

    .ng-confirm.ng-confirm-material .ng-confirm-icon-c {
        margin-right: 8px;
    }

    .ng-confirm.ng-confirm-material .ng-confirm-box {
        background-color: white;
        box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 13px 19px 2px rgba(0, 0, 0, 0.14), 0 5px 24px 4px rgba(0, 0, 0, 0.12);
        padding: 30px 25px 10px 25px;
    }

        .ng-confirm.ng-confirm-material .ng-confirm-box div.ng-confirm-closeIcon {
            color: rgba(0, 0, 0, 0.87);
            line-height: 20px;
            top: 15px;
            right: 15px;
        }

        .ng-confirm.ng-confirm-material .ng-confirm-box div.ng-confirm-title-c {
            color: rgba(0, 0, 0, 0.87);
            font-size: 22px;
            font-weight: bold;
        }

        .ng-confirm.ng-confirm-material .ng-confirm-box div.ng-confirm-content {
            text-align: left;
            color: rgba(0, 0, 0, 0.87);
        }

        .ng-confirm.ng-confirm-material .ng-confirm-box .ng-confirm-buttons {
            text-align: right;
        }

            .ng-confirm.ng-confirm-material .ng-confirm-box .ng-confirm-buttons button {
                text-transform: uppercase;
                /*font-weight: 500;*/
            }

    .ng-confirm.ng-confirm-material.ng-confirm-rtl .ng-confirm-closeIcon {
        left: 15px !important;
        right: auto !important;
    }

    .ng-confirm.ng-confirm-material.ng-confirm-rtl .ng-confirm-icon-c {
        margin-right: 0;
        margin-left: 8px;
    }

    .ng-confirm.ng-confirm-bootstrap .ng-confirm-bg {
        background-color: rgba(0, 0, 0, 0.21);
    }

    .ng-confirm.ng-confirm-bootstrap .ng-confirm-icon-c {
        margin-right: 8px;
    }

    .ng-confirm.ng-confirm-bootstrap .ng-confirm-box {
        background-color: white;
        box-shadow: 0 3px 8px 0px rgba(0, 0, 0, 0.2);
        border: solid 1px rgba(0, 0, 0, 0.4);
        padding: 15px 0 0;
        border-radius: 6px;
    }

        .ng-confirm.ng-confirm-bootstrap .ng-confirm-box div.ng-confirm-closeIcon {
            color: rgba(0, 0, 0, 0.87);
            line-height: 20px;
        }

        .ng-confirm.ng-confirm-bootstrap .ng-confirm-box div.ng-confirm-title-c {
            color: rgba(0, 0, 0, 0.87);
            font-size: 22px;
            font-weight: bold;
            padding-left: 15px;
            padding-right: 15px;
        }

        .ng-confirm.ng-confirm-bootstrap .ng-confirm-box div.ng-confirm-content {
            text-align: left;
            color: rgba(0, 0, 0, 0.87);
            padding: 0px 15px;
        }

        .ng-confirm.ng-confirm-bootstrap .ng-confirm-box .ng-confirm-buttons {
            text-align: right;
            padding: 15px;
            margin: -5px 0 0px;
            border-top: solid 1px #ddd;
            overflow: hidden;
            border-radius: 0 0 4px 4px;
        }

            .ng-confirm.ng-confirm-bootstrap .ng-confirm-box .ng-confirm-buttons button {
                font-weight: 500;
                border-radius: 0px;
                margin: 0;
            }

                .ng-confirm.ng-confirm-bootstrap .ng-confirm-box .ng-confirm-buttons button:first-child {
                    border-radius: 4px 0 0 4px;
                }

                .ng-confirm.ng-confirm-bootstrap .ng-confirm-box .ng-confirm-buttons button:last-child {
                    border-radius: 0 4px 4px 0;
                }

    .ng-confirm.ng-confirm-bootstrap.ng-confirm-rtl .ng-confirm-closeIcon {
        left: 5px !important;
        right: auto !important;
    }

    .ng-confirm.ng-confirm-bootstrap.ng-confirm-rtl .ng-confirm-icon-c {
        margin-right: 0;
        margin-left: 8px;
    }

    .ng-confirm.ng-confirm-modern .ng-confirm-bg {
        background-color: slategray;
        opacity: .6;
    }

    .ng-confirm.ng-confirm-modern .ng-confirm-icon-c {
        margin-right: 8px;
    }

    .ng-confirm.ng-confirm-modern .ng-confirm-box {
        background-color: white;
        box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 13px 19px 2px rgba(0, 0, 0, 0.14), 0 5px 24px 4px rgba(0, 0, 0, 0.12);
        padding: 25px 25px 10px 25px;
    }

        .ng-confirm.ng-confirm-modern .ng-confirm-box div.ng-confirm-closeIcon {
            color: rgba(0, 0, 0, 0.87);
            border-radius: 50px;
            height: 25px;
            width: 25px;
            line-height: 25px !important;
            top: 10px;
            right: 10px;
            box-shadow: 0 0 0 2px #ddd;
        }

        .ng-confirm.ng-confirm-modern .ng-confirm-box div.ng-confirm-title-c {
            color: rgba(0, 0, 0, 0.87);
            font-size: 24px;
            font-weight: bold;
            text-align: center;
            margin-bottom: 10px;
        }

            .ng-confirm.ng-confirm-modern .ng-confirm-box div.ng-confirm-title-c .ng-confirm-icon-c {
                display: block;
                margin-right: 0px;
                margin-left: 0px;
                margin-bottom: 10px;
                font-size: 69px;
                color: #aaa;
            }

        .ng-confirm.ng-confirm-modern .ng-confirm-box div.ng-confirm-content {
            font-size: 15px;
            color: #777;
            margin-bottom: 25px;
        }

        .ng-confirm.ng-confirm-modern .ng-confirm-box .ng-confirm-buttons {
            text-align: center;
        }

            .ng-confirm.ng-confirm-modern .ng-confirm-box .ng-confirm-buttons button {
                /*font-weight: bold;*/
                text-transform: uppercase;
                -webkit-transition: background .1s;
                transition: background .1s;
            }

                .ng-confirm.ng-confirm-modern .ng-confirm-box .ng-confirm-buttons button + button {
                    margin-left: 4px;
                }

    .ng-confirm.ng-confirm-seamless .ng-confirm-bg {
        background-color: rgba(255, 255, 255, 0.5);
    }

        .ng-confirm.ng-confirm-seamless .ng-confirm-bg:before {
            border-bottom-color: dodgerblue;
        }

    .ng-confirm.ng-confirm-seamless .ng-confirm-icon-c {
        margin-right: 8px;
    }

    .ng-confirm.ng-confirm-seamless .ng-confirm-box {
        background-color: white;
        box-shadow: 0 7px 8px -4px rgba(0, 0, 0, 0.2), 0 13px 19px 2px rgba(0, 0, 0, 0.14), 0 5px 24px 4px rgba(0, 0, 0, 0.12);
        padding: 20px 0 10px 0;
    }

        .ng-confirm.ng-confirm-seamless .ng-confirm-box div.ng-confirm-closeIcon {
            color: rgba(0, 0, 0, 0.87);
            border-radius: 50px;
            height: 25px;
            width: 25px;
            line-height: 25px !important;
            top: 10px;
            right: 10px;
            box-shadow: 0 0 0 2px #ddd;
        }

        .ng-confirm.ng-confirm-seamless .ng-confirm-box div.ng-confirm-title-c {
            color: rgba(0, 0, 0, 0.87);
            font-size: 24px;
            text-align: center;
        }

            .ng-confirm.ng-confirm-seamless .ng-confirm-box div.ng-confirm-title-c .ng-confirm-icon-c {
                color: #aaa;
            }

            .ng-confirm.ng-confirm-seamless .ng-confirm-box div.ng-confirm-title-c .ng-confirm-title {
                font-weight: bold;
            }

        .ng-confirm.ng-confirm-seamless .ng-confirm-box div.ng-confirm-content {
            text-align: center;
            font-size: 15px;
            color: #464646;
            margin-bottom: 25px;
        }

        .ng-confirm.ng-confirm-seamless .ng-confirm-box .ng-confirm-buttons {
            text-align: center;
        }

            .ng-confirm.ng-confirm-seamless .ng-confirm-box .ng-confirm-buttons button {
                font-size: 16px;
                font-weight: bold;
            }

                .ng-confirm.ng-confirm-seamless .ng-confirm-box .ng-confirm-buttons button + button {
                    margin-left: 4px;
                }

.ng-confirm-el-hide {
    display: none !important;
}

.ng-confirm.ng-confirm-autograb .ng-confirm-bg {
    background-color: #444;
    opacity: .2;
}

.ng-confirm.ng-confirm-autograb .ng-confirm-box {
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
    background: #eee;
    border-radius: 5px;
    padding: 0px;
}

    .ng-confirm.ng-confirm-autograb .ng-confirm-box .ng-confirm-buttons {
        float: right;
    }

    .ng-confirm.ng-confirm-autograb .ng-confirm-box div.ng-confirm-title-c {
        background: white;
        padding: 15px 15px 15px 15px;
    }

    .ng-confirm.ng-confirm-autograb .ng-confirm-box div.ng-confirm-content-pane {
        padding: 15px 15px 0 15px;
        margin-bottom: 5px;
    }

    .ng-confirm.ng-confirm-autograb .ng-confirm-box .ng-confirm-buttons {
        padding-right: 15px;
    }

    .ng-confirm.ng-confirm-autograb .ng-confirm-box div.ng-confirm-content-pane {
        height: 205px !important;
    }


.listing-autograb-popup-subtitle {
    font-size: 13px;
    font-weight: 500;
    display: inline-block;
}

.listing-autograb-popup ul {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    width: 100%;
}

    .listing-autograb-popup ul li {
        display: block;
        flex: 0 1 auto;
        list-style-type: none;
        background: white;
        margin-left: 8px;
        margin-right: 8px;
        border-radius: 4px;
        padding: 6px;
    }

        .listing-autograb-popup ul li span {
            display: block;
            text-align: center;
            margin-top: 3px;
        }

            .listing-autograb-popup ul li span.icon {
                color: red;
            }

            .listing-autograb-popup ul li span label {
                color: #777;
                padding-left: 5px;
                font: 500 15px "Roboto", Sans-Serif !important;
            }

        .listing-autograb-popup ul li listing-price {
            text-align: center;
        }

.ng-confirm.ng-confirm-avanser .ng-confirm-bg {
    background-color: #444;
    opacity: .2;
}

.ng-confirm.ng-confirm-avanser .ng-confirm-box {
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
    background: white;
    border-radius: 5px;
    padding: 0px;
}

    .ng-confirm.ng-confirm-avanser .ng-confirm-box .ng-confirm-buttons {
        float: right;
    }

    .ng-confirm.ng-confirm-avanser .ng-confirm-box div.ng-confirm-title-c {
        background: white;
        padding: 15px 15px 15px 15px;
        border-bottom: solid 2px darkgrey;
    }

    .ng-confirm.ng-confirm-avanser .ng-confirm-box div.ng-confirm-content-pane {
        padding: 15px 15px 0 15px;
        margin-bottom: 5px;
    }

    .ng-confirm.ng-confirm-avanser .ng-confirm-box .ng-confirm-buttons {
        padding-right: 15px;
    }

    .ng-confirm.ng-confirm-avanser .ng-confirm-box div.ng-confirm-content-pane {
        height: 260px !important;
    }

@media (max-width: 480px) {
    .ng-confirm.ng-confirm-avanser .ng-confirm-box div.ng-confirm-content-pane {
        height: 100% !important;
    }
}


/* 
 * Don't modify things marked with ! - unless you know what you're doing
 */

.multiSelect-panel {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently supported by Chrome and Opera */
}


.multiSelect {
    float: left;
    margin-right: 5px;
}

    .multiSelect .search-field-wrapper-multiselect-sm {
        width: 74%;
        float: left;
        padding-left: 8px;
    }

    .multiSelect .search-field-wrapper-multiselect-md {
        width: 80%;
        float: left;
        padding-left: 8px;
    }

    .multiSelect .search-field-wrapper-multiselect-lg {
        margin-left: 8px;
        margin-right: 8px;
    }

    .multiSelect .select-list-wrapper {
        margin-left: 8px;
        margin-right: 8px;
    }

    /* ! create a "row" */
    .multiSelect .line {
        padding: 2px 0px 4px 0px;
        max-height: 34px;
        overflow: hidden;
        box-sizing: content-box;
    }

    /* ! create a "column" */
    .multiSelect .acol {
        display: inline-block;
        min-width: 4px;
    }

    /* ! */
    .multiSelect .inlineBlock {
        display: inline-block;
    }

    /* the multiselect button */
    .multiSelect > button {
        display: inline-block;
        text-align: center;
        cursor: pointer;
        border: 1px solid #474949;
        /*padding: 5px 10px;*/
        font-size: 12px;
        line-height: 1.5;
        min-height: 34px !important;
        border-radius: 3px;
        color: #fff;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        -o-user-select: none;
        user-select: none;
        white-space: normal;
        background-color: #474949;
        outline: none;
        margin-bottom: 5px;
    }

        /* button: hover */
        .multiSelect > button:hover {
            background-color: #2e2f2f;
            border-color: #2e2f2f;
            color: #fff;
        }

        /* button: disabled */
        .multiSelect > button:disabled {
            background-image: linear-gradient(#fff, #fff);
            border: 1px solid #ddd;
            color: #999;
        }

    /* button: clicked */
    /*.multiSelect .buttonClicked {
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15) inset, 0 1px 2px rgba(0, 0, 0, 0.05);
}*/

    .multiSelect > .buttonSelected {
        background-color: transparent !important;
        color: #474949 !important;
    }
    /* labels on the button */
    .multiSelect .buttonLabel {
        display: inline-block;
        /*padding: 5px 0px 5px 0px;*/
    }

    /* downward pointing arrow */
    .multiSelect .caret {
        display: inline-block;
        width: 0;
        height: 0;
        margin: 0px 0px 1px 12px !important;
        vertical-align: middle;
        border-top: 4px solid;
        border-right: 4px solid transparent;
        border-left: 4px solid transparent;
        border-bottom: 0 dotted;
    }

    /* the main checkboxes and helper layer */
    .multiSelect .checkboxLayer {
        background-color: #fff;
        position: absolute;
        z-index: 999;
        border: 1px solid rgba(0, 0, 0, 0.15);
        border-radius: 4px;
        -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
        box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
        /*min-width:278px;*/
        display: none !important;
        margin-top: -4px;
    }

    /* container of helper elements */
    .multiSelect .helperContainer {
        border-bottom: 1px solid #ddd;
        padding: 8px 0px 8px 0px;
        background-color: #eee;
        min-width: 180px; /*SPW-9556*/
    }

    .multiSelect .helperButtonContainer {
        padding: 2px 0px 8px 0px;
    }

    /* helper buttons (select all, none, reset); */
    .multiSelect .helperButton {
        display: inline;
        text-align: center;
        cursor: pointer;
        border: 1px solid #ccc;
        height: 26px;
        font-size: 13px;
        border-radius: 2px;
        color: #666;
        background-color: #f1f1f1;
        line-height: 1.6;
        margin: 0px 0px 8px 0px;
    }

        .multiSelect .helperButton.reset {
            float: right;
        }

        .multiSelect .helperButton:not( .reset ) {
            margin-right: 4px;
        }

    /* clear button */
    .multiSelect .clearButton {
        position: absolute;
        display: inline;
        text-align: center;
        cursor: pointer;
        border: 1px solid #ccc;
        height: 22px;
        width: 22px;
        font-size: 13px;
        border-radius: 2px;
        color: #666;
        background-color: #f1f1f1;
        line-height: 1.4;
        right: 2px;
        top: 4px;
    }

    /* filter */
    .multiSelect .inputFilter {
        padding-right: 40px !important;
    }

    /* helper elements on hover & focus */
    .multiSelect .helperButton:hover {
        border: 1px solid #ccc;
        color: #999;
        background-color: #f4f4f4;
    }

    .multiSelect .helperButton:disabled {
        color: #ccc;
        border: 1px solid #ddd;
    }

    .multiSelect .helperButton:focus,
    .multiSelect .inputFilter:focus {
        border: 1px solid #66AFE9 !important;
        outline: 0;
        -webkit-box-shadow: inset 0 0 1px rgba(0,0,0,.065), 0 0 5px rgba(102, 175, 233, .6) !important;
        box-shadow: inset 0 0 1px rgba(0,0,0,.065), 0 0 5px rgba(102, 175, 233, .6) !important;
    }

    /* container of multi select items */
    .multiSelect .checkBoxContainer {
        display: block;
        /*padding: 8px;*/
        overflow-x: hidden;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        max-height: 75vh;
    }

        .multiSelect .checkBoxContainer.searchBox {
            max-height: 60vh;
        }

@media (max-height: 767px) {
    .multiSelect .checkBoxContainer {
        max-height: 60vh;
    }

        .multiSelect .checkBoxContainer.searchBox {
            max-height: 45vh;
        }
}
/* ! to show / hide the checkbox layer above */
.multiSelect .show {
    display: block !important;
}

/* item labels */
.multiSelect .multiSelectItem {
    display: block;
    padding: 3px;
    color: #444;
    white-space: nowrap;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -o-user-select: none;
    user-select: none;
    border: 1px solid transparent;
    position: relative;
    /*min-width:278px;*/
    /*min-height: 32px;*/
}

    .multiSelect .multiSelectItem.inactive {
        color: #aaaaaa;
        font-style: italic;
    }

    /* Styling on selected items */
    .multiSelect .multiSelectItem:not(.multiSelectGroup).selected {
        background-color: #E52423;
        color: #fff;
        cursor: pointer;
        border: 1px solid #fff;
    }

    .multiSelect .multiSelectItem:not(.multiSelectGroup).excluded {
        background-color: #EEEEEE;
        color: #000;
        cursor: pointer;
        border: 1px solid #fff;
    }

    .multiSelect .multiSelectItem .acol label {
        display: inline-block;
        padding-right: 30px;
        margin: 0px;
        font-weight: normal;
        line-height: normal;
    }

.multiSelect .multiSelectGroup .acol {
}
/* item labels focus on mouse hover */
.multiSelect .multiSelectItem:hover {
    /*background-color: #fff !important;
        color: #E52423 !important;*/
    cursor: pointer !important;
    /*border: 1px solid #E52423 !important;*/
}

.multiSelect .multiSelectGroup:hover {
    /*background-color: #fff !important;*/
    /*color: #E52423 !important;*/
    cursor: pointer;
    /*border: 1px solid #fff !important;*/
}

/* item labels focus using keyboard */
/*.multiSelect .multiSelectFocus {
    background-color: #E52423;
    color: #fff !important;
    cursor: pointer;
    border: 1px solid #fff;
}*/

/* change mouse pointer into the pointing finger */
.multiSelect .multiSelectItem span:hover {
    cursor: pointer;
}

.multiSelect .multiSelectGroup span:hover {
    cursor: default;
}

/* ! group labels */
.multiSelect .multiSelectGroup {
    display: block;
    cursor: pointer !important;
    clear: both;
    color: #E52423;
    font-style: italic;
}

/* right-align the tick mark (&#10004;) */
.multiSelect .tickMark {
    display: inline-block;
    position: absolute;
    right: 10px;
    top: 7px;
    font-size: 10px;
}

/* hide the original HTML checkbox away */
.multiSelect .checkbox {
    color: #ddd !important;
    position: absolute;
    left: -9999px;
    cursor: pointer;
}

/* checkboxes currently disabled */
.multiSelect .disabled,
.multiSelect .disabled:hover,
.multiSelect .disabled label input:hover ~ span {
    color: #c4c4c4 !important;
    cursor: not-allowed !important;
}

/* If you use images in button / checkbox label, you might want to change the image style here. */
.multiSelect img {
    vertical-align: middle;
    margin-bottom: 0px;
    max-height: 22px;
    max-width: 22px;
}

.modal .multiSelect-modal-10 .multiSelect .checkBoxContainer {
    max-height: 10vh;
}

.modal .multiSelect-modal-25 .multiSelect .checkBoxContainer {
    max-height: 25vh;
}

.modal .multiSelect-modal-50 .multiSelect .checkBoxContainer {
    max-height: 50vh;
}

.modal-dialog .checkboxLayer.show {
    position: fixed;
}

.multiSelect-ngConfirm-25 .multiSelect .checkBoxContainer {
    max-height: 25vh;
}

@media (max-width: 481px) {
    .multiSelect .show {
        width: 100% !important;
        right: 0 !important;
        padding: 0 2px;
    }
    /*see line 1581 not sure why set to 100% width, this will override for now*/
    .custom-scrollbar:not(.mobile-menu) {
        width: initial !important;
    }
}

@media(min-width: 481px) {

    .multiSelect-panel {
        margin-right: 50px;
    }
}

/* Reskin on mobile the filter row sat flush against the search bar above it with no
   breathing room - give it the same small top gap it visually has on wider layouts (there,
   it comes from surrounding elements that wrap/stack differently at this width). */
@media (max-width: 767px) {

    .multiSelect-panel {
        margin-top: 10px;
    }
}


.multiSelect-lock-background-scroll {
    overflow: hidden;
}

.selectFullWidth {
    width: 100%;
}

.labelFullWidth {
    width: 100%;
}

.select2-container {
    box-sizing: border-box;
    display: inline-block;
    margin: 0;
    position: relative;
    vertical-align: middle;
}

    .select2-container .select2-selection--single {
        box-sizing: border-box;
        cursor: pointer;
        display: block;
        height: 34px;
        user-select: none;
        -webkit-user-select: none;
    }

        .select2-container .select2-selection--single .select2-selection__rendered {
            display: block;
            padding-left: 8px;
            padding-right: 20px;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        .select2-container .select2-selection--single .select2-selection__clear {
            position: relative;
        }

    .select2-container[dir="rtl"] .select2-selection--single .select2-selection__rendered {
        padding-right: 8px;
        padding-left: 20px;
    }

    .select2-container .select2-selection--multiple {
        box-sizing: border-box;
        cursor: pointer;
        display: block;
        min-height: 32px;
        user-select: none;
        -webkit-user-select: none;
    }

        .select2-container .select2-selection--multiple .select2-selection__rendered {
            display: inline-block;
            overflow: hidden;
            padding-left: 8px;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

    .select2-container .select2-search--inline {
        float: left;
    }

        .select2-container .select2-search--inline .select2-search__field {
            box-sizing: border-box;
            border: none;
            font-size: 100%;
            margin-top: 5px;
            padding: 0;
        }

            .select2-container .select2-search--inline .select2-search__field::-webkit-search-cancel-button {
                -webkit-appearance: none;
            }

.select2-dropdown {
    background-color: white;
    border: 1px solid #ddd;
    border-radius: 4px;
    box-sizing: border-box;
    display: block;
    position: absolute;
    left: -100000px;
    width: 100%;
    z-index: 3000;
}

.select2-results {
    display: block;
    
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    .select2-results {
        max-height:200px;
    }

}

.select2-results__options {
    list-style: none;
    margin: 0;
    padding: 0;
}

.select2-results__option {
    padding: 6px;
    user-select: none;
    -webkit-user-select: none;
}

    .select2-results__option[aria-selected] {
        cursor: pointer;
    }

.select2-container--open .select2-dropdown {
    left: 0;
}

.select2-container--open .select2-dropdown--above {
    border-bottom: none;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.select2-container--open .select2-dropdown--below {
    border-top: none;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.select2-search--dropdown {
    display: block;
    padding: 4px;
}

    .select2-search--dropdown .select2-search__field {
        padding: 4px;
        width: 100%;
        box-sizing: border-box;
    }

        .select2-search--dropdown .select2-search__field::-webkit-search-cancel-button {
            -webkit-appearance: none;
        }

    .select2-search--dropdown.select2-search--hide {
        display: none;
    }

.select2-close-mask {
    border: 0;
    margin: 0;
    padding: 0;
    display: block;
    position: fixed;
    left: 0;
    top: 0;
    min-height: 100%;
    min-width: 100%;
    height: auto;
    width: auto;
    opacity: 0;
    z-index: 99;
    background-color: #fff;
    filter: alpha(opacity=0);
}

.select2-hidden-accessible {
    border: 0 !important;
    clip: rect(0 0 0 0) !important;
    -webkit-clip-path: inset(50%) !important;
    clip-path: inset(50%) !important;
    height: 1px !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: absolute !important;
    width: 1px !important;
    white-space: nowrap !important;
}

.select2-container--default .select2-selection--single {
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
    outline: none;
}

    .select2-container--default .select2-selection--single:focus {
        border: 1px solid #66afe9;
    }

    .select2-container--default .select2-selection--single .select2-selection__rendered {
        color: #777;
        line-height: 34px;
    }

    .select2-container--default .select2-selection--single .select2-selection__clear {
        cursor: pointer;
        float: right;
        font-weight: bold;
        width: 20px;
        text-align: center;
        font-size: 15px;
    }

    .select2-container--default .select2-selection--single .select2-selection__placeholder {
        color: #ddd;
    }

    .select2-container--default .select2-selection--single .select2-selection__arrow {
        height: 32px;
        position: absolute;
        top: 1px;
        right: 1px;
        width: 20px;
    }

.select2-container--default .select2-selection--single .select2-selection__arrow b {
    border-color: #888 transparent transparent transparent;
    border-style: solid;
    border-width: 5px 4px 0 4px;
    height: 0;
    left: 50%;
    margin-left: -4px;
    margin-top: -2px;
    position: absolute;
    top: 50%;
    width: 0;
}

.select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__clear {
    float: left;
}

.select2-container--default[dir="rtl"] .select2-selection--single .select2-selection__arrow {
    left: 1px;
    right: auto;
}

.select2-container--default.select2-container--disabled .select2-selection--single {
    background-color: #eee;
    cursor: default;
    pointer-events: none;
    touch-action: none;
}

    .select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__clear {
        display: none;
    }

    .select2-container--default.select2-container--disabled .select2-selection--single .select2-selection__arrow {
        display: none;
    }

.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
    border-color: transparent transparent #888 transparent;
    border-width: 0 4px 5px 4px;
}

.select2-container--default .select2-selection--multiple {
    background-color: white;
    border: 1px solid #ddd;
    border-radius: 4px;
    cursor: text;
}


.select2-selection--multiple:before {
    content: "";
    position: absolute;
    right: 5px;
    top: 14px;
    border-top: 5px solid #888;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
}

    .select2-container--default .select2-selection--multiple .select2-selection__rendered {
        box-sizing: border-box;
        list-style: none;
        margin: 0;
        padding: 0 5px;
        width: 100%;
    }

        .select2-container--default .select2-selection--multiple .select2-selection__rendered li {
            list-style: none;
        }

    .select2-container--default .select2-selection--multiple .select2-selection__placeholder {
        color: #ddd;
        margin-top: 5px;
        float: left;
    }

    .select2-container--default .select2-selection--multiple .select2-selection__clear {
        cursor: pointer;
        float: right;
        font-weight: bold;
        margin-top: 5px;
        margin-right: 10px;
    }

    .select2-container--default .select2-selection--multiple .select2-selection__choice {
        background-color: #e4e4e4;
        border: 1px solid #ddd;
        border-radius: 4px;
        cursor: default;
        float: left;
        margin-right: 5px;
        margin-top: 5px;
        padding: 0 5px;
    }

    .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
        color: #999;
        cursor: pointer;
        display: inline-block;
        font-weight: bold;
        margin-right: 2px;
    }

        .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover {
            color: #333;
        }

.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__placeholder, .select2-container--default[dir="rtl"] .select2-selection--multiple .select2-search--inline {
    float: right;
}

.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice {
    margin-left: 5px;
    margin-right: auto;
}

.select2-container--default[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove {
    margin-left: 2px;
    margin-right: auto;
}

.select2-container--default.select2-container--focus .select2-selection--multiple {
    border: solid black 1px;
    outline: 0;
}

.select2-container--default.select2-container--disabled .select2-selection--multiple {
    background-color: #eee;
    cursor: default;
}

.select2-container--default.select2-container--disabled .select2-selection__choice__remove {
    display: none;
}

.select2-container--default.select2-container--open.select2-container--above .select2-selection--single, .select2-container--default.select2-container--open.select2-container--above .select2-selection--multiple {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-color: transparent
}

.select2-container--default.select2-container--open.select2-container--below .select2-selection--single, .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    border-bottom-color: transparent;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
    border: 1px solid #ddd;
}

.select2-container--default .select2-search--inline .select2-search__field {
    background: transparent;
    border: none;
    outline: 0;
    box-shadow: none;
    -webkit-appearance: textfield;
}

.select2-container--default .select2-results > .select2-results__options {
    max-height: 200px;
    overflow-y: auto;
}

.select2-container--default .select2-results__option[role=group] {
    padding: 0;
}

.select2-container--default .select2-results__option[aria-disabled=true] {
    color: #999;
}

.select2-container--default .select2-results__option[aria-selected=true] {
    background-color: #ddd;
}

.select2-container--default .select2-results__option .select2-results__option {
    padding-left: 1em;
}

    .select2-container--default .select2-results__option .select2-results__option .select2-results__group {
        padding-left: 0;
    }

    .select2-container--default .select2-results__option .select2-results__option .select2-results__option {
        margin-left: -1em;
        padding-left: 2em;
    }

        .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
            margin-left: -2em;
            padding-left: 3em;
        }

            .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
                margin-left: -3em;
                padding-left: 4em;
            }

                .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
                    margin-left: -4em;
                    padding-left: 5em;
                }

                    .select2-container--default .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option .select2-results__option {
                        margin-left: -5em;
                        padding-left: 6em;
                    }

.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: #5897fb;
    color: white;
}

.select2-container--default .select2-results__group {
    cursor: default;
    display: block;
    padding: 6px;
    color: #E52423;
    font-style: italic;
    font-weight: normal !important;
}

.select2-container--classic .select2-selection--single {
    background-color: #f7f7f7;
    border: 1px solid #ddd;
    border-radius: 4px;
    outline: 0;
    background-image: -webkit-linear-gradient(top, white 50%, #eeeeee 100%);
    background-image: -o-linear-gradient(top, white 50%, #eeeeee 100%);
    background-image: linear-gradient(to bottom, white 50%, #eeeeee 100%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0);
}

    .select2-container--classic .select2-selection--single:focus {
        border: 1px solid #5897fb;
    }

    .select2-container--classic .select2-selection--single .select2-selection__rendered {
        color: #777;
        line-height: 28px;
    }

    .select2-container--classic .select2-selection--single .select2-selection__clear {
        cursor: pointer;
        float: right;
        font-weight: bold;
        margin-right: 10px;
    }

    .select2-container--classic .select2-selection--single .select2-selection__placeholder {
        color: #ddd;
    }

    .select2-container--classic .select2-selection--single .select2-selection__arrow {
        background-color: #ddd;
        border: none;
        border-left: 1px solid #ddd;
        border-top-right-radius: 4px;
        border-bottom-right-radius: 4px;
        height: 26px;
        position: absolute;
        top: 1px;
        right: 1px;
        width: 20px;
        background-image: -webkit-linear-gradient(top, #eeeeee 50%, #cccccc 100%);
        background-image: -o-linear-gradient(top, #eeeeee 50%, #cccccc 100%);
        background-image: linear-gradient(to bottom, #eeeeee 50%, #cccccc 100%);
        background-repeat: repeat-x;
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFCCCCCC', GradientType=0);
    }

        .select2-container--classic .select2-selection--single .select2-selection__arrow b {
            border-color: #888 transparent transparent transparent;
            border-style: solid;
            border-width: 5px 4px 0 4px;
            height: 0;
            left: 50%;
            margin-left: -4px;
            margin-top: -2px;
            position: absolute;
            top: 50%;
            width: 0;
        }

.select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__clear {
    float: left;
}

.select2-container--classic[dir="rtl"] .select2-selection--single .select2-selection__arrow {
    border: none;
    border-right: 1px solid #ddd;
    border-radius: 0;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    left: 1px;
    right: auto;
}

.select2-container--classic.select2-container--open .select2-selection--single {
    border: 1px solid #5897fb;
}

    .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow {
        background: transparent;
        border: none;
    }

        .select2-container--classic.select2-container--open .select2-selection--single .select2-selection__arrow b {
            border-color: transparent transparent #888 transparent;
            border-width: 0 4px 5px 4px;
        }

.select2-container--classic.select2-container--open.select2-container--above .select2-selection--single {
    border-top: none;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    background-image: -webkit-linear-gradient(top, white 0%, #eeeeee 50%);
    background-image: -o-linear-gradient(top, white 0%, #eeeeee 50%);
    background-image: linear-gradient(to bottom, white 0%, #eeeeee 50%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFFFF', endColorstr='#FFEEEEEE', GradientType=0);
}

.select2-container--classic.select2-container--open.select2-container--below .select2-selection--single {
    border-bottom: none;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    background-image: -webkit-linear-gradient(top, #eeeeee 50%, white 100%);
    background-image: -o-linear-gradient(top, #eeeeee 50%, white 100%);
    background-image: linear-gradient(to bottom, #eeeeee 50%, white 100%);
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFEEEEEE', endColorstr='#FFFFFFFF', GradientType=0);
}

.select2-container--classic .select2-selection--multiple {
    background-color: white;
    border: 1px solid #ddd;
    border-radius: 4px;
    cursor: text;
    outline: 0;
}

    .select2-container--classic .select2-selection--multiple:focus {
        border: 1px solid #5897fb;
    }

    .select2-container--classic .select2-selection--multiple .select2-selection__rendered {
        list-style: none;
        margin: 0;
        padding: 0 5px;
    }

    .select2-container--classic .select2-selection--multiple .select2-selection__clear {
        display: none;
    }

    .select2-container--classic .select2-selection--multiple .select2-selection__choice {
        background-color: #e4e4e4;
        border: 1px solid #ddd;
        border-radius: 4px;
        cursor: default;
        float: left;
        margin-right: 5px;
        margin-top: 5px;
        padding: 0 5px;
    }

    .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove {
        color: #888;
        cursor: pointer;
        display: inline-block;
        font-weight: bold;
        margin-right: 2px;
    }

        .select2-container--classic .select2-selection--multiple .select2-selection__choice__remove:hover {
            color: #555;
        }

.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice {
    float: right;
    margin-left: 5px;
    margin-right: auto;
}

.select2-container--classic[dir="rtl"] .select2-selection--multiple .select2-selection__choice__remove {
    margin-left: 2px;
    margin-right: auto;
}

.select2-container--classic.select2-container--open .select2-selection--multiple {
    border: 1px solid #5897fb;
}

.select2-container--classic.select2-container--open.select2-container--above .select2-selection--multiple {
    border-top: none;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.select2-container--classic.select2-container--open.select2-container--below .select2-selection--multiple {
    border-bottom: none;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.select2-container--classic .select2-search--dropdown .select2-search__field {
    border: 1px solid #ddd;
    outline: 0;
}

.select2-container--classic .select2-search--inline .select2-search__field {
    outline: 0;
    box-shadow: none;
}

.select2-container--classic .select2-dropdown {
    background-color: white;
    border: 1px solid transparent;
}

.select2-container--classic .select2-dropdown--above {
    border-bottom: none;
}

.select2-container--classic .select2-dropdown--below {
    border-top: none;
}

.select2-container--classic .select2-results > .select2-results__options {
    max-height: 200px;
    overflow-y: auto;
}

.select2-container--classic .select2-results__option[role=group] {
    padding: 0;
}

.select2-container--classic .select2-results__option[aria-disabled=true] {
    color: grey;
}

.select2-container--classic .select2-results__option--highlighted[aria-selected] {
    background-color: #3875d7;
    color: white;
}

.select2-container--classic .select2-results__group {
    cursor: default;
    display: block;
    padding: 6px;
}

.select2-container--classic.select2-container--open .select2-dropdown {
    border-color: #5897fb;
}

.select2 {
    width: 100% !important;
}
/*@media screen and (max-width: 767px) {
    .select2 {
        width: 100% !important;
    }
}*/


/*!
 * Name: angular-carousel-3d
 * GIT Page: https://github.com/Wlada/angular-carousel-3d
 * Version: 0.3.0 - 2017-09-05T07:51:58.007Z
 * License: MIT
 */

.carousel-3d-container {
    width: 100%;
    overflow: hidden;
    position: relative;
    z-index: 0;
    margin: 30px auto
}

.carousel-3d {
    position: relative;
    margin: 0 auto;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-perspective: 1000px;
    -moz-perspective: 1000px;
    -o-perspective: 1000px;
    -ms-perspective: 1000px;
    perspective: 1000px;
}

    .carousel-3d.ng-hide {
        opacity: 0;
    }

    .carousel-3d.ng-hide-remove {
        transition: opacity linear 1000ms;
    }

    .carousel-3d.ng-hide-add {
        transition: opacity linear 500ms;
    }

    .carousel-3d .slide-3d {
        border-radius: 4px;
        border-color: #000;
        border-color: rgba(0, 0, 0, 0.4);
        border-style: solid;
        background-size: cover;
    }

        .carousel-3d .slide-3d figure img {
            width: 100%;
            -webkit-user-drag: none;
            -khtml-user-drag: none;
            -moz-user-drag: none;
            -o-user-drag: none;
            user-drag: none;
            pointer-events: none;
        }

        .carousel-3d .slide-3d figure figcaption {
            position: absolute;
            background: rgba(0, 0, 0, 0.5);
            color: #fff;
            width: 100%;
            left: 0;
            bottom: 0;
            font-weight: normal;
            text-align: center;
            padding: 7px 10px;
        }
/*====================================*/
.carousel-3d-controls {
    position: absolute;
    top: 30%;
    left: 0;
    width: 100%;
    z-index: 9099;
}

.carousel-3d-next,
.carousel-3d-prev {
    width: 60px;
    position: absolute !important;
    z-index: 9999;
}

    .carousel-3d-next:hover,
    .carousel-3d-prev:hover {
        cursor: pointer;
    }

.carousel-3d-next {
    left: 0;
}

.carousel-3d-prev {
    right: 0;
}

.arrow-top,
.arrow-right,
.arrow-bottom,
.arrow-left {
    display: block;
    margin: 20px auto;
    overflow: hidden;
    position: relative;
}

.arrow-top,
.arrow-bottom {
    height: 34px;
    width: 64px;
}

.arrow-right,
.arrow-left {
    height: 64px;
    width: 34px;
}

    .arrow-top:before,
    .arrow-right:before,
    .arrow-bottom:before,
    .arrow-left:before {
        border: 30px solid transparent;
        content: ' ';
        display: block;
        position: absolute;
        z-index: 2;
    }

.arrow-top:before {
    border-bottom-color: #000000;
    left: 2px;
    bottom: 0;
}

.arrow-right:before {
    border-left-color: #000000;
    left: 0;
    top: 2px;
}

.arrow-bottom:before {
    border-top-color: #000000;
    left: 2px;
    top: 0;
}

.arrow-left:before {
    border-right-color: #000000;
    right: 0;
    top: 2px;
}

.arrow-top-bg:after,
.arrow-right-bg:after,
.arrow-bottom-bg:after,
.arrow-left-bg:after {
    border: 32px solid transparent;
    content: ' ';
    display: block;
    position: absolute;
    z-index: 1;
}

.arrow-top-bg:after {
    border-bottom-color: #000000;
    bottom: 0;
    left: 0;
}

.arrow-right-bg:after {
    border-left-color: #000000;
    left: 0;
    top: 0;
}

.arrow-bottom-bg:after {
    border-top-color: #000000;
    left: 0;
    top: 0;
}

.arrow-left-bg:after {
    border-right-color: #000000;
    right: 0;
    top: 0;
}
/*====================================*/
@-webkit-keyframes uil-rolling-anim {
    0% {
        -ms-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    50% {
        -ms-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -webkit-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    100% {
        -ms-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-webkit-keyframes uil-rolling-anim {
    0% {
        -ms-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    50% {
        -ms-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -webkit-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    100% {
        -ms-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-moz-keyframes uil-rolling-anim {
    0% {
        -ms-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    50% {
        -ms-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -webkit-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    100% {
        -ms-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-ms-keyframes uil-rolling-anim {
    0% {
        -ms-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    50% {
        -ms-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -webkit-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    100% {
        -ms-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-moz-keyframes uil-rolling-anim {
    0% {
        -ms-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    50% {
        -ms-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -webkit-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    100% {
        -ms-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-webkit-keyframes uil-rolling-anim {
    0% {
        -ms-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    50% {
        -ms-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -webkit-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    100% {
        -ms-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@-o-keyframes uil-rolling-anim {
    0% {
        -ms-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    50% {
        -ms-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -webkit-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    100% {
        -ms-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes uil-rolling-anim {
    0% {
        -ms-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    50% {
        -ms-transform: rotate(180deg);
        -moz-transform: rotate(180deg);
        -webkit-transform: rotate(180deg);
        -o-transform: rotate(180deg);
        transform: rotate(180deg);
    }

    100% {
        -ms-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

.carousel-3d-loader-circle {
    width: 100px;
    height: 100px;
    margin: 50px auto;
}

    .carousel-3d-loader-circle > div {
        width: 100px;
        height: 100px;
        position: relative;
        -ms-animation: uil-rolling-anim 1s linear infinite;
        -moz-animation: uil-rolling-anim 1s linear infinite;
        -webkit-animation: uil-rolling-anim 1s linear infinite;
        -o-animation: uil-rolling-anim 1s linear infinite;
        animation: uil-rolling-anim 1s linear infinite;
    }

        .carousel-3d-loader-circle > div div {
            position: absolute;
            width: 100px;
            height: 50px;
            border-radius: 500px 500px 0 0;
            border-color: #000000;
            border-style: solid;
            border-width: 20px;
            border-bottom-width: 0;
            display: none !important;
        }

            .carousel-3d-loader-circle > div div:nth-of-type(2) {
                -ms-transform: translate(0, 25px) rotate(27deg) translate(0, -25px);
                -moz-transform: translate(0, 25px) rotate(27deg) translate(0, -25px);
                -webkit-transform: translate(0, 25px) rotate(27deg) translate(0, -25px);
                -o-transform: translate(0, 25px) rotate(27deg) translate(0, -25px);
                transform: translate(0, 25px) rotate(27deg) translate(0, -25px);
                display: none !important;
            }

.carousel-3d-loader {
    position: relative;
}

.carousel-3d-loader-percentage {
    display: none !important;
}

.carousel-3d-loader-error {
    font-size: 18px;
    position: absolute;
    top: 50%;
    text-align: center;
    width: 100%;
    margin-top: -9px;
    line-height: 18px;
}

.fuel_economy_icon {
    width: 270px;
    height: 90px;
}

    .fuel_economy_icon img {
        width: 270px;
        height: 90px;
    }

.fuel_economy_text {
    position: relative;
    z-index: 20;
    font-size: 20px !important;
    color: #444;
    font-weight: bold;
    right: -97px;
    top: -48px;
    font-family: Arial,sans-serif !important;
    max-width: 90%;
}

.safety_icon {
    width: 270px;
    height: 180px;
}

    .safety_icon img {
        width: 270px;
        height: 180px;
    }

.safety_text {
    position: relative;
    z-index: 20;
    font-size: 13px;
    color: #444444;
    left: 7px;
    top: -60px;
    width: 260px !important;
    font-family: Arial,sans-serif;
}

@font-face {
    font-family: "Number Plate";
    src: url(/Content/fonts/UKNumberPlate.ttf) format('truetype');
}

.numberplate {
    font-family: "Number Plate", Verdana, Tahoma;
    font-size: 17px;
    color: #000;
    background-color: #fff;
    border: 3px #000 solid;
    border-radius: 4px;
    padding: 5px 7px 5px 7px;
    max-width: 100px;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
    text-transform: uppercase;
    white-space: nowrap;
    width: 100px;
    margin-top: -1px;
}

/*IE fix numberplate text*/
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    /* IE10+ CSS styles go here */

    .numberplate {
        padding: 8px 7px 0 7px;
    }
}

.stocknumber {
    font-size: 17px;
    color: #000;
}

@media (max-width: 1023px) {
    .hide-mobile.stocknumber {
        display: none;
    }
}

#photoButtons {
    height: 100%;
    /*background-color: #000;
    opacity: 0.8;*/
    position: fixed;
    z-index: 100;
    top: 0;
    right: 0;
    width: 80px;
    padding: 10px;
}

    #photoButtons button {
        margin: 0 0 20px 0;
        opacity: 1;
        width: 60px;
        height: 60px;
        font-size: 24px;
    }

#centerButtons {
    text-align: center;
    position: relative;
    top: 50%;
    transform: perspective(1px) translateY(-50%);
}

/*.zoom-slider.rzslider .rz-bar {
    background: #5cb85c;
}

.zoom-slider.rzslider .rz-pointer {
    left: -11px !important;
    background-color: #5cb85c;
}

#zoomButtons {
    height: 90%;
    top: 20px;
    left: -22px;
    position: absolute;
}*/

@media (max-width: 767px) and (orientation:landscape) {
    #photoButtons {
        height: 100%;
        /*background-color: #000;
        opacity: 0.8;*/
        position: fixed;
        z-index: 100;
        top: 0;
        right: 0;
        width: 80px;
        padding: 0 20px;
    }

        #photoButtons button {
            margin: 0 0 20px 0;
            opacity: 1;
            width: 40px;
            height: 40px;
            font-size: 16px;
        }

    #centerButtons {
        position: relative;
        top: 50%;
        transform: perspective(1px) translateY(-50%);
    }
}


@media (max-width: 480px) {

    #photoButtons {
        height: 60px;
        /*background-color: #000;
        opacity: 0.8;*/
        position: fixed;
        z-index: 100;
        top: unset;
        bottom: 5px;
        left: 0;
        width: 100%;
        padding: 20px 0;
    }

        #photoButtons button {
            margin: 0 0 0 20px;
            opacity: 1;
            width: 40px;
            height: 40px;
            font-size: 16px;
        }

    #centerButtons {
        width: 260px;
        margin: 0 auto;
    }
}

/* aspect ratio of 1.32 used */
.camera-overlay {
    position: fixed;
    border: 2px solid #5cb85c;
    border-radius: 20px;
}

.camera-overlay-buttons {
    position: fixed;
    width: 100vw;
    text-align: center;
}

.camera-overlay-vehicle {
    position: fixed;
    border: 2px solid #5cb85c;
    border-radius: 20px;
}

.camera-overlay-wireframe-car {
    position: fixed;
    background-image: url(/images/wireframes/car/1.png);
    background-size: cover;
    background-repeat: no-repeat;
}

.camera-overlay-vehicle-buttons {
    position: fixed;
    width: 100vw;
    text-align: center;
}

@media (orientation:landscape) {

    .camera-overlay {
        left: calc(50% - 30vw); /* 50% - width/2 */
        top: calc(50% - 25vw); /* 50% - height/2 */
        width: 60vw;
        height: 36vw; /* based on width and not height so we retain the correct aspect when portrait or landscape */
    }

    .camera-overlay-buttons {
        top: calc(50% + 12vw);
    }

    .camera-overlay-vehicle {
        left: calc(50% - 20vw); /* 50% - width/2 */
        top: calc(50% - 8vw); /* 50% - height/2 */
        width: 40vw;
        height: 16vw; /* based on width and not height so we retain the correct aspect when portrait or landscape */
    }

    .camera-overlay-wireframe-car {
        left: calc(50% - 20vw); /* 50% - width/2 */
        top: calc(50% - 8vw); /* 50% - height/2 */
        width: 40vw;
        height: 16vw; /* based on width and not height so we retain the correct aspect when portrait or landscape */
    }

    .camera-overlay-vehicle-buttons {
        top: calc(50% + 9vw);
    }
}

@media (min-width: 768px) and (orientation:portrait) {

    .camera-overlay {
        left: calc(50% - 48vw); /* 50% - width/2 */
        top: calc(50% - 26vw); /* 50% - height/2 */
        width: 86vw;
        height: 52vw; /* based on width and not height so we retain the correct aspect when portrait or landscape */
    }

    .camera-overlay-buttons {
        top: calc(50% + 27vw);
    }

    .camera-overlay-vehicle {
        left: calc(50% - 35vw); /* 50% - width/2 */
        top: calc(50% - 14vw); /* 50% - height/2 */
        width: 70vw;
        height: 28vw; /* based on width and not height so we retain the correct aspect when portrait or landscape */
    }

    .camera-overlay-wireframe-car {
        left: calc(50% - 35vw); /* 50% - width/2 */
        top: calc(50% - 14vw); /* 50% - height/2 */
        width: 70vw;
        height: 28vw; /* based on width and not height so we retain the correct aspect when portrait or landscape */
    }
    
    .camera-overlay-vehicle-buttons {
        top: calc(50% + 27vw);
    }
}

@media (max-width: 767px) and (orientation:portrait) {

    .camera-overlay {
        left: calc(50% - 49vw); /* 50% - width/2 */
        top: calc(50% - 30vw); /* 50% - height/2 */
        width: 98vw;
        height: 60vw; /* based on width and not height so we retain the correct aspect when portrait or landscape */
    }

    .camera-overlay-buttons {
        top: calc(50% + 30vw);
    }

    .camera-overlay-vehicle {
        left: calc(50% - 37vw); /* 50% - width/2 */
        top: calc(50% - 15vw); /* 50% - height/2 */
        width: 75vw;
        height: 30vw; /* based on width and not height so we retain the correct aspect when portrait or landscape */
    }

    .camera-overlay-wireframe-car {
        left: calc(50% - 37vw); /* 50% - width/2 */
        top: calc(50% - 15vw); /* 50% - height/2 */
        width: 75vw;
        height: 30vw; /* based on width and not height so we retain the correct aspect when portrait or landscape */
    }
    
    .camera-overlay-vehicle-buttons {
        top: calc(50% + 17vw);
    }
}

.camera-overlay-text {
    color: #5cb85c;
    min-height: 1.6em;
}

.camera-overlay-button {
    background-color: #fff;
    border: 2px solid #5cb85c;
    /*color: #5cb85c;*/
    color: lightgrey;
    padding-top: 3px;
    transition: none;
}

    .camera-overlay-button:focus, .camera-overlay-button.focus {
        background-color: #fff;
        border: 2px solid #5cb85c;
        /*color: #5cb85c;*/
        color: lightgrey;
    }

    .camera-overlay-button:hover {
        background-color: #fff;
        border: 2px solid #5cb85c;
        /*color: #5cb85c;*/
        color: lightgrey;
    }

    .camera-overlay-button:active, .camera-overlay-button.active,
    .open > .camera-overlay-button.dropdown-toggle {
        background-color: #5cb85c;
        border: 2px solid #5cb85c;
        color: #fff;
    }


.btn-group-camera > .btn:last-child:not(:first-child) {
    border-bottom-right-radius: 50px;
    border-top-right-radius: 50px;
    left: -25px;
    padding-left: 60px;
    padding-right: 20px;
}

.btn-group-camera > .btn:first-child:not(:last-child) {
    border-bottom-left-radius: 50px;
    border-top-left-radius: 50px;
    right: -25px;
    padding-right: 60px;
    padding-left: 20px;
}

.btn-group-camera > .btn.active {
    border-radius: 50px !important;
    padding-right: 20px !important;
    padding-left: 20px !important;
    z-index: 3;
}

.camera-overlay-button:active:hover, .camera-overlay-button:active:focus, .camera-overlay-button:active.focus, .camera-overlay-button.active:hover, .camera-overlay-button.active:focus, .camera-overlay-button.active.focus,
.open > .camera-overlay-button.dropdown-toggle:hover,
.open > .camera-overlay-button.dropdown-toggle:focus,
.open > .camera-overlay-button.dropdown-toggle.focus {
    background-color: #5cb85c;
    border: 2px solid #5cb85c;
    color: #fff;
}

.camera-image-count {
    position: absolute;
    top: -7px;
    right: -7px;
    height: 22px;
    width: 22px;
    border-radius: 50%;
    border: 2px solid #fff;
    font-size: 11px;
    line-height: 20px;
    vertical-align: central;
    text-align: center;
    background: radial-gradient(circle, #E52423, #E52423);
    color: #fff;
}

.camera-zoom {
    position: relative;
    left: calc(50% - 25vw);
}

@media (max-width: 767px) and (orientation:portrait) {

    .camera-image-count {
        right: unset;
        left: 48px;
    }
}

@media (orientation:portrait) {
    .video {
        object-fit: cover;
        width: 100vw;
        height: 100vh;
    }
}

@media (orientation:landscape) {
    .video {
        object-fit: cover;
        width: 100vw;
        height: 100vh;
    }
}

.drawableCanvas {
}

@media (orientation:portrait) {
    .drawableCanvas {
        /*object-fit: cover;*/
        /*width: 100vw;
        height: 100vh;*/
    }
}

@media (orientation:landscape) {
    .drawableCanvas {
        /*object-fit: cover;*/
        /*width: 100vw;
        height: 100vh;*/
    }
}


textarea[readonly] {
    background-color: #fff !important;
}

.image-list {
    margin-left: 0;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 0px 5px 10px 5px;
}

.stopwatch {
    font-size: 17px;
    color: #444;
    background-color: #ddd;
    border: 2px #ddd solid;
    border-radius: 4px;
    max-width: 90px;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
    text-transform: uppercase;
    white-space: nowrap;
    width: 90px;
}

.video-modal-body {
    /*max-height: 70vh;*/
    overflow-y: auto;
    position: relative; 
    padding: 15px;
}

.video-modal-body > video {
    width: 100%;
}

@media (max-width: 767px) {
    .video-modal-body > video {
        height: 70vh;
    }
}
/*@media (max-width: 767px) and (orientation: portrait) {
    .video-modal-body {
        max-height: 55vh;
    }
}*/
#customLightBox {
    list-style-type: none;
    padding: 0;
    margin: 0 3px 0 0;
    width: 80px;
    float: right;
}

    #customLightBox li {
        list-style-type: none;
        padding: 0;
        margin: 0;
        float: right;
    }

        #customLightBox li:nth-of-type(1n+2) {
            display: none;
        }

.lightbox-modal {
    z-index: 9050 !important;
}

    .lightbox-modal .modal-body {
        max-height: 100%;
        overflow: hidden;
        position: relative;
    }

.lightbox-nav {
    margin-bottom: 12px; /* the font-size of .btn-xs */
    height: 22px;
    text-align: center;
    font-size: 0; /* prevent the otherwise inherited font-size and line-height from adding extra space to the bottom of this div */
}

    .lightbox-nav .btn-group {
        vertical-align: top;
        width: 100%;
        position: relative;
    }

    .lightbox-nav .btn {
        display: none;
        position: fixed;
        z-index: 999;
        text-indent: -9999px;
        width: 27px;
        height: 40px;
        overflow: no-display;
        opacity: 0.8;
        top: 45%;
    }

        .lightbox-nav .btn:hover {
            opacity: 0.5;
        }

        .lightbox-nav .btn:first-child {
            width: 27px;
            height: 40px;
            display: block;
            left: 0;
            background-image: url(/Images/lightbox/arrowsSmall.png);
            background-repeat: no-repeat;
            background-position: 0 0;
        }



        .lightbox-nav .btn:last-child {
            width: 27px;
            height: 40px;
            display: block;
            right: 0;
            background-image: url(/Images/lightbox/arrowsSmall.png);
            background-repeat: no-repeat;
            background-position: -29px 0;
        }


.lightbox-image-container {
    position: relative;
    text-align: center; /* center the image */
}

/* the caption overlays the top left corner of the image */
.lightbox-image-caption {
    position: absolute;
    top: 0;
    left: 0;
    margin: 0.5em 0.9em; /* the left and right margins are offset by 0.4em for the span box-shadow */
    color: #000;
    font-size: 1.5em;
    font-weight: bold;
    text-align: left;
    text-shadow: 0.1em 0.1em 0.2em rgba(255, 255, 255, 0.5);
}

    .lightbox-image-caption span {
        padding-top: 0.1em;
        padding-bottom: 0.1em;
        background-color: rgba(255, 255, 255, 0.75);
        /* pad the left and right of each line of text */
        box-shadow: 0.4em 0 0 rgba(255, 255, 255, 0.75), -0.4em 0 0 rgba(255, 255, 255, 0.75);
    }

/*@media (max-width: 767px) and (orientation:portrait) {
    .lightbox-nav .btn-group {
        display: none;
    }
}*/

.uib-time input {
    width: 30px;
    padding: 0 !important;
}

.uib-time.hours,
.uib-time.minutes,
.uib-time.am-pm {
    padding-top: 10px;
}

.uib-time.am-pm {
    padding-left: 2px;
}

.uib-time > .btn-default {
    padding: 0;
    height: 34px;
    width: 30px;
    position: relative;
}

.uib-separator {
    padding-top: 10px;
    padding-left: 1px;
    padding-right: 1px;
    font-weight: 600;
}

.uib-increment > .btn-link, .uib-decrement > .btn-link {
    padding: 0;
    height: 10px;
    font-size: 20px;
}

.uib-increment > .btn-link {
    margin-top: -14px;
}

.uib-decrement > .btn-link {
    margin-top: -8px;
}

    .uib-increment > .btn-link.disabled, .uib-decrement > .btn-link.disabled {
        color: transparent;
    }

.uib-monthpicker:focus {
    outline: 0 !important;
}

.uib-yearpicker:focus {
    outline: 0 !important;
}
.signature-pad {
    width: 100%;
    height: 100%;
}

.signature-pad-canvas {
    display: block;
    margin: 0 auto;
    border: solid 1px #ddd;
    border-radius: 4px;
}

    .signature-pad-canvas.no-margin {
        margin: unset;
    }

.signature-pad-image {
    display: block;
    margin: 0 auto;
}

.signature-pad-icon {
    float: left;
    display: block;
    margin: 10px 0 0 0;
    position: relative;
    z-index: 999;
    cursor: pointer;
}

.signature-pad-label {
}

@media (max-width: 767px) {
    .signature-pad-canvas {
        margin-left: 0;
    }

    img.signature-pad-image {
        float: left;
        height: 100px !important;
        width: auto;
    }
}

.toast-title {
  font-weight: bold;
}
.toast-message {
  word-wrap: break-word;
}
.toast-message a,
.toast-message label {
  color: #FFFFFF;
}
.toast-message a:hover {
  color: #CCCCCC;
  text-decoration: none;
}
.toast-close-button {
  position: relative;
  right: -0.3em;
  top: -0.3em;
  float: right;
  font-size: 20px;
  font-weight: bold;
  color: #FFFFFF;
  -webkit-text-shadow: 0 1px 0 #ffffff;
  text-shadow: 0 1px 0 #ffffff;
  opacity: 0.8;
}
.toast-close-button:hover,
.toast-close-button:focus {
  color: #000000;
  text-decoration: none;
  cursor: pointer;
  opacity: 0.4;
}
/*Additional properties for button version
 iOS requires the button element instead of an anchor tag.
 If you want the anchor version, it requires `href="#"`.*/
button.toast-close-button {
  padding: 0;
  cursor: pointer;
  background: transparent;
  border: 0;
  -webkit-appearance: none;
}
.toast-top-center {
  top: 0;
  right: 0;
  width: 100%;
}
.toast-bottom-center {
  bottom: 0;
  right: 0;
  width: 100%;
}
.toast-top-full-width {
  top: 0;
  right: 0;
  width: 100%;
}
.toast-bottom-full-width {
  bottom: 0;
  right: 0;
  width: 100%;
}
.toast-top-left {
  top: 12px;
  left: 12px;
}
.toast-top-right {
  top: 12px;
  right: 12px;
}
.toast-bottom-right {
  right: 12px;
  bottom: 12px;
}
.toast-bottom-left {
  bottom: 12px;
  left: 12px;
}
#toast-container {
  position: fixed;
  z-index: 999999;
  /*overrides*/
}
#toast-container * {
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#toast-container .toast {
  position: relative;
  overflow: hidden;
  margin: 0 0 6px;
  padding: 15px 15px 15px 50px;
  width: 300px;
  -moz-border-radius: 3px 3px 3px 3px;
  -webkit-border-radius: 3px 3px 3px 3px;
  border-radius: 3px 3px 3px 3px;
  background-position: 15px center;
  background-repeat: no-repeat;
  -moz-box-shadow: 0 0 12px #999999;
  -webkit-box-shadow: 0 0 12px #999999;
  box-shadow: 0 0 12px #999999;
  color: #FFFFFF;
  opacity: 0.9;
}
#toast-container .toast:hover {
  -moz-box-shadow: 0 0 12px #000000;
  -webkit-box-shadow: 0 0 12px #000000;
  box-shadow: 0 0 12px #000000;
  opacity: 1;
  cursor: pointer;
}
#toast-container .toast.toast-info {
    background-image: url(/Content/toastr/info.png);
}
    #toast-container .toast.toast-error {
        background-image: url(/Content/toastr/error.png);
    }
    #toast-container .toast.toast-success {
        background-image: url(/Content/toastr/success.png);
    }
    #toast-container .toast.toast-warning {
        background-image: url(/Content/toastr/warning.png);
    }
#toast-container.toast-top-center .toast,
#toast-container.toast-bottom-center .toast {
  width: 300px;
  margin-left: auto;
  margin-right: auto;
}
#toast-container.toast-top-full-width .toast,
#toast-container.toast-bottom-full-width .toast {
  width: 96%;
  margin-left: auto;
  margin-right: auto;
}
.toast {
  background-color: #030303;
}
.toast-success {
    background-color: #5cb85c;
}
.toast-error {
    background-color: #E52423;
}
.toast-info {
  background-color: #2F96B4;
}
.toast-warning {
  background-color: #F89406;
}
progress-bar {
  position: absolute;
  left: 0;
  bottom: 0;
  height: 4px;
  background-color: #000000;
  opacity: 0.4;
}
/*Animations*/
div[toast] {
  opacity: 1 !important;
}
div[toast].ng-enter {
  opacity: 0 !important;
  transition: opacity .3s linear;
}
div[toast].ng-enter.ng-enter-active {
  opacity: 1 !important;
}
div[toast].ng-leave {
  opacity: 1;
  transition: opacity .3s linear;
}
div[toast].ng-leave.ng-leave-active {
  opacity: 0 !important;
}
/*Responsive Design*/
@media all and (max-width: 240px) {
  #toast-container .toast.div {
    padding: 8px 8px 8px 50px;
    width: 11em;
  }
  #toast-container .toast-close-button {
    right: -0.2em;
    top: -0.2em;
  }
}
@media all and (min-width: 241px) and (max-width: 480px) {
  #toast-container .toast.div {
    padding: 8px 8px 8px 50px;
    width: 18em;
  }
  #toast-container .toast-close-button {
    right: -0.2em;
    top: -0.2em;
  }
}
@media all and (min-width: 481px) and (max-width: 768px) {
  #toast-container .toast.div {
    padding: 15px 15px 15px 50px;
    width: 25em;
  }
}

table.dataTable tbody > tr.highlighted, table.dataTable tbody > tr > .highlighted {
    color: #1c90fb;
    /*font-weight: bold;*/
    font-style: italic;
}

table.dataTable tbody > tr.selected.highlighted, table.dataTable tbody > tr > .selected.highlighted {
    color: #1c50fb;
    /*font-weight: bold;*/
    font-style: italic;
}

table.dataTable tbody > tr.selected, table.dataTable tbody > tr > .selected {
    background-color: #B0BED9
}

table.dataTable.stripe tbody > tr.odd.selected, table.dataTable.stripe tbody > tr.odd > .selected, table.dataTable.display tbody > tr.odd.selected, table.dataTable.display tbody > tr.odd > .selected {
    background-color: #acbad4
}

table.dataTable.hover tbody > tr.selected:hover, table.dataTable.hover tbody > tr > .selected:hover, table.dataTable.display tbody > tr.selected:hover, table.dataTable.display tbody > tr > .selected:hover {
    background-color: #aab7d1
}

table.dataTable.order-column tbody > tr.selected > .sorting_1, table.dataTable.order-column tbody > tr.selected > .sorting_2, table.dataTable.order-column tbody > tr.selected > .sorting_3, table.dataTable.order-column tbody > tr > .selected, table.dataTable.display tbody > tr.selected > .sorting_1, table.dataTable.display tbody > tr.selected > .sorting_2, table.dataTable.display tbody > tr.selected > .sorting_3, table.dataTable.display tbody > tr > .selected {
    background-color: #acbad5
}

table.dataTable.display tbody > tr.odd.selected > .sorting_1, table.dataTable.order-column.stripe tbody > tr.odd.selected > .sorting_1 {
    background-color: #a6b4cd
}

table.dataTable.display tbody > tr.odd.selected > .sorting_2, table.dataTable.order-column.stripe tbody > tr.odd.selected > .sorting_2 {
    background-color: #a8b5cf
}

table.dataTable.display tbody > tr.odd.selected > .sorting_3, table.dataTable.order-column.stripe tbody > tr.odd.selected > .sorting_3 {
    background-color: #a9b7d1
}

table.dataTable.display tbody > tr.even.selected > .sorting_1, table.dataTable.order-column.stripe tbody > tr.even.selected > .sorting_1 {
    background-color: #acbad5
}

table.dataTable.display tbody > tr.even.selected > .sorting_2, table.dataTable.order-column.stripe tbody > tr.even.selected > .sorting_2 {
    background-color: #aebcd6
}

table.dataTable.display tbody > tr.even.selected > .sorting_3, table.dataTable.order-column.stripe tbody > tr.even.selected > .sorting_3 {
    background-color: #afbdd8
}

table.dataTable.display tbody > tr.odd > .selected, table.dataTable.order-column.stripe tbody > tr.odd > .selected {
    background-color: #a6b4cd
}

table.dataTable.display tbody > tr.even > .selected, table.dataTable.order-column.stripe tbody > tr.even > .selected {
    background-color: #acbad5
}

table.dataTable.display tbody > tr.selected:hover > .sorting_1, table.dataTable.order-column.hover tbody > tr.selected:hover > .sorting_1 {
    background-color: #a2aec7
}

table.dataTable.display tbody > tr.selected:hover > .sorting_2, table.dataTable.order-column.hover tbody > tr.selected:hover > .sorting_2 {
    background-color: #a3b0c9
}

table.dataTable.display tbody > tr.selected:hover > .sorting_3, table.dataTable.order-column.hover tbody > tr.selected:hover > .sorting_3 {
    background-color: #a5b2cb
}

table.dataTable.display tbody > tr:hover > .selected, table.dataTable.display tbody > tr > .selected:hover, table.dataTable.order-column.hover tbody > tr:hover > .selected, table.dataTable.order-column.hover tbody > tr > .selected:hover {
    background-color: #a2aec7
}

table.dataTable tbody td.select-checkbox, table.dataTable tbody th.select-checkbox {
    position: relative
}

    table.dataTable tbody td.select-checkbox:before, table.dataTable tbody td.select-checkbox:after, table.dataTable tbody th.select-checkbox:before, table.dataTable tbody th.select-checkbox:after {
        display: block;
        position: absolute;
        top: 1.2em;
        left: 50%;
        width: 12px;
        height: 12px;
        box-sizing: border-box
    }

    table.dataTable tbody td.select-checkbox:before, table.dataTable tbody th.select-checkbox:before {
        content: ' ';
        margin-top: -6px;
        margin-left: -6px;
        border: 1px solid black;
        border-radius: 3px
    }

table.dataTable tr.selected td.select-checkbox:after, table.dataTable tr.selected th.select-checkbox:after {
    content: '\2714';
    margin-top: -11px;
    margin-left: -4px;
    text-align: center;
    text-shadow: 1px 1px #B0BED9, -1px -1px #B0BED9, 1px -1px #B0BED9, -1px 1px #B0BED9
}

div.dataTables_wrapper span.select-info, div.dataTables_wrapper span.select-item {
    margin-left: 0.5em
}

@media screen and (max-width: 640px) {
    div.dataTables_wrapper span.select-info, div.dataTables_wrapper span.select-item {
        margin-left: 0;
        display: block
    }
}

.printModal {
    font-family: sans-serif;
    display: flex;
    text-align: center;
    font-weight: 300;
    font-size: 30px;
    left: 0;
    top: 0;
    position: absolute;
    color: #0460B5;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.91);
}

/* === Print Modal Close Button === */
.printClose {
    position: absolute;
    right: 10px;
    top: 10px;
}

    .printClose:before {
        content: "\00D7";
        font-family: "Helvetica Neue", sans-serif;
        font-weight: 100;
        line-height: 1px;
        padding-top: 0.5em;
        display: block;
        font-size: 2em;
        text-indent: 1px;
        overflow: hidden;
        height: 1.25em;
        width: 1.25em;
        text-align: center;
        cursor: pointer;
    }

/* === Print Modal Spinner */
.printSpinner {
    margin-top: 3px;
    margin-left: -40px;
    position: absolute;
    display: inline-block;
    width: 25px;
    height: 25px;
    border: 2px solid #0460B5;
    border-radius: 50%;
    animation: spin 0.75s infinite linear;
}

    .printSpinner::before, .printSpinner::after {
        left: -2px;
        top: -2px;
        display: none;
        position: absolute;
        content: '';
        width: inherit;
        height: inherit;
        border: inherit;
        border-radius: inherit;
    }

    .printSpinner, .printSpinner::before, .printSpinner::after {
        display: inline-block;
        border-color: transparent;
        border-top-color: #0460B5;
        animation-duration: 1.2s;
    }

        .printSpinner::before {
            transform: rotate(120deg);
        }

        .printSpinner::after {
            transform: rotate(240deg);
        }

@keyframes spin {
    from {
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

/* line 1, ../../source/scss/ng-img-crop.scss */
img-crop {
  width: 100%;
  height: 100%;
  display: block;
  position: relative;
  overflow: hidden;
}
/* line 7, ../../source/scss/ng-img-crop.scss */
img-crop canvas {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  outline: none;
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
  /* mobile webkit */
}


.edit-avatar {
    /*background: #E4E4E4;*/
    overflow: hidden;
    width: 192px;
    height: 192px;
    position: relative;
    margin: 0 auto;
}

.preview-avatar {
    background-color: #fff4f4;
    border-radius: 8px;
    width: 192px;
    height: 192px;
    padding: 8px;
    position: relative;
    margin: 0 auto;
}

.preview-avatar-delete {
    position: absolute;
    top: 10px;
    right: 7px;
    z-index: 20;
}

.preview-avatar-fix-orientation {
    position: absolute;
    top: 7px;
    left: 7px;
    z-index: 20;
}

.p-t-60 {
    padding-top: 60px !important;
}
/**
 * angular-bootstrap-calendar - A pure AngularJS bootstrap themed responsive calendar that can display events and has views for year, month, week and day
 * @version v1.0.0
 * @link https://github.com/mattlewis92/angular-bootstrap-calendar
 * @license MIT
 */
mwl-calendar [class*="cal-cell"] {
    float: left;
    margin-left: 0;
    min-height: 1px;
}

mwl-calendar .cal-row-fluid {
    width: 100%;
    *zoom: 1;
}

    mwl-calendar .cal-row-fluid:before,
    mwl-calendar .cal-row-fluid:after {
        display: table;
        content: "";
        line-height: 0;
    }

    mwl-calendar .cal-row-fluid:after {
        clear: both;
    }

    mwl-calendar .cal-row-fluid [class*="cal-cell"] {
        display: block;
        width: 100%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        float: left;
        margin-left: 0%;
        *margin-left: -0.05213764%;
    }

        mwl-calendar .cal-row-fluid [class*="cal-cell"]:first-child {
            margin-left: 0;
        }

    mwl-calendar .cal-row-fluid .controls-row [class*="cal-cell"] + [class*="cal-cell"] {
        margin-left: 0%;
    }

mwl-calendar .cal-week-box.cal-grid-1 .cal-row-fluid .cal-cell1,
mwl-calendar .cal-month-box.cal-grid-1 .cal-row-fluid .cal-cell1 {
    width: 100%;
    *width: 99.93781095%;
}

mwl-calendar .cal-week-box.cal-grid-1 .cal-row-fluid .cal-offset1,
mwl-calendar .cal-month-box.cal-grid-1 .cal-row-fluid .cal-offset1,
mwl-calendar .cal-week-box.cal-grid-1 .cal-row-fluid .cal-offset1:first-child,
mwl-calendar .cal-month-box.cal-grid-1 .cal-row-fluid .cal-offset1:first-child,
mwl-calendar .cal-week-box.cal-grid-1 .cal-week-box .cal-offset1,
mwl-calendar .cal-month-box.cal-grid-1 .cal-week-box .cal-offset1 {
    margin-left: 100%;
    *margin-left: 99.93781095%;
}

mwl-calendar .cal-week-box.cal-grid-2 .cal-row-fluid .cal-cell1,
mwl-calendar .cal-month-box.cal-grid-2 .cal-row-fluid .cal-cell1 {
    width: 50%;
    *width: 49.96890547%;
}

mwl-calendar .cal-week-box.cal-grid-2 .cal-row-fluid .cal-offset1,
mwl-calendar .cal-month-box.cal-grid-2 .cal-row-fluid .cal-offset1,
mwl-calendar .cal-week-box.cal-grid-2 .cal-row-fluid .cal-offset1:first-child,
mwl-calendar .cal-month-box.cal-grid-2 .cal-row-fluid .cal-offset1:first-child,
mwl-calendar .cal-week-box.cal-grid-2 .cal-week-box .cal-offset1,
mwl-calendar .cal-month-box.cal-grid-2 .cal-week-box .cal-offset1 {
    margin-left: 50%;
    *margin-left: 49.96890547%;
}

mwl-calendar .cal-week-box.cal-grid-2 .cal-row-fluid .cal-cell2,
mwl-calendar .cal-month-box.cal-grid-2 .cal-row-fluid .cal-cell2 {
    width: 100%;
    *width: 99.93781095%;
}

mwl-calendar .cal-week-box.cal-grid-2 .cal-row-fluid .cal-offset2,
mwl-calendar .cal-month-box.cal-grid-2 .cal-row-fluid .cal-offset2,
mwl-calendar .cal-week-box.cal-grid-2 .cal-row-fluid .cal-offset2:first-child,
mwl-calendar .cal-month-box.cal-grid-2 .cal-row-fluid .cal-offset2:first-child,
mwl-calendar .cal-week-box.cal-grid-2 .cal-week-box .cal-offset2,
mwl-calendar .cal-month-box.cal-grid-2 .cal-week-box .cal-offset2 {
    margin-left: 100%;
    *margin-left: 99.93781095%;
}

mwl-calendar .cal-week-box.cal-grid-3 .cal-row-fluid .cal-cell1,
mwl-calendar .cal-month-box.cal-grid-3 .cal-row-fluid .cal-cell1 {
    width: 33.33333333%;
    *width: 33.31260365%;
}

mwl-calendar .cal-week-box.cal-grid-3 .cal-row-fluid .cal-offset1,
mwl-calendar .cal-month-box.cal-grid-3 .cal-row-fluid .cal-offset1,
mwl-calendar .cal-week-box.cal-grid-3 .cal-row-fluid .cal-offset1:first-child,
mwl-calendar .cal-month-box.cal-grid-3 .cal-row-fluid .cal-offset1:first-child,
mwl-calendar .cal-week-box.cal-grid-3 .cal-week-box .cal-offset1,
mwl-calendar .cal-month-box.cal-grid-3 .cal-week-box .cal-offset1 {
    margin-left: 33.33333333%;
    *margin-left: 33.31260365%;
}

mwl-calendar .cal-week-box.cal-grid-3 .cal-row-fluid .cal-cell2,
mwl-calendar .cal-month-box.cal-grid-3 .cal-row-fluid .cal-cell2 {
    width: 66.66666667%;
    *width: 66.6252073%;
}

mwl-calendar .cal-week-box.cal-grid-3 .cal-row-fluid .cal-offset2,
mwl-calendar .cal-month-box.cal-grid-3 .cal-row-fluid .cal-offset2,
mwl-calendar .cal-week-box.cal-grid-3 .cal-row-fluid .cal-offset2:first-child,
mwl-calendar .cal-month-box.cal-grid-3 .cal-row-fluid .cal-offset2:first-child,
mwl-calendar .cal-week-box.cal-grid-3 .cal-week-box .cal-offset2,
mwl-calendar .cal-month-box.cal-grid-3 .cal-week-box .cal-offset2 {
    margin-left: 66.66666667%;
    *margin-left: 66.6252073%;
}

mwl-calendar .cal-week-box.cal-grid-3 .cal-row-fluid .cal-cell3,
mwl-calendar .cal-month-box.cal-grid-3 .cal-row-fluid .cal-cell3 {
    width: 100%;
    *width: 99.93781095%;
}

mwl-calendar .cal-week-box.cal-grid-3 .cal-row-fluid .cal-offset3,
mwl-calendar .cal-month-box.cal-grid-3 .cal-row-fluid .cal-offset3,
mwl-calendar .cal-week-box.cal-grid-3 .cal-row-fluid .cal-offset3:first-child,
mwl-calendar .cal-month-box.cal-grid-3 .cal-row-fluid .cal-offset3:first-child,
mwl-calendar .cal-week-box.cal-grid-3 .cal-week-box .cal-offset3,
mwl-calendar .cal-month-box.cal-grid-3 .cal-week-box .cal-offset3 {
    margin-left: 100%;
    *margin-left: 99.93781095%;
}

mwl-calendar .cal-week-box.cal-grid-4 .cal-row-fluid .cal-cell1,
mwl-calendar .cal-month-box.cal-grid-4 .cal-row-fluid .cal-cell1 {
    width: 25%;
    *width: 24.98445274%;
}

mwl-calendar .cal-week-box.cal-grid-4 .cal-row-fluid .cal-offset1,
mwl-calendar .cal-month-box.cal-grid-4 .cal-row-fluid .cal-offset1,
mwl-calendar .cal-week-box.cal-grid-4 .cal-row-fluid .cal-offset1:first-child,
mwl-calendar .cal-month-box.cal-grid-4 .cal-row-fluid .cal-offset1:first-child,
mwl-calendar .cal-week-box.cal-grid-4 .cal-week-box .cal-offset1,
mwl-calendar .cal-month-box.cal-grid-4 .cal-week-box .cal-offset1 {
    margin-left: 25%;
    *margin-left: 24.98445274%;
}

mwl-calendar .cal-week-box.cal-grid-4 .cal-row-fluid .cal-cell2,
mwl-calendar .cal-month-box.cal-grid-4 .cal-row-fluid .cal-cell2 {
    width: 50%;
    *width: 49.96890547%;
}

mwl-calendar .cal-week-box.cal-grid-4 .cal-row-fluid .cal-offset2,
mwl-calendar .cal-month-box.cal-grid-4 .cal-row-fluid .cal-offset2,
mwl-calendar .cal-week-box.cal-grid-4 .cal-row-fluid .cal-offset2:first-child,
mwl-calendar .cal-month-box.cal-grid-4 .cal-row-fluid .cal-offset2:first-child,
mwl-calendar .cal-week-box.cal-grid-4 .cal-week-box .cal-offset2,
mwl-calendar .cal-month-box.cal-grid-4 .cal-week-box .cal-offset2 {
    margin-left: 50%;
    *margin-left: 49.96890547%;
}

mwl-calendar .cal-week-box.cal-grid-4 .cal-row-fluid .cal-cell3,
mwl-calendar .cal-month-box.cal-grid-4 .cal-row-fluid .cal-cell3 {
    width: 75%;
    *width: 74.95335821%;
}

mwl-calendar .cal-week-box.cal-grid-4 .cal-row-fluid .cal-offset3,
mwl-calendar .cal-month-box.cal-grid-4 .cal-row-fluid .cal-offset3,
mwl-calendar .cal-week-box.cal-grid-4 .cal-row-fluid .cal-offset3:first-child,
mwl-calendar .cal-month-box.cal-grid-4 .cal-row-fluid .cal-offset3:first-child,
mwl-calendar .cal-week-box.cal-grid-4 .cal-week-box .cal-offset3,
mwl-calendar .cal-month-box.cal-grid-4 .cal-week-box .cal-offset3 {
    margin-left: 75%;
    *margin-left: 74.95335821%;
}

mwl-calendar .cal-week-box.cal-grid-4 .cal-row-fluid .cal-cell4,
mwl-calendar .cal-month-box.cal-grid-4 .cal-row-fluid .cal-cell4 {
    width: 100%;
    *width: 99.93781095%;
}

mwl-calendar .cal-week-box.cal-grid-4 .cal-row-fluid .cal-offset4,
mwl-calendar .cal-month-box.cal-grid-4 .cal-row-fluid .cal-offset4,
mwl-calendar .cal-week-box.cal-grid-4 .cal-row-fluid .cal-offset4:first-child,
mwl-calendar .cal-month-box.cal-grid-4 .cal-row-fluid .cal-offset4:first-child,
mwl-calendar .cal-week-box.cal-grid-4 .cal-week-box .cal-offset4,
mwl-calendar .cal-month-box.cal-grid-4 .cal-week-box .cal-offset4 {
    margin-left: 100%;
    *margin-left: 99.93781095%;
}

mwl-calendar .cal-week-box.cal-grid-5 .cal-row-fluid .cal-cell1,
mwl-calendar .cal-month-box.cal-grid-5 .cal-row-fluid .cal-cell1 {
    width: 20%;
    *width: 19.98756219%;
}

mwl-calendar .cal-week-box.cal-grid-5 .cal-row-fluid .cal-offset1,
mwl-calendar .cal-month-box.cal-grid-5 .cal-row-fluid .cal-offset1,
mwl-calendar .cal-week-box.cal-grid-5 .cal-row-fluid .cal-offset1:first-child,
mwl-calendar .cal-month-box.cal-grid-5 .cal-row-fluid .cal-offset1:first-child,
mwl-calendar .cal-week-box.cal-grid-5 .cal-week-box .cal-offset1,
mwl-calendar .cal-month-box.cal-grid-5 .cal-week-box .cal-offset1 {
    margin-left: 20%;
    *margin-left: 19.98756219%;
}

mwl-calendar .cal-week-box.cal-grid-5 .cal-row-fluid .cal-cell2,
mwl-calendar .cal-month-box.cal-grid-5 .cal-row-fluid .cal-cell2 {
    width: 40%;
    *width: 39.97512438%;
}

mwl-calendar .cal-week-box.cal-grid-5 .cal-row-fluid .cal-offset2,
mwl-calendar .cal-month-box.cal-grid-5 .cal-row-fluid .cal-offset2,
mwl-calendar .cal-week-box.cal-grid-5 .cal-row-fluid .cal-offset2:first-child,
mwl-calendar .cal-month-box.cal-grid-5 .cal-row-fluid .cal-offset2:first-child,
mwl-calendar .cal-week-box.cal-grid-5 .cal-week-box .cal-offset2,
mwl-calendar .cal-month-box.cal-grid-5 .cal-week-box .cal-offset2 {
    margin-left: 40%;
    *margin-left: 39.97512438%;
}

mwl-calendar .cal-week-box.cal-grid-5 .cal-row-fluid .cal-cell3,
mwl-calendar .cal-month-box.cal-grid-5 .cal-row-fluid .cal-cell3 {
    width: 60%;
    *width: 59.96268657%;
}

mwl-calendar .cal-week-box.cal-grid-5 .cal-row-fluid .cal-offset3,
mwl-calendar .cal-month-box.cal-grid-5 .cal-row-fluid .cal-offset3,
mwl-calendar .cal-week-box.cal-grid-5 .cal-row-fluid .cal-offset3:first-child,
mwl-calendar .cal-month-box.cal-grid-5 .cal-row-fluid .cal-offset3:first-child,
mwl-calendar .cal-week-box.cal-grid-5 .cal-week-box .cal-offset3,
mwl-calendar .cal-month-box.cal-grid-5 .cal-week-box .cal-offset3 {
    margin-left: 60%;
    *margin-left: 59.96268657%;
}

mwl-calendar .cal-week-box.cal-grid-5 .cal-row-fluid .cal-cell4,
mwl-calendar .cal-month-box.cal-grid-5 .cal-row-fluid .cal-cell4 {
    width: 80%;
    *width: 79.95024876%;
}

mwl-calendar .cal-week-box.cal-grid-5 .cal-row-fluid .cal-offset4,
mwl-calendar .cal-month-box.cal-grid-5 .cal-row-fluid .cal-offset4,
mwl-calendar .cal-week-box.cal-grid-5 .cal-row-fluid .cal-offset4:first-child,
mwl-calendar .cal-month-box.cal-grid-5 .cal-row-fluid .cal-offset4:first-child,
mwl-calendar .cal-week-box.cal-grid-5 .cal-week-box .cal-offset4,
mwl-calendar .cal-month-box.cal-grid-5 .cal-week-box .cal-offset4 {
    margin-left: 80%;
    *margin-left: 79.95024876%;
}

mwl-calendar .cal-week-box.cal-grid-5 .cal-row-fluid .cal-cell5,
mwl-calendar .cal-month-box.cal-grid-5 .cal-row-fluid .cal-cell5 {
    width: 100%;
    *width: 99.93781095%;
}

mwl-calendar .cal-week-box.cal-grid-5 .cal-row-fluid .cal-offset5,
mwl-calendar .cal-month-box.cal-grid-5 .cal-row-fluid .cal-offset5,
mwl-calendar .cal-week-box.cal-grid-5 .cal-row-fluid .cal-offset5:first-child,
mwl-calendar .cal-month-box.cal-grid-5 .cal-row-fluid .cal-offset5:first-child,
mwl-calendar .cal-week-box.cal-grid-5 .cal-week-box .cal-offset5,
mwl-calendar .cal-month-box.cal-grid-5 .cal-week-box .cal-offset5 {
    margin-left: 100%;
    *margin-left: 99.93781095%;
}

mwl-calendar .cal-week-box.cal-grid-6 .cal-row-fluid .cal-cell1,
mwl-calendar .cal-month-box.cal-grid-6 .cal-row-fluid .cal-cell1 {
    width: 16.66666667%;
    *width: 16.65630182%;
}

mwl-calendar .cal-week-box.cal-grid-6 .cal-row-fluid .cal-offset1,
mwl-calendar .cal-month-box.cal-grid-6 .cal-row-fluid .cal-offset1,
mwl-calendar .cal-week-box.cal-grid-6 .cal-row-fluid .cal-offset1:first-child,
mwl-calendar .cal-month-box.cal-grid-6 .cal-row-fluid .cal-offset1:first-child,
mwl-calendar .cal-week-box.cal-grid-6 .cal-week-box .cal-offset1,
mwl-calendar .cal-month-box.cal-grid-6 .cal-week-box .cal-offset1 {
    margin-left: 16.66666667%;
    *margin-left: 16.65630182%;
}

mwl-calendar .cal-week-box.cal-grid-6 .cal-row-fluid .cal-cell2,
mwl-calendar .cal-month-box.cal-grid-6 .cal-row-fluid .cal-cell2 {
    width: 33.33333333%;
    *width: 33.31260365%;
}

mwl-calendar .cal-week-box.cal-grid-6 .cal-row-fluid .cal-offset2,
mwl-calendar .cal-month-box.cal-grid-6 .cal-row-fluid .cal-offset2,
mwl-calendar .cal-week-box.cal-grid-6 .cal-row-fluid .cal-offset2:first-child,
mwl-calendar .cal-month-box.cal-grid-6 .cal-row-fluid .cal-offset2:first-child,
mwl-calendar .cal-week-box.cal-grid-6 .cal-week-box .cal-offset2,
mwl-calendar .cal-month-box.cal-grid-6 .cal-week-box .cal-offset2 {
    margin-left: 33.33333333%;
    *margin-left: 33.31260365%;
}

mwl-calendar .cal-week-box.cal-grid-6 .cal-row-fluid .cal-cell3,
mwl-calendar .cal-month-box.cal-grid-6 .cal-row-fluid .cal-cell3 {
    width: 50%;
    *width: 49.96890547%;
}

mwl-calendar .cal-week-box.cal-grid-6 .cal-row-fluid .cal-offset3,
mwl-calendar .cal-month-box.cal-grid-6 .cal-row-fluid .cal-offset3,
mwl-calendar .cal-week-box.cal-grid-6 .cal-row-fluid .cal-offset3:first-child,
mwl-calendar .cal-month-box.cal-grid-6 .cal-row-fluid .cal-offset3:first-child,
mwl-calendar .cal-week-box.cal-grid-6 .cal-week-box .cal-offset3,
mwl-calendar .cal-month-box.cal-grid-6 .cal-week-box .cal-offset3 {
    margin-left: 50%;
    *margin-left: 49.96890547%;
}

mwl-calendar .cal-week-box.cal-grid-6 .cal-row-fluid .cal-cell4,
mwl-calendar .cal-month-box.cal-grid-6 .cal-row-fluid .cal-cell4 {
    width: 66.66666667%;
    *width: 66.6252073%;
}

mwl-calendar .cal-week-box.cal-grid-6 .cal-row-fluid .cal-offset4,
mwl-calendar .cal-month-box.cal-grid-6 .cal-row-fluid .cal-offset4,
mwl-calendar .cal-week-box.cal-grid-6 .cal-row-fluid .cal-offset4:first-child,
mwl-calendar .cal-month-box.cal-grid-6 .cal-row-fluid .cal-offset4:first-child,
mwl-calendar .cal-week-box.cal-grid-6 .cal-week-box .cal-offset4,
mwl-calendar .cal-month-box.cal-grid-6 .cal-week-box .cal-offset4 {
    margin-left: 66.66666667%;
    *margin-left: 66.6252073%;
}

mwl-calendar .cal-week-box.cal-grid-6 .cal-row-fluid .cal-cell5,
mwl-calendar .cal-month-box.cal-grid-6 .cal-row-fluid .cal-cell5 {
    width: 83.33333333%;
    *width: 83.28150912%;
}

mwl-calendar .cal-week-box.cal-grid-6 .cal-row-fluid .cal-offset5,
mwl-calendar .cal-month-box.cal-grid-6 .cal-row-fluid .cal-offset5,
mwl-calendar .cal-week-box.cal-grid-6 .cal-row-fluid .cal-offset5:first-child,
mwl-calendar .cal-month-box.cal-grid-6 .cal-row-fluid .cal-offset5:first-child,
mwl-calendar .cal-week-box.cal-grid-6 .cal-week-box .cal-offset5,
mwl-calendar .cal-month-box.cal-grid-6 .cal-week-box .cal-offset5 {
    margin-left: 83.33333333%;
    *margin-left: 83.28150912%;
}

mwl-calendar .cal-week-box.cal-grid-6 .cal-row-fluid .cal-cell6,
mwl-calendar .cal-month-box.cal-grid-6 .cal-row-fluid .cal-cell6 {
    width: 100%;
    *width: 99.93781095%;
}

mwl-calendar .cal-week-box.cal-grid-6 .cal-row-fluid .cal-offset6,
mwl-calendar .cal-month-box.cal-grid-6 .cal-row-fluid .cal-offset6,
mwl-calendar .cal-week-box.cal-grid-6 .cal-row-fluid .cal-offset6:first-child,
mwl-calendar .cal-month-box.cal-grid-6 .cal-row-fluid .cal-offset6:first-child,
mwl-calendar .cal-week-box.cal-grid-6 .cal-week-box .cal-offset6,
mwl-calendar .cal-month-box.cal-grid-6 .cal-week-box .cal-offset6 {
    margin-left: 100%;
    *margin-left: 99.93781095%;
}

mwl-calendar .cal-week-box.cal-grid-7 .cal-row-fluid .cal-cell1,
mwl-calendar .cal-month-box.cal-grid-7 .cal-row-fluid .cal-cell1 {
    width: 14.28571429%;
    *width: 14.27683014%;
}

mwl-calendar .cal-week-box.cal-grid-7 .cal-row-fluid .cal-offset1,
mwl-calendar .cal-month-box.cal-grid-7 .cal-row-fluid .cal-offset1,
mwl-calendar .cal-week-box.cal-grid-7 .cal-row-fluid .cal-offset1:first-child,
mwl-calendar .cal-month-box.cal-grid-7 .cal-row-fluid .cal-offset1:first-child,
mwl-calendar .cal-week-box.cal-grid-7 .cal-week-box .cal-offset1,
mwl-calendar .cal-month-box.cal-grid-7 .cal-week-box .cal-offset1 {
    margin-left: 14.28571429%;
    *margin-left: 14.27683014%;
}

mwl-calendar .cal-week-box.cal-grid-7 .cal-row-fluid .cal-cell2,
mwl-calendar .cal-month-box.cal-grid-7 .cal-row-fluid .cal-cell2 {
    width: 28.57142857%;
    *width: 28.55366027%;
}

mwl-calendar .cal-week-box.cal-grid-7 .cal-row-fluid .cal-offset2,
mwl-calendar .cal-month-box.cal-grid-7 .cal-row-fluid .cal-offset2,
mwl-calendar .cal-week-box.cal-grid-7 .cal-row-fluid .cal-offset2:first-child,
mwl-calendar .cal-month-box.cal-grid-7 .cal-row-fluid .cal-offset2:first-child,
mwl-calendar .cal-week-box.cal-grid-7 .cal-week-box .cal-offset2,
mwl-calendar .cal-month-box.cal-grid-7 .cal-week-box .cal-offset2 {
    margin-left: 28.57142857%;
    *margin-left: 28.55366027%;
}

mwl-calendar .cal-week-box.cal-grid-7 .cal-row-fluid .cal-cell3,
mwl-calendar .cal-month-box.cal-grid-7 .cal-row-fluid .cal-cell3 {
    width: 42.85714286%;
    *width: 42.83049041%;
}

mwl-calendar .cal-week-box.cal-grid-7 .cal-row-fluid .cal-offset3,
mwl-calendar .cal-month-box.cal-grid-7 .cal-row-fluid .cal-offset3,
mwl-calendar .cal-week-box.cal-grid-7 .cal-row-fluid .cal-offset3:first-child,
mwl-calendar .cal-month-box.cal-grid-7 .cal-row-fluid .cal-offset3:first-child,
mwl-calendar .cal-week-box.cal-grid-7 .cal-week-box .cal-offset3,
mwl-calendar .cal-month-box.cal-grid-7 .cal-week-box .cal-offset3 {
    margin-left: 42.85714286%;
    *margin-left: 42.83049041%;
}

mwl-calendar .cal-week-box.cal-grid-7 .cal-row-fluid .cal-cell4,
mwl-calendar .cal-month-box.cal-grid-7 .cal-row-fluid .cal-cell4 {
    width: 57.14285714%;
    *width: 57.10732054%;
}

mwl-calendar .cal-week-box.cal-grid-7 .cal-row-fluid .cal-offset4,
mwl-calendar .cal-month-box.cal-grid-7 .cal-row-fluid .cal-offset4,
mwl-calendar .cal-week-box.cal-grid-7 .cal-row-fluid .cal-offset4:first-child,
mwl-calendar .cal-month-box.cal-grid-7 .cal-row-fluid .cal-offset4:first-child,
mwl-calendar .cal-week-box.cal-grid-7 .cal-week-box .cal-offset4,
mwl-calendar .cal-month-box.cal-grid-7 .cal-week-box .cal-offset4 {
    margin-left: 57.14285714%;
    *margin-left: 57.10732054%;
}

mwl-calendar .cal-week-box.cal-grid-7 .cal-row-fluid .cal-cell5,
mwl-calendar .cal-month-box.cal-grid-7 .cal-row-fluid .cal-cell5 {
    width: 71.42857143%;
    *width: 71.38415068%;
}

mwl-calendar .cal-week-box.cal-grid-7 .cal-row-fluid .cal-offset5,
mwl-calendar .cal-month-box.cal-grid-7 .cal-row-fluid .cal-offset5,
mwl-calendar .cal-week-box.cal-grid-7 .cal-row-fluid .cal-offset5:first-child,
mwl-calendar .cal-month-box.cal-grid-7 .cal-row-fluid .cal-offset5:first-child,
mwl-calendar .cal-week-box.cal-grid-7 .cal-week-box .cal-offset5,
mwl-calendar .cal-month-box.cal-grid-7 .cal-week-box .cal-offset5 {
    margin-left: 71.42857143%;
    *margin-left: 71.38415068%;
}

mwl-calendar .cal-week-box.cal-grid-7 .cal-row-fluid .cal-cell6,
mwl-calendar .cal-month-box.cal-grid-7 .cal-row-fluid .cal-cell6 {
    width: 85.71428571%;
    *width: 85.66098081%;
}

mwl-calendar .cal-week-box.cal-grid-7 .cal-row-fluid .cal-offset6,
mwl-calendar .cal-month-box.cal-grid-7 .cal-row-fluid .cal-offset6,
mwl-calendar .cal-week-box.cal-grid-7 .cal-row-fluid .cal-offset6:first-child,
mwl-calendar .cal-month-box.cal-grid-7 .cal-row-fluid .cal-offset6:first-child,
mwl-calendar .cal-week-box.cal-grid-7 .cal-week-box .cal-offset6,
mwl-calendar .cal-month-box.cal-grid-7 .cal-week-box .cal-offset6 {
    margin-left: 85.71428571%;
    *margin-left: 85.66098081%;
}

mwl-calendar .cal-week-box.cal-grid-7 .cal-row-fluid .cal-cell7,
mwl-calendar .cal-month-box.cal-grid-7 .cal-row-fluid .cal-cell7 {
    width: 100%;
    *width: 99.93781095%;
}

mwl-calendar .cal-week-box.cal-grid-7 .cal-row-fluid .cal-offset7,
mwl-calendar .cal-month-box.cal-grid-7 .cal-row-fluid .cal-offset7,
mwl-calendar .cal-week-box.cal-grid-7 .cal-row-fluid .cal-offset7:first-child,
mwl-calendar .cal-month-box.cal-grid-7 .cal-row-fluid .cal-offset7:first-child,
mwl-calendar .cal-week-box.cal-grid-7 .cal-week-box .cal-offset7,
mwl-calendar .cal-month-box.cal-grid-7 .cal-week-box .cal-offset7 {
    margin-left: 100%;
    *margin-left: 99.93781095%;
}

mwl-calendar [class*="cal-cell"].hide,
mwl-calendar .cal-row-fluid [class*="cal-cell"].hide {
    display: none;
}

mwl-calendar [class*="cal-cell"].pull-right,
mwl-calendar .cal-row-fluid [class*="cal-cell"].pull-right {
    float: right;
}

mwl-calendar .cal-row-head [class*="cal-cell"] {
    border: none;
    padding: 5px 0;
    text-align: center;
    font-weight: bolder;
}

    mwl-calendar .cal-row-head [class*="cal-cell"] small {
        font-weight: normal;
    }

mwl-calendar .cal-year-box .row:hover,
mwl-calendar .cal-row-fluid:hover {
    /*background-color: #fafafa*/;
}

mwl-calendar .cal-month-day {
    height: 75px;
}

mwl-calendar [class*="cal-cell"]:hover,
mwl-calendar .cell-focus,
mwl-calendar [class*="cal-cell"] .drop-active,
mwl-calendar .cal-cell.drop-active,
mwl-calendar .cal-week-box .cal-cell1.drop-active,
mwl-calendar .cal-day-hour-part.drop-active {
    background-color: #ededed;
}

mwl-calendar .cal-year-box [class*="span"],
mwl-calendar .cal-month-box [class*="cal-cell"] {
    /*min-height: 75px;*/
    position: relative;
}

    mwl-calendar .cal-year-box [class*="span"] + [class*="span"],
    mwl-calendar .cal-month-box [class*="span"] + [class*="span"],
    mwl-calendar .cal-year-box [class*="cal-cell"] + [class*="cal-cell"],
    mwl-calendar .cal-month-box [class*="cal-cell"] + [class*="cal-cell"] {
        border-left: 1px solid #e1e1e1;
    }

mwl-calendar .cal-year-box [class*="span"] {
    min-height: 60px;
}

mwl-calendar .cal-year-box .row,
mwl-calendar .cal-month-box .cal-row-fluid {
    border-bottom: 1px solid #e1e1e1;
    margin-left: 0px;
    margin-right: 0px;
}

mwl-calendar .cal-year-box,
mwl-calendar .cal-week-box {
    border-top: 1px solid #e1e1e1;
    border-bottom: 1px solid #e1e1e1;
    border-right: 1px solid #e1e1e1;
    border-left: 1px solid #e1e1e1;
    border-radius: 2px;
}

mwl-calendar span[data-cal-date] {
    font-size: 1.2em;
    font-weight: normal;
    opacity: 0.5;
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.1s ease-in-out;
    -moz-transition: all 0.1s ease-in-out;
    -ms-transition: all 0.1s ease-in-out;
    -o-transition: all 0.1s ease-in-out;
    margin-top: 15px;
    margin-right: 15px;
}

    mwl-calendar span[data-cal-date]:hover {
        opacity: 1;
    }

mwl-calendar .cal-day-outmonth span[data-cal-date] {
    opacity: 0.1;
    cursor: default;
}

mwl-calendar .cal-day-today {
    background-color: #e8fde7;
}

    mwl-calendar .cal-day-today span[data-cal-date] {
        color: darkgreen;
    }

mwl-calendar .cal-month-box .cal-day-today span[data-cal-date] {
    font-weight: bold;
}

mwl-calendar .cal-day-holiday span[data-cal-date] {
    color: #800080;
}

mwl-calendar .cal-day-weekend span[data-cal-date] {
    color: darkred;
}

mwl-calendar .cal-week-box-cell {
    border: 1px solid #e1e1e1;
    border-right: 0px;
    border-radius: 5px 0 0 5px;
    background-color: #fafafa;
    text-align: right;
}

mwl-calendar .cal-day-tick {
    border: 1px solid #e1e1e1;
    border-top: 0px solid;
    border-radius: 0 0 5px 5px;
    background-color: #ededed;
    text-align: center;
}

    mwl-calendar .cal-day-tick .fa {
        display: none;
    }

mwl-calendar .cal-day-tick {
    position: absolute;
    right: 50%;
    bottom: -21px;
    padding: 0px 5px;
    cursor: pointer;
    z-index: 5;
    text-align: center;
    width: 26px;
    margin-right: -17px;
}

mwl-calendar .cal-slide-box {
    border-top: 0px solid #fff;
    border-bottom: 1px solid #e1e1e1;
    border-left: 0px solid #fff;
    border-right: 0px solid #fff;
}

mwl-calendar .cal-slide-content {
    padding: 20px;
    color: #ffffff;
    background-color: #555555;
    -webkit-box-shadow: inset 0px 0px 15px 0px rgba(0, 0, 0, 0.5);
    box-shadow: inset 0px 0px 15px 0px rgba(0, 0, 0, 0.5);
}

    mwl-calendar .cal-slide-content a.event-item {
        color: #ffffff;
        font-weight: normal;
    }

mwl-calendar .cal-day-open {
    background-color: #cdfaca;
}

mwl-calendar a.event-item-edit,
mwl-calendar a.event-item-delete,
mwl-calendar a.event-item-action {
    padding-left: 5px;
}

mwl-calendar .cal-year-box .cal-slide-content a.event-item,
mwl-calendar .cal-year-box a.event-item-edit,
mwl-calendar .cal-year-box a.event-item-delete,
mwl-calendar .cal-year-box a.event-item-action {
    position: relative;
    top: -3px;
}

mwl-calendar .events-list {
    max-height: 47px;
    padding-left: 5px;
}

mwl-calendar .cal-column {
    border-left: 1px solid #e1e1e1;
}

mwl-calendar a.cal-event-week {
    text-decoration: none;
    color: #151515;
}

mwl-calendar .badge-important {
    padding-top: 0px !important;
    margin-top: 14px !important;
    height: 22px;
    width: 22px;
    border-radius: 50%;
    border: 2px solid #fff;
    line-height: 20px;
    vertical-align: central;
    text-align: center;
    background: radial-gradient(circle, #E52423, #E52423);
    color: #fff;
}

.badge-single-digit {
    font-size: 11px;
    padding-left: 6px !important;
}

.badge-double-digit {
    font-size: 10px;
    padding-left: 3px !important;
}

.badge-triple-digit {
    font-size: 9px;
    padding-left: 1px !important;
}

mwl-calendar .pointer {
    cursor: pointer;
}

mwl-calendar .cal-year-box:last-child {
    border-bottom: 0px;
}

mwl-calendar .cal-context {
    width: 100%;
}

mwl-calendar .cal-events-num {
    margin-top: 20px;
}

@media (max-width: 991px) {
    mwl-calendar .cal-year-box [class*="span"]:nth-child(2) {
        border-right: 0px;
    }

    mwl-calendar .cal-year-box [class*="span"]:nth-child(1),
    mwl-calendar .cal-year-box [class*="span"]:nth-child(2) {
        border-bottom: 1px solid #e1e1e1;
    }
}

mwl-calendar .cal-month-box .cal-row-fluid {
    border-right: 1px solid #e1e1e1;
    border-left: 1px solid #e1e1e1;
}

mwl-calendar .cal-month-box .cal-row-head {
    border-left: none;
    border-right: none;
}

    mwl-calendar .cal-month-box .cal-row-head [class*="cal-cell"] {
        border: none;
        overflow: hidden;
        min-height: unset;
        text-overflow: ellipsis;
    }

mwl-calendar .cal-month-box .cal-month-day {
    position: relative;
    display: block;
    width: 100%;
}

    mwl-calendar .cal-month-box .cal-month-day .cal-events-num {
        margin-left: 10px;
        margin-top: 18px;
    }

mwl-calendar .cal-month-box .cal-week-box-cell {
    display: none; /* hide week number on LHS */
    position: absolute;
    width: 70px;
    left: -71px;
    top: -1px;
    padding: 8px 5px;
    cursor: pointer;
}

mwl-calendar .cal-month-box .cal-slide-box {
    position: relative;
}

mwl-calendar .cal-month-box .cal-slide-tick {
    position: absolute;
    width: 16px;
    margin-left: -7px;
    height: 9px;
    top: -1px;
    z-index: 1;
}

    mwl-calendar .cal-month-box .cal-slide-tick.tick-month1 {
        left: 12.5%;
    }

    mwl-calendar .cal-month-box .cal-slide-tick.tick-month2 {
        left: 37.5%;
    }

    mwl-calendar .cal-month-box .cal-slide-tick.tick-month3 {
        left: 62.5%;
    }

    mwl-calendar .cal-month-box .cal-slide-tick.tick-month4 {
        left: 87.5%;
    }

    mwl-calendar .cal-month-box .cal-slide-tick.tick-day1 {
        left: 7.14285714285715%;
    }

    mwl-calendar .cal-month-box .cal-slide-tick.tick-day2 {
        left: 21.42857142857143%;
    }

    mwl-calendar .cal-month-box .cal-slide-tick.tick-day3 {
        left: 35.71428571428572%;
    }

    mwl-calendar .cal-month-box .cal-slide-tick.tick-day4 {
        left: 50%;
    }

    mwl-calendar .cal-month-box .cal-slide-tick.tick-day5 {
        left: 64.2857142857143%;
    }

    mwl-calendar .cal-month-box .cal-slide-tick.tick-day6 {
        left: 78.57142857142859%;
    }

    mwl-calendar .cal-month-box .cal-slide-tick.tick-day7 {
        left: 92.85714285714285%;
    }

mwl-calendar .cal-month-box .events-list {
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 50;
}

mwl-calendar .cal-month-box .cal-slide-content ul.unstyled {
    margin-bottom: 0;
}

mwl-calendar .cal-month-box .cal-slide-content ul li.dragging-active .event-item {
    color: black;
}

mwl-calendar .cal-month-box .cal-day-selected {
    background-color: #ededed;
}

.cal-week-box {
    position: relative;
}

    .cal-week-box [data-event-class] {
        white-space: nowrap;
        height: 30px;
        line-height: 30px;
        text-overflow: ellipsis;
        overflow: hidden;
        padding-top: 0px !important;
        margin-top: 0px !important;
        margin-bottom: 0px !important;
        font-size: 12px;
        padding: 0 3px !important;
    }

    .cal-week-box .cal-day-panel {
        border: 0px !important;
    }

    .cal-week-box .cal-row-head {
        border-bottom: 1px solid #e1e1e1;
    }

    .cal-week-box:not(.cal-day-box) .cal-row-fluid {
        margin-bottom: 2px;
    }

        .cal-week-box:not(.cal-day-box) .cal-row-fluid:hover,
        .cal-week-box:not(.cal-day-box) [class*="cal-cell"]:hover {
            background-color: inherit !important;
        }

    .cal-week-box:not(.cal-day-box) [data-event-class] {
        margin-left: 2px;
        margin-right: 2px;
    }

    .cal-week-box:not(.cal-day-box) .border-left-rounded {
        border-top-left-radius: 5px;
        border-bottom-left-radius: 5px;
    }

    .cal-week-box:not(.cal-day-box) .border-right-rounded {
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px;
    }

    .cal-week-box.cal-day-box .cal-row-head {
        padding-left: 60px;
    }

    .cal-week-box.cal-day-box .cal-day-panel {
        overflow-x: hidden;
    }

.cal-day-box {
    text-wrap: none;
    overflow-x: auto !important;
    overflow-y: hidden;
}

    .cal-day-box .cal-day-hour-part {
        height: 30px;
        box-sizing: border-box;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        border-bottom: thin dashed #e1e1e1;
    }

        .cal-day-box .cal-day-hour-part .cal-day-hour-part-time {
            width: 60px;
            text-align: center;
            float: left;
        }

        .cal-day-box .cal-day-hour-part .cal-day-hour-part-spacer {
            height: 30px;
            display: inline-block;
        }

        .cal-day-box .cal-day-hour-part:hover {
            background-color: #ededed;
        }

    .cal-day-box .cal-day-hour-part-selected {
        background-color: #e1e1e1;
    }

    .cal-day-box .cal-day-hour {
        background-color: #ffffff;
    }

        .cal-day-box .cal-day-hour .day-highlight {
            height: 30px;
        }

        .cal-day-box .cal-day-hour:nth-child(odd) {
            background-color: #fafafa;
        }

    .cal-day-box .cal-hours {
        font-weight: bold;
        font-size: 12px;
    }

    .cal-day-box .cal-day-panel {
        position: relative;
        padding-left: 60px;
        border: solid 1px #e1e1e1;
    }

    .cal-day-box .cal-day-panel-hour {
        position: absolute;
        width: 100%;
        margin-left: -60px;
    }

    .cal-day-box .day-event {
        position: absolute;
        width: 150px;
        overflow: hidden;
        padding: 2px 3px !important;
    }

        .cal-day-box .day-event a {
            font-size: 12px;
            text-overflow: ellipsis;
        }

    .cal-day-box .day-highlight {
        padding-top: 2px;
        padding-left: 8px;
        padding-right: 8px;
        box-sizing: border-box;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        border: 1px solid #c3c3c3;
        margin: 1px 1px;
        overflow: hidden;
        text-overflow: ellipsis;
    }

mwl-calendar-day.time-hidden .cal-day-hour-part-time {
    display: none;
}

mwl-calendar-day.time-on-side .cal-day-box {
    overflow: visible !important;
    margin-left: 55px;
}

mwl-calendar-day.time-on-side .cal-day-panel {
    min-width: initial !important;
}

mwl-calendar-day.time-on-side .cal-day-hour-part-time {
    margin-left: -55px;
}

mwl-calendar .event {
    display: block;
    background-color: #c3c3c3;
    width: 10px;
    height: 10px;
    margin-right: 2px;
    margin-bottom: 2px;
    border-radius: 8px;
}

mwl-calendar .event-block {
    display: block;
    background-color: #c3c3c3;
    width: 20px;
    height: 100%;
}

mwl-calendar .cal-event-list .event.pull-left {
    margin-top: 3px;
}

mwl-calendar .day-highlight:hover,
mwl-calendar .day-highlight {
    background-color: #dddddd;
}

/* Thanks for Ul Styling
  http://css.maxdesign.com.au/listutorial/horizontal_master.htm
  https://css-tricks.com/snippets/css/glowing-blue-input-highlights/
  bootstrap material for animation on click
  */

.tag-container {
    font-family: Helvetica Neue,Helvetica,Arial,sans-serif;
}

    .tag-container .error {
        color: #E52423;
    }

    .tag-container ul {
        margin: 0;
        list-style-type: none;
        border: 1px solid #DDDDDD;
        padding: 3px 0px 3px 3px;
        -webkit-transition: all 0.30s ease-in-out;
        -moz-transition: all 0.30s ease-in-out;
        -ms-transition: all 0.30s ease-in-out;
        -o-transition: all 0.30s ease-in-out;
        display: block;
        border-radius: 4px;
    }

    .tag-container .tag.default.disabled {
        background-color: #eee;
    }

    .tag-container .tag.default.focus {
        border-color: #66afe9;
        outline: none;
    }

    .tag-container .tag.default.error:not(.focus) {
        border: 2px solid #E52423;
        padding: 2px 0px 2px 2px;
    }

    /*Material Design Input*/
    .tag-container ul.material {
        padding: 3px 0px 3px 3px;
        border: 0;
        background-image: -webkit-gradient(linear,left top,left bottom,from(#009688),to(#009688)),-webkit-gradient(linear,left top,left bottom,from(#D2D2D2),to(#D2D2D2));
        background-image: -webkit-linear-gradient(#009688,#009688),-webkit-linear-gradient(#D2D2D2,#D2D2D2);
        background-image: -o-linear-gradient(#009688,#009688),-o-linear-gradient(#D2D2D2,#D2D2D2);
        background-image: linear-gradient(#009688,#009688),linear-gradient(#D2D2D2,#D2D2D2);
        -webkit-background-size: 0 2px,100% 1px;
        background-size: 0 2px,100% 1px;
        background-repeat: no-repeat;
        background-position: center bottom,center -webkit-calc(100% - 1px);
        background-position: center bottom,center calc(100% - 1px);
        background-color: rgba(0,0,0,0);
        -webkit-transition: background 0s ease-out;
        -o-transition: background 0s ease-out;
        transition: background 0s ease-out;
        float: none;
        -webkit-box-shadow: none;
        box-shadow: none;
        border-radius: 0
    }

        .tag-container ul.material:after {
            background-color: #009688
        }



    .tag-container ul.tag.material.focus {
        box-shadow: none;
        padding: 3px 0px 3px 3px;
        outline: 0;
        background-image: -webkit-gradient(linear,left top,left bottom,from(#009688),to(#009688)),-webkit-gradient(linear,left top,left bottom,from(#D2D2D2),to(#D2D2D2));
        background-image: -webkit-linear-gradient(#009688,#009688),-webkit-linear-gradient(#D2D2D2,#D2D2D2);
        background-image: -o-linear-gradient(#009688,#009688),-o-linear-gradient(#D2D2D2,#D2D2D2);
        background-image: linear-gradient(#009688,#009688),linear-gradient(#D2D2D2,#D2D2D2);
        -webkit-background-size: 100% 2px,100% 1px;
        background-size: 100% 2px,100% 1px;
        -webkit-box-shadow: none;
        box-shadow: none;
        -webkit-transition-duration: .3s;
        -o-transition-duration: .3s;
        transition-duration: .3s
    }
    /*End Material Design input*/


    .tag-container ul li {
        display: inline-block;
    }

        .tag-container ul li input, .tag-container ul li input:focus, .tag-container ul li input:active {
            border: none;
            padding-top: 8px;
            padding-bottom: 8px;
            outline: none;
            background: transparent;
            margin-left: 3px;
            width: 300px;
            color: #777;
        }

            .tag-container ul li input.error, .tag-container ul li input:focus.error, .tag-container ul li input:active.error {
                color: #E52423;
            }

                .tag-container ul li input::-moz-placeholder {
                    color: #ddd;
                    opacity: 1;
                }

                .tag-container ul li input:-ms-input-placeholder {
                    color: #ddd;
                }

                .tag-container ul li input::-webkit-input-placeholder {
                    color: #ddd;
                }

        .tag-container ul li:not(:last-child) {
            margin-left: 3px;
            margin-bottom: 3px;
            text-decoration: none;
            padding: .2em .6em;
            color: #fff;
            background-color: #888;
            cursor: hand;
            cursor: pointer;
            padding-right: 0.625em;
            vertical-align: baseline;
            text-align: center;
            display: inline-block;
            display: -moz-groupbox;
        }

            .tag-container ul li:not(:last-child):hover {
                /*padding-top: 0.25em;*/
                color: #fff;
                background-color: #888;
                /*font-size:85%;
    font-weight: 600;*/
            }

            .tag-container ul li:not(:last-child).active {
                color: #fff;
                background-color: #888;
                /*font-size:90%;
    font-weight: 600;*/
            }

    .tag-container ul.default > li {
        border-radius: .25em;
    }

    .tag-container ul.material > li {
        border-radius: 0.25em;
        padding-top: 1px;
    }

    .tag-container ul li a {
        text-decoration: none;
        color: #fff;
        margin-right: -7px;
        padding-right: 3px;
        text-align: center;
        padding-left: 3px;
    }

        .tag-container ul li a:hover {
            color: rgba(0,0,0,4.1);
        }

.tag-typehead {
    background: white;
    border: 1px solid #cccccc;
    border-top: none;
    list-style: none;
    margin: 0px;
    padding: 0px;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
}

.animate-repeat {
    line-height: 30px;
    list-style: none;
    box-sizing: border-box;
    cursor: hand;
    cursor: pointer;
}

    .animate-repeat:hover {
    }

    .animate-repeat.ng-move,
    .animate-repeat.ng-enter,
    .animate-repeat.ng-leave {
        transition: all linear 0.5s;
    }

        .animate-repeat.ng-leave.ng-leave-active,
        .animate-repeat.ng-move,
        .animate-repeat.ng-enter {
            opacity: 0;
            max-height: 0;
        }

            .animate-repeat.ng-leave,
            .animate-repeat.ng-move.ng-move-active,
            .animate-repeat.ng-enter.ng-enter-active {
                opacity: 1;
                max-height: 30px;
            }

.tag-typehead li > a {
    display: block;
    padding: 6px;
    clear: both;
    font-size: 13px;
    line-height: 1.538462;    
    color: #777;
    white-space: nowrap;
    text-decoration: none;
}

    .tag-typehead li > a:hover, .tag-typehead li > a.active {
        color: #fff;
        text-decoration: none;
        background-color: #E52423;
        outline: 0;
    }

#main-tag {
    position: relative;
}

    #main-tag ul.tag-typehead {
        position: absolute;
        left: 0;
        top: 100%;
        width: 100%;
        z-index: 999;
    }

/* testing */


.ng-toggle-wrap {
    display: inline-block;
    margin: 3px;
    position: relative;
    width: 62px;
    height: 36px;
    -webkit-backface-visibility: hidden;
    -webkit-transform: translateZ(0) scale(1.0, 1.0);
    z-index: 0;
}

    .ng-toggle-wrap:hover {
        z-index: 1;
    }

    .ng-toggle-wrap.vertical {
        height: 62px;
    }

    .ng-toggle-wrap .ng-toggle-switch {
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }

    .ng-toggle-wrap.vertical .ng-toggle-switch {
        -webkit-transform: translate(-50%, -50%) rotate(-90deg);
        transform: translate(-50%, -50%) rotate(-90deg);
    }

.ng-toggle-switch {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 56px;
    height: 30px;
    display: inline-block;
    background-color: #ddd;
    border-radius: 25px;
    -webkit-transition: background-color .25s ease;
    transition: background-color .25s ease;
    cursor: pointer;
}

    .ng-toggle-switch.true {
        background-color: #5cb85c;        
    }
        .ng-toggle-switch.true:before {
            content: " Yes";
            float: left;
            color: white;
            padding-left: 6px;
        }
        .ng-toggle-switch.false {
            background-color: #E52423;
        }
            .ng-toggle-switch.false:before {
                content: "No ";
                float: right;
                color: white;
                padding-right: 6px;
            }

.ng-toggle-false {
    position: absolute;
    left: 0;
    width: 50%;
    height: 100%;
}

.ng-toggle-true {
    position: absolute;
    right: 0;
    width: 50%;
    height: 100%;
}

.ng-toggle-handle {
    width: 24px;
    height: 24px;
    border-radius: 100%;
    background-color: white;
    position: absolute;
    top: 3px;
    left: 16px;
    -webkit-transition: all .2s ease-out;
    transition: all .2s ease-out;
}

.ng-toggle-switch.true .ng-toggle-handle {
    left: 29px;
}

.ng-toggle-switch.false .ng-toggle-handle {
    left: 3px;
}

.ng-toggle-tooltip {
    display: inline-block;
    position: absolute;
    right: 100%;
    top: 50%;
    -webkittransition: opacity .3s ease;
    transition: opacity .3s ease;
    transform: translate(-5px, -50%) translateZ(0) scale(1.0, 1.0);
    -webkit-transform: translate(-5px, -50%) translateZ(0) scale(1.0, 1.0);
    -webkit-backface-visibility: hidden;
    background: rgba(0, 0, 0, 0.8);
    color: #CCC;
    padding: 3px 11px;
    font-size: 12px;
    border-radius: 12px;
    opacity: 0;
    pointer-events: none;
    text-align: right;
    white-space: nowrap;
}

.ng-toggle-wrap:hover .ng-toggle-tooltip {
    opacity: 1;
}

.ng-toggle-tooltip:before {
    width: 5px;
    height: 5px;
    border-style: solid;
    border-width: 4px 0px 4px 5px;
    border-color: rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) rgba(0, 0, 0, 0) rgba(0, 0, 0, 0.8);
    position: absolute;
    right: -6px;
    top: 50%;
    -webkit-transform: translate(0, -50%);
    transform: translate(0, -50%);
    content: '';
    pointer-events: none;
}

.ng-toggle-tooltip .active {
    color: white;
    box-shadow: 0 0 3px rgba(0, 0, 0, .4);
    -webkit-transition: all .2s ease;
    transition: all .2s ease;
}

.ng-mandatory-toggle-text {
    list-style: none;
    margin-left: 0;
    padding-left: 0;
}

    .ng-mandatory-toggle-text li {
        padding-left: 1em;
        text-indent: -1em;
    }

        .ng-mandatory-toggle-text li:before {
            /*content: "*";*/
            padding-right: 5px;
        }

/*! Angular Moment Picker - v0.10.2 - http://indrimuska.github.io/angular-moment-picker - (c) 2015 Indri Muska - MIT */
.moment-picker-input {
    cursor: pointer;
}

.moment-picker {
    position: absolute;
    z-index: 1060;
}

    .moment-picker .moment-picker-container {
        color: #404040;
        min-width: 15em;
        background: #fff;
        padding: 4px;
        border: 1px solid #66afe9;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        border-radius: 4px;
        position: absolute;
        margin-top: 4px;
        margin-left: -0.5em;
        -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.075);
        -moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.075);
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.075);
    }

        .moment-picker .moment-picker-container:before,
        .moment-picker .moment-picker-container:after {
            content: '';
            display: block;
            width: 0;
            height: 0;
            border: 8px solid transparent;
            border-top: none;
            position: absolute;
            top: -9px;
            left: 15px;
        }

        .moment-picker .moment-picker-container:before {
            border-bottom-color: #66afe9;
            border-width: 9px;
        }

        .moment-picker .moment-picker-container:after {
            border-bottom-color: #fff;
            margin-top: 1px;
            margin-left: 1px;
        }

    .moment-picker.inline {
        display: block;
        position: relative;
    }

        .moment-picker.inline .moment-picker-container {
            position: relative;
            margin: 0;
        }

            .moment-picker.inline .moment-picker-container:before,
            .moment-picker.inline .moment-picker-container:after {
                content: none;
            }

    .moment-picker.top .moment-picker-container {
        bottom: 100%;
        margin-top: auto;
        margin-bottom: 4px;
    }

        .moment-picker.top .moment-picker-container:before,
        .moment-picker.top .moment-picker-container:after {
            border: 8px solid transparent;
            border-bottom: none;
            top: auto;
            bottom: -9px;
        }

        .moment-picker.top .moment-picker-container:before {
            border-top-color: #f0f3f4;
            border-width: 9px;
        }

        .moment-picker.top .moment-picker-container:after {
            border-top-color: #fff;
            margin-top: auto;
            margin-bottom: 1px;
        }

    .moment-picker.right .moment-picker-container {
        right: 0;
        margin-left: auto;
        margin-right: -0.5em;
    }

        .moment-picker.right .moment-picker-container:before,
        .moment-picker.right .moment-picker-container:after {
            left: auto;
            right: 15px;
        }

        .moment-picker.right .moment-picker-container:after {
            margin-left: auto;
            margin-right: 1px;
        }

    .moment-picker table {
        border-collapse: collapse;
        border-spacing: 0;
        min-width: 100%;
        table-layout: fixed;
    }

    .moment-picker th {
        font-weight: bold;
    }

        .moment-picker th:first-child,
        .moment-picker th:last-child {
            width: 2em;
        }

    .moment-picker th,
    .moment-picker td {
        padding: 0;
        text-align: center;
        min-width: 2em;
        height: 2em;
        text-shadow: 0 1px 0 rgba(255, 255, 255, 0.9);
        cursor: pointer;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        border-radius: 4px;
    }

        .moment-picker th:hover,
        .moment-picker td:hover {
            background-color: #fafbfb;
            background-image: -webkit-gradient(linear, left top, left bottom, from(#f0f3f4), to(#fafbfb));
            background-image: -webkit-linear-gradient(#f0f3f4, #fafbfb);
            background-image: -moz-linear-gradient(#f0f3f4, #fafbfb);
            background-image: -o-linear-gradient(#f0f3f4, #fafbfb);
            background-image: linear-gradient(#f0f3f4, #fafbfb);
        }

        .moment-picker th.disabled,
        .moment-picker td.disabled,
        .moment-picker th.disabled:hover,
        .moment-picker td.disabled:hover {
            color: #abbbc7;
            background: none;
            cursor: default;
        }

        .moment-picker td.today {
            background: #e4eef5;
            color: #404040;
            text-shadow: 0 1px 0 rgba(255, 255, 255, 0.9);
        }

        .moment-picker td.selected {
            color: #fff;
            text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.3);
            border-color: #3ca0dd;
            background-color: #45b1e8;
            background-image: -webkit-gradient(linear, left top, left bottom, from(#45b1e8), to(#3097de));
            background-image: -webkit-linear-gradient(#45b1e8, #3097de);
            background-image: -moz-linear-gradient(#45b1e8, #3097de);
            background-image: -o-linear-gradient(#45b1e8, #3097de);
            background-image: linear-gradient(#45b1e8, #3097de);
        }

        .moment-picker td.highlighted {
            background-image: -webkit-radial-gradient(transparent, rgba(0, 0, 0, 0.15));
            background-image: -moz-radial-gradient(transparent, rgba(0, 0, 0, 0.15));
            background-image: -o-radial-gradient(transparent, rgba(0, 0, 0, 0.15));
            background-image: radial-gradient(transparent, rgba(0, 0, 0, 0.15));
        }

    .moment-picker .decade-view td,
    .moment-picker .year-view td {
        height: 3.4em;
    }

    .moment-picker .month-view .moment-picker-specific-views th {
        background: none;
        cursor: default;
    }

    .moment-picker .month-view td {
        width: 1.4285714286em;
    }

    .moment-picker .day-view td,
    .moment-picker .hour-view td {
        height: 2.3333333333em;
    }

    .moment-picker .minute-view td {
        height: 1.8em;
    }

/*!
 * angularjs-color-picker v3.4.8
 * https://github.com/ruhley/angular-color-picker/
 *
 * Copyright 2017 ruhley
 *
 * 2017-10-06 09:52:03
 *
 */
.color-picker-wrapper .color-picker-input-wrapper {
    width: 100%;
}

.color-picker-wrapper .color-picker-swatch:not(.input-group-addon) {
    height: 28px;
}

.color-picker-wrapper.color-picker-swatch-only .input-group .input-group-addon {
    border-radius: 4px;
}

.color-picker-wrapper {
  position: relative;
}
.color-picker-wrapper .color-picker-input-wrapper {
  display: table;
  position: relative;
}
.color-picker-wrapper .input-group {
  position: relative;
  border-collapse: separate;
}
.color-picker-wrapper .input-group .color-picker-input,
.color-picker-wrapper .input-group .input-group-addon {
  display: table-cell;
}
.color-picker-wrapper .input-group .color-picker-input {
  position: relative;
  z-index: 2;
  float: left;
  margin-bottom: 0;
}
.color-picker-wrapper .input-group .input-group-addon {
  padding: 6px 12px;
  font-size: 14px;
  font-weight: 400;
  line-height: 1;
  color: #555;
  text-align: center;
  background-color: #eee;
  border: 1px solid #ccc;
}
.color-picker-wrapper .input-group .input-group-addon:first-child {
  border-right-width: 0;
}
.color-picker-wrapper .input-group .input-group-addon:last-child {
  border-left-width: 0;
}
.color-picker-wrapper .input-group .color-picker-input-swatch {
  padding-left: 12px;
}
.color-picker-wrapper .color-picker-input-swatch {
  padding-left: 36px;
}
.color-picker-wrapper .color-picker-swatch {
  cursor: pointer;
  z-index: 3;
}
.color-picker-wrapper .color-picker-swatch:not(.input-group-addon) {
  position: absolute;
  top: 3px;
  width: 28px;
  height: 70%;
  box-sizing: border-box;
  border-radius: 3px;
  vertical-align: middle;
  background-position: -80px 0;
  border: solid 1px #ccc;
  padding: 0;
  margin: 0;
  display: inline-block;
}
.color-picker-wrapper .color-picker-swatch:not(.input-group-addon).color-picker-swatch-left {
  left: 3px;
}
.color-picker-wrapper .color-picker-swatch:not(.input-group-addon).color-picker-swatch-right {
  right: 3px;
}
.color-picker-wrapper .color-picker-panel {
  position: absolute;
  background: white;
  border: solid 1px #CCC;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
  z-index: 99999;
  width: 150px;
  table-layout: fixed;
  border: 1px solid #FFFFFF;
  padding-right: 1px;
  box-sizing: content-box;
}
.color-picker-wrapper .color-picker-panel .color-picker-grid-wrapper {
  display: table;
  width: 100%;
}
.color-picker-wrapper .color-picker-panel .color-picker-grid-wrapper .color-picker-row {
  display: table-row;
}
.color-picker-wrapper .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-overlay {
  position: absolute;
  width: 100%;
  height: 150px;
  top: 0;
  left: 0;
  z-index: 2;
}
.color-picker-wrapper .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-grid,
.color-picker-wrapper .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-hue,
.color-picker-wrapper .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-saturation,
.color-picker-wrapper .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-lightness,
.color-picker-wrapper .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-opacity {
  background-image: linear-gradient(45deg, #808080 25%, transparent 25%), linear-gradient(-45deg, #808080 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #808080 75%), linear-gradient(-45deg, transparent 75%, #808080 75%);
  background-size: 10px 10px;
  background-position: 0 0, 0 5px, 5px -5px, -5px 0px;
}
.color-picker-wrapper .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-hue,
.color-picker-wrapper .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-saturation,
.color-picker-wrapper .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-lightness,
.color-picker-wrapper .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-opacity {
  display: table-cell;
  position: relative;
  left: 1px;
  width: 20px;
  background-color: white;
  cursor: row-resize;
}
.color-picker-wrapper .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-slider {
  position: absolute;
  top: 0;
  left: 0;
  width: 18px;
  height: 2px;
  background: white;
  border: solid 1px black;
  box-sizing: content-box;
  margin-top: -1px;
  z-index: 3;
}
.color-picker-wrapper .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-grid {
  display: table-cell;
  position: relative;
  width: 150px;
  height: 150px;
  cursor: crosshair;
}
.color-picker-wrapper .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-grid .color-picker-grid-inner {
  width: 150px;
  height: 150px;
  z-index: 9;
}
.color-picker-wrapper .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-grid .color-picker-overlay {
  /*background-image: url(/Content/data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJYAAACWCAMAAAAL34HQAAAC9FBMVEUDAwMTExMFBQUGBgYMDAwICAgFBQUDAwMGBgYDAwMPDw8SEhIYGBgLCwsTExMfHx8GBgYcHBwGBgYmJiYcHBwfHx8XFxcJCQkODg4fHx8RERExMTEmJiYGBgYuLi4ZGRlDQ0MqKioICAgcHBxFRUUUFBQKCgooKCgzMzMnJycbGxsTExM8PDwvLy8xMTErKysLCwtNTU1CQkI5OTkUFBQlJSVmZmZeXl4mJiYfHx81NTVKSkoPDw9FRUVjY2NYWFhLS0srKys6OjpISEhQUFBsbGxEREQLCwsNDQ3a2to4ODhBQUE7OzsMDAwXFxchISFSUlJnZ2d4eHhlZWUzMzOampo+Pj4tLS1ISEhtbW1SUlJ0dHQQEBAwMDAhISFWVlZaWlpWVlZiYmJLS0snJyf09PQfHx+Xl5dHR0dPT08+Pj5qamrOzs5QUFBXV1dUVFR6enonJyddXV1xcXE2NjYWFhY8PDxKSkrNzc1/f3+hoaFfX1+KioqAgIB3d3esrKyYmJiKiookJCS7u7uhoaE6OjqLi4ssLCy8vLx6enpubm6Hh4eioqKFhYXp6enCwsKMjIzBwcGRkZHu7u44ODhycnLFxcVra2uioqLc3Nzl5eV4eHjl5eWSkpK+vr7h4eEzMzOSkpK7u7shISHW1taurq5aWlrPz89vb2/y8vJlZWWBgYHKyspeXl64uLh+fn4YGBg2NjbZ2dl6enrMzMy8vLyTk5POzs5xcXG/v79PT09paWmEhISbm5urq6u3t7djY2Pl5eXh4eFaWlqLi4u1tbW5ubl/f3/Q0NCCgoKTk5Ovr69KSkp1dXWpqanZ2dmvr6+ysrJMTEyenp719fWbm5tUVFSYmJjz8/ODg4PZ2dn19fWzs7NjY2Nra2uHh4enp6eIiIijo6PU1NSnp6eWlpbKysqpqal3d3ff39+KiorCwsLS0tLg4OC+vr7r6+uqqqry8vLj4+OWlpatra3r6+v39/fu7u75+fnv7+/5+fkBAQFzkre4AAAA+3RSTlP97ePc/P3u+Onz8/z79+Hz0+rL++D89bvl19jr8sL6wPndsq7m0anI0uPLyfry27Oh8O7oZ+n42tCl+x98o+jk+r7y2+Wxv5mGpr/O4JBcR6/AvI6b89iltO7Z5HF2kc7A8c7MiPKavHeIhuB2waL61H37n8m0qpfkyKqy9/j56OC/Ovbkki8sh66AsfbrZeXf0uvos9X21L6A93TB0MKyao5IvMSvfvX6jqIQj/Dm41Bd5u/Unay/xlpqYticw7Zv1kiWn9kenp2M+ZtOkG33ffZbg6LPQkjVaNSyyjRUVpF+0ipZdbP4RTjOqmKQbqDZfuhjOFPDxfhv3SDpqyEAABolSURBVHgBdNKxaipbGMVx38sn8EHs5jk8VtNMZRgYGNJIrGwOllqIVU4jJCSkihwiOIqDxmh1/2vW3pfBy11r7al/fNr5aaX/c+tT4rzevm/fr98x79/vIev3dcx4PQ45jo8h1+M1Jr2m6Tk9xyzOC7JdbGM+t59Nlp/L5fJp+RTSYt1+buz/TKhcUG2T20ahiq6zqjlb5t6ryFPTO1b/pt18rZbqdneptetYJJNqmElGRVcbRpWzUS2STZFllNqHZBOoV9a4mFmGWaZBii7LooqGpGl6PadG+QfUg7SIp2odC5VfZElkU6PKjFJkUi6YLv+inMP6gOnw3z9WJMUAU4xSpLr/Wznta8lkF6IsQ5VlUXXBdXECClXeqJyxYaiqIxsdR1empFeb6O7MDJNKvYMZpQnVhdWPrqyfCYUpC6i5THOb8vdcW+fFel0UB24lFK3GlYLJKjdJQ3bp7qwuZkFVLrZl09P29KkOPpcnqSIKVrfTRjlWzV2hlPySI5PqvVgX6wMwpTdWkR1FG1UjJ6VJmjBUMbPFjMGiUpW4iFyDJR08DbrLbvdJ7fSVh4d+9hBR9WvNZNKl9PIcFSlySISPSKDkquK9RtW14l4jrpVcIaVslwA673Z49NSyiVE61gmSXEZpXKtRNTVLKqPIhedTEf+EuVEFKki9ChXTpaiT6FY6VrKL15oxbkXLUi5uVXIux7C7axmV0YeszuqgqufAYAlkFSLq9IpeTy5gPlXblaj+BdXAQkRKVYHEZAKlLLsDGtORSbEKkoLKyTVI0eUccGFSKrVaaaOJUHZpRKq9BsuxKsAcuZS2q4PKMEyOTUa9zfO3nN3fqrCJrdyRO5mAMsmqvSqUXb7Wpnw5UX0GLzaZ1b6WU6vRJRkkq9RHtVAVqwxbYWIixSYJI3u62+/3vNk+ojChKlmgRdiHz6X84lr3KpGmDNQbyxksq9jveCuyMoo3oZxKxzIqqITCRJXNbLPZ2IWKIPoaDF4+Bh+sq1oVWH+MUqb1fDoF9abmVmEChuvxd1H8RkbNok0iajLkmyTDZLgfAguR6nm2YbMS2ItqFe9LMlTQPhC5kfWnbjqf1kJpupXy+IZIKL2G1Jj+9lZ/TQLFsRwuBWmoDxw98rx/foaFKiSqZKIfXzbRAPvVCajGNeUZBQmX82gZl3oEpQmlriybMLuGWlANhbIKEd1sWFAxTC8DnmTAmkhkllBKzZv+wxYdrDSPhlEc9w69ndCl36LuSjfDgNAhMNKNiAwNLkrNShiodIqBfkRKk4AtQuHb5Abmf877mBGZc5436x8nQwYUHJvsIn+AOika66xfeA5TcslEGGr7a7vVR1spA0p1ZAL1obmMUh2x5DJKHVCh4oUJlWAnqqnOJ7nUO1rcFdy1t3K2yAYVU0klV/+3vQ/m+Yn/bDLqsGltciwVpCEopkue1u8Lf5MNYmlxFJAnc9/cwWuO6uui2udAon84m22m5hLJFB9/940nF0KJlA7+m0tJbaaw8osCpUil0xkUJ1VXKQouLRWqLaoBAuW06sEklFN80HDJRW0UImVUPN/5n9RTHNUGaZMJonCtJDpqyql4AdKJJJQa7Po/6Pk6hsnUGRHce3Gu/FX1pwKxQ0opsqo8kinkk1PjzNIvMFVcJ+BpLbblhdb0WpzdGMsTjCzDh9UJgUWvRpfBQsXESqbv80zw4LkYHKFSi0lChYl62K9xmRWy1ItBVTxNnb1PecE6gAKEzWLP4gLklxizaVKMlwimaWKtEAUnT3OQKE6zc6z8gyuLEqh7LouUDGUTiZ1Q48EV8Dqvm4oLBXUYac6V+rYDRaRaB4mkybcdDHlRJqKpIOER7XpVl0r2qqViqlaTJXe0VuBojVJKkiYPlVfUIpcFwNq2GqiLiYcWyUUj6mQWVVqKg5XiUl/kCOtSipgQqFSnfqopaSqm2VTYxJMMexFLpMIayXUb2pGOasooMk0ZaY6pZpS3IKit+tYK5nMqiJhsqvmUkDVVAF0eNm9cOGyClaoEgnRkCnnhOmb6lawUH1zVapMqZ1QamR54JZCOaBQXaVGLjA5GW/CUoItZBq2mqnPs9k+sSJMpQRptB4ZFKYcU84dq+7odl1ddxSTe1gCo0ylc4y6FOphfMFSnGATbsLFUqF6Vq3i9vtS/aoybESBjdqVWq2AWZVXXdVJday77gaUnlyhej28/qeil5cBu5ApEiiz7lMDRfdhok/lE6oIotFIpNFKrFWbt6u8ojmvyzurGEqkG255I5TzukS1jLkuZaJSPYgV+WHUD3o/uU+qZ6v2zwmVxnqyioZKlUwmok+Vr4zKNZVgzk0nFSyaZKiWry+qXTq7HlgrkYQSKVB2aSqyn+6RfaIwQfJWvxulCLVacSTHJBUo3UCyKVQxllFLu4yKwHq4sIr+SxYdqya2RlEcz0P5HAZG0t3UmtvapVHJaTQDtxVCwDQWtxhic4rAiDCKWFhEON00YxOYykeY/39/bgnMWus79Y99Hkq+PYgymw0jmkqWqIprupyqmnorTkUCZRKl6fOpqFG2srrsAdXhcH0ARs8qrpWk/zAVkCZrILlEGX8gqum9KiMqb2VLdi+73S+6+/W0u5hWoJ6CtdJUAulwvZBkUL1yLVV5KpusPNXm9PP0k52WZxinUsWtbKLqYNUv39cvVBTHChV9emKT4lohcgcbsgXzYIvrV1X2KlUpShRvsDltTngYt0qUJWdT9/6+tojq9XcKKV0E1UTUBBRdyTIFdXg7GDyoAuXMVareH769Rwd2M2Cqimt5Oi6jU1wlwrr3VFQNClONx613a0AZXBNI6Sp5s28HujjQyPUiSJ7r6mwCxNKFCdhpcDKqluwYx5qyYjqjiB+vxbHMCyobpqxZsRVThYgiE8W9AnVNjaxQiTKDQVGB2lDDqU7HyNSWdD0Vq7uiIIFiJZIi+4QR7pUoWZRwrLfFOa/WyEKUGbxDEibKmjAt3bI5ThvLoVCRUGVStaPbHd3vKJvsVeW15jZVouzFdWGVW5VoSlWibKSZqnJdG7moPt1qu95iYph0TUrNfDJfhcpm/r6VrPCkKV2aqkF1qhKFChflVA0tKMse68e1j2oqqv1WlNGUqPk8VJ6qx5u9LdhipquNq/3a/vwTP94/yMDGqSBpqo7HiibKfEZ1R916JOpsghQje7cvKtqZdDqyrLCe5+rRRQ/XDFeboaLtYCXqvaC+2iCpqjQNRZWk6VnSqO4CGokiXMpmBJkOA0XnnXmJqF5P1KyHSdQMVDumrCXrw0IigapKS47DpkpUqJ4bTM+ghD26OkxEFItb9T1Wn3Yst5p3/oK5gBGOxWsbVW1Y55wPRZMEalgdmyElgJoGEotbmUduVbK14y0bYwLU7+9ReSsTsDTZCKgIJkgsXa0L62vJoKjMsBoOuZZths8NlcRGIzaKa1FlYzeGVFSalHX6iApMlTOq0pW09gUGimsVk41TMXIDClXVDIfFBYmRUWkmULpQbeP1+0yYKpuqu7vO3fyOoWKibKZVUOH65xUWopLKYaKeqkQZHN/F9Rk1Go/g4CJ9JqwkTelSZXs2Iut2xlC5dqvFULWuUkX03JTP8EaSEZSo388jRn77+WJVjb+oingqXqr+79gfnR93bM65vFZx/du7tbezaGvWcu0/TNGxiupqFMXxeahbOmVgSs1xKuNhuKS4xyLEKoQozBSWAQkEq/sCaXLBJoWdnY/iU9z/3nshWWvls/2x9RJYQYrOSUI57AyJPZ/PnyfBVePiXqlVJmdRMjBQprr/+sUg3UFFMP3Z/oNKMhvXeoVrScWU73B1tn+77zOk6DPCpWrqrjTl41h8YUq8wxAbuBTzSIUpXLst91L+2mLh8XuhyjKuFbcicSsGyHqmLuJa5hGsZj91nVJQmEChSqKohDKTo/Qn8rgLEp9gcvkTyf7L+BPDpHSoAHWfHS+mMyb/njRMdc33Y0t1LVclKSQz0QRU5H4fqI6lYDIVqC2ziPRyca43UzHFQA9cpurOwCKYbl4uBcuT2tJIggsVI8PALDK5qvjDU1FXRVDJlZks22aQSJZxLZkenw9M5FOob1wWRAwTT32rFZGkirrJqoSruNsQhYrNTXsfLgrIanv7DBTBZfU4SbmdbzZSPx0mFRXKTIpgzTAUQ1Hci8JI1B6H7ardLPvdfr/dZzwZLkTqm1BkhqKtTNZIHabSV0/1lFpZMqHRsWhjqKaQ685TFVVl98JEWZDCRAyGiikzllSH7nzo2q6F1ra3VirBylKqiUqV4ErSVaI0nIqayb5A3SkBJdUJFaOSZVY/F4P1CBRB5IV0OLeguFV7u41BKm8lq3nLeiphTaiIuWiyok3SMFRNYfUQXAqu0+7ErJCYIpUCKwLnceAB1TJQnGo0FaOYakSBMhcwgmg1JSvCnVahCtQgFyRf5EQhIct3+WmfezGpcxYcRkC17YESYOYaIdnKEVAEkk1xFTNa07CIm3Sq4h0PHyKq5Ce51MV+schsYqESjLQdaxVuhQgVJJtQcslEFUfJRJeMvtNqWYUMFSM7Bmx/ykO1YNaMioVI8TspcPg8pdXSe6deDZZMUWVpDRV7Z5Xt9A4qkkeVRb6wYbLnI/tYwJLJegR2NJR1purHclP2PSoPpst0WV3wzF2AvqSCROwHlFS4qjU0uegsnAqYs3At3gJ1tJqLtldI7VWqzbgpNxtEuIKEybtC9kKtvhqKCxNzEaAlM5SZ6BrU2pqzcOlWVPnIKCyp6NFUV0TH8erFxKUAjT2yyKXHdOFW3r/plzVcbPm1nAWVggnZGhMPqLU3/2ihQxUXEsiTPR6vKLio6DIuOl5+3BdLixQPI4imADZ5yb7JPJPKLZeAwsZJki/Wf4RXXhJ9sG1AmXfy2Sqq4H+54qOUVvXoigMZ0bqYlxE6uTgYLgPDJIcsI0FaoRalx6FHp5CmlSZ4Pv/fa9B+5aS9spP05+m+iMaQaVuT0hEc71BkgYD8UoIf2btv7N3YVZIgwSLj5cDtX7GVX8D8lLikJlDQ9lM5ien89/Z46R9I+qNFFNJlXLr6Xvf9H+zaqimuIzZ6fIvKMSZbzxWn+bjCgXmT/nmQ/Xk8mykasrJrZce1iSQsUHiR3vjJ9MqBjBJk1bsuK1zMP+PP6QhiQNYfKxZvKkeFgmUO6iarkuiw+19MygulthfsfAdWGKBkyTLSksUbLiDo/PzwckUPlYaZpv8+0537hFdWH/kzh9yHqWEcXMMVyso9OxO0+apvP5EC5b8iIp88M3POQMQ9x5mEtEobptaJwLFWU1LaanS0FFM93x3nWY6LGbpuNEAjYdztF3aw4HWOkyww+FpokAK7SN3fBpCpSL6LosGVHgzFpQqBwmM/GLK2SgJlGhsv71UlRwbIg0CWKmhhQuQYz6UnpsMfW0Xdo+etd1b+8r7SzhHDVZAwmYBZY0ZLBMQRkzOzzWgSI1KHOxGVWOSAoRW93arqpYt6aMTG5ykTSJMiZYX4Y7fA0sUw91jSlgGyssUUUlarws4zKyttXlhEGKiCK4SLpsUbFoJlh60lRctWWQCCYbEcQpERWq1rWZNep7GU22CtvWbSdKd362mGRJyqh6HdhrsowqB6jhI6fN6eJnR+uEJarASkIGCk8FCpXdhmw3hWra7Q7Ydnb3Isog+gLEQvRaFxVtRNlTo6i5nE5uPI2iTOs8acque0nVWlXAqqrqqu22ClGieCtgFE0pr2Ug/VYhsvV3HWncpgFGT41v5VSNLExGlKaPdt/uXWS1VVSTqnUrzRhMlni0GVmaLBGVKmHSABFIBk8DSRQk6yIfqD5a7n4EFdUEai9KE4ds2Zb9LSsoWYJcRhecbz7afDe6GPGx/qOD7nHTV7cojDOLWyJhZNAtCE4aUiUWrgK1i3ToPwCkyB4RdeZ4nsf7ZWPOx1prv25/sihOFKNwjtwJ1+nP15/TF3/r9PWUF2s02ZjZ3037wknWE+rXBsp82BJJiTLHb0BWFSh+lSjOPkiWzVO9vFdTSYUtii11iwLSxFCRNCWKdN+s+2bHe8OlyTMpirQTjCXIOoKr2lf7d64kYfWd9UN/aaIYKJ/LR2dFdaLY1NNR0/HkCsqLDrT1dw0vbftSWk0u9s4osoDZCCS6XxST72/UXdiH/SgqRAHrEHVHIgoVzeAZTgMi5tO2LcegcfnDMntHZwHFFoio+S29kF8u0nUXSgB59gjNnFjUDFFGREETRQJWtbfqVrWVm7vqaQVVT1toYhFIP5BEfVD+jyY+JE0kUZOot4r64ZGWtSxTlSGruJGXp566r0tFeYtE8ZvoBMtgyqQqZb3tITGfYXD/AbsxSXZkBUVqYYgmVv6tRxKUpCbbrbs1Eh4+XG+ZHs4fte2HLZ0CZ8P8hOl2y1M2srEax7EeIRlfWZFkXX8u1/KnrqxrLo2TxLNujlQaXa97XGtRmYFRXVbdZjNsWivGh4giIzMVLmYzybray5XHl7s0tmOUTSCGSBck2nORrd16A7Ob7SZQudsjo80Ul5uzAqXGeU3DHllHI8LO/q1Anem2wCCVgBoon5YBvFE2Z7mE0VVds3tWC02ZJvrvpEhP0TAKzObvSljU6CmmzfKWHSmilSVjvVqxcrKeVfMkKmVn6mMjW+t2M1KaMku71LXUxKtrtUTFqKtTlqzP6ydrvNL1Z/OK6tW9QvKKKdLHhIHyyEEXOwTsECTqc+N4REVXSyuppC7PIkwWCit9pT6QOMrO0VmwnHdut2V8DtvdYXcgG47XLzhVkJ6jyMf9PQs4zuQXzieNSCKKAuWZXdTfVFwHXIetvZMQRafRe/7nWVE8/2TRFGm6d04L0ht7eztP3b2F6pFD/q2IqMj/lzHCw4ppueJZaaNszpolTc95u/ccJqPrLy7IYNVRIAqi+QYRpBVBF73QNm8x4UFwNfj/HzWnypvp6Km61S4P0h81rM6IKrYqKj9qZQnt7KVEoXqNF63p7/RnQmmaVCesLAax1rkowUx+5vfMvWcnSYpGLOUtvKVbSbEaMAIjglhnrWlyz/vvdRDN63W8tBV+1MzM9CWhmRPvKBEpvG50UYLYFXsRtKYzFbsd9jqsxMjN7/DipDMQVOq9P2rrnFCSVLLH+ypVusKPYsl4fowXK/KYbuBz0ACxQE6DMswqh9f8mnWVFFmTWX2RshZgaGCpUV5j52Dke1z+0zZt2xFi00XoGDDiIvKJwHCRIvRNTym2JFTYMKpSZVRGvMypxz6qkJHOleETKjNU1FBalOXys8AjVk9OKeMEueQ1lyCcqKYjFFi0tpDSHrznXZwg9vSCRe9C7OWmJc2UfJNJ0Qo+UFPHPFpMXuTGA5crB8XqSWXipd9gE/0i6TBjeEKJeiAVqWFlmlyabDUGyk1r2pTKsO3bsB/7cfAQeEY5Kz05Ra1S1GZtWlqGVim9XzQFO4s1TXFHpdI8tmBXd3VgZPT0UBgIXcjvQPgQv9WrpS1C9Ew8uc2pz3cahZbq5fvWCh2wFDwVGqAkcJLU81flYOEAKeJHbpA1qeftoc2qQxvHYpwJqfhAa69WTDjdvcA2zkJ5qhJCjrBU4iTkSQzpezVCm77JHEOrW+Qhq8rdpzoRi0UrbVRGN/pPei7TXjSUhBPPPzbIHNdRKAqiDImjNxiDrC8+O3DYSe9/YV114KFL4xrqPrIjvqg7gba/2/bRcJAfn8/6WVfPH1kbBRRIZyLSweXcBV4piuZZ5CeNWEA1JCIDtK3b5quCJmnlqjS/KHZeCSQH/w9WbAYgTE6s0sFy19oMzAcaatfVUDcmu75SMldSflJSo2GCTJE8PJ6UDL871kbuUM43VadWJuqlpqSTbCQ60M4U96fx8AgylP7VUEoXYCZnWuHxVTQyyuYA546EwGGt6gQVxTNyyqjsvnENv8MTLHAmes6KQcp5yjmLi63wVYaidCQR5spkILmkUcvDZD+iGpthgmrsTNTs0J0IG2ltTDVL+1RKrmBvFxgvlc2U3AOKhgHLVLh08HyXkSTORaD11VGD31WWfPqkEZEEWHoLACXCBImqNKqxm6wtomCkcyfqleZeKAYzUV8VjtZkyExolHdCvVx0pYILMLCaZpnDL5p3MB8G9RTzs0xEicE07ysZUCxWoPIEiclQ9MCa7dkNysfJzDIveVl0TyiltQkmhpXvGgRFh3Hw7NKHuRpYB5AScFo0RpnbOIzb777JOGz0QyDByEgEGSqom6WJIrQ48nI+UIRSsOcL3cMZqJB6/Hg/GpDTFOmebboTJ0IBFoEiGeoJA5f9rxgy2I0bBmKoEtiSpayu/f/9KXUM2vZSrV1gQIlOZyRc8jDlo+WzaEwTJsAiS7w3iqY5XVYuerHL3cV7P1Rioa62jg9GnBIKx/qGdar+5SZBpWXSNpIULGAsja7ePDGIBAPKB9UHKligKeFogcWu/S7s9EmUnzyUFNe7EEGgys756816Mv7xDgv5Y+KwEVZZLy22EZf9P+jfHyy+PQZTURwuPIo+JuqvhW5dSW4dhgFc3CpiWfjsDY386nkm4X1BRCmkF+QFFz5XiqjJyo0lzs2a5mMMOgOBpugBiRWgASIt6qNhKZqaXhado1m4pbV3dREuQUUyh2mIAu/kCmggcyPqXJFMXPLOWpa8dAfMjT4CDQuVuxYC4O/i2+1LrbkhbJM2RKrdTSYFImr336azB0aD/9YbSKfzFxVk+UEYhKpXndIyFjuQXEAOpWCMR4pMc25ddWbU3cTZ9ZynTZSyo8F1qB1WX+ntC5pherY0Oj0VnkxNEdXvpwAzxTCag7iiznzTimJ1iDaaILC4WLRsO3ExRHWv1JSbraS+2bEnirvmHTfsUKP/FCJoVijUkrBvojHLicoiM07oJUMGuGeUxLPRDDJSidy6VvoQD5H7eSfaPcE8yRvK7uV0HyKs7/+n34CHR2uy7vpg7IAAAAASUVORK5CYII=);*/
  background-image:url(/images/colorpicker-overlay.png);
  pointer-events: none;
}
.color-picker-wrapper .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-grid .color-picker-picker {
  position: absolute;
  top: 70px;
  left: 70px;
  width: 12px;
  height: 12px;
  border: solid 1px black;
  border-radius: 10px;
  margin-top: -6px;
  margin-left: -6px;
  background: none;
  box-sizing: content-box;
  z-index: 99;
}
.color-picker-wrapper .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-grid .color-picker-picker > div {
  position: absolute;
  top: 0;
  left: 0;
  width: 8px;
  height: 8px;
  border-radius: 8px;
  border: solid 2px white;
  box-sizing: content-box;
}
.color-picker-wrapper .color-picker-panel .color-picker-actions .color-picker-action {
  width: calc(33.3333% - 6px);
  margin: 3px;
}
.color-picker-wrapper .color-picker-panel.color-picker-show-inline {
  position: relative;
}
.color-picker-wrapper .color-picker-panel.color-picker-show-hue.color-picker-show-saturation.color-picker-show-lightness.color-picker-show-alpha {
  width: 230px;
}
.color-picker-wrapper .color-picker-panel.color-picker-show-hue.color-picker-show-saturation.color-picker-show-lightness {
  width: 210px;
}
.color-picker-wrapper .color-picker-panel.color-picker-show-hue.color-picker-show-saturation.color-picker-show-alpha {
  width: 210px;
}
.color-picker-wrapper .color-picker-panel.color-picker-show-hue.color-picker-show-lightness.color-picker-show-alpha {
  width: 210px;
}
.color-picker-wrapper .color-picker-panel.color-picker-show-hue.color-picker-show-saturation {
  width: 190px;
}
.color-picker-wrapper .color-picker-panel.color-picker-show-hue.color-picker-show-lightness {
  width: 190px;
}
.color-picker-wrapper .color-picker-panel.color-picker-show-hue.color-picker-show-alpha {
  width: 190px;
}
.color-picker-wrapper .color-picker-panel.color-picker-show-saturation.color-picker-show-alpha {
  width: 190px;
}
.color-picker-wrapper .color-picker-panel.color-picker-show-saturation.color-picker-show-lightness {
  width: 190px;
}
.color-picker-wrapper .color-picker-panel.color-picker-show-saturation.color-picker-show-lightness.color-picker-show-alpha {
  width: 210px;
}
.color-picker-wrapper .color-picker-panel.color-picker-show-lightness.color-picker-show-alpha {
  width: 190px;
}
.color-picker-wrapper .color-picker-panel.color-picker-show-hue {
  width: 170px;
}
.color-picker-wrapper .color-picker-panel.color-picker-show-saturation {
  width: 170px;
}
.color-picker-wrapper .color-picker-panel.color-picker-show-lightness {
  width: 170px;
}
.color-picker-wrapper .color-picker-panel.color-picker-show-alpha {
  width: 170px;
}
.color-picker-wrapper .color-picker-panel.color-picker-panel-bottom {
  top: auto;
}
.color-picker-wrapper .color-picker-panel.color-picker-panel-top {
  bottom: 100%;
}
.color-picker-wrapper .color-picker-panel.color-picker-panel-left {
  left: 0;
}
.color-picker-wrapper .color-picker-panel.color-picker-panel-right {
  right: 0;
}
.color-picker-wrapper .color-picker-panel.color-picker-panel-round .color-picker-grid-wrapper .color-picker-row .color-picker-grid .color-picker-overlay {
  background-image: url(/Content/data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJYAAACWCAMAAAAL34HQAAAC/VBMVEVHcEx/YZRsq11jnYp2lXKEZYmShGCagIB+f3yAfX5up19rZqKRT5xcopqkW2qAfHxdaqmYl1R6S6xVaLKrR4x+QLOMAspUU7utVFSmX1lWp6ixRl4yBP1CL92BAPJCTMz0AH97uEi9PUtet1ulQ5pYLNJTv15JU8M9AvZXAOnLLzywL6VXtHQ8RNWhl07ENkN8u0S3nD2sAM6QM7RoPcGvOptOurU8H+ktLO6DKMF3AORRuo5L1E0vP+aJ5ACiAMiatDpMzVZ5HMpH+ilqxUWAANmyqzVRorSIzyheB+BG/yhLxYBeOMd9/gBJfr3STCidILi0FrND5EjBJ56/hDnUALnUJjWQAOOYqkS6ArflAI1SAPxFz9HAAMlLxLfNGpS4ZEC8AMBnD9mA3RtvzDvJKW7QAaqeyh9cAPJoAPnRlide4DBHncXaHy/CtCSlANxCBe/sAJM9y/HBMnOWwS+zlUT1BxNx+ADEojCsuCvPIWVO8SzaFlrrAEeYAOyVANZD7D46cNTTrR1zAO2C8ADuBh1C+6rCWjhSx1RE3rgzXd8+td/gFirjVxjnDiPJUzBl0TtB56Y/9XpA5G8tW+/qAG3pAMDJezBGvMzSAMW7ANexb0a5Ono/pNU4h9ziCVJD2to3l+WFxzTWEIBIzZNJ20frbQ5BdMg/7WF+APzcAJbFwQ8xcOg9wOdE9vaY9gDScydE15lAkc612ADaRSFV5jHgAnRH0LdC4JFb6yTaix2Z1Q9y5RngtwIyh/ApSfr0AFw0nflF0nc4qu/fsxBB/I1p2DDEyQDiALAoJvnbaB+r0gJC4Oau5QD0ADlC2221whlD6+9D+sT1eQDoALTriQU5uvr0WQVA/m4sZ/pt7wuf4AD0AKUwgfk/2PlA64XRyQD1NAte/gRD58jjeRVB8LXsowBD8NXRANHrUBGV7gDnMxb1lgBB9jtA8pjjlhHtLhL1tQDpvADI1gBE+t3fNx0/kvgyQA/9luxAOdY9hdRIP33AM3H6gD21QDrnpHAAAAA/HRSTlMAOlc9MC47AyQaSEZQT0UOVk1fZ1xvqHZiVGBx+bvqm/dkg21opHuI7NKnh2KtXJZ3e9F9gXZ/y96KynWmy8u4gpea7oO5jXCjwfmJk/l9s5WhwpWLzLbab6/a+K/cj6l+xLC0lKC5r+TxrLmMxKvk3unkkJZp++qaoLHcw+b0x9Gpudvc7fOQi7u+vtLW36KgzeTD3+X0np3n8G+ArrvVwcyKu5mz5ZPV+8jG0ND6+bCtn+TDxtCivdDAvsPY4PP29KLfyPWs1dfyxM3U8/eyu+j09+bm9fb29Nba9vT20uT498/T3+Xh+Ojp3fXk4dPr9+j09c/29eb65VLGWq2zAAAbp0lEQVR4AbTSsariaBwF8C0uZLSReQSbLQf2BcKCU12w2VdIYSFMtYNFGgufxNbCIlhIcrtBiyBYJ01IGbDQgIFAwp7zHROvbKWj5/y/7zZX+PH/8sdjsSzzp9ftzh1nNrxkyS5njj/vdnvt/706Lcni/aU/jyYNSCiqmmTx/OsXq/33l6N4dfpBlA6HKfsZpl5SLavY75utvRamN3n7HqQpPDgs5tak7ESrdqO/3177mpbZU5Qqza4mlw4zdZnhBaHaIbyrqgr7Hf78ZajuJm1RDDgYXtkkmxBlXBjK0Fb279dXwIRap0pLapJxMkyTHatUHMAWgj0dVd6gWEzr0vxfpuSEbZ8L4+faX9+akHKizNgZTqYyMaZ15WyeE/bteR+/ped7f09RoMp0UqYlVJxIKoxCWJyhOxxvh/G8FpbrKa3nrKqzgQcgzCAtSwxQaKRSM2lQs5gqljDPy+DCUMUUVfWj84SF8f0G7whhg8GAKKhwGhQPaUqsmngsAljewIq8zn8+YWGdFU3oIJXJJFKVGYvYMzvG2EI1MgUuhq6iXnR+9wG1KoSbGtyoGhQOQJFt02WThQqlyoUBSgsrfj7+kNz0mCK9Hsu4ZeQKpNiqIRF1VYWSmSRekicJUQWmqH889JBSva20KK6KKpBcToSuozUmClCgApxPCdkYDUMPs0WvMrl+vT3m0gNKJdSBKHpciDjBGqrAxgCGtiZcuAXzWMCgAiopksKkPn17wIVf/Nl+VIblKmuXMESmQNcV5XNCtskWqu1nWC5X/dcDqt73K+pQHg5YlFRrJWAVuRyM7ftmkBC41oVupWKIkqt3z8KosqZGdSaKdeGiSlkFGFVxnMABzMcwlIUsURyuizEqDHOs619w3bWrKUgGZUwKUVOYVpgAE4w5YwcmFPHVNnJpX0IZ1yk5FafiiMp1167OeMGzUR0uu5pOjUohiKaxTIzf0pQ9G+4X4UIuJpELLLqOd7i4K6D0gIwL1dSlaXolMbgdtg1NzsgfOaP9SCq6wsUCNKI+WLOuExZ2p6v3z9mozvyqtCqoDEoZr8bKBqaNs8E4CkAYXD5qVHt/sSdsi2GSj+SDr0jYsf6PUfp3UeSM4zheJGC2SPrUga1SeP0WI4gMKZ/q/gAhoGBlwOnEylK0SC/MIWydRrA51JQKy8B0NstUJsNeIZZ5f3/snHFZuffn0frFV9VV+xZXrRZO9r/CRLCGEqqhoTxE3a2QfLENkwcMFZ/HPfcC9vdaryUwVUm4voHFRccniVudDMWheK+o0O3yaOsoLd7GMaT4d1vVXmQOI/sdV+4ihY3sZ7ytusf0GyxR0bBChb9CcFLaVVNF8icwp7nqyrXWc9GXlaGsD7ddovr1ZL2qxOUsmZBApVueNond9f9ElrjMYdr6ceUwy1x/iOuW6vtzpTKUFYbBTSwV0gMiKdZPzKtKZKB4PZ2oRvvHESiGye5VfCleipcjK34Q1w3W4pSL6vyPzV12qJCG1FSgJqi2hmrHk3Zs6+sSGzST7Xuo9iNcj+JyWCGu4kVdpbDeV+1A5afzWV1DLwQeQXKUbOK1mZnmrN/vywdaX2BJDxcpDJep1nYuVRXH4wuv876LP1Z+yoGdgeE6D8/DxTDgoq6oBHVtaiOS5u2+TWEJMAKVcC5ouBS2rmDFqtCO0q2/1x0mdlbUYohKClpqQXp4mBgLEs9JHIvvOSg+UiLTkHGu3giYumhVMnMdxUV37x5rlkt6Ky4FTGYopipcrmq0G21HyeZ8LHeZzFkWMP0hpXK1KgvLWEsA7/yEudxKroVJUcFDZChC1fiKarqqQvEi1mLOctioN5LWI1OVnAtY5ud6OtrPeK2q3eWWqXCJLCzsWMa6VLExa7abzeZcnruieWQuWzJQl1fBRFaWRQkrO2ageHe1Ny6knx01ZQtHWeklqtEQlZukuY0XNTHJosqVtBJgg+pe5lquS1TqyiRQ7E8Qb1Tf5do0F5W4aLYIszDzv5VlpxLTuDnmVF69WY/qqOoRCawV8aF+qyWsQW+Aq2Ou5VdYxr04Vwbr6eknGNes2SbfiGrKtRZTTELipWGXpjtXNchUoC5Jzfq8DozHyaxWnweMg8FCxRt1Xs+1LK2MXHV8hnH9f0fFBDVV1Ewmt7pUTQTVGNOlinmRzeJiLWswUFiHAeNaS1wKy3juIv71V6zDRlW45FYHcQlqls52otpVtxJU21X35vHeytw1aAlKBqwDzFzlsnwun02VPUmfKparfhTVZrpBpa7FQVG7sEMFSlUPpiJU97J6/Z699tFG0cfoQ8RzGDKpg4vERahKdT1/ypi6fr46178byk11OCwOB/kFSVSK+iykCmUm2S++/7iof5dG8zUM42Iy8Qeo2CVOFQ9MISHuNtOkWjicKVKkEZlCgrVg6XD+AQ2BiSKnyIDNFGHLwYAwYcvANkE46BaWizghDIKkiP3e1/0+8VXv7zvWH64nTPGXYpj0Vy49XL+GauraA/bHnnJpP/6QSqxQketlrAwqaqHSDQUDRS2p9PUVC1W4hHr3DCVTsWhZERhDJhXvpYvJpQHDRS3trxu95chl1lxvqnqQ6m+pREKlwfqtb1TEkujfoORhxaI+w6Ty836V6iMos1AxUHZFLY0rkgvXX4M5syLWkVmo5EqGCpdUfZ2wn6oUy6p3Mv0ik2HTpS7LtP/wbwuYVJbhOhcrYL+LFbVubnLkClbn6E/BHh7+FGtq6v2v51b9/f7UqWpqGUTC1CszGdYWgyUVHq42nvtvb1zPbkGkStcN79zxXOzvAWp9EA9/I1L61GrZ1fEqv5WlQpUqDDxSsXiLK9cjFcufyx/PNAzzDNrq/3fNjBcYsk1+DGwy7vxFp5irR2hItaDbwhKD1W3z0ARqwoqbYVodlYfJqlm/ZcXrgNUoPTsUq5pL2CDAarWj5ZQP8ml5Z9yPRzJpScVtaTCBStOqEerKrFeqfQZxVDxmGAHliUwVFu42oaBOlcsw2C1xPrpWq1prOyRBwrXqV5Pk6obtaqoxHpXfaaaLZVmS24VpNVZfVJFMooJdRAsw9pbbUYsZKAGLbvM8t6IBOv9tVUJDNSpUKolFCpGK1geptK/Suo0Na3qLeqPPv5A8w40BUOlz7n4ccnVxuVY5FKt1k8GqxGsplmghg+nuHpJLbn6uDpCdarVpFUFFCrdL1CLvNXFVVTJn/JqorJLvQzDFb1AwTo3atDSVAvV7c1tSyRt5QiWJpVrnfbI1Y1aHb1qh1awKvqs8gWZTXrMOE2uCIbLuXZR2ZUscTGuqEUtwRYca+3aruFwmNTyEXEJ5VgdVBoomQKFSqZYoPSlwdJeZ2e4XteqOdeFYqGy65ZceaG4Ia6hYHKdaj1exOp2OvzgvUqVVBVYmlG8WG41PsvC5V5n+txrV6zGVrvRbp+0z0+ACRUwq+y6vYC1MoQFClW4HMsqhokTVipWGcWWwpRbzOnj8a3mpocExTujl1CwtoSCdeJaA2At716o8c1Yrp8r+nHNX7Ph9ZChEqvZa3Zxdbr6ZXFEt6qkrbhgisos5jKAsvqHzrJwOZdqiQVMtRoNcp2fiFVDdXHRupCqJZVqsXn9uJaEUq6hckWsJq6uJ5NVsKSqSFV5qcoEKptdzAYMlVcoF8rlfOI62z3bNYtcjRNcqOxqPVLrXq6xXQWx6pNrL2rd4aJWE1W4hOJJBUqzagmUXjaTy2anHyzTloElrrxUZweqFS5UGrku5NJc6165xrBqYt1N4oij4fBOKsWaqr53I1YdV6qSySqxMjk9SjGpwhV3LNh1IJZgUsnV0KJWjUmlWo+PqiXW2Kx7/a81MitRJbAms+o7rDqq96g0brg2W5IrLpiR5NWe90prabuG2aVYNeXSHEsqXKqFa7wyszS51htdSzUa3lkVR0QlV73zDCXVmmP5gppSZUIz78/NQJlV8O8rjyt+XA3vhBll1qOmWPfUYsszmQmua7mkkuuueUes782uWVLV62IFTCh9UxawqWl+Puvvda9CgVxn+ahFLqka7RTGkiPCAvZpeeb9BJdVI6F8Q7s8u6p1saxaq4AqLeHKoEpRLGzhWpbqqVY+cr2u5VyPzCyjbm/XZ75+m2hSadSKXD4iLmqhwmWVY6lWhvmCoVqYwrJv7DJMrkJBudJaCWzzda17uca4DgV7nNmBNZqMolaodpoRS6qqjmjWh8qaVSVU6QXDtMBskytYObnSXG9BrTfWA7VR26jVti+2n9fSVOvT9sxILM2xEtfXZrhYnb0n11OtJU2stFWgPFi4gAmlM0YtsXYFW49aJ8jkota+XZ/FOlassVjjGVTUsutSKNX6imoHFSckFrWIhapkV4Y9tXo23xFV1PIV+c2/lYpayrW5KdbGBrXItf+4r1ifQ8Vmvn0T7GoyuhqNLqMWqp2dhBW5NFjA1vhpZZJaLFQrCytauMhlF78uzmgXseQSzGd0re3atnKpFbXGuG4Pb2FNzJJKrEuZpEprpSipPiS10iOCCpVNfImLI75RreWopbmWYMSilmJJRa19u+4/Hx+Pjw/Hh0ktuVBdoeKKyIgl1xc9WC9qLRlmVbiilWeWXZGLWuGySrWUC5hdgnFDxdIN5To8/CQXLMGutNHV5aVcrrWjK1LrS93zb+vDhzVyGRVHfCNUqpqzCpdryWSVXPlC1JJpN1BinbgWsfZRyTVWrLRWmkswuXbkmuYySxNLrcIVtZhZRs3NGRZX1KJWxHqbf6ute5uNzQ2uuL3hI+671jFLa0n1jVyXV6DIFa4vX0BxRKvIFTfMxBHnpzfEpVkVLNeasoC51m6C0v6hy45ZGsv3MI7noBkcPKMhKnLHYkACgnKZ4uK8hdvZCFMNY5UuNkkXYpFiGiPTBSxiYrBIYxqLlMGQdgjY2K1vZJv9Ps/5+/dkmH3O2a0/fH9HdtFDzbWIda5aVsVaWlCxW08oYmlWwRIs1lpZt6toFjOLYLlaLLpAwdKyWEvf/LlqMcdaquVZRS2jQq38DR0r98knq6tFAPGI+VrFNdcyioVYe47FT6JgIZZZ8YjLtaxaquVcYl1/r32vxVrxiFktJlZwebGWYrlW/tvady7fEBdDZReqK1S5b+sl1nIsFmOJVcvdUK4SLKmotVKMuQQzKqrebRQDKrDeVHbFWkax5Vq4nl6e6k/1X3Vc49vxbee208lqMVrVvtRwsXDEEizDioplVlTFWIYxwbajy6w/1mKB5VrEeslcsMawbmGBunmrBcuxYi1UK3z0Ca6Qi4m0FOtdspGASlVrO9zQ+70WMyrWCixcT3VqOdZYsTqwblDFWieZawvWxw/Khcoffd7lSeVaSVbLKsf687cVXeHbWvxYwPrlWPW6XGOmI37ruBau2nWNWXUCa+sjsFI4onOxV1dUGaUvi1gptbhhXtX43LBrGeVcF6HWz8I3WKxeVy6OiEojFqoHw1wLFHOtErnWlStZTVbtEkw0o6ziP9QJKrn4tshVMay33wMmV/Wwetg8bH792vraOm+dXw1+Xl3gUqwF/xt4K1bdrHFduTrjDrluUMkVcqkWqP9ntUqhlmDulV/Rs8modFuqPaMci1yoVAsUr2oNrq4GoPRtLch1XvjyEllW4dK+KdcDucIRayfZFV9zrWtJAsyKN1RgbSRsI8XFDdWq4iP2etkRq66Fi1qt1vkgq0UsclFrv7ASbzjmcSx241xy1R6yWie4lMu1fEZ6JcqVBYsPS2xisFC5lmOh6jWCixPycMNzsQa4xLJqsVH4AOq5/vx7LVRZLatwieVauJCt08tfPSv+tqQoVdYqRcUVaVURi0+rwT5X2WGzKRWxWlIpFlvItVHYrMMybD4fz8fjoXK5FiymWqBqjnWyBUyqeEaCofgTSqo0zVCwrKKWY1XjF9/UFz9ANfg5uPANtc1CYfzy/GxVvW4XsKFZ7NqwUa0GiwEjFzAWYIl7BVrC6xm2FKsSb8g4oWsxYimXXKq1cK2rQqFwrVix1tCqTl+sh5tQSy5f8TWXYeshWHDl/vFX5VjbKaqKVMd7xz3W0BGrjQx1SCqjtAvth1mfYX1Qref58xyXYLBQ9W/6dmkjXCGXVKwUWXlZ7JSkSUQ5FirFQhVqMcNayjXgjLAMW2j/gbUmlV1iDckFDBe52gGFamQVtRixlmBJHpbaxBNZ+VhWGdX0Wl6sFY64VuBXuvXg8obzoHKurJZcZkXYksswlvBYtZGup1HF587yqhysxataUgXX42JxsalfgHeM0mOVlqna5GqT62E0GjnXrlTBpUVXkKV2gcq3Uqze8XFPLt+w+u+1HqVatApifUQ1e57Ns3FERi4GS1MsXAeG7VoVZXmaQCFUbLXtVpU9VOwoxmra1bprtSatwcS1uq+w7E93m1bNZvNZrNUfGtV/aLfbqsWodWDWbgYrlXlKpVSqNDz6V15VNkoXpFaGOn2NddZs3jXvgmvQFap78SjV43tQvuIMl1TT+XAaWFq7ryu2R94BuQ5Q0QuYZQHmxyS/nk1BpVHrqNcwrHpaPauiakoFajJRrq5UdnFDs2qvtaZvLqZeDBYwf112MbvKeoDx2lVO48rbfsIBM9VR7wjV6WkDFaxm8+xOtVqZqtvNXNp+YK2B8mBNxbo3TLGAWeVcB2ZFWEZDpqccaOXsdSzPKqGscivH0hFdy6yoolYRkjfPUOQCNpzC6t+HIzLDdEPBdg+s0uNepcyV8v6NR49LlaOJcUAeq2AZhUmqyUSu7qTLHruONXj7E/pbLXY/5JHrMnONeD/xwLLLufKXZOiE0jBVQPHuhBMe6Tk6PTpl+rAYJzRsAkwurkgus/xzaNZ7mf6aTWdSDYPr0i7vU/uTXcy9rNrh3draMSs3QpkllUuZxSjFe6ZYLK8ahFqefw6D6wGVnqlrTe/vVevysn/Zvgwu9TqgVx62u2OYguW2A2one44r/4uq5Vh3Z1HFrAqwaogl1kpQBdcwuHhw/de1/mHTDnlUR8MojsvJzU2uuLtMsoIEQ1ZsUO1mqahBV5RMEMU0rHh9PwIWzbWbbMY1o5Gw6/oBMCTMJ1mz/M+fQIlnPO0Zswvp8jxvVC5a8T9REffeX2PReQoQAlnKEyKxlJAkfa9PbSHwxqQ/bQmsL7BcdfL3/9+ElygVLL72MVs5VJj5BItNRg1GSSOFyLd7zTB5VPRe1UdpBIK1uFHlE3+oYcXV2mur7AkOwLbSyXXX5jobEvNpJIUFnUXh4cAsheoxIpJedgq2FaMBWqNCpSxfKw+Rxvrcy+VXD6Xu3wtXAOZwzzAEismldhWy7dlXXN1YKsACtWascSSaoLqx70J4X+fyuUo1/5j7yoy281mmmvWuwqhuBSWHkjpiCPGSeJUBNcQpd5QPLiiqqGgJpNfoAxcR1C6PTBz5dDMtQXWuwqTAaOCcSNvYrVoKV35W/lWSvV2myq0oSVrqYhQMQdTPcx1Ya6L5sKFapff5nKXUMWvqlieaEqpx1CZo6TSVFUdFMay9CjGmkTYz0AeXB9SXZjrDpZLNhbMXbbYEAYKUpoNZJikMhcqUtV1FQRrB2s1uJqnY4n1FRRBRVDlxkKFy/eamorgSovUk4DK0ixJcGWJRGpJ9AF9qypYTNX1qoiKrm9iPbq2Ut1gchGDjW8uZAVngYamb8KLwMKUlVLpWZZLpVqGZagctWq7dt3RJrqiqn5QGevLQJVTg6HizCWVXG6iLrMktMy4HsVQhqppsKxAoeo62yqirrCe/WO6fvXmOl32p34vssOVo7LBJAM29S9JMmvmsjI+pUdbaaqKT8hJJVdUdV2zPkvVoLra7/2JaweJSjXfz/M5exFcYyabjWWiqLhiWjzAFsaSyFWATBVjU61Ct6JSrc9RdUV1vb4/VflnPJ04ZMCiTCquDzBVsEJdeDNVr3IxmOpVKNuKbpgKmI1Fzg0sVLCaL6Z4/hmlAjU/MRcqarBoUqWywMJj1SllhMn2ioiCeq0sYRO4ldLFYKKm8k/43LU7Wcxlsj/uB/tzNra9PIupOI5SSrpcaCi5XLWppNqsglTRde7OqEAp9ctzlcKf8v97uWMUt/EwCuDbDJNAILAMTuPxNmuQWm+CEsMiGFDhbofFiMGokCu5kk8gF76DwbqB9yTjPqUPoCsYqdj3vmd5/2YHnDHOvPdJaTLix2czU+n/H4uRC9W++M3v37sk1gl2xIvTecQ8mSqUKtWuxPqu7JR/zrxD9o6mLWowuYIWpkxBM5tkGpJQoWii6gklKpQKGadkaVdEsczNuVfuaqjYr6wlkCu4D1oX2p8e2ulPH6YPnamR3JAUhqFUIUjcVapdraVql9XcnX9B8RNRHLm0L8RgI6BaGVCtCwXMoREV8qIsTLktyxhJoHpeG2q1W62g+nJORddv2zbOvph7ljD1mA5GjVpUyCpclQIRCpVQK2RH1d9nVWTd/nnqmgumcGHsCU2wCK5OhArFYVLWkhD2DBZd6+8rwHbNrnm+Pa9iPsLVNZa3/eoRdmSNOGAh05GJlAjtRBFRrEgWmQZAjdOE24KJqpWFqh97sZr7CrrbbtdUW48qNJgHgU8YaxuzRCOIMLwBxAkPlQqzMFU6GJsqWTPcFT/DZvyDKrmgoos1lWA+KhijlUFmKoWqA2qBDhaDQaomljU/Q+zKttW0qte4GMEoQwDzLSP2mIiNRJNrEYG0ACrEokKYBsmAH2C7K6qY16no+iiX1/WQOcbia2EuLJJrGA1Jokgm3rAqDJLShVAl1gUqpd9VPMEOLgwj2HB06JAq3kzFYWAKTSWUWEJVaNM8UvXafGr3tT2F+S/DDq6hSFIx/1NV60qqL5cdgVJ7Ly3MlQ1ZJ4u2UqFSyVUm5bqkaoU2q7tLj2a5cb9gLczHACbVKWwhWawO2JxN8qTMaZKqomp8Q9Vlrl/kcheWoYAhS193RxazrkoosliqDFU1T3z85YcR1XNDsUzm0ZXh8jOIlpjhcokLEy+pQhmYYpAULqtkqrJimup3PvvinP6mcGAcyATz5WJjZSFYTlmCQrUuOVI9vb/CQVd11zLpTryJuSAyVLak65hYVSA6plS4Kw5Whcde4ViwvlgeXTNckim0uTLBclUq1mKox/ZYsCssLGjXhUIml0xy9di4t4x71riAqXgBlX7Qqq7hcmBwcWbebJbNMk6PFYtjrLyXF3EB1z4v9vl+X3KqfZXcXfW8RT6pnhuLyVTIUKpmuBCZAJKKFYoF6sNPOTmwDiaCWWZwIT3dem0KDFwFkhfFvtgTxqTXRjmw/hGlysQeYSApRJHElH9dH+XC3te+I3PS28w2vU2xAQttXdgWMvj1/c9CCXbLv5Sfp61Lsg27AQwuylqUTOEfN/rJNziGtR5lk8lGbV0gbYhSC5risNYxrG94aG394GdQIbg5KTBI/K1+d8v/abn6eqfuv48nS43J4k70bcaW2IuJf0L+L3oUNPhVQ0AAAAASUVORK5CYII=);
  border-radius: 50%;
}
.color-picker-wrapper .color-picker-panel.color-picker-panel-round .color-picker-grid-wrapper .color-picker-row .color-picker-grid .color-picker-grid-inner {
  background-color: #FFFFFF;
}
.color-picker-wrapper .color-picker-hidden {
  display: none;
}
.color-picker-wrapper.color-picker-disabled .color-picker-swatch,
.color-picker-wrapper.color-picker-disabled .color-picker-hue,
.color-picker-wrapper.color-picker-disabled .color-picker-opacity,
.color-picker-wrapper.color-picker-disabled .color-picker-grid,
.color-picker-wrapper.color-picker-disabled .color-picker-input {
  cursor: not-allowed !important;
}
.color-picker-wrapper.color-picker-swatch-only .color-picker-input {
  padding-left: 33px;
  padding-right: 0;
  width: 35px;
}
.color-picker-wrapper.color-picker-swatch-only .input-group .input-group-addon {
  width: 35px;
  height: 100%;
  border-right: 1px solid #cccccc;
}
.color-picker-wrapper.color-picker-swatch-only .input-group .input-group-addon:first-child {
  border-right-width: 1px;
}
.color-picker-wrapper.color-picker-swatch-only .input-group .input-group-addon:last-child {
  border-left-width: 1px;
}
.color-picker-wrapper.color-picker-swatch-only .input-group .color-picker-input {
  padding: 0;
  width: 1px;
  opacity: 0;
  cursor: pointer;
}
.color-picker-wrapper.color-picker-swatch-only .input-group .color-picker-input:focus {
  outline: none;
}
.color-picker-wrapper.color-picker-closed .color-picker-panel {
  display: none;
}
.color-picker-wrapper.color-picker-horizontal .color-picker-panel {
  width: 150px !important;
}
.color-picker-wrapper.color-picker-horizontal .color-picker-panel .color-picker-grid-wrapper .color-picker-row {
  display: block;
}
.color-picker-wrapper.color-picker-horizontal .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-grid {
  display: block;
}
.color-picker-wrapper.color-picker-horizontal .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-hue,
.color-picker-wrapper.color-picker-horizontal .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-saturation,
.color-picker-wrapper.color-picker-horizontal .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-lightness,
.color-picker-wrapper.color-picker-horizontal .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-opacity {
  cursor: col-resize;
  display: block;
  left: 0;
  width: 150px;
  height: 20px;
}
.color-picker-wrapper.color-picker-horizontal .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-hue .color-picker-overlay,
.color-picker-wrapper.color-picker-horizontal .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-saturation .color-picker-overlay,
.color-picker-wrapper.color-picker-horizontal .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-lightness .color-picker-overlay,
.color-picker-wrapper.color-picker-horizontal .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-opacity .color-picker-overlay {
  height: 20px;
}
.color-picker-wrapper.color-picker-horizontal .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-hue .color-picker-slider,
.color-picker-wrapper.color-picker-horizontal .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-saturation .color-picker-slider,
.color-picker-wrapper.color-picker-horizontal .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-lightness .color-picker-slider,
.color-picker-wrapper.color-picker-horizontal .color-picker-panel .color-picker-grid-wrapper .color-picker-row .color-picker-opacity .color-picker-slider {
  width: 2px;
  height: 18px;
  margin-top: 0;
}

/*! angularjs-slider - v7.0.0 - 
 (c) Rafal Zajac <rzajac@gmail.com>, Valentin Hervieu <valentin@hervi.eu>, Jussi Saarivirta <jusasi@gmail.com>, Angelin Sirbu <angelin.sirbu@gmail.com> - 
 https://github.com/angular-slider/angularjs-slider - 
 2019-02-23 */
.rzslider {
    position: relative;
    display: inline-block;
    width: 100%;
    height: 2px;
    margin: 35px 0 15px 0;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    .rzslider.noanimate * {
        transition: none !important;
    }

    .rzslider.with-legend {
        margin-bottom: 40px;
    }

    .rzslider[disabled] {
        cursor: not-allowed;
    }

        .rzslider[disabled] .rz-pointer {
            cursor: not-allowed;
            background-color: #d8e0f3;
        }

        .rzslider[disabled] .rz-draggable {
            cursor: not-allowed;
        }

        .rzslider[disabled] .rz-selection {
            background: #8b91a2;
        }

        .rzslider[disabled] .rz-tick {
            cursor: not-allowed;
        }

            .rzslider[disabled] .rz-tick.rz-selected {
                background: #8b91a2;
            }

    .rzslider span {
        position: absolute;
        display: inline-block;
        white-space: nowrap;
    }

    .rzslider .rz-base {
        width: 100%;
        height: 100%;
        padding: 0;
    }

    .rzslider .rz-bar-wrapper {
        left: 0;
        z-index: 1;
        width: 100%;
        height: 32px;
        padding-top: 16px;
        margin-top: -16px;
        box-sizing: border-box;
        transition: all linear 0.3s;
    }

    .rzslider .rz-draggable {
        cursor: move;
    }

    .rzslider .rz-bar {
        left: 0;
        z-index: 1;
        width: 100%;
        height: 2px;
        background: #d8e0f3;
        border-radius: 2px;
    }

    .rzslider .rz-bar-wrapper.rz-transparent .rz-bar {
        background: transparent;
    }

    .rzslider .rz-bar-wrapper.rz-left-out-selection .rz-bar {
        background: #df002d;
    }

    .rzslider .rz-bar-wrapper.rz-right-out-selection .rz-bar {
        background: #03a688;
    }

    .rzslider .rz-selection {
        z-index: 2;
        background: #2F96B4;
        border-radius: 2px;
        transition: background-color linear 0.3s;
        outline-color: transparent;
    }

    .rzslider .rz-restricted {
        z-index: 3;
        background: #ff0000;
        border-radius: 2px;
    }

    .rzslider .rz-pointer {
        top: -7px;
        z-index: 3;
        width: 16px;
        height: 16px;
        cursor: pointer;
        background-color: #2F96B4;
        border-radius: 12px;
        transition: all linear 0.3s;
        outline-color: transparent;
    }

        /*.rzslider .rz-pointer:after {
  position: absolute;
  top: 12px;
  left: 12px;
  width: 8px;
  height: 8px;
  background: #ffffff;
  border-radius: 4px;
  content: '';
}*/

        .rzslider .rz-pointer:hover:after {
            background-color: #ffffff;
            outline-color: transparent;
        }

        .rzslider .rz-pointer.rz-active {
            z-index: 4;
            outline-color: transparent;
        }

    /*.rzslider .rz-pointer.rz-active:after {
  background-color: #451aff;
}*/

    .rzslider .rz-bubble {
        bottom: 16px;
        padding: 1px 3px;
        color: #777777;
        cursor: default;
        font-size: 11px;
        transition: all linear 0.3s;
    }

        .rzslider .rz-bubble.rz-limit {
            color: #55637d;
            font-size: 11px;
            transition: none;
        }

        .rzslider .rz-bubble.rz-ceil {
            color: #55637d;
            font-size: 11px;
            transition: none;
        }

        .rzslider .rz-bubble.rz-floor {
            color: #55637d;
            font-size: 11px;
            transition: none;
        }

    .rzslider .rz-ticks {
        position: absolute;
        top: -3px;
        left: 0;
        z-index: 1;
        width: 100%;
        height: 0;
        margin: 0;
        list-style: none;
        box-sizing: border-box;
    }

    .rzslider .rz-ticks-values-under .rz-tick-value {
        top: auto;
        bottom: -32px;
    }

    .rzslider .rz-tick {
        position: absolute;
        top: 0;
        left: 0;
        width: 10px;
        height: 10px;
        margin-left: 11px;
        text-align: center;
        cursor: pointer;
        background: #d8e0f3;
        border-radius: 50%;
        transition: background-color linear 0.3s;
    }

        .rzslider .rz-tick.rz-selected {
            background: #2F96B4;
        }

    .rzslider .rz-tick-value {
        position: absolute;
        top: -30px;
        transform: translate(-50%, 0);
    }

    .rzslider .rz-tick-legend {
        position: absolute;
        top: 24px;
        max-width: 50px;
        white-space: normal;
        transform: translate(-50%, 0);
    }

    .rzslider.rz-vertical {
        position: relative;
        width: 2px;
        height: 100%;
        padding: 0;
        margin: 0 20px;
        vertical-align: baseline;
    }

        .rzslider.rz-vertical .rz-base {
            width: 100%;
            height: 100%;
            padding: 0;
        }

        .rzslider.rz-vertical .rz-bar-wrapper {
            top: auto;
            left: 0;
            width: 32px;
            height: 100%;
            padding: 0 0 0 16px;
            margin: 0 0 0 -16px;
        }

        .rzslider.rz-vertical .rz-bar {
            bottom: 0;
            left: auto;
            width: 2px;
            height: 100%;
        }

        .rzslider.rz-vertical .rz-pointer {
            top: auto;
            bottom: 0;
            left: -14px; /*!important;*/
        }

        .rzslider.rz-vertical .rz-bubble {
            bottom: 0;
            left: 16px !important;
            margin-left: 3px;
        }

        .rzslider.rz-vertical .rz-ticks {
            top: 0;
            left: -3px;
            z-index: 1;
            width: 0;
            height: 100%;
        }

        .rzslider.rz-vertical .rz-tick {
            margin-top: 11px;
            margin-left: auto;
            vertical-align: middle;
        }

        .rzslider.rz-vertical .rz-tick-value {
            top: auto;
            left: 24px;
            transform: translate(0, -28%);
        }

        .rzslider.rz-vertical .rz-tick-legend {
            top: auto;
            right: 24px;
            max-width: none;
            white-space: nowrap;
            transform: translate(0, -28%);
        }

        .rzslider.rz-vertical .rz-ticks-values-under .rz-tick-value {
            right: 24px;
            bottom: auto;
            left: auto;
        }
/*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbInJ6c2xpZGVyLmNzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQTs7O2NBR2M7QUFDZDtFQUNFLG1CQUFtQjtFQUNuQixzQkFBc0I7RUFDdEIsWUFBWTtFQUNaLFlBQVk7RUFDWixzQkFBc0I7RUFDdEIsdUJBQXVCO0VBQ3ZCLDBCQUFrQjtLQUFsQix1QkFBa0I7TUFBbEIsc0JBQWtCO1VBQWxCLGtCQUFrQjtDQUNuQjs7QUFFRDtFQUNFLDRCQUE0QjtDQUM3Qjs7QUFFRDtFQUNFLG9CQUFvQjtDQUNyQjs7QUFFRDtFQUNFLG9CQUFvQjtDQUNyQjs7QUFFRDtFQUNFLG9CQUFvQjtFQUNwQiwwQkFBMEI7Q0FDM0I7O0FBRUQ7RUFDRSxvQkFBb0I7Q0FDckI7O0FBRUQ7RUFDRSxvQkFBb0I7Q0FDckI7O0FBRUQ7RUFDRSxvQkFBb0I7Q0FDckI7O0FBRUQ7RUFDRSxvQkFBb0I7Q0FDckI7O0FBRUQ7RUFDRSxtQkFBbUI7RUFDbkIsc0JBQXNCO0VBQ3RCLG9CQUFvQjtDQUNyQjs7QUFFRDtFQUNFLFlBQVk7RUFDWixhQUFhO0VBQ2IsV0FBVztDQUNaOztBQUVEO0VBQ0UsUUFBUTtFQUNSLFdBQVc7RUFDWCxZQUFZO0VBQ1osYUFBYTtFQUNiLGtCQUFrQjtFQUNsQixrQkFBa0I7RUFDbEIsdUJBQXVCO0VBQ3ZCLDRCQUE0QjtDQUM3Qjs7QUFFRDtFQUNFLGFBQWE7Q0FDZDs7QUFFRDtFQUNFLFFBQVE7RUFDUixXQUFXO0VBQ1gsWUFBWTtFQUNaLFlBQVk7RUFDWixvQkFBb0I7RUFHWixtQkFBbUI7Q0FDNUI7O0FBRUQ7RUFDRSx3QkFBd0I7Q0FDekI7O0FBRUQ7RUFDRSxvQkFBb0I7Q0FDckI7O0FBRUQ7RUFDRSxvQkFBb0I7Q0FDckI7O0FBRUQ7RUFDRSxXQUFXO0VBQ1gsb0JBQW9CO0VBR1osbUJBQW1CO0VBQzNCLHlDQUF5QztDQUMxQzs7QUFFRDtFQUNFLFdBQVc7RUFDWCxvQkFBb0I7RUFHWixtQkFBbUI7Q0FDNUI7O0FBRUQ7RUFDRSxXQUFXO0VBQ1gsV0FBVztFQUNYLFlBQVk7RUFDWixhQUFhO0VBQ2IsZ0JBQWdCO0VBQ2hCLDBCQUEwQjtFQUdsQixvQkFBb0I7RUFDNUIsNEJBQTRCO0NBQzdCOztBQUVEO0VBQ0UsbUJBQW1CO0VBQ25CLFVBQVU7RUFDVixXQUFXO0VBQ1gsV0FBVztFQUNYLFlBQVk7RUFDWixvQkFBb0I7RUFHWixtQkFBbUI7RUFDM0IsWUFBWTtDQUNiOztBQUVEO0VBQ0UsMEJBQTBCO0NBQzNCOztBQUVEO0VBQ0UsV0FBVztDQUNaOztBQUVEO0VBQ0UsMEJBQTBCO0NBQzNCOztBQUVEO0VBQ0UsYUFBYTtFQUNiLGlCQUFpQjtFQUNqQixlQUFlO0VBQ2YsZ0JBQWdCO0VBQ2hCLDRCQUE0QjtDQUM3Qjs7QUFFRDtFQUNFLGVBQWU7RUFDZixpQkFBaUI7Q0FDbEI7O0FBRUQ7RUFDRSxtQkFBbUI7RUFDbkIsVUFBVTtFQUNWLFFBQVE7RUFDUixXQUFXO0VBQ1gsWUFBWTtFQUNaLFVBQVU7RUFDVixVQUFVO0VBQ1YsaUJBQWlCO0VBQ2pCLHVCQUF1QjtDQUN4Qjs7QUFFRDtFQUNFLFVBQVU7RUFDVixjQUFjO0NBQ2Y7O0FBRUQ7RUFDRSxtQkFBbUI7RUFDbkIsT0FBTztFQUNQLFFBQVE7RUFDUixZQUFZO0VBQ1osYUFBYTtFQUNiLGtCQUFrQjtFQUNsQixtQkFBbUI7RUFDbkIsZ0JBQWdCO0VBQ2hCLG9CQUFvQjtFQUNwQixtQkFBbUI7RUFDbkIseUNBQXlDO0NBQzFDOztBQUVEO0VBQ0Usb0JBQW9CO0NBQ3JCOztBQUVEO0VBQ0UsbUJBQW1CO0VBQ25CLFdBQVc7RUFDWCw4QkFBOEI7Q0FDL0I7O0FBRUQ7RUFDRSxtQkFBbUI7RUFDbkIsVUFBVTtFQUNWLGdCQUFnQjtFQUNoQixvQkFBb0I7RUFDcEIsOEJBQThCO0NBQy9COztBQUVEO0VBQ0UsbUJBQW1CO0VBQ25CLFdBQVc7RUFDWCxhQUFhO0VBQ2IsV0FBVztFQUNYLGVBQWU7RUFDZix5QkFBeUI7Q0FDMUI7O0FBRUQ7RUFDRSxZQUFZO0VBQ1osYUFBYTtFQUNiLFdBQVc7Q0FDWjs7QUFFRDtFQUNFLFVBQVU7RUFDVixRQUFRO0VBQ1IsWUFBWTtFQUNaLGFBQWE7RUFDYixvQkFBb0I7RUFDcEIsb0JBQW9CO0NBQ3JCOztBQUVEO0VBQ0UsVUFBVTtFQUNWLFdBQVc7RUFDWCxXQUFXO0VBQ1gsYUFBYTtDQUNkOztBQUVEO0VBQ0UsVUFBVTtFQUNWLFVBQVU7RUFDVix1QkFBdUI7Q0FDeEI7O0FBRUQ7RUFDRSxVQUFVO0VBQ1Ysc0JBQXNCO0VBQ3RCLGlCQUFpQjtDQUNsQjs7QUFFRDtFQUNFLE9BQU87RUFDUCxXQUFXO0VBQ1gsV0FBVztFQUNYLFNBQVM7RUFDVCxhQUFhO0NBQ2Q7O0FBRUQ7RUFDRSxpQkFBaUI7RUFDakIsa0JBQWtCO0VBQ2xCLHVCQUF1QjtDQUN4Qjs7QUFFRDtFQUNFLFVBQVU7RUFDVixXQUFXO0VBQ1gsOEJBQThCO0NBQy9COztBQUVEO0VBQ0UsVUFBVTtFQUNWLFlBQVk7RUFDWixnQkFBZ0I7RUFDaEIsb0JBQW9CO0VBQ3BCLDhCQUE4QjtDQUMvQjs7QUFFRDtFQUNFLFlBQVk7RUFDWixhQUFhO0VBQ2IsV0FBVztDQUNaIiwiZmlsZSI6InJ6c2xpZGVyLmNzcyIsInNvdXJjZXNDb250ZW50IjpbIi8qISBhbmd1bGFyanMtc2xpZGVyIC0gdjcuMC4wIC0gXG4gKGMpIFJhZmFsIFphamFjIDxyemFqYWNAZ21haWwuY29tPiwgVmFsZW50aW4gSGVydmlldSA8dmFsZW50aW5AaGVydmkuZXU+LCBKdXNzaSBTYWFyaXZpcnRhIDxqdXNhc2lAZ21haWwuY29tPiwgQW5nZWxpbiBTaXJidSA8YW5nZWxpbi5zaXJidUBnbWFpbC5jb20+IC0gXG4gaHR0cHM6Ly9naXRodWIuY29tL2FuZ3VsYXItc2xpZGVyL2FuZ3VsYXJqcy1zbGlkZXIgLSBcbiAyMDE5LTAyLTIzICovXG4ucnpzbGlkZXIge1xuICBwb3NpdGlvbjogcmVsYXRpdmU7XG4gIGRpc3BsYXk6IGlubGluZS1ibG9jaztcbiAgd2lkdGg6IDEwMCU7XG4gIGhlaWdodDogNHB4O1xuICBtYXJnaW46IDM1cHggMCAxNXB4IDA7XG4gIHZlcnRpY2FsLWFsaWduOiBtaWRkbGU7XG4gIHVzZXItc2VsZWN0OiBub25lO1xufVxuXG4ucnpzbGlkZXIubm9hbmltYXRlICoge1xuICB0cmFuc2l0aW9uOiBub25lICFpbXBvcnRhbnQ7XG59XG5cbi5yenNsaWRlci53aXRoLWxlZ2VuZCB7XG4gIG1hcmdpbi1ib3R0b206IDQwcHg7XG59XG5cbi5yenNsaWRlcltkaXNhYmxlZF0ge1xuICBjdXJzb3I6IG5vdC1hbGxvd2VkO1xufVxuXG4ucnpzbGlkZXJbZGlzYWJsZWRdIC5yei1wb2ludGVyIHtcbiAgY3Vyc29yOiBub3QtYWxsb3dlZDtcbiAgYmFja2dyb3VuZC1jb2xvcjogI2Q4ZTBmMztcbn1cblxuLnJ6c2xpZGVyW2Rpc2FibGVkXSAucnotZHJhZ2dhYmxlIHtcbiAgY3Vyc29yOiBub3QtYWxsb3dlZDtcbn1cblxuLnJ6c2xpZGVyW2Rpc2FibGVkXSAucnotc2VsZWN0aW9uIHtcbiAgYmFja2dyb3VuZDogIzhiOTFhMjtcbn1cblxuLnJ6c2xpZGVyW2Rpc2FibGVkXSAucnotdGljayB7XG4gIGN1cnNvcjogbm90LWFsbG93ZWQ7XG59XG5cbi5yenNsaWRlcltkaXNhYmxlZF0gLnJ6LXRpY2sucnotc2VsZWN0ZWQge1xuICBiYWNrZ3JvdW5kOiAjOGI5MWEyO1xufVxuXG4ucnpzbGlkZXIgc3BhbiB7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgZGlzcGxheTogaW5saW5lLWJsb2NrO1xuICB3aGl0ZS1zcGFjZTogbm93cmFwO1xufVxuXG4ucnpzbGlkZXIgLnJ6LWJhc2Uge1xuICB3aWR0aDogMTAwJTtcbiAgaGVpZ2h0OiAxMDAlO1xuICBwYWRkaW5nOiAwO1xufVxuXG4ucnpzbGlkZXIgLnJ6LWJhci13cmFwcGVyIHtcbiAgbGVmdDogMDtcbiAgei1pbmRleDogMTtcbiAgd2lkdGg6IDEwMCU7XG4gIGhlaWdodDogMzJweDtcbiAgcGFkZGluZy10b3A6IDE2cHg7XG4gIG1hcmdpbi10b3A6IC0xNnB4O1xuICBib3gtc2l6aW5nOiBib3JkZXItYm94O1xuICB0cmFuc2l0aW9uOiBhbGwgbGluZWFyIDAuM3M7XG59XG5cbi5yenNsaWRlciAucnotZHJhZ2dhYmxlIHtcbiAgY3Vyc29yOiBtb3ZlO1xufVxuXG4ucnpzbGlkZXIgLnJ6LWJhciB7XG4gIGxlZnQ6IDA7XG4gIHotaW5kZXg6IDE7XG4gIHdpZHRoOiAxMDAlO1xuICBoZWlnaHQ6IDRweDtcbiAgYmFja2dyb3VuZDogI2Q4ZTBmMztcbiAgLXdlYmtpdC1ib3JkZXItcmFkaXVzOiAycHg7XG4gICAgIC1tb3otYm9yZGVyLXJhZGl1czogMnB4O1xuICAgICAgICAgIGJvcmRlci1yYWRpdXM6IDJweDtcbn1cblxuLnJ6c2xpZGVyIC5yei1iYXItd3JhcHBlci5yei10cmFuc3BhcmVudCAucnotYmFyIHtcbiAgYmFja2dyb3VuZDogdHJhbnNwYXJlbnQ7XG59XG5cbi5yenNsaWRlciAucnotYmFyLXdyYXBwZXIucnotbGVmdC1vdXQtc2VsZWN0aW9uIC5yei1iYXIge1xuICBiYWNrZ3JvdW5kOiAjZGYwMDJkO1xufVxuXG4ucnpzbGlkZXIgLnJ6LWJhci13cmFwcGVyLnJ6LXJpZ2h0LW91dC1zZWxlY3Rpb24gLnJ6LWJhciB7XG4gIGJhY2tncm91bmQ6ICMwM2E2ODg7XG59XG5cbi5yenNsaWRlciAucnotc2VsZWN0aW9uIHtcbiAgei1pbmRleDogMjtcbiAgYmFja2dyb3VuZDogIzBkYjlmMDtcbiAgLXdlYmtpdC1ib3JkZXItcmFkaXVzOiAycHg7XG4gICAgIC1tb3otYm9yZGVyLXJhZGl1czogMnB4O1xuICAgICAgICAgIGJvcmRlci1yYWRpdXM6IDJweDtcbiAgdHJhbnNpdGlvbjogYmFja2dyb3VuZC1jb2xvciBsaW5lYXIgMC4zcztcbn1cblxuLnJ6c2xpZGVyIC5yei1yZXN0cmljdGVkIHtcbiAgei1pbmRleDogMztcbiAgYmFja2dyb3VuZDogI2ZmMDAwMDtcbiAgLXdlYmtpdC1ib3JkZXItcmFkaXVzOiAycHg7XG4gICAgIC1tb3otYm9yZGVyLXJhZGl1czogMnB4O1xuICAgICAgICAgIGJvcmRlci1yYWRpdXM6IDJweDtcbn1cblxuLnJ6c2xpZGVyIC5yei1wb2ludGVyIHtcbiAgdG9wOiAtMTRweDtcbiAgei1pbmRleDogMztcbiAgd2lkdGg6IDMycHg7XG4gIGhlaWdodDogMzJweDtcbiAgY3Vyc29yOiBwb2ludGVyO1xuICBiYWNrZ3JvdW5kLWNvbG9yOiAjMGRiOWYwO1xuICAtd2Via2l0LWJvcmRlci1yYWRpdXM6IDE2cHg7XG4gICAgIC1tb3otYm9yZGVyLXJhZGl1czogMTZweDtcbiAgICAgICAgICBib3JkZXItcmFkaXVzOiAxNnB4O1xuICB0cmFuc2l0aW9uOiBhbGwgbGluZWFyIDAuM3M7XG59XG5cbi5yenNsaWRlciAucnotcG9pbnRlcjphZnRlciB7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgdG9wOiAxMnB4O1xuICBsZWZ0OiAxMnB4O1xuICB3aWR0aDogOHB4O1xuICBoZWlnaHQ6IDhweDtcbiAgYmFja2dyb3VuZDogI2ZmZmZmZjtcbiAgLXdlYmtpdC1ib3JkZXItcmFkaXVzOiA0cHg7XG4gICAgIC1tb3otYm9yZGVyLXJhZGl1czogNHB4O1xuICAgICAgICAgIGJvcmRlci1yYWRpdXM6IDRweDtcbiAgY29udGVudDogJyc7XG59XG5cbi5yenNsaWRlciAucnotcG9pbnRlcjpob3ZlcjphZnRlciB7XG4gIGJhY2tncm91bmQtY29sb3I6ICNmZmZmZmY7XG59XG5cbi5yenNsaWRlciAucnotcG9pbnRlci5yei1hY3RpdmUge1xuICB6LWluZGV4OiA0O1xufVxuXG4ucnpzbGlkZXIgLnJ6LXBvaW50ZXIucnotYWN0aXZlOmFmdGVyIHtcbiAgYmFja2dyb3VuZC1jb2xvcjogIzQ1MWFmZjtcbn1cblxuLnJ6c2xpZGVyIC5yei1idWJibGUge1xuICBib3R0b206IDE2cHg7XG4gIHBhZGRpbmc6IDFweCAzcHg7XG4gIGNvbG9yOiAjNTU2MzdkO1xuICBjdXJzb3I6IGRlZmF1bHQ7XG4gIHRyYW5zaXRpb246IGFsbCBsaW5lYXIgMC4zcztcbn1cblxuLnJ6c2xpZGVyIC5yei1idWJibGUucnotbGltaXQge1xuICBjb2xvcjogIzU1NjM3ZDtcbiAgdHJhbnNpdGlvbjogbm9uZTtcbn1cblxuLnJ6c2xpZGVyIC5yei10aWNrcyB7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgdG9wOiAtM3B4O1xuICBsZWZ0OiAwO1xuICB6LWluZGV4OiAxO1xuICB3aWR0aDogMTAwJTtcbiAgaGVpZ2h0OiAwO1xuICBtYXJnaW46IDA7XG4gIGxpc3Qtc3R5bGU6IG5vbmU7XG4gIGJveC1zaXppbmc6IGJvcmRlci1ib3g7XG59XG5cbi5yenNsaWRlciAucnotdGlja3MtdmFsdWVzLXVuZGVyIC5yei10aWNrLXZhbHVlIHtcbiAgdG9wOiBhdXRvO1xuICBib3R0b206IC0zMnB4O1xufVxuXG4ucnpzbGlkZXIgLnJ6LXRpY2sge1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIHRvcDogMDtcbiAgbGVmdDogMDtcbiAgd2lkdGg6IDEwcHg7XG4gIGhlaWdodDogMTBweDtcbiAgbWFyZ2luLWxlZnQ6IDExcHg7XG4gIHRleHQtYWxpZ246IGNlbnRlcjtcbiAgY3Vyc29yOiBwb2ludGVyO1xuICBiYWNrZ3JvdW5kOiAjZDhlMGYzO1xuICBib3JkZXItcmFkaXVzOiA1MCU7XG4gIHRyYW5zaXRpb246IGJhY2tncm91bmQtY29sb3IgbGluZWFyIDAuM3M7XG59XG5cbi5yenNsaWRlciAucnotdGljay5yei1zZWxlY3RlZCB7XG4gIGJhY2tncm91bmQ6ICMwZGI5ZjA7XG59XG5cbi5yenNsaWRlciAucnotdGljay12YWx1ZSB7XG4gIHBvc2l0aW9uOiBhYnNvbHV0ZTtcbiAgdG9wOiAtMzBweDtcbiAgdHJhbnNmb3JtOiB0cmFuc2xhdGUoLTUwJSwgMCk7XG59XG5cbi5yenNsaWRlciAucnotdGljay1sZWdlbmQge1xuICBwb3NpdGlvbjogYWJzb2x1dGU7XG4gIHRvcDogMjRweDtcbiAgbWF4LXdpZHRoOiA1MHB4O1xuICB3aGl0ZS1zcGFjZTogbm9ybWFsO1xuICB0cmFuc2Zvcm06IHRyYW5zbGF0ZSgtNTAlLCAwKTtcbn1cblxuLnJ6c2xpZGVyLnJ6LXZlcnRpY2FsIHtcbiAgcG9zaXRpb246IHJlbGF0aXZlO1xuICB3aWR0aDogNHB4O1xuICBoZWlnaHQ6IDEwMCU7XG4gIHBhZGRpbmc6IDA7XG4gIG1hcmdpbjogMCAyMHB4O1xuICB2ZXJ0aWNhbC1hbGlnbjogYmFzZWxpbmU7XG59XG5cbi5yenNsaWRlci5yei12ZXJ0aWNhbCAucnotYmFzZSB7XG4gIHdpZHRoOiAxMDAlO1xuICBoZWlnaHQ6IDEwMCU7XG4gIHBhZGRpbmc6IDA7XG59XG5cbi5yenNsaWRlci5yei12ZXJ0aWNhbCAucnotYmFyLXdyYXBwZXIge1xuICB0b3A6IGF1dG87XG4gIGxlZnQ6IDA7XG4gIHdpZHRoOiAzMnB4O1xuICBoZWlnaHQ6IDEwMCU7XG4gIHBhZGRpbmc6IDAgMCAwIDE2cHg7XG4gIG1hcmdpbjogMCAwIDAgLTE2cHg7XG59XG5cbi5yenNsaWRlci5yei12ZXJ0aWNhbCAucnotYmFyIHtcbiAgYm90dG9tOiAwO1xuICBsZWZ0OiBhdXRvO1xuICB3aWR0aDogNHB4O1xuICBoZWlnaHQ6IDEwMCU7XG59XG5cbi5yenNsaWRlci5yei12ZXJ0aWNhbCAucnotcG9pbnRlciB7XG4gIHRvcDogYXV0bztcbiAgYm90dG9tOiAwO1xuICBsZWZ0OiAtMTRweCAhaW1wb3J0YW50O1xufVxuXG4ucnpzbGlkZXIucnotdmVydGljYWwgLnJ6LWJ1YmJsZSB7XG4gIGJvdHRvbTogMDtcbiAgbGVmdDogMTZweCAhaW1wb3J0YW50O1xuICBtYXJnaW4tbGVmdDogM3B4O1xufVxuXG4ucnpzbGlkZXIucnotdmVydGljYWwgLnJ6LXRpY2tzIHtcbiAgdG9wOiAwO1xuICBsZWZ0OiAtM3B4O1xuICB6LWluZGV4OiAxO1xuICB3aWR0aDogMDtcbiAgaGVpZ2h0OiAxMDAlO1xufVxuXG4ucnpzbGlkZXIucnotdmVydGljYWwgLnJ6LXRpY2sge1xuICBtYXJnaW4tdG9wOiAxMXB4O1xuICBtYXJnaW4tbGVmdDogYXV0bztcbiAgdmVydGljYWwtYWxpZ246IG1pZGRsZTtcbn1cblxuLnJ6c2xpZGVyLnJ6LXZlcnRpY2FsIC5yei10aWNrLXZhbHVlIHtcbiAgdG9wOiBhdXRvO1xuICBsZWZ0OiAyNHB4O1xuICB0cmFuc2Zvcm06IHRyYW5zbGF0ZSgwLCAtMjglKTtcbn1cblxuLnJ6c2xpZGVyLnJ6LXZlcnRpY2FsIC5yei10aWNrLWxlZ2VuZCB7XG4gIHRvcDogYXV0bztcbiAgcmlnaHQ6IDI0cHg7XG4gIG1heC13aWR0aDogbm9uZTtcbiAgd2hpdGUtc3BhY2U6IG5vd3JhcDtcbiAgdHJhbnNmb3JtOiB0cmFuc2xhdGUoMCwgLTI4JSk7XG59XG5cbi5yenNsaWRlci5yei12ZXJ0aWNhbCAucnotdGlja3MtdmFsdWVzLXVuZGVyIC5yei10aWNrLXZhbHVlIHtcbiAgcmlnaHQ6IDI0cHg7XG4gIGJvdHRvbTogYXV0bztcbiAgbGVmdDogYXV0bztcbn0iXX0= */

.warning {
    margin-top: -5px;
    margin-bottom: 5px;
}

    .warning ul {
        margin-bottom: 0px !important;
        padding-left: 0px !important;
        list-style-type: none;
    }

.warning-item {
    background-color: #191919;
    padding-top: 10px;
    padding-left: 10px;
    height: 40px;
}

.warning-item-hidden {
    display: none;
    opacity: 0;
    height: 0px;
    padding-top: 0px;
    transition: height 0s .3s, padding-top 0s .3s, display 0s .3s, opacity .3s linear;
}

.warning-item .warning-icon {
    margin-top: -5px;
    width: 24px;
    height: 24px;
    cursor: default;
}

.warning-item .warning-text {
    color: white;
    font-size: 15px;
}

.warning-item .warning-view {
    color: #E52423;
    font-size: 15px;
    font-weight: bold;
    text-decoration: underline;
    text-decoration-color: #E52423;
    padding-left: 20px;
}

.warning-button-div {
    float: right;
}

    .warning-button-div .warning-right-button {
        color: white;
        font-size: 10px;
        font-weight: bold;
        padding-top: 3px;
    }

.warning-item .warning-right-button .warning-x {
    color: #E52423;
}



@media (max-width: 767px) {
    .warning-item {
        height: 30px;
        padding-top: 5px;
        padding-left: 5px;
    }

        .warning-item .warning-icon {
            height: 16px;
            width: 16px;
            margin-top: -2px;
        }

        .warning-item .warning-text {
            font-size: 11px;
        }

        .warning-item .warning-button-div .warning-right-button {
            font-size: 10px;
        }
}

@media (max-width: 480px) {

    .warning-item {
        height: 50px;
        padding-top: 5px;
        padding-left: 5px;
    }

        .warning-item .warning-icon {
            height: 16px;
            width: 16px;
            margin-top: -2px;
        }

        .warning-item .warning-text {
            font-size: 11px;
        }

        .warning-item .warning-view {
            font-size: 11px;
            float: right;
            padding-right: 10px;
        }

    .warning-button-div {
        float: left;
        padding-left: 20px
    }

    .warning-item .warning-button-div .warning-right-button {
        font-size: 10px;
    }
}

.rewardPromo {
    margin-left: 5px;
    margin-right: 5px;
    margin-bottom: 5px;
    background-color: #d1e7dd;
    padding-bottom: 10px;
    border-radius: 4px;
    display: flex;
}

    .rewardPromo .image {
        display: inline-block;
    }

        .rewardPromo .image > img {
            max-width: 100%;
            max-height: 100%;
            margin-top: 30px;
        }

.rewardPromo-button-div {
    padding-top: 8px;
}

    .rewardPromo-button-div .rewardPromo-right-button {
        font-size: 13px;
        font-weight: bold;
    }

.rewardBanner {
    margin-left: 5px;
    margin-right: 5px;
    margin-bottom: 5px;
    background-color: #d1e7dd;
    padding-bottom: 10px;
    border-radius: 4px;
    display: flex;
}

    .rewardBanner .image {
        display: inline-block;
    }

        .rewardBanner .image > img {
            max-width: 100%;
            max-height: 100%;
            margin-top: 30px;
        }

.rewardBanner-button-div {
    padding-top: 8px;
}

    .rewardBanner-button-div .rewardBanner-right-button {
        font-size: 13px;
        font-weight: bold;
    }

/*
@media (max-width: 767px) {
    .rewardPromo-item {
        height: 30px;
        padding-top: 5px;
        padding-left: 5px;
    }

        .rewardPromo-item .rewardPromo-text {
            font-size: 11px;
        }

        .rewardPromo-item .rewardPromo-button-div .rewardPromo-right-button {
            font-size: 10px;
        }
}

@media (max-width: 480px) {

    .rewardPromo-item {
        height: 50px;
        padding-top: 5px;
        padding-left: 5px;
    }

        .rewardPromo-item .rewardPromo-icon {
            height: 16px;
            width: 16px;
            margin-top: -2px;
        }

        .rewardPromo-item .rewardPromo-text {
            font-size: 11px;
        }

        .rewardPromo-item .rewardPromo-view {
            font-size: 11px;
            float: right;
            padding-right: 10px;
        }

    .rewardPromo-button-div {
        float: left;
        padding-left: 20px
    }

    .rewardPromo-item .rewardPromo-button-div .rewardPromo-right-button {
        font-size: 10px;
    }
}*/

:root {
    --pinc-oauth-ui-panel-bg-color: #fff;
    --pinc-oauth-ui-panel-text-color: #000;
    --pinc-oauth-ui-panel-light-text-color: #6c757d;
    --pinc-oauth-ui-panel-hover-bg-color: rgba(232, 232, 232, 0.6);
}

/* undo some of the changes that animate.css implements */
.mt-1.provider-description.text-sm {
    font-size: unset !important;
}

.text-sm.text-success.mr-2.d-flex.align-items-center.connected-info.py-1.d-flex {
    font-size: unset !important;
}

.a.hover-border.rounded.p-1.d-flex.align-items-center.tool-revoke.hover-opacity.text-sm {
    font-size: unset !important;
}

.btn.btn-sm.btn-connect.hover-scale.ml-3 {
    font-size: unset !important;
}

@keyframes fadeInRight {
    0%, 100% {
        opacity: unset !important;
        -webkit-transform: unset !important;
        transform: unset !important
    }
}

#WJphone {
  background: #fff;
  font-family: "Open Sans",sans-serif;
  font-size: 14px;
  box-sizing: border-box;
  position: fixed;
  right: 0;
  top: 30%;
  z-index: 10000;
  width: 260px;
  border-bottom-left-radius: 10px;
  border: 0;
  transition: 250ms
}

  #WJphone.phone-closed {
    margin-right: -260px
  }

  #WJphone #WJ-phone-opener {
    float: left;
    width: 25px;
    background: #fff;
    height: 25px;
    margin-left: -25px;
    border: 0;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    color: #000;
    cursor: pointer;
  }

    #WJphone #WJ-phone-opener svg {
      width: 19px;
      height: 19px;
      margin: 3px
    }

  #WJphone:focus {
    outline: 0
  }

  #WJphone .WJhidden {
    display: none !important
  }

  #WJphone .WJbtn {
    cursor: pointer;
    border-radius: .25rem;
    text-transform: uppercase;
    vertical-align: bottom;
    border: 0;
    font-weight: 500;
    padding: .625rem 1.5rem .5rem;
    font-size: 1rem;
    line-height: 1.5;
    display: inline-block;
    text-align: center;
    text-decoration: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    transition: color .15s;
    margin: 0;
    box-shadow: 0 4px 20px 0 rgba(0,0,0,.1);
    width: 100%
  }

  #WJphone .connection-status span, #WJphone .phone span.title {
    display: block;
    text-align: center
  }

  #WJphone .WJbtn.WJbtn-success {
    color: #fff;
    background-color: #00b74a
  }

    #WJphone .WJbtn.WJbtn-success:hover {
      background-color: #00913b
    }

  #WJphone .WJbtn.WJbtn-warning {
    color: #fff;
    background-color: #ffa900
  }

    #WJphone .WJbtn.WJbtn-warning:hover {
      background-color: #d99000
    }

  #WJphone .WJbtn.WJbtn-dark {
    color: #fff;
    background-color: #262626
  }

    #WJphone .WJbtn.WJbtn-dark:hover {
      background-color: #131313
    }

  #WJphone .connect {
    width: 250px;
    margin: 0 auto
  }

  #WJphone .call-button {
    opacity: 0;
    transition: 250ms;
    cursor: default
  }

    #WJphone .call-button.show {
      opacity: 1;
      cursor: pointer
    }

  #WJphone .connection-status span.not-configured {
    color: orange
  }

  #WJphone .connection-status span.disconnected {
    color: grey
  }

  #WJphone .connection-status span.connecting {
    color: orange
  }

  #WJphone .connection-status span.failed {
    color: red
  }

  #WJphone input {
    font-size: 20px;
    color: #d1d1d1;
    font-weight: 400
  }

    #WJphone input.number-input {
      width: 100%;
      height: 55px;
      line-height: 55px;
      text-align: center;
      padding: 0 20px;
      border-radius: 10px;
      border: 0;
      box-shadow: 0 0 17px -1px rgba(132,132,132,.15)
    }

      #WJphone input.number-input.valid {
        color: #000
      }

  #WJphone .phone {
    width: 250px;
    margin: -25px auto 0;
    position: relative
  }

    #WJphone .phone span.title {
      font-weight: 700;
      letter-spacing: 2px
    }

    #WJphone .phone .phone-container {
      width: 100%;
      margin-top: 30px
    }

      #WJphone .phone .phone-container .keyboard {
        width: 90%;
        margin-left: 5%;
        margin-top: 15px
      }

        #WJphone .phone .phone-container .keyboard .number {
          width: 100%;
          font-size: 0;
          text-align: center
        }

          #WJphone .phone .phone-container .keyboard .number.aling-right {
            text-align: right;
            width: 100%
          }

          #WJphone .phone .phone-container .keyboard .number span {
            font-size: 20px;
            color: #c5c5c5;
            display: inline-block;
            width: 33%;
            text-align: center;
            margin-bottom: 20px
          }

            #WJphone .phone .phone-container .keyboard .number span i {
              font-style: normal;
              display: inline-block;
              width: 65px;
              height: 65px;
              line-height: 65px;
              background: #f7f7f7;
              cursor: pointer;
              border-radius: 100%;
              transition: 250ms;
              -webkit-touch-callout: none;
              -webkit-user-select: none;
              -moz-user-select: none;
              -ms-user-select: none;
              user-select: none;
              box-shadow: 8px 8px 24px 0 rgba(132,132,132,.09)
            }

              #WJphone .phone .phone-container .keyboard .number span i.delete {
                background: 0 0;
                box-shadow: 0 0;
                -webkit-box-shadow: 0 0;
                -moz-box-shadow: 0 0;
                -ms-box-shadow: 0 0;
                color: #c5c5c5
              }

                #WJphone .phone .phone-container .keyboard .number span i.delete svg {
                  width: 60px;
                  height: 60px;
                  display: inline-block;
                  vertical-align: middle
                }

            #WJphone .phone .phone-container .keyboard .number span:hover i {
              color: #5e5e5e
            }

            #WJphone .phone .phone-container .keyboard .number span:active i {
              transform: translateY(1px);
              box-shadow: 5px 5px 16px 0 rgba(132,132,132,.18)
            }

              #WJphone .phone .phone-container .keyboard .number span:active i.delete {
                box-shadow: 0 0;
                -webkit-box-shadow: 0 0;
                -moz-box-shadow: 0 0;
                -ms-box-shadow: 0 0;
                transform: translateY(0)
              }

                #WJphone .phone .phone-container .keyboard .number span:active i.delete img {
                  transtiion: 250ms
                }

                #WJphone .phone .phone-container .keyboard .number span:active i.delete:active img {
                  transform: translateY(2px)
                }

  #WJphone .call-options {
    font-size: 11px;
    color: grey
  }

    #WJphone .call-options span {
      color: #262626;
      font-weight: 550;
      cursor: pointer
    }

      #WJphone .call-options span.call-recording {
        color: #f93154
      }

      #WJphone .call-options span.private-caller {
        color: grey
      }

    #WJphone .call-options .phone-recording {
      float: right
    }

  #WJphone .phone-mute-unmute {
    font-size: 11px;
    text-align: center;
    color: grey;
    font-weight: 550
  }

    #WJphone .phone-mute-unmute::after {
      content: " MUTE "
    }

    #WJphone .phone-mute-unmute.muted {
      -webkit-animation: blinkingText 1.2s infinite;
      animation: blinkingText 1.2s infinite
    }

      #WJphone .phone-mute-unmute.muted::after {
        content: " ! MUTED ! "
      }

  #WJphone .call-status {
    margin-top: -15;
    font-size: 11px;
    text-align: center;
    height: 18px
  }

@-webkit-keyframes blinkingText {
  0%,100%,49% {
    color: #ffa900
  }

  60%,99% {
    color: #f93154
  }
}

@keyframes blinkingText {
  0%,100%,49% {
    color: #ffa900
  }

  60%,99% {
    color: #f93154
  }
}

@font-face {
  font-family: 'autoplay';
  src:  url(/Content/fonts/autoplay.eot?5ej1z9);
  src:  url(/Content/fonts/autoplay.eot?5ej1z9#iefix) format('embedded-opentype'),
    url(/Content/fonts/autoplay.woff2?5ej1z9) format('woff2'),
    url(/Content/fonts/autoplay.ttf?5ej1z9) format('truetype'),
    url(/Content/fonts/autoplay.woff?5ej1z9) format('woff'),
    url(/Content/fonts/autoplay.svg?5ej1z9#autoplay) format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
}

.apicon {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'autoplay' !important;
  speak: never;
  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;
}

.apicon-lead-audio-profanity:before {
  content: "\ea5c";
}
.apicon-lead-audio-slang:before {
  content: "\ea5d";
}
.apicon-lead-audio-badattitude:before {
  content: "\ea5e";
}
.apicon-lead-audio-highrisk:before {
  content: "\ea5f";
}
.apicon-lead-audio-politeness:before {
  content: "\ea60";
}
.apicon-lead-audio-conduct:before {
  content: "\ea61";
}
.apicon-lead-audio-communication:before {
  content: "\ea62";
}
.apicon-lead-audio-talkmost:before {
  content: "\ea63";
}
.apicon-lead-audio-caller:before {
  content: "\ea64";
}
.apicon-lead-audio-agent:before {
  content: "\ea65";
}
.apicon-lead-origin-apsr:before {
  content: "\e9f7";
}
.apicon-lead-origin-vdp:before {
    content: "\ea7b";
}
.apicon-lead-origin-bulkimport:before {
  content: "\e9e2";
}
.apicon-lead-origin-website:before {
  content: "\e9da";
}
.apicon-lead-origin-desktop:before {
  content: "\e9db";
}
.apicon-lead-origin-ios:before {
  content: "\e9dc";
}
.apicon-lead-origin-dataapi:before {
  content: "\e9dd";
}
.apicon-lead-origin-leadapi:before {
  content: "\e9de";
}
.apicon-lead-origin-dms:before {
  content: "\e9df";
}
.apicon-lead-origin-email:before {
  content: "\e9e0";
}
.apicon-lead-origin-emdcrm:before {
  content: "\e9e1";
}
.apicon-testdrive-wizard:before {
  content: "\ea7a";
}
.apicon-menu_Failed_Login:before {
  content: "\e9c3";
}
.apicon-menu_Custom_Field:before {
  content: "\ea77";
}
.apicon-menu_Docusign:before {
  content: "\ea75";
}
.apicon-menu_Postcode:before {
  content: "\ea72";
}
.apicon-menu_Insurance:before {
  content: "\ea6f";
}
.apicon-menu_Phone:before {
  content: "\ea5a";
}
.apicon-menu_User_Locations:before {
  content: "\ea45";
}
.apicon-menu_Calendar:before {
  content: "\ea41";
}
.apicon-menu_Log:before {
  content: "\ea40";
}
.apicon-menu_Label:before {
  content: "\ea49";
}
.apicon-menu_TradeIn_Progress:before {
  content: "\ea34";
}
.apicon-menu_Rules:before {
  content: "\ea31";
}
.apicon-menu_Collaborator:before {
  content: "\ea2e";
}
.apicon-menu_CallScript:before {
  content: "\ea29";
}
.apicon-menu_Reports:before {
  content: "\ea23";
}
.apicon-menu_Jaguar:before {
  content: "\ea21";
}
.apicon-menu_TermsConditions:before {
  content: "\ea1a";
}
.apicon-menu_Fees:before {
  content: "\e9a2";
}
.apicon-menu_WebForm:before {
  content: "\ea13";
}
.apicon-menu_Workflow_Defaults:before {
  content: "\ea11";
}
.apicon-menu_Visitor_Book:before {
  content: "\ea0d";
}
.apicon-menu_SMS_Providers:before {
  content: "\ea0c";
}
.apicon-rewards:before {
  content: "\ea06";
}
.apicon-brake:before {
  content: "\ea03";
}
.apicon-menu_Support_Manual:before {
  content: "\ea02";
}
.apicon-menu_Special_Conditions:before {
  content: "\e9af";
}
.apicon-menu_Declarations:before {
  content: "\ea1f";
}
.apicon-menu_Workflow:before {
  content: "\e9f9";
}
.apicon-menu_Wholesaler:before {
  content: "\e9f2";
}
.apicon-menu_Wholesaler_Group:before {
  content: "\e9f3";
}
.apicon-menu_Privacy_Channels:before {
  content: "\e9ef";
}
.apicon-menu_Pending_Job:before {
  content: "\e9ec";
}
.apicon-menu_EC2_Instance:before {
  content: "\e9ed";
}
.apicon-menu_Email_Spam:before {
  content: "\e9eb";
}
.apicon-menu_IP_Range:before {
  content: "\e9e4";
}
.apicon-menu_OCR_Providers:before {
  content: "\e9e3";
}
.apicon-menu_Search:before {
  content: "\e9d7";
}
.apicon-menu_In_Market_Lead:before {
  content: "\e9d4";
}
.apicon-menu_Standard_Responses:before {
  content: "\e99e";
}
.apicon-menu_CMS_Template:before {
  content: "\e996";
}
.apicon-menu_Brand_Settings:before {
  content: "\e992";
}
.apicon-menu_Website_Templates:before {
  content: "\e993";
}
.apicon-menu_Website_Settings:before {
  content: "\e994";
}
.apicon-menu_CMS_Types:before {
  content: "\e995";
}
.apicon-menu_CMS_Content:before {
  content: "\e997";
}
.apicon-menu_Web_Admin_Settings:before {
  content: "\e998";
}
.apicon-menu_Email_Blacklist:before {
  content: "\e999";
}
.apicon-menu_Email_Modules:before {
  content: "\e99a";
}
.apicon-menu_Email_Templates:before {
  content: "\e99b";
}
.apicon-menu_Auto_Response:before {
  content: "\e99c";
}
.apicon-menu_Standard_Text:before {
  content: "\e99d";
}
.apicon-menu_Email_Settings:before {
  content: "\e99f";
}
.apicon-menu_Customer_Profile_Items:before {
  content: "\e9a0";
}
.apicon-menu_Customer_Profile_Groups:before {
  content: "\e9a1";
}
.apicon-menu_Form_Template:before {
  content: "\e9a3";
}
.apicon-menu_Special_Offer:before {
  content: "\e9a4";
}
.apicon-menu_Live_Lead_Filters:before {
  content: "\e9a5";
}
.apicon-menu_Live_Lead_Settings:before {
  content: "\e9a6";
}
.apicon-menu_Lead_Outcome:before {
  content: "\e9a7";
}
.apicon-menu_Lead_Progress:before {
  content: "\e9a8";
}
.apicon-menu_Lead_Campaigns:before {
  content: "\e9a9";
}
.apicon-menu_Lead_Sources:before {
  content: "\e98c";
}
.apicon-menu_User_KPI_Targets:before {
  content: "\e98d";
}
.apicon-menu_Yard_KPI_Targets:before {
  content: "\e98e";
}
.apicon-menu_Dealership_KPI_Targets:before {
  content: "\e98f";
}
.apicon-menu_Report_Dashboard:before {
  content: "\e990";
}
.apicon-menu_Lead_Management:before {
  content: "\e991";
}
.apicon-menu_Support:before {
  content: "\e985";
}
.apicon-menu_Studio_Admin:before {
  content: "\e986";
}
.apicon-menu_Back_Office:before {
  content: "\e987";
}
.apicon-menu_Production:before {
  content: "\e988";
}
.apicon-menu_Listing_Admin:before {
  content: "\e989";
}
.apicon-menu_Dealer_Groups:before {
  content: "\e98a";
}
.apicon-menu_Client_Admin:before {
  content: "\e98b";
}
.apicon-menu_Reset_User:before {
  content: "\e966";
}
.apicon-menu_Video_Management:before {
  content: "\e96b";
}
.apicon-menu_Applications:before {
  content: "\e96e";
}
.apicon-menu_Application_Update:before {
  content: "\e96f";
}
.apicon-menu_AWS:before {
  content: "\e984";
}
.apicon-menu_Listing_Export_Queue:before {
  content: "\e983";
}
.apicon-menu_Portals:before {
  content: "\e97e";
}
.apicon-menu_Lead_Exports:before {
  content: "\e97f";
}
.apicon-menu_Lead_Imports:before {
  content: "\e980";
}
.apicon-menu_Listing_Imports:before {
  content: "\e981";
}
.apicon-menu_Listing_Exports:before {
  content: "\e982";
}
.apicon-menu_Chevron:before {
  content: "\e97d";
}
.apicon-menu_Sales_Pipeline_Settings:before {
  content: "\e977";
}
.apicon-menu_Video_Template:before {
  content: "\e978";
}
.apicon-menu_Listing_Template:before {
  content: "\e979";
}
.apicon-menu_Image_Bank:before {
  content: "\e97a";
}
.apicon-menu_Listing_Settings:before {
  content: "\e97b";
}
.apicon-menu_API_Management:before {
  content: "\e97c";
}
.apicon-menu_Role_Management:before {
  content: "\e974";
}
.apicon-menu_Company_Settings:before {
  content: "\e975";
}
.apicon-menu_SSO_Settings:before {
  content: "\ea44";
}
.apicon-menu_Imports_Exports:before {
  content: "\e976";
}
.apicon-menu_Vehicle_Lookups:before {
  content: "\ea1d";
}
.apicon-failed-login:before {
  content: "\ea79";
}
.apicon-custom-field:before {
  content: "\ea78";
}
.apicon-sync:before {
  content: "\ea76";
}
.apicon-docusign:before {
  content: "\ea74";
}
.apicon-postcode:before {
  content: "\ea73";
}
.apicon-update-listing:before {
  content: "\ea71";
}
.apicon-spam:before {
  content: "\e9ae";
}
.apicon-insurance:before {
  content: "\ea70";
}
.apicon-rotate-left:before {
  content: "\ea6c";
}
.apicon-rotate-right:before {
  content: "\ea6d";
}
.apicon-circle:before {
  content: "\ea6b";
}
.apicon-reconditioning:before {
  content: "\ea6a";
}
.apicon-vehicle-history:before {
  content: "\e973";
}
.apicon-auction-online:before {
  content: "\ea68";
}
.apicon-home:before {
  content: "\ea66";
}
.apicon-sign-out:before {
  content: "\ea67";
}
.apicon-phone-out:before {
  content: "\ea5b";
}
.apicon-timer:before {
  content: "\ea56";
}
.apicon-outcome:before {
  content: "\ea57";
}
.apicon-sentiment:before {
  content: "\ea58";
}
.apicon-information:before {
  content: "\ea59";
}
.apicon-inactivity:before {
  content: "\ea55";
}
.apicon-stolen:before {
  content: "\ea53";
}
.apicon-crash:before {
  content: "\ea54";
}
.apicon-volume-up:before {
  content: "\ea50";
}
.apicon-volume-down:before {
  content: "\ea51";
}
.apicon-mute:before {
  content: "\ea52";
}
.apicon-phone-in:before {
  content: "\ea4f";
}
.apicon-email_licence:before {
  content: "\ea4e";
}
.apicon-addtogroup:before {
  content: "\ea4d";
}
.apicon-arrow-down:before {
  content: "\ea4b";
}
.apicon-arrow-up:before {
  content: "\ea4c";
}
.apicon-price-up:before {
  content: "\ea38";
}
.apicon-price-down:before {
  content: "\ea4a";
}
.apicon-location:before {
  content: "\ea46";
}
.apicon-autograb:before {
  content: "\ea42";
}
.apicon-holiday:before {
  content: "\ea3f";
}
.apicon-greencar:before {
  content: "\ea3e";
}
.apicon-invite:before {
  content: "\ea3a";
}
.apicon-invite-expired:before {
  content: "\ea3b";
}
.apicon-invite-pending:before {
  content: "\ea3c";
}
.apicon-invite-confirmed:before {
  content: "\ea3d";
}
.apicon-label:before {
  content: "\ea39";
}
.apicon-status-history:before {
  content: "\ea37";
}
.apicon-truck-trailer:before {
  content: "\ea36";
}
.apicon-contract:before {
  content: "\ea35";
}
.apicon-reminder:before {
  content: "\ea33";
}
.apicon-rules:before {
  content: "\ea32";
}
.apicon-preview:before {
  content: "\ea30";
}
.apicon-collaborator:before {
  content: "\ea2f";
}
.apicon-reveal:before {
  content: "\ea2d";
}
.apicon-portal:before {
  content: "\ea2c";
}
.apicon-ban:before {
  content: "\ea2b";
}
.apicon-callScript:before {
  content: "\ea2a";
}
.apicon-cloud:before {
  content: "\ea28";
}
.apicon-credit_card:before {
  content: "\ea27";
}
.apicon-padlock:before {
  content: "\ea26";
}
.apicon-kpi:before {
  content: "\ea25";
}
.apicon-business_hours:before {
  content: "\ea24";
}
.apicon-jaguar:before {
  content: "\ea22";
}
.apicon-dealers:before {
  content: "\ea20";
}
.apicon-authentication:before {
  content: "\ea1e";
}
.apicon-toyota:before {
  content: "\ea1c";
}
.apicon-html:before {
  content: "\ea1b";
}
.apicon-waiver:before {
  content: "\ea19";
}
.apicon-blackout:before {
  content: "\ea18";
}
.apicon-comment:before {
  content: "\ea16";
}
.apicon-fees:before {
  content: "\ea15";
}
.apicon-webform:before {
  content: "\ea14";
}
.apicon-csv:before {
  content: "\ea12";
}
.apicon-qrcode:before {
  content: "\ea0f";
}
.apicon-visitorbook:before {
  content: "\ea0e";
}
.apicon-clock:before {
  content: "\e9d3";
}
.apicon-covid:before {
  content: "\ea0b";
}
.apicon-appraisal_export:before {
  content: "\ea0a";
}
.apicon-Heart:before {
  content: "\ea08";
}
.apicon-email-unblock:before {
  content: "\ea09";
}
.apicon-multiplier:before {
  content: "\ea07";
}
.apicon-accessory:before {
  content: "\ea04";
}
.apicon-support_manual:before {
  content: "\ea01";
}
.apicon-filter:before {
  content: "\ea00";
}
.apicon-workflow:before {
  content: "\e9ff";
}
.apicon-phone_action:before {
  content: "\e9fd";
}
.apicon-sms_action:before {
  content: "\e9fe";
}
.apicon-account_manager:before {
  content: "\e9fc";
}
.apicon-merge-swap:before {
  content: "\e9fb";
}
.apicon-merge:before {
  content: "\e9fa";
}
.apicon-tyre:before {
  content: "\e9f8";
}
.apicon-sms-campaign:before {
  content: "\e9f6";
}
.apicon-wholesaler:before {
  content: "\e9f4";
}
.apicon-wholesaler_group:before {
  content: "\e9f5";
}
.apicon-anonymous:before {
  content: "\e9f0";
}
.apicon-privacy_enhanced:before {
  content: "\e9f1";
}
.apicon-compliance:before {
  content: "\e9ee";
}
.apicon-role-make:before {
  content: "\e9e7";
}
.apicon-role-yard:before {
  content: "\e9e8";
}
.apicon-role-manager:before {
  content: "\e9e9";
}
.apicon-role-user:before {
  content: "\e9ea";
}
.apicon-delay:before {
  content: "\e9e5";
}
.apicon-yard:before {
  content: "\e96d";
}
.apicon-in_market_lead:before {
  content: "\e9d5";
}
.apicon-email-test:before {
  content: "\e9d2";
}
.apicon-privacy:before {
  content: "\e9d1";
}
.apicon-email-reply:before {
  content: "\e90d";
}
.apicon-email:before {
  content: "\e9d0";
}
.apicon-save_standard_response:before {
  content: "\e9ce";
}
.apicon-load_standard_response:before {
  content: "\e9cf";
}
.apicon-module:before {
  content: "\e9cd";
}
.apicon-sms_email:before {
  content: "\e9cc";
}
.apicon-attachment_file:before {
  content: "\e9ca";
}
.apicon-upload:before {
  content: "\e9cb";
}
.apicon-attachment:before {
  content: "\e9c9";
}
.apicon-upload_template:before {
  content: "\e9c7";
}
.apicon-download_template:before {
  content: "\e9c8";
}
.apicon-cancel:before {
  content: "\e9d9";
}
.apicon-save:before {
  content: "\e9c6";
}
.apicon-close_lead:before {
  content: "\e9c5";
}
.apicon-reopen_lead:before {
  content: "\e9b1";
}
.apicon-close_lost:before {
  content: "\e9b2";
}
.apicon-close_won:before {
  content: "\e9c0";
}
.apicon-previous:before {
  content: "\e9c1";
}
.apicon-next:before {
  content: "\e9c2";
}
.apicon-error:before {
  content: "\e9bf";
}
.apicon-inbox:before {
  content: "\e9bd";
}
.apicon-outbox:before {
  content: "\e9be";
}
.apicon-delete_event:before {
  content: "\e9c4";
}
.apicon-calendar_history:before {
  content: "\e9ac";
}
.apicon-add_event:before {
  content: "\e9ad";
}
.apicon-calendar:before {
  content: "\e9bc";
}
.apicon-phone:before {
  content: "\e9bb";
}
.apicon-listings:before {
  content: "\e9ba";
}
.apicon-forms:before {
  content: "\e9b9";
}
.apicon-sms:before {
  content: "\e9b8";
}
.apicon-wishlist:before {
  content: "\e9b6";
}
.apicon-writeup:before {
  content: "\e9b7";
}
.apicon-edit:before {
  content: "\e9b5";
}
.apicon-promote:before {
  content: "\e9b4";
}
.apicon-demote:before {
  content: "\ea10";
}
.apicon-user:before {
  content: "\e95a";
}
.apicon-cart:before {
  content: "\e9b3";
}
.apicon-finance:before {
  content: "\ea05";
}
.apicon-financeInsurance:before {
  content: "\e9b0";
}
.apicon-progress:before {
  content: "\e9ab";
}
.apicon-newtab:before {
  content: "\e9aa";
}
.apicon-report:before {
  content: "\e967";
}
.apicon-notification:before {
  content: "\ea69";
}
.apicon-square:before {
  content: "\e972";
}
.apicon-blank:before {
  content: "\e9d8";
}
.apicon-add:before {
  content: "\e971";
}
.apicon-sortorder:before {
  content: "\e970";
}
.apicon-secondary-listing:before {
  content: "\e9d6";
}
.apicon-fleet-listings:before {
  content: "\ea43";
}
.apicon-trademe:before {
  content: "\e96c";
}
.apicon-users:before {
  content: "\e96a";
}
.apicon-external-link:before {
  content: "\e969";
}
.apicon-livelead:before {
  content: "\e95e";
}
.apicon-accept-listing:before {
  content: "\e95f";
}
.apicon-remove-listing:before {
  content: "\e960";
}
.apicon-service:before {
  content: "\e961";
}
.apicon-add-listing:before {
  content: "\e962";
}
.apicon-assistance:before {
  content: "\e963";
}
.apicon-email-campaign:before {
  content: "\e964";
}
.apicon-dashboard:before {
  content: "\e965";
}
.apicon-lead-allocate:before {
  content: "\e968";
}
.apicon-listing-settings:before {
  content: "\e95d";
}
.apicon-question:before {
  content: "\e95c";
}
.apicon-resetpassword:before {
  content: "\e95b";
}
.apicon-permission:before {
  content: "\e959";
}
.apicon-mandatory-fields:before {
  content: "\e957";
}
.apicon-settings:before {
  content: "\e958";
}
.apicon-email-setting:before {
  content: "\e956";
}
.apicon-cin:before {
  content: "\e955";
}
.apicon-removefromgroup:before {
  content: "\e954";
}
.apicon-contactgroups:before {
  content: "\e94f";
}
.apicon-communications:before {
  content: "\e953";
}
.apicon-activity:before {
  content: "\e952";
}
.apicon-prospect:before {
  content: "\e94d";
}
.apicon-appraisal:before {
  content: "\e94e";
}
.apicon-address:before {
  content: "\e950";
}
.apicon-notes:before {
  content: "\e951";
}
.apicon-selectall2:before {
  content: "\e94a";
}
.apicon-selectnone:before {
  content: "\e94b";
}
.apicon-selectmulti:before {
  content: "\e94c";
}
.apicon-history:before {
  content: "\e946";
}
.apicon-customerprofile:before {
  content: "\e947";
}
.apicon-emailhistory:before {
  content: "\e948";
}
.apicon-termsconditions:before {
  content: "\e945";
}
.apicon-signature:before {
  content: "\e944";
}
.apicon-secondcustomer:before {
  content: "\e943";
}
.apicon-stopwatch:before {
  content: "\e942";
}
.apicon-customer:before {
  content: "\e941";
}
.apicon-playvideo:before {
  content: "\e940";
}
.apicon-hidekeyboard:before {
  content: "\e93f";
}
.apicon-chequeredflag1:before {
  content: "\e93e";
}
.apicon-chequeredflag:before {
  content: "\e93d";
}
.apicon-noun_598033:before {
  content: "\e9e6";
}
.apicon-contact-search:before {
  content: "\e93c";
}
.apicon-licence:before {
  content: "\e93b";
}
.apicon-ellipsis:before {
  content: "\e93a";
}
.apicon-audio-stop:before {
  content: "\e92d";
}
.apicon-audio-pause:before {
  content: "\e934";
}
.apicon-audio-play:before {
  content: "\e935";
}
.apicon-audio-record:before {
  content: "\e936";
}
.apicon-recordaudio:before {
  content: "\e939";
}
.apicon-brandedaudio:before {
  content: "\e92e";
}
.apicon-downloadaudio:before {
  content: "\e937";
}
.apicon-uploadaudio:before {
  content: "\e938";
}
.apicon-delete:before {
  content: "\e90a";
}
.apicon-audio:before {
  content: "\e92b";
}
.apicon-deleteaudio:before {
  content: "\e92a";
}
.apicon-addaudio:before {
  content: "\e92c";
}
.apicon-exit:before {
  content: "\e931";
}
.apicon-takepicture:before {
  content: "\e932";
}
.apicon-switchcamera:before {
  content: "\e933";
}
.apicon-select:before {
  content: "\e930";
}
.apicon-selectall:before {
  content: "\e92f";
}
.apicon-script:before {
  content: "\e929";
}
.apicon-drivetrain:before {
  content: "\e927";
}
.apicon-dimensions:before {
  content: "\e928";
}
.apicon-deletevideo:before {
  content: "\e920";
}
.apicon-downloadvideo:before {
  content: "\e923";
}
.apicon-uploadvideo:before {
  content: "\e924";
}
.apicon-video:before {
  content: "\e925";
}
.apicon-addvideo:before {
  content: "\e926";
}
.apicon-imageaccept:before {
  content: "\e91b";
}
.apicon-imageedit:before {
  content: "\e91c";
}
.apicon-uploadimage:before {
  content: "\e91d";
}
.apicon-downloadimage:before {
  content: "\e91e";
}
.apicon-deleteimage:before {
  content: "\e91f";
}
.apicon-addimage:before {
  content: "\e921";
}
.apicon-image:before {
  content: "\e922";
}
.apicon-xml:before {
  content: "\e909";
}
.apicon-listing-search:before {
  content: "\e90c";
}
.apicon-testdrive:before {
  content: "\e918";
}
.apicon-listing:before {
  content: "\e919";
}
.apicon-audit:before {
  content: "\e91a";
}
.apicon-lead:before {
  content: "\e90e";
}
.apicon-webpreview:before {
  content: "\e917";
}
.apicon-windowcard:before {
  content: "\e916";
}
.apicon-autoplay-record:before {
  content: "\e915";
}
.apicon-features:before {
  content: "\e914";
}
.apicon-promotions:before {
  content: "\e910";
}
.apicon-features-comments:before {
  content: "\e911";
}
.apicon-general-info:before {
  content: "\e913";
}
.apicon-camera-roll:before {
  content: "\e90f";
}
.apicon-fuelpump:before {
  content: "\e90b";
}
.apicon-copy:before {
  content: "\e912";
}
.apicon-export:before {
  content: "\e907";
}
.apicon-import:before {
  content: "\e908";
}
.apicon-car-camera:before {
  content: "\e906";
}
.apicon-download:before {
  content: "\e905";
}
.apicon-filter-minus:before {
  content: "\e900";
}
.apicon-filter-clear:before {
  content: "\e901";
}
.apicon-filter-plus:before {
  content: "\e904";
}
.apicon-dollar:before {
  content: "\e902";
}
.apicon-engine:before {
  content: "\e903";
}
.apicon-roster:before {
  content: "\ea17";
}
.apicon-required:before {
  content: "\ea47";
}
.apicon-linked:before {
  content: "\ea48";
}
.apicon-carsafetywarning:before {
  content: "\e949";
}
.apicon-stocknumber:before {
  content: "\ea6e";
}

/* Shared layout styles for the in-app wizards (Test Drive + Trade In). Served through the main
   ~/bundles/css StyleBundle (was Views/Shared/_WizardStyles.cshtml). Test-Drive-only header/listing
   rules are scoped under .td-wizard-header--with-listing so they never affect the Trade In header. */

/* The app content wrapper runs a fadeInRight animation whose held transform creates a
   containing block that breaks position:fixed. Disable it on the wizard page only so the
   fixed footer anchors to the viewport. */
.layout-content-body {
    animation: none !important;
    -webkit-animation: none !important;
}

.td-wizard-header {
    border-bottom: 1px solid #e5e5e5;
    margin-bottom: 16px;
}

.td-wizard-header .multi-steps {
    counter-reset: stepNum;
    display: table;
    table-layout: fixed;
    width: 100%;
    padding: 1rem 10%;
    margin-bottom: 0;
    font-size: smaller;
}

.td-wizard-header .multi-steps > li {
    counter-increment: stepNum;
    text-align: center;
    display: table-cell;
    position: relative;
    color: #4F4F4F;
    z-index: 10;
    font-weight: 500;
}

    .td-wizard-header .multi-steps > li.cursor-pointer {
        cursor: pointer;
    }

    .td-wizard-header .multi-steps > li:before {
        content: counter(stepNum);
        display: block;
        margin: 0 auto 4px;
        background-color: #E52423;
        color: #fff;
        width: 24px;
        height: 24px;
        line-height: 22px;
        text-align: center;
        font-weight: bold;
        border: 1px solid #E52423;
        border-radius: 50%;
        z-index: 10;
        position: relative;
        font-size: 12px;
    }

    .td-wizard-header .multi-steps > li:after {
        content: "";
        height: 2px;
        width: 100%;
        background-color: #E52423;
        position: absolute;
        top: 11px;
        left: 50%;
        z-index: -1;
    }

    .td-wizard-header .multi-steps > li:last-child:after {
        display: none;
    }

    .td-wizard-header .multi-steps > li.is-active:before {
        background-color: #fff;
        border-color: #E52423;
        color: #E52423;
    }

    .td-wizard-header .multi-steps > li.is-active ~ li {
        color: #C4CED9;
    }

        .td-wizard-header .multi-steps > li.is-active ~ li:before {
            background-color: #fff;
            border-color: #C4CED9;
            color: #C4CED9;
        }

        .td-wizard-header .multi-steps > li.is-active ~ li:after {
            background-color: #C4CED9;
            z-index: 5;
        }

@media (max-width: 1180px) {
    .td-wizard-header .multi-steps {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 8px;
        padding: 1rem 0;
    }

        .td-wizard-header .multi-steps > li {
            display: flex;
            align-items: center;
            gap: 8px;
        }

            .td-wizard-header .multi-steps > li:before {
                margin: 0;
            }

            .td-wizard-header .multi-steps > li:after {
                width: auto;
            }

            .td-wizard-header .multi-steps > li label {
                display: none;
                margin: 0;
            }

            .td-wizard-header .multi-steps > li.is-active label {
                color: #E52423;
                font-weight: 600;
                display: block;
            }
}

@media (max-width: 479px) {
    .td-wizard-header .multi-steps > li {
        gap: 4px;
    }

        .td-wizard-header .multi-steps > li:before {
            display: flex;
            width: 28px;
            height: 28px;
            align-items: center;
            justify-content: center;
        }
}

/* body layout: step content (scrolls) + pinned footer, beside a full-height grey progress panel */
.td-wizard-body {
    display: flex;
    flex-direction: row;
    gap: 0;
    align-items: stretch;
    min-height: calc(100vh - 110px);
}

.td-wizard-main {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

.td-wizard-step-content {
    flex: 1 1 auto;
    padding: 0 1rem 90px 0;
}

/* light bordered panel used to give each wizard step section definition */
.wizard-panel {
    border: 1px solid #e5e5e5;
    border-radius: 6px;
    background-color: #fff;
    padding: 1.25rem 1.25rem 0.25rem;
    margin-bottom: 1.25rem;
}

    .wizard-panel > h4:first-child {
        margin-top: 0;
    }

/* Test Drive licence upload: full-width, fixed licence-card-ish proportions so the box height
   stays the same whether empty or showing the image; red trashcan delete overlay. */
.licence-upload .drop-box.listing {
    width: 100%;
    height: auto;
    aspect-ratio: 8.56 / 5;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.licence-upload-image {
    position: relative;
}

    .licence-upload-image > img {
        width: 100%;
        aspect-ratio: 8.56 / 5;
        object-fit: cover;
        display: block;
        border: 1px solid #e5e5e5;
        border-radius: 4px;
    }

    .licence-upload-image .licence-delete-overlay {
        position: absolute;
        top: 8px;
        right: 8px;
        z-index: 2;
        background-color: #E52423;
        color: #fff;
        border: none;
        border-radius: 4px;
        padding: 6px 10px;
        font-size: 18px;
        line-height: 1;
        opacity: 0.9;
    }

        .licence-upload-image .licence-delete-overlay:hover,
        .licence-upload-image .licence-delete-overlay:focus {
            background-color: #E52423;
            color: #fff;
            opacity: 1;
        }

/* footer fixed to the viewport bottom, spanning the full wizard content (main + grey sidebar),
   from the app menu (left) to the viewport edge (right).
   Skip sits on the left; Previous/Next on the right (justify-content: space-between).
   z-index sits below the app menu (.layout-sidebar is z-index 1000) so it never covers the menu scrollbar. */
.td-wizard-footer {
    position: fixed;
    bottom: 0;
    left: var(--sidebar-width, 220px); /* align to the app menu's right edge (see ds-reskin --sidebar-width) */
    right: 0;
    border-top: 1px solid #e5e5e5;
    background-color: #fff;
    padding: 12px 1.5rem;
    z-index: 999;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

    .layout-sidebar-collapsed .td-wizard-footer {
        left: 0;
    }

    /* hide the footer while a modal is open (parity with the shared .form-buttons behaviour) */
    .autoplay-modal-desktop-opened .td-wizard-footer,
    .autoplay-modal-mobile-opened .td-wizard-footer {
        visibility: hidden;
    }

    /* nudge Skip clear of the app nav panel on desktop */
    @media (min-width: 768px) {
        .td-wizard-footer-left {
            padding-left: 1.5rem;
        }
    }

@media (max-width: 767px) {
    .td-wizard-footer {
        left: 0;
    }
}

.td-wizard-sidebar {
    flex: 0 0 640px;
    width: 640px;
    background-color: #f0f0f0;
    padding: 1.25rem 1.25rem 90px;
}

    .td-wizard-sidebar .progress-step-content {
        padding: 0;
        background-color: transparent;
        border: none;
        box-shadow: none;
    }

    .td-wizard-sidebar .step-header {
        padding: 0 0 15px 0;
    }

    .td-wizard-sidebar .step-header-label {
        font-weight: 500;
        font-size: 16px;
    }

    .td-wizard-sidebar .progress-step-wrapper .card {
        margin-bottom: 1rem;
        border: 1px solid #e5e5e5;
        border-radius: 4px;
    }

    .td-wizard-sidebar .progress-step {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 12px;
    }

    .td-wizard-sidebar .progress-step-value {
        display: flex;
        align-items: center;
        width: 85%;
    }

    .td-wizard-sidebar .step-number {
        margin-right: 12px;
        border: 1.5px solid #E52423;
        border-radius: 999px;
        height: 25px;
        min-width: 25px;
        color: #E52423;
        font-weight: 500;
        display: flex;
        justify-content: center;
        align-items: center;
        align-self: flex-start;
    }

        .td-wizard-sidebar .step-number.complete {
            background-color: #E52423;
            color: #fff;
        }

        .td-wizard-sidebar .step-number.cursor-pointer {
            cursor: pointer;
        }

    .td-wizard-sidebar .title-step-number {
        display: flex;
        flex-direction: column;
    }

    .td-wizard-sidebar .step-title {
        font-weight: 600;
        color: #4F4F4F;
        margin: 0;
    }

    .td-wizard-sidebar .step-detail {
        color: #6F6F6F;
        font-weight: normal;
        margin: 0;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        word-break: break-word;
    }

    .td-wizard-sidebar .td-step-check {
        flex: 0 0 auto;
        width: 22px;
        height: 22px;
        border-radius: 999px;
        border: 1.5px solid #C4CED9;
        display: inline-block;
        position: relative;
    }

        /* completed: no circle/fill - just a subtle green tick */
        .td-wizard-sidebar .td-step-check.complete {
            background-color: transparent;
            border-color: transparent;
        }

            .td-wizard-sidebar .td-step-check.complete:after {
                content: "\2713";
                color: #5a9e5a;
                font-size: 17px;
                font-weight: 700;
                line-height: 1;
                position: absolute;
                top: 50%;
                left: 50%;
                transform: translate(-50%, -50%);
            }

/* hide the right-hand panel below the ESP breakpoint - the header stepper takes over */
@media (max-width: 1180px) {
    .td-wizard-sidebar {
        display: none;
    }

    .td-wizard-main {
        flex: 1 1 100%;
        width: 100%;
    }
}

/* Test Drive only: listing summary card shown beside the stepper in the header.
   Scoped to .td-wizard-header--with-listing so these rules never alter the Trade In header. */
.td-wizard-header--with-listing {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 1rem;
}

.td-wizard-header--with-listing .td-wizard-header-listing {
    flex: 0 0 auto;
    width: 360px;
    max-width: 40%;
}

    .td-wizard-header--with-listing .td-wizard-header-listing .card {
        margin-bottom: 0;
    }

    .td-wizard-header--with-listing .td-wizard-header-listing .listingText {
        font-size: 12px;
        line-height: 1.3;
        margin: 0;
    }

.td-wizard-header--with-listing > .multi-steps {
    flex: 1 1 auto;
}

@media (min-width: 1181px) {
    .td-wizard-header--with-listing .multi-steps {
        padding: 1rem 15%;
    }
}

@media (max-width: 1180px) {
    .td-wizard-header--with-listing .td-wizard-header-listing {
        display: none;
    }
}

/* ==========================================================================
   AutoPlay Design System reskin (POC)
   Looks-only override layer. Included LAST in ~/bundles/css so these rules win
   by source order at matching specificity. No markup/JS/backend changes.
   Token values mirror D:\craig\AutoPlay Design System\tokens\*.css
   ========================================================================== */

/* @import must precede all other rules. Design-system type families. */
@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@500;600;700;800;900&family=Barlow+Condensed:wght@600;700;800&family=Source+Sans+3:ital,wght@0,400;0,500;0,600;0,700;1,400&family=JetBrains+Mono:wght@400;500;700&display=swap');

:root {
    /* Brand red (accent / CTA only) */
    --ap-red: #DD2323;
    --ap-red-700: #B81C1C;
    --ap-red-800: #951616;
    --ap-red-100: #FCE3E3;
    --ap-red-050: #FEF2F2;
    --brand-primary: var(--ap-red);
    --brand-primary-700: var(--ap-red-700);
    --brand-primary-800: var(--ap-red-800);
    --brand-primary-100: var(--ap-red-100);
    --brand-primary-050: var(--ap-red-050);

    /* Dark chrome */
    --ap-shark: #202427;
    --ap-shark-800: #2A2F33;
    --ap-shark-700: #3A4046;
    --surface-chrome: var(--ap-shark);

    /* Ink scale */
    --ink-900: #16191B;
    --ink-800: #202427;
    --ink-700: #3A4046;
    --ink-600: #5A6066;
    --ink-500: #7A8087;
    --ink-400: #A1A6AB;
    --ink-300: #C8CCD0;
    --ink-200: #E2E5E8;
    --ink-150: #ECEEF0;
    --ink-100: #F4F5F6;
    --ink-050: #FAFAFB;
    --white: #FFFFFF;

    /* Semantic surfaces / text / borders */
    --surface-page: var(--ink-050);
    --surface-card: var(--white);
    --text-primary: var(--ink-900);
    --text-secondary: var(--ink-600);
    --text-placeholder: var(--ink-400);
    --text-link: #1A6FB5;
    --text-link-hover: #155A93;
    --border-default: var(--ink-200);
    --border-strong: var(--ink-300);

    /* Status palette */
    --status-open: #2E7D32;
    --status-lost: #B81C1C;
    --status-warning: #E08400;
    --status-info: #1A6FB5;
    --status-neutral: #5A6066;

    /* Constructive action (Edit) - DS success green as an action, with proper
       hover/pressed steps. Mirrors design system Button variant="edit". */
    --action-edit: #2E7D32;
    --action-edit-700: #25672A;
    --action-edit-800: #1C5121;

    /* Radii / elevation / focus ring */
    --radius-sm: 4px;
    --radius-md: 6px;
    --radius-lg: 10px;
    --radius-pill: 999px;
    --elevation-1: 0 1px 3px rgba(0,0,0,.10), 0 1px 2px rgba(0,0,0,.06);
    --elevation-2: 0 4px 12px rgba(0,0,0,.12);
    --ring-width: 3px;
    --ring-color: rgba(221,35,35,.40); /* 40% of --ap-red */

    /* Motion (DS micro/component timing + ease-out) */
    --motion-micro: 150ms;
    --motion-component: 200ms;
    --ease-out: cubic-bezier(0.16, 1, 0.3, 1);

    /* Type families */
    --font-display: 'Barlow', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --font-body: 'Source Sans 3', system-ui, -apple-system, 'Segoe UI', sans-serif;
    --font-mono: 'JetBrains Mono', ui-monospace, 'Consolas', monospace;
}

/* --------------------------------------------------------------------------
   Typography (applied without touching markup)
   -------------------------------------------------------------------------- */
body,
.modal,
.popover,
.tooltip {
    font-family: var(--font-body);
}

h1, h2, h3, h4, h5, h6,
.panel-title,
.navbar-brand {
    font-family: var(--font-display);
}

/* DS buttons use the body family at weight 600 (see components/forms/Button.jsx).
   Switch from --font-display to match; flip back to --font-display here if the
   Barlow button voice is preferred. */
.btn {
    font-family: var(--font-body);
    font-weight: 600;
}

.form-control,
input,
select,
textarea {
    font-family: var(--font-body);
}

code, kbd, pre, samp {
    font-family: var(--font-mono);
}

/* --------------------------------------------------------------------------
   Page surface
   -------------------------------------------------------------------------- */
body {
    background-color: var(--surface-page);
    color: var(--text-primary);
}

/* --------------------------------------------------------------------------
   Top bar -> white chrome (per design-system TopBar: white surface,
   ink-200 bottom border, ink text/icons, red reserved as an accent only).
   Dark chrome (--ap-shark) belongs to the Sidebar, not the header.
   -------------------------------------------------------------------------- */
.navbar-default {
    background-color: var(--white);
    /* No container border: it drew a line across the bottom of the dark logo
       block. The white strip's separator lives on .navbar-toggleable below. */
    border: none;
}

/* Logo block sits on dark chrome matching the sidebar (per ESP shell:
   the top-left corner is dark, the rest of the top bar is white).
   min-height fills the full 50px header so no white navbar shows below
   the logo (which would read as a border above the dark menu). */
.navbar-default .navbar-header {
    background-color: var(--ap-shark);
    min-height: 50px;
}

/* Left nav sidebar width. DS spec is 240px; widened here so the column, the
   content offset, the dark logo block and the sub-header search inset all track
   a single value (change here to resize the whole sidebar). */
:root {
    --sidebar-width: 290px;
    --sidebar-width-collapsed: 56px;
}

/* SPW: this is a full-page-reload MVC app, so app.sidebar.isCollapsed only
   gets its real value once AngularJS bootstraps and runs - before that, the
   sidebar/header/content paint at their plain, un-classed CSS width. Every
   navigation was visibly animating from that default width to the real one
   (elephant.css puts a `transition: width .3s` on these elements) - it only
   looks intentional on a user-triggered click. `no-transition` is hardcoded
   on <body> in the Razor markup so it's present for the very first paint,
   and app.js strips it (via $timeout) once the initial isCollapsed state has
   been applied, restoring the animation for actual toggle clicks. */
.no-transition,
.no-transition .layout-sidebar,
.no-transition .layout-sidebar-backdrop,
.no-transition .layout-content,
.no-transition .layout-footer,
.no-transition .navbar-header,
.no-transition .navbar-toggleable {
    transition: none !important;
}

/* Small DS app-icon mark shown in place of the wordmark when the sidebar is
   collapsed to a rail (see .layout-sidebar-collapsed .navbar-brand-icon
   below) - hidden the rest of the time. elephant.css's `.navbar-brand > img
   { display: block; }` outranks a bare .navbar-brand-icon selector (1 class
   vs. 1 class + 1 element), so match its specificity here to win the tie
   (ds-reskin.css loads after elephant.css). */
.navbar-brand > .navbar-brand-icon {
    display: none;
}

/* Dark logo block matches the sidebar column so the dark corner lines up above
   the dark menu. Scoped to the OPEN state so the app's .layout-sidebar-collapsed
   width:0 rules still win when the menu collapses. */
.layout-desktop .layout-sidebar-open .navbar-header {
    width: var(--sidebar-width);
}

.layout-desktop .layout-sidebar-open .navbar-toggleable {
    margin-left: var(--sidebar-width);
}

/* Sidebar column + content offset. 3-class selectors win over the app's
   open-state rules; the backdrop stays at the app default but never shows
   (sidebar is min-height:100vh on top of it). */
.layout-desktop .layout-sidebar-open .layout-sidebar {
    width: var(--sidebar-width);
}

.layout-desktop .layout-sidebar-open .layout-content {
    margin-left: var(--sidebar-width);
}

/* SPW: left-align the logo in the expanded sidebar per the DS Sidebar (its
   logo row uses padding "0 8px 0 20px" with justifyContent "space-between",
   not a centred logo) - overrides .navbar-brand-center's centring transform.
   Collapsed rail keeps centring (unchanged) since the DS also centres its
   logo row when collapsed (justifyContent: collapsed ? 'center' : ...). */
.layout-desktop .layout-sidebar-open .navbar-brand-center {
    /* .navbar-brand carries Bootstrap's default 15px left padding, so the
       anchor itself needs to sit 15px left of the DS's target 20px logo
       inset for the actual <img> to land at 20px - verified via
       getBoundingClientRect, not just this arithmetic. */
    left: 5px;
    transform: none;
}

/* Main header strip is painted red by autoplay-menu.css .navbar-toggleable.
   No bottom border here - it read as a line separating the logo/header from
   the menu below. */
.navbar-toggleable {
    background-color: var(--white);
}

.navbar-default .sidenav-toggler.collapsed {
    background-color: var(--white);
}

/* Brand sits on the dark logo block */
.navbar-default .navbar-brand,
.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus {
    color: var(--white);
    background-color: transparent;
}

.navbar-default .navbar-text {
    color: var(--text-primary);
}

.navbar-default .navbar-nav > li > a {
    color: var(--text-secondary);
}

.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
    color: var(--text-primary);
    background-color: var(--ink-100);
}

.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
    color: var(--ap-red);
    background-color: var(--ink-100);
}

.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
    background-color: var(--ink-100);
    color: var(--text-primary);
}

.navbar-default .navbar-link {
    color: var(--text-secondary);
}

.navbar-default .navbar-link:hover {
    color: var(--text-primary);
}

.navbar-default .btn-link {
    color: var(--text-secondary);
}

.navbar-default .btn-link:hover,
.navbar-default .btn-link:focus {
    color: var(--text-primary);
}

.navbar-default .navbar-toggle .icon-bar {
    background-color: var(--ink-700);
}

/* Static 3-line menu icon (replaces the old animated multi-bar hamburger,
   which drew incorrectly for a moment on every page load before Angular
   applied its collapsed/open class). Centred in the existing 50x50 button. */
.sidenav-toggler {
    display: flex;
    align-items: center;
    justify-content: center;
}

.sidenav-toggler-icon {
    color: var(--ink-700);
}

/* application.css pulls the button 15px left (margin-left:-15px) to tuck it
   under the desktop navbar-header's own padding - on the mobile header
   (white bar, no such padding) that leaves the icon flush against the
   screen edge. Give it normal breathing room on mobile only. */
.layout-mobile .sidenav-toggler {
    margin-left: 6px;
}

/* SPW: the button is a large (50x50) tap target for accessibility, but
   centering the 22px icon glyph inside it floats the icon ~20px from the
   screen edge - noticeably further right than the search bar/content below
   it. Left-align the glyph within its own tap target instead so it lines up
   with the search bar, same principle as .header-page-icon on desktop. */
.layout-mobile .sidenav-toggler {
    justify-content: flex-start;
}

/* SPW: desktop/tablet header page-icon (see HeaderController's "pageIcon"
   listener) - sits right after the collapse toggle (.header-collapse-toggle
   below), matching the DS TopBar's "leading" + pageIcon + title group
   (components/navigation/TopBar.jsx). */
.header-page-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 22px;
    height: 22px;
    font-size: 20px;
    line-height: 1;
    color: var(--ink-700);
    /* #navbar is a plain block, not flex, so this inline-flex box sits on its
       own baseline rather than lining up with .title-bar-title's first text
       line - nudge it up to the title's vertical centre. */
    position: relative;
    top: -5px;
}

/* DS Shell's TopBarCollapse (components/navigation/Sidebar.jsx via Shell.jsx) -
   the collapse toggle now sits in the white top bar, first in the [toggle]
   [page icon] [title] group, one control for both collapsed and expanded
   states (light tone, tuned for the white bar - unlike the dark-tone
   CollapseButton the sidebar itself would use). Mobile keeps its own
   independent header toggler (_Header.Mobile.cshtml). */
.header-collapse-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    padding: 0;
    margin-right: 8px;
    background: none;
    border: none;
    cursor: pointer;
    color: var(--ink-600);
    border-radius: var(--radius-md);
    vertical-align: middle;
    /* Leftmost element in the row now - matches the search bar below it
       (.navbar-collapse's search input), the same alignment .header-page-icon
       used to carry when it was first - measured empirically since #navbar is
       a plain block, not a flex/grid layout with a shared gutter to inherit
       from. Also nudges it up to the title's vertical centre, like the page
       icon above. */
    margin-left: -10px;
    /* Taller box (36px) than .header-page-icon (22px) sharing the same inline
       baseline start, so it needs a bigger upward nudge to land on the same
       vertical centre as the page icon/title - measured via
       getBoundingClientRect centre-Y comparison, not assumed from copying
       .header-page-icon's own -5px offset. */
    position: relative;
    top: -12px;
    transition: background var(--motion-micro) var(--ease-out), color var(--motion-micro) var(--ease-out);
}

.header-collapse-toggle .sidenav-toggler-icon {
    width: 18px;
    height: 18px;
    color: inherit;
}

.header-collapse-toggle:hover {
    color: var(--ink-900);
    background-color: var(--ink-100);
}

/* Sub-header toolbar was solid grey (#ddd); per design it is a white bar.
   Only a bottom border - its full-width fixed wrapper sits at y=50px behind
   the sidebar, so a top border would draw a line across under the logo. */
#greyHeader_subMenu {
    background-color: var(--white);
    border-bottom: 1px solid var(--border-default);
    height: 50px;
}

/* Content offset = header (50) + subheader (now 50) + buffer.
   Was 95px (40px subheader); bump so content isn't hidden / cramped. */
.layout-desktop .layout-main {
    padding-top: 105px;
}

/* getSubHeaderStyle() (JS, can't edit) sets margin-left:220 on the sub-header's
   left content, so the search field tucks under the widened menu. Re-sync to the
   sidebar width when the menu is open; the collapsed state clears the inline
   margin so this scoped rule simply doesn't apply. */
.layout-desktop .layout-sidebar-open #greyHeader_subMenu .greyHeader_subMenu_left {
    margin-left: var(--sidebar-width) !important;
}

.navbar-default .navbar-account-btn,
.navbar-default .navbar-account-btn:hover,
.navbar-default .navbar-account-btn:focus {
    color: var(--text-secondary);
}

.navbar-default .open .navbar-account-btn,
.navbar-default .open .user-account-btn:hover,
.navbar-default .open .user-account-btn:focus {
    background-color: var(--ink-100);
    color: var(--text-primary);
}

.navbar-default .navbar-search-toggler {
    color: var(--text-secondary);
}

.navbar-default .navbar-search-toggler:hover {
    background-color: var(--ink-100);
    color: var(--text-primary);
}

.navbar-default .navbar-search-adv-btn {
    color: var(--text-secondary);
}

/* Icons sitting on the white header take ink colour */
.navbar-default .apicon,
.navbar-default .navbar-nav .apicon {
    color: var(--ink-700);
}

/* Page title + user-info text were white for the old red bar; on the
   white header they must take ink colour or they vanish. The title also
   matches the design-system TopBar: Barlow display, 700, 20px. */
.navbar-default .title-bar-title {
    color: var(--text-primary);
    font-family: var(--font-display);
    font-weight: 700;
    font-size: 20px;
}

.navbar-default .title-bar-title .title-bar-subtitle {
    color: var(--text-secondary);
}

.navbar-default .white_text_dt_black_mb {
    color: var(--text-primary);
}

/* --------------------------------------------------------------------------
   Mobile header (<768px, layout-mobile / _Header.Mobile) -> WHITE bar, to
   match the design-system mobile TopBar (white surface, ink text/icons, red
   as an accent only). The desktop white-bar rules above are unscoped, so the
   ink title/subtitle/icons/account-button and ink-700 hamburger bars already
   apply on mobile; here we only repaint the three surfaces that the dark
   sidebar-chrome rules turned dark (.navbar-default, its .navbar-header logo
   block, and .navbar-toggleable) back to white, and recolour the logo.
   The logo stays centred on mobile (the left-align is .layout-desktop only),
   clear of the hamburger.
   -------------------------------------------------------------------------- */
.layout-mobile .navbar-default,
.layout-mobile .navbar-default .navbar-header,
.layout-mobile .navbar-toggleable {
    background-color: var(--white);
}

/* Bottom border so the white bar reads against white page content below */
.layout-mobile .navbar-default {
    border-bottom: 1px solid var(--border-default);
}

/* The header logo PNG is the WHITE wordmark (for the dark desktop logo block);
   on the white mobile bar it would be invisible. brightness(0) crushes every
   channel to 0, rendering it as a crisp solid-black silhouette of the mark. */
.layout-mobile .navbar-brand-logo {
    -webkit-filter: brightness(0);
    filter: brightness(0);
}

/* When the mobile menu opens the centred logo anchor overlays the (animating-
   out) page title; because the logo PNG is transparent the title shows through.
   Turn the anchor into a solid-white strip spanning from just past the 50px
   hamburger to the right edge, with the logo centred inside it, so it fully
   masks the title. The hamburger (left 0-50px) stays uncovered/clickable, and
   the avatar button is ng-if'd out while the menu is open so the right side is
   free. The anchor is already position:absolute (paints above the title). */
.layout-mobile .navbar-default .navbar-brand-center {
    left: 50px;
    right: 0;
    width: auto;
    -webkit-transform: none;
    -ms-transform: none;
    -o-transform: none;
    transform: none;
    background-color: var(--white);
    z-index: 2;
    display: -webkit-flex;
    display: flex;
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
}

/* Vertically centre the page title in the 50px bar so it lines up with the
   hamburger (left, 50px) and the account caret (right). The app positions the
   title with a manual margin-top on the inner block (14px single / 5px two-
   line, tuned for the old 15px title) which now reads slightly low; centre the
   whole title block via flex instead. !important is needed only to beat the
   element's inline `display:block`. Inner margin-tops are zeroed so they don't
   nudge it off-centre. */
.layout-mobile .navbar-default .title-bar-title {
    height: 50px;
    margin-top: 0;
    display: -webkit-flex !important;
    display: flex !important;
    -webkit-flex-direction: column;
    flex-direction: column;
    -webkit-justify-content: center;
    justify-content: center;
}

.layout-mobile .navbar-default .title-bar-title .title-bar-single-line,
.layout-mobile .navbar-default .title-bar-title .title-bar-two-lines {
    margin-top: 0;
}

/* SPW: the mobile header-page-icon (see _Header.Mobile.cshtml, matching the
   desktop [toggle][page icon][title] order from the DS TopBar) is inline-flex
   (base .header-page-icon rule), but .title-bar-title right after it is
   display:flex - a BLOCK box. An inline box can't share a line with a
   following block, so the icon was wrapping onto its own row above the title
   instead of sitting beside it. Float it alongside the toggler instead
   (same mechanism .sidenav-toggler already uses), matching its 50px-tall row
   so the icon centres the same way the title text does. */
.layout-mobile .header-page-icon {
    float: left;
    position: static;
    top: auto;
    height: 50px;
    /* Pulls the icon in from the toggler's generous 50px tap-target box so the
       gap after its glyph matches the desktop header's ~20px gap (measured via
       getBoundingClientRect) instead of the tap target's own right edge. */
    margin: 0 2px 0 -8px;
}

/* --------------------------------------------------------------------------
   Sidebar -> design-system dark chrome. The app sidebar was already dark but
   used off-palette near-blacks (#222 / #323232 / #191919, grey text) with no
   red active accent. Remap to the DS Sidebar: --ap-shark surface, ink text,
   --ap-shark-700 hover, active = --ap-shark-800 + 3px red bar + red icon.
   -------------------------------------------------------------------------- */
.layout-sidebar {
    background-color: var(--ap-shark);
    color: var(--ink-300);
}

/* SPW: the expanded nav element itself is the one surface the remap above
   missed - elephant.css's `nav.collapse.in { height:100%; background:#191919 }`
   kept the off-palette near-black. Because that rule pins the nav to 100% of the
   scroll container, the menu content overflows past the nav's box onto the
   --ap-shark container below it, so once the menu scrolls you see two darks (the
   #191919 nav vs the --ap-shark everything-else). Remap it to --ap-shark so the
   whole sidebar is one colour, flush with the header block above. nav.collapse.in
   is (0,2,1); this (0,3,1) outranks it (and ds-reskin loads after elephant). */
.layout-sidebar nav.sidenav-collapse.collapse {
    background-color: var(--ap-shark);
}

/* Reskin extra separation for the record edit screens - gated to >1366px only.
   The content body sits ~3px from the sidebar and the right screen edge, and the
   two accordion columns sit flush against each other. Above 1366px the columns
   are wide enough to spare the room, so add breathing room from the nav menu and
   screen edge (.layout-content-body) plus a gap between the two columns
   (.accordion-left/right). Left off below 1367px on purpose: narrowing the
   columns there crowds the fixed-width communications tables (see
   edit-communications-workflow.cshtml) on ~1024-1366px screens with the sidebar
   open. width:100% + global border-box means this eats inward, never overflows. */
@media (min-width: 1367px) {
    .layout-content-body {
        padding-left: 24px;
        padding-right: 24px;
    }
    .accordion-left { padding-right: 12px; }
    .accordion-right { padding-left: 12px; }
}

/* Level-1 = section grouping -> design-system group "eyebrow":
   Barlow Condensed, uppercase, letter-spaced, muted, no filled bar.
   Left padding (12px) is deliberately less than the item icons' 20px inset
   below, so the section icon sits further left - a visual outdent that
   marks it as the group header rather than another item in the list. */
.sidenav > li > a {
    background-color: transparent;
    color: var(--white);
    font-family: var(--font-condensed);
    font-weight: 700;
    font-size: 14px;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    padding: 16px 12px 6px 12px;
}

/* Section-header icon: sits inline before the eyebrow label, matching the
   20px size of the item icons below for visual consistency. */
.sidenav-icon-level1 {
    display: inline-block;
    width: 20px;
    height: 20px;
    line-height: 20px;
    font-size: 20px;
    margin-right: 10px;
    vertical-align: -4px;
    color: inherit;
}

/* autoplay-menu.css sets .sidenav-label to display:block at desktop widths
   (correct for level-2/3 rows, whose icons are float:left) - our level-1
   icon is inline-block, not floated, so a block-level label would wrap onto
   its own line underneath it. Keep the level-1 label inline instead. */
.sidenav > li > a .sidenav-label {
    display: inline;
}

.sidenav > li:hover > a,
.sidenav > li.hover > a {
    background-color: transparent;
    color: var(--white);
}

/* level1.active (see MenuController.updateMenuSelection) is true when the
   current page is this section or nested anywhere under it - shown red
   (text + icon, since .sidenav-icon-level1 inherits colour) whether
   collapsed to a rail or expanded, matching the DS's red-when-active
   header treatment. The specific selected item is additionally marked by
   the rail-line below when expanded. */
.sidenav > li.active > a {
    color: var(--ap-red);
}

/* elephant.css draws a small triangle pointer on .active level-1 items
   (a leftover from a feature that was never wired up - level1 never had an
   .active class until MenuController.updateMenuSelection started setting
   one for the red icon highlight above). Not wanted on section headers. */
.sidenav > li.active > a:after {
    display: none;
}

/* elephant.css also draws a FontAwesome caret (">") floated right on every
   expanded-mode section header with children. Not part of the DS's section
   header treatment (see Sidebar.jsx's NavItem - headers show only an icon,
   label, and optional ExpandCue count/chevron, never a bare static arrow) -
   suppressed in favour of the DS's own chevron cue (.sidenav-expand-cue
   below), which rotates to reflect open/closed instead of a static glyph. */
.sidenav > li.has-subnav > a:before {
    content: normal;
}

/* DS ExpandCue, cue="chevron" variant (components/navigation/Sidebar.jsx):
   a chevron-down that flips to point up when the section is open, so users
   can tell a section's state without needing to see its subnav render.
   Floats right like the FontAwesome caret it replaces, since .sidenav > li > a
   is an inline layout, not flex (see .sidenav-icon-level1 above). */
.sidenav-expand-cue {
    float: right;
    margin-top: 2px;
    color: inherit;
    transition: transform var(--motion-component) var(--ease-out);
}

.sidenav-expand-cue.open {
    transform: rotate(180deg);
}

/* SPW: slide section subnavs open/closed in pure CSS. The subnav <ul> only ever
   toggles Bootstrap's .collapse class (display:none) - which can't transition,
   hence today's instant snap - so for the sidenav ONLY, override that class to
   an animatable height and let the row interpolate to/from `auto`.
   interpolate-size is set on .sidenav (not :root) to keep keyword-height
   interpolation scoped to the menu; it lets height 0 <-> auto animate at the
   exact content height, so no fixed cap can clip a tall section. Browsers
   without interpolate-size support just fall back to today's instant show/hide
   - no animation, no breakage. 200ms/ease-out matches the chevron cue above so
   panel and cue move in step. Rail-collapsed mode is untouched: its
   `.sidenav-collapsed .sidenav-subnav { display:none !important }` outranks the
   plain `display:block` below. */
.sidenav {
    interpolate-size: allow-keywords;
}

.sidenav .sidenav-subnav {
    overflow: hidden;
    height: auto;
    transition: height var(--motion-component) var(--ease-out);
}

.sidenav .sidenav-subnav.collapse {
    display: block;
    height: 0;
}

.sidenav-heading {
    color: var(--ink-400);
}

/* Nav items (level 2/3) -> design-system NavItem: Source Sans 14/500,
   transparent until hover/active, inset rounded pill (radius-md), 12px gap.
   margin insets the pill; nested level-3 lands ~40px in via the icon margin.
   Vertical padding matches the DS ChildRow (8px top/bottom + ~2px gap via
   the 1px/1px margins below) - was 10px, reading noticeably looser. */
.sidenav-subnav > li > a {
    background-color: transparent;
    color: var(--ink-300);
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    padding: 8px 12px;
    margin: 1px 8px;
    border-radius: var(--radius-md);
}

/* Menu icons follow the item text colour (the global .apicon rule otherwise
   paints them the darker --ink-700). Active icons stay red (rule below). */
.layout-sidebar .apicon,
.layout-sidebar .sidenav-icon,
.layout-sidebar .sidenav2-icon {
    color: inherit;
}

/* Icon size (20px per design) + 12px gap to label. Matching the item
   line-height (below) to 20px keeps the icon and label vertically aligned. */
.layout-sidebar .sidenav-icon,
.layout-sidebar .sidenav2-icon {
    font-size: 20px;
    width: 20px;
    height: 20px;
    line-height: 20px;
    margin-right: 12px;
}

/* SPW: per-item icons only remain on the parentless bottom items (Device
   Info, Support Center, etc. - see _Menu.cshtml) now that nested menu items
   (level2/3) no longer show icons, matching the DS (only category headers +
   top-level leaves get icons, nested children never do). .sidenav-subnav >
   li > a's own `margin: 1px 8px` (above) shifts these 8px right of the
   section header icons' 12px inset - cancel it so the two icon columns
   line up. */
/* SPW: line the bottom-group icon column up with the level-1 section-header
   icons above. The header <a> sits ~5px left of the list (an intrinsic
   negative offset) so its 20px icon lands at x=7; the bottom <a> carries a
   +8px pill inset so, with the old -8px here, its icon landed at x=12 - 5px
   too far right. -13px pulls the icon box to x=7 to match (the glyph is
   centred in its 20px box, so it still sits inside the hover pill). The header
   icon is inline-block and picks up a ~2px whitespace gap before its label,
   whereas this one is float:left with none - a 14px (was 12px) right margin
   restores that gap so the labels line up too. */
.sidenav-bottom-padding > li > a .sidenav-icon {
    margin-left: -13px;
    margin-right: 14px;
}

/* SPW: set the parentless bottom group (Device Info, Support Center, Account
   Manager - see _Menu.cshtml) apart from the scrolling section list above it
   with a divider + breathing room, so it reads as a distinct footer group
   rather than running straight on from the last section. The divider is an
   inset ::before line (not a full-width border-top) so it stops short of the
   sidebar edges. Scoped to .layout-sidebar so it outranks application.css /
   autoplay-menu.css's bare .sidenav-bottom-padding rules (which only set
   padding-bottom). */
.layout-sidebar .sidenav-bottom-padding {
    position: relative;
    margin-top: 16px;
    padding-top: 16px;
}

.layout-sidebar .sidenav-bottom-padding::before {
    content: "";
    /* Force block: elephant.css's .sidenav-subnav:before clearfix sets
       display:table, which shrink-wraps an absolutely-positioned box to zero
       width so left/right can't stretch it and the line disappears. */
    display: block;
    position: absolute;
    top: 0;
    left: 12px;
    right: 12px;
    border-top: 1px solid var(--ap-shark-700);
}

/* SPW: removing level2/3 icons would otherwise pull their labels 32-52px
   left (the space the icon + its gap used to occupy) - replace that with
   padding so the text doesn't visually shift. Scoped to items nested under
   a section header (.has-subnav) so the still-iconed bottom items above are
   untouched. Values restore the old icon-box positions:
     level2: base inset(12) + icon(20) + gap(12) = 44
     level3: level2's 44 + elephant.css's old .sidenav2-icon margin-left(20) = 64 */
.has-subnav .sidenav-subnav > li > a {
    padding-left: 44px;
}

.has-subnav .sidenav-subnav .sidenav-subnav > li > a {
    padding-left: 64px;
}

/* SPW: an expandable level2 <li> wraps its own row's <a> AND the entire
   nested level3 <ul> below it, so the <li>'s bounding box (and therefore
   :hover, which is purely geometric) covers the whole nested subtree, not
   just its own row - hovering any nested child also matches the parent
   <li>'s :hover. Hover is tracked explicitly instead via ng-mouseenter/
   ng-mouseleave bound to each row's own <a> in _Menu.cshtml (the <a> is
   sized to just that row, never the nested list below it), toggling a
   .hover class per <a> - the two rules below neutralise the native :hover
   response entirely (this file's own prior rule, and elephant.css's
   separate colour-only one) so only the JS-driven .hover class on the <a>
   itself can ever trigger the highlight. */
.sidenav-subnav > li:hover > a {
    background-color: transparent;
    color: var(--ink-300);
}

.sidenav-subnav > li > a.hover {
    background-color: var(--ap-shark-700);
    color: var(--white);
}

.sidenav-subnav > li.open > a {
    color: var(--white);
}

/* Active item: darker surface, white label. */
.sidenav-subnav > li.active > a {
    background-color: var(--ap-shark-800);
    color: var(--white);
    font-weight: 600;
}

/* SPW: DS-style continuous "rail" guide line through nested items (replaces
   the old left-edge accent bar - see below). Each row draws its own
   full-height segment via ::after (the .a is position:relative, set in
   elephant.css), so stacked rows form one continuous line down the section;
   the active row's segment recolours red, identifying the selected item -
   see components/navigation/Sidebar.jsx's ChildRow "rail" nestGuide in the
   design system. left:19px centres it under the section header's own icon
   (.sidenav-icon-level1) - measured via getBoundingClientRect, not assumed
   from the padding maths, since the two elements sit in different offset
   parents (the header <a> vs. this nested <a>'s own margin box). */
.has-subnav .sidenav-subnav > li > a::after {
    content: "";
    position: absolute;
    left: 19px;
    /* Extend 1px past top/bottom to swallow the 1px vertical margin on
       either side (see .sidenav-subnav > li > a's margin: 1px 8px above) -
       otherwise each row's segment stops short of its neighbour's, leaving
       a visible 2px gap in what should read as one continuous line. */
    top: -1px;
    bottom: -1px;
    width: 2px;
    background-color: var(--ap-shark-700);
}

/* Sub-menu items (level3, e.g. under "EC2 Instances") keep the same rail
   x-position as their level2 parent rather than stepping further right -
   one continuous straight line down the whole section, not a staircase. */

.has-subnav .sidenav-subnav > li.active > a::after {
    background-color: var(--ap-red);
}

/* Sidebar search field */
.sidenav-form .form-control {
    background-color: var(--ap-shark-800);
    border: 1px solid var(--ap-shark-700);
    color: var(--ink-300);
}

/* Collapsed-mode flyout popouts */
.sidenav-collapsed .sidenav-subnav {
    background-color: var(--ap-shark-800);
}

.sidenav-collapsed .sidenav-subnav > li > a {
    border-left: 1px solid var(--ap-shark-700);
}

.sidenav-collapsed .sidenav-level1 {
    background-color: var(--ap-shark);
    color: var(--ink-400);
}

.sidenav-collapsed .active .sidenav-level1 {
    color: var(--white);
}

/* SPW: collapse to an icon rail (not width:0) on tablet + desktop when the
   hamburger toggles app.sidebar.isCollapsed. elephant.css/autoplay-menu.css
   collapse the sidebar to width:0 (fully hidden) at every breakpoint, and
   elephant.css's own icon-rail/hover-flyout behaviour (.sidenav-collapsed)
   only activates at >=768px. This overrides the width:0 rules and extends
   the icon-rail mechanics down to the app's tablet breakpoint (>480px, see
   autoplay-menu.css's "ipad" range). True mobile (<=480px) is untouched and
   keeps the original fully-hidden/full-overlay toggle (see app.js). */
@media (min-width: 481px) {
    .layout-desktop .layout-sidebar-collapsed .layout-sidebar,
    .layout-desktop .layout-sidebar-collapsed .layout-sidebar-backdrop {
        width: var(--sidebar-width-collapsed);
    }

    .layout-desktop .layout-sidebar-collapsed .layout-content,
    .layout-desktop .layout-sidebar-collapsed .layout-footer {
        margin-left: var(--sidebar-width-collapsed);
    }

    .layout-desktop .layout-sidebar-collapsed .navbar-header {
        width: var(--sidebar-width-collapsed);
        overflow: hidden;
    }

    /* Swap the full wordmark for the small DS app icon (guidelines/brand-app-
       icon.html, "dark bg / white ap" variant - its own #202427 fill matches
       --ap-shark, so it reads as just the white mark on the rail) rather than
       let the wordmark get clipped by the narrower rail. */
    .layout-desktop .layout-sidebar-collapsed .navbar-brand-logo {
        display: none;
    }

    .layout-desktop .layout-sidebar-collapsed .navbar-brand-icon {
        display: inline-block;
        width: 28px;
        height: 28px;
    }

    .layout-desktop .layout-sidebar-collapsed .navbar-toggleable {
        margin-left: var(--sidebar-width-collapsed);
    }

    /* SubHeaderController.getSubHeaderStyle() (JS) only sets an inline
       margin-left:220 when the sidebar is OPEN - it returns "" (no inline
       style at all) while collapsed, on the old assumption that collapsed
       meant a hidden, 0-width sidebar. Mirrors the .layout-sidebar-open
       rule above (~line 306) for the rail's real 56px width, so the
       sub-header search/filter bar doesn't render underneath the rail. */
    .layout-desktop .layout-sidebar-collapsed #greyHeader_subMenu .greyHeader_subMenu_left {
        margin-left: var(--sidebar-width-collapsed) !important;
    }

    /* autoplay-menu.css hides every level-1 <li> outright when both
       collapsed classes are present - harmless while the sidebar was
       width:0, but it would blank out the icon rail now that it has
       real width. Restore the base .sidenav > li display (elephant.css). */
    .layout-sidebar-collapsed .sidenav-collapsed > li {
        display: block;
    }

    /* Icon rail: just the section icons, no hover flyout of sub-items. */
    .sidenav-collapsed > li > a {
        display: flex;
        align-items: center;
        justify-content: center;
        height: 45px;
        line-height: 45px;
        padding: 0;
    }

    .sidenav-collapsed .sidenav-icon-level1 {
        margin-right: 0;
    }

    .sidenav-collapsed > li.has-subnav > a:before,
    .sidenav-collapsed > li:hover > a:after,
    .sidenav-collapsed > li.hover > a:after {
        content: normal;
    }

    .sidenav-collapsed .sidenav-label,
    .sidenav-collapsed .sidenav-expand-cue,
    .sidenav-collapsed .badge {
        display: none !important;
    }

    /* Sub-items stay hidden while collapsed - no hover-reveal flyout. */
    .sidenav-collapsed .sidenav-subnav {
        display: none !important;
    }

    /* elephant.css's own hover-flyout rule (`.sidenav-collapsed > .has-subnav:hover
       > .sidenav-subnav { display: block !important; }`) has higher specificity
       (4 classes vs. 2 above) so it still wins on :hover despite the rule above -
       this is what made hovering a collapsed section header look like it was
       expanding. Match its exact selector/specificity here so this file's later
       cascade position decides the tie. Collapsed sections only expand on click
       now (see MenuController.js / _Menu.cshtml ng-click), not hover. */
    .sidenav-collapsed > .has-subnav:hover > .sidenav-subnav,
    .sidenav-collapsed > .has-subnav.hover > .sidenav-subnav {
        display: none !important;
    }

    /* Icon rail shows section-header icons only - hide the static bottom
       block entirely (Device Info, Support Center, Contact Support,
       Account Manager) rather than let it render as its own icon list. */
    .sidenav-bottom-padding.sidenav-collapsed {
        display: none !important;
    }
}

/* SPW: the sidebar surface was remapped to --ap-shark above, but elephant.css
   still painted two other sidebar surfaces with the old off-palette near-black
   #191919 - the desktop backdrop behind the menu and the mobile menu panel - so
   the nav read as two different greys. Remap both to the single --ap-shark token.
   (Hover/active state colours --ap-shark-700/-800 are intentional and untouched.)
   ROLLBACK: delete this block to restore elephant.css's #191919. */
.layout-sidebar-backdrop,
.custom-scrollbar.mobile-menu {
    background-color: var(--ap-shark);
}

/* --------------------------------------------------------------------------
   Buttons (red accent CTAs + neutral default), DS radius
   -------------------------------------------------------------------------- */
.btn {
    border-radius: var(--radius-md);
    -webkit-transition: background-color var(--motion-micro) var(--ease-out), border-color var(--motion-micro) var(--ease-out), box-shadow var(--motion-micro) var(--ease-out);
    transition: background-color var(--motion-micro) var(--ease-out), border-color var(--motion-micro) var(--ease-out), box-shadow var(--motion-micro) var(--ease-out);
}

/* DS focus ring: brand outline only for keyboard focus (not mouse clicks), so
   buttons don't show a ring on every press. Replaces Bootstrap's grey outline. */
.btn:focus,
.btn.focus {
    outline: none;
}

.btn:focus-visible {
    outline: 2px solid var(--brand-primary);
    outline-offset: 2px;
}

.btn-autoplay,
.btn-autoplay:focus,
.btn-autoplay.focus,
.btn-autoplay:hover,
.btn-autoplay:active,
.btn-autoplay.active,
.open > .dropdown-toggle.btn-autoplay {
    background-color: var(--ap-red);
    border-color: var(--ap-red);
    color: var(--white);
}

.btn-autoplay:hover {
    background-color: var(--ap-red-700);
    border-color: var(--ap-red-700);
}

.btn-autoplay:active,
.btn-autoplay.active,
.open > .dropdown-toggle.btn-autoplay {
    background-color: var(--ap-red-800);
    border-color: var(--ap-red-800);
}

.btn-autoplay .badge {
    color: var(--ap-red);
    background-color: var(--white);
}

.btn-red-icon,
.btn-red-icon:focus,
.btn-red-icon.focus,
.btn-red-icon:active,
.btn-red-icon.active,
.open > .dropdown-toggle.btn-red-icon {
    background-color: var(--ap-red);
    border-color: var(--ap-red);
    color: var(--white);
}

.btn-red-icon:hover {
    background-color: var(--ap-red-700);
    border-color: var(--ap-red-700);
    color: var(--white);
}

.btn-primary,
.btn-primary:focus,
.btn-primary.focus {
    background-color: var(--ap-red);
    border-color: var(--ap-red);
    color: var(--white);
}

.btn-primary:hover,
.btn-primary:active,
.btn-primary.active,
.open > .btn-primary.dropdown-toggle {
    background-color: var(--ap-red-700);
    border-color: var(--ap-red-700);
    color: var(--white);
}

.btn-primary .badge {
    background-color: var(--white);
    color: var(--ap-red);
}

.btn-default {
    background-color: var(--white);
    border-color: var(--border-default);
    color: var(--ink-700);
}

.btn-default:hover,
.btn-default:active,
.btn-default.active,
.open > .btn-default.dropdown-toggle {
    background-color: var(--ink-100);
    border-color: var(--border-strong);
    color: var(--ink-900);
}

/* Link-style buttons -> DS ghost text colour */
.btn-link {
    color: var(--text-link);
}

.btn-link:hover,
.btn-link:focus {
    color: var(--text-link-hover);
}

/* Edit action -> DS constructive green (success). Defined in the design system
   as Button variant="edit" (components/forms/Button.jsx). */
.btn-edit,
.btn-edit:focus,
.btn-edit.focus {
    background-color: var(--action-edit);
    border-color: var(--action-edit);
    color: var(--white);
}

.btn-edit:hover {
    background-color: var(--action-edit-700);
    border-color: var(--action-edit-700);
    color: var(--white);
}

.btn-edit:active,
.btn-edit.active,
.open > .dropdown-toggle.btn-edit {
    background-color: var(--action-edit-800);
    border-color: var(--action-edit-800);
    color: var(--white);
}

/* Icons inside red buttons stay white */
.btn-autoplay .apicon,
.btn-red-icon .apicon,
.btn-edit .apicon {
    color: var(--white);
}

/* Cancel / dismiss buttons (.btn-grey across the app) -> DS "cancel" variant:
   white surface, dark-grey (ink-500) border, ink text. The app paints .btn-grey
   solid #888 and sets border:none on hover/focus/active (with !important on the
   hover background), so each state is mirrored with a full border + matching
   !important to win. */
.btn-grey,
.btn-grey:focus,
.btn-grey.focus {
    background-color: var(--white);
    border: 1px solid var(--ink-500);
    color: var(--ink-700);
}

.btn-grey:hover {
    background-color: var(--ink-100) !important;
    border: 1px solid var(--ink-500);
    color: var(--ink-900);
}

.btn-grey:active,
.btn-grey.active,
.open > .dropdown-toggle.btn-grey {
    background-color: var(--ink-150);
    border: 1px solid var(--ink-500);
    color: var(--ink-900);
}

/* Height parity: the reskin gives .btn-grey a 1px border that the solid-fill action buttons
   (.btn-autoplay / .btn-edit / .btn-white) don't carry, so .btn-grey renders 2px taller and its
   label ~1px lower - a Cancel then sits misaligned beside a Save. Trim .btn-grey's vertical padding
   by 1px so its own border replaces that space: box height and label position now match the
   borderless buttons. (base .btn = 6px -> 5px + 1px border = 6px inset; btn-sm = 5px -> 4px + 1px.) */
.btn-grey {
    padding-top: 5px;
    padding-bottom: 5px;
}

.btn-grey.btn-sm {
    padding-top: 4px;
    padding-bottom: 4px;
}

/* SPW: .btn-small / .btn-smaller are fixed-height (height:20px, padding:0) micro
   buttons (application.css). The .btn-grey padding-top/bottom:5px above out-orders
   their padding:0, so on a 20px border-box button the content box collapses to ~8px
   while the label keeps a ~20px line-height - the text spills over the bottom edge
   (seen on modal dialogs e.g. Select Yards). Restore zero vertical padding and centre
   the label within the 20px box minus the reskin's 1px .btn-grey border (18px). */
.btn-grey.btn-small,
.btn-grey.btn-smaller {
    padding-top: 0;
    padding-bottom: 0;
    line-height: 18px;
}

.btn-grey-icon-2:hover {
    color: var(--ap-red);
}

/* SPW: $ngConfirm dialogs apply a theme (e.g. ng-confirm-light/white/dark) whose
   button rule `.ng-confirm.ng-confirm-X .ng-confirm-box .ng-confirm-buttons button
   { color: white }` (confirm.css, specificity 0,4,1) out-specifies the .btn-grey
   cancel styling above, so dismiss buttons rendered white-text-on-white-surface.
   Re-assert the cancel variant on .btn-grey inside ng-confirm at matching
   specificity (reskin loads after confirm.css, so it wins on source order). */
.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-grey,
.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-grey:focus {
    background-color: var(--white);
    border: 1px solid var(--ink-500);
    color: var(--ink-700);
}

.ng-confirm .ng-confirm-box .ng-confirm-buttons button.btn-grey:hover {
    background-color: var(--ink-100);
    border: 1px solid var(--ink-500);
    color: var(--ink-900);
}

/* --------------------------------------------------------------------------
   Links -> design-system blue (red is accent-only)
   -------------------------------------------------------------------------- */
a {
    color: var(--text-link);
}

a:hover,
a:focus {
    color: var(--text-link-hover);
}

/* Accordion/panel headers are anchors; the generic a:hover above would turn the
   title link blue on hover. The base sets `.panel-title > a { color: inherit }`
   for the resting state only, so re-assert inherit on hover/focus - accordion
   titles keep their own colour and show no hover style. */
.panel-title a:hover,
.panel-title a:focus {
    color: inherit;
}

/* --------------------------------------------------------------------------
   Badges / labels (status palette + DS radii)
   -------------------------------------------------------------------------- */
.badge {
    background-color: var(--ap-red);
    border-radius: var(--radius-pill);
}

.label {
    border-radius: var(--radius-sm);
}

.label-default {
    background-color: var(--ink-600);
}

.label-primary {
    background-color: var(--ap-red);
}

.label-success {
    background-color: var(--status-open);
}

.label-info {
    background-color: var(--status-info);
}

.label-warning {
    background-color: var(--status-warning);
}

.label-danger {
    background-color: var(--status-lost);
}

/* --------------------------------------------------------------------------
   Brand-red roles (price + brand utility classes)
   -------------------------------------------------------------------------- */
.autoplayRed {
    color: var(--ap-red);
}

.bg-autoplayRed {
    background-color: var(--ap-red);
}

.listing-price,
.listing-price-cleanCarText,
.listing-price-exGst {
    color: var(--ap-red);
}

/* --------------------------------------------------------------------------
   Panels / cards / overlays (DS radius + elevation)
   -------------------------------------------------------------------------- */
.panel {
    background-color: var(--surface-card);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    box-shadow: var(--elevation-1);
}

/* DEV-678: .panel above loses to elephant.css .panel-group .panel { border-radius:
   4px } on specificity (0,2,0 beats 0,1,0), and uib-accordion always renders a
   .panel-group wrapper - so every accordion card in the app kept the legacy 4px
   while standalone panels took the DS radius, and the 10px .panel-heading below
   overhung the 4px card. Restated at matching specificity; this file loads after
   elephant.css, so it wins on order. */
.panel-group .panel {
    border-radius: var(--radius-lg);
}

.panel-heading {
    border-top-right-radius: var(--radius-lg);
    border-top-left-radius: var(--radius-lg);
}

.modal-content {
    border-radius: var(--radius-lg);
    box-shadow: var(--elevation-2);
    border: none;
}

.dropdown-menu {
    border-radius: var(--radius-md);
    box-shadow: var(--elevation-1);
    border: 1px solid var(--border-default);
}

/* --------------------------------------------------------------------------
   Form inputs (DS radius/border + red focus ring). Mirrors
   components/forms/Input.jsx, Select.jsx, Textarea.jsx.
   -------------------------------------------------------------------------- */
.form-control {
    background-color: var(--white);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    color: var(--text-primary);
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-transition: border-color var(--motion-micro) var(--ease-out), box-shadow var(--motion-micro) var(--ease-out);
    transition: border-color var(--motion-micro) var(--ease-out), box-shadow var(--motion-micro) var(--ease-out);
}

.form-control:focus {
    border-color: var(--brand-primary);
    outline: none;
    /* SPW: focus "glow" box-shadow removed per design feedback - the 3px red ring
       on every text box / select / textarea was unwanted. The border-colour change
       above is kept as the focus affordance. ROLLBACK: restore the ring with
       box-shadow: 0 0 0 var(--ring-width) var(--ring-color); */
    -webkit-box-shadow: none;
    box-shadow: none;
}

/* DS disabled field: muted surface, not Bootstrap's #eee */
.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control {
    background-color: var(--ink-100);
    color: var(--ink-500);
}

.form-control::-moz-placeholder { color: var(--text-placeholder); opacity: 1; }
.form-control:-ms-input-placeholder { color: var(--text-placeholder); }
.form-control::-webkit-input-placeholder { color: var(--text-placeholder); }

/* Field label (DS: body 13px / 600 / ink-700). Scoped to Bootstrap's explicit
   field-label class so checkbox/radio inline labels keep their normal weight. */
.control-label {
    font-family: var(--font-body);
    font-size: 13px;
    font-weight: 600;
    color: var(--ink-700);
}

/* Native single-selects get the DS chevron + appearance reset. Multi-selects
   and size>1 lists keep native rendering. */
select.form-control:not([multiple]) {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    padding-right: 32px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%237A8087' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 10px center;
    background-size: 16px 16px;
}

/* Hide IE's native select arrow so it doesn't double up with the DS chevron */
select.form-control:not([multiple])::-ms-expand {
    display: none;
}

/* Brand-colour native checkboxes & radios (DS fill). accent-color keeps the
   native control + behaviour intact - no appearance reset, so the app's
   custom-styled checkboxes are unaffected. */
input[type="checkbox"],
input[type="radio"] {
    accent-color: var(--brand-primary);
}

/* --------------------------------------------------------------------------
   Login panel (login.css uses !important on the brand red -> mirror it)
   -------------------------------------------------------------------------- */
.panel-autoPlay {
    border-color: var(--ap-shark) !important;
    border-radius: var(--radius-lg) !important;
    box-shadow: var(--elevation-2);
}

.panel-autoPlay > .panel-heading {
    background-color: var(--ap-shark) !important;
    border-color: var(--ap-shark) !important;
    color: var(--white);
}

.panel-autoPlay > .panel-heading + .panel-collapse .panel-body {
    border-top-color: var(--ap-shark) !important;
}

.panel-autoPlay > .panel-footer + .panel-collapse .panel-body {
    border-bottom-color: var(--ap-shark) !important;
}

/* --------------------------------------------------------------------------
   Icon recolour (family + .apicon-* glyph names untouched). Scoped to the
   chrome only - the header (.navbar-default .apicon) and menu
   (.layout-sidebar .apicon) are handled in their own sections above. A global
   .apicon colour would override button/other icons too (and broke some).
   Here we just cover the white sub-header bar so its icons read as ink.
   -------------------------------------------------------------------------- */
#greyHeader_subMenu .apicon {
    color: var(--ink-700);
}

/* --------------------------------------------------------------------------
   Filter controls (multi-select dropdowns + reset/clear-filters button).
   Legacy behaviour (multi-select.css): a filter button is dark-grey/white-text
   when idle, and flips to a light (transparent) surface with dark text while its
   dropdown is OPEN (.buttonSelected). Invert that pairing: light surface + ink
   text when idle, dark surface + white text while open. Covers <multi-select>
   and <multi-select-tristate> (both render class="multiSelect"). Wins by source
   order (ds-reskin is last in the bundle); !important only where the source rule
   uses it.
   -------------------------------------------------------------------------- */

/* Idle dropdown button -> light DS surface with ink text. */
.multiSelect > button {
    background-color: var(--white);
    border: 1px solid var(--border-default);
    color: var(--ink-700);
}

.multiSelect > button:hover {
    background-color: var(--ink-100);
    border-color: var(--border-strong);
    color: var(--ink-900);
}

/* Filter holds a value (has-selection, set by the widget on selection change) -> the same dark
   fill/white text as the open state, so it reads as "set" even when the dropdown is closed;
   empty filters stay white. Beats idle/hover. */
.multiSelect > button.has-selection {
    background-color: var(--ink-700);
    border-color: var(--ink-700);
    color: var(--white);
}

/* SPW-14610: re-assert the muted disabled treatment after .has-selection, which was winning on colour
   and leaving white text on the opaque white gradient multi-select.css paints when disabled. */
.multiSelect > button:disabled,
.multiSelect > button.has-selection:disabled {
    border-color: var(--border-default);
    color: var(--ink-500);
}

/* Open dropdown button (.buttonSelected) -> dark surface with white text.
   The source rule sets transparent/dark-text with !important, so match it. */
.multiSelect > .buttonSelected {
    background-color: var(--ink-700) !important;
    border-color: var(--ink-700);
    color: var(--white) !important;
}

/* Reset-filters / select-all icon buttons: invert to a light DS surface. The
   source rule re-asserts the dark fill on :focus/:active (higher specificity
   than the base), so those states are matched here to keep the inversion.
   inline-flex centres the inline Lucide SVG (the source rule's padding-top/
   font-size were tuned for the old icon-font glyph). The source .btn base
   rule's padding is 6px 12px, so padding-top: 0 alone left a 6px bottom
   padding with no matching top padding - that asymmetry pushed the
   flex-centred icon a few px above true centre. Zero padding-bottom too. */
.btn-clearfilters,
.btn-clearfilters:focus,
.btn-clearfilters.focus,
.btn-clearfilters:active,
.btn-clearfilters.active {
    background-color: var(--white);
    border: 1px solid var(--border-default);
    color: var(--ink-700);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding-top: 0;
    padding-bottom: 0;
}

.btn-clearfilters:hover {
    background-color: var(--ink-100) !important;
    border: 1px solid var(--border-strong);
    color: var(--ink-900);
}

/* --------------------------------------------------------------------------
   Validation errors: force red text (the summary renders errors as <a> tags,
   which would otherwise pick up the blue --text-link colour above)
   -------------------------------------------------------------------------- */
.validation-summary,
.validation-summary li,
.validation-summary a,
.validation-summary a:hover,
.validation-summary a:focus {
    color: var(--ap-red);
}

/* --------------------------------------------------------------------------
   Image / file upload dropzone: reskin the legacy red dashed box
   (application.css .drop-box) to a neutral grey dropzone consistent with the
   design system - thin dark-grey dashed border, light-grey fill, a shade
   darker on hover / drag-over.
   -------------------------------------------------------------------------- */
.drop-box {
    background: var(--ink-050);
    border: 1px dashed var(--ink-500);
    transition: background-color .12s ease, border-color .12s ease;
}

    .drop-box:hover {
        background: var(--ink-100);
    }

    .drop-box.dragover {
        border: 1px dashed var(--ink-600);
        background: var(--ink-100);
    }

/* --------------------------------------------------------------------------
   View-toggle segmented controls (Lead List/Swimlane, Listing List/Grid):
   centre the inline SVG + label by box so the icon lines up with the text,
   instead of the baseline `vertical-align:-2px` nudge in leadSwimlane.css /
   listingCard.css. Flex items ignore vertical-align, so this supersedes that
   hack; the existing `svg { margin-right:2px }` still supplies the icon gap.
   Matches the flex centring already used by .btn-clearfilters above.
   -------------------------------------------------------------------------- */
.lead-view-toolbar .btn-group .btn,
.listing-view-toolbar .btn-group .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1; /* collapse the text line box so the label centres with the icon (not top-aligned) */
}

    /* Source Sans 3 sits its glyph ink slightly high within the line box, so the label reads a touch
       above the (box-centred) icon. Nudge the icon up to meet the label's optical centre. */
    .lead-view-toolbar .btn-group .btn svg,
    .listing-view-toolbar .btn-group .btn svg {
        transform: translateY(-1px);
    }

/* Email/Phone/SMS action cards: at >=1200px application.css hides their label
   (.media-body visibility:hidden), so the icon sat left/right-of-centre. Collapse
   the hidden label and centre the icon badge in the card (Phone/SMS wrap theirs in
   a pull-right dropdown, so un-float that too). Below 1200px the label shows and the
   normal icon-left layout is kept. */
@media (min-width: 1200px) {
    .lead-actions .card-body .media {
        text-align: center;
    }

    .lead-actions .card-body .media-middle.media-body {
        display: none;
    }

    .lead-actions .card-body .media-left {
        display: inline-block;
        float: none;
        vertical-align: middle;
    }

    .lead-actions .card-body .media-left .list-inline.pull-right {
        float: none !important; /* .pull-right is float:right !important */
        margin-right: 0;
    }
}

/* DEV-678 (out-of-ticket): align the page header (#navbar) and sub-header
   (#greyHeader_subMenu) content to the same 24px left/right gutter that
   .layout-content-body uses above 1366px, so the leading/trailing header
   controls line up with the page content below them. Same >1366px gate as the
   .layout-content-body padding (~line 594): below it the content body has no
   inset, so the headers stay flush too. Placed at end-of-file so it wins the
   source-order tie against the collapsed-state margin rule in the min-width:481
   block above. */
@media (min-width: 1367px) {
    /* Top page header: #navbar shares .layout-content-body's box (starts at the
       sidebar edge, runs to the screen edge), so a 24px gutter lands its content
       on the same inset. Drop the leading toggle's -10px pull and the account
       menu's -15px push so the first/last controls sit exactly on the gutter. */
    #navbar {
        padding-left: 24px;
        padding-right: 24px;
    }
    #navbar .header-collapse-toggle {
        margin-left: 0;
    }
    #navbar .navbar-nav.navbar-right {
        margin-right: 0;
    }
    /* The account name (application.css .absolute_pos { right: 90px }) is
       anchored to .navbar-default, not the shifted menu <ul>, so nudge its
       right offset in by the same 24px (90px base + 24px gutter = 114px) to
       keep it clear of the avatar. If that base ever changes, update here. */
    #navbar .navbar-nav.navbar-right .absolute_pos {
        right: 114px;
    }

    /* Sub-header toolbar: neutralise its 5px left gutter and push the left group
       to sidebar-width + 24px (open) / collapsed-width + 24px so the search bar
       sits on the same inset as the content; a 24px right gutter insets the
       right-hand action group by the matching amount. */
    #greyHeader_subMenu {
        padding-left: 0;
        padding-right: 24px;
    }
    .layout-desktop .layout-sidebar-open #greyHeader_subMenu .greyHeader_subMenu_left {
        margin-left: calc(var(--sidebar-width) + 24px) !important;
    }
    .layout-desktop .layout-sidebar-collapsed #greyHeader_subMenu .greyHeader_subMenu_left {
        margin-left: calc(var(--sidebar-width-collapsed) + 24px) !important;
    }
}

/* ==========================================================================
   ds-menu-icons.css  -  POC menu-icon overlay (Option A)
   Swaps SPW sidebar icomoon glyphs for AutoPlay Design System (Lucide-style)
   icons using CSS mask-image, so they recolour via currentColor (ink default,
   white on hover, red when active) exactly like the font glyphs did.

   Also covers the level-1 section-header icons (.sidenav-icon-level1 in
   _Menu.cshtml) - same technique, just a handful of extra apicon-* classes
   (some newly minted purely for this overlay, e.g. apicon-menu_Sales_Pipeline,
   since there's no matching real icomoon glyph yet).

   Scoped to .layout-sidebar and .header-page-icon (the header's current-
   section icon, see HeaderController's "pageIcon") - the same .apicon-*
   classes elsewhere (subheader, buttons) keep the icon font.

   ROLLBACK: delete this file and remove its .Include() line in
   App_Start/BundleConfig.cs. Nothing else references it.

   LONG TERM: replace like-for-like by regenerating the icomoon font from the
   DS SVGs at the existing codepoints (see MAP below for intended pairings),
   then delete this overlay. Glyphs lifted from
   "AutoPlay Design System/ui_kits/esp/icons.jsx".
   ========================================================================== */

/* apicon-dashboard -> DS Grid */
.layout-sidebar .apicon-dashboard:before,
.header-page-icon.apicon-dashboard:before {
    content: "";
    display: block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='14' width='7' height='7' rx='1.5'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='14' width='7' height='7' rx='1.5'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* apicon-home -> DS Grid */
.layout-sidebar .apicon-home:before,
.header-page-icon.apicon-home:before {
    content: "";
    display: block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='14' width='7' height='7' rx='1.5'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1.5'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1.5'/%3E%3Crect x='14' y='14' width='7' height='7' rx='1.5'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* apicon-listings -> DS Car */
.layout-sidebar .apicon-listings:before,
.header-page-icon.apicon-listings:before {
    content: "";
    display: block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 17H3v-5l2-5h14l2 5v5h-2'/%3E%3Ccircle cx='7.5' cy='17' r='2'/%3E%3Ccircle cx='16.5' cy='17' r='2'/%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 17H3v-5l2-5h14l2 5v5h-2'/%3E%3Ccircle cx='7.5' cy='17' r='2'/%3E%3Ccircle cx='16.5' cy='17' r='2'/%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* apicon-listing -> DS Car */
.layout-sidebar .apicon-listing:before,
.header-page-icon.apicon-listing:before {
    content: "";
    display: block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 17H3v-5l2-5h14l2 5v5h-2'/%3E%3Ccircle cx='7.5' cy='17' r='2'/%3E%3Ccircle cx='16.5' cy='17' r='2'/%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 17H3v-5l2-5h14l2 5v5h-2'/%3E%3Ccircle cx='7.5' cy='17' r='2'/%3E%3Ccircle cx='16.5' cy='17' r='2'/%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* apicon-listing-search -> DS Car */
.layout-sidebar .apicon-listing-search:before,
.header-page-icon.apicon-listing-search:before {
    content: "";
    display: block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 17H3v-5l2-5h14l2 5v5h-2'/%3E%3Ccircle cx='7.5' cy='17' r='2'/%3E%3Ccircle cx='16.5' cy='17' r='2'/%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 17H3v-5l2-5h14l2 5v5h-2'/%3E%3Ccircle cx='7.5' cy='17' r='2'/%3E%3Ccircle cx='16.5' cy='17' r='2'/%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* apicon-lead -> DS Funnel */
.layout-sidebar .apicon-lead:before,
.header-page-icon.apicon-lead:before {
    content: "";
    display: block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4h18l-7 9v6l-4 2v-8z'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 4h18l-7 9v6l-4 2v-8z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* apicon-contactgroups -> DS Contacts */
.layout-sidebar .apicon-contactgroups:before,
.header-page-icon.apicon-contactgroups:before {
    content: "";
    display: block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='2'/%3E%3Ccircle cx='9' cy='10' r='2.4'/%3E%3Cpath d='M5.5 16.5a4 4 0 017 0M15 9h4M15 13h4'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='2'/%3E%3Ccircle cx='9' cy='10' r='2.4'/%3E%3Cpath d='M5.5 16.5a4 4 0 017 0M15 9h4M15 13h4'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* apicon-customer -> DS Contacts */
.layout-sidebar .apicon-customer:before,
.header-page-icon.apicon-customer:before {
    content: "";
    display: block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='2'/%3E%3Ccircle cx='9' cy='10' r='2.4'/%3E%3Cpath d='M5.5 16.5a4 4 0 017 0M15 9h4M15 13h4'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='2'/%3E%3Ccircle cx='9' cy='10' r='2.4'/%3E%3Cpath d='M5.5 16.5a4 4 0 017 0M15 9h4M15 13h4'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* apicon-customerprofile -> DS Contacts */
.layout-sidebar .apicon-customerprofile:before,
.header-page-icon.apicon-customerprofile:before {
    content: "";
    display: block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='2'/%3E%3Ccircle cx='9' cy='10' r='2.4'/%3E%3Cpath d='M5.5 16.5a4 4 0 017 0M15 9h4M15 13h4'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='2'/%3E%3Ccircle cx='9' cy='10' r='2.4'/%3E%3Cpath d='M5.5 16.5a4 4 0 017 0M15 9h4M15 13h4'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* apicon-contact-search -> DS Contacts */
.layout-sidebar .apicon-contact-search:before,
.header-page-icon.apicon-contact-search:before {
    content: "";
    display: block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='2'/%3E%3Ccircle cx='9' cy='10' r='2.4'/%3E%3Cpath d='M5.5 16.5a4 4 0 017 0M15 9h4M15 13h4'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='16' rx='2'/%3E%3Ccircle cx='9' cy='10' r='2.4'/%3E%3Cpath d='M5.5 16.5a4 4 0 017 0M15 9h4M15 13h4'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* apicon-communications -> DS Chat */
.layout-sidebar .apicon-communications:before,
.header-page-icon.apicon-communications:before {
    content: "";
    display: block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 11.5a8.4 8.4 0 01-9 8.4L4 21l1.1-3.2A8.4 8.4 0 1121 11.5z'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 11.5a8.4 8.4 0 01-9 8.4L4 21l1.1-3.2A8.4 8.4 0 1121 11.5z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* apicon-report -> DS Chart */
.layout-sidebar .apicon-report:before,
.header-page-icon.apicon-report:before {
    content: "";
    display: block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 3v18h18'/%3E%3Cpath d='M7 14l3-4 3 3 4-6'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 3v18h18'/%3E%3Cpath d='M7 14l3-4 3 3 4-6'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* apicon-calendar -> DS Calendar */
.layout-sidebar .apicon-calendar:before,
.header-page-icon.apicon-calendar:before {
    content: "";
    display: block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cpath d='M16 2v4M8 2v4M3 10h18'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* apicon-settings -> DS Gear */
.layout-sidebar .apicon-settings:before,
.header-page-icon.apicon-settings:before {
    content: "";
    display: block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M19.4 15a1.6 1.6 0 00.3 1.8l.1.1a2 2 0 11-2.8 2.8l-.1-.1a1.6 1.6 0 00-2.7 1.1V21a2 2 0 11-4 0v-.1A1.6 1.6 0 005.6 19l-.1.1a2 2 0 11-2.8-2.8l.1-.1A1.6 1.6 0 003 12.6a2 2 0 110-4h.1A1.6 1.6 0 005 5.6l-.1-.1a2 2 0 112.8-2.8l.1.1A1.6 1.6 0 0010.6 3a2 2 0 014 0v.1A1.6 1.6 0 0019 5l.1-.1a2 2 0 112.8 2.8l-.1.1a1.6 1.6 0 001.1 2.7H21a2 2 0 010 4z'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M19.4 15a1.6 1.6 0 00.3 1.8l.1.1a2 2 0 11-2.8 2.8l-.1-.1a1.6 1.6 0 00-2.7 1.1V21a2 2 0 11-4 0v-.1A1.6 1.6 0 005.6 19l-.1.1a2 2 0 11-2.8-2.8l.1-.1A1.6 1.6 0 003 12.6a2 2 0 110-4h.1A1.6 1.6 0 005 5.6l-.1-.1a2 2 0 112.8-2.8l.1.1A1.6 1.6 0 0010.6 3a2 2 0 014 0v.1A1.6 1.6 0 0019 5l.1-.1a2 2 0 112.8 2.8l-.1.1a1.6 1.6 0 001.1 2.7H21a2 2 0 010 4z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* apicon-listing-settings -> DS Gear */
.layout-sidebar .apicon-listing-settings:before,
.header-page-icon.apicon-listing-settings:before {
    content: "";
    display: block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M19.4 15a1.6 1.6 0 00.3 1.8l.1.1a2 2 0 11-2.8 2.8l-.1-.1a1.6 1.6 0 00-2.7 1.1V21a2 2 0 11-4 0v-.1A1.6 1.6 0 005.6 19l-.1.1a2 2 0 11-2.8-2.8l.1-.1A1.6 1.6 0 003 12.6a2 2 0 110-4h.1A1.6 1.6 0 005 5.6l-.1-.1a2 2 0 112.8-2.8l.1.1A1.6 1.6 0 0010.6 3a2 2 0 014 0v.1A1.6 1.6 0 0019 5l.1-.1a2 2 0 112.8 2.8l-.1.1a1.6 1.6 0 001.1 2.7H21a2 2 0 010 4z'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M19.4 15a1.6 1.6 0 00.3 1.8l.1.1a2 2 0 11-2.8 2.8l-.1-.1a1.6 1.6 0 00-2.7 1.1V21a2 2 0 11-4 0v-.1A1.6 1.6 0 005.6 19l-.1.1a2 2 0 11-2.8-2.8l.1-.1A1.6 1.6 0 003 12.6a2 2 0 110-4h.1A1.6 1.6 0 005 5.6l-.1-.1a2 2 0 112.8-2.8l.1.1A1.6 1.6 0 0010.6 3a2 2 0 014 0v.1A1.6 1.6 0 0019 5l.1-.1a2 2 0 112.8 2.8l-.1.1a1.6 1.6 0 001.1 2.7H21a2 2 0 010 4z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* apicon-appraisal -> DS Clipboard */
.layout-sidebar .apicon-appraisal:before,
.header-page-icon.apicon-appraisal:before {
    content: "";
    display: block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='8' y='3' width='8' height='4' rx='1'/%3E%3Cpath d='M8 5H6a2 2 0 00-2 2v12a2 2 0 002 2h12a2 2 0 002-2V7a2 2 0 00-2-2h-2'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='8' y='3' width='8' height='4' rx='1'/%3E%3Cpath d='M8 5H6a2 2 0 00-2 2v12a2 2 0 002 2h12a2 2 0 002-2V7a2 2 0 00-2-2h-2'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* apicon-wishlist -> DS Bookmark */
.layout-sidebar .apicon-wishlist:before,
.header-page-icon.apicon-wishlist:before {
    content: "";
    display: block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 21l-7-5-7 5V5a2 2 0 012-2h10a2 2 0 012 2z'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 21l-7-5-7 5V5a2 2 0 012-2h10a2 2 0 012 2z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* -------------------------------------------------------------------------
   Section-header (level-1) icons - see .sidenav-icon-level1 in _Menu.cshtml.
   ------------------------------------------------------------------------- */

/* apicon-activity -> DS Activity (Test Drives header) */
.layout-sidebar .apicon-activity:before,
.header-page-icon.apicon-activity:before {
    content: "";
    display: block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 12h-4l-3 9L9 3l-3 9H2'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 12h-4l-3 9L9 3l-3 9H2'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* apicon-menu_Sales_Pipeline -> DS Play (Sales Pipeline header) */
.layout-sidebar .apicon-menu_Sales_Pipeline:before,
.header-page-icon.apicon-menu_Sales_Pipeline:before {
    content: "";
    display: block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M10 9l5 3-5 3z'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M10 9l5 3-5 3z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* apicon-menu_System_Admin -> DS Wrench (System Admin header) */
.layout-sidebar .apicon-menu_System_Admin:before,
.header-page-icon.apicon-menu_System_Admin:before {
    content: "";
    display: block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.7 6.3a4 4 0 00-5.4 5.4L3 18l3 3 6.3-6.3a4 4 0 005.4-5.4l-2.6 2.6-2.4-.6-.6-2.4z'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14.7 6.3a4 4 0 00-5.4 5.4L3 18l3 3 6.3-6.3a4 4 0 005.4-5.4l-2.6 2.6-2.4-.6-.6-2.4z'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* apicon-menu_Admin_Menu -> DS Sliders (Admin header) */
.layout-sidebar .apicon-menu_Admin_Menu:before,
.header-page-icon.apicon-menu_Admin_Menu:before {
    content: "";
    display: block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 21v-7M4 10V3M12 21v-9M12 8V3M20 21v-5M20 12V3M1 14h6M9 8h6M17 16h6'/%3E%3C/svg%3E") center / contain no-repeat;
            mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 21v-7M4 10V3M12 21v-9M12 8V3M20 21v-5M20 12V3M1 14h6M9 8h6M17 16h6'/%3E%3C/svg%3E") center / contain no-repeat;
}


/* Reskin Listing grid/card view */

/* Aged-stock token not yet in ds-reskin.css - red-orange intentionally distinct from brand red */
:root {
    --stock-aged: #C84A1E;

    /* DS tonal washes for status surfaces ("12% feel") - from tokens/colors.css, not in ds-reskin.css */
    --status-open-bg: #E7F3E8;
    --status-warning-bg: #FBF0DE;
    --status-info-bg: #E4EFF7;
    --status-lost-bg: #FCE3E3;
    --status-neutral-bg: #ECEEF0;
}

/* ===== TOOLBAR: toggle + sort ===== */
.listing-view-toolbar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 0 12px;
    flex-wrap: wrap;
}

/* List/Grid as a DS segmented control: one pill group, no gaps, active = brand fill */
.listing-view-toolbar .btn-group .btn {
    border-color: var(--border-default, #ccc);
    color: var(--text-primary, #333);
    background-color: var(--surface-card, #fff);
}

.listing-view-toolbar .btn-group .btn.active,
.listing-view-toolbar .btn-group .btn:focus {
    background-color: var(--ap-red, #b0121b);
    border-color: var(--ap-red, #b0121b);
    color: #fff;
    box-shadow: none;
}

/* Reskin the Listing Summary panel is hidden-xs, but Bootstrap's .panel-group still applies
   its own margin-bottom:20px to the (now empty) accordion wrapper - leaving an oversized gap
   before the List/Grid toggle on mobile even though nothing visible is there. */
@media (max-width: 767px) {
    #accordion.panel-group {
        margin-bottom: 0;
    }
}

/* Reskin inline svg's default vertical-align (baseline) sits it too high next to the
   button's text baseline. */
.listing-view-toolbar .btn-group .btn svg {
    vertical-align: -2px;
    margin-right: 2px;
}

.listing-sort-dropdown {
    display: flex;
    align-items: center;
    gap: 6px;
}

.listing-sort-dropdown .select2-container {
    display: inline-block;
    vertical-align: middle;
}

/* Reskin select2's default single-selection control is 34px tall (select2.css), 4px taller than
   this app's .btn-sm List/Grid toggle beside it - match it exactly (see the equivalent override
   for the lead swimlane view's own Sort by dropdown in leadSwimlane.css). */
.listing-sort-dropdown .select2-selection--single {
    height: 30px;
}

.listing-sort-dropdown .select2-selection--single .select2-selection__rendered {
    line-height: 30px;
}

.listing-sort-dropdown .select2-selection--single .select2-selection__arrow {
    height: 28px;
}

/* Relocated DataTable controls (per-page / info / top paginator) sit right-aligned on one line */
.listing-dt-controls {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}

/* Strip the controls' default block/margin styling so they sit inline in the bar */
.listing-dt-controls .dataTables_length,
.listing-dt-controls .dataTables_info,
.listing-dt-controls .dataTables_paginate {
    margin: 0;
    padding: 0;
    float: none;
    width: auto;
    white-space: nowrap;
}

.listing-dt-controls .dataTables_length label,
.listing-dt-controls .dataTables_info {
    margin: 0;
    font-weight: normal;
}

/* Reskin the length control's default 34px height (Bootstrap's .form-control sizing) sat
   taller than the 30px .btn-sm List/Grid toggle beside it and didn't line up - match it exactly. */
.listing-dt-controls .dataTables_length {
    display: flex;
    align-items: center;
    height: 30px;
}

/* Reskin the "per page" text (part of the same raw label as the select, set via
   dataTableHelper.js's shared language.lengthMenu string - can't be wrapped in its own element
   without changing that template for every DataTable-driven screen) muted to match the "Sort by"
   label beside it (#808080 = this app's .text-muted, elephant.css) - then re-asserted back to the
   normal text colour on the select itself below, since colour would otherwise inherit onto it too. */
.listing-dt-controls .dataTables_length label {
    display: flex;
    align-items: center;
    height: 30px;
    color: #808080;
}

/* Per-page select was rendering too narrow (clipped the "25") */
.listing-dt-controls .dataTables_length select {
    width: auto;
    min-width: 56px;
    height: 30px;
    padding: 0 6px;
    margin: 0 4px;
    color: var(--text-primary, #16191B);
}

/* Mobile / tablet: let the cluster wrap below the toggle, stay usable, no overflow */
@media (max-width: 767px) {
    .listing-dt-controls {
        margin-left: 0;
        width: 100%;
        justify-content: space-between;
    }

    .listing-sort-dropdown {
        margin-left: auto;
    }
}

/* Hide table and its filter/info bar in grid mode. The length-selector and paginators are
   relocated out of the wrapper (toolbar + below-grid container); any paginator still inside the
   wrapper is transient, so hide it to stop it flashing above the grid before relocation. */
.listing-table-grid-mode table.dataTable,
.listing-table-grid-mode .dataTables_filter,
.listing-table-grid-mode .dataTables_info,
.listing-table-grid-mode .dataTables_paginate,
.listing-table-grid-mode .dataTables_scrollHead,
.listing-table-grid-mode .dataTables_scrollBody,
.listing-table-grid-mode .dataTables_scroll {
    display: none !important;
}

/* Image-count overlay - match the DS VehicleCard ImageCount exactly: a dark-scrim pill (blurred),
   stacked-images icon + count, bottom-right. Overrides the shared red-circle badge (autoplay-image.css),
   scoped to the card only. */
.listing-card__image .listing-image-count {
    position: absolute;
    top: auto;
    left: auto;
    right: 8px;
    bottom: 8px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    width: auto;
    height: 24px;
    padding: 0 9px;
    border: none;
    border-radius: var(--radius-pill, 999px);
    background: rgba(22, 25, 27, 0.62);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    color: #fff;
    font-family: var(--font-body, inherit);
    font-size: 12px;
    font-weight: 600;
    line-height: 1;
    text-align: left;
}

.listing-card__image .listing-image-count::before {
    content: "";
    flex-shrink: 0;
    width: 13px;
    height: 13px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='13' height='13' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='8' y='8' width='13' height='13' rx='2'/%3E%3Cpath d='M4 16V5a1 1 0 0 1 1-1h11'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/* ===== LISTING SUMMARY STAT CARDS ===== */

/* Icon colour helpers for the summary section */
.ls-icon--primary { color: var(--brand-primary, #DD2323); }
.ls-icon--warning  { color: var(--status-warning, #E08400); }
.ls-icon--success  { color: var(--status-open, #2E7D32); }
.ls-icon--danger   { color: var(--status-lost, #B81C1C); }
.ls-icon--info     { color: var(--status-info, #1A6FB5); }
.ls-icon--aged     { color: var(--stock-aged, #C84A1E); }

/* Stat card tiles - override application.css with design-system tokens */
.listing-summary ul li {
    background: var(--surface-card, #fff);
    border: 1px solid var(--border-default, #E2E5E8);
    border-radius: var(--radius-md, 6px);
    box-shadow: var(--elevation-1, 0 1px 3px rgba(0,0,0,.10), 0 1px 2px rgba(0,0,0,.06));
    transition: box-shadow 150ms ease-out;
}

.listing-summary ul li:hover {
    box-shadow: var(--elevation-2, 0 4px 12px rgba(0,0,0,.12));
}

/* Per-card pastel tonal-wash backgrounds, aligned to each card's semantic icon colour */
.listing-summary ul li.ls-card--instock { background: var(--ap-red-050, #FEF2F2); }
.listing-summary ul li.ls-card--above   { background: var(--status-warning-bg, #FBF0DE); }
.listing-summary ul li.ls-card--below   { background: var(--status-open-bg, #E7F3E8); }
.listing-summary ul li.ls-card--aged    { background: var(--status-lost-bg, #FCE3E3); }
.listing-summary ul li.ls-card--nophoto { background: var(--status-warning-bg, #FBF0DE); }
.listing-summary ul li.ls-card--import  { background: var(--status-info-bg, #E4EFF7); }

/* SVGs in summary cards - block + centred, matching the existing span rule */
.listing-summary ul li > div > svg {
    display: block;
    margin: 4px auto 2px;
}

/* SVGs in the import row - stay inline beside the letter label */
.listing-summary-imported svg {
    display: inline;
    vertical-align: middle;
}

/* Remove grey from the accordion panel heading */
#accordion .panel-heading {
    background: var(--surface-card, #fff);
    border-bottom-color: var(--border-default, #E2E5E8);
    border-radius: var(--radius-md, 6px) var(--radius-md, 6px) 0 0;
}

/* ===== GRID CONTAINER ===== */
.listing-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 12px;
    padding-bottom: 16px;
}

@media (max-width: 480px) {
    .listing-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }
}

@media (min-width: 481px) and (max-width: 767px) {
    .listing-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }
}

@media (min-width: 768px) and (max-width: 1199px) {
    .listing-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 14px;
    }
}

@media (min-width: 1200px) {
    .listing-grid {
        grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
    }
}

/* ===== CARD FLIP WRAPPER ===== */
.listing-card {
    perspective: 1000px;
    height: 396px; /* DS v2: front now carries the price+leads row and the stock/rego grid */
}

.listing-card__inner {
    position: relative;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
    transition: transform 0.4s var(--ease-out, ease-out);
}

.listing-card--flipped .listing-card__inner {
    transform: rotateY(180deg);
}

.listing-card__face {
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    background: var(--surface-card, #fff);
    border: 1px solid var(--border-default, #ddd);
    border-radius: var(--radius-lg, 8px);
    box-shadow: var(--elevation-1, 0 1px 4px rgba(0,0,0,0.08));
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.listing-card__face--back {
    transform: rotateY(180deg);
}

/* Selected state (bulk mode) - a narrow red border only, no glow ring */
.listing-card--selected .listing-card__face {
    border-color: var(--ap-red, #b0121b);
}

/* ===== IMAGE AREA ===== */
.listing-card__image {
    position: relative;
    width: 100%;
    height: 150px;
    overflow: hidden;
    background: #f5f5f5;
    flex-shrink: 0;
}

.listing-card__image .autoplay-image {
    width: 100%;
    height: 150px;
}

.listing-card__image img {
    width: 100%;
    height: 150px;
    object-fit: cover;
}

/* Banner rule for card-width images (w=300) - listing-image uses listing-image-status-{{w}} */
.listing-image-status-300 {
    bottom: 0;
    left: 0;
    right: 0;
    padding: 3px 6px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.5px;
    text-align: center;
}

/* The 150px image height was tuned for the ~220-230px cards in the desktop/
   tablet multi-column grid (~1.5:1). Below 480px the grid drops to a single
   full-width column (~350px+ cards, see .listing-grid above), so the same
   150px reads as a very short, stretched-wide photo. Scale the image height
   up to keep a similar aspect ratio; bump the card's own fixed height by the
   same amount so the body/specs/price content below isn't squeezed.
   The autoplay-image directive (JS, can't edit) sets its own inline
   height:150px on both the .autoplay-image wrapper and the <img> itself, so
   a plain height rule here is silently outranked by that inline style -
   !important is required to win. The status banner (.listing-image-status,
   in autoplay-image.css) is already `position:absolute; bottom:0` inside
   .autoplay-image, so once its container's real height matches here, the
   banner tracks the bottom edge on its own - no positioning change needed. */
@media (max-width: 480px) {
    .listing-card {
        height: 500px; /* DS v2: taller image (230) + the added front rows */
    }

    .listing-card__image {
        height: 230px;
    }

    .listing-card__image .autoplay-image,
    .listing-card__image img {
        height: 230px !important;
    }
}

/* ===== CHECKBOX OVERLAY ===== */
.listing-card__checkbox {
    position: absolute;
    top: 8px;
    left: 8px;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid var(--border-default, #D0D5DA);
    border-radius: var(--radius-md, 6px);
    box-shadow: var(--elevation-1, 0 1px 3px rgba(0, 0, 0, 0.18));
    padding: 0;
    cursor: pointer;
}

.listing-card__checkbox input[type="checkbox"] {
    display: block;
    width: 18px;
    height: 18px;
    margin: 0;
    cursor: pointer;
    accent-color: var(--brand-primary, #DD2323);
}

/* Stronger affordance when the card is selected */
.listing-card--selected .listing-card__checkbox {
    background: #fff;
    border-color: var(--brand-primary, #DD2323);
}

/* ===== CARD BODY ===== */
.listing-card__body {
    flex: 1;
    padding: 8px 10px 4px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 3px;
}

/* SPW-14210: the body is a fixed-height flex column (overflow:hidden), so every child must hold a
   deterministic height and none of them may shrink - otherwise the only child that CAN shrink
   (.listing-card__specs, whose overflow:hidden collapses its flex minimum size to 0) silently
   absorbs all the overflow and the rows below it land at different offsets card-to-card. */
.listing-card__title-row,
.listing-card__subtitle,
.listing-card__specs,
.listing-card__price-row,
.listing-card__idgrid {
    flex-shrink: 0;
}

.listing-card__title-row {
    display: flex;
    align-items: flex-start;
    gap: 6px;
}

.listing-card__title {
    flex: 1;
    font-family: var(--font-display, inherit);
    font-size: 14px;
    font-weight: 700;
    line-height: 18px; /* SPW-14210: explicit so the top of the card is the same height everywhere */
    color: var(--text-primary, #222);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* SPW-14210: always in the DOM now, and its row is reserved here, so a listing with no variant
   lines up with one that has it (previously ng-if'd out, costing the card a ~15px row). */
.listing-card__subtitle {
    font-size: 12px;
    line-height: 16px;
    min-height: 16px;
    color: var(--text-secondary, #666);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Spec pills (odometer / condition / fuel / transmission / drivetrain / seats / body type / colour) */
.listing-card__specs {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-top: 2px;
    /* SPW-14210: cap the grey specs to 2 rows (was 3 - SPW-14164). 2 * 18px pill (16px line-height
       + 1px*2 padding) + 1 * 4px row gap = 40px. Because .listing-card__spec has a fixed 16px
       line-height, a 3rd row would start at 44px and so falls entirely outside the box - pills
       beyond 2 rows don't render at all, rather than showing as a half-sliced row. The freed 22px
       pays for the reserved second price line and the reserved variant row. */
    max-height: 40px;
    overflow: hidden;
}

.listing-card__spec {
    display: inline-block;
    max-width: 100%;
    padding: 1px 6px;
    border-radius: var(--radius-pill, 999px);
    font-size: 11px;
    line-height: 16px; /* SPW-14164: fixed line-height so the 3-row clamp above is deterministic */
    font-weight: 500;
    color: var(--text-secondary, #555);
    background: var(--status-neutral-bg, #ECEEF0);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Days-in-stock escalation: amber (61–90d), red-orange (91+d) */
.listing-card__days--warning {
    color: var(--status-warning, #E08400);
    font-weight: 600;
}

.listing-card__days--aged {
    color: var(--stock-aged, #C84A1E);
    font-weight: 600;
}

/* ===== PRICE ===== */
/* SPW-14210: a fixed two-line block - 20px amount + 14px note = 34px - so the price and the
   Stock No/Rego grid below it land on the same baseline on every card.
   line-height here (not just on .listing-price) sets the strut for the amount line's wrapper,
   which listing-price generates itself; without it the wrapper inherits line-height:normal and the
   line box lands on 20px or 21px depending on the glyphs, jittering the whole block by 1px.
   justify-content:flex-end keeps the note bottom-anchored: listing-price renders NOTHING at all
   when the price is 0 (its outer div is ng-if="displayPrice !== '0'"), so without this a POA
   vehicle's note would ride up into the amount's slot and the rows below would shift. */
.listing-card__price {
    margin-top: 4px;
    min-height: 34px;
    line-height: 20px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.listing-card__price .listing-price,
.listing-card__price .listing-price-original {
    line-height: 20px;
}

/* SPW-14210: pin the amount line to exactly 20px. listing-price emits its spans inline in one line
   box, and .listing-price-original ("was" price) carries font-size:smaller from application.css -
   a second inline box at a different font size grows the shared line box to 21px, so discounted
   listings sat 1px above their neighbours. A fixed height makes it independent of font metrics. */
.listing-card__price listing-price {
    display: block;
    height: 20px;
}

.listing-price-orc {
    font-size: 11px;
    color: var(--text-secondary, #777);
    margin-left: 4px;
}

/* ===== FOOTER ===== */
/* DS - no divider between the stock/rego grid and the View Listing footer. */
.listing-card__footer {
    display: flex;
    gap: 6px;
    padding: 8px 10px;
    flex-shrink: 0;
}

/* DS primary - red fill, white text, eye icon (two classes to beat Bootstrap .btn/.btn-block) */
.listing-card__view-btn.btn,
.listing-card__view-btn {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 34px;
    line-height: 1; /* drop Bootstrap's line-height so the icon + label centre */
    font-size: 13px;
    padding: 0 10px;
    background-color: var(--brand-primary, #DD2323);
    border-color: var(--brand-primary, #DD2323);
    color: #fff;
}

.listing-card__view-btn.btn:hover,
.listing-card__view-btn.btn:focus,
.listing-card__view-btn:hover,
.listing-card__view-btn:focus {
    background-color: var(--ap-red-700, #B81C1C);
    border-color: var(--ap-red-700, #B81C1C);
    color: #fff;
}

.listing-card__view-btn svg {
    flex: 0 0 auto;
}

/* DS flip - circular, white, red border + red rotate-arrows icon (same icon as the lead cards) */
.listing-card__flip-btn {
    flex-shrink: 0;
    width: 34px;
    height: 34px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--brand-primary, #DD2323);
    border-radius: 50%;
    background: var(--surface-card, #fff);
    color: var(--brand-primary, #DD2323);
    cursor: pointer;
}

.listing-card__flip-btn:hover {
    background: var(--ap-red-050, #FEF2F2);
}

.listing-card__flip-btn svg {
    display: block;
}

/* Sold / Pending / On Hold: on the listing card, render as a top-left DS badge instead of the shared
   diagonal corner ribbon (autoplay-image.css). Scoped to .listing-card__image so the global ribbon is
   untouched on every other screen. Higher specificity + loaded after autoplay-image.css, so it wins. */
.listing-card__image .autoplay-image .listing-image-sold,
.listing-card__image .autoplay-image .listing-image-pending,
.listing-card__image .autoplay-image .listing-image-onhold {
    top: 8px;
    left: 8px;
    width: auto;
    text-align: left;
    border: none;
    border-radius: var(--radius-sm, 4px);
    padding: 3px 8px;
    font-family: var(--font-condensed, 'Barlow Condensed', sans-serif);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .04em;
    line-height: 1;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
    transform: none;
    -webkit-transform: none;
    -moz-transform: none;
    -o-transform: none;
    -ms-transform: none;
}

.listing-card__image .autoplay-image .listing-image-sold    { background-color: var(--status-lost, #B81C1C); }
.listing-card__image .autoplay-image .listing-image-pending { background-color: var(--status-info, #1A6FB5); }
.listing-card__image .autoplay-image .listing-image-onhold  { background-color: var(--status-warning, #E08400); }

.listing-card__image .autoplay-image .listing-image-sold label,
.listing-card__image .autoplay-image .listing-image-pending label,
.listing-card__image .autoplay-image .listing-image-onhold label {
    margin: 0;
}

/* In multi-select mode the checkbox sits top-left (8,8) - shift the status badge clear of it */
.listing-card--multiselect .listing-card__image .autoplay-image .listing-image-sold,
.listing-card--multiselect .listing-card__image .autoplay-image .listing-image-pending,
.listing-card--multiselect .listing-card__image .autoplay-image .listing-image-onhold {
    left: 44px;
}

/* On Test Drive / On Loan / Incentive etc. - on the listing CARD, render the image-status overlay as a
   top-RIGHT pill (matching the sold/on-hold pill style), keeping each status's own colour from
   autoplay-image.css. Scoped to .listing-card__image so the listing LIST control (#listingTable) is
   untouched. */
.listing-card__image .autoplay-image .listing-image-status {
    top: 8px;
    right: 8px;
    bottom: auto;
    left: auto;
    width: auto;
    padding: 3px 8px;
    border: none;
    border-radius: var(--radius-sm, 4px);
    font-family: var(--font-condensed, 'Barlow Condensed', sans-serif);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .04em;
    line-height: 1;
    text-transform: uppercase;
    text-align: left;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
}

/* ===== BACK FACE DETAILS ===== */
.listing-card__body--back {
    gap: 0;
}

.listing-card__labels {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 8px;
}

/* DS soft Badge geometry - colour + light tint are set inline (per-label) */
.listing-card__label {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 22px;
    padding: 3px 8px;
    border-radius: var(--radius-sm, 4px);
    font-family: var(--font-condensed, 'Barlow Condensed', sans-serif);
    font-weight: 700;
    font-size: 11px;
    letter-spacing: .04em;
    text-transform: uppercase;
    white-space: nowrap;
    line-height: 1;
}

.listing-card__label-icon {
    flex-shrink: 0;
}

.listing-card__detail {
    display: flex;
    justify-content: space-between;
    padding: 3px 0;
    font-size: 12px;
}

.listing-card__detail-label {
    color: var(--text-secondary, #777);
    font-size: 12px;
    flex-shrink: 0;
    width: 80px;
}

.listing-card__detail-value {
    color: var(--text-primary, #222);
    text-align: right;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ============================================================
   DS VehicleCard v2 additions (grid card): status rail, lead-count pill,
   front stock/rego grid, "Listing Detail" back panel + create actions.
   ============================================================ */

/* Price + "N leads" pill on one row */
.listing-card__price-row {
    display: flex;
    /* SPW-14210: flex-start (was center) - the price is now a 2-line block, so the leads pill should
       sit on the amount line rather than centring against the whole block. */
    align-items: flex-start;
    justify-content: space-between;
    gap: 8px;
    /* SPW-14210: all of the card's spare vertical space collects here, i.e. directly BELOW the spec
       pills, which bottom-pins the price + Stock No/Rego group. That's what keeps those rows on the
       same baseline no matter how many spec rows, whether the variant subtitle is empty, or whether
       the price carries a second line. */
    margin-top: auto;
}

.listing-card__price-row .listing-card__price {
    margin-top: 0;
}

/* SPW-14210: the card's own second price line - "Excl GST" and/or "plus ORC". Always in the DOM (the
   spans inside are what's conditional) so the line is reserved on every card. Deliberately NOT the
   shared listing-price directive's .listing-price-exGst / .listing-price-orc spans: application.css
   gives .listing-price-exGst display:block, which turned the horizontal price box into three line
   boxes and pushed "plus ORC" onto a third row. */
.listing-card__price-note {
    display: flex;
    column-gap: 5px;
    font-size: 11px;
    line-height: 14px;
    min-height: 14px;
    color: var(--text-secondary, #777);
}

/* SPW-14210: the pill centres its icon and its label as flex boxes, which leaves the label looking
   1px high: the icon's ink fills its 12px box symmetrically, but the label's ink does not sit
   centred in its line box - "N leads" has no descenders, so the font's descent space below the
   baseline is reserved but unused. Measured on the real card: icon centre y=401.66 vs label ink
   centre y=400.42, i.e. the label sits 1.23px high. Nudging it down 1px lands it on the icon's
   optical centre (0.23px residual). position:relative paints the shift without affecting layout,
   so none of the card's row alignment is touched. */
.listing-card__leads-count {
    position: relative;
    top: 1px;
}

.listing-card__leads {
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    height: 22px;
    padding: 0 9px;
    border-radius: var(--radius-pill, 999px);
    background: var(--ink-900, #16191B);
    color: #fff;
    font-family: var(--font-body, inherit);
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

.listing-card__leads svg {
    flex-shrink: 0;
}

/* Stock No / Rego promoted to the front - 2-col, condensed uppercase label over a mono value */
.listing-card__idgrid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin-top: 2px;
    padding-top: 6px;
    border-top: 1px solid var(--border-default, #E2E5E8);
}

.listing-card__idcol {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
}

.listing-card__idlabel {
    font-family: var(--font-condensed, 'Barlow Condensed', sans-serif);
    font-weight: 700;
    font-size: 10px;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--ink-500, #7A8087);
}

.listing-card__idvalue {
    font-family: var(--font-mono, ui-monospace, 'Consolas', monospace);
    font-size: 12px;
    color: var(--ink-900, #16191B);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Back "Listing Detail" panel heading + open-leads count on the right */
.listing-card__back-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding-bottom: 6px;
    margin-bottom: 6px;
    border-bottom: 1px solid var(--border-default, #E2E5E8);
    flex-shrink: 0;
}

.listing-card__back-title {
    font-family: var(--font-display, inherit);
    font-weight: 700;
    font-size: 14px;
    color: var(--ink-900, #16191B);
}

/* DS back-face stats block - In Stock / Last Updated / Created, bordered top+bottom, above the buttons */
.listing-card__stats {
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 4px 10px 8px;
    padding: 10px 0;
    border-top: 1px solid var(--border-default, #E2E5E8);
    border-bottom: 1px solid var(--border-default, #E2E5E8);
}

.listing-card__stat-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.listing-card__stat {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.listing-card__stat-label {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-family: var(--font-condensed, 'Barlow Condensed', sans-serif);
    font-weight: 700;
    font-size: 10px;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--ink-500, #7A8087);
}

.listing-card__stat-label svg {
    flex-shrink: 0;
}

.listing-card__stat-value {
    font-size: 12.5px;
    font-weight: 500;
    color: var(--ink-900, #16191B);
}

/* aged/warning days keep their escalation colour over the base stat-value colour */
.listing-card__stat-value.listing-card__days--warning { color: var(--status-warning, #E08400); }
.listing-card__stat-value.listing-card__days--aged { color: var(--stock-aged, #C84A1E); }

/* Let the back detail list scroll if it ever exceeds the fixed card height */
.listing-card__body--back {
    overflow-y: auto;
}

/* Back create actions (Add Lead / Test Drive) - DS outlined red icon buttons */
.listing-card__actions {
    display: flex;
    gap: 6px;
    padding: 0 10px 8px;
    flex-shrink: 0;
}

.listing-card__action-btn {
    flex: 1 1 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 32px;
    padding: 0 8px;
    border: 1px solid var(--brand-primary, #DD2323);
    border-radius: var(--radius-sm, 4px);
    background: var(--surface-card, #fff);
    color: var(--brand-primary, #DD2323);
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
}

.listing-card__action-btn:hover {
    background: var(--ap-red-050, #FEF2F2);
}

.listing-card__action-btn svg {
    flex-shrink: 0;
}

/* ===== listing-tile (js/_controls/listingTile.js) =====
   Reusable "listing image + key details" snippet - image on the left, vehicle title/NEW/DEMO
   badges and price on the right. Used by the lead swimlane card (leadSwimlane.js); intended to
   be reused by any other board/list that shows a listing snapshot (e.g. test drive swimlanes)
   rather than each one re-implementing this layout. */
.listing-tile {
    display: flex;
    gap: 8px;
}

.listing-tile__image {
    flex: 0 0 90px;
    width: 90px;
    border-radius: var(--radius-sm, 4px);
    overflow: hidden;
}

.listing-tile__image .autoplay-image {
    width: 100%;
    height: 68px;
}

.listing-tile__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.listing-tile__details {
    flex: 1 1 auto;
    min-width: 0;
}

.listing-tile__title-row {
    display: flex;
    align-items: baseline;
    gap: 6px;
}

.listing-tile__title {
    flex: 1 1 auto;
    min-width: 0;
    font-weight: 600;
    font-size: 13px;
    color: var(--text-primary, #333);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.listing-tile__badge {
    flex-shrink: 0;
    font-size: 11px; /* Reskin matches .listing-card__badge - DS pill/badge text is 11px */
    font-weight: 700;
    padding: 1px 5px;
    border-radius: 3px;
    background: var(--status-open-bg, #E7F3E8);
    color: var(--status-open, #2E7D32);
}

.listing-tile__price {
    display: block;
    margin-top: 4px;
    font-size: 13px;
}

/* Reskin listing-price's own spans (.listing-price / .listing-price-original) already carry
   colour/weight/strikethrough - just lay them out inline with a small gap here */
.listing-tile__price .listing-price,
.listing-tile__price .listing-price-original {
    margin-right: 6px;
}

/* ============================================================================
   Vehicle Listing LIST view - Autoplay Design System treatment. Everything here is
   scoped to #listingTable so the grid/card view and every other screen using the
   shared listing-image / listing-price directives are left untouched. See the DS
   "Vehicle Listing List" component.
   ============================================================================ */

/* Column headers -> DS table head: Barlow Condensed uppercase, muted (--ink-600) on a light
   --ink-100 bar. */
#listingTable thead th {
    font-family: var(--font-condensed, 'Barlow Condensed', var(--font-body, sans-serif));
    text-transform: uppercase;
    letter-spacing: .05em;
    font-weight: 700;
    font-size: 12px;
    color: var(--ink-600, #5A6066);
    background: var(--ink-100, #F4F5F6);
}

/* Identifiers (Stock No, Rego) -> monospace (DS uses JetBrains Mono for stock #, VIN, rego). */
#listingTable td.listing-mono {
    font-family: var(--font-mono, ui-monospace, 'Consolas', monospace);
    font-size: 12.5px;
    color: var(--ink-700, #3A4046);
}

/* Price -> DS: struck-through original ABOVE the bold-red current. Base .listing-price /
   .listing-price-original carry red / strikethrough (application.css); here we stack the vertical
   list variant original-on-top (order:-1), match the DS figure (Barlow display 800, brand red) and
   the accessible struck "was" colour (--price-was). */
#listingTable listing-price > div {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    line-height: 1.15;
}

#listingTable listing-price .listing-price-original {
    order: -1;
    color: var(--price-was, #6B7280);
    font-size: 12px;
}

#listingTable listing-price .listing-price {
    font-family: var(--font-display, 'Barlow', sans-serif);
    font-weight: 800;
    font-size: 15px;
    color: var(--brand-primary, #DD2323);
    letter-spacing: -0.01em;
}

/* Image photo-count badge -> DS: small red pill tucked inside the top-right corner with a white
   ring and a photo glyph before the count. (Base autoplay-image.css floats a 22px circle
   overhanging the corner; override for the list only. Flex-centred so the icon + number sit
   dead-centre; the glyph is a CSS ::before so the shared listing-image directive is untouched.) */
#listingTable .autoplay-image .listing-image-count {
    top: 3px;
    right: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 2px;
    height: 16px;
    width: auto;
    min-width: 16px;
    padding: 0 5px;
    background: var(--brand-primary, #DD2323);
    color: #fff;
    border-radius: var(--radius-pill, 999px);
    box-shadow: 0 0 0 1px rgba(255, 255, 255, .5);
    font-family: var(--font-body, sans-serif);
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
}

#listingTable .autoplay-image .listing-image-count::before {
    content: "";
    flex-shrink: 0;
    width: 9px;
    height: 9px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='9' height='9' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Ccircle cx='8.5' cy='10' r='1.5'/%3E%3Cpath d='M21 16l-5-5-9 8'/%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

/* (Image status banners are left as the existing full-width bottom banner - not restyled here.) */

/* TradeMe / AutoGrab -> DS marker badges (rendered by the column renderers). */
.listing-list-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-sm, 4px);
    font-family: var(--font-condensed, 'Barlow Condensed', var(--font-body, sans-serif));
    font-weight: 800;
    font-size: 11px;
}

/* AutoGrab -> teal "AG" chip (DS --workflow-active / --workflow-active-bg). */
.listing-list-badge--autograb {
    min-width: 30px;
    height: 20px;
    padding: 0 7px;
    letter-spacing: .06em;
    background: var(--workflow-active-bg, #E0F1EF);
    color: var(--workflow-active, #16897E);
}

/* Trade Me -> red "TM" square marker (fallback for the official logo). */
.listing-list-badge--trademe {
    width: 24px;
    height: 24px;
    letter-spacing: .02em;
    background: var(--brand-primary, #DD2323);
    color: #fff;
}

.listing-list-badge__error {
    margin-left: 3px;
    vertical-align: middle;
}

/* Reskin sales dashboard swimlane view + lead summary section. Loaded after ds-reskin.css
   so the design-system tokens (--surface-card, --border-default, --status-*-bg, etc.) resolve -
   same convention as listingCard.css. */

/* ===== View toolbar (List | Swimlane) - same layout + DS segmented-control button styling as
   .listing-view-toolbar in listingCard.css ===== */
.lead-view-toolbar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 0 12px;
    flex-wrap: wrap;
}

/* List/Swimlane as a DS segmented control: one pill group, no gaps, active = brand fill */
.lead-view-toolbar .btn-group .btn {
    border-color: var(--border-default, #ccc);
    color: var(--text-primary, #333);
    background-color: var(--surface-card, #fff);
}

/* Reskin inline svg's default vertical-align (baseline) sits it too high next to the
   button's text baseline - same fix applied to .listing-view-toolbar in listingCard.css. */
.lead-view-toolbar .btn-group .btn svg {
    vertical-align: -2px;
    margin-right: 2px;
}

.lead-view-toolbar .btn-group .btn.active,
.lead-view-toolbar .btn-group .btn:focus {
    background-color: var(--ap-red, #b0121b);
    border-color: var(--ap-red, #b0121b);
    color: #fff;
    box-shadow: none;
}

/* Reskin swimlane per-lane paging - page-size dropdown, swimlane-mode-only sibling of the
   List/Swimlane button group above. Same select2/autoplay-select control (and "Sort by"-style
   muted label) as .lead-view-toolbar__sort below - every <select> in this app goes through
   autoplay-select for a consistent look, so this is no longer a plain HTML <select>.
   margin-left: auto pushes it to the right of the toolbar, same as .listing-dt-controls does
   for the listing grid view's own per-page control (listingCard.css). margin-right matches the
   ~19px inset the Lead Summary panel's collapse chevron keeps from the page edge - this row's
   containers carry almost no right padding of their own, so without it the control sits flush
   against the browser edge. */
.lead-view-toolbar__page-size {
    display: flex;
    align-items: center;
    gap: 6px;
    height: 30px;
    margin-left: auto;
    margin-right: 16px;
}

.lead-view-toolbar__page-size-select {
    width: 70px;
}

/* Reskin swimlane "Sort by" dropdown - same select2/autoplay-select control as the listing
   grid view's .listing-sort-dropdown (listingCard.css), so the two screens' Sort by controls
   look identical. select2's own default height (34px, select2.css) doesn't match the 30px-tall
   buttons/page-size dropdown beside it - see the shared select2 height override below. */
.lead-view-toolbar__sort {
    display: flex;
    align-items: center;
    gap: 6px;
    height: 30px;
}

.lead-view-toolbar__sort-select {
    width: 200px;
}

/* Reskin select2's default single-selection control is 34px tall (select2.css), 4px taller than
   this app's .btn-sm buttons beside it - shared by both swimlane dropdowns above (page-size and
   Sort by) - see the matching override for the listing grid view's own Sort by dropdown in
   listingCard.css (.listing-sort-dropdown). */
.lead-view-toolbar__sort .select2-selection--single,
.lead-view-toolbar__page-size .select2-selection--single {
    height: 30px;
}

.lead-view-toolbar__sort .select2-selection--single .select2-selection__rendered,
.lead-view-toolbar__page-size .select2-selection--single .select2-selection__rendered {
    line-height: 30px;
}

.lead-view-toolbar__sort .select2-selection--single .select2-selection__arrow,
.lead-view-toolbar__page-size .select2-selection--single .select2-selection__arrow {
    height: 28px;
}

/* Reskin the Lead Summary panel is hidden-xs, but Bootstrap's .panel-group still applies
   its own margin-bottom:20px to the (now empty) accordion wrapper - leaving an oversized gap
   before the List/Swimlane toggle on mobile even though nothing visible is there. */
@media (max-width: 767px) {
    #accordion.panel-group {
        margin-bottom: 0;
    }

    /* Reskin at 200px, .lead-view-toolbar__sort was too wide to fit alongside the List/Swimlane
       toggle, so each of the three groups (toggle, sort, page-size) wrapped to its own line.
       Narrowing the sort select lets it share a line with the toggle, leaving only page-size to
       wrap alone - but its margin-left:auto (meant to pin it to the right end of a shared line)
       then pushed it away from an otherwise-empty line instead, reading as a stray floating
       control. Drop that margin on mobile so a solo page-size line sits flush left like every
       other wrapped group, instead of floating disconnected on the right. */
    .lead-view-toolbar__sort-select {
        width: 120px;
    }

    .lead-view-toolbar__page-size {
        margin-left: 0;
    }
}

/* Hide the DataTable (without destroying it) while swimlane view is active - same technique
   as .listing-table-grid-mode in listingCard.css. List view's own data fetch is paused while
   swimlane is active (see LeadController.js reloadData), so this is purely a visibility switch. */
.lead-table-swimlane-mode table.dataTable,
.lead-table-swimlane-mode .dataTables_filter,
.lead-table-swimlane-mode .dataTables_info,
.lead-table-swimlane-mode .dataTables_paginate,
.lead-table-swimlane-mode .dataTables_scrollHead,
.lead-table-swimlane-mode .dataTables_scrollBody,
.lead-table-swimlane-mode .dataTables_scroll,
.lead-table-swimlane-mode .dataTables_length {
    display: none !important;
}

/* ===== Lead summary cards - same base layout/tonal-card styling as .listing-summary,
   but the per-lane colour is data-driven (dynamic dealer lanes), not a fixed class set.
   Zero-count lanes are excluded before this renders (see leadSwimlaneSummary.js), so the
   remaining cards can stretch (flex-grow) to fill the full row width. Always one line, no
   scrollbar - cards have no min-width floor, so they shrink (flex-shrink) as far as needed
   to all fit within the available width rather than overflowing or wrapping. */
.lead-swimlane-summary ul.list-inline {
    display: flex;
    flex-wrap: nowrap;
    gap: 10px;
    overflow: hidden;
}

.lead-swimlane-summary ul.list-inline li {
    flex: 1 1 0;
    min-width: 0;
    text-align: center;
    cursor: pointer; /* Reskin clicking jumps to the matching swimlane column */
}

/* Reskin pulsing placeholder shown only while the very first load is in flight (see
   leadSwimlaneSummary.js showGhost) - a fixed count of plain boxes roughly matching a real
   card's height, so the panel doesn't look broken/empty before data arrives. The colour goes
   straight on the <li> itself (same element a real card's pastel colour class applies to,
   overriding .listing-summary ul li's white background right here) rather than on a nested
   div, so there's no inset gap between an inner fill and the li's own box reading as a border. */
.lead-swimlane-summary ul.list-inline li.lead-swimlane-summary__ghost-item {
    cursor: default;
    height: 75px; /* Reskin matches a real populated card's rendered height */
    border: none;
    border-radius: var(--radius-md, 6px);
    background-color: #ECEEF0;
    animation: lead-swimlane-summary-pulse 1.4s ease-in-out infinite;
}

@keyframes lead-swimlane-summary-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* Stat-tile layout (DS StatCard): circular icon badge on the left, then the label
   above the bold numeric value. Selectors are scoped under `.lead-swimlane-summary ul li`
   so they out-specify `.listing-summary ul li span { display:block; text-align:center;
   margin-top:3px }` (application.css) - the summary li also carries the .listing-summary
   class, and that rule would otherwise force the icon span to block (breaking the circle). */
.lead-swimlane-summary ul.list-inline li {
    text-align: left;
}

.lead-swimlane-summary ul.list-inline li .lead-swimlane-summary__tile {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: 14px 16px; /* bigger card; ul.list-inline scope out-specifies the .listing-summary div padding-top:5px */
}

/* icon badge: white icon in a filled circle (per-lane colour set below) */
.lead-swimlane-summary ul li .lead-swimlane-summary__icon {
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    margin: 0;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--ink-500, #7A8087); /* neutral default; per-lane overrides below */
    color: #fff;
}

    .lead-swimlane-summary ul li .lead-swimlane-summary__icon svg {
        display: block;
        width: 20px;
        height: 20px;
        margin: 0;
    }

.lead-swimlane-summary ul li .lead-swimlane-summary__body {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    margin: 0;
    text-align: left;
}

.lead-swimlane-summary ul li .lead-swimlane-summary__label {
    margin: 0;
    text-align: left;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
    color: var(--ink-600, #5A6066);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.lead-swimlane-summary ul li .lead-swimlane-summary__value {
    margin: 0;
    text-align: left;
    font-family: var(--font-display, inherit);
    font-size: 22px;
    font-weight: 800;
    line-height: 1;
    color: var(--ink-900, #16191B);
}

/* Reskin .listing-summary ul li (listingCard.css) is MORE specific than the generic
   .swimlane-lane--{colour} rules below (2 element selectors beat 1 class selector), so its
   plain white background was winning over the pastel tint. Re-declare with matching/higher
   specificity scoped to the summary context only - the board's lane headers (plain divs) are
   unaffected and keep using the generic rules further down. */
.lead-swimlane-summary ul li.swimlane-lane--neutral { background: var(--status-neutral-bg, #ECEEF0); }
.lead-swimlane-summary ul li.swimlane-lane--info    { background: var(--status-info-bg, #E4EFF7); }
.lead-swimlane-summary ul li.swimlane-lane--primary { background: var(--ap-red-050, #FEF2F2); }
.lead-swimlane-summary ul li.swimlane-lane--warning { background: var(--status-warning-bg, #FBF0DE); }
.lead-swimlane-summary ul li.swimlane-lane--success { background: var(--status-open-bg, #E7F3E8); }
.lead-swimlane-summary ul li.swimlane-lane--danger  { background: var(--status-lost-bg, #FCE3E3); }

/* Icon-badge fill = the lane's complementary saturated colour (per DS StatCard iconBg), with a
   white icon. This supersedes PR #73, which coloured the icon glyph itself (color:) to match the
   lane - incompatible with the badge redesign (a lane-coloured icon on a same-coloured circle would
   be invisible). The lane-colour association is preserved here via the circle fill. */
.lead-swimlane-summary li.swimlane-lane--neutral .lead-swimlane-summary__icon { background: var(--ink-500, #7A8087); }
.lead-swimlane-summary li.swimlane-lane--info    .lead-swimlane-summary__icon { background: var(--status-info, #1A6FB5); }
.lead-swimlane-summary li.swimlane-lane--primary .lead-swimlane-summary__icon { background: var(--ap-red, #DD2323); }
.lead-swimlane-summary li.swimlane-lane--warning .lead-swimlane-summary__icon { background: var(--status-warning, #E08400); }
.lead-swimlane-summary li.swimlane-lane--success .lead-swimlane-summary__icon { background: var(--status-open, #2E7D32); }
.lead-swimlane-summary li.swimlane-lane--danger  .lead-swimlane-summary__icon { background: var(--ap-red, #DD2323); }

/* ===== Swimlane board ===== */
.swimlane-board {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    overflow-x: auto;
    /* Reskin setting overflow-x forces overflow-y to clip too (a lane with overflow-x:visible
       isn't possible per spec) - a few px of padding on every side keeps lane borders/focus
       states from being clipped without changing the lane layout noticeably. */
    padding: 3px 3px 12px;
    cursor: grab; /* Reskin grab the background or a lane header to pan (see leadSwimlane.js) */
    transition: box-shadow var(--motion-component, 200ms) var(--ease-out, ease-out);
}

.swimlane-board--panning {
    cursor: grabbing;
    user-select: none;
}

/* Reskin "scroll to see more lanes" affordance - there's usually more dealer progress lanes than
   fit on one screen, and a bare overflow-x:auto board gives no hint of that until the user
   happens to scroll/drag it. leadSwimlane.js's updateScrollFade toggles these two classes off
   .swimlane-board's own scrollLeft/scrollWidth (on load, on scroll, on resize, whenever the lane
   count/width changes) - independently per edge, so a board scrolled all the way right only
   fades on the left, etc. Two effects combine on whichever edge(s) have more content:
   1) mask-image fades that edge's lane(s) toward transparent (revealing the page background
      through it) - the visual "there's a sliver of something here" cue. Purely decorative -
      degrades to no-op (full opacity) in browsers without mask-image support.
   2) box-shadow inset behind it adds actual depth/separation, so the cue still reads even where
      mask-image isn't supported or a lane's own light background makes the fade subtle. */
.swimlane-board {
    --swimlane-fade-w: 36px;
    -webkit-mask-image: linear-gradient(to right, black, black);
    mask-image: linear-gradient(to right, black, black);
}

.swimlane-board--fade-left {
    -webkit-mask-image: linear-gradient(to right, transparent, black var(--swimlane-fade-w));
    mask-image: linear-gradient(to right, transparent, black var(--swimlane-fade-w));
    box-shadow: inset 12px 0 12px -12px rgba(0, 0, 0, .18);
}

.swimlane-board--fade-right {
    -webkit-mask-image: linear-gradient(to left, transparent, black var(--swimlane-fade-w));
    mask-image: linear-gradient(to left, transparent, black var(--swimlane-fade-w));
    box-shadow: inset -12px 0 12px -12px rgba(0, 0, 0, .18);
}

.swimlane-board--fade-left.swimlane-board--fade-right {
    -webkit-mask-image: linear-gradient(to right, transparent, black var(--swimlane-fade-w), black calc(100% - var(--swimlane-fade-w)), transparent);
    mask-image: linear-gradient(to right, transparent, black var(--swimlane-fade-w), black calc(100% - var(--swimlane-fade-w)), transparent);
    box-shadow: inset 12px 0 12px -12px rgba(0, 0, 0, .18), inset -12px 0 12px -12px rgba(0, 0, 0, .18);
}

/* Reskin "scroll to see more lanes" nav arrows - alternative/companion to the fade above. Sits
   on lead-swimlane-board itself (the directive's own host element, a sibling of .swimlane-board,
   not a descendant) so the buttons stay fixed in place over the board while it scrolls beneath
   them. Hidden by default (opacity/pointer-events) and only shown on whichever edge(s) still have
   more lanes to scroll to - same trigger (leadSwimlane.js updateScrollFade) as the fade classes. */
lead-swimlane-board {
    display: block;
    position: relative;
}

.swimlane-board-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 3;
    width: 32px;
    height: 32px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--surface-card, #fff);
    border: 1px solid var(--border-default, #E2E5E8);
    box-shadow: var(--elevation-2, 0 4px 12px rgba(0, 0, 0, .12));
    color: var(--text-primary, #333);
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--motion-component, 200ms) var(--ease-out, ease-out);
}

.swimlane-board-nav svg {
    display: block;
}

.swimlane-board-nav:hover {
    background: var(--surface-subtle, #F7F8F9);
}

.swimlane-board-nav--left {
    left: 8px;
}

.swimlane-board-nav--right {
    right: 8px;
}

.swimlane-board-nav--visible {
    opacity: 1;
    pointer-events: auto;
}

.swimlane-lane {
    flex: 0 0 280px;
    width: 280px;
    background: var(--surface-subtle, #F7F8F9);
    border: 1px solid var(--border-default, #E2E5E8);
    border-radius: var(--radius-md, 6px);
    display: flex;
    flex-direction: column;
    /* Reskin --swimlane-lane-max-height is computed at runtime from the board's actual position
       on the page (see leadSwimlaneBoard's recalcLaneMaxHeight in leadSwimlane.js), so the lanes
       always fill exactly the space left below the board regardless of how much is rendered above
       it (filters, Lead Summary expanded/collapsed, window resize) - a fixed calc(100vh - Npx)
       offset only matched one specific layout state and produced a page scrollbar in every other.
       The calc() here is only a same-as-before fallback for the brief moment before that first runs. */
    max-height: var(--swimlane-lane-max-height, calc(100vh - 320px));
    transition: border-color 0.15s ease-out, flex-basis 0.3s ease-out, width 0.3s ease-out;
}

/* Reskin briefly highlights the lane a Lead Summary card click jumped to, using the lane's
   own accent colour (--lane-accent, set inline per-lane in leadSwimlane.js) instead of a
   fixed colour. Only border-color changes (no box-shadow ring) so the border stays 1px on
   every edge while fading back to grey via the transition above. Top border is left alone -
   .swimlane-lane__header already shows a static (non-fading) 3px accent border-top right
   above it, so fading the outer top edge too made the top corners look out of sync with the
   still-fading side borders during the transition. */
.swimlane-lane--focused {
    border-right-color: var(--lane-accent, var(--ap-red, #b0121b));
    border-bottom-color: var(--lane-accent, var(--ap-red, #b0121b));
    border-left-color: var(--lane-accent, var(--ap-red, #b0121b));
}

/* Reskin narrows lanes with zero leads so a mostly-empty board doesn't waste as much horizontal
   space - driven by lane.leadCount (the true total), not lane.cards.length, so a lane doesn't
   flash narrow while its cards are still loading/paging in. Still a valid drop target at this
   width (swimlane-lane__body keeps its ui-sortable wiring/min-height below), and snaps back to
   the full lane width once a card lands and leadCount increments. */
.swimlane-lane--empty {
    flex: 0 0 160px;
    width: 160px;
}

.swimlane-lane__header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border-radius: var(--radius-md, 6px) var(--radius-md, 6px) 0 0;
    border-bottom: 1px solid var(--border-default, #E2E5E8);
    cursor: grab;
}

/* DS lane header - a coloured status dot (lane accent) instead of an icon. */
.swimlane-lane__dot {
    flex: 0 0 auto;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--lane-accent, var(--ap-red, #DD2323));
}

.swimlane-lane__title {
    flex: 0 1 auto; /* don't grow - keeps the count pill immediately to the right of the name */
    min-width: 0;
    font-family: var(--font-condensed, 'Barlow Condensed', var(--font-body, sans-serif));
    font-weight: 700;
    font-size: 13px;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--ink-900, #16191B);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* DS count = neutral light-grey pill with muted text (not lane-coloured) */
.swimlane-lane__count {
    flex: 0 0 auto;
    font-weight: 700;
    font-size: 12px;
    min-width: 22px;
    height: 20px;
    padding: 0 7px;
    line-height: 1; /* collapse the line box so the digit centres vertically in the pill */
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--status-neutral-bg, #ECEEF0);
    color: var(--text-muted, #6B7280);
}

/* Reskin swimlane drag-drop - lane where every step is blocked by the dealer's "only via Events
   and Actions" setting (LeadSwimlaneLaneDetails.Blocked), so a drop here is rejected instantly
   client-side. Muted rather than hidden - the lane's existing leads still need to be visible. */
.swimlane-lane--blocked {
    opacity: 0.6;
}

.swimlane-lane__lock {
    display: inline-flex;
    align-items: center;
    color: var(--text-muted, #6B7280);
    cursor: help;
}

.swimlane-lane__body {
    padding: 10px;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 10px;
    /* Reskin without flex:1/min-height:0, a flex column child with a max-height ancestor
       can get squeezed instead of scrolling, which then shrinks its own flex children (the
       fixed-height cards below) rather than growing past the lane's max-height and letting
       this overflow-y:auto handle it. */
    flex: 1 1 auto;
    min-height: 120px; /* Reskin swimlane drag-drop - empty lanes still need a droppable area */
}

/* Reskin swimlane per-lane paging - footer shown at the bottom of a lane's card list while more
   pages remain (either fires the button or shows the spinner while a page is loading). Sits
   after the ng-repeat and isn't a .swimlane-card, so the sortable's "> .swimlane-card" item
   selector never picks it up as a draggable/droppable item. */
.swimlane-lane__load-more {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 6px 0;
}

/* DS board lanes are neutral light columns (the per-lane colour lives in the header dot + each
   card's left rail), so the board lanes stay on .swimlane-lane's own --surface-subtle background.
   The per-lane pastel tints are kept ONLY for the Lead Summary stat tiles, which carry their own
   higher-specificity .lead-swimlane-summary rules above - these board-lane overrides are now inert
   (transparent) so they no longer tint the columns. */
.swimlane-lane--neutral,
.swimlane-lane--info,
.swimlane-lane--primary,
.swimlane-lane--warning,
.swimlane-lane--success,
.swimlane-lane--danger { background: var(--surface-subtle, #F7F8F9); }

/* ===== Card flip wrapper - same mechanics as .listing-card in listingCard.css ===== */
.swimlane-card {
    position: relative; /* Reskin anchors the drag-drop busy overlay */
    perspective: 1000px;
    height: 336px; /* DS lead card - 140px image banner + title + meta grid + next-action chip +
                       footer. The back face's detail list scrolls within this height. */
    flex-shrink: 0; /* Reskin never compress cards when there are many - the lane scrolls instead */
    cursor: grab; /* Reskin swimlane drag-drop */
}

/* ===== Swimlane drag-drop ===== */
.swimlane-card--locked,
.swimlane-card--busy {
    cursor: default;
}

.swimlane-card--placeholder {
    /* Fallback colours below (data-lane-colour is always set by getLaneColourName's "other" ->
       neutral fallback, so this branch is not expected to be hit in practice). */
    border: 2px dashed var(--border-default, #bbb);
    background: rgba(0, 0, 0, .03);
    border-radius: var(--radius-md, 6px);
    visibility: visible !important;
    overflow: hidden;
    /* Reskin swimlane drag-drop dotted line - without this, the placeholder is the only flex
       item in .swimlane-lane__body without flex-shrink:0 (unlike .swimlane-card above), so
       whenever a lane's cards don't all fit, flex layout crushes the placeholder down to ~4px
       (just its border) instead of leaving it at the height leadSwimlane.js's forcePlaceholderSize
       sets - the lane already relies on overflow-y:auto for actual overflow, not shrinking. */
    flex-shrink: 0;
    transition: height .18s var(--ease-out, ease-out), opacity .18s var(--ease-out, ease-out);
}

/* Reskin swimlane drag-drop dotted line - placeholder colour matches the DESTINATION lane's own
   accent (the same tokens already used for that lane's header top-border/card left-border below),
   not a single fixed colour - see leadSwimlane.js's start handler for the grow-open animation this
   pairs with. */
.swimlane-lane__body[data-lane-colour="neutral"] .swimlane-card--placeholder { border-color: var(--text-muted, #6B7280); background: var(--status-neutral-bg, #ECEEF0); }
.swimlane-lane__body[data-lane-colour="info"]    .swimlane-card--placeholder { border-color: var(--status-info, #1A6FB5); background: var(--status-info-bg, #E4EFF7); }
.swimlane-lane__body[data-lane-colour="primary"] .swimlane-card--placeholder { border-color: var(--brand-primary, #DD2323); background: var(--ap-red-050, #FEF2F2); }
.swimlane-lane__body[data-lane-colour="warning"] .swimlane-card--placeholder { border-color: var(--status-warning, #E08400); background: var(--status-warning-bg, #FBF0DE); }
.swimlane-lane__body[data-lane-colour="success"] .swimlane-card--placeholder { border-color: var(--status-open, #2E7D32); background: var(--status-open-bg, #E7F3E8); }
.swimlane-lane__body[data-lane-colour="danger"]  .swimlane-card--placeholder { border-color: var(--status-lost, #B81C1C); background: var(--status-lost-bg, #FCE3E3); }

.swimlane-lane__body .ui-sortable-helper {
    box-shadow: 0 8px 20px rgba(0, 0, 0, .25);
}

.swimlane-card__busy-overlay {
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, .6);
    border-radius: var(--radius-md, 6px);
    z-index: 2;
}

.swimlane-card__inner {
    position: relative;
    width: 100%;
    height: 100%;
    transform-style: preserve-3d;
    transition: transform 0.4s var(--ease-out, ease-out);
}

.swimlane-card--flipped .swimlane-card__inner {
    transform: rotateY(180deg);
}

.swimlane-card__face {
    position: absolute;
    top: 0; left: 0;
    width: 100%;
    height: 100%;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
    background: var(--surface-card, #fff);
    border: 1px solid var(--border-default, #ddd);
    border-radius: var(--radius-md, 6px);
    box-shadow: var(--elevation-1, 0 1px 4px rgba(0,0,0,0.08));
    padding: 0; /* DS lead card - image banner is full-bleed; content sections pad themselves */
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.swimlane-card__face--back {
    transform: rotateY(180deg);
}

/* Reskin each card carries a 3px left accent in its lane's saturated colour, matching the lane
   header's top accent. The face already sets an opaque background (above), so the shared pastel
   .swimlane-lane--{colour} rule doesn't show through; this only overrides the left border of the
   1px shorthand set on .swimlane-card__face. */
.swimlane-card__face.swimlane-lane--neutral { border-left: 3px solid var(--text-muted, #6B7280); }
.swimlane-card__face.swimlane-lane--info    { border-left: 3px solid var(--status-info, #1A6FB5); }
.swimlane-card__face.swimlane-lane--primary { border-left: 3px solid var(--brand-primary, #DD2323); }
.swimlane-card__face.swimlane-lane--warning { border-left: 3px solid var(--status-warning, #E08400); }
.swimlane-card__face.swimlane-lane--success { border-left: 3px solid var(--status-open, #2E7D32); }
.swimlane-card__face.swimlane-lane--danger  { border-left: 3px solid var(--status-lost, #B81C1C); }

/* SPW-14068 status rail - the left edge is driven by the lead's STATUS, overriding the lane colour
   above: orange when the next action is overdue, red when stalled, neutral grey otherwise. Applied
   via card.$railClass (LeadController.getRailClassFor); only the colour is overridden, so the 3px
   width/style from the lane rule is kept. Every card gets one of these, so the lane colour no longer
   shows on the rail (the lane grouping already conveys the stage). Overdue/stalled are exclusive. */
.swimlane-card__face.swimlane-card__face--rail-default { border-left-color: var(--border-default, #E2E5E8); }
.swimlane-card__face.swimlane-card__face--rail-overdue { border-left-color: var(--status-warning, #E08400); }
.swimlane-card__face.swimlane-card__face--rail-stalled { border-left-color: var(--status-lost, #B81C1C); }

/* DS bulk-select - a selected card gets a thicker red border on the top/right/bottom (the design's
   "FRONT · SELECTABLE" state). The left border is deliberately untouched so it keeps the status rail
   (set by .swimlane-card__face--rail-* above). */
.swimlane-card__face.swimlane-card__face--selected {
    border-top: 2px solid var(--brand-primary, #DD2323);
    border-right: 2px solid var(--brand-primary, #DD2323);
    border-bottom: 2px solid var(--brand-primary, #DD2323);
}

/* ===== DS lead card - shared micro-label (Barlow Condensed uppercase eyebrow) ===== */
.swimlane-card__eyebrow {
    display: block;
    font-family: var(--font-condensed, 'Barlow Condensed', var(--font-body, sans-serif));
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    line-height: 1.2;
    color: var(--text-muted, #6B7280);
}

/* ===== Front: image banner (full-bleed) with temperature dot + bulk-select checkbox ===== */
.swimlane-card__media {
    position: relative;
    width: 100%;
    height: 140px;
    flex-shrink: 0;
    background: var(--status-neutral-bg, #ECEEF0);
    overflow: hidden;
}

/* Leads with no listing just show the media container's own neutral background as a placeholder. */

/* listing-image renders a .autoplay-image div (with an inline height) wrapping an <img>; stretch
   both to fill the banner. The image is already server-cropped to 260x120, so object-fit:cover is
   just a safety net against any aspect drift. */
.swimlane-card__image,
.swimlane-card__image .autoplay-image {
    display: block;
    width: 100%;
    height: 140px;
}

.swimlane-card__image .autoplay-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* DS status overlays (ON TEST DRIVE / ON LOAN / INCENTIVE / etc.) - scoped to the swimlane card
   ONLY (the list view keeps its own autoplay-image.css treatment). The shared rules size these to a
   fixed w-variant width and sit them button-like; here we make them a compact solid badge tucked
   into the bottom-RIGHT corner (SPW-14068 - the bottom-left is now the stage/progress badge),
   matching the design's vehicle-availability position. Colours still come from the bannerClass. */
.swimlane-card__media .autoplay-image .listing-image-status {
    left: auto;
    right: 8px;
    bottom: 8px;
    width: auto;
    height: auto;
    padding: 3px 8px;
    font-family: var(--font-condensed, 'Barlow Condensed', var(--font-body, sans-serif));
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .04em;
    line-height: 1;
    text-transform: uppercase;
    text-align: left;
    border: none;
    border-radius: var(--radius-sm, 4px);
    box-shadow: none;
}

.swimlane-card__select {
    position: absolute;
    top: 6px;
    left: 6px;
    z-index: 2;
    margin: 0;
}

.swimlane-card__select input {
    width: 18px;
    height: 18px;
    cursor: pointer;
    accent-color: var(--brand-primary, #DD2323);
}

/* ===== Priority pill (SPW-14068) - DS lead-card priority as a labelled Cold/Mild/Hot badge.
   Front: overlaid top-right on the image. Back: inline in the Lead Detail header. Colours reuse
   the DS priority taxonomy (cold = info blue, mild = hold amber, hot = urgent red). The pill's
   own tonal fill + a soft drop shadow keep it legible over any vehicle photo. ===== */
.swimlane-card__priority {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    /* size by symmetric vertical padding (not a fixed height + flex-centring) so the
       Barlow-Condensed uppercase label sits optically centred, with equal space above/below */
    padding: 4px 8px;
    border-radius: 999px;
    font-family: var(--font-condensed, 'Barlow Condensed', var(--font-body, sans-serif));
    font-weight: 700;
    font-size: 10.5px;
    letter-spacing: .05em;
    line-height: 1;
    text-transform: uppercase;
    box-shadow: 0 1px 3px rgba(0, 0, 0, .18);
}

.swimlane-card__priority-dot {
    flex: 0 0 auto;
    width: 7px;
    height: 7px;
    border-radius: 50%;
}

.swimlane-card__priority-flame {
    flex: 0 0 auto;
    display: block;
}

.swimlane-card__priority-label {
    line-height: 1;
}

.swimlane-card__priority--cold { background: var(--priority-cold-bg, #E4EFF7); color: var(--priority-cold-fg, #1A6FB5); }
.swimlane-card__priority--cold .swimlane-card__priority-dot { background: var(--priority-cold, #1A6FB5); }
.swimlane-card__priority--mild { background: var(--priority-mild-bg, #FBF0DE); color: var(--priority-mild-fg, #9A5A00); }
.swimlane-card__priority--mild .swimlane-card__priority-dot { background: var(--priority-mild, #E08400); }
.swimlane-card__priority--hot  { background: var(--priority-hot-bg, #FBEAE7);  color: var(--priority-hot-fg, #C0392B); }
.swimlane-card__priority--hot  .swimlane-card__priority-dot { background: var(--priority-hot, #C0392B); }

/* Inline variant on the back face's Lead Detail header - not overlaid, no shadow needed on white. */
.swimlane-card__priority--inline { position: static; box-shadow: none; }

/* ===== Stage / progress badge (SPW-14068) - bottom-left over the image, showing the lead's
   progress step. Text + colour mirror this card's swimlane lane header ("same as the swimlane
   title") - a solid lane-colour fill with white text (DS Badge tone="solid"). ===== */
.swimlane-card__stage {
    position: absolute;
    left: 8px;
    bottom: 8px;
    z-index: 2;
    /* SPW-14164: cap the width so a long progress name (e.g. "Trade In Valuation/Appraisal") stays
       clear of the bottom-right vehicle-status badge, but wide enough that most progress names fit.
       border-box so the cap is the whole badge width, not just the text. inline-block (not
       inline-flex) so text-overflow:ellipsis truncates the bare text node reliably inside the pill. */
    box-sizing: border-box;
    max-width: 150px;
    display: inline-block;
    padding: 3px 8px;
    border-radius: var(--radius-sm, 4px);
    font-family: var(--font-condensed, 'Barlow Condensed', var(--font-body, sans-serif));
    font-weight: 700;
    font-size: 11px;
    letter-spacing: .04em;
    line-height: 1;
    text-transform: uppercase;
    color: #fff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    background: var(--text-muted, #6B7280); /* neutral default; per-lane colour below */
    box-shadow: 0 1px 3px rgba(0, 0, 0, .3);
}

.swimlane-card__stage.swimlane-lane--neutral { background: var(--text-muted, #6B7280); }
.swimlane-card__stage.swimlane-lane--info    { background: var(--status-info, #1A6FB5); }
.swimlane-card__stage.swimlane-lane--primary { background: var(--brand-primary, #DD2323); }
.swimlane-card__stage.swimlane-lane--warning { background: var(--status-warning, #E08400); }
.swimlane-card__stage.swimlane-lane--success { background: var(--status-open, #2E7D32); }
.swimlane-card__stage.swimlane-lane--danger  { background: var(--status-lost, #B81C1C); }

/* ===== Front: vehicle title ===== */
.swimlane-card__title-row {
    padding: 8px 10px 0;
}

.swimlane-card__vehicle {
    display: block;
    font-weight: 700;
    font-size: 14px;
    line-height: 1.2;
    color: var(--ink-900, #16191B);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* No listing on the lead - muted italic label, matching the list view's "No Listing Selected". */
.swimlane-card__vehicle--empty {
    font-weight: 600;
    font-style: italic;
    color: var(--text-muted, #6B7280);
}

/* ===== Front: LEAD ID / CUSTOMER meta grid ===== */
.swimlane-card__meta {
    display: flex;
    gap: 10px;
    padding: 6px 10px 0;
}

/* SPW-14210: hold the column open for all three lines (eyebrow + value + company sub-line) even when
   the lead has no company. The sub-line is ng-if'd out of the DOM when contactCompany is empty, which
   used to make the Customer column ~13px shorter - and since both columns are flex:1 1 0 that shrank
   the whole meta row and rode the Next Action box up, so a lead with a company sat differently to one
   without. 12px eyebrow + 16px value + 14px sub = 42px. */
.swimlane-card__meta-col {
    flex: 1 1 0;
    min-width: 0;
    min-height: 42px;
}

.swimlane-card__meta-value {
    display: block;
    font-size: 12px;
    line-height: 16px; /* SPW-14210: explicit, so the 42px reservation above is deterministic */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.swimlane-card__meta-value--mono {
    font-family: var(--font-mono, ui-monospace, 'Consolas', monospace);
    font-size: 11px;
    color: var(--text-primary, #333);
}

.swimlane-card__meta-value--name {
    color: var(--text-primary, #333);
    font-weight: 600;
}

.swimlane-card__meta-sub {
    display: block;
    font-size: 11px;
    line-height: 14px; /* SPW-14210: explicit, so the 42px reservation above is deterministic */
    color: var(--text-muted, #6B7280);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ===== Front: NEXT ACTION calendar chip ===== */
.swimlane-card__next {
    padding: 8px 10px 0;
}

/* DS next-action is a bordered box. Neutral by default (grey border + grey text); the whole box
   tints to the overdue severity below - the box's `color` cascades to every child via `inherit`. */
.swimlane-card__next-row {
    display: flex;
    gap: 8px;
    align-items: stretch;
    margin-top: 3px;
    padding: 5px;
    border: 1px solid var(--border-default, #E2E5E8);
    border-radius: var(--radius-sm, 4px);
    background: var(--surface-subtle, #F7F8F9);
    color: var(--text-muted, #6B7280);
}

.swimlane-card__cal {
    flex: 0 0 auto;
    width: 38px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 3px 0;
    background: var(--white, #fff);
    border: 1px solid var(--border-default, #E2E5E8);
    border-radius: var(--radius-sm, 4px);
}

.swimlane-card__cal-day {
    font-family: var(--font-display, inherit);
    font-weight: 800;
    font-size: 16px;
    line-height: 1;
    color: inherit; /* follows the box's neutral/overdue colour */
}

.swimlane-card__cal-mon {
    font-family: var(--font-condensed, 'Barlow Condensed', var(--font-body, sans-serif));
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: inherit;
    opacity: .85;
}

.swimlane-card__next-body {
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 2px;
}

/* DS/SPW-14068 - the title leads with the action NAME, dark and prominent (not the muted box
   colour). It joins the box in red only when overdue (override below). */
/* SPW-14210: the title is now always in the DOM (empty for a legacy action with no type name) and
   its line is reserved here. It used to be ng-if'd out, and because .swimlane-card__next-body is
   justify-content:center that re-centred the date sub-line, so it sat at a different height to the
   neighbouring cards. An empty title renders as blank space, exactly as hiding it used to look. */
.swimlane-card__next-title {
    font-size: 13px;
    line-height: 16px;
    min-height: 16px;
    font-weight: 600;
    color: var(--ink-900, #16191B);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.swimlane-card__next-when {
    font-size: 11px;
    line-height: 14px; /* SPW-14210: explicit, pairs with the reserved title line above */
    color: inherit; /* muted by the box; turns red with the box when overdue */
    opacity: .9;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* clock glyph leading the sub-line */
.swimlane-card__next-clock {
    vertical-align: -2px;
    margin-right: 3px;
}

/* the relative status (Today / Upcoming / Overdue / Stalled / ...) trailing the date */
.swimlane-card__next-status {
    font-weight: 600;
}

/* No next action (SPW-14068) - a brand-red "Create Event" link in place of the box, opening the
   same new-event popup as the back-face Add Event button. */
.swimlane-card__create-event {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 3px;
    padding: 0;
    border: none;
    background: transparent;
    cursor: pointer;
    font-family: var(--font-body, inherit);
    font-size: 13px;
    font-weight: 600;
    color: var(--brand-primary, #DD2323);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.swimlane-card__create-event svg {
    flex: 0 0 auto;
}

.swimlane-card__create-event:hover {
    color: var(--ap-red-700, #B81C1C);
}

/* SPW-14068 - the NEXT ACTION box is clickable (opens its event in the edit popup); pointer + a
   brand-red hover cue, matching the DS onEditEvent affordance. */
.swimlane-card__next-row--clickable {
    cursor: pointer;
    transition: border-color .12s var(--ease-out, ease-out), box-shadow .12s var(--ease-out, ease-out);
}

.swimlane-card__next-row--clickable:hover {
    border-color: var(--brand-primary, #DD2323);
    box-shadow: 0 0 0 3px var(--ap-red-050, #FEF2F2);
}

/* Overdue tints the whole box red - border + background + text (via inherited color). Both the
   1-7 day and the stalled >7 day states use red. */
.swimlane-card__next.swimlane-card__overdue--warning .swimlane-card__next-row,
.swimlane-card__next.swimlane-card__overdue--aged .swimlane-card__next-row {
    border-color: var(--status-lost, #B81C1C);
    background: var(--status-lost-bg, #FCE3E3);
    color: var(--status-lost, #B81C1C);
}
/* Overdue calendar square = solid red fill with white text (per the design). day/mon inherit. */
.swimlane-card__next.swimlane-card__overdue--warning .swimlane-card__cal,
.swimlane-card__next.swimlane-card__overdue--aged .swimlane-card__cal {
    background: var(--status-lost, #B81C1C);
    border-color: var(--status-lost, #B81C1C);
    color: #fff;
}
/* The dark action-name title joins the rest of the box in red when overdue, and the relative
   status (Overdue / Stalled) is emphasised. */
.swimlane-card__next.swimlane-card__overdue--warning .swimlane-card__next-title,
.swimlane-card__next.swimlane-card__overdue--aged .swimlane-card__next-title {
    color: var(--status-lost, #B81C1C);
}
.swimlane-card__next.swimlane-card__overdue--warning .swimlane-card__next-status,
.swimlane-card__next.swimlane-card__overdue--aged .swimlane-card__next-status {
    font-weight: 700;
}

/* ===== Footer (both faces) ===== */
.swimlane-card__footer {
    margin-top: auto;
    padding: 8px 10px;
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
}

/* DS primary action - red fill, white text, eye icon (overrides Bootstrap .btn-default).
   Two classes to beat .btn-default's own colour rules. */
.swimlane-card__view-btn.btn,
.swimlane-card__view-btn {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 30px;
    line-height: 1; /* drop Bootstrap's 1.43 line-height so the icon + label sit centred */
    font-size: 12px;
    padding: 0 8px;
    background-color: var(--brand-primary, #DD2323);
    border-color: var(--brand-primary, #DD2323);
    color: #fff;
}

.swimlane-card__view-btn.btn:hover,
.swimlane-card__view-btn.btn:focus,
.swimlane-card__view-btn:hover,
.swimlane-card__view-btn:focus {
    background-color: var(--ap-red-600, #B0121B);
    border-color: var(--ap-red-600, #B0121B);
    color: #fff;
}

.swimlane-card__view-btn svg {
    flex: 0 0 auto;
}

/* Round grey flip button (DS) - on both faces; icon centred, pinned to the far right of the footer. */
.swimlane-card__flip-btn {
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    padding: 0;
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 50%;
    background: var(--status-neutral-bg, #ECEEF0);
    color: var(--text-muted, #6B7280);
    cursor: pointer;
}

.swimlane-card__flip-btn:hover {
    background: var(--border-default, #E2E5E8);
}

/* Action buttons (back) - rectangular, red border, white background, red icon (per the design).
   flex:1 so Comms + Allocate (and a future Add-event) grow to fill the footer width, sitting flush
   with the fixed-width flip button on the right. */
.swimlane-card__icon-btn {
    flex: 1 1 0;
    height: 30px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--brand-primary, #DD2323);
    border-radius: var(--radius-sm, 4px);
    background: var(--surface-card, #fff);
    color: var(--brand-primary, #DD2323);
    cursor: pointer;
}

.swimlane-card__icon-btn:hover {
    background: var(--ap-red-050, #FEF2F2);
}

.swimlane-card__flip-btn svg,
.swimlane-card__icon-btn svg {
    display: block;
}

/* ===== Avatars ===== */
/* Assignee (footer): red initials on a light-red circle, per the design. line-height:0 + the
   flex centring keeps the two letters optically centred (font ascent/descent no longer adds an
   uneven line box). */
.swimlane-card__avatar {
    flex: 0 0 auto;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--ap-red-050, #FEF2F2);
    color: var(--brand-primary, #DD2323);
    font-size: 11px;
    font-weight: 700;
    line-height: 0;
}

/* Collaborator stack (back): overlapping avatars (~50% larger than before), each with its own
   inline colour + a white ring so the overlap reads cleanly. */
.swimlane-card__avatar--sm {
    width: 30px;
    height: 30px;
    font-size: 13px;
    color: #fff;
    border: 2px solid var(--surface-card, #fff);
}

.swimlane-card__avatar--sm:not(:first-child) {
    margin-left: -10px;
}

/* ===== Back: Lead Detail panel ===== */
.swimlane-card__back-head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 10px 6px;
    border-bottom: 1px solid var(--border-default, #E2E5E8);
    flex-shrink: 0;
}

.swimlane-card__back-title {
    flex: 1 1 auto;
    font-weight: 700;
    font-size: 13px;
}

.swimlane-card__back-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 8px 10px;
}

/* ===== SPW-13607 lead labels =====
   Two surfaces, each matching its own Listing counterpart.

   1. Swimlane card back face - text chips, mirroring .listing-card__label in listingCard.css so
      the Lead and Listing CARDS match. Classes are kept separate rather than shared so the two
      screens' stylesheets stay independent. Colour is per-label and set inline: the label's own
      colour as the text, over a light tint of itself (js/_factories/leadLabelChips.js).
   2. List view (Customer + mobile Details columns) - the colour-only apicon-label glyph the
      Listing LIST view uses, with the name in a tooltip. Only layout is needed here; the glyph
      itself comes from .apicon in style.css. */
.swimlane-card__labels {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 8px;
}

.swimlane-card__label {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    height: 22px;
    padding: 3px 8px;
    border-radius: var(--radius-sm, 4px);
    font-family: var(--font-condensed, 'Barlow Condensed', sans-serif);
    font-weight: 700;
    font-size: 11px;
    letter-spacing: .04em;
    text-transform: uppercase;
    white-space: nowrap;
    line-height: 1;
}

.swimlane-card__label-icon {
    flex-shrink: 0;
}

/* List view - the glyph row sits under the customer details block. Uncapped: the Customer column
   is narrow and its width varies with viewport (~200px at 1512, ~103px at 1024), so rather than
   truncate, the glyphs wrap - a wrapped line costs ~16px against an ~80px row.
   flex-wrap, not plain inline flow: the glyphs are emitted with no whitespace between the spans,
   so as inline elements they would have no break opportunity and would overflow the cell instead
   of wrapping. */
.lead-label-icons {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    row-gap: 2px;
    margin-top: 4px;
    line-height: 1;
}

/* Event Notes (pulled from the lead's next-action log text) */
.swimlane-card__notes-text {
    margin-top: 2px;
    font-size: 12px;
    color: var(--text-muted, #6B7280);
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* A grey divider separates Event Notes -> contact details -> collaborators/lead-origin. There are
   no dividers between the individual contact rows. */
.swimlane-card__notes,
.swimlane-card__contacts {
    padding-bottom: 8px;
    margin-bottom: 8px;
    border-bottom: 1px solid var(--border-default, #E2E5E8);
}

.swimlane-card__contact-row {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 2px 0;
    font-size: 12px;
    color: var(--text-muted, #6B7280); /* email + phones grey, per the design */
}

/* mobile + landline share one row */
.swimlane-card__contact-row--phones {
    gap: 16px;
}

.swimlane-card__contact-item {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    cursor: pointer;
}

/* the email row (no phones modifier) is itself clickable */
.swimlane-card__contact-row:not(.swimlane-card__contact-row--phones) {
    cursor: pointer;
}

.swimlane-card__contact-row svg {
    flex: 0 0 auto;
    color: var(--text-muted, #6B7280);
}

.swimlane-card__contact-row > span,
.swimlane-card__contact-item > span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Collaborators + Lead Created (left column) | Lead Origin (right column) */
.swimlane-card__back-grid {
    display: flex;
    gap: 12px;
}

.swimlane-card__back-col {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.swimlane-card__detail-value {
    display: block;
    font-size: 12px;
    color: var(--text-primary, #333);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.swimlane-card__collab {
    padding: 0;
}

.swimlane-card__avatars {
    display: flex;
    margin-top: 4px;
}

/* Lead Origin sits in the right column, right-aligned. */
.swimlane-card__back-col--right {
    text-align: right;
    align-items: flex-end;
}

/* Reskin: record-workspace section cards + drag-to-reorder
   (workspacePanels.js; .rwp-*). Scoped to form[workspace-panels] so the
   treatment rides with the feature - a screen gets the look only where the
   directive is enabled. Loaded after ds-reskin.css so the DS tokens resolve
   (same convention as listingCard.css / leadSwimlane.css). No url() in this
   file (keeps the CssRewriteUrlTransform rewrite trap moot - see BundleConfig
   ~/bundles/css).
   Tokens absent from this branch's ds-reskin.css use literals matching the DS:
   --fw-bold -> 700, --fw-semibold -> 600, --ls-heading -> -0.01em. */

/* --------------------------------------------------------------------------
   1. Section cards - DS treatment for the uib-accordion panels
   -------------------------------------------------------------------------- */

/* Base .panel and .panel-group .panel in ds-reskin set border/radius/elevation -
   DEV-678 moved the radius there so every accordion in the app gets it, not just
   these screens, so it is deliberately not restated here. */
form[workspace-panels] .panel-default.panel {
    margin-bottom: 12px;
}

/* SPW-14237: this card used to carry overflow: hidden unconditionally, which
   clipped any pop-up that overflowed it. <date-input> wraps uib-datepicker-popup,
   whose appendToBody defaults to false, so the calendar is inserted as a sibling
   of the input - i.e. inside this card. A date field low in a section (Service Due
   on Appraisal, Licence Expires on Test Drive) had its calendar cut off, and
   overflow: hidden leaves no scrollbar to reach the hidden part.
   The clip is only needed while the section is CLOSED: bootstrap hides
   .panel-collapse with display: none, so .panel-heading is then the only visible
   box and its square white bottom corners would paint over the card's rounded
   bottom arc. (:last-child can't express that - the hidden .panel-collapse is
   still the last child.) Open, the last visible box is .panel-body, which has no
   background of its own, so nothing bleeds. uib toggles .panel-open on this
   element - see uibAccordionGroup's link fn. */
form[workspace-panels] .panel-default.panel:not(.panel-open) {
    overflow: hidden;
}

/* DEV-678: Listing Edit and Lead Edit (mobile) render their accordion as
   id="accordion", which listingCard.css targets with
   #accordion .panel-heading { border-radius: var(--radius-md) ... }. That ID
   selector (1,1,0) outranks any class-based heading rule, and listingCard.css
   loads AFTER ds-reskin.css - so the global radius fix cannot reach it and
   those two screens would keep 6px heading corners inside a 10px card, visible
   on their #ddd images row. Carrying the ID here (1,2,0) reclaims it; this file
   loads after listingCard.css, so it is the only place that can.
   NOTE: listingCard.css's #accordion selector is unscoped and also lands on
   seven non-workspace views (Lead/Listing list, Reward edit, both KPI settings,
   Yard summary, AutoGrab Recapture list). They now get a 10px card with a 6px
   heading too - invisible while both are --surface-card white, but the real fix
   is to scope that rule in listingCard.css. Left alone here deliberately. */
form[workspace-panels] #accordion .panel-heading {
    border-radius: var(--radius-lg) var(--radius-lg) 0 0;
}

/* Heading is just a surface; the title anchor fills it. A bottom divider
   fades in when the section opens. */
form[workspace-panels] .panel-heading {
    background: var(--surface-card);
    padding: 0;
    border-bottom: 1px solid transparent;
    -webkit-transition: border-color var(--motion-micro) var(--ease-out);
    transition: border-color var(--motion-micro) var(--ease-out);
}
form[workspace-panels] .panel-title {
    margin: 0;
    font-family: var(--font-display);
}
form[workspace-panels] .panel-title > a {
    display: block;
    position: relative;
    padding: 12px 16px 12px 32px; /* left room for the drag grip */
    font-family: var(--font-display);
    font-weight: 700;
    font-size: 15px;
    letter-spacing: -0.01em;
    color: var(--text-primary);
    text-decoration: none;
    -webkit-transition: background-color var(--motion-micro) var(--ease-out);
    transition: background-color var(--motion-micro) var(--ease-out);
}
/* SPW-14225 - a fixed full-width row has no grip, so it needs no grip gutter. */
form[workspace-panels] [data-rwp-fixed] .panel-title > a { padding-left: 16px; }

form[workspace-panels] .panel-title > a:hover,
form[workspace-panels] .panel-title > a:focus {
    background: var(--ink-050);
    color: var(--text-primary);
    text-decoration: none;
}

/* Open state: heading divider fades in. */
form[workspace-panels] .panel-open > .panel-heading { border-bottom-color: var(--border-default); }

/* Section icon follows the open state; carets stay muted. */
form[workspace-panels] .panel-heading .apicon { color: var(--ink-500); }
form[workspace-panels] .panel-open > .panel-heading .apicon { color: var(--brand-primary); }
form[workspace-panels] .panel-heading .icon-caret-up,
form[workspace-panels] .panel-heading .icon-caret-down { color: var(--ink-400); }

form[workspace-panels] .panel-body { padding: 14px 16px; }

/* DEV-678: full-width image rows carry a tab bar (.nav-tabs-in-accordion - 1st/2nd
   Licence on Test Drive, Images/Reconditioning on Appraisal) that is meant to sit
   flush under the panel heading. Its negative margins in application.css (-11px
   top, -15px sides) were tuned to cancel the legacy .panel-body padding; the
   reskin's 14px/16px left a 3px lip, so the tabs no longer butt against the
   header. Zero the top padding for these rows and let the tab bar bleed to the
   card edges instead of relying on the two values cancelling out. Scoped to
   [data-rwp-fixed] so the tabbed images block on Listing Edit - which keeps the
   standard body padding - is unaffected. */
form[workspace-panels] [data-rwp-fixed] .panel-body { padding-top: 0; }
form[workspace-panels] [data-rwp-fixed] .nav-tabs-in-accordion {
    margin-top: 0;
    margin-left: -16px;
    margin-right: -16px;
}

/* --------------------------------------------------------------------------
   2. Drag-to-reorder affordances (.rwp-*)
   -------------------------------------------------------------------------- */

/* Grip: at the heading's left edge, revealed on hover. */
.rwp-grip {
    position: absolute;
    left: 10px;
    top: 50%;
    margin-top: -9px;
    width: 18px;
    height: 18px;
    color: var(--ink-300);
    opacity: 0;
    cursor: -webkit-grab;
    cursor: grab;
    touch-action: none;
    -webkit-transition: opacity var(--motion-micro) var(--ease-out), color var(--motion-micro) var(--ease-out);
    transition: opacity var(--motion-micro) var(--ease-out), color var(--motion-micro) var(--ease-out);
}
form[workspace-panels] .panel-heading:hover .rwp-grip,
.rwp-grip:focus { opacity: 1; }
.rwp-grip:hover { color: var(--ink-600); }
.rwp-grip:active { cursor: -webkit-grabbing; cursor: grabbing; }

/* Touch devices have no hover - the grip must always be visible there. */
@media (hover: none), (pointer: coarse) {
    form[workspace-panels] .rwp-grip { opacity: 1; }
}

/* Drop target: dashed DS placeholder where the section will land. */
.rwp-placeholder {
    min-height: 48px;
    border: 2px dashed var(--border-strong);
    border-radius: var(--radius-lg);
    background: var(--ink-050);
    margin-bottom: 12px;
    visibility: visible !important;
}

/* The section while airborne. */
form[workspace-panels] .ui-sortable-helper {
    box-shadow: var(--elevation-2);
    -webkit-transform: rotate(.5deg);
    transform: rotate(.5deg);
    opacity: .97;
}

/* Reset control: only rendered when a custom layout is saved. Sits on its own
   row below the floated accordion columns, aligned right. */
.rwp-reset {
    display: block;
    clear: both;
    margin-left: auto;
    font-family: var(--font-display, inherit);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: 11px;
    color: var(--ink-500);
    background: transparent;
    border: 0;
    padding: 7px 15px;
    cursor: pointer;
    white-space: nowrap;
}
.rwp-reset:hover { color: var(--text-primary); text-decoration: underline; }
.rwp-reset:focus { outline: none; }
.rwp-reset:focus-visible { outline: none; box-shadow: 0 0 0 var(--ring-width) var(--ring-color); }

/* Reskin: <comms-timeline> - unified communications timeline (commsTimeline.js).
   Everything is scoped under .comms-timeline. Loaded after ds-reskin.css so the
   DS tokens resolve (same convention as listingCard.css / workspacePanels.css).
   No url() in this file (keeps the CssRewriteUrlTransform rewrite trap moot).
   Local channel-colour tokens (--ct-*) live here because the DS palette has no
   per-channel colours; the hues are tuned to sit alongside --brand-primary. */

.comms-timeline {
    /* per-channel accent colours */
    --ct-email: #3A6FE0;
    --ct-sms: #12A06B;
    --ct-phone: #DF8718;
    --ct-script: #7C5CE0;
    --ct-campaign: #C43F9C;

    --ct-bubble-in: var(--ink-100);
    --ct-bubble-out: var(--surface-card);
    /* SPW-14038 - automation sends sit in the same thread as manual ones, so they get a
       tinted card to separate them at a glance. Deliberately a neutral off the existing ink
       scale rather than a new hue: an automation send is not a sixth channel. One step below
       --ct-bubble-in so that manual/received/automated are three distinct steps: the narrow
       layout is single-column, so an automated card cannot rely on sitting on the opposite
       side of the spine from a received one. */
    --ct-auto-bg: var(--ink-150);

    font-family: var(--font-body);
    color: var(--text-primary);
}

.comms-timeline svg {
    stroke: currentColor;
    stroke-width: 1.7;
    fill: none;
    stroke-linejoin: round;
    stroke-linecap: round;
    display: block;
}

.comms-timeline time,
.comms-timeline .ct-filter__count,
.comms-timeline .ct-eye,
.comms-timeline .ct-tick {
    font-family: var(--font-mono);
    font-variant-numeric: tabular-nums;
}

/* ==========================================================================
   Toolbar
   ========================================================================== */
.comms-timeline .ct-toolbar {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-bottom: 12px;
    margin-bottom: 6px;
    border-bottom: 1px solid var(--border-default);
}
.comms-timeline .ct-toolbar__row { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
/* SPW-14038 - min-width:max-content stops the chip group being squeezed, so a row too
   narrow to hold chips + sort drops the SORT button to its own line instead of wrapping
   or clipping the chips. margin-left:auto keeps sort right-aligned on whichever line it
   lands on. The breakpoint below guarantees the row is always wide enough for the chips
   themselves, which is what makes max-content safe here (it cannot overflow).
   NB: `min(100%, max-content)` is invalid - min() takes lengths, not intrinsic keywords -
   and is silently dropped, which lets the group shrink and the chips wrap. */
.comms-timeline .ct-toolbar__filters .ct-filters { flex: 1 1 auto; min-width: max-content; }
.comms-timeline .ct-toolbar__filters .ct-sort { flex: 0 0 auto; margin-left: auto; }

.comms-timeline .ct-filters {
    display: flex;
    flex-wrap: nowrap;
    gap: 3px;
}

.comms-timeline .ct-filter {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    white-space: nowrap;
    font-family: inherit;
    font-size: 10px;
    font-weight: 600;
    /* SPW-14227 - line-height:normal makes the line box match the text's ink box, so the
       half-leading (which the inherited 1.538 line-height dropped entirely below the text,
       sitting it ~1.4px high) disappears and the label centres exactly. The padding is
       bumped 6px -> 7px to keep the chip the same height it was. */
    line-height: normal;
    color: var(--text-secondary);
    background: var(--ink-050);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-md);
    padding: 7px 8px;
    cursor: pointer;
    -webkit-transition: background var(--motion-micro) var(--ease-out), color var(--motion-micro) var(--ease-out), border-color var(--motion-micro) var(--ease-out);
    transition: background var(--motion-micro) var(--ease-out), color var(--motion-micro) var(--ease-out), border-color var(--motion-micro) var(--ease-out);
}

.comms-timeline .ct-filter .ct-filter__ico svg { width: 12px; height: 12px; opacity: .85; }
.comms-timeline .ct-filter:hover { color: var(--text-primary); border-color: var(--border-strong); }

/* selected chip is always the one dark colour (matches the sort button) */
.comms-timeline .ct-filter.is-active { color: #fff; background: var(--ink-800); border-color: var(--ink-800); }

.comms-timeline .ct-filter__pref { color: var(--status-warning); font-size: 11px; line-height: 1; }
.comms-timeline .ct-filter.is-active .ct-filter__pref { color: #fff; }
.comms-timeline .ct-filter__count {
    font-size: 10px;
    background: rgba(0,0,0,.10);
    border-radius: var(--radius-pill);
    padding: 0 6px;
}
.comms-timeline .ct-filter.is-active .ct-filter__count { background: rgba(255,255,255,.22); }

/* SPW-14038 - the automation scope follows the channel chips but is not one of them: it
   modifies what they count and show, and can be lit at the same time as one of them. Set
   apart by a gap, and given a lighter active fill than a channel chip so that "scope lit"
   and "channel lit" stay legible as two different things when both are on at once. */
.comms-timeline .ct-filter--scope { margin-left: 12px; }
.comms-timeline .ct-filter--scope.is-active { background: var(--ink-600); border-color: var(--ink-600); }

/* mobile filter dropdown - hidden on desktop */
.comms-timeline .ct-filter-mobile { display: none; position: relative; }
.comms-timeline .ct-filter-mobile .ct-filter { background: var(--ink-800); color: #fff; border-color: var(--ink-800); }
.comms-timeline .ct-filter-menu { min-width: 160px; }
.comms-timeline .ct-filter-menu a { display: flex; align-items: center; justify-content: space-between; gap: 10px; cursor: pointer; }
.comms-timeline .ct-filter-menu a.is-active { color: var(--brand-primary); font-weight: 600; }

/* actions */
.comms-timeline .ct-actions { gap: 8px; justify-content: flex-end; }

.comms-timeline .ct-btn {
    display: inline-flex;
    align-items: center;
    /* SPW-14227 - centre the label exactly: justify-content pins it horizontally, and
       line-height:normal makes the line box match the text's ink box so the inherited
       1.538 line-height no longer parks all of its half-leading below the text (which
       sat every button label ~1.9px high). Padding 4px -> 5px keeps the original height. */
    justify-content: center;
    line-height: normal;
    gap: 0px;
    font-family: inherit;
    font-size: 11px;
    font-weight: 600;
    border-radius: var(--radius-md);
    padding: 5px 9px;
    cursor: pointer;
    border: 1px solid var(--border-default);
    background: var(--ink-050);
    color: var(--text-secondary);
    white-space: nowrap;
}
.comms-timeline .ct-btn--ghost:hover { color: var(--text-primary); border-color: var(--border-strong); }
/* compose actions: red outline, no fill */
.comms-timeline .ct-btn--brand { background: transparent; border-color: var(--brand-primary); color: var(--brand-primary); }
.comms-timeline .ct-btn--brand:hover { background: var(--brand-primary-050); border-color: var(--brand-primary-700); color: var(--brand-primary-700); }
/* sort/order button - dark grey, matching the active "All" filter chip */
.comms-timeline .ct-sort { background: var(--ink-800); border-color: var(--ink-800); color: #fff; }
.comms-timeline .ct-sort:hover { background: var(--ink-900); border-color: var(--ink-900); color: #fff; }
.comms-timeline .ct-sort svg { opacity: .85; }

/* ==========================================================================
   Conversation thread + spine
   ========================================================================== */
.comms-timeline .ct-thread {
    position: relative;
    padding: 16px 8px 4px 4px;
    display: flex;
    flex-direction: column;
    max-height: var(--ct-max-h, 460px);
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
}
.comms-timeline .ct-thread::-webkit-scrollbar { width: 9px; }
.comms-timeline .ct-thread::-webkit-scrollbar-thumb { background: var(--border-default); border: 2px solid var(--surface-card); border-radius: 9px; }
.comms-timeline .ct-thread::-webkit-scrollbar-thumb:hover { background: var(--border-strong); }

/* the centre spine - hidden when there is nothing to plot on it */
.comms-timeline .ct-thread--empty::before { display: none; }
.comms-timeline .ct-thread::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 22px;
    left: 50%;
    width: 2px;
    margin-left: -1px;
    background: linear-gradient(var(--border-default), var(--border-default) 60%, transparent);
    border-radius: 2px;
}

/* the ng-repeat wrapper divs must not break the flex column rhythm */
.comms-timeline .ct-thread > .ct-row { display: contents; }

.comms-timeline .ct-daybreak {
    position: -webkit-sticky;
    position: sticky;
    top: 4px;
    text-align: center;
    margin: 6px 0 14px;
    z-index: 4;
}
.comms-timeline .ct-daybreak span {
    font-family: var(--font-mono);
    font-size: 10.5px;
    letter-spacing: .06em;
    color: var(--ink-500);
    background: var(--surface-card);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-pill);
    padding: 3px 12px;
}

/* ==========================================================================
   Event cards
   ========================================================================== */
.comms-timeline .ct-ev {
    position: relative;
    width: calc(50% - 22px);
    margin-bottom: 14px;
    outline: none;
}
.comms-timeline .ct-ev[data-channel="email"] { --h: var(--ct-email); }
.comms-timeline .ct-ev[data-channel="sms"] { --h: var(--ct-sms); }
.comms-timeline .ct-ev[data-channel="phone"] { --h: var(--ct-phone); }
.comms-timeline .ct-ev[data-channel="callscript"] { --h: var(--ct-script); }
.comms-timeline .ct-ev[data-channel="campaign"] { --h: var(--ct-campaign); }

.comms-timeline .ct-ev[data-dir="in"] { align-self: flex-start; }
.comms-timeline .ct-ev[data-dir="out"] { align-self: flex-end; }
.comms-timeline .ct-ev.is-clickable .ct-ev__card { cursor: pointer; }

.comms-timeline .ct-ev__node {
    position: absolute;
    top: 10px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    color: var(--h);
    background: var(--surface-card);
    border: 2px solid var(--h);
    z-index: 3;
    box-shadow: 0 0 0 4px var(--surface-card);
}
.comms-timeline .ct-ev[data-dir="in"] .ct-ev__node { right: -33px; }
.comms-timeline .ct-ev[data-dir="out"] .ct-ev__node { left: -33px; }
.comms-timeline .ct-ev__node svg { width: 12px; height: 12px; }
.comms-timeline .ct-ev__node--fail { border-color: var(--status-lost); color: var(--status-lost); }

.comms-timeline .ct-ev__card {
    position: relative;
    background: var(--ct-bubble-out);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-lg);
    padding: 10px 12px;
    box-shadow: var(--elevation-1);
    -webkit-transition: border-color var(--motion-micro) var(--ease-out), transform var(--motion-micro) var(--ease-out);
    transition: border-color var(--motion-micro) var(--ease-out), transform var(--motion-micro) var(--ease-out);
}
.comms-timeline .ct-ev[data-dir="in"] .ct-ev__card { background: var(--ct-bubble-in); border-left: 3px solid var(--h); }
.comms-timeline .ct-ev[data-dir="out"] .ct-ev__card { border-right: 3px solid var(--h); }
/* SPW-14038 - automation sends are tinted; the channel accent rail is untouched, so channel
   still reads off the rail and the node exactly as it does for a manual send */
.comms-timeline .ct-ev.is-automated .ct-ev__card { background: var(--ct-auto-bg); }
/* accent border is dashed while the item is a draft / unsent / errored, solid once settled */
.comms-timeline .ct-ev.is-pending[data-dir="in"] .ct-ev__card { border-left-style: dashed; }
.comms-timeline .ct-ev.is-pending[data-dir="out"] .ct-ev__card { border-right-style: dashed; }
.comms-timeline .ct-ev.is-clickable:hover .ct-ev__card { border-color: var(--h); transform: translateY(-1px); }
.comms-timeline .ct-ev:focus-visible .ct-ev__card { box-shadow: 0 0 0 var(--ring-width) var(--ring-color), var(--elevation-1); }

.comms-timeline .ct-ev__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
    margin-bottom: 5px;
    font-size: 11px;
    color: var(--text-secondary);
}
.comms-timeline .ct-ev__chan { font-weight: 700; font-size: 10px; letter-spacing: .04em; text-transform: uppercase; color: var(--h); }
.comms-timeline .ct-auto {
    font-family: var(--font-mono);
    font-size: 9px;
    letter-spacing: .05em;
    text-transform: uppercase;
    font-weight: 700;
    color: var(--ink-500);
    border: 1px solid var(--border-default);
    border-radius: var(--radius-pill);
    padding: 1px 6px;
}
.comms-timeline .ct-ev__dir { font-family: var(--font-mono); font-size: 10px; color: var(--ink-500); }
.comms-timeline .ct-ev__dir--in { color: var(--text-secondary); }
.comms-timeline .ct-ev__meta time { margin-left: auto; font-size: 10.5px; color: var(--ink-500); }

.comms-timeline .ct-ev__text {
    margin: 0;
    font-size: 13px;
    color: var(--text-primary);
    line-height: 1.45;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* SPW-14038 - which automation sent the record, and which run of it. Mono + muted so it
   reads as provenance rather than message content. */
.comms-timeline .ct-auto-ref {
    margin-top: 6px;
    font-family: var(--font-mono);
    font-size: 10.5px;
    color: var(--text-secondary);
    word-break: break-word;
}
.comms-timeline .ct-auto-ref a { color: var(--text-link); }
.comms-timeline .ct-auto-ref a:hover { color: var(--text-link-hover); text-decoration: underline; }
.comms-timeline .ct-auto-ref__run { color: var(--ink-500); }

.comms-timeline .ct-ev__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 8px; }
.comms-timeline .ct-tick { display: inline-flex; align-items: center; gap: 4px; font-size: 10.5px; font-weight: 600; letter-spacing: .02em; }
.comms-timeline .ct-tick__ico { font-size: 13px; line-height: 1; }
.comms-timeline .ct-tick--ok { color: var(--status-open); }
.comms-timeline .ct-tick--muted { color: var(--ink-500); }
.comms-timeline .ct-tick--fail { color: var(--status-lost); }
.comms-timeline .ct-tick--warn { color: var(--status-warning); }
.comms-timeline .ct-eye { display: inline-flex; align-items: center; gap: 3px; font-size: 10.5px; color: var(--text-secondary); }
.comms-timeline .ct-eye svg { width: 13px; height: 13px; }
.comms-timeline .ct-autogate { padding: 3px 9px; font-size: 11px; }

.comms-timeline .ct-empty { text-align: center; color: var(--ink-500); font-size: 12px; padding: 24px 0; }

/* ==========================================================================
   Show the chip row only where it genuinely fits; below that use the dropdown.

   SPW-14038 raised this from 1299px. Thresholds below are measured on the live
   lead screen, not calculated - the row width does not scale linearly with the
   viewport, so extrapolating from two points gets it wrong.

     viewport   row available   note
       1300         458         six chips need 461 -> the old 1299 threshold,
                                which had no slack in it at all
       1620         585         seven chips need exactly 585 -> this threshold
       1768         660         seven chips + the sort button (658) share a row

   Between 1620 and 1768 the sort button takes its own line (see .ct-filters
   min-width above) so the chips themselves never wrap or clip.
   ========================================================================== */
@media (max-width: 1619px) {
    .comms-timeline .ct-filters { display: none; }
    .comms-timeline .ct-filter-mobile { display: inline-block; }
}

/* ==========================================================================
   Narrow screens - single column, spine on the left (mockup breakpoint)
   ========================================================================== */
@media (max-width: 560px) {
    .comms-timeline .ct-thread::before { left: 16px; }
    .comms-timeline .ct-ev {
        width: calc(100% - 34px);
        align-self: stretch !important;
        margin-left: 34px;
    }
    .comms-timeline .ct-ev .ct-ev__node { left: -33px !important; right: auto !important; }
    /* single column: accent sits on the left (outside) edge for every card */
    .comms-timeline .ct-ev[data-dir="out"] .ct-ev__card { border-right: 1px solid var(--border-default); border-left: 3px solid var(--h); }
    .comms-timeline .ct-ev.is-pending[data-dir="out"] .ct-ev__card { border-right-style: solid; border-left-style: dashed; }
    .comms-timeline .ct-ev.is-clickable[data-dir="out"]:hover .ct-ev__card { border-color: var(--h); }
}

@media (prefers-reduced-motion: reduce) {
    .comms-timeline .ct-filter,
    .comms-timeline .ct-ev__card { transition: none; }
}

/* SPW-14338 / SPW-14566 - the CRM contact experience.

   EVERY rule in this file is scoped under .crm. Nothing here may match an element outside the
   CRM screens, because these styles sit after ds-reskin.css in the bundle and would otherwise
   override the whole site. A separate file is not the guarantee; the .crm scope is.

   Deliberately contains NO inline data: URIs. This file is bundled WITH CssRewriteUrlTransform,
   which rewrites url(/Content/...) and does not skip data: URIs - it silently corrupted ds-reskin.css,
   ds-menu-icons.css and listingCard.css on deployed builds. Chevrons here are CSS borders, not
   inline SVG, so the transform stays safe. Do not add a data: URI or a relative url() here. */

.crm {
  --crm-subnav-w: 244px;
  --crm-rule: var(--ink-200, #E3E6E8);
  --crm-ink: var(--ink-900, #16191B);
  --crm-ink-soft: var(--ink-600, #5A6066);
  --crm-ink-faint: var(--ink-400, #9AA1A6);
  --crm-surface: var(--white, #FFFFFF);
  --crm-surface-sunken: var(--surface-sunken, #F4F6F7);
  --crm-urgent: var(--brand-primary, #DD2323);
  --crm-warn: var(--status-warning, #E08400);
  --crm-radius: var(--radius-md, 6px);
  --crm-radius-sm: var(--radius-sm, 4px);

  font-family: var(--font-body, "Source Sans 3", "Segoe UI", sans-serif);
  color: var(--crm-ink);
}

.crm .crm-sprite {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}

.crm .crm-shell {
  display: flex;
  align-items: stretch;
  gap: 0;
  min-height: 640px;
  border: 1px solid var(--crm-rule);
  border-radius: var(--crm-radius);
  background: var(--crm-surface);
  overflow: hidden;
}

/* ---- subnav ------------------------------------------------------------ */

.crm .crm-subnav {
  /* flex-basis: auto so WIDTH governs the size and is the single thing being transitioned. Sizing the rail
     through flex-basis and animating that works too, but deferring to width is the conventional form and
     keeps the transition and the size on the same property. */
  flex: 0 0 auto;
  width: var(--crm-subnav-w);
  border-right: 1px solid var(--crm-rule);
  background: var(--crm-surface-sunken);
  display: flex;
  flex-direction: column;
  overflow: hidden;

  /* The app's own motion tokens, so the slide matches the rest of the reskin. Labels are display:none when
     collapsed and cannot be transitioned, but they clip behind the narrowing edge, which is enough. */
  transition: width var(--motion-micro, 150ms) var(--ease-out, ease-out);
}

/* Anyone who has asked the OS for less motion gets the state change with no slide. */
@media (prefers-reduced-motion: reduce) {
  .crm .crm-subnav { transition: none; }
}

.crm .crm-subnav__head {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 12px 10px;
  border-bottom: 1px solid var(--crm-rule);
}

.crm .crm-subnav__title {
  font-family: var(--font-display, var(--font-body, sans-serif));
  font-weight: 700;
  font-size: 16px;
}

.crm .crm-subnav__total {
  margin-left: auto;
  font-family: var(--font-mono, "JetBrains Mono", monospace);
  font-size: 10px;
  color: var(--crm-ink-soft);
}

.crm .crm-subnav__body {
  flex: 1 1 auto;
  overflow-y: auto;
  padding: 8px 0 12px;
}

/* ---- Personal / Team -------------------------------------------------- */

.crm .crm-scope {
  display: flex;
  gap: 2px;
  margin: 0 10px 10px;
  padding: 2px;
  background: var(--crm-surface);
  border: 1px solid var(--crm-rule);
  border-radius: var(--crm-radius-sm);
}

.crm .crm-scope button {
  flex: 1 1 0;
  border: 0;
  background: transparent;
  border-radius: 3px;
  padding: 5px 8px;
  font-size: 12px;
  font-weight: 600;
  color: var(--crm-ink-soft);
  cursor: pointer;
}

.crm .crm-scope button:hover { color: var(--crm-ink); }

.crm .crm-scope button[aria-pressed="true"] {
  background: var(--crm-ink);
  color: var(--crm-surface);
}

.crm .crm-scope__hint {
  flex: 1 1 0;
  align-self: center;
  text-align: center;
  font-size: 10px;
  color: var(--crm-ink-faint);
}

/* ---- collapsible groups ----------------------------------------------- */

.crm .crm-group { margin-bottom: 4px; }

.crm .crm-group__label {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  padding: 7px 10px;
  border: 0;
  background: transparent;
  cursor: pointer;
  text-align: left;
}

.crm .crm-group__name {
  font-family: var(--font-condensed, var(--font-body, sans-serif));
  font-weight: 700;
  font-size: 11px;
  letter-spacing: 0.09em;
  text-transform: uppercase;
  color: var(--crm-ink-soft);
}

.crm .crm-group__badge {
  margin-left: auto;
  font-family: var(--font-mono, monospace);
  font-size: 10px;
  color: var(--crm-ink-faint);
}

/* CSS-only chevron, so this file needs no image and no data: URI */
.crm .crm-group__chevron {
  width: 0;
  height: 0;
  flex: 0 0 auto;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 5px solid var(--crm-ink-faint);
  transition: transform 120ms ease-out;
}

.crm .crm-group__chevron--shut { transform: rotate(-90deg); }

.crm .crm-group__items { padding: 0 6px; }

/* ---- a saved view row ------------------------------------------------- */

.crm .crm-view {
  display: flex;
  align-items: center;
  gap: 9px;
  width: 100%;
  padding: 6px 8px;
  border: 0;
  background: transparent;
  border-radius: var(--crm-radius-sm);
  cursor: pointer;
  text-align: left;
}

.crm .crm-view:hover:not([disabled]) { background: var(--crm-surface); }

/* The POC's selected state (.sn-item[aria-current="true"], line 534, plus the .view left border at 592):
   a light-red ground, dark-red semibold text, a red left border, and the count badge recoloured with it.
   Mine was a white ground with a near-black accent, which did not read as selected at all. */
.crm .crm-view[aria-current="true"] {
  background: var(--brand-primary-050, #FEF2F2);
  color: var(--brand-primary-700, #B81C1C);
  font-weight: 600;
  box-shadow: inset 2px 0 0 var(--brand-primary, #DD2323);
}

.crm .crm-view[aria-current="true"] .crm-view__label {
  color: var(--brand-primary-700, #B81C1C);
  font-weight: 600;
}

.crm .crm-view[aria-current="true"] .crm-view__icon { stroke: var(--brand-primary, #DD2323); }

.crm .crm-view[aria-current="true"] .crm-view__count {
  background: var(--brand-primary-100, #FCE3E3);
  color: var(--brand-primary-700, #B81C1C);
  padding: 0 4px;
  border-radius: 3px;
}

/* An urgent or warn view keeps its OWN icon tone when selected - in the POC .sn-item.view .icon.urgent
   outweighs the active icon colour, so Follow-up overdue stays red-alert rather than turning brand red. */
.crm .crm-view[aria-current="true"] .crm-view__icon--urgent { stroke: var(--status-urgent, #C0392B); }
.crm .crm-view[aria-current="true"] .crm-view__icon--warn { stroke: var(--status-warning, #E08400); }

.crm .crm-view[disabled] { cursor: default; opacity: 0.55; }

/* The POC's own icon per view (users, cal, clock, route, filter, target, zap, user, layers). It carries the
   tone as its colour, so the collapsed rail still shows which queues are urgent with no label to read. */
.crm .crm-view__icon {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  fill: none;
  stroke: var(--crm-ink-soft);
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* The POC's .icon.urgent is --status-urgent (#C0392B), NOT the brand red that --crm-urgent aliases, and
   its .icon.warn is --status-warning. Same pair the chips use, so the two components agree. */
.crm .crm-view__icon--urgent { stroke: var(--status-urgent, #C0392B); }
.crm .crm-view__icon--warn { stroke: var(--status-warning, #E08400); }

.crm .crm-view__label {
  flex: 1 1 auto;
  font-size: 13px;
  color: var(--crm-ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.crm .crm-view__count {
  font-family: var(--font-mono, monospace);
  font-size: 11px;
  color: var(--crm-ink-soft);
}

/* In Market Leads stays in the nav as a label rather than a link (Q16, closed 2 Sept 2026) */
.crm .crm-view__pending {
  font-family: var(--font-condensed, var(--font-body, sans-serif));
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--crm-ink-faint);
}

/* ---- recently viewed -------------------------------------------------- */

.crm .crm-recent {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 1px;
  width: 100%;
  padding: 6px 8px;
  border: 0;
  background: transparent;
  border-radius: var(--crm-radius-sm);
  cursor: pointer;
  text-align: left;
}

.crm .crm-recent:hover { background: var(--crm-surface); }
.crm .crm-recent__name { font-size: 13px; }
.crm .crm-recent__sub { font-size: 11px; color: var(--crm-ink-faint); }

.crm .crm-empty {
  padding: 6px 10px;
  font-size: 12px;
  color: var(--crm-ink-faint);
}

/* ---- main window ------------------------------------------------------ */

.crm .crm-main {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.crm .crm-topbar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--crm-rule);
}

.crm .crm-topbar__toggle {
  width: 26px;
  height: 26px;
  flex: 0 0 auto;
  border: 1px solid var(--crm-rule);
  border-radius: var(--crm-radius-sm);
  background: var(--crm-surface);
  cursor: pointer;
  position: relative;
}

.crm .crm-topbar__toggle::before {
  content: "";
  position: absolute;
  left: 7px;
  right: 7px;
  top: 8px;
  height: 1px;
  background: var(--crm-ink-soft);
  box-shadow: 0 4px 0 var(--crm-ink-soft), 0 8px 0 var(--crm-ink-soft);
}

.crm .crm-crumb {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  min-width: 0;
}

.crm .crm-crumb__root { color: var(--crm-ink-soft); }

.crm .crm-crumb__sep {
  width: 0;
  height: 0;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  border-left: 5px solid var(--crm-ink-faint);
}

.crm .crm-crumb__current {
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.crm .crm-content {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px 20px;
}

/* An honest empty state, per the ticket: sections render empty rather than hidden or faked */
.crm .crm-placeholder {
  max-width: 520px;
  text-align: center;
}

.crm .crm-placeholder__title {
  font-family: var(--font-display, var(--font-body, sans-serif));
  font-size: 20px;
  font-weight: 700;
  margin: 0 0 8px;
}

.crm .crm-placeholder__body {
  font-size: 13.5px;
  color: var(--crm-ink-soft);
  margin: 0 0 10px;
}

.crm .crm-placeholder__note {
  font-family: var(--font-condensed, var(--font-body, sans-serif));
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--crm-ink-faint);
  margin: 0;
}

/* ---- the collapsed rail ------------------------------------------------
   Craig's call (3 Sept 2026), which the POC does not cover: below tablet the subnav collapses to the LEFT
   as a thin strip rather than reflowing to the top of the screen. The icons are what indicates position,
   so everything needing a label to make sense is hidden rather than squeezed. */

.crm .crm-subnav--collapsed {
  flex: 0 0 auto;
  width: 46px;
}

.crm .crm-subnav--collapsed .crm-subnav__title,
.crm .crm-subnav--collapsed .crm-subnav__total,
.crm .crm-subnav--collapsed .crm-scope,
.crm .crm-subnav--collapsed .crm-group__name,
.crm .crm-subnav--collapsed .crm-group__badge,
.crm .crm-subnav--collapsed .crm-group__chevron,
.crm .crm-subnav--collapsed .crm-view__label,
.crm .crm-subnav--collapsed .crm-view__count,
.crm .crm-subnav--collapsed .crm-view__pending,
.crm .crm-subnav--collapsed .crm-recent,
.crm .crm-subnav--collapsed .crm-empty {
  display: none;
}

/* Collapsed, the head holds nothing - both the heading and the count are hidden (Craig, 3 Sept 2026) - so
   its bottom rule goes too, leaving plain grey space above the icons rather than an empty boxed-off panel. */
.crm .crm-subnav--collapsed .crm-subnav__head {
  justify-content: center;
  padding: 12px 2px 10px;
  border-bottom: 0;
}

/* A collapsed group header would be an empty clickable strip, so it goes - and its items stay visible
   regardless of the collapsed-group state the user cannot see the name of. */
.crm .crm-subnav--collapsed .crm-group__label { display: none; }
.crm .crm-subnav--collapsed .crm-group__items { display: block !important; padding: 0 5px; }

/* Marketing and Recently viewed need their labels to mean anything, and the POC gives them no icons, so
   they leave the rail rather than sitting there as blank 16px boxes that look clickable but say nothing. */
.crm .crm-subnav--collapsed .crm-group--aside { display: none; }

/* Groups are separated by a GAP, not a rule (Craig, 3 Sept 2026). A hairline here read as a stray border
   under All contacts - the first group holds only that one item, so its neighbour's top border landed
   directly beneath it and looked like the head's rule had simply moved down. */
.crm .crm-subnav--collapsed .crm-group + .crm-group {
  margin-top: 10px;
}

.crm .crm-subnav--collapsed .crm-view {
  justify-content: center;
  padding: 7px 0;
}

/* No override here: the shared selected rule already gives the rail its red ground and left border, which
   is what indicates position when there are no labels to read. */

/* ---- the All contacts table -------------------------------------------- */

.crm .crm-content--empty {
  align-items: center;
  justify-content: center;
}

.crm .crm-content:not(.crm-content--empty) {
  display: block;
  align-items: stretch;
  padding: 2px 14px 20px;
  min-width: 0;

  /* No overflow here. The table is width:100% at table-layout:fixed and the breakpoints drop columns, so
     it always fits - an inner scrollbar would put half the row out of sight inside the page. */
}

/* ---- topbar palette trigger --------------------------------------------
   The POC's .tb-search: a button that opens the palette, not a search field. The contact search is the
   separate input above the table - conflating the two is why the POC keeps both. */

.crm .crm-topbar__spacer { flex: 1 1 auto; }

.crm .crm-jump {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 1px solid var(--crm-rule);
  border-radius: var(--crm-radius-sm);
  background: var(--crm-surface-sunken);
  padding: 4px 8px;
  cursor: pointer;
  color: var(--crm-ink-soft);
}

.crm .crm-jump:hover { border-color: var(--crm-ink-faint); color: var(--crm-ink); }

.crm .crm-jump svg {
  width: 15px;
  height: 15px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
}

.crm .crm-jump__label { font-size: 12.5px; }

.crm .crm-jump__key {
  font-family: var(--font-mono, monospace);
  font-size: 10px;
  padding: 1px 5px;
  border: 1px solid var(--crm-rule);
  border-radius: 3px;
  background: var(--crm-surface);
  color: var(--crm-ink-faint);
}

/* ---- command palette ---------------------------------------------------
   The POC's .pal (line 1200). Fixed rather than absolute, so it covers the page whatever the shell is
   doing, and the card stops the click that would otherwise close it. */

.crm .crm-pal {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding-top: 12vh;
  background: rgba(22, 25, 27, 0.38);
}

.crm .crm-pal__card {
  width: min(560px, 92%);
  max-height: 66vh;
  display: flex;
  flex-direction: column;
  background: var(--crm-surface);
  border-radius: var(--crm-radius);
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.3);
  overflow: hidden;
}

.crm .crm-pal__head {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--crm-rule);
}

.crm .crm-pal__icon {
  flex: 0 0 auto;
  width: 17px;
  height: 17px;
  fill: none;
  stroke: var(--crm-ink-faint);
  stroke-width: 1.7;
  stroke-linecap: round;
}

.crm .crm-pal__input {
  flex: 1 1 auto;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  font-family: inherit;
  font-size: 15px;
  color: var(--crm-ink);
}

.crm .crm-pal__list {
  flex: 1 1 auto;
  overflow-y: auto;
  padding: 6px;
}

.crm .crm-pal__group {
  padding: 8px 8px 3px;
  font-family: var(--font-condensed, var(--font-body, sans-serif));
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--crm-ink-faint);
}

.crm .crm-pal__item {
  display: flex;
  align-items: center;
  gap: 9px;
  width: 100%;
  border: 0;
  background: transparent;
  border-radius: var(--crm-radius-sm);
  padding: 7px 8px;
  text-align: left;
  cursor: pointer;
  color: var(--crm-ink);
}

.crm .crm-pal__item svg {
  flex: 0 0 auto;
  width: 16px;
  height: 16px;
  fill: none;
  stroke: var(--crm-ink-faint);
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Highlight follows both the arrow keys and the mouse, so the two never disagree about what Enter does. */
.crm .crm-pal__item--on {
  background: var(--brand-primary-050, #FEF2F2);
  color: var(--brand-primary-700, #B81C1C);
}

.crm .crm-pal__item--on svg { stroke: var(--brand-primary, #DD2323); }

.crm .crm-pal__item[disabled] { opacity: 0.5; cursor: default; }

.crm .crm-pal__label {
  flex: 1 1 auto;
  min-width: 0;
  font-size: 13.5px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.crm .crm-pal__hint {
  flex: 0 0 auto;
  font-family: var(--font-mono, monospace);
  font-size: 10px;
  color: var(--crm-ink-faint);
}

.crm .crm-pal__empty {
  padding: 22px 12px;
  text-align: center;
  font-size: 13px;
  color: var(--crm-ink-faint);
}

/* ---- database-wide search ----------------------------------------------
   Sits above the table and always covers the whole dealer, whatever view is selected - the POC is explicit
   that a view-scoped search is how a CRM convinces someone a contact does not exist. */

/* The search bar sits outside the grid container on purpose: it has to be reachable from EVERY view, not
   only the one that currently renders a table. It was inside .crm-content at first, which left a queue view
   with no way to start a search at all - the functional pass caught it. */
.crm .crm-searchbar { padding: 12px 14px 0; }

.crm .crm-search {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 10px;
  padding: 0 10px;
  border: 1px solid var(--crm-rule);
  border-radius: var(--crm-radius);
  background: var(--crm-surface);
}

.crm .crm-search:focus-within { border-color: var(--crm-ink-faint); }

.crm .crm-search__icon {
  flex: 0 0 auto;
  width: 17px;
  height: 17px;
  fill: none;
  stroke: var(--crm-ink-faint);
  stroke-width: 1.7;
  stroke-linecap: round;
}

.crm .crm-search input {
  flex: 1 1 auto;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  padding: 9px 0;
  font-family: inherit;
  font-size: 13.5px;

  /* .crm-search is a <label>, and Bootstrap makes labels bold - so both the typed text and the placeholder
     inherited 700 and read as heavy. Reset explicitly. */
  font-weight: 400;
  color: var(--crm-ink);
}

/* Matched to the disabled Marketing subitems in the nav (Craig, 3 Sept 2026): the same ink at the same
   0.55, rather than a separate grey that ended up looking heavier than them. */
.crm .crm-search input::placeholder {
  color: var(--crm-ink);
  opacity: 0.55;
  font-weight: 400;
}

.crm .crm-search input::-webkit-search-cancel-button { display: none; }

.crm .crm-search__clear {
  flex: 0 0 auto;
  border: 0;
  background: transparent;
  padding: 2px;
  cursor: pointer;
  line-height: 0;
}

.crm .crm-search__clear svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: var(--crm-ink-soft);
  stroke-width: 2;
  stroke-linecap: round;
}

.crm .crm-search__clear:hover svg { stroke: var(--crm-urgent); }

/* The POC's .vhead: the view's name as the page heading, above the search. It reads "Search results" while
   a search is running, and only then does the sub-line appear - the view's own hint stays out, having been
   removed as noise (3 Sept 2026), but a line saying the results ignored the selected view earns its place. */
.crm .crm-viewhead {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 10px;
}

.crm .crm-viewhead__text { flex: 1 1 auto; min-width: 0; }

.crm .crm-viewhead__acts {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 8px;
}

/* The POC's .btn (line 236): condensed bold, uppercase, tracked, 32px tall. Used by the head actions and
   the bulk bar alike, so the two never drift into different button shapes. */
.crm .crm-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  height: 32px;
  padding: 0 12px;
  border: 1px solid transparent;
  border-radius: var(--crm-radius);
  font-family: var(--font-condensed, var(--font-body, sans-serif));
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  white-space: nowrap;
  cursor: pointer;
}

.crm .crm-btn svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.crm .crm-btn--pri {
  background: var(--brand-primary, #DD2323);
  color: #FFFFFF;
}

.crm .crm-btn--pri:hover { background: var(--brand-primary-700, #B81C1C); }

.crm .crm-btn--sec {
  background: var(--crm-surface);
  border-color: var(--crm-ink-faint);
  color: var(--crm-ink);
}

.crm .crm-btn--sec:hover { background: var(--crm-surface-sunken); }

.crm .crm-btn--icon {
  width: 32px;
  padding: 0;
  background: var(--crm-surface);
  border-color: var(--crm-rule);
  color: var(--crm-ink-soft);
}

.crm .crm-btn--icon:hover { color: var(--crm-ink); border-color: var(--crm-ink-faint); }

/* ---- the count line ----------------------------------------------------
   The POC's .ct span, between the search and the table: how many rows match out of the dealer, and what
   the open leads among them are worth. */
.crm .crm-count {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}

.crm .crm-count__text {
  font-size: 12px;
  color: var(--crm-ink-soft);
}

.crm .crm-count__clear {
  border: 0;
  background: transparent;
  padding: 0;
  font-family: inherit;
  font-size: 12px;
  font-weight: 600;
  color: var(--crm-urgent);
  cursor: pointer;
}

.crm .crm-count__clear:hover { text-decoration: underline; }

.crm .crm-viewhead__title {
  font-family: var(--font-display, var(--font-body, sans-serif));
  font-size: 19px;
  font-weight: 700;
  line-height: 1.25;
  margin: 0;
  color: var(--crm-ink);
}

.crm .crm-viewhead__body {
  margin: 3px 0 0;
  font-size: 12px;
  color: var(--crm-ink-soft);
}

.crm .crm-table__bar {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}

/* The picker floats LEFT, as it does on every other list screen (Craig, 3 Sept 2026). That also removes
   the reason it needed right-anchoring: from the left-hand end, .dropdown-menu's default leftward anchor
   opens the menu INTO the page, so no override is needed and the !important is gone with it. */
.crm .crm-table__bar .dt-column-picker { position: relative; }

.crm .crm-table__bar .dt-column-picker .dropdown-menu {
  max-height: 60vh;
  overflow-y: auto;
}

.crm .crm-table__spacer { flex: 1 1 auto; }

/* ---- bulk action bar ---------------------------------------------------
   The POC's .bulk (line 712): a sticky dark pill that appears on selection, centred under the table. It
   carries the count, so the toolbar no longer does. Only Run a campaign and Clear act; the rest render
   disabled rather than silently dead, because a button that quietly does nothing is worse than one that
   says it cannot yet. */

/* FIXED, not sticky. The POC's .bulk is sticky, but that relies on a scrolling ancestor - and .crm-shell
   sets overflow:hidden to keep its rounded corners, which stops sticky pinning altogether. The bar simply
   sat at the foot of the table, 2,400px below the fold. Do not put sticky back without removing that
   overflow first.

   The dock's left and width are measured off .crm-main in JS, because a fixed element centres on the
   VIEWPORT - which put the bar well left of the table once the app's own rail took up the left of the
   screen. Centring inside the dock puts it under the table where it belongs. */
.crm .crm-bulk-dock {
  position: fixed;
  bottom: 18px;
  z-index: 150;
  display: flex;
  justify-content: center;
  pointer-events: none;
}

.crm .crm-bulk {
  pointer-events: auto;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  width: fit-content;
  max-width: calc(100% - 28px);
  padding: 9px 16px;
  border-radius: 999px;
  background: var(--crm-ink);
  color: #F2F4F5;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.22);
}

/* The bar is fixed, so it would sit over the last row once the page is scrolled to the end. Only reserved
   while there is a selection, rather than leaving dead space under every table. */
.crm .crm-content--bulk { padding-bottom: 78px; }

.crm .crm-bulk__count {
  font-family: var(--font-display, var(--font-body, sans-serif));
  font-size: 14px;
  font-weight: 700;
  white-space: nowrap;
}

.crm .crm-bulk__sep {
  width: 1px;
  height: 16px;
  background: rgba(255, 255, 255, 0.22);
}

/* Same treatment as .crm-btn - the POC's ghost buttons are the same shape as the rest, just on the dark
   ground: condensed bold, uppercase, tracked, 14px. */
.crm .crm-bulk__action {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  height: 32px;
  border: 0;
  background: transparent;
  border-radius: var(--crm-radius-sm);
  padding: 0 10px;
  font-family: var(--font-condensed, var(--font-body, sans-serif));
  font-weight: 700;
  font-size: 14px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: #C8CCD0;
  cursor: pointer;
  white-space: nowrap;
}

.crm .crm-bulk__action svg {
  width: 16px;
  height: 16px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.crm .crm-bulk__action:hover:not([disabled]) {
  background: rgba(255, 255, 255, 0.12);
  color: #FFFFFF;
}

/* 0.55, the same as the disabled Marketing subitems in the nav - at 0.45 the icons were faint enough to
   look absent rather than disabled. */
.crm .crm-bulk__action[disabled] {
  opacity: 0.55;
  cursor: default;
}

.crm .crm-bulk__failed {
  font-size: 12px;
  font-weight: 600;
  color: #FFB4A8;
  white-space: nowrap;
}

.crm table.crm-grid {
  width: 100%;
  font-size: 13px;
}

/* Column widths are set as DataTables width options on the columns, NOT here: this table runs at
   table-layout: fixed, where a cell's min-width is ignored, and forcing a table min-width instead made
   the table outgrow its container so DataTables Responsive started hiding Yard and Data quality. */

.crm table.crm-grid > thead > tr > th {
  font-family: var(--font-condensed, var(--font-body, sans-serif));
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: var(--crm-ink-soft);
  border-bottom: 1px solid var(--crm-rule);

  /* Wrap to a second line rather than clipping: at these widths nowrap gave "OPEN L..." and
     "LAST SPOKE...". Wrapping keeps the POC's own column wording intact. */
  white-space: normal;
  vertical-align: bottom;
}

.crm table.crm-grid > tbody > tr > td {
  vertical-align: top;
  padding: 8px 10px;
  border-top: 1px solid var(--crm-rule);
}

/* ---- shared cell furniture -------------------------------------------- */

/* Long names and emails ellipsis rather than being clipped mid-character by the cell. */
.crm .crm-cell__main,
.crm .crm-cell__sub {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.crm .crm-cell__main { font-weight: 600; }

.crm .crm-cell__sub {
  font-size: 11.5px;
  color: var(--crm-ink-soft);
}

.crm .crm-cell__sub--warn { color: var(--crm-warn); font-weight: 600; font-style: normal; }

.crm .crm-mono { font-family: var(--font-mono, "JetBrains Mono", monospace); }

.crm .crm-none { color: var(--crm-ink-faint); }

.crm .crm-contact { display: flex; align-items: flex-start; gap: 8px; }

.crm .crm-contact__text { min-width: 0; flex: 1 1 auto; }

.crm .crm-avatar {
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: var(--crm-surface-sunken);
  border: 1px solid var(--crm-rule);
  font-size: 10.5px;
  font-weight: 700;
  color: var(--crm-ink-soft);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* The contact name is the only thing in a row that navigates, now that clicking the row selects it. */
.crm .crm-contact__open {
  color: var(--crm-ink);
  text-decoration: none;
  cursor: pointer;
}

.crm .crm-contact__open:hover,
.crm .crm-contact__open:focus {
  color: var(--crm-urgent);
  text-decoration: underline;
}

/* Select-all. DataTables Select draws the row checkboxes from td.select-checkbox but styles no header,
   so this is drawn here to match them - unticked, ticked, and part-ticked for a partial page. */
.crm table.crm-grid > thead > tr > th.select-checkbox { text-align: center; }

.crm .crm-check-all {
  display: inline-block;
  position: relative;
  width: 14px;
  height: 14px;
  border: 1px solid var(--crm-ink-faint);
  border-radius: 3px;
  background: var(--crm-surface);
  cursor: pointer;
  vertical-align: middle;
}

.crm .crm-check-all:hover { border-color: var(--crm-ink); }

.crm .crm-check-all[aria-checked="true"],
.crm .crm-check-all[aria-checked="mixed"] {
  background: var(--crm-ink);
  border-color: var(--crm-ink);
}

/* A tick for the whole page, a dash for part of it. */
.crm .crm-check-all[aria-checked="true"]::after {
  content: "";
  position: absolute;
  left: 3px;
  top: 0;
  width: 5px;
  height: 9px;
  border-right: 2px solid var(--crm-surface);
  border-bottom: 2px solid var(--crm-surface);
  transform: rotate(40deg);
}

.crm .crm-check-all[aria-checked="mixed"]::after {
  content: "";
  position: absolute;
  left: 2px;
  top: 5px;
  width: 8px;
  height: 2px;
  background: var(--crm-surface);
}

/* ---- next action ------------------------------------------------------- */

.crm .crm-next__title { font-weight: 600; }

.crm .crm-next__sub {
  font-size: 11.5px;
  color: var(--crm-ink-soft);
}

.crm .crm-next__sub--late { color: var(--crm-urgent); font-weight: 600; }
.crm .crm-next__sub--now { color: var(--crm-warn); font-weight: 600; }

/* Data quality holds several chips, so this cell wraps them onto further LINES. Without it the cell
   inherits nowrap from the table and clips to one chip plus an ellipsis - each chip still stays on one
   line itself, which is what crm-chip's own white-space: nowrap is for. */
.crm table.crm-grid > tbody > tr > td.crm-col-quality,
.crm table.crm-grid > tbody > tr > td.crm-col-next { white-space: normal; }

/* SPW-14567 Next action is the column a queue is ordered by, so its header is the sort control.
   No caret of our own: markNextActionSort puts DataTables' own sorting_asc / sorting_desc classes on
   the header, so it looks exactly like every other sorted column on the grid. */
.crm table.crm-grid thead th.crm-next-sort { cursor: pointer; }

/* ---- chips -------------------------------------------------------------
   The POC's own .chip (line 218) and its tone classes (223-232): uppercase condensed bold, NO border, a
   tinted background with darker text of the same hue, and the small radius rather than a pill. Mine were
   coloured text on near-white with a coloured outline, which read as a different component entirely.

   Only --status-neutral, --brand-primary-100/700 and --radius-sm exist in ds-reskin.css, so the rest carry
   the POC's own hex as the fallback. */

.crm .crm-chip {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin: 0 3px 3px 0;
  padding: 2px 7px;
  border: 0;
  border-radius: var(--radius-sm, 4px);
  font-family: var(--font-condensed, var(--font-body, sans-serif));
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  line-height: 1.5;
  white-space: nowrap;
}

/* c-urg */
.crm .crm-chip--urgent {
  background: var(--status-urgent-bg, #FBEAE7);
  color: var(--status-urgent, #C0392B);
}

/* c-warn - the POC pairs the warning tint with the darker mild-priority text, not the warning colour */
.crm .crm-chip--warn {
  background: var(--status-warning-bg, #FBF0DE);
  color: var(--priority-mild-fg, #9A5A00);
}

/* c-neut */
.crm .crm-chip--neutral {
  background: var(--status-neutral-bg, #ECEEF0);
  color: var(--status-neutral, #5A6066);
}

/* c-brand */
.crm .crm-chip--brand {
  background: var(--brand-primary-100, #FCE3E3);
  color: var(--brand-primary-700, #B81C1C);
}

/* c-lead */
.crm .crm-chip--lead {
  background: var(--type-lead-bg, #E4EFF7);
  color: var(--type-lead, #1A6FB5);
}

/* c-won - a clean record reads as a positive, not an absence */
.crm .crm-chip--clean {
  background: var(--status-open-bg, #E7F3E8);
  color: var(--status-won, #2E7D32);
}

/* ---- responsive ------------------------------------------------------- */

/* SPW-14566's three table breakpoints. Columns are dropped by their own crm-col-* class, not by
   position: the column picker removes columns from the DOM, so nth-child would drop the wrong one.
   Order of sacrifice is least decision-critical first - Yard, then Prospects, then Last spoken to. */

@media (max-width: 1320px) {
  .crm .crm-col-yard { display: none !important; }
}

@media (max-width: 1180px) {
  .crm .crm-col-prospects { display: none !important; }
}

@media (max-width: 980px) {
  .crm .crm-col-spoken { display: none !important; }
}

/* No stacking breakpoint. The shell used to become a column below 900px, putting the nav across the top;
   it now collapses to the left rail instead, which the controller forces at 1024px and under. */