@import url(../css/flaticon.css); @import url(../css/googlemap.css); @import url(https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap); /* Table of contents */ /*== Typography ==*/ html { font-size: 100%; scroll-behavior: auto !important; } .thumb{ display: flex; align-items: center; justify-content: center; } a{ text-decoration: none !important; } body { background-attachment: fixed; background-color: #ffffff; color: #5F6973; font-family: 'Inter', sans-serif; font-size: 14px; line-height: 1.5; overflow-x: hidden; transition: inherit; -webkit-font-smoothing: antialiased; -webkit-transition: all .4s ease; -moz-transition: all .4s ease; -ms-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } body.body_overlay{ position: fixed; transform: translate(0, 0); width: 100%; } body.body_overlay:before{ background-color: rgba(10,35,87, .3); bottom: 0; content:""; left: 0; position: absolute; right: 0; top: 0; z-index: 2; -webkit-transition: all .8s ease; -moz-transition: all .8s ease; -ms-transition: all .8s ease; -o-transition: all .8s ease; transition: all .8s ease; transform: translate(330px, 0); } .body_home2_style{ padding: 0 60px 60px 60px; } .body_home2_style section{ border-radius: 16px; } .bodyoverlay2{ position: relative; } .bodyoverlay2:before{ background-color: rgba(10,35,87, .03); bottom: 0; content: ""; height: 100%; left: 0; position: absolute; right: 0; top: 0; width: 100%; z-index: 99; } img { max-width: 100%;} p { color: #5F6973; font-weight: 400;} b{ font-weight: 600; } ul, ol { list-style: none; margin: 0; padding: 0; } iframe { border: none; width: 100%; } a { color: #1A3760; text-decoration: none; -webkit-font-smoothing: antialiased;} a:hover, a:focus { color: #1A3760; text-decoration: none; outline: none;} a img { border: none;} .form-control{ height: 50px; } .form-control:active, .form-control:focus{ box-shadow: none; outline: none; } iframe { border: none; } ::selection { background: #1A3760; color: #ffffff; text-shadow: none; } ::-moz-selection { /* Firefox */ background: #1A3760; color: #ffffff; text-shadow: none; } ::-webkit-selection { /* Safari */ background: #1A3760; color: #ffffff; text-shadow: none; } h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-family: 'Inter', sans-serif; line-height: 1.2; color: #1A3760; } h1 small, h1 .small, h2 small, h2 .small, h3 small, h3 .small, h4 small, h4 .small, h5 small, h5 .small, h6 small, h6 .small, .h1 small, .h1 .small, .h2 small, .h2 .small, .h3 small, .h3 .small, .h4 small, .h4 .small, .h5 small, .h5 .small, .h6 small, .h6 .small { font-weight: normal; line-height: 1; color: #1A3760; font-weight: 400; } h1 a, h2 a, h3 a, h4 a, h5 a, h6 a, .h1 a, .h2 a, .h3 a, .h4 a, .h5 a, .h6 a { color: #1A3760; font-weight: 400; } h1, h2, h3, h4, .h1, .h2, .h3, .h4 { font-weight: 600; } h5, h6, .h5, .h6 { font-weight: 500;} h1, .h1 { font-size: 36px; } h2, .h2 { font-size: 30px; } h3, .h3 { font-size: 24px; } h4, .h4 { font-size: 18px; } h5, .h5 { font-size: 15px; } h6, .h6 { font-size: 12px; } p, ul, ol, dl, dt, dd, blockquote, address { margin: 0 0 10px; } .body-color{ color: #5F6973; } .bgc-heading-color{ background-color: #0A2357; } .heading-color{ color: #1A3760; } .border-left{ border-left: 1px solid #E6E9EC; } .border-right{ border-right: 1px solid #E6E9EC; } .bdr_none{ border: none !important; } .bb_none{ border-bottom: none !important; } .vat{ vertical-align: top; } .vab{ vertical-align: bottom; } .vam{ vertical-align: middle; } .vatt{ vertical-align: text-top; } .z0{ z-index: 0 !important; } .z-1{ z-index: -1; } .z-2{ z-index: -2; } .z-3{ z-index: -3; } .z-4{ z-index: -4; } .z-5{ z-index: -5; } .z1{ z-index: 1; } .z9{ z-index: 9; } .z99{ z-index: 99; } .social_icons li{ background-color: transparent; border-radius: 3px; height: 30px; line-height: 30px; margin-right: 0 !important; width: 30px; text-align: center; } .social_icons li:hover{ background-color: rgba(105, 105, 105, .1); } .social_icons li a{ color: #5F6973; font-size: 13px; } .ff-fontawesome { font-family: FontAwesome !important; } /*== Home Css ==*/ .home_content{ padding: 200px 0; } .home_content.home4_style, .home_content_home5_style, .home_content.home1_style .home-text{ position: relative; } .home_content.home1_style .home-text .title{ color: #FFFFFF; font-size: 60px; font-style: normal; font-weight: 600; line-height: 73px; letter-spacing: 0em; position: relative; } span.aminated-object1 .objects { bottom: 0; position: absolute; width: 110px; z-index: -1; animation: jumpTwo 5s infinite linear; } .jumpTwo { -webkit-animation-name: jumpTwo; -webkit-animation-duration: 3s; -webkit-animation-iteration-count: infinite; -webkit-animation-timing-function: ease-in-out; -moz-animation-name: Floating; -moz-animation-duration: 3s; -moz-animation-iteration-count: infinite; -moz-animation-timing-function: ease-in-out; } @-webkit-keyframes jumpTwo { from {-webkit-transform:translate(0, 0px);} 65% {-webkit-transform:translate(0, 10px);} to {-webkit-transform: translate(0, -0px);} } @-moz-keyframes jumpTwo { from {-moz-transform:translate(0, 0px);} 65% {-moz-transform:translate(0, 10px);} to {-moz-transform: translate(0, -0px);} } .nav-tabs > li.active > a{ background-color: #0A2357 !important; border: none; border-radius: 10px !important; margin-bottom: 24px !important; color: #fff; border-bottom: 2px solid #1C0113; } .nav-tabs > li.active > a:hover{ background: #000 !important; } .custom-tabs li.active a, .custom-tabs li a{ background: #0A2357 !important; } /* SECTION */ .home-sec { padding: 70px 0; } .sec-title { text-align: center; font-size: 4.33vw !important; font-weight: 700; margin-bottom: 50px; color: #FFF; text-shadow: 0px 0px 5px #1C0113; margin: 0px; padding: 0px; font-family: 'Oswald', sans-serif; text-transform: uppercase; font-weight: 500; } @media (min-width: 768px) { #search { background-color: #fff !important; background: none !important; } } .sec-title::after { content: ""; width: 60px; height: 4px; background: #ff3c00; display: block; margin: 10px auto; border-radius: 5px; } /* CARD */ .ui-card { background: #fff; border-radius: 16px; padding: 20px; transition: 0.4s; box-shadow: 0 8px 25px rgba(0,0,0,0.06); margin-bottom: 30px; } .ui-card:hover { transform: translateY(-10px); box-shadow: 0 20px 40px rgba(0,0,0,0.12); } .ui-card img { width: 100%; border-radius: 12px; /* Added display to prevent layout shift without changing design */ display: block; height: auto; } .ui-title { font-size: 18px; font-weight: 600; margin-top: 15px; text-align: center; } /* SEARCH */ .search-wrap { background: #fff; padding: 30px; border-radius: 20px; box-shadow: 0 10px 40px rgba(0,0,0,0.08); } /* HOT */ #hot-list li { background: #fff; border-radius: 12px; padding: 10px; margin: 10px; transition: 0.3s; } #hot-list li:hover { transform: scale(1.05); } /* LOGOS */ .logo-box img { transition: 0.3s; } .logo-box:hover img { transform: scale(1.1); } .home-sec { position: relative; padding: 90px 0; z-index: 1; } .home-sec::before { content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, 0.04); /* light black overlay */ z-index: -1; border-radius: 0; } /* FLEX LAYOUT */ .search-flex { display: flex; align-items: center; gap: 40px; justify-content: center; } .search-box { background: #fff; padding: 30px; border-radius: 20px; box-shadow: 0 20px 60px rgba(0,0,0,0.1); } /* RIGHT SIDE */ .search-right { flex: 1; } .search-hero { background: linear-gradient(135deg,#000000cc,#00000088), url('https://images.unsplash.com/photo-1503376780353-7e6692767b70'); background-size: cover; background-position: center; height: 420px; border-radius: 25px; display: flex; flex-direction: column; justify-content: center; padding: 40px; color: #fff; } .search-hero h2 { font-size: 36px; font-weight: 700; } .search-hero p { font-size: 16px; opacity: 0.9; } /* TABS */ .custom-tabs { border-bottom: none; display: flex; gap: 10px; margin-bottom: 20px; } .custom-tabs li { list-style: none; } .custom-tabs li a { display: block; padding: 10px 18px; background: #f1f3f7; border-radius: 30px; color: #333; font-weight: 500; transition: 0.3s; } .custom-tabs li.active a, .custom-tabs li a:hover { background: #ff3c00; color: #fff; } /* FORM FIELDS INSIDE PLUGIN */ .search-box input, .search-box select { width: 100%; padding: 12px; border-radius: 10px; border: 1px solid #ddd; margin-bottom: 12px; transition: 0.3s; } .search-box input:focus, .search-box select:focus { border-color: #ff3c00; outline: none; } /* BUTTON */ .search-box button { width: 100%; background: #0A2357; color: #fff; padding: 12px; border-radius: 10px; border: none; font-weight: 600; transition: 0.3s; } .search-box button:hover { background: #d92f00; } /* MOBILE */ @media(max-width:900px){ .search-flex { flex-direction: column; } .search-left { width: 100%; } .search-hero { height: 250px; } } @media (min-width: 1200px) { #home section h1 { font-size: 4.33vw !important; line-height: 6.5vw !important; } } header.header-nav.menu_style_home_one.transparent { background: #fff !important; } .details-title { color: #fff !important; } .testi-text h3 { color: #fff !important; } header.header-nav.menu_style_home_one .ace-responsive-menu li a { color: #000 !important; } @media only screen and (max-width: 767px) { .car-category.mobile_space { margin-top: 10px !important; } #inventory { margin-top: 80px; } .back-to-results { margin-top: 110px !important; } } .dropdown-toggle::after { border-top: 0 !important; } .logo1 { filter: invert(1); } *, *::before, *::after { box-sizing: border-box; } body { margin: 0; overflow-x: hidden; color: #333; } img { max-width: 100%; height: auto; display: block; } /* Prevent CLS during Slick initialization */ .brand-slider { display: flex; min-height: 120px; } .slick-initialized .slick-slide { display: flex; align-items: center; justify-content: center; } .fade{ opacity: 1 !important; } .why-chose { padding: 80px 0; background: #f9fafb; } .section-head h2 { font-size: 32px; font-weight: 700; margin-bottom: 10px; } .section-head p { color: #000; font-size: 15px; margin-bottom: 40px; } /* CARD */ .why-card { background: #fff; border-radius: 16px; padding: 30px 25px; text-align: left; transition: 0.3s ease; border: 1px solid #eee; height: 100%; } .why-card:hover { transform: translateY(-8px); box-shadow: 0 20px 40px rgba(0,0,0,0.08); } /* ICON */ .icon-box { width: 60px; height: 60px; background: #fff3f0; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-bottom: 20px; } .icon-box svg { width: 26px; height: 26px; stroke: #ff4d30; fill: none; stroke-width: 2; } /* TEXT */ .why-card h3 { font-size: 18px; font-weight: 600; margin-bottom: 10px; } .why-card p { font-size: 14px; color: #000; line-height: 1.6; } /* MOBILE OPTIMIZATION */ @media (max-width: 768px) { .why-chose { padding: 50px 0; } .section-head h2 { font-size: 24px; } .why-card { padding: 20px; } } /* SECTION */ .our-funfact { padding: 70px 0; } /* GRID SPACING */ .our-funfact .row > div { margin-bottom: 20px; } /* CARD STYLE (NO BG) */ .funfact_one { padding: 25px 10px; text-align: center; border-radius: 12px; transition: all 0.3s ease; position: relative; } /* SUBTLE HOVER */ .funfact_one:hover { transform: translateY(-5px); } /* UNDERLINE EFFECT */ .funfact_one::after { content: ""; width: 30px; height: 2px; background: #ff4d30; display: block; margin: 12px auto 0; transition: width 0.3s ease; } .funfact_one:hover::after { width: 50px; } /* NUMBER */ .funfact_one .timer { font-size: 34px; font-weight: 700; color: #222; margin-bottom: 6px; } /* LABEL */ .funfact_one .ff_title { font-size: 13px; letter-spacing: 1px; color: #000; text-transform: uppercase; } /* REMOVE WOW ANIMATION IMPACT */ .wow { visibility: visible !important; animation: none !important; } /* MOBILE */ @media (max-width: 768px) { .our-funfact { padding: 50px 0; } .funfact_one .timer { font-size: 24px; } } section { padding: 50px 0 !important; } .why-auto { padding: 90px 20px; } .why-chose { background-color: #f9f9f9; } /* HEADER */ .why-head h2 { font-size: 34px; margin-bottom: 10px; } .why-head p { color: #666; margin-bottom: 50px; } /* WRAPPER */ .why-wrap { max-width: 900px; margin: auto; display: flex; flex-direction: column; gap: 20px; } /* ITEM */ .why-item { display: flex; align-items: center; gap: 20px; padding: 25px; border-radius: 14px; border: 1px solid #eee; background: #fff; transition: 0.3s; } /* LEFT ICON BOX */ .why-left { min-width: 60px; height: 60px; border-radius: 12px; background: #f5f5f5; display: flex; align-items: center; justify-content: center; font-size: 24px; color: #ff3b30; transition: 0.3s; } /* RIGHT TEXT */ .why-right h4 { font-size: 18px; margin-bottom: 5px; } .why-right p { font-size: 14px; color: #666; } /* HOVER */ .why-item:hover { transform: translateY(-5px); box-shadow: 0 8px 25px rgba(0,0,0,0.06); } .why-item:hover .why-left { background: #ff3b30; color: #fff; } /* MOBILE */ @media (max-width: 768px) { .why-item { flex-direction: column; text-align: center; } .why-left { margin-bottom: 10px; } } .flexx { margin: 0 auto; } @media (max-width: 767px) { .flexx { flex-direction: column; } } /* SECTION */ .auto-hero-section { position: relative; padding: 120px 20px; background: url('/usite/7521/images/elegant-couple-car-salon--1-_11zon.jpg'); overflow: hidden; background-size: cover; background-position: center 8%; background-repeat: no-repeat; } /* OVERLAY */ .auto-hero-overlay { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,0.6), rgba(0,0,0,0.8)); } /* CONTENT */ .auto-hero-box { position: relative; color: #fff; max-width: 700px; margin: auto; } /* BADGE */ .auto-badge { display: inline-block; padding: 6px 14px; background: rgba(255,255,255,0.15); border-radius: 20px; font-size: 13px; margin-bottom: 15px; } /* TITLE */ .auto-title { font-size: 46px; font-weight: 700; line-height: 1.2; margin-bottom: 15px; color: #fff !important; } /* SUBTEXT */ .auto-subtitle { font-size: 16px; color: #e5e7eb; margin-bottom: 30px; } /* BUTTONS */ .auto-actions { display: flex; gap: 12px; flex-wrap: wrap; } .auto-btn-primary { background: #0A2357; color: #fff; padding: 12px 22px; border-radius: 8px; text-decoration: none; font-weight: 500; transition: 0.3s; } .auto-btn-primary:hover { background: #fff; color: #000; } .auto-btn-outline { border: 1px solid #fff; color: #fff; padding: 12px 22px; border-radius: 8px; text-decoration: none; transition: 0.3s; } .auto-btn-outline:hover { background: #0A2357; color: #fff; } @media (max-width: 767px) { .auto-title { font-size: 30px; } .auto-hero-section { background: none !important; background-color: #000; } .auto-hero-overlay { background: #000 !important; } .mm-listitem { color: #fff !important; } } .car-hero-content { text-align: center; color: #fff; max-width: 750px; margin: auto; padding: 40px 20px; } /* BADGE */ .car-badge { display: inline-block; background: rgba(255,255,255,0.15); padding: 6px 14px; border-radius: 30px; font-size: 13px; margin-bottom: 18px; } /* TITLE */ .car-hero-title { font-size: 52px; font-weight: 700; line-height: 1.2; color: #fff; margin-bottom: 20px; } /* SUBTITLE */ .car-hero-subtitle { font-size: 18px; color: #fff; line-height: 1.7; margin-bottom: 35px; } /* BUTTONS */ .car-hero-actions { display: flex; justify-content: center; gap: 15px; flex-wrap: wrap; } /* PRIMARY BUTTON */ .car-btn-primary { background: #ff6b00; color: #fff; padding: 14px 30px; border-radius: 30px; text-decoration: none; font-weight: 600; transition: 0.3s; } .car-btn-primary:hover { background: #e65c00; transform: translateY(-2px); } /* OUTLINE BUTTON */ .car-btn-outline { border: 2px solid #fff; color: #fff; padding: 13px 28px; border-radius: 30px; text-decoration: none; font-weight: 600; transition: 0.3s; } .car-btn-outline:hover { background: #fff; color: #000; } /* ===== MOBILE ===== */ @media (max-width: 768px) { .car-hero-title { font-size: 32px; } .car-hero-subtitle { font-size: 15px; } } .car-dealership-section { background-color: #1a1a1a; padding: 70px 20px; display: flex; flex-direction: column; gap: 60px; overflow-x: hidden; } /* ============================= */ /* FLEX CONTAINER (YOUR 1200px CONTROL) */ /* ============================= */ .row.flexx { max-width: 1200px; width: 100%; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: 50px; } .col-content { flex: 1; color: #fff; padding: 20px; max-width: 520px; } .col-content h2 { font-size: 2.3rem; margin-bottom: 15px; letter-spacing: 1px; text-transform: uppercase; line-height: 1.3; color: #fff !important; } .col-content p { font-size: 1rem; line-height: 1.7; color: #fff; } /* ============================= */ /* IMAGE */ /* ============================= */ .col-media { flex: 1; display: flex; justify-content: center; } .col-media img { width: 100%; max-width: 520px; height: 320px; object-fit: cover; border-radius: 12px; } /* ============================= */ /* TABLET */ /* ============================= */ @media (max-width: 992px) { .row.flexx { gap: 30px; } .col-content h2 { font-size: 2rem; } } /* ============================= */ /* MOBILE */ /* ============================= */ @media (max-width: 768px) { .row.flexx { flex-direction: column; text-align: center; gap: 25px; } .row.flexx.reverse { flex-direction: column; } .col-content { max-width: 100%; padding: 10px; } .col-content h2 { font-size: 1.6rem; } .col-content p { font-size: 0.95rem; } .col-media img { height: 220px; } } /* ============================= */ /* SMALL DEVICES */ /* ============================= */ @media (max-width: 480px) { .car-dealership-section { padding: 50px 15px; } .col-content h2 { font-size: 1.4rem; } .col-content p { font-size: 0.9rem; } } /* BASE */ body { margin: 0; font-family: system-ui, -apple-system, sans-serif; background: #f5f6f8; } /* SECTION */ .car-section { padding: 60px 20px; max-width: 1300px; margin: auto; } /* GRID */ .car-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; } /* CARD */ .car-card { background: #fff; border-radius: 12px; overflow: hidden; border: 1px solid #eee; transition: 0.25s ease; } .car-card:hover { transform: translateY(-6px); box-shadow: 0 10px 25px rgba(0,0,0,0.08); } .car-card .btn { background: #0A2357; color: #fff; width: 100%; } /* IMAGE */ .car-img { position: relative; } .car-img img { width: 100%; height: 190px; object-fit: cover; display: block; } /* BADGE */ .badge { position: absolute; top: 12px; left: 12px; background: #111; color: #fff; font-size: 11px; padding: 4px 10px; border-radius: 20px; } /* BODY */ .car-body { padding: 14px; } /* TITLE */ .car-title { font-size: 15px; font-weight: 600; margin-bottom: 5px; } /* PRICE */ .car-price { font-size: 15px; font-weight: 700; color: #0d6efd; margin-bottom: 8px; } /* SPECS */ .car-specs { font-size: 12px; color: #000; margin-bottom: 12px; } /* BUTTON */ .btn { display: block; text-align: center; padding: 8px; border-radius: 6px; background: #111; color: #fff; font-size: 13px; text-decoration: none; } .btn:hover { background: #333; } .section-header { text-align: center; margin-bottom: 35px; } .section-header h2 { font-size: 28px; font-weight: 700; margin-bottom: 8px; } .section-header p { color: #000; font-size: 14px; } /* RESPONSIVE */ @media (max-width: 1024px) { .car-grid { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 600px) { .car-grid { grid-template-columns: 1fr; } } /* HERO SECTION */ .hero-divider { position: relative; min-height: 420px; display: flex; align-items: center; /* BACKGROUND IMAGE */ background: url("/usite/7521/images/HLH_MY25_0007_V002_desktop_11zon.jpg") center/cover no-repeat; /* PARALLAX EFFECT (ONLY DESKTOP FEEL) */ background-attachment: fixed; } /* DARK OVERLAY */ .hero-overlay { position: absolute; inset: 0; background: rgba(0,0,0,0.55); } /* CONTAINER */ .hero-container { position: relative; z-index: 2; width: 100%; max-width: 1200px; margin: auto; padding: 60px 20px; } /* LEFT CONTENT */ .hero-content { max-width: 520px; color: #fff; } /* TITLE */ .hero-content h2 { font-size: 40px; font-weight: 700; margin-bottom: 15px; line-height: 1.2; color: #fff !important; } /* TEXT */ .hero-content p { font-size: 16px; color: #ddd; margin-bottom: 25px; } /* BUTTON */ .hero-btn { display: inline-block; padding: 12px 22px; background: #fff; color: #111; border-radius: 6px; text-decoration: none; font-size: 14px; transition: 0.3s; } .hero-btn:hover { background: #0A2357; color: #fff; } /* MOBILE FIX (IMPORTANT) */ @media (max-width: 900px) { .hero-divider { background-attachment: scroll; /* prevents lag on mobile */ background: none; background-color: #000; padding: 30px 0 !important; } } .hero-content h2 { font-size: 28px; } .hero-content { max-width: 100%; } } /* SECTION */ .truck-section { padding: 70px 20px; background: #f9f9f9 !important; } .truck-section2 { max-width: 1200px; margin: auto; } /* HEADER */ .truck-header { text-align: center; margin-bottom: 40px; } .truck-header h2 { font-size: 30px; } .truck-header p { color: #000; font-size: 14px; } /* LIST */ .truck-list { display: flex; flex-direction: column; gap: 20px; } /* CARD */ .truck-card { display: flex; align-items: center; gap: 20px; background: rgba(255,255,255,0.6); backdrop-filter: blur(8px); border-radius: 14px; padding: 14px; text-decoration: none; color: #111; box-shadow: 0 8px 25px rgba(0,0,0,0.08); transition: 0.3s ease; } .truck-img { width: 200px; height: 130px; /* FIXED HEIGHT */ flex-shrink: 0; overflow: hidden; border-radius: 10px; } .truck-img img { width: 100%; height: 100%; object-fit: cover; /* KEY LINE */ display: block; } /* INFO */ .truck-info { flex: 1; } .truck-info h3 { margin-bottom: 6px; font-size: 18px; } .truck-info p { font-size: 14px; color: #000; margin-bottom: 8px; } /* TAG */ .truck-tag { font-size: 12px; background: #111; color: #fff; padding: 4px 10px; border-radius: 20px; } /* HOVER */ .truck-card:hover { transform: translateY(-4px); box-shadow: 0 12px 35px rgba(0,0,0,0.12); } /* MOBILE */ @media (max-width: 768px) { .truck-card { flex-direction: column; text-align: center; } .truck-img { width: 100%; } } /* SECTION */ .testi-modern { padding: 80px 15px; background: linear-gradient(135deg, #0f172a, #020617); color: #fff; text-align: center; overflow: hidden; /* critical */ } /* TITLE */ .testi-title { font-size: 32px; margin-bottom: 40px; font-weight: 600; color: #fff !important; } /* SLIDER FIX */ .testi-slider { margin: 0 -8px; /* safe spacing */ } /* EACH SLIDE */ .testi-slider .slick-slide { padding: 0 8px; box-sizing: border-box; } /* CARD */ .testi-card { width: 100%; max-width: 100%; background: rgba(255,255,255,0.05); backdrop-filter: blur(10px); border-radius: 16px; padding: 25px; transition: 0.3s; transform: scale(0.95); /* reduced */ opacity: 0.8; } .testi-card h3 { color: #fff !important; } /* ACTIVE CENTER */ .testi-card.slick-center { transform: scale(1.03); /* reduced from 1.1 */ opacity: 1; } /* TEXT */ .testi-text { font-size: 15px; line-height: 1.6; margin-bottom: 15px; color: #e5e7eb; } /* USER */ .testi-user { display: flex; align-items: center; gap: 10px; justify-content: center; } .testi-user img { width: 45px; height: 45px; border-radius: 50%; } .testi-user h4 { margin: 0; font-size: 14px; } .testi-user span { font-size: 12px; color: #fff; } /* ðŸ”¥ MOBILE FIX (most important) */ @media (max-width: 768px) { .testi-card { transform: scale(1); /* REMOVE scaling */ opacity: 1; } .testi-card.slick-center { transform: scale(1); /* no overflow */ } .testi-title { font-size: 26px; } } .brand-modern { padding: 80px 20px; text-align: center; } .brand-title { font-size: 34px; margin-bottom: 50px; font-weight: 600; } .brand-slider { display: flex; gap: 20px; } .brand-card { padding: 25px 15px; border-radius: 16px; background: #fff; border: 1px solid #eee; transition: all 0.3s ease; text-align: center; cursor: pointer; } .brand-card img { height: 45px; margin-bottom: 12px; filter: grayscale(100%); opacity: 0.7; transition: 0.3s; width: 70px; } .brand-card h4 { font-size: 15px; margin: 0; color: #555; font-weight: 500; } /* Hover Effect */ .brand-card:hover { transform: translateY(-8px); box-shadow: 0 8px 25px rgba(0,0,0,0.08); border-color: #ddd; } .brand-card:hover img { filter: grayscale(0%); opacity: 1; } .brand-card:hover h4 { color: #111; } @media (max-width: 767px){ .brand-slider{ flex-direction: column; } } body { font-family: 'Open Sans', sans-serif; padding-top: 65px; color: #1C0113; } .scrolling-div { height: 300px; overflow-y: auto; } .sign-agreement { margin-top: 30px; } .initial-area { border-bottom: 1px solid #ccc; margin-bottom: 20px; } .g-recaptcha div:first-child { margin: 0 auto; } .back-to-top { cursor: pointer; position: fixed; bottom: 55px; right: 15px; display: none; z-index: 2; } .btn-primary.back-to-top { background: #1C0113; padding: 8px 16px 12px; color: #fff; border: 1px solid #C21A01; } .btn { border-radius: 0; } .btn-primary.back-to-top:hover, .btn-primary.back-to-top:focus { background: #C21A01; color: #fff; border: 1px solid #1C0113; } a { color: #C21A01; /*cursor: default;*/ } a:focus, a:hover { color: #6B0103; } .mT20 { margin-top: 20px; } .mB30 { margin-bottom: 30px; } .btn-default { border-radius: 0; background: #C21A01; color: #FFF; border: none; } .btn-default:hover, .btn-default:focus { background: #A30006; color: #fff; } h1 { font-size: 29px; font-weight: 300; } .h5, h5 { font-size: 18px; } /* Top Navigation Styling */ .header { background: #A30006; } .hdr-logo { text-align: center; } .header-pad { background-color: #fff; padding: 1vw 0; color: #1C0113; } .nav > li > a { position: relative; display: block; color: #fff; text-decoration: none; font-size: 15px; text-transform: uppercase; letter-spacing: .05em; padding-bottom: 10px; padding-top: 10px; font-family: 'Oswald', sans-serif; font-weight: 300; } .nav > li > a:hover, .nav > li > a:focus /*.nav > li.active > a*/ { background: #6B0103; color: #fff; } .nav .open > a, .nav .open > a:focus, .nav .open > a:hover { background-color: #6B0103; border-color: #6B0103; color: #fff; } /* Top Navigation Styling End */ footer { background: #1C0113; } .ftr-copyright { background-color: #A30006; padding: 1vw 0; color: #fff; font-size: 10px; text-align: center; } footer .department a { color: #fff; } footer .department a:hover { color: #fff; } .department { margin: 30px auto; } .department h4 { color: #fff; font-size: 16px; margin-top: 0; } .department ul { list-style: square; margin-left: 10px; color: #fff; } /* HOME */ #home section h1 { font-size: 12.33vw; line-height: 11.5vw; color: #FFF; text-shadow: 0px 0px 5px #1C0113; margin: 0px; padding: 0px; font-family: 'Oswald', sans-serif; text-transform: uppercase; font-weight: 500; } .navbar { margin-bottom: -5px; border-radius: none; border: none; min-height: inherit; } .navbar-inverse .navbar-brand { padding-top: 15px; } .navbar-brand > img { max-height: 27px; } .dropdown-menu { background-color: #6B0103; border: 0px; /*border: 1px solid rgba(0, 0, 0, 0.15);*/ border-radius: 0; } .dropdown-menu > li { padding: 0px; } .dropdown-menu > li > a { color: #fff !important; text-transform: uppercase; padding-top: 6px; padding-bottom: 6px; font-family: 'Oswald', sans-serif; font-weight: 300; letter-spacing: .05em; } .dropdown-menu > li > a:hover { color: #6B0103 !important; } .dropdown-menu>.active>a, .dropdown-menu>.active>a:focus, .dropdown-menu>.active>a:hover { background: #A30006; } .mobile-nav .navbar-nav .dropdown-menu > li > a { padding-top: 9px; padding-bottom: 9px; } .mobile-nav .dropdown-menu > li > a:hover { color: #1C0113 !important; font-weight: 700; } .navbar-inverse { background-color: #fff; border-color: #fff; -webkit-box-shadow: 0 0 20px 3px #A3A3A3; box-shadow: 0 0 20px 3px #A3A3A3; } .navbar-inverse .navbar-toggle { border-color: #6B0103; background-color: #F03C02; } .navbar-inverse .navbar-toggle:focus, .navbar-inverse .navbar-toggle:hover { background-color: #C21A01; } .mobile-nav .navbar-nav { margin: 0; } .navbar-inverse .navbar-collapse, .navbar-inverse .navbar-form { border-color: #F03C02; background: #F03C02; } .navbar-inverse .navbar-nav > li > a { color: #fff; } .navbar-inverse .navbar-nav > li > a:hover { background: #6B0103; } .navbar-inverse .navbar-nav>.open>a, .navbar-inverse .navbar-nav>.open>a:focus, .navbar-inverse .navbar-nav>.open>a:hover { background: #6B0103; } .navbar-inverse .navbar-nav > li { border-bottom: 1px solid #FFF; } .navbar-inverse .navbar-nav > li:last-child { border-bottom: none; margin-bottom: 10px; } .navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse { max-height: 460px; } footer .department li { padding-left: 0; } .section-hdr { padding: 0px; } #home section .container-fluid { padding: 0px; } .well { border: none; border-radius: 0px; margin-bottom: 0px; padding-bottom: 50px; padding-top: 50px; border-top-color: #F03C02; border-top-width: 7px; border-top-style: solid; } form .well { padding-top: 5px; } #search { background-color: #1C0113; height: auto; margin: 0 auto; width: 100%; position: relative; box-shadow: 0 0 9px rgba(0,0,0,0.8); padding: 20px 0px 0px 0px; } .search-form img, .section-entry img { margin: 0 auto; } .section-entry { margin: 20px 0; } .section-entry h2 { text-transform: uppercase; font-size: 23px; margin-bottom: 40px; color: #6B0103; font-family: 'Oswald', sans-serif; font-weight: 400; } /* search form*/ .nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover { background-color: #1C0113; border: none; color: #fff; /*cursor: default;*/ border-bottom: 2px solid #1C0113; } .nav-tabs > li > a { background-color: #C21A01; text-transform: inherit; border: 1px solid transparent; border-radius: 0; margin-right: 0; } #search-form .input-lg { border-radius: 0; } #search-form { background-color: #1C0113; padding: 40px 55px; } #search-form [class*="col-"] { padding-right: 0; padding-left: 0; } .select-wrapper { background: #fff url("/usite/5724/images/chevron-down.png") no-repeat 98% 50%; } #search-form select { box-shadow: none; background-color: transparent; background-image: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; } #search-form input { box-shadow: none; } #search-form select:focus, #search-form input:focus, #inventory select:focus, #inventory input:focus { outline: none; background: #FDEDDD; } #selectMake { border-top: none; border-right: none; border-bottom: 1px solid #1C0113; border-left: none; } #selectModel { border-top: none; border-right: none; border-bottom: 1px solid #1C0113; border-left: none; } #makeMaxPrice { border-top: none; border-right: none; border-bottom: 1px solid #1C0113; border-left: none; } #makeSearchRadius, #selectBody, #bodyMaxPrice, #bodySearchRadius { border-top: none; border-right: none; border-bottom: 1px solid #1C0113; border-left: none; } #makeSearchRadius { border-right: 1px solid #1C0113; } #makeSearchZip, #bodySearchZip { border: none; } select.input-lg { line-height: 1.3333333; } option { padding: 10px 0 10px 20px; } option:hover, option:checked { box-shadow: 0 0 10px 100px #6B0103 inset; } #search-form button { border-radius: 0; background: #C21A01; color: #FFF; text-transform: uppercase; border: none; margin-top: 25px; } #search-form button:hover { background: #6B0103; } #what-hot { background-color: #1C0113; height: auto; margin: 0 auto; width: 100%; position: relative; box-shadow: 0 0 50px rgba(0,0,0,0.8); padding: 20px 0px 0px 0px; } #what-hot a { color: #6B0103; } #what-hot a:hover { color: #C21A01; } #hot-list { font-family: 'Oswald', sans-serif; font-size: 17px; font-weight: 400; list-style: none; } #hot-list li { padding: 7px 0; } #cars { background-color: #1C0113; height: auto; margin: 0 auto; width: 100%; position: relative; box-shadow: 0 0 50px rgba(0,0,0,0.8); padding: 20px 0px 0px 0px; } #trucks { background-color: #1C0113; height: auto; margin: 0 auto; width: 100%; position: relative; box-shadow: 0 0 50px rgba(0,0,0,0.8); padding: 20px 0px 0px 0px; } #suvs { background-color: #1C0113; height: auto; margin: 0 auto; width: 100%; position: relative; padding: 20px 0px 0px 0px; box-shadow: 0 0 50px rgba(0,0,0,0.8); } #vehicle-types { background-color: #1C0113; height: auto; margin: 0 auto; width: 100%; position: relative; padding: 20px 0px 0px 0px; box-shadow: 0 0 50px rgba(0,0,0,0.8); } #popular-makes { background-color: #1C0113; height: auto; margin: 0 auto; width: 100%; position: relative; padding: 20px 0px 0px 0px; box-shadow: 0 0 50px rgba(0,0,0,0.8); } /* END HOME */ /* INVENTORY PAGE*/ /*filter results*/ .filter-results-section h3 { color: #0A2357; font-weight: 300; font-size: 18px; font-family: 'Oswald', sans-serif; } h2.page-title { font-size: 26px; font-weight: 300; margin-top: 0; font-family: 'Oswald', sans-serif; color: #F03C02; } .title h3 { font-size: 26px; font-weight: 300; font-family: 'Oswald', sans-serif; color: #F03C02; } p.panel-title { font-weight: 600; margin: 10px 0; text-transform: capitalize; font-size: 16px; } p.panel-title a:focus, p.panel-title a:active { font-weight: 600; color: #6B0103; } p.panel-title a:hover { color: #C21A01; } .panel-default { border: none; } .panel-default > .panel-heading { background-color: #6B0103; border: none; color: #FFF; border-radius: 0; } .panel-title { font-size: 19px; font-weight: 400; text-transform: uppercase; font-family: 'Oswald', sans-serif; letter-spacing: .05em; } .styled-checkbox { position: absolute; opacity: 0; } .styled-checkbox + label { position: relative; cursor: pointer; padding: 0; } .styled-checkbox + label:before { content: ''; margin-right: 10px; display: inline-block; vertical-align: text-top; width: 20px; height: 20px; border: 1px solid #1C0113; } .styled-checkbox:hover + label:before { background: #6B0103; border: 1px solid #6B0103; } .styled-checkbox:focus + label:before { box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.12); } .styled-checkbox:checked + label:before { background: #6B0103; } .styled-checkbox:checked + label:after { content: ''; position: absolute; left: 5px; top: 9px; background: white; width: 2px; height: 2px; box-shadow: 2px 0 0 white, 4px 0 0 white, 4px -2px 0 white, 4px -4px 0 white, 4px -6px 0 white, 4px -8px 0 white; -webkit-transform: rotate(45deg); transform: rotate(45deg); } .panel-title > .small > a:hover, .panel-title > a:hover, .panel-title > small > a:hover , .panel-title > .small > a:focus, .panel-title > a:focus, .panel-title > small > a:focus { text-decoration: none; color: #FFF; } .filter-results-section label { font-weight: 400; font-size: 15px; color: #1C0113; } #collapseFour ul li, #collapseFive ul li, #collapseSix ul li, #collapseNine ul li, #collapseTen ul li, #collapseEleven ul li, #collapseTwelve ul li, #collapseThirteen ul li, #collapseFourteen ul li, #collapseFifteen ul li { display: inline-block; float: left; width: 50%; } .reset-results { margin: 10px 0 0 0; } .reset-results a { color: #6B0103; font-size: 18px; } .results-open-close a { display: block; background-color: #F03C02; color: #FFF; text-transform: uppercase; font-size: 19px; padding: 5px; } .results-open-close a:hover, .results-open-close a:focus, .results-open-close a:active { background-color: #6B0103; text-decoration: none; } .filter-results-section .apply-all { width: 100%; display: block; text-transform: uppercase; } .filter-results-section .reset-results { display: block; } /* end filter results*/ /* inventory*/ .no-matches { margin-top: 80px; } #inventory input { border: 1px solid #1C0113; box-shadow: none; border-radius: 0; } #inventory select { box-shadow: none; background-color: transparent; background-image: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; border-radius: 0; border: 1px solid #0A2357; } #inventory .select-wrapper.selectZipFilter { background-position: 83% 50%; } .select-view h3 { font-weight: 300; color: #0A2357; font-size: 18px; font-family: 'Oswald', sans-serif; } .select-view h3 a { color: #0A2357; } .select-view h3 a:hover { color: #0A2357; text-decoration: none; } .select-view h3 a:focus, .select-view h3 a:active { color: #0A2357; text-decoration: none; } .sort-by { margin-top: 15px; } .panel-body .sort-by { margin-top: 0; } .sort-by .control-label { font-size: 18px; color: #F03C02; font-weight: 300; font-family: 'Oswald', sans-serif; } #inventory .select-wrapper.sort-by { background-position: 92% 80%; } .pagination { width: 100%; margin-top: 0; } .bottom-pagination .page-scroll-through { margin-right: 60px; } h5.light { font-size: 18px; color: #6B0103; font-weight: 400; } .pagination .btn-group > .btn/*:not(:first-child):not(:last-child):not(.dropdown-toggle) */ { border-radius: 0; border-color: #6B0103; background: #fff; margin-right: 5px; margin-bottom: 5px; color: #0A2357; } .pagination .btn-group > .btn.btn-primary.active, .btn-primary:active { color: #fff; background-color: #0A2357; border-color: #0A2357; border-radius: 0px; margin-right: 5px; padding-top: 7px; padding-bottom: 7px; } .see-all { margin-top: 10px; font-weight: 600; } #see-all-makes label, #see-all-models label { font-weight: 400; font-size: 15px; color: #6B0103; } #all-makes-list, #all-models-list { max-height: 400px; overflow-y: scroll; } .compare-carfax-row { background: #0A2357; } .carfax ul, .price-compare ul { margin-bottom: 0; position: relative; transform: translateY(-50%); top: 50%; } /* grid view */ #grid-view-listing .single-listing { margin-bottom: 20px; } .listing-border { border: 1px solid #6B0103; position: relative; } .compare-listing, .save-listing, .remove-compare { width: 50px; height: 50px; background: #6B0103; color: #FFF; font-family: 'Open Sans Condensed', sans-serif; font-size: 12px; text-align: center; font-weight: 700; top: 0; position: absolute; z-index: 1; } .compare-listing:hover, .save-listing:hover, .compare-listing:focus, .save-listing:focus, .details-listing:hover, .details-listing:focus, .remove-compare:hover, .remove-compare:focus { background: #A30006; color: #FFF; text-decoration: none; } .save-listing { right: 0; } .compare-listing, .remove-compare { left: 0; } .compare-listing .fa, .save-listing .fa, .details-listing .fa, .remove-compare .fa { font-size: 30px; font-weight: normal; } #grid-view-listing .auto-photo { height: 290px; background-size: cover; background-position: left top; } #grid-view-listing .listing-title { padding: 0 10px; } .auto-photo { position: relative; } .vin-stock { position: absolute; bottom: 0; background: rgba(29,0,20,1); color: #fff; font-size: 12px; width: 100%; padding: 5px 0; } .listing-title { color: #C21A01; font-size: 27px; font-family: 'Oswald', sans-serif; font-weight: 700; } .listing-trim { font-family: 'Oswald', sans-serif; color: #C21A01; font-size: 24px; font-weight: 700; } .listing-miles { font-size: 24px; font-weight: 600; color: #1C0113; } .listing-price { font-size: 30px; font-family: 'Oswald', sans-serif; color: #fff; background: #6B0103; margin: 10px 10% 5px 10%; font-weight: 500; } .listing-description { font-style: italic; font-size: 16px; color: #3F433F; margin: 10px; } #grid-view-listing .listing-description { display: block; /* Fallback for non-webkit */ display: -webkit-box; -webkit-line-clamp: 6; -webkit-box-orient: vertical; height: 70px; overflow-y: scroll; } #grid-view-listing .listing-trim { padding-right: 10px; padding-left: 10px; } #grid-view-listing .listing-location span { display: block; } .listing-location { font-weight: 700; color: #1C0113; margin: 10px; line-height: 18px; } .saved-vehicles-page .sort-by { display: none; } .price-compare, .carfax { background: #C21A01; text-transform: uppercase; padding: 10px; font-size: 16px; height: 58px; display: inline-block; } .price-compare { border-right: 1px solid #fff; } .price-compare a, .carfax a { color: #fff; } .compare-carfax-row > div > ul { margin-bottom: 0; } .price-compare a:hover, .carfax a:hover { color: #1C0113; text-decoration: none; } .listing-details a, .listing-best-price a { background: #0A2357; color: #FFF; text-transform: uppercase; padding: 5px; display: block; font-size: 22px; font-weight: 700; border-top: 1px solid #fff; } .listing-details a:hover, .listing-best-price a:hover { background: #0A2357; text-decoration: none; color: #FFF; } .ellipsis { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .filter-results-section { display: none; } /* list view */ #list-view-listing .single-listing { margin-bottom: 20px; } #list-view-listing .auto-photo { padding-left: 0; max-height: 208px; overflow: hidden; } #list-view-listing .auto-photo img { margin: 0 auto; width: 100%; } #list-view-listing .listing-price { background: none; color: #0A2357; font-size: 32px; line-height: 40px; margin: 10px 0 5px 0; display: inline-block; } #list-view-listing .listing-payments { display: inline-block; } #list-view-listing h4 { margin: 0; } #list-view-listing h2 { margin: 30px 0 0 0; } #list-view-listing .listing-miles { font-size: 20px; margin-top: 10px; } #list-view-listing .listing-details a { border-top: none; } #list-view-listing .price-compare, #list-view-listing .carfax { font-size: 14px; } #list-view-listing .listing-title, #list-view-listing .listing-title, #list-view-listing .listing-trim { color: #0A2357; } .auto-more-info { margin-top: 20px; } #list-view-listing .listing-best-price { border-bottom: 1px solid #FFF; } #list-view-listing .listing-location { margin: 70px 0 10px 0; } #list-view-listing .save-listing { right: 15px; } #list-view-listing .compare-listing { right: 80px; left: auto; } /* end inventory */ /* saved vehicles */ @media (min-width: 768px) { #saved-vehicles #grid-view-listing .single-listing { width: 50%; float: left; } } @media (min-width: 992px) { #saved-vehicles #grid-view-listing .single-listing { width: 33%; } } @media (min-width: 1200px) { #saved-vehicles #list-view-listing .carfax span { display: block; } } /* end saved vehicles */ /* END INVENTORY PAGE */ /* DETAIL PAGE */ .back-to-results { margin: 20px 0; } .breadcrumbs { margin-bottom: 20px; } .sliderContainer { margin-bottom: 20px; } #detail { margin-bottom: 30px; } #image-gallery img { width: 100%; } .details-name-price { background: #0A2357; color: #FFF; font-family: 'Oswald', sans-serif; letter-spacing: 0.02em; position: relative; padding: 5px 0 0 0; font-size: 34px; text-align: center; } h1.details-title { letter-spacing: 0.02em; margin: 3px 0 0 0; text-align: center; font-size: 34px; } .details-payments { font-size: 16px; font-family: 'Open Sans', sans-serif; color: #fff; } #detailsPage .listing-trim { font-size: 28px; margin-bottom: 10px; } #detailsPage .listing-miles { font-size: 26px; font-weight: 400; margin: 10px 0; } .details-top, .details-mid { padding-bottom: 20px; border-bottom: 1px solid #6B0103; margin-bottom: 20px; text-align: center; } .details-top .listing-trim { color: #6B0103; } .mpg-data { margin-top: 20px; } #detailsPage h3 { font-weight: 500; color: #6B0103; font-family: 'Oswald', sans-serif; font-size: 28px; } .detailsSummary { font-size: 16px; } .options-title h3 { margin-top: 0; } .mpg-heading { font-size: 17px; font-weight: 700; font-family: 'Open Sans Condensed', sans-serif; } .mpg-body { font-size: 17px; font-weight: 700; } .disclaimer { font-size: 11px; } .details-mid { position: relative; } .details-listing { background: #6B0103 none repeat scroll 0 0; color: #fff; font-family: "Open Sans Condensed",sans-serif; font-size: 12px; font-weight: 700; height: 50px; text-align: center; width: 50px; display: block; margin: 0 auto 10px auto; padding-top: 2px; } .details-location { text-align: center; } .tabbable { font-size: 15px; } .tab-content li { margin: 2px 0; } .tab-content .fa { color: #F03C02; } .nav-pills.nav>li.active>a, .nav-pills.nav>li.active>a:focus, .nav-pills.nav>li.active>a:hover { color: #fff; background-color: #0A2357; } .nav-pills.nav>li.active>a span, .nav-pills.nav>li.active>a:focus span, .nav-pills.nav>li.active>a:hover span { color: #6B0103; } .nav-pills.nav > li > a { border-radius: 0; font-size: 18px; padding: 8px 16px 10px 16px; color: #6B0103; letter-spacing: .05em; } .nav-pills.nav>li>a:focus, .nav-pills.nav>li>a:hover { color: #C21A01; background-color: transparent; } .nav-pills.nav > li > a > span { color: #F03C02; } .details-bot { margin-bottom: 20px; } .detail-cta { border-radius: 0; text-transform: uppercase; } .detail-cta .btn { font-size: 25px; font-weight: 600; color: #FFF; padding: 5px 0; background-color: #A30006; display: block; } .detail-cta .btn:hover { background-color: #C21A01; } .detail-cta-blue { padding: 0; } .detail-cta-blue a { background: #1C0113; font-size: 19px; font-weight: 400; color: #FFF; border-radius: 0; padding: 5px; margin-bottom: 1px; text-transform: uppercase; display: block; cursor: pointer; } a#scheduleTestDrive, a#getApproved, a#getApproved2 { border-right: 1px solid #FFF; } .shopping-tools h3 { text-align: center; } .shopping-tools a { color: #FFF; font-size: 19px; } .detail-cta-blue a:hover { text-decoration: none; background: #6B0103; } .shopping-tools .btn-primary { margin-bottom: 10px; } #detailsPage .compare-listing, #detailsPage .remove-compare { right: 75px; left: auto; } .dropin { padding-bottom: 1px; } .seo-nav { border-bottom: 7px solid #1C0113; padding: 5px 0 10px 0; clear: both; } .seo-menu ul { margin-bottom: 0; } .seo-menu li a { margin: 4px 0; display: inline-block; color: #1C0113; font-size: 15px; font-weight: 600; } /* end DETAIL PAGE */ /* VEHICLE COMPARE PAGE */ .table-bordered { border: none; } .table-bordered td.noborder, .table-bordered th.noborder { border: none; background: #fff; } .table-bordered > tbody > tr > td { border: 2px solid #FFF; background: #FDEDDD; } .table-condensed > tbody > tr > td, .table-condensed > tbody > tr > th, .table-condensed > tfoot > tr > td, .table-condensed > tfoot > tr > th, .table-condensed > thead > tr > td, .table-condensed > thead > tr > th { padding: 0.5%; } .vehicle-compare-head { border: 1px solid #6B0103; position: relative; } .vehicle-compare-head .fa { background: #6B0103 none repeat scroll 0 0; border-radius: 18px; color: #fff; height: 18px; padding: 2px 3px; width: 18px; position: absolute; top: -5px; right: -5px; } .compare-title { font-size: 29px; font-family: 'Oswald', sans-serif; color: #E43900; padding: 5px 4% 0 4%; letter-spacing: 0.02em; } .compare-trim { color: #E43900; font-size: 19px; font-weight: 600; padding: 0 4% 0 4%; } .compare-price { color: #6B0103; font-size: 29px; font-weight: 700; padding: 0 4% 0 4%; } .compare-vehicles-table .auto-photo { text-align: center; } .compare-vehicles-table .auto-photo img { margin: 0 auto; width: auto; max-height: 120px; } .compare-vehicles-table .details-listing { position: relative; right: auto; top: auto; } .compare-vehicles-table td, .compare-vehicles-table th { text-align: center; } .compare-vehicles-table tr td:first-child { text-align: left; background: #1C0113; color: #FFF; } .compare-vehicles-table tr td.noborder:first-child { background: #FFF; vertical-align: bottom; } .compare-vehicles-table h4 { font-size: 21px; color: #F03C02; font-family: 'Oswald', sans-serif; font-weight: 300; } .compare-comments { height: 200px; overflow-y: auto; padding: 5px 15px; } .color-swatch { width: 20px; height: 20px; display: inline-block; border: 1px solid #000; } /* end VEHICLE COMPARE PAGE */ /* FORMS*/ h4.modal-title { font-family: 'Oswald', sans-serif; color: #C21A01; font-size: 30px; } .modal-footer { border-top: none; } .well { background-color: #FFF; } #contactPageContent .well { background-color: #FDEDDD; } .btn-primary { background-color: #1C0113; border: none; border-radius: 0; text-transform: uppercase; } .text-danger { color: #C21A01; text-transform: uppercase; } #quick-quote h4, #TestDrive h4 { color: #C21A01; font-weight: 600; } legend { color: #C21A01; font-weight: 600; } /* CONTACT PAGE */ #contactPageContent { margin: 30px auto; } #contactPageContent h4 { font-family: 'Oswald', sans-serif; color: #C21A01; font-size: 30px; padding-bottom: 10px; border-bottom: 1px solid #C21A01; margin-bottom: 30px; } .form-control { border: 1px solid #1C0113; } .pricing-list { font-size: 18px; max-width: 320px; } .pricing-list .price { text-align: right; } /* DEALER PAGES */ #dealershipview-page h2, #dealershipview-page h4 { margin-top: 5px; } #dealershipview-page .dealers p { color: #A0B6C6; font-weight: 600; margin-top: 30px; margin-bottom: 0; } #dealershipview-page .dealers p:first-child { margin-top: 0; } .dealers { margin: 30px 0; } .panel-primary > .panel-heading { background-color: #A30006; border-color: #A30006; text-align: center; font-family: 'Oswald', sans-serif; font-size: 27px; letter-spacing: 0.02em; padding: 5px 15px; } .panel-primary { border-color: #A30006; } .list-group-item { border: none; } .list-group { margin-bottom: 0; } .panel-footer { background-color: transparent; border-top: none; padding: 0 15px 10px 15px; } .panel-footer a.btn { font-size: 18px; white-space: normal; } /*MEDIA QUERIES*/ /* Extra small devices (portrait phones, less than 576px) No media query since this is the default in Bootstrap*/ @media (max-width: 384px) { .col-xxs-1, .col-xxs-2, .col-xxs-3, .col-xxs-4, .col-xxs-5, .col-xxs-6, .col-xxs-7, .col-xxs-8, .col-xxs-9, .col-xxs-10, .col-xxs-11 { float: left; } .col-xxs-1 { width: 8.333333333333332%; } .col-xxs-2 { width: 16.666666666666664%; } .col-xxs-3 { width: 25%; } .col-xxs-4 { width: 33.33333333333333%; } .col-xxs-5 { width: 41.66666666666667%; } .col-xxs-6 { width: 50%; } .col-xxs-7 { width: 58.333333333333336%; } .col-xxs-8 { width: 66.66666666666666%; } .col-xxs-9 { width: 75%; } .col-xxs-10 { width: 83.33333333333334%; } .col-xxs-11 { width: 91.66666666666666%; } .col-xxs-12 { width: 100%; } .col-xxs-push-1 { left: 8.333333333333332%; } .col-xxs-push-2 { left: 16.666666666666664%; } .col-xxs-push-3 { left: 25%; } .col-xss-push-4 { left: 33.33333333333333%; } .col-xxs-push-5 { left: 41.66666666666667%; } .col-xxs-push-6 { left: 50%; } .col-xxs-push-7 { left: 58.333333333333336%; } .col-xxs-push-8 { left: 66.66666666666666%; } .col-xxs-push-9 { left: 75%; } .col-xxs-push-10 { left: 83.33333333333334%; } .col-xxs-push-11 { left: 91.66666666666666%; } .col-xxs-pull-1 { right: 8.333333333333332%; } .col-xxs-pull-2 { right: 16.666666666666664%; } .col-xxs-pull-3 { right: 25%; } .col-xxs-pull-4 { right: 33.33333333333333%; } .col-xxs-pull-5 { right: 41.66666666666667%; } .col-xxs-pull-6 { right: 50%; } .col-xxs-pull-7 { right: 58.333333333333336%; } .col-xxs-pull-8 { right: 66.66666666666666%; } .col-xxs-pull-9 { right: 75%; } .col-xxs-pull-10 { right: 83.33333333333334%; } .col-xxs-pull-11 { right: 91.66666666666666%; } .col-xxs-offset-1 { margin-left: 8.333333333333332%; } .col-xxs-offset-2 { margin-left: 16.666666666666664%; } .col-xxs-offset-3 { margin-left: 25%; } .col-xxs-offset-4 { margin-left: 33.33333333333333%; } .col-xxs-offset-5 { margin-left: 41.66666666666667%; } .col-xxs-offset-6 { margin-left: 50%; } .col-xxs-offset-7 { margin-left: 58.333333333333336%; } .col-xxs-offset-8 { margin-left: 66.66666666666666%; } .col-xxs-offset-9 { margin-left: 75%; } .col-xxs-offset-10 { margin-left: 83.33333333333334%; } .col-xxs-offset-11 { margin-left: 91.66666666666666%; } } /*@media (min-width: 449px) and (max-height:991px) { .price-compare, .carfax { min-height: auto; } }*/ @media (min-width: 450px) { #grid-view-listing .auto-photo { background-position: left -30px; } } /* Small devices (landscape phones, 576px and up)*/ @media (min-width: 576px) { #inventory .select-wrapper.sort-by { background-position: 96% 80%; } .page-showing { float: left; } .page-scroll-through { float: right; text-align: right; } #grid-view-listing .auto-photo { background-position: left -80px; } .detail-cta .btn { font-size: 33px; } } @media (min-width: 576px) and (max-width: 767px) { .ftr-sections li, .seo-menu li { width: 50%; float: left; } } @media (min-width: 700px) { #grid-view-listing .auto-photo { background-position: left -120px; } } /* Medium devices (tablets, 768px and up)*/ @media (min-width: 768px) { body { padding-top: 0; } .hdr-logo img { max-width: 185px; margin: 0 auto; } .navbar { text-align: center; } .nav>li>a { padding: 9px; } .navbar .navbar-nav { display: inline-block; float: none; } #search, #what-hot, #cars, #trucks, #suvs, #vehicle-types, #popular-makes { padding: 100px 0; } #search { background: #F03C02 url(/usite/5724/images/hm-search.jpg) fixed 50% 0; } #what-hot { background: #F03C02 url(/usite/5724/images/hm-hot.jpg) fixed 50% 0; } #cars { background: #F03C02 url(/usite/5724/images/hm-cars.jpg) fixed 50% 0; } #trucks { background: #F03C02 url(/usite/5724/images/hm-trucks.jpg) fixed 50% 0; } #suvs { background: #F03C02 url(/usite/5724/images/hm-suv.jpg) fixed 50% 0; } #vehicle-types { background: #F03C02 url(/usite/5724/images/hm-types.jpg) fixed 50% 0; } #popular-makes { background: #F03C02 url(/usite/5724/images/hm-makes.jpg) fixed 50% 0; } #selectMake { border-top: none; border-right: 1px solid #1C0113; border-bottom: 1px solid #1C0113; border-left: none; } #selectModel { border-top: none; border-right: none; border-bottom: 1px solid #1C0113; border-left: none; } #makeMaxPrice { border-top: none; border-right: 1px solid #1C0113; border-bottom: none; border-left: none; } #makeSearchRadius, #selectBody, #bodyMaxPrice, #bodySearchRadius { border-top: none; border-right: 1px solid #1C0113; border-bottom: none; border-left: none; } p.panel-title { font-weight: 300; } .form-inline { float: right; } #inventory .select-wrapper.sort-by { background-position: 95% 50%; } .pagination { margin-top: 20px; margin-bottom: 10px; } h1.details-title { text-align: left; } .details-price, #detailsPage .vin-num, #detailsPage .listing-miles { text-align: right; } .details-price sup { top: -.3em; } .details-payments { color: #6B0103; position: absolute; bottom: -45px; right: 15px; } .mpg-data { margin-top: 0; } .details-location { text-align: right; margin-top: 80px; } .details-listing { position: absolute; top: 0; right: 15px; } .details-top, .details-mid { text-align: inherit; } .detailsSummary { font-size: 14px; } .nav-stacked { border-right: 1px solid #6B0103; padding-right: 0; } .filter-results-section { display: inherit; } p.panel-title { margin-top: 0; } #grid-view-listing .auto-photo { background-position: left -30px; } a#emailFriend2, a#valueTradeIn2, a#scheduleTestDrive2 { border-right: 1px solid #FFF; } } .sort-by .control-label { color: #0A2357 !important; } @media (max-width: 991px) { #list-view-listing { display: none!important; } #grid-view-listing { display: block!important; } } /* Large devices (desktops, 992px and up)*/ @media (min-width: 992px) { .nav>li>a { padding: 10px 13px; font-size: 17px; } .select-view h3, .filter-results-section h3, .sort-by .control-label { font-size: 24px; } #inventory .select-wrapper.sort-by { background-position: 93% 50%; } #list-view-listing { display: inherit; } #grid-view-listing { display: none; } .detail-cta-blue span { display: block; } .detail-cta-blue span.fa { display: inline-block; } .listing-price { font-size: 24px; } #grid-view-listing .single-listing { margin-bottom: 30px; } #grid-view-listing .auto-photo { background-position: -15px top; } h2.details-title, .details-name-price { font-size: 28px; } .bottom-pagination .page-scroll-through { margin-left: -60px; } h1.details-title { margin: 0 0 8px 0; } .saved-vehicles-page .pagination { margin-top: -34px; } /*.price-compare, .carfax { min-height: 65px; }*/ #list-view-listing .price-compare, #list-view-listing .carfax { min-height: 60px; } } @media (min-width: 992px) and (max-width: 999px) { #grid-view-listing .carfax span { display: block; } } /* Extra large devices (large desktops, 1200px and up)*/ @media (min-width: 1200px) { #home section h1 { font-size: 10.33vw; line-height: 9.5vw; } .nav > li > a { padding: 9px 20px 11px 20px; font-size: 18px; } #inventory .select-wrapper.sort-by { background-position: 96% 50%; } #list-view-listing h2 { margin: 30px 0 0 0; } .details-name-price { font-size: 40px; } h1.details-title { font-size: 40px; margin: 3px 0 0 0; } #detailsPage .listing-trim { font-size: 34px; } .detailsSummary { font-size: 16px; } .detail-cta-blue span { display: inline; } .listing-price { font-size: 30px; } .ftr-dealership { text-align: right; } .listing-location { line-height: 16px; font-size: 13px; } #list-view-listing h2 { margin-top: 10px; } } @media (min-width: 1200px) and (max-width: 1333px) { #grid-view-listing .carfax span { display: block; } } @media (min-width: 1450px) { #inventory .select-wrapper.sort-by { background-position: 97% 50%; } #grid-view-listing .auto-photo { background-position: left top; } } @media (min-width: 1200px) and (max-width: 1636px) { #list-view-listing .carfax span { display: block; } } @media (min-width: 1200px) and (max-width: 1390px) { #list-view-listing .listing-details a, #list-view-listing .listing-best-price a { font-size: 19px; } } [ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak { display: none !important; } .pointer { cursor: pointer; } .btn-primary:hover, .btn-primary:focus { background-color: #6B0103; border-color: #6B0103; } div.btn:hover a, div.btn:focus a, div.btn-primary:hover a, div.btn-primary:focus a { text-decoration: none !important; } .btn-primary.active.focus, .btn-primary.active:focus, .btn-primary.active:hover, .btn-primary:active.focus, .btn-primary:active:focus, .btn-primary:active:hover, .open>.dropdown-toggle.btn-primary.focus, .open>.dropdown-toggle.btn-primary:focus, .open>.dropdown-toggle.btn-primary:hover { background-color: #A30006; border-color: #A30006; } .btn.btn-primary.active, .btn-primary:active { color: #fff; background-color: #F03C02; border-color: #F03C02; border-radius: 0px; margin-right: 0px; padding-top: 6px; padding-bottom: 6px; }