/* Divine Motion: the AccessPress Ray look. White header with a 5px black top border, Open Sans 300 menu with
   dividers, black slider and services band, teal #23a38f widgets, teal #1c8776 footer menu, dark copyright bar. */

body { color: #444; font-weight: 400; }
h1, h2, h3 { font-family: "Roboto", sans-serif; font-weight: 300; color: #333; }
.dm-header { border-top: 5px solid #000; border-bottom: 1px solid #e5e5e5; background: #fff; backdrop-filter: none; }
.dm-header .brand img { height: 52px; }
.dm-header .site-nav > ul { gap: 0; }
.dm-header .site-nav > ul > li > a { display: block; padding: 22px 12px; font-weight: 300; font-size: .86rem; text-transform: uppercase; color: #000; border-bottom: 0; border-left: 1px solid #eee; }
.dm-header .site-nav > ul > li:last-child > a { border-right: 1px solid #eee; }
.dm-header .site-nav > ul > li > a:hover, .dm-header .site-nav a[aria-current="page"] { border-bottom: 0; box-shadow: inset 0 3px 0 #e74c3c; }
@media (max-width: 900px) {
  .dm-header .site-nav > ul > li > a { border-left: 0; border-right: 0 !important; border-bottom: 1px solid #eee; padding: 14px 4px; }
}

/* slider */
.dm-slider { position: relative; background: #000; height: clamp(300px, 52vw, 640px); overflow: hidden; }
.dm-slide { position: absolute; inset: 0; margin: 0; opacity: 0; transition: opacity .6s ease; display: grid; place-items: center; }
.dm-slide.is-active { opacity: 1; }
.dm-slide img { max-height: 100%; width: auto; max-width: 100%; height: 100%; object-fit: contain; }
.dm-prev, .dm-next { position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; width: 44px; height: 44px; border: 0; background: rgba(0,0,0,.5); color: #fff; font-size: 34px; line-height: 1; cursor: pointer; padding-bottom: 4px; }
.dm-prev { left: 12px; } .dm-next { right: 12px; }
.dm-dots { position: absolute; bottom: 14px; left: 0; right: 0; display: flex; justify-content: center; gap: 8px; z-index: 2; }
.dm-dots button { width: 14px; height: 14px; border-radius: 50%; border: 2px solid #e74c3c; background: transparent; padding: 0; cursor: pointer; }
.dm-dots button[aria-current="true"] { background: #e74c3c; box-shadow: inset 0 0 0 2px #000; }

.dm-welcome { text-align: center; padding: 56px 16px 70px; }
.dm-welcome h1 { font-size: clamp(1.6rem, 3vw, 2.1rem); margin: 0 0 18px; color: #333; }
.dm-welcome p { margin: 0; font-weight: 300; font-size: 1.2rem; }

.dm-services { background: #000; color: #fff; text-align: center; padding: 40px 16px 50px; }
.dm-services h2 { color: #fff; font-size: 1.9rem; margin: 0 0 18px; }
.dm-lead { margin: 0 auto 28px; max-width: 960px; font-size: .95rem; text-align: center; color: #fff; }
.dm-services ul { list-style: none; margin: 0 auto; padding: 0; max-width: 960px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; align-items: start; }
.dm-services li { background: #fff; color: #555; padding: 0 0 18px; }
.dm-svc-img { display: block; aspect-ratio: 226 / 158; overflow: hidden; }
.dm-svc-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.dm-services li:hover .dm-svc-img img { transform: scale(1.06); }
.dm-services h3 { font-weight: 500; font-size: 1.05rem; margin: 18px 14px 12px; color: #222; }
.dm-services h3 a { color: inherit; text-decoration: none; }
.dm-services p { font-size: .8rem; font-weight: 300; margin: 0 18px 14px; line-height: 1.6; }
.dm-btn { display: inline-block; border: 1px solid #000; padding: 5px 12px; color: #000; font-size: .78rem; text-decoration: none; transition: background .2s, color .2s; }
.dm-btn:hover { background: #000; color: #fff; }

.dm-activity { padding: 40px 16px 40px; text-align: center; }
.dm-activity h2 { font-size: 1.7rem; margin: 0 0 26px; }
.dm-activity > ul, .dm-actlist { list-style: none; margin: 0 auto; padding: 0; max-width: 960px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: start; text-align: left; }
.dm-actlist { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dm-act { background: #f1f1f1; }
.dm-act-img { display: block; aspect-ratio: 300 / 210; overflow: hidden; }
.dm-act-img img { width: 100%; height: 100%; object-fit: cover; }
.dm-act-body { padding: 14px 16px 16px; }
.dm-act h3 { font-size: 1.15rem; margin: 0 0 6px; text-transform: uppercase; line-height: 1.2; }
.dm-act h3 a { color: #333; text-decoration: none; }
.dm-act p { font-size: .82rem; margin: 0 0 14px; line-height: 1.7; }
.dm-more { display: inline-flex; align-items: center; gap: 8px; background: #222; color: #fff; font-size: .7rem; padding: 4px 0 4px 8px; text-decoration: none; }
.dm-more span { background: #000; padding: 0 7px; }
.dm-more:hover { background: #000; }
.dm-center { text-align: center; margin: 26px 0 0; }
.dm-viewall { display: inline-block; background: #000; color: #fff; padding: 6px 34px; text-decoration: none; font-size: .9rem; }

.dm-testi { background: #f6f6f6; text-align: center; padding: 30px 16px 40px; }
.dm-testi > a { display: inline-block; }
.dm-testi img { display: block; margin: 0 auto; width: 84px; height: 84px; border-radius: 50%; object-fit: cover; }
.dm-testi p { text-align: center; max-width: 780px; margin: 14px auto 0; font-weight: 300; font-size: 1.15rem; color: #333; }

.dm-mapband { position: relative; }
.dm-mapwrap { line-height: 0; }
.dm-map { width: 100%; height: 380px; border: 0; }
.dm-wrap { max-width: 960px; margin: 0 auto; padding: 0 16px; }
.dm-mapgrid { display: flex; justify-content: flex-end; }
.dm-cbox { background: #fff; padding: 16px 20px; margin-top: -330px; position: relative; width: 300px; font-size: .85rem; box-shadow: 0 4px 18px rgba(0,0,0,.12); margin-bottom: 30px; }
.dm-cbox h2 { font-size: 1.5rem; margin: 0 0 14px; padding-bottom: 6px; border-bottom: 1px solid #333; }
.dm-cbox a { color: #444; word-break: break-all; }
.dm-soc { display: flex; gap: 6px; }
.dm-soc a, .dm-foot-social a { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #3b5998; color: #fff; }
.dm-soc a + a { background: #517fa4; }
.dm-soc svg, .dm-foot-social svg { width: 14px; height: 14px; }

.dm-footer { color: #fff; text-align: center; }
.dm-footmenu { background: #1c8776; padding: 8px 16px; }
.dm-footmenu ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; }
.dm-footmenu li + li::before { content: "|"; opacity: .7; margin: 0 8px; font-size: .7rem; }
.dm-footmenu a { color: #fff; text-decoration: none; font-weight: 300; font-size: .86rem; }
.dm-copy { background: #2d2e3b; padding: 14px 16px 12px; font-size: .8rem; }
.dm-copy p { margin: 0 0 8px; }
.dm-foot-social { display: flex; justify-content: center; gap: 8px; }
.dm-foot-social a { background: #1c8776; }

/* inner pages with sidebar */
.dm-page { max-width: 960px; margin: 0 auto; padding: 24px 16px 50px; display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 30px; align-items: start; }
.dm-title { font-family: "Roboto", sans-serif; font-weight: 300; font-size: 1.6rem; color: #666; margin: 0 0 20px; padding-bottom: 8px; border-bottom: 2px dashed #ccc; }
.dm-entry { font-size: .88rem; line-height: 1.75; }
.dm-entry p { margin: 0 0 14px; }
.dm-entry ul { margin: 0 0 14px; padding-left: 20px; list-style: disc; }
.dm-entry ul.dm-gallery, .dm-entry ul.dm-actlist, .dm-entry ul.dm-videos { list-style: none; padding-left: 0; }
.dm-entry ul.dm-ol { list-style: decimal; }
.dm-entry hr { border: 0; border-top: 1px solid #ddd; margin: 18px 0; }
.dm-entry a { color: #1c8776; overflow-wrap: anywhere; }
.dm-map { max-width: 100%; }
.dm-h2 { text-align: center; font-weight: 500; font-size: 1.4rem; margin: 6px 0 14px; color: #333; }
.dm-h2.is-red { color: #ff0000; }
.dm-h1c { text-align: center; font-weight: 500; font-size: 1.5rem; margin: 10px 0 16px; color: #333; }
.dm-c { text-align: center; }
.dm-thumbs { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 14px; }
.dm-thumbs a { width: 150px; height: 150px; display: block; overflow: hidden; }
.dm-thumbs img, .dm-pair img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s; }
.dm-thumbs a:hover img { transform: scale(1.06); }
.dm-pair { display: flex; gap: 6px; margin: 0 0 14px; } .dm-pair a { width: 150px; height: 150px; display: block; overflow: hidden; }
.dm-clients { list-style: none !important; padding-left: 18px !important; }
.dm-side { display: grid; gap: 24px; }
.dm-widget h2 { background: #23a38f; color: #fff; font-size: 1.1rem; margin: 0 0 8px; padding: 6px 10px; }
.dm-navlist { list-style: none; margin: 0; padding: 0; }
.dm-navlist li { border-bottom: 1px solid #eee; }
.dm-navlist a { display: block; padding: 6px 0 6px 14px; color: #666; text-decoration: none; font-size: .82rem; font-weight: 300; position: relative; }
.dm-navlist a::before { content: "\203A"; position: absolute; left: 2px; }
.dm-navlist a:hover { color: #23a38f; }
.dm-follow { display: flex; flex-direction: column; gap: 8px; margin: 0; }
.dm-follow a { display: inline-flex; align-items: center; gap: 8px; color: #444; text-decoration: none; font-size: .88rem; }
.dm-follow svg { width: 18px; height: 18px; color: #23a38f; }

.dm-svc3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; font-size: .8rem; }
.dm-svc3 img { width: 100%; aspect-ratio: 244 / 164; object-fit: cover; margin-bottom: 14px; }
.dm-svc3 .lb img { aspect-ratio: 1; width: 150px; }

.dm-filters { display: flex; flex-wrap: wrap; gap: 4px; margin: 0 0 14px; }
.dm-filters button { border: 0; background: #f2f2f2; color: #23a38f; font: 400 .8rem "Open Sans", sans-serif; padding: 8px 12px; cursor: pointer; }
.dm-filters button[aria-pressed="true"] { background: #23a38f; color: #fff; }
.dm-gallery { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 2px; }
.dm-gallery li.is-hidden { display: none; }
.dm-gallery a { display: block; aspect-ratio: 1; overflow: hidden; }
.dm-gallery img { width: 100%; height: 100%; object-fit: cover; transition: transform .3s, opacity .3s; }
.dm-gallery a:hover img { transform: scale(1.08); opacity: .85; }

.dm-contact2 { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.dm-contact2 .dm-map { height: 200px; margin-bottom: 12px; }
.dm-form { display: grid; grid-template-columns: 1fr 1fr; gap: 0 20px; padding: 0; background: none; border: 0; box-shadow: none; margin-top: 10px; }

.dm-feature img { width: 100%; height: auto; }
.dm-videos { list-style: none !important; padding: 0 !important; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 20px !important; }
.dm-video { position: relative; width: 100%; aspect-ratio: 16 / 9; border: 0; background: #111 linear-gradient(135deg, #1c1c2b, #000); color: #fff; cursor: pointer; display: grid; place-items: center; padding: 10px; text-align: center; }
.dm-video svg { width: 40px; height: 40px; color: #e74c3c; }
.dm-video span { position: absolute; left: 8px; right: 8px; bottom: 8px; font-size: .7rem; line-height: 1.3; }
.dm-video:hover svg { transform: scale(1.1); }
.dm-videos iframe { width: 100%; aspect-ratio: 16 / 9; height: auto; border: 0; display: block; }
.dm-video-link { font-size: .72rem; }
.dm-events { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin: 0 0 24px; }
.dm-events a { display: block; aspect-ratio: 1; overflow: hidden; }
.dm-events img { width: 100%; height: 100%; object-fit: cover; }
.dm-testi-img img { width: 100%; max-width: 553px; height: auto; }
.dm-date { color: #888; font-size: .8rem; }
.dm-postpics img { width: 100%; height: auto; margin-bottom: 10px; }

@media (max-width: 900px) {
  .dm-services ul { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dm-page { grid-template-columns: minmax(0, 1fr); }
  .dm-gallery { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .dm-services ul, .dm-activity > ul, .dm-actlist, .dm-svc3, .dm-contact2, .dm-form, .dm-videos { grid-template-columns: minmax(0, 1fr); }
  .dm-cbox { margin: 0 0 30px; width: 100%; box-shadow: none; padding: 20px 0 0; }
  .dm-mapgrid { display: block; }
  .dm-thumbs a, .dm-pair a { width: calc(33.33% - 4px); height: auto; aspect-ratio: 1; }
  .dm-events { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) { .dm-slide, .dm-svc-img img, .dm-gallery img, .dm-thumbs img { transition: none; } }
