@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,400;0,600;1,400;1,600&display=swap");
h1,
h2,
h3,
h4,
h5,
h6,
p,
body,
a,
ul,
li,
span,
button,
input,
textarea,
div {
font-family: 'Montserrat', sans-serif !important;
color: #FFFFFF !important;
}
#wpadminbar h1,
#wpadminbar h2,
#wpadminbar h3,
#wpadminbar h4,
#wpadminbar h5,
#wpadminbar h6,
#wpadminbar p,
#wpadminbar body,
#wpadminbar a,
#wpadminbar ul,
#wpadminbar li,
#wpadminbar span,
#wpadminbar button,
#wpadminbar input,
#wpadminbar textarea,
#wpadminbar div {
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif !important;
line-height: 2.46153846;
font-size: 12px;
}
#wpadminbar .ab-icon,
#wpadminbar .ab-item:before,
#wpadminbar>#wp-toolbar>#wp-admin-bar-root-default .ab-icon,
.wp-admin-bar-arrow {
font-family: dashicons !important;
font-size: 20px !important;
line-height: 1 !important;
}
h1,
h2,
h3,
h4,
h5,
h6 {
text-transform: uppercase;
letter-spacing: 1px;
}
h1,
.h1 {
font-size: 40px !important;
}
p,
body,
li,
span,
footer h4,
footer a,
.btn {
font-size: 12px !important;
line-height: 1.624 !important;
}
.white-bg h1,
.white-bg h2,
.white-bg h3,
.white-bg h4,
.white-bg h5,
.white-bg h6,
.white-bg p,
.white-bg body,
.white-bg a,
.white-bg ul,
.white-bg li,
.white-bg span,
.white-bg button,
.white-bg input,
.white-bg textarea,
.white-bg div {
color: #0B0B0B !important;
}
footer h4 {
text-transform: uppercase;
font-weight: 600;
}
footer #mini-menu a {
display: table;
clear: both;
font-weight: bold;
}
footer h4,
footer p,
footer a {
margin-bottom: 4px;
}
#content.site-content {
padding-bottom: 0;
padding-top: 0;
}
.navbar-brand {
padding: 0;
}
.navbar-brand img {
width: 140px;
height: auto;
}
#masthead,
.dropdown-menu {
background-color: #1A1A1A !important;
}
.dropdown-menu .dropdown-item {
text-transform: uppercase;
font-weight: 600;
}
body:not(.theme-preset-active) #masthead .navbar-nav>li>a {
color: #FFFFFF !important;
text-transform: uppercase;
padding-left: 24px;
padding-right: 24px;
font-weight: 500;
letter-spacing: 1px !important;
}
body:not(.theme-preset-active) #masthead .navbar-nav li a {
transition: all 0.4s ease;
}
body:not(.theme-preset-active) #masthead .navbar-nav li a:hover {
opacity: 0.6;
}
#home-header {
background-image: url(//w5physio.co.uk/wp-content/themes/di/assets/images/backgrounds/home-treatments.jpg);
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
position: relative;
padding: 128px 0;
overflow: hidden;
}
#home-header.fourzerofour {
background-image: none !important;
background-color: #222222;
}
.header {
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
position: relative;
padding: 96px 0 32px;
}
#about-content {
padding-top: 32px;
}
.img-bg {
background-image: url(//w5physio.co.uk/wp-content/themes/di/assets/images/backgrounds/first-visit/diagnose.jpg);
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
position: relative;
}
#home-header {
padding-top: 192px;
padding-bottom: 192px;
}
.img-bg::after,
#home-header::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
filter: grayscale(100%);
background-color: #1A1A1A;
opacity: 0.6;
z-index: 1;
display: block;
}
#home-header.fourzerofour::after {
display: none;
}
.news-card::after {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgb(34, 34, 34);
background: linear-gradient(180deg, rgba(34, 34, 34, 0) 0%, rgba(34, 34, 34, 1) 100%);
z-index: 1;
transition: all 0.4s ease !important;
}
.news-card:hover::after {
opacity: 0 !important;
}
.member-card-headshot {
filter: grayscale(100%) !important;
transition: all 0.4s ease;
}
.header .container,
.img-bg .container {
z-index: 2;
position: relative;
}
#home-header h1,
#home-header h2,
#home-header h3,
#home-header h4,
#home-header h5,
#home-header h6,
#home-header p,
#home-header body,
#home-header a,
#home-header ul,
#home-header li,
#home-header span,
#home-header button,
#home-header input,
#home-header textarea,
#home-header div {
text-align: center;
z-index: 99;
}
h3,
.h3 {
font-weight: 600;
}
.header-copy-wrapper {
max-width: 460px;
margin: 0 auto;
}
.btn {
padding: 6px 24px !important;
border-radius: 24px;
color: #FFFFFF;
background-color: #E20A1A;
font-weight: 600;
transition: all 0.4s ease;
text-align: center;
margin-top: 32px;
border: 2px;
text-transform: capitalize;
}
.btn:hover {
opacity: 0.6;
}
#cta-row-fv .btn {
display: block;
margin-left: auto;
margin-right: auto;
}
.header-btn-wrapper {
margin-top: 16px;
}
.header-btn-wrapper .btn {
margin-top: 16px !important;
margin-bottom: 0px !important;
margin-right: 16px;
}
.header .additional-copy {
margin-top: 64px;
}
.page-section {
padding: 64px 0;
}
.home-section {
padding: 128px 0;
}
.black-bg,
body {
background-color: #222222 !important;
}
.standard-header-img {
background-image: url(//w5physio.co.uk/wp-content/themes/di/assets/images/backgrounds/first-visit/diagnose.jpg);
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
position: relative;
width: 100%;
max-width: 420px;
display: block;
margin: 0 0 0 auto;
height: 100%;
border-radius: 192px;
}
.single-member-headshot {
background-position: center top;
background-repeat: no-repeat;
background-size: cover;
position: relative;
width: 100%;
max-width: 420px;
display: block;
margin: 0 0 0 auto;
height: 384px;
border-radius: 192px;
}
.circular-img {
background-image: url(//w5physio.co.uk/wp-content/themes/di/assets/images/backgrounds/first-visit/diagnose.jpg);
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
position: relative;
width: 100%;
border-radius: 100%;
display: block;
margin: 0 auto;
max-width: 480px;
}
.page-section .row .col-lg-6:last-of-type .circular-img {
margin-left: auto;
margin-right: 0;
max-width: 480px;
}
.treatment-card {
border-radius: 16px;
padding: 24px 12px;
transition: all 0.4s ease;
cursor: pointer;
height: 100%;
border-radius: 128px;
border: 2px solid #FFFFFF;
max-width: 200px;
display: block;
margin-left: auto;
margin-right: auto;
}
.treatment-card.active,
.treatment-card:hover {
background-color: #FFFFFF;
}
.treatment-card-icon {
background-image: url(//w5physio.co.uk/wp-content/themes/di/assets/images/treatments/icons/knee.png);
background-position: center center;
background-repeat: no-repeat;
background-size: 64%;
position: relative;
width: 100%;
border-radius: 100%;
display: block;
margin: 0 auto;
transition: all 0.4s ease;
margin-bottom: 24px;
filter: brightness(0) invert(1);
}
.treatment-card.active .treatment-card-icon,
.treatment-card:hover .treatment-card-icon {
filter: brightness(1) invert(0);
}
p.treatment-card-title {
text-align: center;
color: #FFFFFF !important;
transition: all 0.4s ease;
}
.treatment-card.active .treatment-card-title,
.treatment-card:hover .treatment-card-title {
color: #222222 !important;
}
.news-card {
transition: all 0.4s ease;
border-radius: 24px;
padding: 24px;
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
background-image: url(//w5physio.co.uk/wp-content/themes/di/assets/images/backgrounds/first-visit/diagnose.jpg);
min-height: 448px;
position: relative;
cursor: pointer;
}
.news-card-copy-wrapper {
position: absolute;
bottom: 24px;
left: 24px;
width: calc(100% - 48px);
transition: all 0.4s ease;
z-index: 10;
}
.news-card:hover .news-card-copy-wrapper {
transform: translateY(-8px);
}
.news-card-date {
font-weight: 600;
text-transform: uppercase;
}
.review-card {
background-color: #0B0B0B;
padding: 24px;
border-radius: 24px;
transition: all 0.4s ease;
height: 100%;
}
.review-card h3,
.review-card p {
transition: all 0.4s ease !important;
} .review-card .client-name,
.review-card .review-date,
.client-review .client-name,
.client-review .review-date {
display: inline-block !important;
}
.client-review .client-name {
color: #1BB7CC !important;
}
.review-card .client-name,
.client-review .client-name {
margin-right: 8px;
}
a.client-read-more {
color: #1BB7CC !important;
text-transform: uppercase;
font-weight: 600;
margin-top: 16px;
position: absolute;
transition: all 0.4s ease;
bottom: 24px;
}
p.review-body { margin-bottom: 0;
}
a.client-read-more:hover {
opacity: 0.6;
text-decoration: none;
}
.contact-col-card {
padding: 24px;
border-radius: 24px;
background-color: rgba(26, 26, 26, 0.7);
border: 1px solid #FFFFFF;
height: 100%;
}
.contact-col-card h3 {
margin-bottom: 24px;
}
.cta-strip {
padding: 96px 16px;
background-color: #1A1A1A;
margin-top: 64px;
}
footer {
background-color: #1A1A1A !important;
padding: 96px 0 64px;
}
.home .cta-strip,
.page-id-14 .cta-strip,
.page-id-16 .cta-strip {
margin-top: 0;
}
.cta-container {
max-width: 460px;
width: 100%;
display: block;
margin: 0 auto;
text-align: center !important;
}
.cta-container .btn {
width: 100% !important;
display: block !important;
}
h2.section-title {
margin-bottom: 32px;
}
.additional-copy {
margin-bottom: 128px;
}
.about-copy-col p:last-of-type {
margin-bottom: 0;
}
#about-content-2 {
margin-top: 64px;
padding-bottom: 64px;
}
.header-meta {
margin-bottom: 32px;
}
.member-meta {
margin-bottom: 16px;
}
span.wpcf7-not-valid-tip {
margin-top: 8px;
}
.wpcf7-response-output {
padding: 0 !important;
font-size: 14px;
border: none !important;
margin: 32px 0 0 !important;
}
.header-body-wrapper p:last-of-type {
margin-bottom: 0 !important;
}
.col-lg-3.member-col,
.reveal-card-col,
.review-col,
.product-card-col {
margin-bottom: 32px;
}
.reveal-cards-row,
.review-cards-row,
.members-row,
.product-fee-row {
margin-bottom: -32px;
}
.member-card-role {
text-transform: uppercase;
}
.member-card {
background-color: #0B0B0B;
border-radius: 24px;
transition: all 0.4s ease;
cursor: pointer;
overflow: hidden;
height: 100%;
position: relative;
}
.member-card-copy-wrapper {
padding: 16px;
margin-bottom: 40px;
}
a.btn.member-card-btn {
margin: 0 !important;
display: block;
width: calc(100% - 32px);
position: absolute;
bottom: 16px;
}
.member-card-headshot {
background-image: url(//w5physio.co.uk/wp-content/uploads/2021/10/Greg1-scaled.jpg);
min-height: 240px;
background-size: cover;
background-position: center top;
background-repeat: no-repeat;
position: relative;
}
a.btn.member-card-btn {
display: block;
background-color: transparent;
border: 2px solid #E20A1A !important;
padding-left: 6px !important;
padding-right: 6px !important;
}
#team-members { }
.reveal-card-inner {
position: relative;
width: 100%;
height: 100%;
text-align: center;
transition: transform 0.8s;
transform-style: preserve-3d;
}
.reveal-card {
background-color: transparent;
width: 100%;
height: 512px;
perspective: 1000px; }
.col-lg-3 .reveal-card {
height: 448px;
}
.reveal-card:hover .reveal-card-inner {
transform: rotateY(180deg);
}
.card-state-inner {
position: absolute;
top: 50%;
left: 0;
width: 100%;
transform: translateY(-50%);
padding: 0 16px;
}
.fee-product-default-inner.card-state-inner {
top: 90%;
transform: translateY(-100%);
}
.home-about-image {
filter: grayscale(100%) !important;
} .reveal-state {
transform: rotateY(180deg);
}
.card-state {
background-image: url(//w5physio.co.uk/wp-content/themes/di/assets/images/backgrounds/first-visit/diagnose.jpg);
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
position: relative;
width: 100%;
display: block;
margin: 0 0 0 auto;
height: 512px;
border-radius: 192px;
position: absolute;
width: 100%;
height: 100%;
-webkit-backface-visibility: hidden; backface-visibility: hidden;
}
.card-state.reveal-state {
background-image: none;
background-color: #FFFFFF;
}
.card-state.reveal-state .card-state-inner {
z-index: 24;
}
.card-state.reveal-state h1,
.card-state.reveal-state h2,
.card-state.reveal-state h3,
.card-state.reveal-state h4,
.card-state.reveal-state h5,
.card-state.reveal-state h6,
.card-state.reveal-state p,
.card-state.reveal-state body,
.card-state.reveal-state ul,
.card-state.reveal-state li,
.card-state.reveal-state span,
.card-state.reveal-state a {
color: #222222 !important;
}
.product-card {
background-image: url(//w5physio.co.uk/wp-content/themes/di/assets/images/backgrounds/first-visit/diagnose.jpg);
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
position: relative;
width: 100%;
display: block;
margin: 0 0 0 auto;
height: 448px;
border-radius: 192px;
}
.card-state { }
.product-content {
position: absolute;
width: calc(100% - 16px);
left: 50%;
text-align: center; transform: translate(-50%);
top: calc(100% - 128px);
}
.default-tile {
margin: 0 !important;
padding: 0 !important;
}
.client-review {
border-radius: 24px;
padding: 32px;
background-color: #0B0B0B;
break-inside: avoid;
page-break-inside: avoid;
will-change: transform;
margin-bottom: 32px;
}
.client-review h2 {
margin: 8px 0 16px !important;
padding: 0 !important;
}
.service-listing-wrapper {
margin-top: 32px;
}
#step-counter {
margin-top: 32px;
position: relative;
}
#step-counter::before {
content: '';
display: block;
position: absolute;
height: 2px;
width: 66.6666%;
background-color: #FFFFFF;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.step {
display: table;
line-height: 62px;
width: 64px;
text-align: center;
font-size: 24px;
color: #E20A1A !important;
border: 2px solid #FFFFFF;
border-radius: 100%;
background-color: #222222 !important;
margin: 0 auto;
font-weight: 600;
}
.simple-header h1 {
margin-bottom: 0 !important;
padding-bottom: 0 !important;
word-break: break-word;
hyphens: auto !important;
}
.panel {
background-color: #0B0B0B;
border-radius: 16px;
padding: 20px 24px;
transition: all 0.4s ease;
cursor: pointer;
}
.panel.open {
background-color: #FFFFFF !important;
}
.panel h3 {
margin-bottom: 0 !important;
padding-bottom: 0 !important;
position: relative;
transition: all 0.4s ease;
}
.panel h3::after {
display: inline-block;
vertical-align: middle;
content: "\f054";
border: none !important;
font-family: "Font Awesome 5 Free";
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
transition: all 0.4s ease;
}
.panel.open h3::after {
transform: translateY(-50%) rotate(90deg);
}
.youtube-link::before {
display: inline-block;
vertical-align: middle;
border: none !important;
font-family: "Font Awesome 5 Free";
content: "\f04b";
color: #E20A1A;
margin-right: 6px;
}
.panel.open h3::after {
transform: translateY(-50%) rotate(90deg);
color: #0B0B0B !important;
}
.panel h3 {
transition: all 0.4s ease !important;
}
.panel h3 a:hover {
text-decoration: none;
}
.treatment-body {
margin-top: 32px;
}
.treatment-content {
padding-left: 16px;
border-left: 2px solid #E20A1A;
transition: all 0.4s ease;
}
.treatment-content p:last-of-type {
margin-bottom: 0;
}
.panel.open .treatment-content p,
.panel.open .treatment-content a,
.panel.open .treatment-content span,
.panel.open .treatment-content li,
.panel.open .treatment-content * {
color: #0B0B0B !important;
}
.panel.open h3,
.panel.open h3 a {
color: #0B0B0B !important;
}
.partner-logos {
padding: 96px 0;
text-align: center !important;
background-color: #1A1A1A;
}
img.partnership-logo {
text-align: center;
margin: 48px 8px 0;
display: inline-block;
width: 14% !important;
min-width: 100px !important;
}
img.footer-logo {
width: 180px;
margin-left: auto;
display: block;
max-width: 90%;
}
.footer-divider {
width: 100%;
display: block;
height: 2px;
background-color: #FFFFFF;
margin: 32px auto 16px;
}
.company-meta,
.socials-wrapper {
display: inline-block;
line-height: 20px !important;
margin-bottom: 0 !important;
}
.socials-wrapper {
float: right;
}
.socials-wrapper i.fab {
font-size: 20px;
margin-right: 16px;
cursor: pointer;
transition: all 0.4s ease;
}
.socials-wrapper i.fab:last-of-type {
margin-right: 0 !important;
}
.socials-wrapper i.fab:hover {
color: #E20A1A !important;
}
#services {
padding-bottom: 64px;
}
.home-section#reviews {
padding-top: 0;
}
#blogs-grid .news-col {
margin-bottom: 32px;
}
.dropdown-toggle::after {
display: inline-block;
margin-left: 6px;
vertical-align: middle;
content: "\f078";
border: none !important;
font-size: 12px;
line-height: 26px !important;
font-family: "Font Awesome 5 Free";
}
.dropdown-menu.show {
display: none;
}
.menu-item-has-children.dropdown:hover .dropdown-menu {
display: block !important;
width: 100%;
box-shadow: none !important;
border: none;
top: calc(100% - 8px) !important;
}
.track {
position: relative;
padding-top: 32px;
}
.single .track {
padding-top: 128px;
}
.track::before {
content: '';
position: absolute;
width: 40vw;
height: 320px;
border-left: 0 !important;
border: 2px solid #FFFFFF;
top: 0;
border-top-right-radius: 320px !important;
border-bottom-right-radius: 320px !important;
} .track:nth-of-type(2),
.track.invert {
margin-top: 96px;
padding-top: 0 !important;
}
.track:nth-of-type(2)::before,
.track.invert::before {
border-top-right-radius: 0 !important;
border-bottom-right-radius: 0 !important;
border-top-left-radius: 320px !important;
border-bottom-left-radius: 320px !important;
width: 48vw;
right: 0;
border-left: 2px solid #FFFFFF !important;
border-right: 0 !important;
top: -32px !important;
}
.track-hoop,
.vertical-track-hoop {
height: 32px;
width: 32px;
border-radius: 100%;
border: 2px solid #E20A1A !important;
background-color: transparent;
position: absolute;
top: -16px;
margin: 0 8px;
}
.vertical-track-hoop {
top: 0;
right: -17px !important;
margin: 32px 0;
}
.ft-col .vertical-track-hoop {
right: 1px !important;
margin: 24px 0;
}
.ft-col.offset-lg-8 .vertical-track-hoop {
bottom: 0;
top: auto;
left: 1px !important;
right: auto;
}
.track:nth-of-type(2) .track-hoop,
.track.invert .track-hoop {
top: -48px !important;
right: 0;
}
.member-card:hover {
cursor: pointer;
background-color: #FFFFFF !important;
}
.member-card:hover .member-card-headshot {
filter: grayscale(0) !important;
}
.member-card h3 {
transition: all 0.4s ease !important;
}
.member-card:hover a.btn,
.member-card:hover h3,
.member-card .btn:hover {
opacity: 1 !important;
color: #0B0B0B !important;
}
.white-bg {
background-color: #FFFFFF !important;
}
.services-section {
padding: 64px 0;
}
.link-section-title {
margin-bottom: 24px;
padding-bottom: 0;
display: inline-block;
position: relative;
}
.link-section-title::after {
height: 2px;
width: 100%;
content: '';
position: absolute;
left: 0%;
bottom: -8px;
background-color: #E20A1A;
}
.service {
break-inside: avoid;
page-break-inside: avoid;
will-change: transform;
}
.service p {
margin-bottom: 4px;
}
.service-listing-wrapper h3.service-title {
color: #1BB7CC !important;
}
.service-description {
font-weight: 600 !important;
}
.white-bg p.disclaimer {
text-align: center;
color: #818181 !important;
padding-bottom: 16px !important;
margin-bottom: 0;
padding-top: 32px;
}
#home-header {
min-height: calc(100vh + 2px);
}
.hub-hidden .home-section#what-we-treat {
min-height: 0 !important;
}
.hub-hidden .home-section,
.hub-hidden #home-header {
min-height: 0;
}
.home-hub {
position: fixed;
bottom: 0 !important;
width: 100% !important;
z-index: 999;
border-bottom: 2px solid #E20A1A;
transition: all 0.4s ease;
}
.w5-beacon {
width: 2px;
background-color: #FFFFFF;
max-height: 192px;
height: 192px;
margin: 0 auto;
display: block;
transition: all 0.4s ease;
}
.w5-beacon::before {
content: '';
width: 32px;
height: 32px;
position: absolute;
top: -16px;
border: 2px solid #E20A1A;
transition: all 0.4s ease;
left: 50%;
transform: translateX(-50%);
border-radius: 100% !important;
}
.footer-in-view .w5-beacon {
height: 0 !important;
}
.footer-in-view .w5-beacon::before,
.footer-in-view .w5-beacon::after {
opacity: 0 !important;
}
.footer-in-view .tab-wrapper {
bottom: 0 !important;
opacity: 0 !important;
} .w5-beacon::after {
content: '';
width: 6px;
height: 6px;
position: absolute;
top: -3px;
transition: all 0.4s ease;
left: 50%;
transform: translateX(-50%);
background-color: #FFFFFF;
border-radius: 100% !important;
}
.scrolled .w5-beacon {
height: 80px;
}
.tab-wrapper {
position: absolute;
bottom: 72px;
left: 0;
transition: all 0.4s ease;
}
.tab-wrapper#tabs-right {
right: 0;
left: auto;
}
.home-tab {
width: 64px;
margin: 0 16px;
border-radius: 4px;
background-color: #FFFFFF;
height: 4px;
opacity: 0.6;
transition: all 0.4s ease;
display: inline-block;
cursor: pointer;
}
.home-tab.active,
.home-tab:hover {
opacity: 1;
}
.home-hub .container {
position: relative;
}
.form-container h3 {
margin-bottom: 32px;
}
.form-container {
margin-top: 96px;
margin-bottom: 32px;
}
.form-container form {
font-size: 0 !important;
}
.form-container form p:first-of-type,
.form-container form p:nth-of-type(2) {
width: calc(50% - 16px);
display: inline-block !important;
}
.form-container form p:nth-of-type(2) {
float: right;
}
.form-container form p input[type="text"],
.form-container form p input[type="email"],
.form-container form p textarea {
background-color: transparent !important;
box-shadow: none !important;
color: #FFFFFF !important;
border: none;
border-bottom: 2px solid #FFFFFF !important;
border-radius: 0 !important;
padding-left: 0 !important;
}
.form-container form p input[type="text"]::placeholder,
.form-container form p input[type="email"]::placeholder,
.form-container form p textarea::placeholder {
color: #FFFFFF !important;
}
.form-container form .btn {
margin-top: 0px !important;
border-color: #E20A1A !important;
float: right;
}
.form-container form .btn:hover,
.form-container form .btn:active,
.form-container form .btn:focus {
border-color: #E20A1A !important;
background-color: #E20A1A !important;
outline: none !important;
box-shadow: none !important;
}
.blog-wrapper,
.booking-wrapper {
max-width: 832px;
display: block;
margin: 64px auto 128px;
padding-left: 16px;
padding-right: 16px;
}
.blog-title {
padding-bottom: 0;
margin-bottom: 16px;
}
span.youtube-link {
text-transform: capitalize;
cursor: pointer;
transition: all 0.4s ease;
}
span.youtube-link:hover {
opacity: 0.6;
}
.blog-date {
margin-right: 32px;
}
.blog-meta {
margin-bottom: 32px;
font-weight: 600;
text-transform: uppercase;
}
img.blog-featured-image {
border-radius: 24px;
max-height: 520px;
display: block;
margin: 0 auto 32px 0;
}
.member-content-container {
margin-top: 64px;
margin-bottom: 0;
}
.a2a_svg {
border-radius: 100% !important;
padding: 3px !important;
}
.share-wrapper p {
margin-bottom: 8px;
margin-top: 32px !important;
}
.filter {
margin-top: 0;
margin-right: 12px !important;
background-color: transparent !important;
border: 2px solid #FFFFFF !important
}
.filter.active,
.filter:hover {
background-color: #FFFFFF !important;
color: #222222 !important;
opacity: 1 !important;
}
.filters-wrapper {
margin-bottom: 24px;
}
.client-reviews-wrapper { }
#bg-video {
position: absolute;
z-index: 0;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
min-width: 100%;
min-height: 100%;
}
#masthead {
z-index: 1000;
position: relative;
padding: 16px 1rem !important;
}
.page-section#what-we-treat { }
#what-we-treat .row {
margin-top: 48px;
margin-bottom: 48px;
}
.page-section#further-treatments { }
.page-section#further-treatments::after {
background-color: transparent;
}
.page-section#what-we-treat h2 {
text-align: center;
}
.page-section#what-we-treat .btn {
display: table;
margin-left: auto;
margin-right: auto;
margin-top: 48px;
}
.page-section#treatments {
margin-bottom: -32px;
}
.page-section#contact {
background-image: url(//w5physio.co.uk/wp-content/themes/di/assets/images/backgrounds/contact.jpg);
background-position: center top;
}
.home .page-section#contact {
background-image: none !important;
background-color: #0B0B0B;
}
.treatment-panel {
margin-bottom: 24px;
}
.treatment-panel:hover h3 {
color: #1BB7CC !important;
}
.treatment-panel.open:hover h3 {
color: #0B0B0B !important;
}
.default-state::before,
.product-card::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 192px;
background: rgb(34, 34, 34);
background: linear-gradient(180deg, rgba(34, 34, 34, 0) 0%, rgba(34, 34, 34, 1) 100%);
} .default-state .card-state-inner {
z-index: 0;
}
.form-message-wrapper {
text-align: center;
margin: 32px auto;
text-transform: uppercase;
font-weight: 600;
}
.form-message-wrapper .message {
font-size: 16px !important;
}
.circular-img#pilates-image {
background-image: url(//w5physio.co.uk/wp-content/themes/di/assets/images/backgrounds/pilates.jpg);
}
.circular-img#general-practitioners-image {
background-image: url(https://w5physio.co.uk/wp-content/uploads/2021/10/Why-choose-W5Physio-image-1.jpg);
}
.blog-content-wrapper h2,
.blog-content-wrapper h3 {
padding-top: 16px !important;
}
.member-card-role {
color: #1BB7CC !important;
font-weight: 600 !important;
}
.post-filter-action,
.shop-filter-action {
position: absolute;
visibility: hidden;
}
a.older-button.btn,
a.newer-button.btn {
display: table;
margin: 0 auto;
}
.posts-nav-wrapper {
display: block;
clear: both;
width: 100%;
}
.mid-page .posts-nav-wrapper a.btn {
display: inline-block;
}
.mid-page .posts-nav-wrapper a.btn:last-of-type {
float: right;
}
.track.full,
.track.full.invert {
height: 100%;
padding-top: 96px !important;
padding-bottom: 96px !important;
margin-top: 0 !important;
}
.track.full::before,
.track.full.invert::before {
width: calc(100% - 32px);
height: 100%;
top: 0 !important;
}
.track.full::before {
border-top-right-radius: 700px !important;
border-bottom-right-radius: 700px !important;
left: 0;
}
.track.full.invert::before {
border-top-left-radius: 700px !important;
border-bottom-left-radius: 700px !important;
border-top-right-radius: 0 !important;
border-bottom-right-radius: 0 !important;
right: 0;
left: auto;
}
.track.full .track-hoop,
.track.full.invert .track-hoop {
top: -15px !important;
}
.vertical-track {
position: absolute;
width: 632px;
max-width: calc(100% - 48px);
height: calc(100% - 352px);
min-height: 500px;
border: 2px solid #FFFFFF;
z-index: 4;
left: 50%;
top: 0;
transform: translateX(-50%);
border-top: none;
border-bottom-left-radius: 632px;
border-bottom-right-radius: 632px;
}
#further-treatments {
padding: 0 !important;
overflow: hidden;
}
.ft-col {
padding-top: 160px;
padding-bottom: 160px;
position: relative;
}
.ft-title {
display: block;
text-align: center;
margin: 8px auto;
padding: 0 !important;
}
.ft-col .btn {
display: table;
margin-left: auto;
margin-right: auto;
margin-top: 0 !important;
position: relative;
z-index: 99;
}
.track.full .btn {
position: relative;
z-index: 99;
}
.ft-col::before {
position: absolute;
content: '';
height: 100%;
width: calc(100% - 32px);
border: 2px solid #FFFFFF;
top: 0;
left: 16px;
border-top: none;
border-bottom-left-radius: 380px;
border-bottom-right-radius: 380px;
}
.ft-col.offset-lg-8::before {
transform: rotate(180deg);
}
.home {
overflow-x: hidden;
}
.animated-icon1,
.animated-icon2,
.animated-icon3 {
width: 30px;
height: 20px;
position: relative;
margin: 0px;
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-transition: .5s ease-in-out;
-moz-transition: .5s ease-in-out;
-o-transition: .5s ease-in-out;
transition: .5s ease-in-out;
cursor: pointer;
}
.animated-icon1 span,
.animated-icon2 span,
.animated-icon3 span {
display: block;
position: absolute;
height: 3px;
width: 100%;
border-radius: 9px;
opacity: 1;
left: 0;
-webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
-o-transform: rotate(0deg);
transform: rotate(0deg);
-webkit-transition: .25s ease-in-out;
-moz-transition: .25s ease-in-out;
-o-transition: .25s ease-in-out;
transition: .25s ease-in-out;
}
.animated-icon3 span:nth-child(1) {
top: 0px;
-webkit-transform-origin: left center;
-moz-transform-origin: left center;
-o-transform-origin: left center;
transform-origin: left center;
}
.animated-icon3 span:nth-child(2) {
top: 10px;
-webkit-transform-origin: left center;
-moz-transform-origin: left center;
-o-transform-origin: left center;
transform-origin: left center;
}
.animated-icon3 span:nth-child(3) {
top: 20px;
-webkit-transform-origin: left center;
-moz-transform-origin: left center;
-o-transform-origin: left center;
transform-origin: left center;
}
.animated-icon3.open span:nth-child(1) {
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
top: 0px;
left: 8px;
}
.animated-icon3.open span:nth-child(2) {
width: 0%;
opacity: 0;
}
.animated-icon3.open span:nth-child(3) {
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
top: 21px;
left: 8px;
}
.animated-icon3 span {
background: #FFFFFF;
-webkit-transition: .25s ease-in-out;
-moz-transition: .25s ease-in-out;
-o-transition: .25s ease-in-out;
transition: .25s ease-in-out;
}
.animated-icon3.open span {
background: #E20A1A;
}
button.navbar-toggler.third-button,
button.navbar-toggler.third-button:focus,
button.navbar-toggler.third-button:active {
outline: none !important;
border: none !important;
box-shadow: none !important;
}
.parallax-window {
min-height: 400px;
background: transparent;
}
.client-reviews-wrapper,
.service-listing-wrapper#os-wrapper {
margin-top: 32px;
}
div.home-section#what-we-treat {
padding-bottom: 192px;
}
.hub-hidden div.home-section#what-we-treat {
padding-bottom: 128px !important;
}
.di-accred {
margin-top: 32px;
position: relative;
z-index: 999;
}
.di-accred a {
transition: all 0.4s ease;
}
.di-accred a:hover {
text-decoration: none;
color: #00d999 !important;
}
.di_name {
text-decoration: underline;
transition: all 0.4s ease;
}
.di-accred a:hover .di_name {
color: #00d999 !important;
}
.pdf-available #book-btn {
margin-right: 8px;
}
.treatment-panel .btn {
margin-top: 8px;
}
.treatment-panel .treatment-content {
margin-bottom: 24px;
}
body.booking-disabled #menu-item-143 {
display: none !important;
}
.member-cta-wrapper .btn {
margin-right: 8px;
} #links-main-wrapper {
padding-top: 40px;
}
#links-main-wrapper {
column-count: 2;
column-gap: 40px;
}
#links-main-wrapper > .links-list-wrapper {
break-inside: avoid;
margin: 0 0 30px 0;
display: inline-block;
width: 100%;
}
#links-main-wrapper > .links-list-wrapper .service {
margin-bottom: 20px;
} @supports (grid-template-rows: masonry) {
#links-main-wrapper {
display: grid;
grid-template-columns: repeat(2, 1fr); grid-template-rows: masonry; gap: 1rem;
column-count: initial; }
#links-main-wrapper > .links-list-wrapper {
display: block; margin: 0; }
@media (max-width: 700px){
#links-main-wrapper{
grid-template-columns: 1fr;
}
}
}
@media (min-width: 1350px) {
#bg-video {
width: 100%;
}
}
@media (min-width: 1200px) {
.client-reviews-wrapper,
.service-listing-wrapper#os-wrapper {
margin-top: 32px;
column-count: 2;
-moz-column-count: 2;
-webkit-column-count: 2;
column-gap: 32px;
-moz-column-gap: 32px;
-webkit-column-gap: 32px;
} .menu-item-143 a {
text-transform: none !important;
background-color: #E20A1A !important;
border-radius: 24px !important;
vertical-align: middle;
padding-left: 24px;
padding-right: 24px;
margin-left: 8px;
margin-right: 8px;
}
}
@media (max-width: 1400px) {
a.dropdown-item {
margin: 8px auto;
}
body:not(.theme-preset-active) #masthead .navbar-nav>li>a {
padding-left: 0 !important;
padding-right: 0 !important;
font-size: 12px !important;
}
body:not(.theme-preset-active) #masthead .navbar-nav li a {
font-size: 12px !important;
}
#menu-primary {
margin: 12px auto 6px;
}
}
@media (min-width: 992px) and (max-width: 1440px) {
.track.full {
padding-left: 154px !important;
padding-right: 154px !important;
}
}
@media (min-width: 992px) {
.height-col-row .absolute {
position: absolute;
top: 50%;
transform: translateY(-50%);
}
}
@media (max-width: 992px) {
.page-section .row .col-lg-6:last-of-type .circular-img {
max-width: 400px;
margin-left: auto !important;
margin-right: auto !important;
}
.single-member-headshot {
margin: 0 auto 32px;
max-width: 380px;
max-height: 380px;
}
.blog-wrapper,
.booking-wrapper {
margin-bottom: 64px !important;
}
.cta-strip {
padding: 64px 16px;
}
.partner-logos {
padding-top: 64px;
padding-bottom: 64px;
}
footer {
padding-top: 64px;
}
img.footer-logo {
margin-top: 32px;
float: left;
}
.home-about-image {
margin-top: 32px;
}
.services-section {
padding: 32px 0;
}
#orthopaedic-services {
padding-top: 64px;
}
#pilates-image,
#general-practitioners-image {
display: none;
}
.additional-copy {
margin-bottom: 0;
}
#about-content-1 .circular-img,
#about-content-2 .about-copy-col {
margin-bottom: 48px;
}
.treatment-col,
.news-col {
margin-bottom: 32px;
}
.ft-title {
margin: 48px auto;
}
#step-counter {
display: none;
}
.track.full::before,
.track.full .track-hoop,
#about-content .track::before,
#about-content .track-hoop,
#team-members .track::before,
#team-members .track .track-hoop {
display: none !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
margin: 0 !important;
}
.track.full,
.track.full.invert,
#about-content .track,
#team-members .track {
padding-top: 0 !important;
padding-bottom: 0 !important;
}
.contact-col {
margin-bottom: 32px;
}
.home-section {
padding: 64px 0;
}
}
@media (max-width: 767px) {
.hub-hidden div#home-header {
min-height: 0 !important;
padding-bottom: 300px !important;
}
.ft-col {
margin-left: 8px !important;
margin-right: 8px !important;
}
.treatment-card-icon {
margin-bottom: 0;
}
.treatment-card {
padding: 24px !important;
}
#home-header {
padding-top: 128px;
padding-bottom: 128px;
}
.header-copy-wrapper {
padding: 0 32px;
}
.header {
padding-top: 64px;
}
.footer-col {
margin-bottom: 24px;
}
.footer-col#mini-menu {
margin-bottom: 0 !important;
}
.news-col {
margin-bottom: 32px;
}
.news-col:last-of-type {
margin-bottom: 0;
}
h1,
.h1 {
font-size: 34px !important;
}
h2,
.h2 {
font-size: 26px !important;
}
h3,
.h3 {
font-size: 18px !important;
} #links-main-wrapper {
column-count: 1;
}
}
@media (max-width: 576px) {
.cc-message {
display: block;
width: 100%;
clear: both;
position: relative;
flex: none;
margin: 0;
}
div#cookieconsent {
margin-right: 0 !important;
flex: none !important;
}
div#cc-window {
flex-direction: column;
padding: 16px 24px !important;
}
.cmplz-categories-wrap {
width: 100%;
}
.cc-compliance.cc-highlight {
display: block;
width: 100% !important;
}
.single-member-headshot {
margin: 0 auto 32px;
max-width: 300px;
max-height: 300px;
}
.cc-btn {
margin-left: 0 !important;
margin-right: 0 !important;
margin-top: 8px !important;
}
#home-header {
padding-top: 96px;
padding-bottom: 96px;
}
.form-container form p:first-of-type,
.form-container form p:nth-of-type(2) {
width: 100%;
display: block !important;
float: none !important;
}
h1,
.h1 {
font-size: 30px !important;
}
h2,
.h2 {
font-size: 25px !important;
}
h3,
.h3 {
font-size: 17px !important;
}
p,
body,
li,
span,
footer h4,
footer a {
font-size: 13px !important;
line-height: 1.624 !important;
}
}
@media (min-width: 410px) and (max-width: 991px) {
.col-lg-3.col-md-6.col-sm-6.member-col {
max-width: 50% !important;
}
}