/**
 * Color classes and default styling are in /assets/main.css, focus your efforts there
 * @import external fonts at top of this page before default.css
 * remove comment for dark-mode.css if you want to enable that -- will not be 100%, you will need to fix minor things
 */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
@import url("./assets/default-settings.css");
/** @import url("assets/dark-mode.css"); */

a { color: rgb(var(--bs-dark-rgb)); text-decoration: none; }
a:hover { text-decoration: underline; }
.bg-opacity-85 { --bs-bg-opacity: 0.85; }
#breadcrumbs { padding: .5rem 0 1.5rem; }
.wp-block-quote { padding: 0.625rem 0.75rem; border-left: 5px solid #eee; }
.bg-1e3875 { color: #fff; background-color: #1e3875; }
.bg-edf4fa { color: rgb(var(--bs-body-color)); background-color: #edf4fa; }
.bg-ebebeb { color: rgb(var(--bs-body-color)); background-color: #ebebeb; }
p:empty { padding: 0; margin: 0; }

/** buttons */
.btn { border-radius: 0; text-transform: uppercase; --bs-btn-font-size: 1.25rem; --bs-btn-font-weight: 400; text-underline-offset: 5px; }
.btn-sm { --bs-btn-padding-x: 1em; }
.btn-dark:active, .btn-dark:hover, .btn-dark:focus { background: rgb(var(--bs-light-rgb)) !important; border: 1px solid rgb(var(--bs-light-rgb)); color: rgb(var(--bs-dark-rgb)) !important; }
.btn-light:active, .btn-light:hover, .btn-light:focus { background: rgb(var(--bs-dark-rgb)) !important; border: 1px solid rgb(var(--bs-dark-rgb)); color: rgb(var(--bs-light-rgb)) !important; }
.btn-primary:active, .btn-primary:hover, .btn-primary:focus { background: rgb(var(--bs-white-rgb)) !important; border: 1px solid rgb(var(--bs-white-rgb)); color: rgb(var(--bs-dark-rgb)) !important; }
.btn.bg-white { background: transparent !important; border: 1px solid rgb(var(--bs-white-rgb)); color: rgb(var(--bs-light-rgb)) !important; text-transform: none; }
.btn.bg-white:active, .btn.bg-white:hover, .btn.bg-white:focus { background: rgb(var(--bs-white-rgb)) !important; border: 1px solid rgb(var(--bs-white-rgb)); color: rgb(var(--bs-dark-rgb)) !important; }

/** header */
#header-search .input-group { box-shadow: 2px 2px 4px #000; border-radius: var(--bs-border-radius); }
#block-3 .container .row > div:last-of-type { font-size: 1rem !important; }

/* mega-menu */
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-current-menu-ancestor > a.mega-menu-link { font-weight: 500; color: #003876; }
a.mega-menu-link:focus, a.mega-menu-link:focus-visible, a.mega-menu-link:focus-within, .mega-menu-link span:focus, .mega-menu-link span:focus-visible, .mega-menu-link span:focus-within { outline-style: solid !important; outline-width: 2px !important; outline-color: #003876 !important; outline-offset: 2px !important; }
#mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-current-menu-item > a.mega-menu-link, #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-current-menu-ancestor > a.mega-menu-link, #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item.mega-current-page-ancestor > a.mega-menu-link { color: #2873AF; }

/** carousel */
body:not(.home) #content .jwbs-banner { margin-bottom: 1rem; }
.carousel-caption { display: flex !important; flex-direction: column; justify-content: center; height: 100%; bottom: 0; }
.carousel-caption .container > * { max-width: 75%; }
.carousel-caption .container h2, .carousel-caption p { padding-left: 2rem; }

/** cards */
.card { border-radius: 0; }

/** gallery */
.wp-block-gallery.has-nested-images.text-center figure.wp-block-image img{ display: inline-block; }
.wp-block-gallery.has-nested-images.text-center figure.wp-block-image figcaption { background: none; position: relative; font-size: 1.1rem; font-weight: 300; overflow: visible; }
figure:has( > a):hover > * { filter: drop-shadow(0 0 0 #ffffff); cursor: pointer; }

/** eye-doctors */
.eye-doctors-template-default .post-content { margin-top: 1rem; }
.margin-image img { margin-right: 1rem; }

/** footer */
footer h1, footer h2, footer h3, footer h4, footer h5, footer h6, footer .h1, footer .h2, footer .h3, footer .h4, footer .h5, footer .h6 { font-weight: 700; }

/** testimonials */
.testimonial_stars svg { color: #FFD700; }

/* eyeglasses */
#eyeglass-cta { position: relative; }
#eyeglass-cta .image { position: absolute; top: 0; right: 50%; bottom: 0; left: 0; background: url('/wp-content/uploads/2018/08/eyecare-ls-eyeglasses.jpg') no-repeat 50% 30%; background-size: cover; }

/** blog **/
.blog #sidebar-default { padding-top: 5.5rem !important; }
.blog h3.card-title, .archive h3.card-title, .single h3.card-title { font-weight: 700; }
.blog .card-title a, .archive .card-title a, .single .card-title a { color: rgb(var(--bs-dark-rgb)); }
.blog .meta a, .archive .meta a, .single .meta a { color: rgb(var(--bs-primary-rgb)); }
.blog .card-title a, .blog .meta a, .archive .card-title a, .archive .meta a, .single .card-title a, .single .meta a { text-decoration: none; }
.blog .card-title a:hover, .blog .meta a:hover, .archive .card-title a:hover, .archive .meta a:hover, .single .card-title a:hover, .single .meta a:hover { text-decoration: underline; }
.blog #sidebar-default :not(.widget_search) .widgettitle, .archive #sidebar-default :not(.widget_search) .widgettitle, .single #sidebar-default :not(.widget_search) .widgettitle { text-transform: uppercase; }
.blog #sidebar-default .widget:not(#block-9), .archive #sidebar-default .widget:not(#block-9), .single #sidebar-default .widget:not(#block-9) { margin-bottom: 3rem; }
.blog #sidebar-default .widget_search .widgettitle, .archive #sidebar-default .widget_search .widgettitle, .single #sidebar-default .widget_search .widgettitle { font-size: 1rem; }
.blog #sidebar-default .search-form #s, .archive #sidebar-default .search-form #s, .single #sidebar-default .search-form #s { border-radius: 0; }
.blog #sidebar-default #categories-2 ul li, .archive #sidebar-default #categories-2 ul li, .single #sidebar-default #categories-2 ul li { margin-bottom: 1px; }
.blog #sidebar-default #categories-2 ul a, .archive #sidebar-default #categories-2 ul a, .single #sidebar-default #categories-2 ul a { display: block; padding: 0.75rem 1.5rem; color: #fff; background-color: rgb(var(--bs-primary-rgb)); text-decoration: none; }
.blog #sidebar-default #categories-2 ul a:hover, .archive #sidebar-default #categories-2 ul a:hover, .single #sidebar-default #categories-2 ul a:hover { color: rgb(var(--bs-primary-rgb)); background-color: #fff; box-shadow: 0 0 5px rgb(75, 144, 205); }
.blog #sidebar-default ul, .archive #sidebar-default ul, .single #sidebar-default ul { margin: 0; padding: 0; list-style: none; }
.blog #sidebar-default :not(#categories-2) ul li, .archive #sidebar-default :not(#categories-2) ul li, .single #sidebar-default :not(#categories-2) ul li { margin-bottom: 1rem; }
#appointment-request a { text-decoration: none; }
#appointment-request a:hover { text-decoration: underline; }
.single .post-header { margin: 1rem 0; }

/* contact form */
#wpcf7-f4-p41-o1 form { padding: 2rem; box-shadow: 0 4px 30px #1d8ecd3e; }
#wpcf7-f4-p41-o1 input:not(.wpcf7-submit), #wpcf7-f4-p41-o1 textarea { background-color: #f4f4f4; }

/** no gutter */
.no-gutter .row { --bs-gutter-y: 0; --bs-gutter-x: 0; align-items: normal !important; }

/** google reviews */
.rpi-card-inner { min-height: 305px; }

.accordion-button { font-size: var(--bs-body-font-size); }
#price-clarity-accordions .accordion-button { display: block; position: relative; }
#price-clarity-accordions .accordion-button:after { display: inline-block; position: absolute; top: 40%; right: 1rem; }

#flex-spending > .wp-block-group__inner-container { position: relative; }
.collection-title { position: relative; margin: 3rem auto; width: 90%; }
.collection-title .title-rule { position: absolute; top: 0; right: 0; bottom: 45%; left: 0; border-bottom: 1px solid #333; }
.collection-title span { position: relative; padding: 0 0.5em; background-color: #fff; z-index: 10; }

/** dry eye rescue bug */
#rescue-bug img { width: calc( var(--vw) * 10 ); max-width: 150px; min-width: 100px; }
#rescue-bug { position: fixed; bottom: 75px; right: 0; padding: 7.5px 15px; border-top-left-radius: 10px; border-bottom-left-radius: 10px; background: #fff; box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0px 0px 30px 0px rgba(0,0,0,0.2); z-index: 1020; }

/** media queries */
/** Small devices (landscape phones, 576px and up) [-sm] */
@media only screen and (min-width : 576px) {
  .brand-logo { max-width: 450px; }
  .wp-block-gallery.has-nested-images.text-center figure.wp-block-image figcaption { font-size: 1.25rem; }
}

/** Medium devices (tablets, 768px and up) [-md] */
@media only screen and (min-width : 768px) {
	#block-3 .container .row > div:last-of-type { font-size: 1.25rem !important; }
  .carousel-caption .container > * { max-width: 65%; }
  .home .eye-doctors .aspect-image { --jwbs-image-aspect: 61 / 84 !important; }
  #flex-spending > .wp-block-group__inner-container > .image { position: absolute; top: 0; right: 50%; bottom: 0; left: 0; background: url('/wp-content/uploads/2018/08/eyecare-ls-eyeglasses.jpg') no-repeat 50% 30%; background-size: cover; }
}

/** Large devices (desktops, 992px and up) [-lg] */
@media only screen and (min-width : 992px) {
  .wp-block-gallery.has-nested-images.text-center figure.wp-block-image figcaption { font-size: 1.75rem; }
}

/** X-Large devices (large desktops, 1200px and up) [-xl] */
@media only screen and (min-width : 1200px) {
  .carousel-caption .container > * { max-width: 50%; }
}

/** larger desktops, 1400px and up [-xxl] */
@media only screen and (min-width : 1400px) {
  .contain-left { left: calc((100vw - 1340px) / 2); right: auto; max-width: calc(100% - ((100vw - 1340px) / 2)); }
  .contain-right { max-width: calc(100% - ((100vw - 1340px) / 2)); min-width: 398px; }
  .flex-height { max-height: 700px; overflow: hidden; display: flex; justify-content: center; align-items: center;  }
}