@import "/assets/fonts/nirmala/fonts.css";

/*------------------------------------*

    TABLE OF CONTENT - $ search prefix

    FONT_FAMILY
    FONT_COLOR
    FONT_SIZE
    BACKGROUND COLORS
    LAYOUT
    ANCHOR
    LIST GROUP
    PANEL
    WELL
    TABLE
    TABS
    NAV RESET
    NAVTABS
    NAV-INVERSE
    PAGINATION
    BTN
    BTN_CTA
    BTN_MAIN
    BTN_ALT1
    BTN_ALT2
    BTN_ALT3
    BTN_NAV1 AND BTN_NAV2
    HOME_MISC
    HOME_QUICK-NAV
    HOME_INVENTORY SEARCH BUTTONS
    WIDGET_INVENTORY SEARCH
    WIDGET_BANNER
    WIDGET_MODELBAR
    FIXED_HEADER
    MOBILE LEAD DRIVER
	Car Bravo
    cta             1E1A34
    cta hover       383065
    main            3F4443
    main hover      222222

/*------------------------------------*
	$CUSTOM_PROPERTIES
\*------------------------------------*/
:root {
	--cta-background-color: #1E1A34;
	--cta-font-color: #fff;
	--cta-hover-color: #383065;
	--main-color: #3F4443;
}

/*------------------------------------*
    $FONT_FAMILY
\*------------------------------------*/
body { font-family: 'NirmalaUI', sans-serif; font-size: 14px;}
strong, b { font-family: 'NirmalaUI-Bold', sans-serif; }
.heading-xl, .heading-lg, h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { font-family: 'NirmalaUI-Bold', sans-serif; text-transform: uppercase;}
.btn, .heading-bold { font-family: 'NirmalaUI-Bold', sans-serif; }
.btn, #inventorySearchWidget .isTitle, .srpRefineSearch .panel-title, .srpVehicle h2, .srpVehicle h1.vehicleTitle, #vehiclePageViews h2, .featuredVehicle .title h3, strong, b { font-weight: normal !important; }

