/* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Common/BusinessHours.razor.rz.scp.css */ .hours__status.hours__status__open[b-aadgpb1mmy], .sn_business_open[b-aadgpb1mmy] { background-color: var(--inventorydetails-primary); } .hours__status.hours__status__closed[b-aadgpb1mmy], .sn_business_close[b-aadgpb1mmy] { color: #FFFFFF; padding: 5px 10px; border-radius: 3px; display: inline; background-color: var(--color-theme-secondary); } .businessHours[b-aadgpb1mmy] { padding: 5px 10px; } .wide-container .store__hours[b-aadgpb1mmy] { text-align: right; } .wide-container .store__hours[b-aadgpb1mmy] { text-align: left; } .cursor[b-aadgpb1mmy]{ cursor: pointer; } .businessHours .cursor .fa-chevron-up[b-aadgpb1mmy] { transition: transform .3s ease-in-out; } .businessHours .cursor.collapsed .fa-chevron-up[b-aadgpb1mmy] { transform: rotate(180deg); } .businessHours .hours__specialNote[b-aadgpb1mmy] { display: inline-block; margin: 2px 0 6px 0; padding: 2px 8px; border-radius: 3px; font-size: .85em; font-weight: 600; color: #FFFFFF; } .businessHours .hours__specialNote__closed[b-aadgpb1mmy] { background-color: #C4183C; } .businessHours .hours__specialNote__open[b-aadgpb1mmy] { background-color: #55595C; } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Common/CreditQualifySlimVersion.razor.rz.scp.css */ button.btn.btn-pre-qualified[b-sfyblvf711] { background-size: 104% !important; background-position: center !important; margin: 10px 0; border-radius: 4px; color: white; transition: .25s; } button.btn.btn-pre-qualified:hover[b-sfyblvf711] { color: var(--bs-gray-800) !important; } .vdp_cq_slim_version[b-sfyblvf711] { display: block; } .vdp__creditQualifyFormModal__context[b-sfyblvf711] { text-align: left; font: normal normal bold 14px/18px Outfit; letter-spacing: 0px; color: #39444D; opacity: 1; font-family: var(--primary-font-family), sans-serif; } [b-sfyblvf711].vdp__creditQualifyFormModal .modalDialog__sticky-header { position: absolute !important; z-index: auto; } @media (min-width: 992px) { .vdp_cq_slim_version[b-sfyblvf711] { display: none; } } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Common/MessageUs.razor.rz.scp.css */ [b-ew024kranc] .vdp__message__mod { margin-top: 0 !important; } [b-ew024kranc] .validation-message { color: #A20226; } [b-ew024kranc].noBackground .vdp__message__wrapper { background: none !important; border: none !important; padding: 0 !important; } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Common/MobileStickyFooter.razor.rz.scp.css */ .mobile-sticky-cta[b-m2v9nfri77] { background: var(--color-theme-background); padding: 0.5em; position: fixed; bottom: 0px; width: 100%; z-index: 1001; box-shadow: 0px -5px 3px #0000001A; opacity: 1; height: 80px; display: block; } .mobile-sticky-cta .btn[b-m2v9nfri77] { border-radius: 3px !important; opacity: 1; text-align: center !important; letter-spacing: 0px !important; padding: 11px 5px; font-style: normal; font-weight: normal; font-size: 16px; line-height: 20px; background: var(--color-theme-primary) !important; border-color: var(--color-theme-primary) !important; } .termsAndCondition[b-m2v9nfri77] { text-align: center; font-style: normal; font-weight: normal; font-size: 8px; line-height: 12px; letter-spacing: 0px; color: var(--color-theme-text); opacity: 1; } .btn-share[b-m2v9nfri77] { width: 45px; height: 45px; } [b-m2v9nfri77].mobile-sticky-footer .modal-body { padding-top: 0 !important; } [b-m2v9nfri77].mobile-sticky-footer .modal-body .form-label { color: #39444D !important; } [b-m2v9nfri77].mobile-sticky-footer .modal-body .disclaimerText { color: #898989 !important; } [b-m2v9nfri77].mobile-sticky-footer .modal-content { background-color: #FFFFFF !important; } [b-m2v9nfri77].mobile-sticky-footer .modal-header { background-color: #FFFFFF !important; } [b-m2v9nfri77].mobile-sticky-footer .fa-times { color: #39444D !important; } [b-m2v9nfri77].mobile-sticky-footer .modal-header .close { padding-right: 0 !important; padding-left: 0 !important; } [b-m2v9nfri77].mobile-sticky-footer .modal-title { text-align: left; font: normal normal bold 28px/35px Outfit; letter-spacing: 0px; color: #39444D !important; opacity: 1; font-family: var(--primary-font-family), sans-serif; } @media (min-width: 768px) { .mobile-sticky-cta[b-m2v9nfri77] { display: none; } } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Display/CodeYourOwn.razor.rz.scp.css */ [CodeYourOwnCssScope] .ck-editor__main { min-height: 200px; } [CodeYourOwnCssScope] .ck-editor__editable { min-height: 200px; } [CodeYourOwnCssScope] .ck-source-editing-area { min-height: 200px; } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Display/ConnectWithUs.razor.rz.scp.css */ /* Message Us Module =================================================================================================*/ /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Display/CreditQualifyBanner.razor.rz.scp.css */ .creditQualifyBanner__image-desktop[CreditQualifyBannerWidgetCssScope]{ max-width: 960px; } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Display/CreditQualifyForm.razor.rz.scp.css */ [CreditQualifyFormWidgetCssScope] img.approved-image { max-width: 100px; } [CreditQualifyFormWidgetCssScope] i.fa-solid.fa-check { color: #1b8ace; } [CreditQualifyFormWidgetCssScope] .vdp__creditQualifyFormModal__context { font-size: 14px; } [CreditQualifyFormWidgetCssScope] .btn-pre-qualified { background-size: 104% !important; background-position: center !important; margin: 10px 0; border-radius: 25px; color: white; transition: .25s; } [CreditQualifyFormWidgetCssScope] .btn.btn-no-thank-you{ padding-right: 15px; padding-left: 15px; } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Display/DealershipInfo.razor.rz.scp.css */ .hours__status.hours__status__open[DealershipInfoWidgetCssScope] { background-color: var(--inventorydetails-primary); } .hours__status.hours__status__closed[DealershipInfoWidgetCssScope] { color: #FFFFFF; font-size: 10px; padding: 5px 10px; border-radius: 3px; display: inline; background-color: var(--color-theme-secondary); } .wide-container .store__hours[DealershipInfoWidgetCssScope] { text-align: right; } .wide-container .store__hours[DealershipInfoWidgetCssScope] { text-align: left; } .narrow-container .store__hours[DealershipInfoWidgetCssScope] { text-align: right; } [DealershipInfoWidgetCssScope] .modal-body { padding-top: 0 !important; } [DealershipInfoWidgetCssScope] .modal-body form { transition: all 0.3s ease; } [DealershipInfoWidgetCssScope] .modal-body .form-component { margin-bottom: 0 !important; } [DealershipInfoWidgetCssScope] .modal-body .message-us-form:not(.show) { display: none !important; } [DealershipInfoWidgetCssScope] .modal-body .message-us-form.show { display: block !important; } [DealershipInfoWidgetCssScope] .modal-body .form-sent-message:not(.show){ display: none; } [DealershipInfoWidgetCssScope] .modal-body .form-sent-message.show { color: #000 !important; display: block; } [DealershipInfoWidgetCssScope] .modal-body .form-label, .validation-message[DealershipInfoWidgetCssScope] { color: #39444D !important; } [DealershipInfoWidgetCssScope] .modal-body .date-wrapper { position: relative; display: inline-block; } [DealershipInfoWidgetCssScope] .modal-body .date-wrapper .styled-date:not(.modified)::before { content: 'mm/dd/yyyy'; position: absolute; font-size: 16px; font-weight: normal; font-family: sans-serif; color: #c2c7d4; pointer-events: none; display: block; } [DealershipInfoWidgetCssScope] .modal-body .date-wrapper .styled-date::-webkit-calendar-picker-indicator { color: transparent; background: transparent; opacity: 1; cursor: pointer; } [DealershipInfoWidgetCssScope] .modal-body .date-wrapper .styled-date::-webkit-date-and-time-value { text-align: left; } [DealershipInfoWidgetCssScope] .modal-body .date-wrapper .styled-date { -moz-appearance: textfield; background-image: url('data:image/svg+xml;charset=UTF-8,'); background-repeat: no-repeat; background-position: center right 10px; background-size: 16px 16px; cursor: unset; } [DealershipInfoWidgetCssScope] .modal-body .date-wrapper .styled-date.modified { content: none; } [DealershipInfoWidgetCssScope] .modal-body .disclaimerText { color: #898989 !important; } [DealershipInfoWidgetCssScope] .modal-content { background-color: #FFFFFF !important; color: #898989 !important; } [DealershipInfoWidgetCssScope] .modal-header { background-color: #FFFFFF !important; } [DealershipInfoWidgetCssScope] .fa-times { color: #39444D !important; } [DealershipInfoWidgetCssScope] .modal-header .close { padding-right: 0 !important; padding-left: 0 !important; } [DealershipInfoWidgetCssScope] .modal-title { text-align: left; font: normal normal bold 28px/35px Outfit; letter-spacing: 0px; color: #39444D !important; opacity: 1; font-family: var(--primary-font-family), sans-serif; } .btnPhoneCall[DealershipInfoWidgetCssScope] { background: var(--color-theme-primary) !important; border-color: var(--color-theme-primary) !important; } .vdp__dealerInfo__mod .btn[DealershipInfoWidgetCssScope]{ border-radius: 3px; } [DealershipInfoWidgetCssScope] .vdp__message__wrapper { background: none !important; border: none !important; padding: 0 !important; } @media (min-width: 768px) { .btnPhoneCall[DealershipInfoWidgetCssScope] { min-width: 50%; } } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Display/FormModal.razor.rz.scp.css */ [b-6ioxvdh94e] .form-sent-message{ color: #000000; } .modal-backdrop[b-6ioxvdh94e]{ opacity: .5; } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Display/LoanCalculator.razor.rz.scp.css */ /* Loan Calc Module =================================================================================================*/ [LoanCalculatorWidgetCssScope] .loan__calc__content .btngrp__sublabel { display: block; font-size: 0.75em; } [LoanCalculatorWidgetCssScope] .loan__calc__content .calc__list__item { padding: 15px 0; border-bottom: 2px dotted var(--inventorydetails-border); } [LoanCalculatorWidgetCssScope] .loan__calc__content .calc__totals__wrapper { background-color: transparent; border: 1px solid var(--inventorydetails-border); padding: 20px; } [LoanCalculatorWidgetCssScope] .loan__calc__content .calc__totals__wrapper .monthly__payment__price { font-size: 1.5em; font-weight: 700; } [LoanCalculatorWidgetCssScope] .loan__calc__content .calc__totals__wrapper .monthly__payment__price sup { font-size: 0.5em; } [LoanCalculatorWidgetCssScope] .loan__calc__content .calc__totals__wrapper .col:first-of-type { border-right: 1px solid var(--inventorydetails-border); } [LoanCalculatorWidgetCssScope] .loan__calc__content .calc__totals__wrapper .label { font-size: 0.75em; } [LoanCalculatorWidgetCssScope] .loan__calc__content .calc__totals__wrapper .value { font-size: 1.5em; font-weight: 700; } [LoanCalculatorWidgetCssScope] .loan__calc__content .calc__totals__wrapper .value sup { font-size: 0.5em; } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Display/PhotoGallery.razor.rz.scp.css */ .photoGallery[PhotoGalleryWidgetCssScope] img.img__photo{ cursor: pointer; } /* PhotoGrid4 =================================================================================================*/ .vdp__photoGrid.photo__grid4 .wrap[PhotoGalleryWidgetCssScope] { display: flex; flex-flow: row wrap; margin: 0 auto; flex-wrap: nowrap; position: relative; } .vdp__photoGrid.photo__grid4 .wrap img[PhotoGalleryWidgetCssScope] { width: 100%; } .vdp__photoGrid.photo__grid4 .wrap_col[PhotoGalleryWidgetCssScope] { display: flex; flex-direction: column; height: 100%; } .vdp__photoGrid.photo__grid4 .col__1[PhotoGalleryWidgetCssScope] { width: 80%; flex: 1 0 auto; } .vdp__photoGrid.photo__grid4 .wrap_item[PhotoGalleryWidgetCssScope] { height: auto; margin: 10px; display: flex; flex: 1 1 auto; flex-direction: column; } /* PhotoGrid Hover Effect =================================================================================================*/ .photo__hover__wrapper[PhotoGalleryWidgetCssScope] { position: relative; overflow: hidden; } .photo__item img.img__photo[PhotoGalleryWidgetCssScope] { transition: .25s; } .photo__hover__wrapper:hover img.img__photo[PhotoGalleryWidgetCssScope] { filter: brightness(1.1); -webkit-filter: brightness(110%); } .photo__hover__wrapper .photo__hover__overlay[PhotoGalleryWidgetCssScope] { position: absolute; height: 100%; width: 100%; left: 0; top: 0; bottom: 0; right: 0; opacity: 0; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; cursor:pointer; } .photo__hover__wrapper:hover .photo__hover__overlay[PhotoGalleryWidgetCssScope] { opacity: 1; } .photo__hover__details[PhotoGalleryWidgetCssScope] { position: absolute; text-align: center; width: 100%; top: 50%; left: 50%; opacity: 0; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-transition: all 0.2 ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; color: #ffffff; font-size: 30px; } .photo__hover__details i[PhotoGalleryWidgetCssScope] { margin-right: 0 !important; } .photo__hover__wrapper:hover .photo__hover__details[PhotoGalleryWidgetCssScope] { top: 50%; left: 50%; opacity: 1; } /* Photo Gallery Modal =================================================================================================*/ [PhotoGalleryWidgetCssScope] .modal-header .btn.close .fa.fa-times{ color: #333; } [PhotoGalleryWidgetCssScope] .modal-content { color: #fff; background-color: white; border-color: var(--inventorydetails-border); } [PhotoGalleryWidgetCssScope] .modal-content .photos__wrapper { max-width: 1000px; -webkit-filter: drop-shadow(0 2px 35px rgba(0, 0, 0, 0.1)); filter: drop-shadow(0 2px 35px rgba(0, 0, 0, 0.1)); background-color: #f9f9f9; } [PhotoGalleryWidgetCssScope] .modal-content .embed-responsive{ height: 100%; width: 100%; min-height: 500px; margin: auto; } [PhotoGalleryWidgetCssScope] .modal-content .photos__wrapper img { margin-bottom: 20px; width: 100%; border-radius: 6px; } [PhotoGalleryWidgetCssScope] .modal-title { color: #333; white-space: normal; word-break: break-word; font-size: 1.75em; } [PhotoGalleryWidgetCssScope] .photo__count { font-size: 1rem; } [PhotoGalleryWidgetCssScope] .modal-header { border-bottom: 1px solid var(--inventorydetails-border); padding: 25px; } @media (max-width: 767px) { [PhotoGalleryWidgetCssScope] .modal-title { font-size: 1em; } [PhotoGalleryWidgetCssScope] .photo__count { font-size: 0.75rem; } } [PhotoGalleryWidgetCssScope] .modal-body .videoPlayer{ margin: auto auto 20px; } [PhotoGalleryWidgetCssScope] .modal-body .videoPlayer iframe{ border-radius: 8px; } [PhotoGalleryWidgetCssScope] #viewAllPhotosModal .modal-body .videoPlayer__youtube, [PhotoGalleryWidgetCssScope] #viewAllPhotosModal .modal-body .videoPlayer__tiktok, [PhotoGalleryWidgetCssScope] #viewAllPhotosModal .modal-body .videoPlayer__facebook{ height: 350px; width: 100%; } [PhotoGalleryWidgetCssScope] #viewAllPhotosModal .modal-body .youtubePlayer, [PhotoGalleryWidgetCssScope] #viewAllPhotosModal .modal-body .tiktokPlayer, [PhotoGalleryWidgetCssScope] #viewAllPhotosModal .modal-body .facebookPlayer{ height: 350px; background-color: #000000; border-radius: 10px; } @media (min-width: 992px) { [PhotoGalleryWidgetCssScope] #viewAllPhotosModal .modal-body .videoPlayer__youtube, [PhotoGalleryWidgetCssScope] #viewAllPhotosModal .modal-body .videoPlayer__tiktok{ height: 500px; } [PhotoGalleryWidgetCssScope] #viewAllPhotosModal .modal-body .videoPlayer__facebook{ height: 500px; display: flex; justify-content: center; } [PhotoGalleryWidgetCssScope] #viewAllPhotosModal .modal-body .youtubePlayer, [PhotoGalleryWidgetCssScope] #viewAllPhotosModal .modal-body .tiktokPlayer{ height: 500px; } [PhotoGalleryWidgetCssScope] #viewAllPhotosModal .modal-body .facebookPlayer{ height: 500px; width: 500px; background-color: black; overflow: hidden; } } [PhotoGalleryWidgetCssScope] #viewAllPhotosModal .modal-body .instagramPlayer iframe{ margin:auto; } [PhotoGalleryWidgetCssScope] #viewAllPhotosModal .youtubePlayer__modal__close, [PhotoGalleryWidgetCssScope] #viewAllPhotosModal .tiktokPlayer__modal__close, [PhotoGalleryWidgetCssScope] #viewAllPhotosModal .facebookPlayer__modal__close, [PhotoGalleryWidgetCssScope] #viewAllPhotosModal .instagramPlayer__modal__close { display: none; } [PhotoGalleryWidgetCssScope] #viewAllPhotosModal .modal-body .facebookPlayer__embed-container, [PhotoGalleryWidgetCssScope] #viewAllPhotosModal .modal-body .tiktokPlayer__embed-container, [PhotoGalleryWidgetCssScope] #viewAllPhotosModal .modal-body .youtubePlayer__embed-container{ height: 100%; width: 100%; align-content: center; } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Display/PhotoGalleryLayouts/Layout1/Layout1.razor.rz.scp.css */ .vdp__photoGrid.photo__grid1[PhotoGalleryWidgetCssScope] { display: flex; } /*Photo Grid Layout 1 =========================================*/ .photo__grid1 .photo__thumbnail[PhotoGalleryWidgetCssScope], .photo__grid1 .photo__item[PhotoGalleryWidgetCssScope] { height: 100%; } .full-container .photo__grid1 .photo__thumbnail[PhotoGalleryWidgetCssScope] { background-color: #ffffff; padding: 0; margin: 0; border-radius: 10px; } .wide-container .photo__grid1 .photo__thumbnail[PhotoGalleryWidgetCssScope] { background-color: #ffffff; padding: 0; margin: 0; border-radius: 4px; } .narrow-container .photo__grid1 .photo__thumbnail[PhotoGalleryWidgetCssScope] { background-color: #ffffff; padding: 0; margin: 0; border-radius: 4px; } .photo__grid1 .photo__thumbnail img.img__photo[PhotoGalleryWidgetCssScope] { width: 100%; max-width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; aspect-ratio: 1.33333333; } .photo__grid1 .photo__thumbnail[PhotoGalleryWidgetCssScope] { border-radius: 10px; background-color: #ffffff; border: 1px solid #EDEDED; } @media (max-width: 450px) { .vdp__photoGrid.photo__grid1 .photo__item .photo__thumbnail[PhotoGalleryWidgetCssScope] { max-height: auto; min-height: auto; } /* Must stay scoped to .img__photo -- a bare `img` would also match .img__photo__backdrop. See TP 152875, the same selector broke the lead photo in Layout 2. */ .vdp__photoGrid.photo__grid1 .photo__item .photo__thumbnail img.img__photo[PhotoGalleryWidgetCssScope] { position: relative; } } [PhotoGalleryWidgetCssScope] .videoPlayer__imagePlaceholder{ border-radius: 10px; } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Display/PhotoGalleryLayouts/Layout2/Layout2.razor.rz.scp.css */ .vdp__photoGrid.photo__grid2[PhotoGalleryWidgetCssScope] { display: flex; } /*Photo Grid Layout 2 =========================================*/ .photo__grid2 .photo__thumbnail[PhotoGalleryWidgetCssScope] { height: 100%; } .full-container .photo__grid2 .small__image .photo__thumbnail[PhotoGalleryWidgetCssScope] { background-color: #ffffff; border: 1px solid var(--inventorydetails-border); padding: 0; margin: 0; border-radius: 4px; } .full-container .photo__grid2 .large__image .photo__thumbnail[PhotoGalleryWidgetCssScope] { background-color: #ffffff; border: 1px solid var(--inventorydetails-border); padding: 0; margin: 0; border-radius: 4px; } .wide-container .photo__grid2 .small__image .photo__thumbnail[PhotoGalleryWidgetCssScope] { background-color: #ffffff; border: 1px solid var(--inventorydetails-border); padding: 0; margin: 0; border-radius: 4px; } .wide-container .photo__grid2 .large__image .photo__thumbnail[PhotoGalleryWidgetCssScope] { background-color: #ffffff; border: 1px solid var(--inventorydetails-border); padding: 0; margin: 0; border-radius: 4px; } .narrow-container .photo__grid2 .small__image .photo__thumbnail[PhotoGalleryWidgetCssScope] { background-color: #ffffff; border: 1px solid var(--inventorydetails-border); padding: 0; margin: 0; border-radius: 4px; } .narrow-container .photo__grid2 .large__image .photo__thumbnail[PhotoGalleryWidgetCssScope] { background-color: #ffffff; border: 1px solid var(--inventorydetails-border); padding: 0; margin: 0; border-radius: 4px; } .photo__grid2 .photo__thumbnail[PhotoGalleryWidgetCssScope] { border-radius: 10px; background-color: #ffffff; border: 1px solid #EDEDED; } .photo__grid2 .photo__thumbnail img.img__photo[PhotoGalleryWidgetCssScope] { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; aspect-ratio: 1.33333333; } .photo__grid2 .photo__item flex-fill[PhotoGalleryWidgetCssScope]{ height: 100%; } .photo__grid2 .photo__thumbnail[PhotoGalleryWidgetCssScope], .photo__grid2 .photo__item[PhotoGalleryWidgetCssScope], .photo__grid2 .small__image[PhotoGalleryWidgetCssScope]{ height: 100%; } @media (max-width: 450px) { .vdp__photoGrid.photo__grid2 .photo__item .photo__thumbnail[PhotoGalleryWidgetCssScope] { max-height: auto; min-height: auto; } /* Must stay scoped to .img__photo. A bare `img` here also matches the lead photo's .img__photo__backdrop and drops it out of position: absolute, so the blurred copy fills the tile and hides the real photo (TP 152875). */ .vdp__photoGrid.photo__grid2 .photo__item .photo__thumbnail img.img__photo[PhotoGalleryWidgetCssScope] { position: relative; } } @media (min-width: 576px){ .image__count__overlay[PhotoGalleryWidgetCssScope]{ display:none!important; } } [PhotoGalleryWidgetCssScope] .videoPlayer__imagePlaceholder{ border-radius: 4px; } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Display/PhotoGalleryLayouts/Layout3/Layout3.razor.rz.scp.css */ /*Photo Grid Layout 3 =========================================*/ .photo__grid3 .photo__thumbnail[PhotoGalleryWidgetCssScope], .photo__grid3 .photo__item[PhotoGalleryWidgetCssScope] { height: 100%; } .full-container .photo__grid3 .small__image .photo__thumbnail[PhotoGalleryWidgetCssScope] { background-color: #ffffff; padding: 0; margin: 0; border-radius: 4px; } .full-container .photo__grid3 .large__image .photo__thumbnail[PhotoGalleryWidgetCssScope] { background-color: #ffffff; padding: 0; margin: 0; border-radius: 4px; } .wide-container .photo__grid3 .small__image .photo__thumbnail[PhotoGalleryWidgetCssScope] { background-color: #ffffff; padding: 0; margin: 0; border-radius: 4px; } .wide-container .photo__grid3 .large__image .photo__thumbnail[PhotoGalleryWidgetCssScope] { background-color: #ffffff; padding: 0; margin: 0; border-radius: 4px; } .narrow-container .photo__grid3 .small__image .photo__thumbnail[PhotoGalleryWidgetCssScope] { background-color: #ffffff; padding: 0; margin: 0; border-radius: 4px; } .narrow-container .photo__grid3 .large__image .photo__thumbnail[PhotoGalleryWidgetCssScope] { background-color: #ffffff; padding: 0; margin: 0; border-radius: 4px; } .photo__grid3 .photo__thumbnail[PhotoGalleryWidgetCssScope] { border-radius: 10px; background-color: #ffffff; border: 1px solid #EDEDED; } .photo__grid3 .photo__thumbnail img.img__photo[PhotoGalleryWidgetCssScope] { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; aspect-ratio: 1.33333333; } .photo__grid3 .small__image[PhotoGalleryWidgetCssScope] { height: 100%; } .photo__grid3 .photo__item[PhotoGalleryWidgetCssScope] { height: 100%; } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Display/PhotoGalleryLayouts/Layout4/Layout4.razor.rz.scp.css */ /*Photo Grid Layout 4 =========================================*/ .full-container .photo__grid4 .small__image .photo__thumbnail[PhotoGalleryWidgetCssScope] { background-color: #ffffff; padding: 0; margin: 0; border-radius: 4px; } .full-container .photo__grid4 .large__image .photo__thumbnail[PhotoGalleryWidgetCssScope] { background-color: #ffffff; padding: 0; margin: 0; border-radius: 4px; } .wide-container .photo__grid4 .small__image .photo__thumbnail[PhotoGalleryWidgetCssScope] { background-color: #ffffff; padding: 0; margin: 0; border-radius: 4px; } .wide-container .photo__grid4 .large__image .photo__thumbnail[PhotoGalleryWidgetCssScope] { background-color: #ffffff; padding: 0; margin: 0; border-radius: 4px; } .narrow-container .photo__grid4 .small__image .photo__thumbnail[PhotoGalleryWidgetCssScope] { background-color: #ffffff; padding: 0; margin: 0; border-radius: 4px; } .narrow-container .photo__grid4 .large__image .photo__thumbnail[PhotoGalleryWidgetCssScope] { background-color: #ffffff; padding: 0; margin: 0; border-radius: 4px; } .photo__grid4 .photo__thumbnail[PhotoGalleryWidgetCssScope] { border-radius: 10px; background-color: #ffffff; border: 1px solid #EDEDED; } .photo__grid4 .photo__thumbnail img.img__photo[PhotoGalleryWidgetCssScope] { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; aspect-ratio: 1.33333333; } .photo__grid4 .photo__thumbnail[PhotoGalleryWidgetCssScope], .photo__grid4 .photo__item[PhotoGalleryWidgetCssScope], .photo__grid4 .small__image[PhotoGalleryWidgetCssScope] { height: 100%; } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Display/PhotoGalleryLayouts/Shared/ImagePlaceholder.razor.rz.scp.css */ .photo__item .img__placeholder[PhotoGalleryWidgetCssScope] { max-width: 80px; margin-bottom: 3px; height: 80px; width: 80px; border-radius: 100px; border: 3px solid #EDEDED; padding: 10px; background-color: #fff; -webkit-filter: drop-shadow(0 5px 3px rgba(0, 0, 0, 0.1)); filter: drop-shadow(0 5px 3px rgba(0, 0, 0, 0.1)); } .photo__item .img__placeholder img[PhotoGalleryWidgetCssScope] { width: 100%; } .photo__item .img__placeholder__copy[PhotoGalleryWidgetCssScope] { text-align: center; margin: 5px 0 15px; } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Display/PhotoGalleryLayouts/Shared/_ImageCard.razor.rz.scp.css */ .photo__item[PhotoGalleryWidgetCssScope] { overflow: hidden; color: unset; margin-bottom: 10px; width: 100%; margin-bottom: 0; position: relative; } .photo__thumbnail img.img__photo[PhotoGalleryWidgetCssScope] { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; position: relative; left: 0; right: 0; top: 0; bottom: 0; cursor: pointer; } /* Backdrop is off by default so it can never show as a stray duplicate image. The lead-photo rule below turns it on; only .large__image layouts (2, 3, 4) have a lead photo. */ .photo__thumbnail .img__photo__backdrop[PhotoGalleryWidgetCssScope] { display: none; position: absolute; inset: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; z-index: 0; pointer-events: none; } /* A blurred, dimmed copy of the same file fills whatever the lead photo does not cover. It is scaled past the tile edges so the blur never exposes a seam, and it is painted below the photo: both sit at the same stacking level, so DOM order decides. */ .large__image .photo__thumbnail .img__photo__backdrop[PhotoGalleryWidgetCssScope] { display: block; -webkit-filter: blur(28px) brightness(0.55); filter: blur(28px) brightness(0.55); -webkit-transform: scale(1.14); transform: scale(1.14); } .photo__item .photo__thumbnail .photo__showMore[PhotoGalleryWidgetCssScope] { background: rgba(50, 73, 95, 0.7); position: absolute; height: 100%; width: 100%; left: 0; top: 0; bottom: 0; right: 0; z-index: 100; -webkit-transition: all 0.2s ease-in-out 0s; -moz-transition: all 0.2s ease-in-out 0s; transition: all 0.2s ease-in-out 0s; color: #fff; display: flex; cursor: pointer; } .photo__item .photo__thumbnail .photo__showMore .photo__showMore__count[PhotoGalleryWidgetCssScope] { font-size: 3em; font-weight: bold; margin: auto; } @media(max-width: 576px){ .photo__item .photo__thumbnail .photo__showMore .photo__showMore__count[PhotoGalleryWidgetCssScope] { font-size: 2em; font-weight: bold; margin: auto; } } .image__count__overlay[PhotoGalleryWidgetCssScope] { position: absolute; background: rgba(50, 73, 95, 0.7); padding: 3px 5px; color: white; border-radius: 5px; font-size: 12px; bottom: 5px; right: 5px; } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Display/QuickConnect.razor.rz.scp.css */ .quickconnect_item[QuickConnectCssScope] { width: 100%; height: 55px; } .vdp__quickconnect button[QuickConnectCssScope] { margin: auto; border: 1px solid #f2f2f2; text-align: center; padding: 8px; } [QuickConnectCssScope] .modal-header { border-bottom: 1px solid lightgray; margin: 0 1em; padding: 1em 0em; } [QuickConnectCssScope] .form-forms-header{ display: none; } [QuickConnectCssScope] .modal-body { padding-top: 0; } [QuickConnectCssScope] .modal-content { background: #fff; color: #000; border-color: #fff; } [QuickConnectCssScope] h5.modal-title { color: #000; font-size: 2em; } [QuickConnectCssScope] .modal-header .close { color: #000; opacity: 1; } .sticky-button[QuickConnectCssScope]::before { -webkit-mask: url('data:image/svg+xml, ') no-repeat center; mask: url('data:image/svg+xml, ') no-repeat center; background-color: var(--color-theme-text-btn) !important; width: 16px; height: 16px; transform: rotate(90deg); width: 16px; height: 16px; position: relative; } .sticky-button[QuickConnectCssScope] { writing-mode: vertical-lr; text-orientation: mixed; position: fixed; bottom: 50%; transform: translateY(50%); z-index: 2091; right: 0 !important; left: unset !important; width: 34px; height: auto; background: var(--inventorydetails-secondary); box-shadow: 0px 15px 10px #00000029; border: 2px solid #FFFFFF; border-radius: 16px 0px 0px 16px; opacity: 1; text-align: center; display: flex; align-items: center; /* Align text vertically */ justify-content: center; /* Align text horizontally */ font-style: normal; font-weight: normal; font-size: 16px; line-height: 20px; color: var(--color-theme-text-btn) !important; } @media (min-width: 320px) { .sticky-bottom-mobile[QuickConnectCssScope] { background: var(--color-theme-background); padding: 0.5em; position: fixed; bottom: 80px; width: 100%; z-index: 1999; box-shadow: 0px -5px 3px #0000001A; margin: 0; left: 0; } .btnCloseModal[QuickConnectCssScope] { font-family: var(--primary-font-family), sans-serif !important; font: normal normal normal 16px/20px Outfit !important; background: var(--color-theme-background); opacity: 1; color: var(--color-theme-primary); } .btnCloseModal i[QuickConnectCssScope] { color: var(--color-theme-primary); } .sticky-bottom-mobile .vdp__quickconnect__wrapper[QuickConnectCssScope] { padding: 20px 20px 0 20px !important; } } @media (min-width: 768px) { .sticky-bottom-mobile[QuickConnectCssScope] { bottom: 0; } } @media (min-width: 992px) { .sticky-bottom-mobile[QuickConnectCssScope] { position: unset !important; display: block; opacity: 1; box-shadow: none; } .sticky-bottom-mobile .vdp__quickconnect__wrapper[QuickConnectCssScope] { padding: 0px 20px 0 20px !important; } } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Display/Section.razor.rz.scp.css */ /* **** IMPORTANT NOTE **** This file was left blank intentionally, Blazor CSS Isolation is being used, refer to the Display folder for the component stylesheet =================================================================================================*/ /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Display/Staff.razor.rz.scp.css */ /* Staff Module Style 1 =================================================================================================*/ .staff__style1 .item__card[StaffWidgetCssScope] { border: 1px solid var(--inventorydetails-border); } .full-container .staff__style1 .item__card[StaffWidgetCssScope] { padding: 50px 25px; } .wide-container .staff__style1 .item__card[StaffWidgetCssScope] { padding: 20px 25px; } .narrow-container .staff__style1 .item__card[StaffWidgetCssScope] { padding: 20px 15px; } .staff__style1 .item__card__photo[StaffWidgetCssScope] { max-height: 120px; } .staff__style1 .item__card__photo img[StaffWidgetCssScope] { border-radius: 50%; height: 110px; width: 110px; object-fit: cover; } .staff__style1 .staff__info__wrapper[StaffWidgetCssScope] { margin-left: 20px; } .staff__style1 .staff__info__wrapper .staff__name[StaffWidgetCssScope] { font-family: var(--primary-font-family), sans-serif; font-size: 20px; font-weight: 700; } .staff__style1 .staff__info__wrapper .staff__jobTitle[StaffWidgetCssScope] { font-size: 16px; color: var(--inventorydetails-text); } .wide-container .staff__style1 .staff__4[StaffWidgetCssScope], .full-container .staff__4[StaffWidgetCssScope] { display: none; } .wide-container .staff__style1 .staff__welcome__section[StaffWidgetCssScope], .narrow-container .staff__welcome__section[StaffWidgetCssScope] { display: none; } .full-container .staff__style1 .item__card__inner__wrapper[StaffWidgetCssScope] { display: flex; } .wide-container .staff__style1 .item__card__inner__wrapper[StaffWidgetCssScope] { text-align: center; margin: auto; } .narrow-container .staff__style1 .item__card__inner__wrapper[StaffWidgetCssScope] { text-align: center; margin: auto; } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Display/StickyNavigation.razor.rz.scp.css */ /* .builder-canvas__sticky-container class is needed to keep the sticky navigation on the page when scrolling down on display */ /* The class is located in Chassis.UI.Common.ModuleBuilder.VDP/wwwroot/scss/global.scss */ [b-h85p0r54yf] .modal-header { border-bottom: 1px solid lightgray; margin: 0 1em; padding: 1em 0em; } [b-h85p0r54yf] .form-forms-header { display: none; } [b-h85p0r54yf] .modal-body { padding-top: 0; } [b-h85p0r54yf] .modal-content { background: #fff; color: #000; border-color: #fff; } [b-h85p0r54yf] h5.modal-title { color: #000; font-size: 2em; } [b-h85p0r54yf] .modal-header .close { color: #000; opacity: 1; } .hide[b-h85p0r54yf] { display: none; } .sn_title[b-h85p0r54yf] { width: 45%; float: left; } .sn_sub_title[b-h85p0r54yf] { font-size: 12px; } .sn_business_hours_container[b-h85p0r54yf] { float: right; margin-top: 10px; } .sn_business_openclose[b-h85p0r54yf] { color: #fff; font-size: 10px; padding: 5px 10px; border-radius: 3px; display: inline; } .sn_business_openclose.open[b-h85p0r54yf] { background-color: var(--color-theme-primary); } .sn_business_openclose.close[b-h85p0r54yf] { background-color: #c72931; } .sn_business_hours[b-h85p0r54yf] { font-size: 12px; margin-left: 5px; display: inline; } .sn_current_hours[b-h85p0r54yf] { display: inline; } .sn_current_hours ul[b-h85p0r54yf] { list-style: none; } .sn_current_hours li[b-h85p0r54yf] { display: inline; } .sn_current_hours_resp[b-h85p0r54yf] { padding-left: 0px; margin-bottom: -15px; padding-top: 5px; } .sn_current_hours_resp ul[b-h85p0r54yf] { list-style: none; } .sn_current_hours_resp li[b-h85p0r54yf] { display: inline; } .sn_share_container[b-h85p0r54yf] { float: right; display: inline; font-size: 10px; } .sn_share_container ul[b-h85p0r54yf] { list-style: none; } .sn_share_container li[b-h85p0r54yf] { display: inline; } .sn_share_item[b-h85p0r54yf] { margin: 0; padding: 0; } .sn_share_label[b-h85p0r54yf] { top: 5px; display: inline; } .sn_share_item_icon[b-h85p0r54yf] { font-size: 15px; } .sn_share_item_button[b-h85p0r54yf] { border: none; background-color: transparent; width: 22px; } .sn_items_container[b-h85p0r54yf] { clear: left; margin-left: -15px; } .sn_items_container ul[b-h85p0r54yf] { list-style: none; } .sn_items_container li[b-h85p0r54yf] { display: inline; } .button_sn_item[b-h85p0r54yf] { font-size: 11px; clear: left; min-width: 150px; background-color: #323d49; color: #fff; font-weight: 100; border: solid 1px #323d49; border-radius: 4px; margin: 0 5px 0 0; } .sn_item_container[b-h85p0r54yf] { display: block; text-align: center; width: 100%; display: flex; justify-content: center; } .sn_item_icon[b-h85p0r54yf] { float: left; width: 20px; } .sn_item_label[b-h85p0r54yf] { float: left; display: inline; } .sn_dropdown[b-h85p0r54yf]{ padding-top: 5px; margin: 0 2px; } .sn_dropdown_item[b-h85p0r54yf] { padding-top: 7px; padding-bottom: 7px; } .sn_dropdown_item_icon[b-h85p0r54yf] { padding-right: 6px; } .sn_more_btn[b-h85p0r54yf] { font-size: x-small; min-height:30px; } .vdp-module-canvas-razor-wrapper .module[b-h85p0r54yf] { margin-top: 0; } .vdp__sticky-navigation__mod[b-h85p0r54yf] { padding-top: 5px; padding-bottom: 5px; margin-bottom: 10px; } .vdp__sticky-navigation__content[b-h85p0r54yf]{ max-width: 1500px; margin: auto; padding: 0; } .vdp-module-canvas-razor-wrapper .vdp__sticky-navigation__mod button.sn_more_btn[b-h85p0r54yf] { background: var(--color-theme-primary); color: var(--color-theme-text-btn); font-size: 1rem !important; border-color: var(--color-theme-primary); } [b-h85p0r54yf] .businessHours .sn_business_open { background-color: var(--inventorydetails-primary); } [b-h85p0r54yf] .businessHours .sn_business_close { background-color: var(--color-theme-secondary); } [b-h85p0r54yf] .businessHours .sn_business_open, [b-h85p0r54yf] .businessHours .sn_business_close { color: #FFFFFF; padding: 5px 10px; border-radius: 3px; display: inline; font-size: 10px; } [b-h85p0r54yf] .businessHours .store__hours { font-size: 12px; } @media (min-width: 992px) { .sn_dropdown_item_icon[b-h85p0r54yf] { padding-right: 10px; } .vdp__sticky-navigation__content[b-h85p0r54yf]{ padding-right: calc(var(--bs-gutter-x)* .5); padding-left: calc(var(--bs-gutter-x)* .5); } } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Display/VdpFtcPriceBreakdown.razor.rz.scp.css */ .vdp-ftc-breakdown[b-7t76lzxpse] { /* position+z-index lift the breakdown above any tenant ::after overlay on the parent .vdp__title__mod (e.g. PowerSports theme paints a z-index:1 dark overlay across the title block). Without this, real pointer clicks land on the overlay instead of the toggle button. */ position: relative; z-index: 2; /* Reset color so the breakdown body doesn't inherit the white text that tenant themes apply to .vdp__title__mod for overlay legibility. Inside the breakdown card we paint our own background, so we must paint our own text color. */ color: var(--inventorydetails-text); margin-top: 0px; margin-bottom: 20px; } .vdp-ftc-breakdown-toggle[b-7t76lzxpse] { width: 100%; background: var(--inventorydetails-background); border: 1px solid var(--inventorydetails-border); border-radius: 4px; padding: 14px; font-size: 14px; color: var(--inventorydetails-text); font-weight: 600; cursor: pointer; display: flex; align-items: center; justify-content: space-between; user-select: none; text-align: left; } .breakdown-arrow[b-7t76lzxpse] { transition: transform 0.2s; display: inline-block; } .breakdown-arrow.open[b-7t76lzxpse] { transform: rotate(180deg); } .vdp-ftc-breakdown-body[b-7t76lzxpse] { padding: 20px; background: var(--inventorydetails-background); border: 1px solid var(--inventorydetails-border); border-top: none; border-radius: 0 0 4px 4px; margin-top: -1px; color: var(--inventorydetails-text); } .vdp-ftc-breakdown-body .bd-row[b-7t76lzxpse] { display: flex; justify-content: space-between; font-size: 14px; padding: 5px 0; border-bottom: 1px dotted var(--inventorydetails-border); } .vdp-ftc-breakdown-body .bd-row:last-of-type[b-7t76lzxpse], .vdp-ftc-breakdown-body .bd-row:has(+ .bd-total)[b-7t76lzxpse] { border-bottom: none; } .vdp-ftc-breakdown-body .bd-row.bd-total[b-7t76lzxpse] { font-weight: 700; font-size: 1rem; border-top: 1px solid var(--inventorydetails-border); border-bottom: none; margin-top: 2px; padding-top: 5px; } .vdp-ftc-breakdown-body .bd-row.dp-row[b-7t76lzxpse] { font-style: italic; padding-top: 6px; margin-top: 4px; } .vdp-ftc-breakdown-body .bd-row .bd-strike[b-7t76lzxpse] { text-decoration: line-through; opacity: 0.7; } .bd-disclaimer-line[b-7t76lzxpse] { font-size: 10px; color: var(--inventorydetails-text); opacity: 0.7; font-style: italic; } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Display/VdpFtcPriceHeadline.razor.rz.scp.css */ .veh__price__block[b-rpx6l4jq80] { margin-bottom: 0.75rem; } .price-allin-label[b-rpx6l4jq80] { font-size: 12px; font-weight: 700; margin-bottom: 5px; } .price-allin-value[b-rpx6l4jq80] { /* No explicit color — inherit from .vdp__title__mod cascade so tenant themes (e.g. PowerSports paints white text over its dark overlay) remain readable. Hardcoded dark text was unreadable on dark overlays. */ font-size: 2.125rem; font-weight: 900; line-height: 1; } .price-allin-value sup[b-rpx6l4jq80] { font-size: 0.5em; top: -0.6em; margin-right: 0.1em; } .price-special-inline[b-rpx6l4jq80] { font-size: 0.8125rem; margin-top: 0.5rem; line-height: 1.3; opacity: 0.85; } .price-special-inline .veh-strike[b-rpx6l4jq80] { text-decoration: line-through; margin-left: 0.375rem; opacity: 0.7; } .price-special-inline .special-val[b-rpx6l4jq80] { font-weight: 700; margin-left: 0.5rem; } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Display/VehicleHeading.razor.rz.scp.css */ .vdp__title__mod .vdp__title__mod .veh__title[VehicleHeadingWidgetCssScope] { color: var(--inventorydetails-text); } .vdp__title__mod .veh__price[VehicleHeadingWidgetCssScope] { font-family: var(--primary-font-family), sans-serif; color: var(--inventorydetails-primary); } .vdp__title__mod .veh__mileage[VehicleHeadingWidgetCssScope] { color: var(--inventorydetails-text); } .vdp__title__mod .veh__title[VehicleHeadingWidgetCssScope] { font-size: 2rem; font-weight: bold; margin-bottom: 0; } .vdp__title__mod .veh__trim[VehicleHeadingWidgetCssScope] { font-size: 1.25rem; margin-bottom: 5px; } .vdp__title__mod .veh__generation[VehicleHeadingWidgetCssScope] { margin-bottom: 10px; } .vdp__title__mod .veh__price__mileage__wrapper[VehicleHeadingWidgetCssScope] { margin-bottom: 10px; } .vdp__title__mod .veh__price__mileage__wrapper .veh__price[VehicleHeadingWidgetCssScope] { font-size: 34px; font-weight: bold; line-height: normal; } .vdp__title__mod .veh__price__mileage__wrapper .veh__special__price[VehicleHeadingWidgetCssScope] { text-decoration: line-through; font-weight: bold; } .vdp__title__mod .veh__price__mileage__wrapper .veh__price sup[VehicleHeadingWidgetCssScope] { font-size: 0.5em; top: -10px; padding-left: unset !important; } .vdp__title__mod .veh__price__mileage__wrapper .veh__mileage .mileage__value[VehicleHeadingWidgetCssScope] { font-size: 20px; font-weight: 700; } .vdp__title__mod .veh__price__mileage__wrapper .spacer[VehicleHeadingWidgetCssScope] { padding: 0 10px; } .hover-pointer[VehicleHeadingWidgetCssScope]{ cursor: pointer; } @media (max-width: 576px) { .vdp__title__mod .badges__wrapper[VehicleHeadingWidgetCssScope] { font-size: 12px; } } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Display/VehicleInfo.razor.rz.scp.css */ .star-crash[VehicleInfoWidgetCssScope] { color: #FFC109; } .star-crash i[VehicleInfoWidgetCssScope] { padding-right: 2px; } .features-max-lines[VehicleInfoWidgetCssScope] { display: block; /* or inline-block */ text-overflow: ellipsis; word-wrap: break-word; overflow: hidden; max-height: 32em; } /* Vehicle Title Module =================================================================================================*/ .vdp__title__mod .vdp__title__mod .veh__title[VehicleInfoWidgetCssScope] { color: var(--inventorydetails-text); } .vdp__title__mod .veh__price[VehicleInfoWidgetCssScope] { color: var(--inventorydetails-primary); } .vdp__title__mod .veh__mileage[VehicleInfoWidgetCssScope] { color: var(--inventorydetails-text); } .vdp__title__mod .veh__title[VehicleInfoWidgetCssScope] { font-size: 2.25rem; font-weight: bold; margin-bottom: 0; } .vdp__title__mod .veh__trim[VehicleInfoWidgetCssScope] { font-size: 1.25rem; font-weight: 400; margin-bottom: 5px; } .vdp__title__mod .veh__generation[VehicleInfoWidgetCssScope] { margin-bottom: 10px; } .vdp__title__mod .veh__price__mileage__wrapper[VehicleInfoWidgetCssScope] { margin-bottom: 10px; } .vdp__title__mod .veh__price__mileage__wrapper .veh__price[VehicleInfoWidgetCssScope] { font-size: 34px; font-weight: bold; line-height: normal; } .vdp__title__mod .veh__price__mileage__wrapper .veh__price sup[VehicleInfoWidgetCssScope] { font-size: 0.5em; top: -10px; } .vdp__title__mod .veh__price__mileage__wrapper .veh__mileage .mileage__value[VehicleInfoWidgetCssScope] { font-size: 20px; font-weight: 700; } .vdp__title__mod .veh__price__mileage__wrapper .spacer[VehicleInfoWidgetCssScope] { padding: 0 10px; } /* Vehicle Info Module =================================================================================================*/ .veh__info__item[VehicleInfoWidgetCssScope] { padding: 15px 20px; } .veh__info__item:nth-child(even)[VehicleInfoWidgetCssScope] { background-color: #fafafa; } .veh__info__item .info__label[VehicleInfoWidgetCssScope] { margin-right: 5px; } .veh__info__item .info__data[VehicleInfoWidgetCssScope] { font-weight: bold; max-width: 325px; } .veh__features__mod ul[VehicleInfoWidgetCssScope] { padding-left: 1em; } .veh__features__mod ul > li[VehicleInfoWidgetCssScope] { margin-bottom: 10px; } /* Standard Specs Module =================================================================================================*/ .vdp__standardSpecs__content span[VehicleInfoWidgetCssScope] { font-weight: bold; } /* Vehicle Description Module =================================================================================================*/ .vdp__desc__mod .desc__content .veh__desc[VehicleInfoWidgetCssScope] { line-height: 2em; margin-bottom: 10px; } .vdp__desc__mod .desc__content .veh__desc .veh__desc__moreless__btn[VehicleInfoWidgetCssScope] { cursor: pointer; } /* Vehicle Features Module =================================================================================================*/ .vdp__features__mod ul[VehicleInfoWidgetCssScope] { padding-left: 1em; } .vdp__features__mod .features__content .veh__features[VehicleInfoWidgetCssScope] { margin-bottom: 20px; } .vdp__features__mod ul > li[VehicleInfoWidgetCssScope] { margin-bottom: 10px; } .vdp__features__mod .veh__feature__group__title[VehicleInfoWidgetCssScope] { font-weight: 700; margin-bottom: 0.5rem; } .vdp__features__mod .features__content .veh__features .veh__features__moreless__btn[VehicleInfoWidgetCssScope] { cursor: pointer; } /* EPA Green Scores Module =================================================================================================*/ .vdp__greenScores__mod .greenScores__content span[VehicleInfoWidgetCssScope] { font-weight: bold; } /* Vehicle Info Module =================================================================================================*/ .vdp__veh__info__mod .veh__info__item[VehicleInfoWidgetCssScope] { padding: 15px 20px; } .vdp__veh__info__mod .veh__info__item:nth-child(even)[VehicleInfoWidgetCssScope] { background-color: #fafafa; } .vdp__veh__info__mod .veh__info__item .info__data[VehicleInfoWidgetCssScope] { font-weight: bold; } /* Warranty Module =================================================================================================*/ [VehicleInfoWidgetCssScope] .vdp__warranty__mod .warranty__content .warranty__item { padding: 15px 0; border-bottom: 2px dotted var(--inventorydetails-border); } /* Installed Optional Features Module =================================================================================================*/ .vdp__optFeatures__mod .optFeatures__content .optFeatures__total[VehicleInfoWidgetCssScope] { color: var(--inventorydetails-primary); font-size: 20px; font-weight: bold; } /* Awards Module =================================================================================================*/ .vdp__awards__mod .awards__content .awards__link[VehicleInfoWidgetCssScope] { } /* Added Features Module =================================================================================================*/ .vdp__addedFeatures__content span[VehicleInfoWidgetCssScope] { font-weight: bold; } @media(min-width: 300px) { .vdp__title__mod .badges__wrapper[VehicleInfoWidgetCssScope] { font-size: 12px; } .engine__content ul[VehicleInfoWidgetCssScope], .standardSpecs__content ul[VehicleInfoWidgetCssScope], .crashRatings__content ul[VehicleInfoWidgetCssScope], .awards__content ul[VehicleInfoWidgetCssScope], .greenScores__content ul[VehicleInfoWidgetCssScope], .addedFeatures__content ul[VehicleInfoWidgetCssScope], .safetyEquipment__content ul[VehicleInfoWidgetCssScope] { -webkit-column-count: 1; column-count: 1; } } @media(min-width: 768px) { .vdp__two__column[VehicleInfoWidgetCssScope] { columns: 2; } .vdp__three__column[VehicleInfoWidgetCssScope] { columns: 3; } .engine__content ul[VehicleInfoWidgetCssScope], .standardSpecs__content ul[VehicleInfoWidgetCssScope], .crashRatings__content ul[VehicleInfoWidgetCssScope], .awards__content ul[VehicleInfoWidgetCssScope], .greenScores__content ul[VehicleInfoWidgetCssScope], .addedFeatures__content ul[VehicleInfoWidgetCssScope], .safetyEquipment__content ul[VehicleInfoWidgetCssScope] { -webkit-column-count: 3; column-count: 3; display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px; } .engine__content ul li[VehicleInfoWidgetCssScope], .standardSpecs__content ul li[VehicleInfoWidgetCssScope], .crashRatings__content ul li[VehicleInfoWidgetCssScope], .awards__content ul li[VehicleInfoWidgetCssScope], .greenScores__content ul li[VehicleInfoWidgetCssScope], .addedFeatures__content ul li[VehicleInfoWidgetCssScope], .safetyEquipment__content ul li[VehicleInfoWidgetCssScope], .vdp__three__column li[VehicleInfoWidgetCssScope] { margin-right: 20px; } } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Display/VehicleInfoSections/Description.razor.rz.scp.css */ .veh__desc[b-8lnpe8ebv0] { white-space: pre-wrap; } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Display/VideoContactModal.razor.rz.scp.css */ .vcm-modal__body[b-dkvpaagrgt] { display: flex; flex-direction: column; gap: 1.5rem; } .vcm-modal__video[b-dkvpaagrgt] { flex: 0 0 auto; } /* The room below the header belongs to the column, not the form title: a form built without a title starts with its first field, and still needs the space. */ .vcm-modal__form[b-dkvpaagrgt] { flex: 1 1 auto; padding-top: 20px; text-align: left; } .vcm-modal__form[b-dkvpaagrgt] label { text-align: left; } @media (min-width: 992px) { /* The body fills the space under the header and never scrolls itself: the form column takes that height and scrolls inside it, so there is one scrollbar whatever the header's height or the browser zoom (TP 154261). */ .vcm-modal[b-dkvpaagrgt] .modal-fullscreen .modal-content { height: 100%; } .vcm-modal[b-dkvpaagrgt] .modal-fullscreen .modal-body { display: flex; flex-direction: column; min-height: 0; overflow: hidden; } .vcm-modal__body[b-dkvpaagrgt] { --vcm-media-max-height: calc(100vh - 8rem - 60px); flex: 1 1 auto; flex-direction: row; min-height: 0; } /* The video sits at the top of its column, so it stays beside the start of a long form; in the SiteBuilder designer the frame is as tall as the page and a centred video ended up far down the form (TP 154265). */ .vcm-modal__video[b-dkvpaagrgt] { display: flex; flex-direction: column; flex: 0 0 66.666%; max-width: 66.666%; min-height: 0; } /* The column is as tall as the body; the video starts at its top and shrinks rather than run past it. */ .vcm-modal__player--sized[b-dkvpaagrgt] { flex: 0 1 auto; min-height: 0; } .vcm-modal__form[b-dkvpaagrgt] { flex: 1 1 33.333%; min-height: 0; overflow-y: auto; /* forms.css gives the form's grid rows negative side margins; without this the column scrolls sideways. */ overflow-x: hidden; } .vcm-modal__body--form-only .vcm-modal__form[b-dkvpaagrgt] { flex-basis: 100%; max-width: 100%; } } .vcm-modal__player[b-dkvpaagrgt] { position: relative; width: 100%; background: #000; } .vcm-modal__player .media-video-poster[b-dkvpaagrgt] { display: block; width: 100%; height: auto; max-height: var(--vcm-media-max-height, calc(100vh - 8rem)); object-fit: contain; } /* The player element exists only while playing (media-player.js toggles media-video-playing; TenantSite global.css hides it otherwise). Say so here too, so the poster + badge return after "ended" in any host. */ .vcm-modal__player[b-dkvpaagrgt] .media-video-player { display: none; width: 100%; height: auto; max-height: var(--vcm-media-max-height, calc(100vh - 8rem)); } .vcm-modal__player.media-video-playing[b-dkvpaagrgt] .media-video-player { display: block; } /* Ratio known (gallery width/height): the container owns the box before the poster loads, so opening the modal does not shift the form, and portrait clips letterbox inside it instead of stretching. */ .vcm-modal__player--sized[b-dkvpaagrgt] { max-height: var(--vcm-media-max-height, calc(100vh - 8rem)); } .vcm-modal__player--sized .media-video-poster[b-dkvpaagrgt], .vcm-modal__player--sized[b-dkvpaagrgt] .media-video-player { position: absolute; inset: 0; width: 100%; height: 100%; max-height: none; object-fit: contain; } /* Same centering as TenantSite global.css: that sheet also styles this class and adds the translate, so a second technique here (inset + margin) would double up and push the badge off centre. */ .vcm-modal__player .media-video-play-badge[b-dkvpaagrgt] { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 5rem; height: 5rem; padding: 0; border: 0; background: transparent; color: #fff; font-size: 5rem; line-height: 1; cursor: pointer; filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .5)); } .vcm-modal__player.media-video-playing .media-video-poster[b-dkvpaagrgt], .vcm-modal__player.media-video-playing .media-video-play-badge[b-dkvpaagrgt] { display: none; } /* The dialog's look, from the design. Sticky Navigation and Quick Connect restyle any modal opened inside them through their own scoped sheets (a 2em title, the form's own heading hidden). These rules are anchored on .vcm-modal so they outrank those and the modal looks the same in all three hosts. */ .vcm-modal[b-dkvpaagrgt] .modal-content { background: #fff; color: #000; border-color: #fff; } .vcm-modal[b-dkvpaagrgt] .modal-header { border-bottom: 1px solid lightgray; margin: 0 1em; padding: 1em 0; } .vcm-modal[b-dkvpaagrgt] h5.modal-title { color: #000; font-size: 20px; font-weight: 700; } /* Dealer phone at the header's right, before the close control. */ .vcm-modal[b-dkvpaagrgt] .modal-header .vcm-modal__phone { margin-left: auto; margin-right: 1rem; color: #000; font-weight: 700; white-space: nowrap; text-decoration: none; } .vcm-modal[b-dkvpaagrgt] .modal-header .vcm-modal__phone:hover, .vcm-modal[b-dkvpaagrgt] .modal-header .vcm-modal__phone:focus-visible { text-decoration: underline; } .vcm-modal[b-dkvpaagrgt] .modal-header .close { color: #000; opacity: 1; } .vcm-modal[b-dkvpaagrgt] .modal-body { padding-top: 0; } .vcm-modal[b-dkvpaagrgt] .form-forms-header { display: block; margin-top: 0; color: #000; font-size: 19px; font-weight: 700; text-align: left; } /* Same as FormModal.razor.css: forms.css colours the sent message with var(--forms-titles), which the site theme can leave white, and the modal is white. Pin it so "Thanks! Your form has been sent" is readable. */ .vcm-modal[b-dkvpaagrgt] .form-sent-message { color: #000000; } /* Below desktop the dialog keeps the inset and rounded corners the site's other form modals get from Bootstrap 5.1's modal-dialog: .5rem on phones, 1.75rem from 576px, .3rem corners, instead of filling the screen edge to edge. */ @media (max-width: 991.98px) { .vcm-modal[b-dkvpaagrgt] .modal-dialog.modal-fullscreen { --vcm-dialog-margin: .5rem; width: calc(100% - 2 * var(--vcm-dialog-margin)); max-width: none; height: calc(100% - 2 * var(--vcm-dialog-margin)); margin: var(--vcm-dialog-margin); } .vcm-modal[b-dkvpaagrgt] .modal-fullscreen .modal-content { border-radius: .3rem; } } @media (min-width: 576px) and (max-width: 991.98px) { .vcm-modal[b-dkvpaagrgt] .modal-dialog.modal-fullscreen { --vcm-dialog-margin: 1.75rem; } } @media (min-width: 992px) { .vcm-modal[b-dkvpaagrgt] .modal-dialog.modal-fullscreen { width: calc(100vw - 60px); max-width: none; height: calc(100vh - 60px); margin: 30px; } .vcm-modal[b-dkvpaagrgt] .modal-fullscreen .modal-content { border-radius: 6px; } } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Editor/CodeYourOwn.razor.rz.scp.css */ /* **** IMPORTANT NOTE **** This file was left blank intentionally, Blazor CSS Isolation is being used, refer to the Display folder for the component stylesheet =================================================================================================*/ /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Editor/ConnectWithUs.razor.rz.scp.css */ /* **** IMPORTANT NOTE **** This file was left blank intentionally, Blazor CSS Isolation is being used, refer to the Display folder for the component stylesheet =================================================================================================*/ /* March 03 2025 This file is not blank anymore but that's ok. Style below is for the message us form new layout for the VDP Enhancement project. */ [ConnectWithUsWidgetCssScope].vdp-editor-overlay .layoutOne textarea { padding: 0.7em 0.8em !important; min-height: 110px !important; } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Editor/CreditQualifyBanner.razor.rz.scp.css */ /* **** IMPORTANT NOTE **** This file was left blank intentionally, Blazor CSS Isolation is being used, refer to the Display folder for the component stylesheet =================================================================================================*/ /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Editor/CreditQualifyForm.razor.rz.scp.css */ /* **** IMPORTANT NOTE **** This file was left blank intentionally, Blazor CSS Isolation is being used, refer to the Display folder for the component stylesheet =================================================================================================*/ /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Editor/DealershipInfo.razor.rz.scp.css */ /* **** IMPORTANT NOTE **** This file was left blank intentionally, Blazor CSS Isolation is being used, refer to the Display folder for the component stylesheet =================================================================================================*/ /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Editor/LoanCalculator.razor.rz.scp.css */ /* **** IMPORTANT NOTE **** This file was left blank intentionally, Blazor CSS Isolation is being used, refer to the Display folder for the component stylesheet =================================================================================================*/ /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Editor/PhotoGallery.razor.rz.scp.css */ /* **** IMPORTANT NOTE **** This file was left blank intentionally, Blazor CSS Isolation is being used, refer to the Display folder for the component stylesheet =================================================================================================*/ /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Editor/PhotoGalleryLayouts/Layout1/Layout1.razor.rz.scp.css */ .vdp__photoGrid.photo__grid1[PhotoGalleryWidgetCssScope] { display: flex; } @media (max-width: 450px) { .vdp__photoGrid.photo__grid1 .photo__item .photo__thumbnail[PhotoGalleryWidgetCssScope] { max-height: auto; min-height: auto; } /* Must stay scoped to .img__photo -- a bare `img` would also match .img__photo__backdrop. See TP 152875, the same selector broke the lead photo in Layout 2. */ .vdp__photoGrid.photo__grid1 .photo__item .photo__thumbnail img.img__photo[PhotoGalleryWidgetCssScope] { position: relative; } } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Editor/PhotoGalleryLayouts/Layout2/Layout2.razor.rz.scp.css */ /* **** IMPORTANT NOTE **** This file was left blank intentionally, Blazor CSS Isolation is being used, refer to the Display folder for the component stylesheet =================================================================================================*/ /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Editor/PhotoGalleryLayouts/Layout3/Layout3.razor.rz.scp.css */ /* **** IMPORTANT NOTE **** This file was left blank intentionally, Blazor CSS Isolation is being used, refer to the Display folder for the component stylesheet =================================================================================================*/ /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Editor/PhotoGalleryLayouts/Layout4/Layout4.razor.rz.scp.css */ /* **** IMPORTANT NOTE **** This file was left blank intentionally, Blazor CSS Isolation is being used, refer to the Display folder for the component stylesheet =================================================================================================*/ /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Editor/PhotoGalleryLayouts/Shared/ImagePlaceholder.razor.rz.scp.css */ /* **** IMPORTANT NOTE **** This file was left blank intentionally, Blazor CSS Isolation is being used, refer to the Display folder for the component stylesheet =================================================================================================*/ /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Editor/PhotoGalleryLayouts/Shared/Modal.razor.rz.scp.css */ .photos__wrapper[b-vhvgl9ewlq] { max-width: 1000px; -webkit-filter: drop-shadow(0 2px 35px rgba(0, 0, 0, 0.1)); filter: drop-shadow(0 2px 35px rgba(0, 0, 0, 0.1)); background-color: #f9f9f9; padding: 50px; } .photos__wrapper img[b-vhvgl9ewlq] { margin-bottom: 20px; width: 100%; border-radius: 6px; } .modal[b-vhvgl9ewlq] { z-index: 50000; } .modal-content[b-vhvgl9ewlq] { color: #fff; border-color: var(--inventorydetails-border); } .modal-title[b-vhvgl9ewlq] { color: #333; white-space: normal; word-break: break-word; font-size: 1.75em; } .photo__count[b-vhvgl9ewlq] { font-size: 1rem; } .modal-header[b-vhvgl9ewlq] { border-bottom: 1px solid var(--inventorydetails-border); padding: 25px; } .modal-header .close[b-vhvgl9ewlq] { color: #fff; opacity: 1; } .modal-header .close:hover[b-vhvgl9ewlq], .modal-header .close:focus[b-vhvgl9ewlq], .modal-header .close:active[b-vhvgl9ewlq] { color: #fff; opacity: 0.7; } .modal-header .close-btn[b-vhvgl9ewlq] { float: none; position: absolute; top: 3px; right: 3px; z-index: 9; font-size: 25px; line-height: 40px; border-radius: 40px; padding: 0; } .modal-header .close-btn span[b-vhvgl9ewlq] { margin: 0; height: 40px; width: 40px; display: block; } .modal-header .close-btn:hover[b-vhvgl9ewlq], .modal-header .close-btn:focus[b-vhvgl9ewlq], .modal-header .close-btn:active[b-vhvgl9ewlq], .modal-header .close.close-btn:focus[b-vhvgl9ewlq], .modal-header .close.close-btn:hover[b-vhvgl9ewlq] { opacity: 1; } .modal-header .close:not(.close-btn)[b-vhvgl9ewlq] { font-size: 1.5em; margin-top: -1rem; padding: 12px 15px; } .close[b-vhvgl9ewlq], .modal-header .close-btn[b-vhvgl9ewlq], .modal-header .close:not(.close-btn)[b-vhvgl9ewlq], .product-remove[b-vhvgl9ewlq] { font-family: Arial, sans-serif !important; font-weight: 700 !important; } @media (max-width: 767px) { .modal-title[b-vhvgl9ewlq] { font-size: 1em; } .photo__count[b-vhvgl9ewlq] { font-size: 0.75rem; } } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Editor/PhotoGalleryLayouts/Shared/_ImageCard.razor.rz.scp.css */ /* **** IMPORTANT NOTE **** This file was left blank intentionally, Blazor CSS Isolation is being used, refer to the Display folder for the component stylesheet =================================================================================================*/ /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Editor/QuickConnect.razor.rz.scp.css */ .quickconnect_item[b-gscpdc4yvq] { width: 100%; height: 55px; } .quickconnect_button[b-gscpdc4yvq] { margin: auto; border: 1px solid #f2f2f2; text-align: center; padding: 8px; } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Editor/Section.razor.rz.scp.css */ .widget-section-placeholder[SectionWidgetCssScope]{ padding: 5em; text-align: center; border: 1px dashed #EBEBEB; margin: 1em; } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Editor/Staff.razor.rz.scp.css */ /* **** IMPORTANT NOTE **** This file was left blank intentionally, Blazor CSS Isolation is being used, refer to the Display folder for the component stylesheet =================================================================================================*/ /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Editor/StickyNavigation.razor.rz.scp.css */ /* .builder-canvas__sticky-container class is needed to keep the sticky navigation on the page when scrolling down on display */ /* The class is located in Chassis.UI.Common.ModuleBuilder.VDP/wwwroot/scss/global.scss */ .partial-opacity[b-bsfmvq1ue5] { opacity: 0.3; } .sticky-navigation-container .row[b-bsfmvq1ue5] { box-shadow: 0px 0px 15px #c1c1c1; } .sn_sub_title[b-bsfmvq1ue5] { font-size: 12px; } .sn_business_openclose[b-bsfmvq1ue5] { background: #556e77; color: #fff; font-size: 10px; padding: 5px 10px; border-radius: 3px; display: inline; } .sn_business_hours[b-bsfmvq1ue5] { font-size: 11px; margin-left: 5px; display: inline; } .sn_current_hours[b-bsfmvq1ue5] { display: inline; } .sn_current_hours ul[b-bsfmvq1ue5] { list-style: none; } .sn_current_hours li[b-bsfmvq1ue5] { display: inline; } .sn_share_container[b-bsfmvq1ue5] { float: right; display: inline; font-size: 10px; } .sn_share_item[b-bsfmvq1ue5] { margin: 0; padding: 0; } .sn_share_item_icon[b-bsfmvq1ue5] { font-size: 15px; } .sn_share_item_button[b-bsfmvq1ue5] { border: none; background-color: transparent; font-size: 18px; } .sn_title h4[b-bsfmvq1ue5] { font-size: 18px; font-weight: bold; } .button_sn_item[b-bsfmvq1ue5] { font-size: 13px; min-width: 150px; background-color: #323d49; color: #fff; font-weight: 100; border: solid 1px #323d49; border-radius: 4px; margin-bottom: 10px; } /*.sn_item_container {*/ /* display: block;*/ /* text-align: center;*/ /* width: 100%;*/ /* display: flex;*/ /* justify-content: center;*/ /*}*/ .sn_item_icon[b-bsfmvq1ue5] { width: 20px; } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Editor/VehicleHeading.razor.rz.scp.css */ /* **** IMPORTANT NOTE **** This file was left blank intentionally, Blazor CSS Isolation is being used, refer to the Display folder for the component stylesheet =================================================================================================*/ /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Editor/VehicleInfo.razor.rz.scp.css */ /* **** IMPORTANT NOTE **** This file was left blank intentionally, Blazor CSS Isolation is being used, refer to the Display folder for the component stylesheet =================================================================================================*/ /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/LeadFormModal.razor.rz.scp.css */ .photos__wrapper[b-m46mtfwf62] { max-width: 1000px; -webkit-filter: drop-shadow(0 2px 35px rgba(0, 0, 0, 0.1)); filter: drop-shadow(0 2px 35px rgba(0, 0, 0, 0.1)); background-color: #f9f9f9; padding: 50px; } .photos__wrapper img[b-m46mtfwf62] { margin-bottom: 20px; width: 100%; border-radius: 6px; } .modal[b-m46mtfwf62] { z-index: 50000; } .modal-content[b-m46mtfwf62] { color: #fff; background-color: white; border-color: var(--inventorydetails-border); } .modal-title[b-m46mtfwf62] { color: #333; white-space: normal; word-break: break-word; font-size: 1.75em; } .photo__count[b-m46mtfwf62] { font-size: 1rem; } .modal-header[b-m46mtfwf62] { border-bottom: 1px solid var(--inventorydetails-border); padding: 25px; } .modal-header .close[b-m46mtfwf62] { color: #fff; opacity: 1; } .modal-header .close:hover[b-m46mtfwf62], .modal-header .close:focus[b-m46mtfwf62], .modal-header .close:active[b-m46mtfwf62] { color: #fff; opacity: 0.7; } .modal-header .close-btn[b-m46mtfwf62] { float: none; position: absolute; top: 3px; right: 3px; z-index: 9; font-size: 25px; line-height: 40px; border-radius: 40px; padding: 0; } .modal-header .close-btn span[b-m46mtfwf62] { margin: 0; height: 40px; width: 40px; display: block; } .modal-header .close-btn:hover[b-m46mtfwf62], .modal-header .close-btn:focus[b-m46mtfwf62], .modal-header .close-btn:active[b-m46mtfwf62], .modal-header .close.close-btn:focus[b-m46mtfwf62], .modal-header .close.close-btn:hover[b-m46mtfwf62] { opacity: 1; } .modal-header .close:not(.close-btn)[b-m46mtfwf62] { font-size: 1.5em; margin-top: -1rem; padding: 12px 15px; } .close[b-m46mtfwf62], .modal-header .close-btn[b-m46mtfwf62], .modal-header .close:not(.close-btn)[b-m46mtfwf62], .product-remove[b-m46mtfwf62] { font-family: Arial, sans-serif !important; font-weight: 700 !important; } @media (max-width: 767px) { .modal-title[b-m46mtfwf62] { font-size: 1em; } .photo__count[b-m46mtfwf62] { font-size: 0.75rem; } } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Settings/QuickConnectSettings.razor.rz.scp.css */ .settings-title[QuickConnectSettingsCssScope] { font-size: 14px; } .fine-print[QuickConnectSettingsCssScope] { font-size: 10px; text-align: right; } .disabledLink[QuickConnectSettingsCssScope] { pointer-events: none; cursor: default; opacity: 0.6; } [QuickConnectSettingsCssScope] .qc-settings-order { padding: 1em; background-color: lightgray; } .red[QuickConnectSettingsCssScope] { color: darkred; } .item_warning[QuickConnectSettingsCssScope] { margin-left: auto; margin-right: 10px; } [QuickConnectSettingsCssScope] .spinner { left: 35% !important; } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Settings/StickyNavigationSettings.razor.rz.scp.css */ [b-6v3t90cpnz] .option-card { background-color: white; border-radius: 5px; } [b-6v3t90cpnz] .checkbox__label { font-size: 13px; } [b-6v3t90cpnz] .sn-settings-order { padding: 1em; background-color: var(--misty-color); } .settings-title[b-6v3t90cpnz] { font-size: 14px; } .fine-print[b-6v3t90cpnz] { font-size: 9px; text-align: right; } .button-color-options[b-6v3t90cpnz] { font-size: 18px; } .form-group[b-6v3t90cpnz] { display: flex; flex-direction: row; align-items: flex-start; justify-content: left; } .row[b-6v3t90cpnz] { clear: left; font-size: 12px; } .form-title[b-6v3t90cpnz] { font-size: 12px; font-weight: 600; } .icon-picker[b-6v3t90cpnz] { overflow-y: scroll; overflow-x: hidden; width: 210px; height: 210px; } .disabledLink[b-6v3t90cpnz] { pointer-events: none; cursor: default; opacity: 0.6; } .button-color-options[b-6v3t90cpnz] { margin: 0; } .button-color-options ul[b-6v3t90cpnz] { list-style: none; padding: 0; margin: 0; } .button-color-options li[b-6v3t90cpnz] { display: inline; float: left; padding: 0 15px 0 0; margin: 0; } .button-color-options li label[b-6v3t90cpnz] { font-size: 12px; } .red[b-6v3t90cpnz] { color: darkred; } .item_warning[b-6v3t90cpnz] { margin-left: auto; margin-right: 10px; } [b-6v3t90cpnz] .spinner{ left: 35%!important; } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Settings/TemplateComponents/CtaItemEditor.razor.rz.scp.css */ .settings-title[b-zaz43qvbsa] { font-size: 14px; } .instructions-class[b-zaz43qvbsa] { font-size: 11px; line-height: 11px; } /* Inline radio layout (Sticky Navigation) */ .button-color-options[b-zaz43qvbsa] { font-size: 18px; margin: 0; } .button-color-options ul[b-zaz43qvbsa] { list-style: none; padding: 0; margin: 0; } .button-color-options li[b-zaz43qvbsa] { display: inline; float: left; padding: 0 15px 0 0; margin: 0; } .button-color-options li label[b-zaz43qvbsa] { font-size: 12px; } .cta-editor-row-inline[b-zaz43qvbsa] { clear: left; font-size: 12px; } /* Icon picker (identical in both parents) */ .setting-icon-picker i[b-zaz43qvbsa] { width: 45px; height: 45px; text-align: center; cursor: pointer; transition: .25s; } .setting-icon-picker i:hover[b-zaz43qvbsa] { transform: scale(1.2); } .selected-icon[b-zaz43qvbsa] { background: rgba(0, 175, 170, .35); } /* _content/Chassis.UI.Common.ModuleBuilder.Widgets/Components/Settings/TemplateComponents/CtaVideoField.razor.rz.scp.css */ /* Upload a Video is the full-width tile; Select from Media Library sits below it. */ .cta-video-field__actions[b-i1fdkvsw5m] { display: flex; flex-direction: column; gap: 8px; } .cta-video-field__upload[b-i1fdkvsw5m] { position: relative; overflow: hidden; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; padding: 18px 12px; border: 2px dashed #cfd4d9; border-radius: 4px; background: #fff; color: #00afaa; font-size: 13px; font-weight: 700; cursor: pointer; } .cta-video-field__upload i[b-i1fdkvsw5m] { font-size: 20px; margin-bottom: 5px; } /* Busy: the button keeps full colour and shows the spinner, status and a thin progress bar along its bottom edge. */ .cta-video-field__upload.is-busy:disabled[b-i1fdkvsw5m] { opacity: 1; cursor: progress; } .cta-video-field__upload.is-busy i[b-i1fdkvsw5m] { font-size: 18px; } .cta-video-field__bar[b-i1fdkvsw5m] { position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: #e3e6e8; } .cta-video-field__bar-fill[b-i1fdkvsw5m] { display: block; height: 100%; background: #00afaa; transition: width .2s ease; } .cta-video-field__upload-name[b-i1fdkvsw5m] { margin-top: 6px; font-size: 12px; color: #6c757d; word-break: break-all; } .cta-video-field__error[b-i1fdkvsw5m] { margin-top: 6px; font-size: 12px; color: #c0392b; } .cta-video-field__pick[b-i1fdkvsw5m] { display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 100%; padding: 11px 12px; border: 1px solid #cfd4d9; background: #fff; color: #333; font-size: 13.5px; font-weight: 700; cursor: pointer; } .cta-video-field__upload:disabled[b-i1fdkvsw5m], .cta-video-field__pick:disabled[b-i1fdkvsw5m] { opacity: .5; cursor: not-allowed; } .cta-video-field__attached[b-i1fdkvsw5m] { display: flex; gap: 12px; align-items: center; padding: 10px; border: 1px solid #e3e6e8; } .cta-video-field__thumb[b-i1fdkvsw5m] { position: relative; flex: 0 0 92px; width: 92px; height: 52px; background: #000; overflow: hidden; } .cta-video-field__thumb img[b-i1fdkvsw5m] { width: 100%; height: 100%; object-fit: cover; } .cta-video-field__thumb i[b-i1fdkvsw5m] { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #fff; font-size: 14px; text-shadow: 0 1px 4px rgba(0, 0, 0, .6); } .cta-video-field__meta[b-i1fdkvsw5m] { min-width: 0; flex: 1 1 auto; } .cta-video-field__name[b-i1fdkvsw5m] { font-size: 13px; font-weight: 700; word-break: break-all; } .cta-video-field__source[b-i1fdkvsw5m] { font-size: 11.5px; color: #6c757d; } .cta-video-field__remove[b-i1fdkvsw5m] { flex: 0 0 auto; padding: 4px; border: 0; background: transparent; color: #6c757d; cursor: pointer; }