@import "/assets/fonts/stratum-gmc/fonts.css";

/*------------------------------------*

    TABLE OF CONTENT - $ search prefix
	CUSTOM_PROPERTIES
    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
	SRP_VDP
	CARBRAVO
    cta             c00
    cta hover       aa0000
    main            212121
    main hover      c00

/*------------------------------------*
	$CUSTOM_PROPERTIES
\*------------------------------------*/
:root {
    --cta-background-color: #c00;
    --cta-font-color: #fff;
    --cta-hover-color: #c00;
    --main-color: #000;
}

/*------------------------------------*
    $FONT_FAMILY
\*------------------------------------*/
body { font-family: 'stratumGMC', sans-serif; font-weight: 400; font-size: 16px; }
body.homepage { background: #161616; color: #fff; }
strong, b { font-family: 'stratumGMC', sans-serif; font-weight: 700; }
.heading-xl, .heading-lg { font-family: 'stratumGMC', sans-serif; text-transform: uppercase; font-weight: 800; }
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 { font-family: 'stratumGMC', sans-serif; text-transform: uppercase; font-weight: 700; }
.btn, .heading-bold { font-family: 'stratumGMC', sans-serif; }
.heading-bold { font-weight: 700; }
#inventorySearchWidget .isTitle, .srpRefineSearch .panel-title, .srpVehicle h2, .srpVehicle h1.vehicleTitle, #vehiclePageViews h2, .featuredVehicle .title h3, strong, b { font-weight: 700; }
footer { text-align: center; }

/*------------------------------------*
    $FONT_COLOR
\*------------------------------------*/
hr { border-top-color: #ddd; }
.text-default { color: #333; }
.text-main { color: #000; }
.text-cta { color: var(--cta-background-color); }
.bg-alt1 .text-muted { color: #6B6B6B; }

/*------------------------------------*
    $FONT_SIZE
\*------------------------------------*/
.h1, h1 { font-size: 42px; }
.h2, h2 { font-size: 36px; }
.h3, h3 { font-size: 30px; }
.h4, h4 { font-size: 24px; }
.h5, h5 { font-size: 20px; }
.h6, h6 { font-size: 18px; }

/*@media (max-width: 991px) {
	body, .btn, .dropdown-menu, .form-control { font-size: 13px; }
}*/

/*------------------------------------*
    $BACKGROUND COLORS
\*------------------------------------*/
.bg-main {
    background-color: var(--main-color);
    border: 1px solid transparent;
    color: #fff;
}
.bg-cta {
    background-color: var(--cta-background-color);
    border: 1px solid transparent;
    color: #fff;
}
.bg-alt1 {
    background-color: #f3f3f3;
    border: 1px solid transparent;
	color: #000;
}
.bg-alt2 {
    background-color: #636363;
    border: 1px solid transparent;
	color: #fff;
}
.bg-alt3 {
    background-color: #262626;
    border: 1px solid transparent;
	color: #fff;
}
.bg-alt4 {
    background-color: #000;
    border: 1px solid transparent;
	color: #fff;
}

.offerBlock, .offerBlock .bg-main {
	background-color: #161616;
	color: #fff;
}
.offerBlock h2 {
	margin: 10px;
	vertical-align: middle;
}
.offerBlock .btn {
	margin: 10px;
	vertical-align: middle;
}

@media (max-width: 767px) {
	.snap-content { background-color: #fff !important; }
}

footer {
	background: #111;
	color: #fff;
}

/*------------------------------------*
    $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: var(--cta-background-color); }
a:hover, a:focus { color: #bf0e0e; }
.bg-main p a:not(.btn) { color: #ff3d3d; }
p a, p a:hover, p a:focus, a:focus:not(.btn), a:hover:not(.btn) { text-decoration: underline; }
p.lead a, p.lead a:hover, p.lead a:focus, p.larger a, p.larger a:hover, p.larger a:focus { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 2px; }
a:not(.btn), .bg-alt1 a:not(.btn), .well tr td a:not(.btn) { color: var(--cta-background-color); text-decoration: underline; }
a:not(.btn):hover, footer a:not(.btn):hover { color: #000; text-decoration: underline; }
a:not(.btn):active, a:not(.btn):focus { color: #464646; text-decoration: underline; }
a:disabled { color: #777; }
footer a:not(.btn) { color: inherit; text-decoration: underline; }

/* Special White BG Links */
.bg-white { background: #fff; color: var(--main-color); }
a .bg-white .text-link { color: var(--cta-background-color); transition: all 250ms ease-in-out; }
a:hover .bg-white .text-link { color: #000; text-decoration: underline; }
a:active .bg-white .text-link, a:focus .bg-white .text-link { color: #464646; text-decoration: none; }

/*------------------------------------*
    $LIST GROUP
\*------------------------------------*/

/*------------------------------------*
    $PANEL
\*------------------------------------*/
.panel, .panel-heading, .panel-footer { border-radius: 0; }
.panel { box-shadow: none; }
.panel-title { font-weight: 800; }
/*------------------------------------*
    $WELL
\*------------------------------------*/
.well {
    box-shadow: none;
    border-radius: 0;
}
/*------------------------------------*
    $TABLE
\*------------------------------------*/

/*------------------------------------*
    $TABS
\*------------------------------------*/
.nav-tabs.nav-justified > li > a, .nav-tabs > li > a { color: #000; background-color: #eee; }
.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: #212121;
    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: 0;
	border-width: 2px;
	padding: 8px 25px;
	font-size: 16px;
    -moz-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;
}
.btn-group-lg > .btn, .btn-lg { padding: 10px 30px; }
.srpRefineSearch #accordion ul li a { border-radius: 0; }
#hoursAccordion, #hoursAccordion a, #accordion, #accordion a { color: #000; text-decoration: none; }
#hoursAccordion .panel-heading { padding: 0;}
#hoursAccordion .panel-heading a { padding: 10px 15px;}
#hoursAccordion .panel-heading a:not(.collapsed) { background-color: var(--cta-background-color); color: #fff; text-decoration: none; }
#hoursAccordion a:hover, #hoursAccordion a:active, #hoursAccordion a:focus, #accordion a:hover, #accordion a:active, #accordion a:focus { color: #333; text-decoration: underline; }

/*------------------------------------*
    $BTN_CTA
\*------------------------------------*/
.btn-cta, .btn-default {
	color: #000;
	background: #fff;
	border-color: var(--cta-background-color);
}
.btn-cta:hover, .open > .dropdown-toggle.btn-cta, .btn-default:hover {
	color: #fff;
	background: var(--cta-background-color);
	border-color: var(--cta-background-color);
}
.btn-cta:focus, .btn-cta:active, .btn-cta.active, .btn-default:focus, .btn-default:active, .btn-default.active {
	color: #fff;
	background: #841815;
	border-color: #841815;
}
.bg-main .btn-cta, .homepage .btn-cta {
	color: #fff;
	background: #000;
	border-color: var(--cta-background-color);
}
.bg-main .btn-cta:hover, .bg-main .open > .dropdown-toggle.btn-cta {
	color: #fff;
	background: var(--cta-background-color);
	border-color: var(--cta-background-color);
}
.bg-main .btn-cta:focus, .bg-main .btn-cta:active, .bg-main .btn-cta.active {
	color: #fff;
	background: #841815;
	border-color: #841815;
}
.bg-cta .btn-cta {
	color: #fff;
	background: #000;
	border-color: #fff;
}
.bg-cta .btn-cta:hover, .bg-cta .open > .dropdown-toggle.btn-cta, .homepage .btn-cta:hover {
	color: #fff;
	background: var(--cta-background-color);
	border-color: var(--cta-background-color);
}
.bg-cta .btn-cta:focus, .bg-cta .btn-cta:active, .bg-cta .btn-cta.active, .homepage .btn-cta:focus, .homepage .btn-cta:active {
	color: #fff;
	background: #841815;
	border-color: #841815;
}
/*------------------------------------*
    $BTN_MAIN
\*------------------------------------*/
.btn-main, .btn-alt3.active, .nav .btn-alt3.active {
	color: #000;
	background: #fff;
	border-color: #000;
}
.btn-main:hover, .open .dropdown-toggle.btn-main {
	color: #fff;
	background: #000;
	border-color: #000;
}
.btn-main:focus, .btn-main:active, .btn-main.active {
	color: #fff;
	background: #464646;
	border-color: #464646;
}
.bg-main .btn-main, .bg-cta .btn-main, .homepage .btn-main {
	color: #fff;
	background: #000;
	border-color: #fff;
}
.bg-main .btn-main:hover, .bg-main .open .dropdown-toggle.btn-main, .bg-cta .btn-main:hover, .bg-cta .open .dropdown-toggle.btn-main, .homepage .btn-main:hover {
	color: #000;
	background: #fff;
	border-color: #fff;
}
.bg-main .btn-main:focus, .bg-main .btn-main:active, .bg-main .btn-main.active, .bg-cta .btn-main:focus, .bg-cta .btn-main:active, .bg-cta .btn-main.active, .homepage .btn-main:focus, .homepage .btn-main:active {
	color: #000;
	background: #bfbfbf;
	border-color: #bfbfbf;
}
/*------------------------------------*
    $BTN_ALT1
\*------------------------------------*/
.btn-alt1 {
    color: var(--cta-background-color);
	background-color: #fff;
	border-color: var(--cta-background-color);
	border: 2px solid var(--cta-background-color);
}
.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: var(--cta-background-color);
    border-color: var(--cta-background-color);
}
/*------------------------------------*
    $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: #000;
    border-color: #000;
}
.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: #111;
    border-color: #111;
}
.showroom .menu .btn-alt3 { background-image: none; } /* used on showroom page, in the left menu section */
/*------------------------------------*
    $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
\*------------------------------------*/
/* Link Styling */
.homepage a:not(.btn), .homepage .bg-alt1 a:not(.btn), footer a:not(.btn) { color: #fff; text-decoration: underline; }
.homepage a:not(.btn):hover, .homepage a:not(.btn):active, .homepage a:not(.btn):focus, footer a:not(.btn):hover, footer a:not(.btn):active, footer a:not(.btn):focus { color: #fff; text-decoration: none; }
.homepage a:disabled, footer a:not(.btn):disabled { color: #777; }

.inventory_list .btn { border-radius: 0; }
.homepage .text-muted { color: #B6B6B6; }

@media (max-width: 767px) {
	body.homepage .snap-content { background: #25282a !important; }
}

.homepage #disclaimerBtn-Main.btn-sm { font-size: 10px; padding: 3px 8px; right: 0; left: auto; }
#disclaimerModal-Main { color: #000; }

#dealerOnCoupon { color: var(--main-color); }

/*------------------------------------*
    $HOME_QUICK-NAV
\*------------------------------------*/
.qn-item .fa { -webkit-transition: all .3s ease-in-out; -moz-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: var(--cta-background-color); border: 3px solid var(--cta-background-color); border-radius: 50%; height: 70px; width: 70px; padding-top: 12px; }
.qn-item .qn-inner:hover .fa { background-color: var(--cta-background-color); color: #fff; }
.qn-item hr { border-top: 1px solid #dbdbdb; }

.qnBlock .flex-item { box-shadow: none; border: 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: var(--cta-background-color); border-color: var(--cta-background-color); color: #fff; }
.bannerWrapper .btn-main:hover { background-color: #bf0e0e; border-color: #bf0e0e; }

@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: #212121; }
}

/*------------------------------------*
    $WIDGET_MODELBAR
\*------------------------------------*/


/*------------------------------------*
    $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; }
.offerBlock, .offerBlock .bg-main { background-color: #161616; }
.offerBlock h2 { margin: 10px; vertical-align: middle; }
.offerBlock .btn { margin: 10px; vertical-align: middle; }

@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_VDP
\*------------------------------------*/
/* SRP */
.multi-tabs.nav-tabs.nav-justified > li {text-align: center; border: 1px solid #d8d8d8; border-left: 0;}
.multi-tabs.nav-tabs.nav-justified > li:first-of-type {border-left: 1px solid #d8d8d8;}
.multi-tabs li button {border-radius: 0 !important; background-color: #fff; color: #000; border: none; border-bottom: 3px solid #fff; outline: none; width: 100%; margin: 0 auto; transition: all 250ms ease-in-out;}
.multi-tabs li:not(.active) button:hover {background-color: #f0f0f0; border-bottom: 3px solid var(--cta-background-color); color: var(--cta-background-color);}
.multi-tabs li.active button {border-radius: 0 !important; background-color: #fff; border-color: #fff; border-right-color: #fff; border-bottom: 3px solid var(--cta-background-color); outline: none;}
.checkbox:before, input, #sephora_filter .tile_display .tile_display_child, #srp_filter .tile_display .tile_display_child, .search-bar, #cBlock2 .oav-cta-sephora__btn[data-v-35fc2dab] {border-radius: 0 !important;}
.srpVehicleSpecial {
    background: url('#SHAREDPATH#images/inventory/specialRibbonGMC.png') no-repeat !important;
}

/* VDP */
.vdp .top-actions .lead-action, .vehicle-images .thumbnails #load-more-vehicles #load-more-vehicles__btn, .all-features .feature-tabs__link { border-radius: 0; }
.all-features .feature-tabs__link--active { border: 2px solid var(--cta-background-color); color: var(--main-color); padding: .14em 1.36em; }
.all-features .feature-tabs__link--active::before { opacity: 0; border-radius: 0; }

/* MRP */
.mrp .feature-search-button { color: inherit; }

/*------------------------------------*
    $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;
}

/*------------------------------------*
    VIS ID Corrections
\*------------------------------------*/
.banner-disclaimer-content .banner-disclaimer-btn { 
    width: 200px; margin: auto; 
}
#offerContainer .help-block, #offerContainer.bg-main a:not(.btn) {
    color: inherit !important;
}
#contactUsWidget .help-block {
    color: #333;
}

/* Inner page CTA corrections */
#testdrive .btn-main, #quote .btn-main, #tradeForm .btn-main, #findMyCar .btn-main, #orderparts .btn-main, #fm_calc .btn-main, #fm_power .btn-main, #careersForm .btn-main, #hoursdirectionsbtn.btn-main, .GM-Rewards-page .btn-main, #serviceApp .btn-main, #preapprovedForm1 .btn-main, #SRPNoResultsForm .btn-main, #zeroResultsForm .btn-main {color: #000; background: #fff; border-color: var(--cta-background-color);}
#testdrive .btn-main:hover, #quote .btn-main:hover, #tradeForm .btn-main:hover, #findMyCar .btn-main:hover, #orderparts .btn-main:hover, #fm_calc .btn-main:hover, #fm_power .btn-main:hover, #careersForm .btn-main:hover, #hoursdirectionsbtn.btn-main:hover, .GM-Rewards-page .btn-main:hover, #serviceApp .btn-main:hover, #preapprovedForm1 .btn-main:hover, #SRPNoResultsForm .btn-main:hover, #zeroResultsForm .btn-main:hover {color: #fff; background: var(--cta-background-color); border-color: var(--cta-background-color); }
#testdrive .btn-main:active, #testdrive .btn-main:focus, #quote .btn-main:active, #quote .btn-main:focus, #tradeForm .btn-main:active, #tradeForm .btn-main:focus, #findMyCar .btn-main:active, #findMyCar .btn-main:focus, #orderparts .btn-main:active, #orderparts .btn-main:focus, #fm_calc .btn-main:active, #fm_calc .btn-main:focus, #fm_power .btn-main:active, #fm_power .btn-main:focus, #careersForm .btn-main:active, #careersForm .btn-main:focus, #hoursdirectionsbtn.btn-main:active, #hoursdirectionsbtn.btn-main:focus, .GM-Rewards-page .btn-main:active, .GM-Rewards-page .btn-main:focus, #serviceApp .btn-main:active, #serviceApp .btn-main:focus, #preapprovedForm1 .btn-main:active, #preapprovedForm1 .btn-main:focus, #SRPNoResultsForm .btn-main:active, #SRPNoResultsForm .btn-main:focus, #zeroResultsForm .btn-main:active, #zeroResultsForm .btn-main:focus {color: #fff; background: #841815; border-color: #841815;}

.inventory_list .btn {
    border-radius: 0 !important;
}