/*------------------------------------*
    $FONT_COLOR
\*------------------------------------*/
hr { border-top-color: #ddd; }
.text-default { color: #333; } /* place default body color here */
.text-main { color: #3F4443; }
.text-cta { color: #1E1A34; }
.text-alt3 { color: #633231; }
.text-muted { color: #767676; }
.bg-main .text-muted { color: #B0B0B0; }

/*------------------------------------*
    $FONT_SIZE
\*------------------------------------*/

@media (max-width:991px) {
body, .btn, .dropdown-menu, .form-control { font-size: 13px; }
}
/*------------------------------------*
    $BACKGROUND COLORS
\*------------------------------------*/

.bg-main {
    background-color: #3F4443;
    border: 1px solid transparent;
    color:#fff;
}
.bg-cta {
    background-color: #1E1A34;
    border: 1px solid transparent;
    color:#fff;
}
.bg-alt1 {
    background-color: #f3f3f3;
    border: 1px solid transparent;
}
.bg-alt2 {
    background-color: #636363;
    border: 1px solid transparent;
	color: #fff;
}
.bg-alt3 {
    background-color: #633231;
    border: 1px solid transparent;
	color: #fff;
}
.bg-alt4 {
    background-color: #000;
    border: 1px solid transparent;
	color: #fff;
}
.offerBlock {
    background-color: #3F4443;
    color: #fff;
}

@media (max-width:767px) {
.snap-content { background-color: #fff !important; }
}

footer {background: #fff; color: #111;}

/*------------------------------------*
    $LAYOUT
\*------------------------------------*/

.contentWrapper { padding-bottom: 2em; }
.contentSectionO, .contentSectionE { padding: 45px 0; }

@media (min-width: 992px) {
.bannerLayout01 { padding: 45px 0; }
}
@media (max-width: 991px) and (min-width: 768px) {
.bannerLayout01 { padding: 25px 0 10px; }
}
@media (max-width:991px) {
.contentSectionO, .contentSectionE { padding: 35px 0; }
.bannerWrapper.bannerLayout02 { padding: 0; }
}

@media (max-width:767px) {
.contentSectionO, .contentSectionE { padding: 30px 0; }
}
/*------------------------------------*
    $ANCHOR
\*------------------------------------*/
a { color: #767676; }
a:hover, a:focus { color: #666; }
/*------------------------------------*
    $LIST GROUP
\*------------------------------------*/

/*------------------------------------*
    $PANEL
\*------------------------------------*/
.panel, .panel-heading, .panel-footer { border-radius: 0; }
.panel { box-shadow: none; }
.panel-title { font-weight: 800; }
.panel-heading a { color: #616161; }

/*------------------------------------*
    $WELL
\*------------------------------------*/
.well { box-shadow: none; border-radius: 0; }
.well .tel1 a, .well .tel2 a, .well .tel3 a, .well .tel4 a, .well p a { color: #6B6B6B; }

/*------------------------------------*
    $TABLE
\*------------------------------------*/

/*------------------------------------*
    $TABS
\*------------------------------------*/
.nav-tabs.nav-justified > li > a, .nav-tabs > li > a { background-color: #eee; color: #6B6B6B; }
.nav-tabs.nav-justified > .active > a { border-bottom-color: transparent; }
.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus { background-color: #fff; }
/* tabs inside well */
.well .nav-tabs.nav-justified > .active > a { background-color: #f5f5f5; }
.well .panel .nav-tabs.nav-justified > .active > a { background-color: #fff; }
/*------------------------------------*
    $NAVTABS
\*------------------------------------*/
.nav-pills li.active a, .nav-pills li.active a:hover, .nav-pills li.active a:focus {
    background-color: #3F4443;
    border-color: transparent;
    color: #fff;
}
/*------------------------------------*
    $NAV-INVERSE
\*------------------------------------*/

/*------------------------------------*
    $PAGINATION
\*------------------------------------*/
.pagination .active a, .pagination .active span, .pagination .active a:hover, .pagination .active span:hover, .pagination .active a:focus, .pagination .active span:focus {
    background-color: #767676;
    border-color: transparent;
    color: #fff;
}
/*------------------------------------*
    $BTN
\*------------------------------------*/
.btn {
    border-radius: 2px;
    -moz-transition: background-color 200ms linear 0s, color 200ms linear 0s, border-color 200ms linear 0s;
    -ms-transition: background-color 200ms linear 0s, color 200ms linear 0s, border-color 200ms linear 0s;
    -o-transition: background-color 200ms linear 0s, color 200ms linear 0s, border-color 200ms linear 0s;
    -webkit-transition: background-color 200ms linear 0s, color 200ms linear 0s, border-color 200ms linear 0s;
    transition: background-color 200ms linear 0s, color 200ms linear 0s, border-color 200ms linear 0s;
    text-transform: uppercase;
}
.srpRefineSearch #accordion ul li a { border-radius: 0; color: #383065; } /* used on srp refine search section - leave in IF you are removing border radius from all buttons */
/*------------------------------------*
    $BTN_CTA
\*------------------------------------*/
.btn-cta {
    color: #fff;
    background: #1E1A34;
    border-color: #1E1A34;
}
.btn-cta:hover, .btn-cta:focus, .btn-cta:active, .btn-cta.active, .open > .dropdown-toggle.btn-cta {
    color: #fff;
    background: #383065;
    border-color: #383065;
}
/*------------------------------------*
    $BTN_MAIN
\*------------------------------------*/
.btn-main, .btn-alt3.active, .nav .btn-alt3.active /* used on specials pages as tabs */ {
    color: #fff;
    background: #3F4443;
    border-color: #3F4443;
}
.btn-main:hover, .btn-main:focus, .btn-main:active, .btn-main.active, .open .dropdown-toggle.btn-main {
    color: #fff;
    background: #1E1A34;
    border-color: #1E1A34;
}
.showroom .menu .btn-alt3 { background-image: none; } /* used on showroom page, in the left menu section */
/*------------------------------------*
    $BTN_ALT1
\*------------------------------------*/
.btn-alt1 {
    color: #1E1A34;
	background-color: #fff;
	border-color: #1E1A34;
	border: 2px solid #1E1A34;
}
.btn-alt1:hover, .btn-alt1:focus, .btn-alt1:active, .btn-alt1.active, .open .dropdown-toggle.btn-alt1, .nav .btn-alt1:hover, .nav .btn-alt1:focus, .nav .btn-alt1:active, .nav .btn-alt1.active {
    color: #fff;
    background-color: #1E1A34;
    border-color: #1E1A34;
}
/*------------------------------------*
    $BTN_ALT2
\*------------------------------------*/
.btn-alt2 {
    color: #fff;
    background-color: #636363;
    border-color: #636363;
}
.btn-alt2:hover, .btn-alt2:focus, .btn-alt2:active, .btn-alt2.active, .open .dropdown-toggle.btn-alt2, .nav .btn-alt2:hover, .nav .btn-alt2:focus, .nav .btn-alt2:active, .nav .btn-alt2.active {
    color: #fff;
    background-color: #4F4F4F;
    border-color: #4F4F4F;
}
/*------------------------------------*
    $BTN_ALT3
\*------------------------------------*/
.btn-alt3 {
    color: #fff;
    background-color: #633231;
    border-color: #633231;
}
.btn-alt3:hover, .btn-alt3:focus, .btn-alt3:active, .open .dropdown-toggle.btn-alt3, .nav .btn-alt3:hover, .nav .btn-alt3:focus, .nav .btn-alt3:active {
    color: #fff;
    background-color: #99403e;
    border-color: #99403e;
}
/*------------------------------------*
    $BTN_ALT3
\*------------------------------------*/
.btn-alt4 {
    color: #fff;
    background-color: transparent;
    border: 2px solid #fff;
}
.btn-alt4:hover, .btn-alt4:focus, .btn-alt4:active, .open .dropdown-toggle.btn-alt4, .nav .btn-alt4:hover, .nav .btn-alt4:focus, .nav .btn-alt4:active {
    color: #000; 
    background-color: #fff; 
    border-color: #fff;
}
/*------------------------------------*
    $BTN_NAV1 and $BTN_NAV2
\*------------------------------------*/
.btn-nav1, .btn-nav2 {
    color: #fff;
    background-color: transparent;
    border-color: transparent #000 transparent transparent;
    border-radius: 0;
}
.btn-nav1:hover, .btn-nav1:focus, .btn-nav1:active, .btn-nav1.active, .open .dropdown-toggle.btn-nav1, .btn-nav2:hover, .btn-nav2:focus, .btn-nav2:active, .btn-nav2.active, .open .dropdown-toggle.btn-nav2 {
    color: #fff;
    background-color: #000;
    border-color: #000;
    border-radius: 0;
}
/*------------------------------------*
    $HOME_MISC
\*------------------------------------*/
/* Reduce size of homepage banner disclaimer button via DES-121356 & DES-192502 */
.homepage #disclaimerBtn-Main.btn-sm { font-size: 10px; padding: 3px 8px; right: 0; left: auto; }

/* Set Disclaimer Modal Text Color DES-192502 */
#disclaimerModal-Main { color: #000; }


/*------------------------------------*
    $HOME_QUICK-NAV
\*------------------------------------*/
.qn-item .fa { -webkit-transition: all .3s ease-in-out; -moz-transition: all .3s ease-in-out; -o-transition: all .3s ease-in-out; -ms-transition: all .3s ease-in-out; transition: all .3s ease-in-out; }
.qn-container, .qn-inner { display: flex; flex-flow: row wrap; }
.qn-container { justify-content: space-between; }
.qn-container .qn-item { width: 25%; }
.qn-inner { align-items: center; justify-content: space-around;}
.qn-inner .qn-bottom { width: 100%; margin-top: 15px;}
.qn-item .fa { background-color: #fff; color: #383065; border: 3px solid #383065; border-radius: 50%; height: 70px; width: 70px; padding-top: 12px; }
.qn-item .qn-inner:hover .fa { background-color: #383065; color: #fff; }
.qn-item hr { border-top: 1px solid #dbdbdb; }

@media (min-width: 992px) {
.qn-item .larger { font-size: 24px; font-weight: 700; }
}
@media (max-width: 991px) {
.qn-item .fa {height: 55px; width: 55px; padding-top: 11px;}
.qn-item .fa-3x {font-size: 2em;}
.qn-item .larger { font-size: 20px; font-weight: 600;}
}
@media (min-width: 540px) {
.qn-inner { border-right: 1px solid #dbdbdb;}
.qn-container .qn-item:last-of-type .qn-inner {border-right: 0;}
}
@media (max-width: 539px) {
.qn-container .qn-item { width: 50%; margin: 20px 0; }
}

/*------------------------------------*
    $HOME_INVENTORY SEARCH BUTTONS
\*------------------------------------*/


/*------------------------------------*
    $WIDGET_INVENTORY SEARCH
\*------------------------------------*/


/*------------------------------------*
    $WIDGET_BANNER
\*------------------------------------*/
.bannerLayout01 > .container { background-color: #000; }
.bannerLayout01 #inventorySearchWidget { color: #fff; padding: 10px 8px; }
.bannerLayout02 #inventorySearchWidget { color: #fff; padding: 10px 25px 15px; }
.bannerWrapper .btn-main { background-color: #1E1A34; border-color: #1E1A34; color: #fff; }
.bannerWrapper .btn-main:hover { background-color: #383065; border-color: #383065; }

@media (min-width: 992px) {
.bannerLayout02 #inventorySearchWidget { background-color: rgba(0,0,0,.85); margin-top: 35px; }
}
@media (max-width: 991px) and (min-width: 768px) {
.bannerLayout02 > .container { width: 100%; }
}
@media (max-width: 991px) {
.bannerLayout02 #inventorySearchWidget { background-color: #3F4443; }
}

/*------------------------------------*
    $WIDGET_MODELBAR
\*------------------------------------*/
.modelBarBg .sectionHeading {
	font-size: 36px;
	margin-bottom: 20px;
}
.modelBar.panel {
    border: none;
    padding: 0 1.5em;
    margin: 0;
    background: none;
}
.ttMpg, .ttYear, .ttMake { display: none; }
#modelBarWidget .vehicle, .mbCustomBtn { cursor: pointer; }
.modelBar .mbPopUpTitle { margin: 4px 0 8px; }
.modelBar .ptMpg {
    position: absolute;
    bottom: -10px;
    right: 0px;
    font-weight: 800;
    background-color: #eee;
    padding: 6px 8px 2px;
    border-radius: 4px 0 4px 0;
}
.modelBar .ptMpgLabel { font-size: 11px; }
.modelBar .popoverTitle .btn {
    margin: 0 0 8px;
    text-align: center;
}
.modelBar .popoverTitle .col-sm-6 {
    padding-left: 4px;
    padding-right: 4px;
}
.modelBar .popoverTitle.row { padding: 0 10px; }
/* MPG Fix */
.modelBar .col-model-thumb {
    position: relative;
    margin: -5px 0;
}
.modelBar .ttMpg {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
}
.mbThumbTitle, .mbTitleModel {
    margin-top: -10px;
    color: #333;
}

/*------------------------------------*
    $FIXED_HEADER
    jQuery('.headerWrapper').addClass('fixedHeaderArea');

    -add a padding-top to content div based on height of header section (may need multiple media queries)
\*------------------------------------*/
@media (min-width: 992px) {
.fixedHeaderArea { background: #fff; }
.fixedHeaderArea ~ #content { padding-top: 180px; }
}

/*------------------------------------*
    $MOBILE LEAD DRIVER
\*------------------------------------*/
#offerBar {
    text-align: center;
    padding: 8px 0;
}
#offerBar ul { margin-bottom: 0; }
#offerBar, #offerBar .h1 { font-size: 20px; }
#offerDropdown .specialText .text-cta {
	color: #FFF;
}

@media (min-width: 768px) and (max-width: 1199px) {
#offerBar, #offerBar .h1 { font-size: 24px; }
}
@media (min-width: 1200px) {
#offerBar, #offerBar .h1 { font-size: 32px; line-height: 28px; }
}

/*------------------------------------*
    SRP
\*------------------------------------*/
.srpVehicleSpecial {
	background: url('#SHAREDPATH#images/inventory/specialRibbonBuick-GMC.png') no-repeat !important;
}
.vehicle-card--mod .vehicle-title__car-bravo, .vehicle-card--mod .vehicle-title__condition, .vehicle-card--mod .vehicle-title__make-model, .vehicle-card--mod .vehicle-title__toyota-gold, .vehicle-card--mod .vehicle-title__toyota-silver, .vehicle-card--mod .vehicle-title__year {
	font-weight: 400;
}

/*------------------------------------*
    VDP
\*------------------------------------*/
.details-header .vehicle-title__year {
    color: #767676!important;
}

/*------------------------------------*
    Section titles
\*------------------------------------*/
.sec-title {
	position: relative;
	font-weight: 700;
	padding-bottom: 12px;
	text-transform: uppercase;
	border-bottom: 1px solid #f2f2f2;
}
.sec-title:before {
	position: absolute;
	content: '';
	left: 0px;
	bottom: 0px;
	width: 55px;
	height: 2px;
	background-color: #1E1A34!important;
}

/*------------------------------------*
    CARBRAVO
\*------------------------------------*/
.carBravoBtn .btn { 
	color: #fff;
	background-color: #0375D3;
	border-color: #0375D3;
}
.carBravoBtn .btn:hover, .carBravoBtn .btn:active, .carBravoBtn .btn:focus, .carBravoBtn .btn:visited { 
	color: #fff;
	background-color: #025ea9;
	border-color: #025ea9;
}

/*------------------------------------*
    01396147
\*------------------------------------*/
.banner-disclaimer-content .banner-disclaimer-btn { 
    width: 200px; margin: auto; 
}

footer .copyrightInfo .copyright a {
    color: var(--cta-background-color);
}

#content p a:not(.btn), #content-main li a:not(.btn), #content a.stat-text-link:not(.btn), footer .copyright a {
    text-decoration: underline;
}