/***************************************************************** HEADER *****************************************************************/ /*************** HEADER - MOBILE - MAP CTA ****************/ /*************** HEADER - MOBILE - MENU BURGER ****************/ /*************** HEADER - MOBILE - OFF CANVAS ****************/ /*************** HEADER - MOBILE - MENU - MAIN NAV ****************/ /*************** HEADER - MOBILE - MENU - SECONDARY NAV ****************/ /*************** HEADER - MOBILE - MENU - COMPARE ****************/ /*************** HEADER - MOBILE - ADDRESS ****************/ /*************** HEADER - MOBILE - PHONE ****************/ /*************** HEADER - PHONE ****************/ /*************** HEADER - ADDRESS ****************/ /*************** HEADER - LANGUAGE SWITCHER ****************/ /*************** HEADER - DEALER NAME ****************/ /*************** HEADER - PRIMARY CTA ****************/ /*************** HEADER - COMPARE ****************/ /*************** HEADER - SEPARATOR ****************/ /*************** HEADER - QUICK LINKS ****************/ /***************************************************************** FOOTER *****************************************************************/ /*************** FOOTER - GENERAL ****************/ /*************** FOOTER - MAIN NAV ****************/ /*************** FOOTER - DEALER INFOS ****************/ /*************** FOOTER - PRIMARY CTA ****************/ /*************** FOOTER - TOP ****************/ /*************** FOOTER - BOTTOM ****************/ /*************** FOOTER - COPYRIGHT ****************/ /***************************************************************** BLOC COLOR PRIMARY *****************************************************************/ /***************************************************************** BLOC COLOR SECONDARY *****************************************************************/ /***************************************************************** BLOC COLOR SIMILARLY *****************************************************************/ /***************************************************************** UTILS *****************************************************************/ /***************************************************************** ELEMENT FONT COLOR *****************************************************************/ /***************************************************************** BOX COLOR *****************************************************************/ /***************************************************************** NAV BLOCK COLOR *****************************************************************/ /***************************************************************** BLOCK FORM *****************************************************************/ /***************************************************************** Page Contact Bottom Section *****************************************************************/ /***************************************************************** BUTTONS *****************************************************************/ /***************************************************************** HOME SOCIAL BLOCK *****************************************************************/ /***************************************************************** HOME INVENTORY CTAs *****************************************************************/ /***************************************************************** HOME SMALL CTAs *****************************************************************/ /***************************************************************** HOME INVENTORY *****************************************************************/ /***************************************************************** HOME CATALOG *****************************************************************/ /***************************************************************** INSTAGRAM FEED *****************************************************************/ /***************************************************************** WIDGETS *****************************************************************/ /***************************************************************** PAGE WHY BUY *****************************************************************/ /***************************************************************** INVENTORY LISTING *****************************************************************/ /***************************************************************** Inventory Preview - Block *****************************************************************/ /***************************************************************** Inventory Preview - Button *****************************************************************/ /***************************************************************** Catalog Preview - Block *****************************************************************/ /***************************************************************** VDP - Vehicle Header *****************************************************************/ /***************************************************************** Catalog Preview - Button *****************************************************************/ /***************************************************************** SOCIAL BLOCK CTAs *****************************************************************/ /***************************************************************** VIDEOS CHARLIE *****************************************************************/ /***************************************************************** PROMO HEADER SLIDER *****************************************************************/ /***************************************************************** HOME REVIEWS *****************************************************************/ /***************************************************************** STICKY CTAS MODULES *****************************************************************/ /***************************************************************** HIGHLIGHTS MODULES *****************************************************************/ /***************************************************************** HIGHLIGHTS MODULES SECONDARY *****************************************************************/ /***************************************************************** HIGHLIGHTS MODULES TERTIARY *****************************************************************/ /***************************************************************** HIGHLIGHTS MODULES ALPHA *****************************************************************/ /***************************************************************** HIGHLIGHTS MODULES DELTA *****************************************************************/ /***************************************************************** HIGHLIGHTS MODULES ECHO *****************************************************************/ /***************************************************************** VEHICLE DETAILS BG IMAGE or COLOR *****************************************************************/ /***************************************************************** ABOUT *****************************************************************/ /***************************************************************** PAGE TEAMS *****************************************************************/ /***************************************************************** BREADCRUMB *****************************************************************/ /***************************************************************** INVENTORY FILTERS *****************************************************************/ /***************************************************************** Gradient Primary *****************************************************************/ /***************************************************************** PAGE TECHNOLOGY *****************************************************************/ /***************************************************************** PAGE TECHNOLOGY *****************************************************************/ /**/ [data-theme-style~="mainFont__regular"]{ font-family: "MazdaTypeTT-Regular", "Verdana", "sans-serif";; font-weight: normal; } [data-theme-style~="mainFont__italic"]{ font-family: "MazdaTypeTT-Italic", "Verdana", "sans-serif";; font-weight: normal; } [data-theme-style~="mainFont__bold"]{ font-family: "MazdaTypeTT-Bold", "Verdana", "sans-serif";; font-weight: normal; } /**/ /***************************************************************** BACKGROUND *****************************************************************/ [data-theme-style~="headerBannerImage"]{ background-color: #000000; } [data-theme-style~="bodyPattern_primary"]{ color:#101010; background-color: #f5f5f5; } [data-theme-style~="bodyPattern_ultraLighten"]{ background: #242424 url('https://img.sm360.ca/images/web/'); background-repeat: repeat; } [data-theme-style~="bodyPattern_lighten"]{ background: #1d1d1d url('https://img.sm360.ca/images/web/'); background-repeat: repeat; } [data-theme-style~="vehicleDetails__ctaBgColor"]{ background-color: #ffffff; } /**************** BG PRIMARY *****************/ [data-theme-style~="bodyPrimary"]{ color:#101010; background-color: #ffffff; } [data-theme-style~="bodyPrimaryBg__Color"]{ background: #ffffff; } [data-theme-style~="bodyPrimaryBg"]{ background: #ffffff url("https://img.sm360.ca/images/web/") no-repeat top center; } [data-theme-style~="bodyPrimaryBg_bottom"]{ background: #ffffff url("https://img.sm360.ca/images/web/") no-repeat bottom center; } [data-theme-style~="bodyPrimary_fontColor"]{ color:#101010; } [data-theme-style~="bodyPrimary_titleColor"]{ color:#101010; } /*************** BG SECONDARY ****************/ [data-theme-style~="bodySecondary"]{ background-color:#f2f2f2; color:#303030; } [data-theme-style~="bodySecondary_bgColor"]{ background-color:#f2f2f2; } [data-theme-style~="bodySecondary_titleColor"]{ color:#303030; } [data-theme-style~="bodySecondary_fontColor"]{ color:#303030; } /*************** BG SIMILARLY ****************/ [data-theme-style~="bodySimilarly"]{ background-color:#dce5e8; color:#303030; } [data-theme-style~="bodySimilarly_titleColor"]{ color:#303030; } /***************************************************************** HOME INVENTORY *****************************************************************/ [data-theme-style~="homeInventory__bgImage"]{ background-color: #000000; } [data-theme-style~="homeInventory__nameColor"], [data-theme-style~="homeInventory__nameColor"]:hover{ color: #101010; } [data-theme-style~="homeInventory_bgColor"] { background-color: #f5f5f5; } [data-theme-style~="homeInventory_second_bgColor"] { background-color: #ffffff; } [data-theme-style~="homeInventory_titleColor"] { color: #ffffff; } [data-theme-style~="homeInventory_fontColor"] { color: #000000; } [data-theme-style~="homeInventory_primaryColor"] { color: #47c671; } [data-theme-style~="homeInventory_secondaryColor"] { color: #cccccc; } [data-theme-style~="homeInventory_ctaColor"], [data-theme-style~="homeInventory_ctaColor"]:hover, [data-theme-style~="homeInventory_ctaColor"]:focus, [data-theme-style~="homeInventory_ctaColor"]:active { color: #47c671; } [data-theme-style~="homeInventory_borderColor"] { border-color: #dddddd; } [data-theme-style~="homeInventory_bottomBgColor"] { background-color: #e7e7e7; } [data-theme-style~="homeInventory_bottomFontColor"] { color: #101010; } [data-theme-style~="homeInventory_bottomCtaColor"], [data-theme-style~="homeInventory_bottomCtaColor"]:hover, [data-theme-style~="homeInventory_bottomCtaColor"]:focus, [data-theme-style~="homeInventory_bottomCtaColor"]:active { color: #47c671; } /*************** Home Background Sections ****************/ [data-theme-style~="homeService_bgColor"]{ background-color: #101010; } [data-theme-style~="homeService_fontColor"]{ color: #101010; } [data-theme-style~="homeService_iconColor"] li:before{ color: #101010; } [data-theme-style~="homeRapidSearch_bgImage"]{ background: url('https://img.sm360.ca/images/web/default/archetype premium/style/rapidsearch_bgimage1539904281547.jpg') top center; background-repeat: no-repeat; background-size: cover; } [data-theme-style~="homeRapidSearch_BgColor"]{ background-color: #f5f5f5; } [data-theme-style~="homeRapidSearch_fontColor"]{ color: #ffffff; } [data-theme-style~="homeCatalog_bgColor"]{ background-color: #101010; } @media (max-width:640px) { [data-theme-style~="homeCatalog_bgImage"]{ background-color: #101010; } } [data-theme-style~="homeCatalog_fontColor"]{ color: #101010; } [data-theme-style~="homeNews_fontColor"]{ color: #000000; } [data-theme-style~="homeNews_titleColor"]{ color: #ffffff; } [data-theme-style~="newsSlider__controlsColor"], [data-theme-style~="newsSlider__controlsColor"]:hover, [data-theme-style~="newsSlider__controlsColor"]:focus{ color: #47c671; } [data-theme-style~="newsSlider__pagerColor"]{ color: #ffffff } [data-theme-style~="newsSlider__pagerColor"] .active, [data-theme-style~="newsSlider__pagerColor"] .slick-active{ background-color: #ffffff } [data-theme-style~="homeAbout_bgImageAlpha"]{ background: url('https://img.sm360.ca/images/web/lallo-mazda/2368/bg-seo1547136105426.jpg') top center; background-repeat: no-repeat; background-size: cover; } [data-theme-style~="homeAbout_bgImageBeta"]{ background: url('https://img.sm360.ca/images/web/default/mazda preferred/style/bg-seo-2-1546030300515.png') top center; background-repeat: no-repeat; background-size: cover; } [data-theme-style~="homeAbout_fontColor"]{ color: #ffffff; } [data-theme-style~="homeAbout_titleColor"]{ color: #000000; } [data-theme-style~="homeAbout_bgColor"]{ background-color: #101010; } /*************** BOX COLOR ****************/ [data-theme-style~="boxColor"]{ background-color:#ffffff; color:#303030; -webkit-box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16); -moz-box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16); box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16); } [data-theme-style~="box_bgColor"]{ background-color: #ffffff; } [data-theme-style~="box_bgColor"] li:before{ color:#47c671; } [data-theme-style~="box_fontColor"]{ color: #303030; } /**************** BODY LINK PRIMARY *****************/ [data-theme-style~="linkPrimary"]{ color:#101010 } [data-theme-style~="linkPrimary"]:hover, [data-theme-style~="linkPrimary"]:focus, [data-theme-style~="linkPrimary"]:active{ color:#000000 } /**************** BODY LINK SECONDARY *****************/ [data-theme-style~="linkSecondary"]{ color:#47c671 } [data-theme-style~="linkSecondary"]:hover, [data-theme-style~="linkSecondary"]:focus, [data-theme-style~="linkSecondary"]:active{ color:#000000 } [data-theme-style~="btnAlphaPrimary"]{ color:#ffffff; background-color: #101010; background: -webkit-linear-gradient(to top, #101010, #101010); /* For Safari 5.1 to 6.0 */ background: -o-linear-gradient(to top, #101010, #101010); /* For Opera 11.1 to 12.0 */ background: -moz-linear-gradient(to top, #101010, #101010); /* For Firefox 3.6 to 15 */ background: linear-gradient(to top, #101010, #101010); /* Standard syntax (must be last) */ } [data-theme-style~="btnAlphaPrimary"]:hover, [data-theme-style~="btnAlphaPrimary"]:focus, [data-theme-style~="btnAlphaPrimary"]:active{ color:#ffffff; background: -webkit-linear-gradient(to top, #910a2d, #910a2d); /* For Safari 5.1 to 6.0 */ background: -o-linear-gradient(to top, #910a2d, #910a2d); /* For Opera 11.1 to 12.0 */ background: -moz-linear-gradient(to top, #910a2d, #910a2d); /* For Firefox 3.6 to 15 */ background: linear-gradient(to top, #910a2d, #910a2d); /* Standard syntax (must be last) */ } [data-theme-style~="btnAlphaSecondary"]{ color:#101010; border-color: #101010; } [data-theme-style~="btnAlphaSecondary"]:hover, [data-theme-style~="btnAlphaSecondary"]:focus, [data-theme-style~="btnAlphaSecondary"]:active, [data-theme-style~="btnAlphaSecondary"].active{ color:#ffffff; border-color: #910a2d; background-color: #910a2d !important; } [data-theme-style~="btnAlphaTertiary"]{ color:#999999; border-color: #101010; background-color: #474747; background: -webkit-linear-gradient(to top, #474747, #333333); /* For Safari 5.1 to 6.0 */ background: -o-linear-gradient(to top, #474747, #333333); /* For Opera 11.1 to 12.0 */ background: -moz-linear-gradient(to top, #474747, #333333); /* For Firefox 3.6 to 15 */ background: linear-gradient(to top, #474747, #333333); /* Standard syntax (must be last) */ } [data-theme-style~="btnAlphaTertiary"]:hover, [data-theme-style~="btnAlphaTertiary"]:focus, [data-theme-style~="btnAlphaTertiary"]:active, [data-theme-style~="btnAlphaTertiary"].selected { color:#101010; background-color: #323232; background: -webkit-linear-gradient(to top, #323232, #242424); /* For Safari 5.1 to 6.0 */ background: -o-linear-gradient(to top, #323232, #242424); /* For Opera 11.1 to 12.0 */ background: -moz-linear-gradient(to top, #323232, #242424); /* For Firefox 3.6 to 15 */ background: linear-gradient(to top, #323232, #242424); /* Standard syntax (must be last) */ } [data-theme-style~="btnAlphaTertiary"]:after{ background-color: #999999; } [data-theme-style~="btnAlphaTertiary"]:hover:after, [data-theme-style~="btnAlphaTertiary"]:focus:after, [data-theme-style~="btnAlphaTertiary"]:active:after, [data-theme-style~="btnAlphaTertiary"].selected:after { background-color: #910a2d; } [data-theme-style~="btnAlphaQuaternary"]{ color:#ffffff; border-color: #910a2d; background-color: #910a2d; } [data-theme-style~="btnAlphaQuaternary"]:hover, [data-theme-style~="btnAlphaQuaternary"]:focus, [data-theme-style~="btnAlphaQuaternary"].active{ color:#000000; border-color: #000000; background-color: #ffffff !important; } [data-theme-style~="btnBetaPrimary"]{ color:#101010; border-color: #ffffff; background-color: #ffffff; } [data-theme-style~="btnBetaPrimary"]:hover, [data-theme-style~="btnBetaPrimary"]:focus, [data-theme-style~="btnBetaPrimary"]:active{ color:#ffffff; border-color: #910a2d; background-color: #910a2d !important; } [data-theme-style~="btnBetaSecondary"]{ color:#ffffff; border-color: #ffffff; } [data-theme-style~="btnBetaSecondary"]:hover, [data-theme-style~="btnBetaSecondary"]:focus, [data-theme-style~="btnBetaSecondary"]:active, [data-theme-style~="btnBetaSecondary"].active{ color:#ffffff; border-color: #910a2d; background-color: #910a2d !important; } [data-theme-style~="btnBetaTertiary"]{ color:#ffffff; background-color: #ffffff; border-color: #ffffff; } [data-theme-style~="btnBetaTertiary"]:hover, [data-theme-style~="btnBetaTertiary"]:focus, [data-theme-style~="btnBetaTertiary"]:active{ color:#ffffff; background-color: #910a2d; } [data-theme-style~="btnBetaQuaternary"]{ color:#ffffff; background-color: #910a2d; } [data-theme-style~="btnBetaQuaternary"]:hover, [data-theme-style~="btnBetaQuaternary"]:focus, [data-theme-style~="btnBetaQuaternary"]:active{ color:#ffffff; } [data-theme-style~="btnBetaTertiary"]:hover, [data-theme-style~="btnBetaTertiary"]:focus, [data-theme-style~="btnBetaTertiary"]:active{ color:#ffffff; background-color: #910a2d; } [data-theme-style~="btnCharliePrimary"]{ color:#ffffff; background-color: #9be0b2; } [data-theme-style~="btnCharliePrimary"] [data-theme-sprite]{ color:#ffffff; background-color: #9be0b2; } [data-theme-style~="btnCharliePrimary"]:hover, [data-theme-style~="btnCharliePrimary"]:focus, [data-theme-style~="btnCharliePrimary"]:active{ color:#47c671; background-color: #ffffff; } [data-theme-style~="btnCharliePrimary"]:hover [data-theme-sprite], [data-theme-style~="btnCharliePrimary"]:focus [data-theme-sprite], [data-theme-style~="btnCharliePrimary"]:active [data-theme-sprite]{ color:#ffffff; background-color: #ffffff; } [data-theme-style~="btnCharlieSecondary"]{ color:#ffffff; background-color: #1c1c1c; } [data-theme-style~="btnCharlieSecondary"] [data-theme-sprite]{ color:#ffffff; background-color: #1c1c1c; } [data-theme-style~="btnCharlieSecondary"]:hover, [data-theme-style~="btnCharlieSecondary"]:focus, [data-theme-style~="btnCharlieSecondary"]:active{ color:#1c1c1c; background-color: #ffffff; } [data-theme-style~="btnCharlieSecondary"]:hover [data-theme-sprite], [data-theme-style~="btnCharlieSecondary"]:focus [data-theme-sprite], [data-theme-style~="btnCharlieSecondary"]:active [data-theme-sprite]{ color:#1c1c1c; background-color: #ffffff; } [data-theme-style~="btnEchoPrimary"]{ color:#ffffff; background-color: #101010; } [data-theme-style~="btnEchoPrimary"]:hover{ color:#ffffff; } [data-theme-style~="btnEchoPrimary"] [data-theme-sprite]{ color:#101010 ; background-color: #910a2d; } [data-theme-style~="btnGammaPrimary"]{ color:#ffffff; background-color: #101010; } [data-theme-style~="btnGammaPrimary"]:hover{ color:#ffffff; background-color: #2a2a2a; } [data-theme-style~="btnGammaPrimary"]:focus, [data-theme-style~="btnGammaPrimary"]:active{ color:#ffffff; background-color: #910a2d; } /***************************************************************** BUTTON *****************************************************************/ [data-theme-style~="btnRegularPrimary"], [data-theme-style~="btnRegularPrimary"]:hover, [data-theme-style~="btnRegularPrimary"]:focus, [data-theme-style~="btnRegularPrimary"]:active{ color:#999999 } [data-theme-style~="btnRegularPrimary"]:before{ border-color:#999999 } [data-theme-style~="btnRegularSecondary"]{ color:#999999 } [data-theme-style~="btnRegularSecondary"]:hover, [data-theme-style~="btnRegularSecondary"]:focus, [data-theme-style~="btnRegularSecondary"]:active{ color:#999999 } [data-theme-style~="btnRegularTerciary"]{ color:#ffffff } [data-theme-style~="btnRegularTerciary"]:hover, [data-theme-style~="btnRegularTerciary"]:focus, [data-theme-style~="btnRegularTerciary"]:active{ color:#b3b3b3 } /**************** BODY LINK PRIMARY *****************/ [data-theme-style~="linkPrimary"]{ color:#101010 } [data-theme-style~="linkPrimary"]:hover, [data-theme-style~="linkPrimary"]:focus, [data-theme-style~="linkPrimary"]:active{ color:#000000 } /**************** BODY LINK SECONDARY *****************/ [data-theme-style~="linkSecondary"]{ color:#47c671 } [data-theme-style~="linkSecondary"]:hover, [data-theme-style~="linkSecondary"]:focus, [data-theme-style~="linkSecondary"]:active{ color:#000000 } [data-theme-style~="btnGhostPrimary"]{ border-color: #9be0b2; color: #9be0b2; } [data-theme-style~="btnGhostPrimary"]:hover{ border-color: #adfac6; color:#adfac6; } [data-theme-style~="btnGhostPrimary"]:focus, [data-theme-style~="btnGhostPrimary"]:active{ border-color: #9be0b2; background: #9be0b2; color: #ffffff; } [data-theme-style~="btnGhostSecondary"]{ color: #ffffff; border-color: #ffffff; } [data-theme-style~="btnGhostSecondary"]:hover{ color: #ffffff; border-color: #ffffff; } [data-theme-style~="btnGhostSecondary"]:focus, [data-theme-style~="btnGhostSecondary"]:active{ background: #ffffff; color: #000000; border-color: #ffffff; } /**************** BTN PRIMARY *****************/ [data-theme-style~="btnPrimary"]{ color:#ffffff; background-color: #101010; } [data-theme-style~="btnPrimary"]:hover{ color:#ffffff; background-color: #2a2a2a; } [data-theme-style~="btnPrimary"]:focus, [data-theme-style~="btnPrimary"]:active{ color:#ffffff; background-color: #910a2d; } /**************** BTN HEADER *****************/ [data-theme-style~="btnHeader"]{ color:#ffffff; background-color: #fd8606; } [data-theme-style~="btnHeader"]:hover{ color:#ffffff; background-color: #e47805; } [data-theme-style~="btnHeader"]:focus, [data-theme-style~="btnHeader"]:active{ color:#fd8606; background-color: #ffffff; } /**************** BTN SPECIAL *****************/ [data-theme-style~="btnSpecial"]{ color:#ffffff; background-color: #22992e; } [data-theme-style~="btnSpecial"]:hover{ color:#ffffff; background-color: #28b336; } [data-theme-style~="btnSpecial"]:focus, [data-theme-style~="btnSpecial"]:active{ color:#22992e; background-color: #ffffff; } /**************** BTN TRUCK *****************/ [data-theme-style~="btnTruck"]{ color:#000000; background-color: #ffcb2e; } [data-theme-style~="btnTruck"]:hover{ color:#000000; background-color: #e6b729; } [data-theme-style~="btnTruck"]:focus, [data-theme-style~="btnTruck"]:active{ color:#ffcb2e; background-color: #000000; } /**************** BTN FORM *****************/ [data-theme-style~="btnForm"]{ color:#ffffff; background-color: #fd8606; } [data-theme-style~="btnForm"]:hover{ color:#ffffff; background-color: #e47805; } [data-theme-style~="btnForm"]:focus, [data-theme-style~="btnForm"]:active{ color:#fd8606; background-color: #ffffff; } [data-theme-style~="btnSocialPrimary"]{ color: #999999; } /*************** STICKY ****************/ [data-theme-style~="stickyCtas"] a{ color: #111111; } [data-theme-style~="stickyCtas__ctaBgColor"]{ background-color: #f2f2f2; } [data-theme-style~="stickyCtas__pictoBgColor"]{ background-color: #47c671; } /*************** RAPID SEARCH ****************/ [data-theme-style~="rapidSearch"]{ background: url("https://img.sm360.ca/images/web/default/archetype premium/style/rapidsearch_bgimage1539904234674.jpg") no-repeat center center; color: #ffffff; } [data-theme-style~="rapidSearch_color"], [data-theme-style~="rapidSearch_color"]:not(.active):hover{ color: #ffffff; border-bottom: 2px solid #ffffff; } [data-theme-style~="rapidSearch_color"].active{ color: #101010; border-bottom: 2px solid #910a2d; } input[type=radio] + [data-theme-style~="rapidSearchCtas__radio"] .radio-button__label-radio{ border-color: #ffffff; background-color: #ffffff; } input[type="radio"]:checked + [data-theme-style~="rapidSearchCtas__radio"] .radio-button__label-radio{ border-color: #101010; } input[type="radio"]:checked + [data-theme-style~="rapidSearchCtas__radio"] .radio-button__label-radio:before{ background-color: #101010; } [data-theme-style~="rapidSearchActive_fontColor"]{ color: #101010; } [data-theme-style~="rapidSearchInactive_fontColor"]{ color: #ffffff; } [data-theme-style~="rapidSearchCtas_fontColor"]{ color: #ffffff; } [data-theme-style~="rapidSearchCtas_bgColor"]{ background-color: #0e2f45; } [data-theme-style~="rapidSearchPicto_Color"]{ color: #999999; } /*************** RAPID SEARCH - ALPHA ****************/ [data-theme-style~="rapidSearchAlpha_color"]{ -webkit-text-shadow: 0 0 10px #ffffff; -moz-text-shadow: 0 0 10px #ffffff; text-shadow: 0 0 10px #ffffff; color: rgba(255,255,255,0.3); } [data-theme-style~="rapidSearchAlpha_color"].active{ -webkit-text-shadow: none; -moz-text-shadow: none; text-shadow: none; color: #101010; } [data-theme-style~="rapidSearchAlpha_color"]:not(.active):hover{ -webkit-text-shadow: none; -moz-text-shadow: none; text-shadow: none; color: #ffffff; } /***************************************************************** HEADER *****************************************************************/ [data-theme-style~="header"]{ background-color: #101010; } [data-theme-style~="headerTopNavHome"]{ color: #ffffff; background: #060606; } /* Header General - OLD */ [data-theme-style~="header_linkColor"]{ color: #ffffff; } [data-theme-style~="header_linkColor"]:hover{ color: #cccccc; } /* Header General - OLD END */ /*************** HEADER - PHONE ****************/ [data-theme-style~="header__phone__labelTextColor"]{ color: #1c1c1c; } [data-theme-style~="header__phone__numberColor"]{ color: #1c1c1c; } [data-theme-style~="header__phone__numberColor"]:hover{ color: #1c1c1c; } /*************** HEADER - ADDRESS ****************/ [data-theme-style~="header__address__textColor"]{ color: #1c1c1c; } [data-theme-style~="header__address__textColor"]:hover{ color: #1c1c1c; } /*************** HEADER - LANGUAGE SWITCHER ****************/ [data-theme-style~="header__languageSwitcher__textColor"]{ color: #ffffff; } [data-theme-style~="header__languageSwitcher__hoverTextColor"]:hover{ color: #ffffff; } [data-theme-style~="header__languageSwitcher__textColor"].language-switch__item--active{ color: #ffffff; } /*************** HEADER - QUICK LINKS ****************/ [data-theme-style~="headerTopNav__dropdownBtn"]>a{ color: #ffffff; background-color: #236138; } .active [data-theme-style~="headerTopNav__dropdownBtn"]>a, [data-theme-style~="headerTopNav__dropdownBtn"]:hover>a{ color: #1c1c1c; background-color: #e4e8e8; } [data-theme-style~="headerTopNav__dropdownContent"]{ background-color: #f8f9f9; } [data-theme-style~="headerTopNav__dropdownContent"] a{ color: #1c1c1c; background-color: #f8f9f9; } [data-theme-style~="headerTopNav__dropdownContent"] a:hover{ color: #ffffff; background-color: #47c671; } /*************** HEADER - DEALER NAME ****************/ [data-theme-style~="header__dealerName__textColor"]{ color: #000000; } /*************** HEADER - PRIMARY CTA ****************/ [data-theme-style~="header__primaryCta"]{ color: #4a4f54; } [data-theme-style~="header__primaryCta"]:hover{ color: #1c1c1c; } /*************** HEADER - COMPARE ****************/ /* Compare - OLD */ [data-theme-style~="navCompare"]{ color: #ffffff; } [data-theme-style~="navCompare"]:hover{ color: #ffffff; } [data-theme-style~="compareBox__colorAfter"]:after{ border-color: transparent transparent #ffffff; } [data-theme-style~="compareBox__colorBefore"]:before{ border-color: transparent transparent #101010; } /* Compare - OLD END */ [data-theme-style~="header__compare__dropdownCta"]>span{ color: #ffffff; background-color: #1c1c1c; } [data-theme-style~="header__compare__dropdownCta"]:hover>span{ color: #4a4f54; background-color: #ffffff; } [data-theme-style~="header__compare__dropdownBox"]{ color: #1c1c1c; background-color: #e4e8e8 !important; } [data-theme-style~="header__compare__dropdownBox"]:after{ border-color: transparent transparent #e4e8e8 !important; } [data-theme-style~="header__compare__dropdownBoxCta"]{ color: #ffffff; background-color: #1c1c1c; border-color: #1c1c1c; } [data-theme-style~="header__compare__dropdownBoxCta"]:hover{ color: #4a4f54; background-color: #ffffff; border-color: #eef1f1; } /*************** HEADER - SEPARATOR ****************/ [data-theme-style~="header__separator"]{ border-color: #eef1f1 !important; } [data-theme-style~="header__separator__secondary"]{ border-color: #d7dada !important; } /*************** HEADER - MAIN NAV ****************/ [data-theme-style~="headerNavigationMain"]{ background-color: #101010; color: #ffffff; } [data-theme-style~="headerNavMain__Elem"].is-active, [data-theme-style~="headerNavMain__Elem"]:hover{ } [data-theme-style~="headerNavMain__Elem"] > a{ color: #ffffff; } [data-theme-style~="headerNavMain__Elem"].is-active > a, [data-theme-style~="headerNavMain__Elem"] > a:hover{ color: #ffffff !important; } [data-theme-style~="headerNavMain__Elem"].is-selected{ } [data-theme-style~="headerNavMain__Elem"].is-selected > a{ color: #ffffff !important; } [data-theme-style~="headerNavSub"]{ color: #101010; background-color: #ffffff !important; } [data-theme-style~="headerNavSub"] a:hover{ color: #101010 !important; background-color: #ffffff !important; } [data-theme-style~="headerNavCatalog"] a{ border-color: #8a919a; } [data-theme-style~="headerNavCatalog_bottomBar"]{ background-color: #e7e7e7; } [data-theme-style~="headerNavCatalog_bottomBar"] a{ color: #101010; background-color: transparent !important; } [data-theme-style~="headerNavCatalog"]{ background-color: #ffffff; } [data-theme-style~="navCatalogTile"]{ border-color: #8a919a; } [data-theme-style~="headerNavCatalog_bottomBar"] a:hover{ color: #101010; background-color: transparent !important; } [data-theme-style~="navCatalogTiles__imageBgColor"]{ background-color: #ffffff; } /*************** HEADER - MOBILE - MAP CTA ****************/ [data-theme-style~="mobile__mapCta"]{ color: #7e7e7e; } /*************** HEADER - MOBILE - MENU BURGER ****************/ /* Hamburger Button Color - OLD */ [data-theme-style~="hamburger__bgColor"], [data-theme-style~="hamburger__bgColor"]:after, [data-theme-style~="hamburger__bgColor"]:before{ background-color: #999999; } /* Hamburger Button Color - OLD END */ [data-theme-style~="mobileHeader__menuBurger"]{ background-color: #999999; } [data-theme-style~="mobileHeader__menuBurger"] span, [data-theme-style~="mobileHeader__menuBurger"] span:before, [data-theme-style~="mobileHeader__menuBurger"] span:after{ background-color: #000000; } [data-theme-style~="mobileHeader__menuBurger__opened"]{ background-color: #101010; } [data-theme-style~="mobileHeader__menuBurger__opened"]>span{ color: #ffffff; } [data-theme-style~="mobileHeader__menuBurger__opened"] div span, [data-theme-style~="mobileHeader__menuBurger__opened"] div span:before, [data-theme-style~="mobileHeader__menuBurger__opened"] div span:after{ background-color: #ffffff; } /*************** HEADER - MOBILE - OFF CANVAS ****************/ [data-theme-style~="mobile__offCanvas"]{ background-color: #101010; } /*************** HEADER - MOBILE - MENU - MAIN NAV ****************/ /* Mobile Nav - OLD */ [data-theme-style~="headerMobileNavigation"]{ color: #ffffff; } [data-theme-style~="headerMobileNavigation"] li a:hover{ color: #ffffff; } [data-theme-style~="headerMobileNavigation"] .is-selected>a{ color: #ffffff; border-bottom: #910a2d 2px solid; } /* Mobile Nav - OLD END */ [data-theme-style~="mobileMenu__mainNav__firstLevel"]>a{ color: #1c1c1c; background-color: #ffffff; } [data-theme-style~="mobileMenu__mainNav__firstLevel"]:hover>a{ color: #898c8f !important; background-color: #ffffff; } [data-theme-style~="mobileMenu__mainNav__firstLevel"].is-selected>a{ color: #ffffff; background-color: #1c1c1c; } [data-theme-style~="mobileMenu__mainNav__secondLevel"]>a{ color: #4a4f54; background-color: #e4e8e8; } [data-theme-style~="mobileMenu__mainNav__secondLevel"]:hover>a{ color: #4a4f54 !important; background-color: #e4e8e8; } [data-theme-style~="mobileMenu__mainNav__secondLevel"].is-selected>a{ color: #ffffff; background-color: #1c1c1c; } /*************** HEADER - MOBILE - MENU - SECONDARY NAV ****************/ [data-theme-style~="mobileMenu__secondaryNav__anchor"]>a{ color: #4a4f54; background-color: #e4e8e8; } [data-theme-style~="mobileMenu__secondaryNav__anchor"].is-selected>a{ color: #ffffff; background-color: #1c1c1c; } /*************** HEADER - MOBILE - MENU - COMPARE ****************/ [data-theme-style~="mobileMenu__compare__count"]{ color: #ffffff; background-color: #1c1c1c; } /*************** HEADER - MOBILE - ADDRESS ****************/ [data-theme-style~="mobile__menuAddress"]{ color: #ffffff; } [data-theme-style~="mobile__menuAddress"]:hover{ color: #a1a1a1; } /*************** HEADER - MOBILE - PHONE ****************/ [data-theme-style~="mobile__menuPhone__label"]{ color: #ffffff; } [data-theme-style~="mobile__menuPhone__number"]{ color: #a1a1a1; } [data-theme-style~="mobile__menuPhone__number"]:hover{ color: #a1a1a1; } /***************************************************************** FOOTER *****************************************************************/ /*************** FOOTER - GENERAL ****************/ [data-theme-style~="footer"], [data-theme-style~="footerBlock"]{ background-color:#101010; color:#ffffff; } [data-theme-style~="footer_fontColor"]{ color: #ffffff; } /*************** FOOTER - MAIN NAV ****************/ [data-theme-style~="footerBlock_title"]{ color:#ffffff; } [data-theme-style~="footerBlock"] .footer__list{ color:#ffffff; } [data-theme-style~="footer_linkColor"], [data-theme-style~="footer_linkColor"]:hover, [data-theme-style~="footer_linkColor"].active, [data-theme-style~="footer_linkColor"]:focus { color:#ffffff; } [data-theme-style~="footer__mainNav__title"]{ color:#ffffff; } [data-theme-style~="footer__mainNav__anchor"]{ color:#b1b6b7; } [data-theme-style~="footer__mainNav__anchor"]:hover, [data-theme-style~="footer__mainNav__anchor"].active, [data-theme-style~="footer__mainNav__anchor"]:focus { color:#b1b6b7; } /*************** FOOTER - DEALER INFOS ****************/ [data-theme-style~="footer__dealerInfo__title"]{ color: #ffffff; } [data-theme-style~="footer__address"]{ color: #ffffff; } [data-theme-style~="footer__address"]:hover{ color: #ffffff; } [data-theme-style~="footer__phone__label"]{ color: #b1b6b7; } [data-theme-style~="footer__phone__number"]{ color: #ffffff; } [data-theme-style~="footer__phone__number"]:hover{ color: #ffffff; } /*************** FOOTER - PRIMARY CTA ****************/ [data-theme-style~="btnFooter"]{ color:#ffffff; background-color: #22992e; } [data-theme-style~="btnFooter"]:hover, [data-theme-style~="btnFooter"]:focus, [data-theme-style~="btnFooter"]:active{ color:#22992e; background-color: #ffffff; } /*************** FOOTER - TOP ****************/ [data-theme-style~="footerTop_fontColor"]{ color: #ffffff; } [data-theme-style~="footerTop_bgColor"]{ background-color: #3d3d3d; } /*************** FOOTER - BOTTOM ****************/ [data-theme-style~="footer__bottom"], [data-theme-style~="footerBottom"] { color:#999999; background-color: #101010; } [data-theme-style~="footerBottom_linkColor"], [data-theme-style~="footerBottom_linkColor"]:hover, [data-theme-style~="footerBottom_linkColor"]:active, [data-theme-style~="footerBottom_linkColor"]:focus { color:#999999; } [data-theme-style~="footer__bottomNav"]{ background-color: #ffffff; } [data-theme-style~="footer__bottomNav__anchor"], [data-theme-style~="footer__bottomNav__elem"]:before{ color: #1c1c1c; } [data-theme-style~="footer__bottomNav__anchor"]:hover{ color: #1c1c1c; } /*************** FOOTER - COPYRIGHT ****************/ [data-theme-style~="footer__copyright"]{ color: #b0b7bb; } /***************************************************************** BREADCRUMB *****************************************************************/ [data-theme-style~="breadcrumb_primaryFontColor"], [data-theme-style~="breadcrumb_primaryFontColor"]:hover { color: #101010; } [data-theme-style~="breadcrumb_active_primaryFontColor"] { color: #101010; } [data-theme-style~="breadcrumb_secondaryFontColor"], [data-theme-style~="breadcrumb_secondaryFontColor"]:hover { color: #ffffff; } [data-theme-style~="breadcrumb_active_secondaryFontColor"] { color: #ffffff; } /***************************************************************** TEXT TOOLS *****************************************************************/ [data-theme-style~="label__fontColor"]{ color: #999999; } [data-theme-style~="white-checkbox-label"]{ color: #ffffff; } [data-theme-style~="smallprint"]{ color: #999999; } [data-theme-style~="smallprint_darker"]{ color: #666666; } [data-theme-style~="darkBG-form-policy-fontColor"]{ color: #999999; } [data-theme-style~="catalogSlider__pagerColor"].active, [data-theme-style~="catalogSlider__pagerColor"]:after, [data-theme-style~="catalogSlider__pagerColor"]:hover{ color: #101010; border-color: #101010; } [data-theme-style~="catalogSlider__iconBgColor"]:before { background-color: #47c671; } [data-theme-style~="catalogSlider__iconColor"]:before, [data-theme-style~="catalogSlider__iconColor"]:hover:before, [data-theme-style~="catalogSlider__iconColor"]:focus:before, [data-theme-style~="catalogSlider__iconColor"]:active:before { color: #ffffff; } [data-theme-style~="homeCatalog_financing__rebate"] [data-theme-sprite]{ background: radial-gradient(farthest-side at 45% 60%, #ffcb2e, #ffcb2e); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } [data-theme-style~="homeCatalogRebate__bgColor"], [data-theme-style~="homeCatalogRebate__bgColor"]:before, [data-theme-style~="homeCatalogRebate__bgColor"]:after{ background-color: #ffcb2e; } [data-theme-style~="vehicleTagline"]{ color: #101010; } [data-theme-style~="vehicleRebate"]{ color: #303030; } [data-theme-style~="bodyTertiary_fontColor"]{ border-color: #d5d5d5; } /***************************************************************** Graphic filter *****************************************************************/ [data-theme-style~="graphic-filter"]{ background: #101010; } /***************************************************************** Util Color *****************************************************************/ [data-theme-style~="utilPrimary__color"]{ color: #101010; } [data-theme-style~="utilPrimary__color"][data-theme-sprite~="checklist"]:before{ color: #101010; } [data-theme-style~="utilPrimary__bgColor"]{ background-color: #101010 } [data-theme-style~="utilPrimary__borderColor"]{ border-color: #101010 !important; } [data-theme-style~="utilWhiteColor__borderColor"]{ border-color: #ffffff !important; } [data-theme-style~="smallprint__borderColor"]{ border-color: #999999 !important; } [data-theme-style~="utilPrimary__borderColorAfter"]:after{ border-color: #101010 } [data-theme-style~="utilPrimary__colorBefore"]:before{ color: #101010 } [data-theme-style~="utilPrimary__bgColorBefore"]:before{ background-color: #101010 } [data-theme-style~="utilPrimary__bgColorAfter"]:after{ background-color: #101010 } [data-theme-style~="utilPrimary__listColor"] li:before{ color: #101010 } [data-theme-style~="utilSecondary__color"]{ color: #ff5a00 } [data-theme-style~="utilSecondary__bgColor"]{ background-color: #ff5a00 } [data-theme-style~="utilSecondary_borderColor"]{ border-color: #ff5a00; } [data-theme-style~="utilTertiary__color"]{ color: #8994a0 } [data-theme-style~="utilTertiary__bgColor"]{ background-color: #8994a0 } [data-theme-style~="utilTertiary_borderColor"]{ border-color: #8994a0; } [data-theme-style~="utilWhiteColor__color"]{ color: #ffffff; } [data-theme-style~="utilWhiteColor__colorAfter"]:after{ background-color: rgba(255,255,255,0.2); } [data-theme-style~="utilGreyColor__color"]{ color: #999999; } [data-theme-style~="utilGreyColor__borderColor"]{ border-color: #999999; } [data-theme-style~="utilGreyColor__darkenColor"]{ color: #4d4d4d; } [data-theme-style~="utilGreyColor__lightenColor"]{ color: #e6e6e6; } [data-theme-style~="utilGreyColor__bgColor"]{ background-color: #4d4d4d; } [data-theme-style~="utilDarkGreyColor__color"]{ color: #666666; } [data-theme-style~="utilDarkGreyColor__bgColor"]{ background-color: #666666; } [data-theme-style~="utilWhiteColor__bgColor"]{ background-color: #ffffff; } [data-theme-style~="utilBlackColor__bgColor"]{ background-color: #101010; } [data-theme-style~="utilBlackColor__color"]{ color: #101010; } [data-theme-style~="utilBlackColor__transparentBgColor"]{ background-color: rgba(16,16,16,0.2); } [data-theme-style~="utilRedColor__color"]{ color: #910a2d; } [data-theme-style~="utilRedColor__bg"]{ background-color: #910a2d; } [data-theme-style~="utilRedColor__bgColor"]{ background-color: #910a2d; } [data-theme-style~="utilRedColor__borderColor"]{ border-color: #910a2d; } [data-theme-style~="utilYellowColor__color"]{ color: #ffcb2e; } [data-theme-style~="utilYellowColor__bgColor"]{ background-color: #ffcb2e; } [data-theme-style~="utilYellowColor__bgColorLight"]{ background-color: rgba(255,203,46,0.8); } [data-theme-style~="utilYellowColor__borderColor"]{ border-color: #ffcb2e; } [data-theme-style~="overlay"]{ color: #ffffff; background-color: #101010; } [data-theme-style~="stroke__borderColor"]{ stroke: #101010; } [data-theme-style~="gradientPrimary__bgColor"]{ background-color: #101010; background: -webkit-linear-gradient(left, #101010, #910a2d); /* For Safari 5.1 to 6.0 */ background: -o-linear-gradient(left, #101010, #910a2d); /* For Opera 11.1 to 12.0 */ background: -moz-linear-gradient(left, #101010, #910a2d); /* For Firefox 3.6 to 15 */ background: linear-gradient(left, #101010, #910a2d); /* Standard syntax (must be last) */ } [data-theme-style~="rapidSearchGradient__bgColor"]{ background: #101010; background: -moz-linear-gradient(45deg, #000000 0%, #000000 100%); background: -webkit-linear-gradient(45deg, #000000 0%, #000000 100%); background: linear-gradient(45deg, #000000 0%, #000000 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#000000',GradientType=1 ); } /************************* Slider - Pagers *************************/ [data-theme-style~="pagerSlider"] a, [data-theme-style~="pagerSlider"] li, [data-theme-style~="pagerSlider_bgColor"]{ background-color: #999999 !important; border-color: #999999 !important; } [data-theme-style~="pagerSlider"] a.active, [data-theme-style~="pagerSlider"] li.slick-active, [data-theme-style~="pagerSlider_bgColor"].active{ background-color: #ffffff !important; border-color: #101010 !important; } /***************************************************************** Pagination *****************************************************************/ .pagination .pagination__page-button-text--selected{ color: #101010; } [data-theme-style~="paginationButton"]{ color: #999999; } [data-theme-style~="paginationButton"]:hover{ color: #101010; } [data-theme-style~="paginationText"]{ color: #101010; } [data-theme-style~="paginationText"]:hover{ color: #101010; } .page-mazda-cx-50__gallery-wrapper .slick-arrow:before{ color: #101010; } [data-theme-style~="pageCx30_pagers_orderColor"].active{ color: #910a2d; } /********************************************** WIDGET TABS **********************************************/ [data-theme-style~="tabs_fontColor"]{ color: #999999; } [data-theme-style~="tabs_fontColor"].is-active a:after { border-color: #910a2d; } [data-theme-style~="tabs_fontColor"].is-active a, [data-theme-style~="tabs_fontColor"] a:hover{ color: #101010; } [data-theme-style~="footerTabs__fontColor"]{ color: #ffffff; } [data-theme-style~="footerTabs__fontColor"].is-active a:after { border-color: #910a2d; } [data-theme-style~="footerTabs__fontColor"].is-active a, [data-theme-style~="footerTabs__fontColor"] a:hover{ color: #999999; } [data-theme-style~="homeInventoryTabs"] [data-theme-style~="tabs_fontColor"].is-active a, [data-theme-style~="homeInventoryTabs"] [data-theme-style~="tabs_fontColor"] a:hover{ color: #ffffff; border-color: #ff5a00; background-color: #ff5a00; } [data-theme-style~="homeInventoryTabs"] [data-theme-style~="tabs_fontColor"].is-active a:after{ border-color: #ff5a00; } [data-theme-style~="tabsPagerMx30_borderColor"].active { color: #910a2d; } /***************************************************************** FORM *****************************************************************/ /*********************** FORM BLOCK ***************************/ [data-theme-style~="formBlockContent"], [data-theme-style~="formBlockContent"] label{ background-color: #101010; color: #ffffff; } [data-theme-style~="formBlockTitle"]{ background-color: #cccccc; color: #303030; text-transform: uppercase; } [data-theme-style~="sidebarFormContent_bgColor"]{ background-color: #ffffff; } [data-theme-style~="formBlockTitle"]:before{ border-color: #cccccc transparent transparent transparent; } [type=checkbox]:not(:checked)+label{ color: #999999; } [data-theme-style~="formNinjaboxContent"]{ background-color: #ffffff; } /***************************************************************** Page Contact Bottom Section *****************************************************************/ [data-theme-style~="pageContactBottom"], [data-theme-style~="pageContactBottom"] label{ background-color: #e7e7e7; color: #101010; } /*********************** FORM BOTTOM SERVICE ***************************/ [data-theme-style~="formBottomServiceContent"], [data-theme-style~="formBottomServiceContent"] label{ background-color: #101010; color: #ffffff; } [data-theme-style~="formBottomServiceTitle"]{ color: #303030; } [data-theme-style~="formBottomServiceTitle"]:before{ border-color: #cccccc transparent transparent transparent; } [data-theme-style~="form-policy-fontColor"]{ color: #ffffff; } /*********************** Placeholder ****************************/ ::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: #999999; } ::-moz-placeholder { /* Firefox 19+ */ color: #999999; } :-ms-input-placeholder { /* IE 10+ */ color: #999999; } :-moz-placeholder { /* Firefox 18- */ color: #999999; } /************************* Radio Button **************************/ input[type=radio] + label .radio-button__label-radio{ border-color: #ffffff; } input[type="radio"]:checked + label .radio-button__label-radio{ border-color: #ffffff; background-color: #ffffff; } input[type="radio"]:checked + label .radio-button__label-radio:before{ background-color: #101010; } /************************* Nav Block **************************/ [data-theme-style~="navBlock_title"]{ background-color: #1a4729; color: #ffffff; } [data-theme-style~="navBlockElement_bgColor"]{ background-color: #5afa8f; } [data-theme-style~="navBlock_element"]{ background-color: #5afa8f; color: #ffffff; } [data-theme-style~="navBlock_element"]:hover{ background-color: #5cff92; } [data-theme-style~="navBlock_searchIcon__Color"], [data-theme-style~="navBlock_searchIcon__Color"].cta-disabled{ color: #8994a0; } [data-theme-style~="navBlock_searchIcon__Color"]:not(.cta-disabled) span, [data-theme-style~="navBlock_searchIcon__Color"]:not(.cta-disabled):hover span{ color: #ffffff; border-color: #101010; background-color: #101010; } [data-theme-style~="navBlock_anchor__Color"]{ color: #8994a0; } [data-theme-style~="navBlock_anchor__Color"]:hover, [data-theme-style~="navBlock_anchor__Color"].active{ color: #101010; } [data-theme-style~="navBlock_title__Color"]{ color: #1a4729; } [data-theme-style~="navBlock_title__bgColor"]{ background-color: #1a4729; } /***************************************************************** HOME SOCIAL BLOCK *****************************************************************/ [data-theme-style~="homeSocial__bgColor"]{ background-color: #f5f5f5; } [data-theme-style~="homeSocial__titleColor"]{ color: #ffffff; } [data-theme-style~="homeSocialInstance__titleColor"]{ color: #236138; } [data-theme-style~="homeSocialInstance__textColor"]{ color: #000000; } /***************************************************************** HOME SLIDER CATALOG *****************************************************************/ [data-theme-style~="homeCatalogSlider_primaryBgColor"]{ background-color: #ffffff; } [data-theme-style~="homeCatalogSlider_label_color"]{ color: #999999; } [data-theme-style~="specialOfferTag"]{ color: #101010; background-color:#e7e7e7; } /***************************************************************** HOME SLIDER INVENTORY *****************************************************************/ [data-theme-style~="homeInventorySlider_label_color"]{ color: #999999; } [data-theme-style~="homeInventorySlider_BgColor"]{ background-color: #ffffff; } /***************************************************************** HOME REVIEWS *****************************************************************/ .section-reviews--echo .home-reviews .title__home{ color: #303030; } [data-theme-style~="homeReviews_scoreColor"]{ color: #101010; } [data-theme-style~="homeReviews_bgColor"]{ background-color: #236138; } [data-theme-style~="homeReviews_bgColor"]:before{ background-color: #236138; } [data-theme-style~="homeReviews_bgColor"]:after{ background-color: #236138; border-top-color: #236138; color: #236138; } [data-theme-style~="homeReviews_fontColor"]{ color: #101010; } [data-theme-style~="homeReviews_fontColor"]:before{ color: #eaeeed; } [data-theme-style~="homeReviews_starsColor"]{ color: #999999; } [data-theme-style~="homeReviews_emptyStarsColor"]{ color: #eaeeed; } [data-theme-style~="homeReviews_sliderColors"] .slick-dots li button:before, [data-theme-style~="homeReviews_sliderColors"] .slick-dots li button:hover:before, [data-theme-style~="homeReviews_sliderColors"] .slick-dots li button:focus:before{ color: #f2f2f2 !important; background: #f2f2f2 !important; border-color: #999999; } [data-theme-style~="homeReviews_sliderColors"] .slick-dots li.slick-active button:before{ color: #999999 !important; background: #999999 !important; border-color: #999999; } [data-theme-style~="homeReviews__sectionTitle"]{ color: #101010; } [data-theme-style~="homeReviews__sectionSubtitle"]{ color: #000000; } [data-theme-style~="homeReviews__allReviewsLink"]{ color: #000000; } [data-theme-style~="homeReviews__allReviewsLink"]:hover{ color: #242424; } [data-theme-style~="homeReviews__contentAuthor"]{ color: #000000; } /***************************************************************** HOME INVENTORY SMALL *****************************************************************/ [data-theme-style~="blockCtasInventory__color"]{ color: #ffffff; } /***************************************************************** HOME CTAS SMALL *****************************************************************/ [data-theme-style~="blockCtasSmall__textColor"]{ color: #ffffff; } [data-theme-style~="blockCtasSmall__textColor"]:after{ background-color: rgba(255,255,255,0.2); } [data-theme-style~="blockCtasSmall__linkColor"]{ color: #47c671; } [data-theme-style~="blockCtas__afterArrow"]:hover:after{ color: #8994a0; } [data-theme-style~="homeCtaPanel_bgColor"].block-ctas-charlie__item:nth-child(even)::before, [data-theme-style~="homeCtaPanel_bgColor"].block-ctas-charlie__item:nth-child(odd)::before{ border-color: #22992e; } /***************************************************************** HIGHLIGHTS MODULES *****************************************************************/ [data-theme-style~="blockCtasBig"]{ color: #ffffff; } [data-theme-style~="blockCtasBig__BgColor"]{ background-color: #ffffff; } [data-theme-style~="blockCtasBig__BorderColor"]{ color: #ffffff; } [data-theme-style~="blockCtasBigFirst__BgColor"]{ background-color: #1a4729; } [data-theme-style~="blockCtasBigFirst__BorderColor"]{ color: #1a4729; } [data-theme-style~="blockCtasBig__TitleColor"]{ color: #ffffff; } [data-theme-style~="blockCtasBigFirst__TitleColor"]{ color: #236138; } [data-theme-style~="blockCtasBig__TitleColor"]:after{ background-color: #ffffff; } [data-theme-style~="blockCtasBigFirst__TitleColor"]:after{ background-color: #236138; } [data-theme-style~="blockCtasBigFirst__TextColor"]{ color: #47c671; } [data-theme-style~="blockCtasBigFirst__TextColor"] h3, [data-theme-style~="blockCtasBigFirst__TextColor"] .subtitle{ color: #47c671; } [data-theme-style~="blockCtasBigFirst__TextColor"] h3:after, [data-theme-style~="blockCtasBigFirst__TextColor"] .subtitle:after{ background-color: #1a4729; } [data-theme-style~="blockCtasBig__footerBg"]{ background-color: #ffffff; } [data-theme-style~="highlightsBlocks__item"]{ background-color: #ffffff; } [data-theme-style~="highlightsBlocks__titleColor"]{ color: #ffffff; } [data-theme-style~="highlightsBlocks__titleColor"]:before, [data-theme-style~="highlightsBlocks__titleColor"]:after{ background-color: #ffffff; } [data-theme-style~="highlightsBlocks__contentColor"]{ color: #ffffff; } [data-theme-style~="highlightsBlocks__contentColor"] h3, [data-theme-style~="highlightsBlocks__contentColor"] h4, [data-theme-style~="highlightsBlocks__contentColor"] h5{ color: #ffffff; } [data-theme-style~="highlightsBlocks__cta"]{ color: #ffffff; border-color: #000000; background: #000000; } [data-theme-style~="highlightsBlocks__cta"]:hover, [data-theme-style~="highlightsBlocks__cta"]:focus, [data-theme-style~="highlightsBlocks__cta"]:active{ color: #000000; border-color: #000000; background: #ffffff; } /***************************************************************** HIGHLIGHTS MODULES SECONDARY *****************************************************************/ [data-theme-style~="highlightsBlocks__secondary__item"]{ background-color: #ffffff; } [data-theme-style~="highlightsBlocks__secondary__sectionTitle"]{ color: #000000; } [data-theme-style~="highlightsBlocks__secondary__sectionTitle"]:before, [data-theme-style~="highlightsBlocks__secondary__sectionTitle"]:after{ background-color: #000000; } [data-theme-style~="highlightsBlocks__secondary__titleColor"]{ color: #000000; } [data-theme-style~="highlightsBlocks__secondary__contentColor"]{ color: #000000; } [data-theme-style~="highlightsBlocks__secondary__cta"]{ color: #000000; border-color: #ffffff; background: #ffffff; } [data-theme-style~="highlightsBlocks__secondary__cta"]:hover, [data-theme-style~="highlightsBlocks__secondary__cta"]:focus, [data-theme-style~="highlightsBlocks__secondary__cta"]:active{ color: #000000; border-color: #ffffff; background: #ffffff; } [data-theme-style~="highlightsBlocks__secondary__cta"] [data-theme-sprite]{ color: #ffffff; background: #ffffff; } [data-theme-style~="highlightsBlocks__secondary__cta"]:hover [data-theme-sprite], [data-theme-style~="highlightsBlocks__secondary__cta"]:focus [data-theme-sprite], [data-theme-style~="highlightsBlocks__secondary__cta"]:active [data-theme-sprite]{ color: #ffffff; background: #ffffff; } /***************************************************************** HIGHLIGHTS MODULES TERTIARY *****************************************************************/ [data-theme-style~="highlightsBlocks__tertiary__item"]{ background-color: #ffffff; } [data-theme-style~="highlightsBlocks__tertiary__bgColor"]{ background-color: #ffffff; } [data-theme-style~="highlightsBlocks__tertiary__titleColor"]{ color: #1c1c1c; } [data-theme-style~="highlightsBlocks__tertiary__contentColor"]{ color: #4a4f54; } [data-theme-style~="highlightsBlocks__tertiary__cta"]{ color: #ffffff; border-color: #1c1c1c; background: #1c1c1c; } [data-theme-style~="highlightsBlocks__tertiary__cta"]:hover, [data-theme-style~="highlightsBlocks__tertiary__cta"]:focus, [data-theme-style~="highlightsBlocks__tertiary__cta"]:active{ color: #1c1c1c; border-color: #ffffff; background: #ffffff; } /***************************************************************** HIGHLIGHTS MODULES ALPHA *****************************************************************/ [data-theme-style~="highlightsAlpha__block1__bgColor"]{ background-color: #111111; } [data-theme-style~="highlightsAlpha__block1__titleColor"]{ color: #ffffff; } [data-theme-style~="highlightsAlpha__block1__contentColor"]{ color: #ffffff; } [data-theme-style~="highlightsAlpha__block2__bgColor"]{ background-color: #333333; } [data-theme-style~="highlightsAlpha__block2__titleColor"]{ color: #ffffff; } [data-theme-style~="highlightsAlpha__block2__contentColor"]{ color: #ffffff; } [data-theme-style~="highlightsAlpha__block3__bgColor"]{ background-color: #999999; } [data-theme-style~="highlightsAlpha__block3__titleColor"]{ color: #ffffff; } [data-theme-style~="highlightsAlpha__block3__contentColor"]{ color: #ffffff; } /***************************************************************** HIGHLIGHTS MODULES DELTA *****************************************************************/ [data-theme-style~="highlightsDelta__gradient"]{ background: linear-gradient(to right, #101010 0%, #292929 100%); } /***************************************************************** HIGHLIGHTS MODULES ECHO *****************************************************************/ [data-theme-style~="highlightsEcho__bgColor"]{ background-color: #ffffff; } [data-theme-style~="highlightsEcho__titleColor"]{ color: #101010; } [data-theme-style~="highlightsEcho__contentColor"]{ color: #101010; } /***************************************************************** INSTAGRAM FEED *****************************************************************/ [data-theme-style~="instagramFeed__textColor"]{ color: #47c671; } [data-theme-style~="instagramFeed__bgColor"]{ background-color: #8994a0; } /***************************************************************** WHY BUY PAGE *****************************************************************/ [data-theme-style~="whyBuy__listColor"] li:before{ color: #47c671; } [data-theme-style~="whyBuyBanner"]{ color: #ffffff; background-color: #47c671; } /***************************************************************** Scrollbar *****************************************************************/ [data-theme-style~="scrollbarHandle_color"], [data-theme-style~="scrollbarHandle_color"]:hover{ background-color: #101010; } [data-theme-style~="scrollbarFill_color"]{ background-color: #101010; } [data-theme-style~="scrollbar_color"]{ background-color: #cccccc; } /***************************************************************** CUSTOM *****************************************************************/ /* The strike price is the same color that font color box preview */ [data-theme-style~="showroom_primaryColor"]{ color: #101010; } [data-theme-style~="showroom_secondaryColor"], [data-theme-style~="showroom_secondaryColor"]:after{ color: #101010; } [data-theme-style~="accordionIcon_color"]:before { color: #101010; } [data-theme-style~="inventoryHeader"]{ background-color:#ffffff; } [data-theme-style~="vdpForm_primaryColor"], [data-theme-style~="vdpForm_primaryColor"] [type=checkbox]:checked+label, [data-theme-style~="vdpForm_primaryColor"] [type=checkbox]:not(:checked)+label{ color: #ffffff; } [data-theme-style~="vehicleTrims_selectedColor"].selected{ color: #999999; } [data-theme-style~="inventoryAvailability_bgColor"]{ background-color: #ffcb2e; } [data-theme-style~="inventoryAvailability_bgColor"]:before{ border-bottom-color: #ffcb2e; } [data-theme-style~="inventoryAvailability_fontColor"]{ color: #ffffff; } [data-theme-style~="inventoryAvailability_fontColor"]:hover{ color: #ffffff; } [data-theme-style~="countdownDisabled_fontColor"].disabled{ color:#999999; } [data-theme-style~="vehiclePreviewName_color"]{ color: #101010; } [data-theme-style~="vehiclePreview_primaryColor"]{ color: #101010; } [data-theme-style~="vehiclePreview_secondaryColor"]{ color: #999999; } [data-theme-style~="vehiclePreview_priceBgColor"]::after{ background-color: #101010; } .catalog-color-picker__item.selected .catalog-color-picker__item-image{ border-color: #101010; } [data-theme-style~="vdpSidebar_bgColor"]{ background-color: #101010; } [data-theme-style~="vdpComparable_bgColor"]{ background-color: #101010; } [data-theme-style~="vdpComparable_fontColor"]{ color: #ffffff; } .widget-filter__check-element:hover, .widget-filter__check-element--selected{ border-color: #101010; } .widget-filter__check-element:hover .widget-filter__bodystyle-name, .widget-filter__check-element--selected .widget-filter__bodystyle-name{ color: #101010; } [data-theme-style~="accordion"]{ color: #101010 } [data-theme-style~="accordion"]:nth-child(odd){ background-color: #f2f2f2 } [data-theme-style~="morePhoto__bgColor"], [data-theme-style~="morePhoto__bgColor"]:hover{ background-color: #101010; color:#ffffff; } [data-theme-style~="calculator__color"]{ color: #101010; } [data-theme-style~="form_icons"]:before{ color:#ffffff; } [data-theme-style~="ratesTable_bgColor"] tr:nth-child(even){ background-color: #ffffff ; } [data-theme-style~="availabilityCount_color"]{ background-color: #101010 ; color:#ffffff } /***************************************************************** WIDGETS *****************************************************************/ [data-theme-style~="widgetSticky_fontColor"]{ color: #111111 ; } [data-theme-style~="widgetSticky_bgColor"]{ background-color: #f2f2f2 ; } /***************************************************************** INVENTORY LISTING *****************************************************************/ [data-theme-style~="inventory__rebateBanner"]{ background-color: #359437; color: #ffffff; } [data-theme-style~="inventory__priceColor"]{ color: #359437; } [data-theme-style~="inventory__compareBtn"]{ background-color: #868686; } [data-theme-style~="inventory__compareBtn"]:hover{ background-color: #a0a0a0; } [data-theme-style~="inventory__compareBtn"].active{ background-color: #101010; } [data-theme-style~="inventory__compareBtn"].active:hover{ background-color: #2a2a2a; } [data-theme-style~="inventory_clearance_colors"]{ background-color: #910a2d; color: #ffffff; } [data-theme-style~="inventory_picto_color"]{ background-color: #101010; color: #ffffff; } /***************************************************************** Generic Inventory Preview (Block) *****************************************************************/ [data-theme-style~="inventoryPreview_bgColor"]{ background-color: #ededed; } [data-theme-style~="inventoryPreview_fontColor"]{ color: #111111; } [data-theme-style~="inventoryPreview_shadowColor"], [data-theme-style~="inventoryPreview_shadowColor"]:hover{ box-shadow: 0 3px 9px rgba(0,0,0,0.2); } [data-theme-style~="inventoryPreviewPrice_fontColor"]{ color: #111111; } [data-theme-style~="inventoryPreviewFinancing_fontColor"]{ color: #47c671; } /***************************************************************** Generic Inventory Preview (Button) *****************************************************************/ [data-theme-style~="btnInventoryPreview"]{ background-color: #ffffff; color:#47c671; border-color: #47c671; } [data-theme-style~="btnInventoryPreview"]:hover{ background-color: #47c671!important; color:#ffffff; border-color: #47c671; } /***************************************************************** Generic Catalog Preview - Block *****************************************************************/ [data-theme-style~="catalogPreview_bgColor"]{ background-color: #ededed; } [data-theme-style~="catalogPreview_fontColor"]{ color: #111111; } [data-theme-style~="catalogPreviewFinancing_fontColor"]{ color: #47c671; } [data-theme-style~="catalogPreviewPrice_fontColor"]{ color: #000000; } /***************************************************************** Generic Catalog Preview - Button *****************************************************************/ [data-theme-style~="btnCatalogPreview"]{ background-color: #ffffff; color:#47c671; border-color: #47c671; } [data-theme-style~="btnCatalogPreview"]:hover{ background-color: #47c671!important; color:#ffffff; border-color: #47c671; } /***************************************************************** SOCIAL BLOCK CTAs *****************************************************************/ [data-theme-style~="socialBlock__title"]{ color: #ffffff; } [data-theme-style~="socialBlock__cta"]{ background-color: #000000; color: #ffffff; } [data-theme-style~="socialBlock__cta"]:hover{ color: #ffffff; } [data-theme-style~="socialBlock__cta__label"]{ color: #ffffff; } a:hover [data-theme-style~="socialBlock__cta__label"]{ color: #ffffff; } /***************************************************************** PROMO HEADER SLIDER *****************************************************************/ [data-theme-style~="promoHeaderSlider__dots"] li button{ color: #cccccc; background-color: #ffffff; border-color: #ffffff; } [data-theme-style~="promoHeaderSlider__dots"] li button:hover, [data-theme-style~="promoHeaderSlider__dots"] li.slick-active button{ color: #ffffff; background-color: #ffffff; border-color: #ffffff; } [data-theme-style~="promoHeaderSlider__dots__text"] li button{ color: #cccccc; } [data-theme-style~="promoHeaderSlider__dots__text"] li button:hover, [data-theme-style~="promoHeaderSlider__dots__text"] li.slick-active button{ color: #ffffff; } [data-theme-style~="promoHeaderSlider__controls"]{ color: #ffffff; } [data-theme-style~="promoHeaderSlider__controls"]:hover{ color: #cccccc; } /***************************************************************** VIDEOS CHARLIE *****************************************************************/ [data-theme-style~="videosHome__titleTextColor"]{ color: #000000; } [data-theme-style~="videosHome__titleTextColor"]:before, [data-theme-style~="videosHome__titleTextColor"]:after{ background: #000000; } [data-theme-style~="videosHome__previewTextColor"]{ color: #000000; } [data-theme-style~="videosHome__cta"]{ color: #000000; border-color: #000000; background: #ffffff; } [data-theme-style~="videosHome__cta"]:hover, [data-theme-style~="videosHome__cta"]:focus, [data-theme-style~="videosHome__cta"]:active{ color: #ffffff; border-color: #910a2d; background: #ffffff; } /***************************************************************** OTHER THEME *****************************************************************/ [data-theme-style~="aboutInstance__bgColor"]{ background-color: #ffffff; } /***************************************************************** PAGE TEAM - BLOCS *****************************************************************/ [data-theme-style~="blocTeam__bgColor"]{ background-color: #f5f5f5; } /***************************************************************** INVENTORY FILTERS *****************************************************************/ [data-theme-style~="inventoryFiltersHeader_bgColor"]{ background-color: #333333; } [data-theme-style~="inventoryFiltersHeader_fontColor"]{ color: #ffffff; } [data-theme-style~="inventoryFiltersMain_bgColor"]{ background-color: #111111; } [data-theme-style~="inventoryFiltersMain_fontColor"]{ color: #ffffff; } [data-theme-style~="inventoryFiltersSeparator_bgColor"]{ border-color: #cccccc; } [data-theme-style~="inventoryFiltersPrimary_bgColor"]{ background-color: #47c671!important; } [data-theme-style~="inventoryFiltersPrimary_after_fontColor"]::after, [data-theme-style~="inventoryFiltersPrimary_before_fontColor"]::before{ color: #47c671; } [data-theme-style~="inventoryFiltersPrimary_after_bgColor"]::after, [data-theme-style~="inventoryFiltersPrimary_before_bgColor"]::before{ background-color: #47c671; } [data-theme-style~="inventoryFiltersPrimary_fontColor"]{ color: #ffffff; } [data-theme-style~="inventoryFiltersSecondary_bgColor"]{ background-color: #333333!important; } [data-theme-style~="inventoryFiltersSecondary_fontColor"]{ color: #999999; } .inventory-filter-beta__filters-radio-button:checked+label::after{ background-color: #47c671; } [type=checkbox]:checked + label.filters-dropdown__checkbox-label{ color: #ffffff; } /***************************************************************** PAGE TECHNOLOGY *****************************************************************/ [data-theme-style~="technology__bgImage"] { background-image: url('https://img.sm360.ca/images/web/default/archetype premium/style/bg_technologies1543871482381.png'); background-position: bottom center; background-repeat: no-repeat; } [data-theme-style~="technologyCategoryButton"] .technology-categories__item-picto-wrapper { border-color: #d5d5d5; color: #444444; } [data-theme-style~="technologyCategoryButton"].active .technology-categories__item-picto-wrapper { border-color: ; background-color: #101010; color: #ffffff; } [data-theme-style~="technologyCategoryButton__fontColor"] { color: #101010; } [data-theme-style~="technologyProgressBar"]:after { background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, #000000 20%, #000000 50%, #000000 80%, rgba(0,0,0,0) 100%); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,#000000 20%,#000000 50%,#000000 80%, rgba(0,0,0,0) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,#000000 20%,#000000 50%,#000000 80%, rgba(0,0,0,0) 100%); } [data-theme-style~="technologyProgressBarBullet"]:before { background-color: #000000; } [data-theme-style~="technologyProgressBarBullet"].active { background-color: #ffffff; box-shadow: 0 2px 14px 0 rgba(0,0,0,.1); -moz-box-shadow: 0 2px 14px 0 rgba(0,0,0,.1); -webkit-box-shadow: 0 2px 14px 0 rgba(0,0,0,.1); } [data-theme-style~="technologyProgressBarBullet"].active:before { background-color: #910a2d; } [data-theme-style~="readMoreColor__color"]{ color: #ffffff !important; } [data-theme-style~="rubanSold__bgColor"]{ background-color: #910a2d; } [data-theme-style~="footerTabs_fontColor"]{ color: #999999; border-color: rgba(153,153,153,0.5); } [data-theme-style~="footerTabs_fontColor"].is-active a:after, [data-theme-style~="footerTabs_fontColor"].is-active a, [data-theme-style~="footerTabs_fontColor"] a:hover{ color: #ffffff; border-color: #910a2d; } .page-bodyshop .collision-extra__days-opening, .page-bodyshop .collision-extra, .page-bodyshop .collision-extra__collisions-center{ border-color: #cccccc; } [data-theme-style~="mobile_menu_social"]{ color:#ffffff; } [data-theme-style~="timelineCta__bgColor"]{ background-color:#101010; } .page-service-warranty__accordion, .page-service-warranty__accordion-content{ border-color:#d5d5d5; } .page-connected-vehicle__title-with-border:after{ background:#910a2d; } [data-theme-style~="pageCx50ChallengeHeader__fontColor"]{ color:#ffffff; } [data-theme-style~="homepageCatalog__bgColor"]{ background-color: #000000; } [data-theme-style~="homepageCatalog__FontColor"]{ color: #ffffff; } [data-theme-style~="homepageCatalog__FontColor"] a:hover{ color: #ffffff; } .page-mazda-cx-50-challenge__countdown-element:after{ background:#707070; } .page-mazda-cx-50-challenge__accordion-title:before{ color:#910a2d; } .page-mazda-cx-50-challenge__accordion-item:first-of-type{ border-color:#cacaca; } /***************************************************************** WHY BUY PAGE *****************************************************************/ [data-theme-style~="whyBuyBanner__bgColor"]{ background-color: #47c671; } [data-theme-style~="whyBuyBanner__fontColor"]{ color: #ffffff; } [data-theme-style~="whyBuySteps_title_fontColor"] { color: #101010; } [data-theme-style~="whyBuySteps_instancesTitle_fontColor"]{ color: #ffffff; } [data-theme-style~="whyBuyActions_title_fontColor"]{ color: #101010; } [data-theme-style~="whyBuyCarousel_bgColor"]{ background-color: #f2f2f2; } [data-theme-style~="whyBuyFunctionalities_borderColor"]{ border-color: #c2c2c2; } [data-theme-style~="whyBuyDetails_bgColor"]{ background-color: #f2f2f2; } [data-theme-style~="WhyBuyCarouselSlider__controls"]{ color: #999999; } [data-theme-style~="WhyBuyCarouselSlider__controls"]:hover{ color: #cccccc; }