/* Accessibility helpers. Visual design is unchanged except the skip link and pause control, which appear only when needed. */
.skip-link {
    position: absolute;
    left: 12px;
    top: -48px;
    z-index: 10000;
    padding: 8px 14px;
    background: #1a1a1a;
    color: #ffffff;
    text-decoration: none;
    font-size: 16px;
    line-height: 1.2;
}

.skip-link:focus {
    top: 12px;
}

html {
    scroll-padding-top: 110px;
}

:focus {
    scroll-margin-top: 110px;
}

:focus-visible {
    outline: 2px solid #1a1a1a;
    outline-offset: 2px;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    outline: 2px solid #1a1a1a !important;
    outline-offset: 2px;
}

.navbar-toggle:focus-visible,
.register-wrapper .btn-default:focus-visible,
.contact-form .btn-default:focus-visible,
.back-btn .btn-black:focus-visible,
.staff-modal-cont .close:focus-visible,
.register-wrapper select.form-control:focus-visible {
    outline: 2px solid #1a1a1a !important;
    outline-offset: 3px;
}

.header a:focus-visible {
    outline: 2px solid #1a1a1a !important;
    outline-offset: 3px;
}

.open-bg a:focus-visible,
.open-content a:focus-visible,
.footer a:focus-visible,
.email-box-bg a:focus-visible,
.email-box-bg input:focus-visible,
.email-box-bg button:focus-visible {
    outline: 2px solid #ffffff !important;
    outline-offset: 3px;
}

/* Keep the ring on the image so overflow/transform parents do not clip it. */
a:focus-visible img {
    outline: 3px solid #1a1a1a !important;
    outline-offset: -4px;
}

.header a:focus-visible img,
.logo a:focus-visible img,
.header-top-logo a:focus-visible img,
.footer-right a:focus-visible img {
    outline: 2px solid #1a1a1a !important;
    outline-offset: 2px;
}

.open-gird-img > a,
.dentaltrip-insta-feed li > a {
    display: block;
}

.owl-carousel .owl-item:focus-within {
    -webkit-backface-visibility: visible;
    backface-visibility: visible;
    z-index: 2;
}

#open-slider a:focus,
#open-slider a:focus-visible,
.owl-carousel a:focus,
.owl-carousel a:focus-visible,
.dentaltrip-insta-feed a:focus,
.dentaltrip-insta-feed a:focus-visible,
.open-gird-img a:focus,
.open-gird-img a:focus-visible {
    outline: 3px solid #ffffff !important;
    outline-offset: -8px;
    box-shadow: inset 0 0 0 3px #1a1a1a !important;
}

#open-slider a:focus img,
#open-slider a:focus-visible img,
.owl-carousel a:focus img,
.owl-carousel a:focus-visible img,
.dentaltrip-insta-feed a:focus img,
.dentaltrip-insta-feed a:focus-visible img,
.open-gird-img a:focus img,
.open-gird-img a:focus-visible img {
    outline: 3px solid #ffffff !important;
    outline-offset: -8px;
    box-shadow: inset 0 0 0 3px #1a1a1a !important;
}

.videoWrapper {
    position: relative;
}

.videoWrapper video {
    object-fit: cover;
    object-position: top center;
}

.video-pause-btn {
    position: absolute;
    right: 12px;
    bottom: 12px;
    top: auto;
    left: auto;
    margin: 0;
    z-index: 3;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: rgba(26, 26, 26, 0.72);
    color: #ffffff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.video-pause-btn svg {
    width: 18px;
    height: 18px;
    fill: currentColor;
    display: block;
}

.video-pause-btn .icon-play {
    display: none;
}

.video-pause-btn .icon-play path {
    fill: currentColor;
}

.video-pause-btn.is-paused .icon-pause {
    display: none;
}

.video-pause-btn.is-paused .icon-play {
    display: block;
    margin-left: 2px;
}

.video-pause-btn:focus-visible {
    outline: 2px solid #ffffff !important;
    outline-offset: 3px;
}

.footer-left ul {
    margin-top: 0 !important;
}

.footer-left ul li {
    margin: 0 0 8px 0 !important;
}

.footer-left ul li a,
.footer-nav-link {
    display: inline-flex !important;
    align-items: center !important;
    box-sizing: border-box !important;
    min-width: 44px !important;
        padding: 8px 9px 0px 0  !important;
    line-height: 1.4 !important;
    font-size: 14px !important;
    min-height:  auto !important;
}

#pjAcceptCookieBar,
#pjAcceptCookieBar form,
#pjAcceptCookieBar p {
    background: #1a1a1a !important;
    color: #ffffff !important;
}

#pjAcceptCookieBar p {
    font-size: 16px !important;
    line-height: 1.5 !important;
}

#pjAcceptCookieBar .pjAcceptCookieBarBtn,
#pjAcceptCookieBar .pjDenyCookieBarBtn {
    background: #FBF4ED;
    color: #1a1a1a;
    min-height: 44px;
    padding: 8px 20px;
}

@media (prefers-reduced-motion: reduce) {
    .loader,
    .loader-circle,
    .wow {
        animation: none !important;
        transition: none !important;
    }
}