/* Custom CSS lifted verbatim from the live pages' inline <style> blocks.
 *
 * Generated by scripts/pull-custom-css.mjs. Do not hand-edit: re-run it.
 *
 * These rules never lived in shared.min.css, and the ones Webflow puts in
 * <head> were lost entirely because the port keeps only <body>. They cover the
 * cookie consent banner, the locations dropdown, the mega-menu arrow states,
 * the before/after sliders on the case studies and assorted fixes.
 */

/* --- from every page --- */
/*  level 1 */
  .primary-dropdown-link-2 img.dropdown-arrow {
    -webkit-transition:all 0.1s;
    transition:all 0.1s;
  }
  .primary-dropdown-link-2.w--open img.dropdown-arrow.open.done {
    -webkit-transition:none!important;
    transition:none!important;
    transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(180deg) skew(0deg, 0deg)!important;
  }  
  
  /*  level 2 */
  .dd-link-lv2 img.dd-arrow-lv2 {
    -webkit-transition:all 0.1s;
    transition:all 0.1s;
  }
  .dd-link-lv2.w--open img.dd-arrow-lv2.open.done {
    -webkit-transition:none!important;
    transition:none!important;
    transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(180deg) skew(0deg, 0deg)!important;
  }

/* --- from every page --- */
.w-lightbox-backdrop {
    z-index: 9999;
  }

/* --- from every page --- */
img.close-policy {
position: absolute;
top: calc(50% - 45vh + 20px);
left: calc(50% + 45vw - 45px);
cursor: pointer;
z-index: 1000000;
mix-blend-mode: difference;
}
img.close-policy:hover { opacity:0.8; }

/* --- from every page --- */
.max-width-container.form-inner.active { z-index:9999; }

/* --- from every page --- */
*:focus{ outline:none; }

/* --- from every page --- */
body { overflow-x: hidden!important; }

/* --- from every page --- */
.hp-slider-mask .hp-ft-col-item {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    position: relative;
}
.hp-slider-mask .w-dyn-items {
    display: flex;
    flex-direction: row;
    column-gap: 20px;
}

/* --- from every page --- */
.faq-list-item.dark.inactive {opacity: .3 !important; }

/* --- from /, /about, /services, /services/performance/search-engine-optimisation, /services/creative/photography-videography, /our-work, /our-work/straight-smiles-specialist-orthodontic-care, /our-blog, /booking, /get-more-patients --- */
/*.cookie-consent-banner{
    display: block;
    -webkit-transition: all 0.8s ease-in-out;
    transition: all 0.8s ease-in-out;
    left: -100%;
}
.cookie-consent-banner.show {
    left: 0;
}
.cookie-setting {
    display: block;
    -webkit-transition: all 0.8s ease-in-out;
    transition: all 0.8s ease-in-out;
    opacity: 0;
}

.cookie-setting.show { 
  opacity: 1;  
}*/

.cookie-consent-banner.show,
.cookie-setting.show {
  display:flex!important;
}

.cookie-consent-banner {
  z-index: 99999999999!important;
}
.cookie-consent-cta {
    display: flex;
    margin-top: 10px;
    column-gap: 5px;
    row-gap: 5px;
    flex-direction: row;
    flex-wrap: wrap;
}
.cookie-consent-button {
    font-size:11px!important;
    line-height: 13px !important;
    padding: 10px 22px !important;
    height: 42px !important;
}
.cookie-consent-options {
    display: flex;
    flex-wrap: wrap;
    column-gap: 15px;
    row-gap: 5px;
    font-weight: 300;    
    margin-top: 10px;
    margin-bottom: 5px;
}
.cookie-consent-options label {
    color: var(--p-main);
    margin-bottom: 5px;
    font-weight: 200;
    display: flex;
    column-gap: 5px;
    font-size: 12px;
    line-height: 16px;
    flex-direction: row;
    align-content: center;
}

/*  switch */
.consent-options {
    display: flex;
}
.switch {
  position: relative;
  display: inline-block;
  width: 30px;
  height: 17px;
}

.switch input { 
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  -webkit-transition: .4s;
  transition: .4s;
}

.slider:before {
  position: absolute;
  content: "";
  height: 10px;
  width: 10px;
  left: 4px;
  bottom: 4px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

.cookie-consent-options input:checked + .slider {
  background-color: var(--dark-navy);
}

.cookie-consent-options input:focus + .slider {
  box-shadow: 0 0 1px var(--dark-navy);
}

.cookie-consent-options input:checked + .slider:before {
  -webkit-transform: translateX(13px);
  -ms-transform: translateX(13px);
  transform: translateX(13px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}

span.option-text {
    margin-left: 7px;
    font-weight: 200;
    font-size: 12px;
    line-height: 16px;
    color: var(--p-main);
}
span.slider.round.disabled {
    background-color: var(--dark-navy);
    opacity: 0.8;
    cursor: default;
}

@media screen and (max-width: 767px) {
  .cookie-consent-cta, .cookie-consent-options { justify-content: center;  }
  .close-cookie {
        right: 15px;
    }
}
@media screen and (max-width: 479px) {
   .sticky-nav-2 { z-index: 99999999 !important; }
}

/* --- from /, /about, /services, /services/performance/search-engine-optimisation, /services/creative/photography-videography, /our-work, /our-work/straight-smiles-specialist-orthodontic-care, /our-blog --- */
/*  hover over services link and tranform teh image */
.primary-dropdown-link-2:hover img.dropdown-arrow {
    transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(180deg) skew(0deg, 0deg);
}

@media screen and (max-width: 991px) { 
  .nav-menu-4 {
    box-shadow: 0 0 15px 10px rgba(0, 0, 0, .2);
    /*box-shadow: 0 1px 18px 1px rgba(0, 0, 0, .3);*/
  }

  /*  menu position */
  .header-navigation .w-nav-overlay {
    bottom: 0;
    top: auto;
    overflow: visible;
  } 
  /*  overlay on menu */
  .header-navigation .w-nav-overlay:before {
    content: "";
    position: absolute;
    bottom: -11px;
    left: 0;
    display: flex;
    width: 100%;
    height: 100%;
    background: linear-gradient(to top, rgba(255, 255, 255, 1), 35%, rgb(255, 255, 255, 0));
    z-index: -1;
}
  
  /*  mene background color */
  .menu-button-2.w--open {
    background-color: var(--white);
  }
  
  /*   hover on services link */
  .primary-dropdown-link-2:hover a.dropdown-nav-link-2 {
    color: var(--td-green);
  }
  
  /*  menu close button */
  .menu-button-2.w--open .icon-4 { display:none; }
  .menu-button-2.w--open .mobile-close { display:flex; }
  
  /*  hide arrow */
  .dropdown-container .column-2 img, 
  .dropdown-container .column-3 img {
    display:none!important;
  }
  
}

@media screen and (max-width: 767px) {

    .header-nav::-webkit-scrollbar-thumb {
        border-radius: 10px;
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
        background-color: #c1c3c5;
        border-radius:20px;
    }

    .header-nav::-webkit-scrollbar-track {
        border-radius: 10px;
    }

    .header-nav::-webkit-scrollbar {
        width: 5px;
        height: 5px;
        border-radius:20px;
    }
    
    .dropdown-list-lv-1.w--open {
        overflow: auto;
    }
}

/* --- from /, /about, /services, /services/performance/search-engine-optimisation, /services/creative/photography-videography, /our-work, /our-work/straight-smiles-specialist-orthodontic-care, /our-blog, /booking, /get-more-patients --- */
.selected-location .location-name { display: none; }
  .selected-location .location-item { padding-top:4px; padding-bottom:4px; min-width: 0; justify-content: center!important; }
  .locations-div.open .location-list { display:flex; }
 /* .locations-div.open { border-radius: 25px 25px 0 0; } */
 /* .location-list .location-item.selected { display:none; }*/
  
  /* .location-list:before {
    content: "";
    position: absolute;
    border-top: 1px solid #334853;
    width: calc(100% - 30px);
    height: 1px;
    top: 1px;
    left: 15px;
  } */
  
  #location-popup-overlay.show { display:flex; }
  
  /* hover on location list */
  /*.location-list:hover .location-item { opacity: 0.6;  }
  .location-list:hover .location-item:hover { opacity: 1;  }*/
  
  /* hover over selected link on top */
  .selected-location .location-item:hover { background-color: var(--light-navy); }
  
  /*  tablet display */
@media screen and (max-width: 991px) {
    .location-name { display:none!important; }
    .location-code { 
      display: flex!important;
      font-size: 12px;
      font-weight: 200;
      line-height: 28px;
      min-width: 25px;
      justify-content: space-around;
    }
    .location-icon {
      width: 28px;
      height: 28px;
    }
    .location-list { 
      top:50px; 
      min-width: auto; 
      padding: 5px 0 10px;
      border-radius: 0 0 25px 25px;
    }
    .selected-location .location-item,
    .location-item { 
      padding: 6px 15px; 
      min-width: 100px;
    }
    .location-list:before {
      content: "";
      position: absolute;
      border-top: 1px solid #334853;
      width: calc(100% - 30px);
      height: 1px;
      top: 0px;
      left: 15px;
    }
    
    .locations-div.open { 
      border-radius: 25px 25px 0 0; 
    }
    
    .location-item:hover {
      background-color: transparent;
      color: var(--td-green);
    }
    
    .selected-location { 
      width:auto; 
      color: var(--td-green);    
      height: 50px;
    }
    .locations-div.open .selected-location .location-item {      
      color: var(--td-green);  
    }
    
  /* overlay when click on country selection */  
  .mobile-loc.open:before {
    content: "";
    width: calc(100vw - 60px);
    height: 350px;
    background-color: rgba(12, 33, 45, 0.8);
    position: absolute;
    right: 0;
    top: -20px;
    display: flex;
    border-radius: 20px;
  }

}
  
  /*  mobile display */
@media screen and (max-width: 479px) {
  /* overlay when click on country selection */  
  .mobile-loc.open:before {
    width: calc(100vw - 40px);
  }

}

/* --- from / --- */
.hp-slider-mask .hp-ft-col-item  .solid-circ.hov {
    opacity: 0;
    transition: all ease-in-out 0.5s;
    transform: translate3d(-10px, 10px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg);
    transform-style: preserve-3d;
}

.hp-slider-mask .hp-ft-col-item:hover .solid-circ.hov {
    opacity: 1;
    transform: translate3d(0px, 0px, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg, 0deg);
    transform-style: preserve-3d;
}

/* --- from every page --- */
.image-gallery.journey{
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 auto;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
}
.image-gallery p.journey-p br {display: none;}

/* --- from /about, /services --- */
.is-visible .timeline-progress-bar {
    opacity: 1;
    z-index: 0;
}

/* --- from /about, /services --- */
.loo-clln-list {
  /*position: absolute;
  white-space: nowrap;*/
  will-change: transform;
  animation: marquee-horizontal-logos 180s linear infinite;
  /* manipulate the speed of the marquee by changing "40s" line above*/
}
  .loo-clln-list._1 {
    animation: marquee-horizontal-logos 180s linear infinite;
  }
  .loo-clln-list._3 {
    animation: marquee-horizontal-logos 280s linear infinite;
  }
  .loo-clln-list._5 {
    animation: marquee-horizontal-logos 210s linear infinite;
  }

@keyframes marquee-horizontal-logos {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
/*  larger breakpoint */
/*@media screen and (min-width: 1280px) {
  .loo-clln-list._1 {
    animation: marquee-horizontal-logos 180s linear infinite;
  }
  .loo-clln-list._3 {
    animation: marquee-horizontal-logos 260s linear infinite;
  }
  .loo-clln-list._5 {
    animation: marquee-horizontal-logos 190s linear infinite;
  }
@media screen and (min-width: 1920px) {
  /* add speed here*/
}*/

/*  ipad */
@media screen and (max-width: 991px) {

  .loo-clln-list._1 {
    animation: marquee-horizontal-logos 90s linear infinite;
  }
  .loo-clln-list._3 {
    animation: marquee-horizontal-logos 150s linear infinite;
  }
  .loo-clln-list._5 {
    animation: marquee-horizontal-logos 100s linear infinite;
  }
}

/*  ipad/mobile */
@media screen and (max-width: 767px) {
}

/*  ipad/mobile */
@media screen and (max-width: 479px) {
}

/* --- from /about, /services --- */
.loo-clln-list._1 { width: 680vw; }
.loo-clln-list._2 { width: 920vw; }
.loo-clln-list._3 { width: 1060vw; }
.loo-clln-list._4 { width: 900vw; }
.loo-clln-list._5 { width: 800vw; }

/* --- from /our-work --- */
.cs-item-div.lazyload .cs-div-hover,
  .cs-item-div.lazyload {
    background: none !important;
    height: 0 !important;
  }
  .cs-item-div.lazyload .cs-div {
    display:none!important;
  }

/* --- from /our-work --- */
.cs-item-div:hover .cs-div {
    display:none !important;
}
.cs-item-div:hover .cs-div-hover {
    transition: all ease-in-out 0.5s !important;
}
.cs-item-div .cs-div-hover {
    transition: all ease-in-out 0.1s !important;
}
.cs-item-div .cs-div-hover {
    opacity: 0;
    display: flex;
}
.cs-item-div:hover .cs-div-hover {
    opacity: 1 !important;
    display: flex !important;
}
.cs-link {
    margin-left: -20px;
    margin-top: -20px;
}

/* --- from /our-work --- */
.case-study-wrapper,
   .case-study-wrapper .case-study-col-grd {
      transition: all ease-in-out 0.2s;
   }
   .case-study-wrapper.open, 
   .case-study-wrapper.open .case-study-col-grd {
    transition: all ease-in-out 0.5s;
  }
  .case-study-wrapper.open {
     width: calc(100vw + 25vw);  
  }
  
  .case-study-wrapper.open .case-study-col-grd {
     grid-template-columns: 1fr 1.75fr 1.75fr 1fr;
  }
  
  /*.case-study-wrapper.open .cs-item-div {
    max-width: calc((125vw) / 5);
  }*/
  
  /* 2nd item */
  .case-study-item:nth-child(4n - 2) .cs-item-div {
    margin-left: 0;
    margin-right: auto;
  }
  
  /* 3rd item */
  .case-study-item:nth-child(4n - 1) .cs-item-div {
    margin-left: auto;
    margin-right: 0;
  }
  
  
  .case-study-wrapper .cs-item-div {
      width: calc(25vw - 24px);
  }
  
  .btn-txt.tag { color: var(--p-main) !important; }
  
  /*  update to close when open */  
  .filter-circ {
    transition: ease-in-out 0.5s;
  }
  div.case-study-pg .filter-circ:before {
    content: "";
    width: 100px;
    height: 100px;
    position: absolute;
    display: block;
    border-radius: 50%;
    background-image: url(https://cdn.prod.website-files.com/65cf50253f4a97ad82250d93/66acb6d0751718aeb42585b4_close-white.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 25px;
    transition: opacity ease-in-out 0.2s;
    background-color: var(--td-pink);
    opacity: 0;
  }
  
  div.case-study-pg.open .filter-circ:before {
    opacity: 1;
    transition: opacity ease-in-out 1s;
  }

/* --- from /our-work --- */
@media screen and (min-width: 1920px) {
  
  .case-study-wrapper .case-study-col-grd {
     grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;  
  }
  .case-study-wrapper.open .case-study-col-grd {
     grid-template-columns: 1fr 1fr 1.75fr 1.75fr 1fr 1fr;
  }
  /*  reset */
  
  .case-study-item:nth-child(4n - 2) .cs-item-div 
  .case-study-item:nth-child(4n - 1) .cs-item-div {
    margin-left: 0;
    margin-right: 0;
  }

  /* 3rd item */
  .case-study-item:nth-child(6n - 3) .cs-item-div {
    margin-left: 0;
    margin-right: auto;
  }
  
  /* 4th item */
  .case-study-item:nth-child(6n - 2) .cs-item-div {
    margin-left: auto;
    margin-right: 0;
  }  
  
  .case-study-wrapper .cs-item-div {
      width: calc((100vw / 6) - 16px - 10px);
  }
  
}

@media screen and (max-width: 991px) {

  .case-study-wrapper.open {
    width: calc(100vw + 40vw);
  }
  .filter {
    width: 40vw;
  }

  .case-study-wrapper.open .case-study-col-grd {
     grid-template-columns: 1.75fr 1.75fr;
  }
  
  /*  reset */
  
  .case-study-item:nth-child(4n - 2) .cs-item-div 
  .case-study-item:nth-child(4n - 1) .cs-item-div {
    margin-left: 0;
    margin-right: 0;
  }

  /* first item */
  .case-study-item:nth-child(2n - 1) .cs-item-div {
    margin-left: 0;
    margin-right: auto;
  }
  
  /* 2nd item */
  .case-study-item:nth-child(2n) .cs-item-div {
    margin-left: auto;
    margin-right: 0;
  }  
  
  .case-study-wrapper .cs-item-div {
      width: calc(50vw - 24px - 10px);
  }
}

@media screen and (max-width: 615px) {
  .filter-tags {
    overflow: hidden;
    max-height: calc(100vh - 60px - 100px - 100px);
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0 5px;
  }
}


@media screen and (max-width: 479px) {
  .case-study-wrapper .cs-item-div {
      width: calc(50vw - 15px);
  }
}

/* --- from /our-work/straight-smiles-specialist-orthodontic-care --- */
#beforeafter {
  width: 1260px;  
  max-width: 100%;
  margin: 0 auto;
  height:824px;
  min-height: 799px;
}
/* Plugin CSS */
.twentytwenty-horizontal .twentytwenty-handle:before,
.twentytwenty-horizontal .twentytwenty-handle:after,
.twentytwenty-vertical .twentytwenty-handle:before,
.twentytwenty-vertical .twentytwenty-handle:after {
  content: " ";
  display: block;
  background: #00ffc7;
  position: absolute;
  z-index: 30;
  /*-webkit-box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);
  -moz-box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);
  box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);*/
}
.twentytwenty-horizontal .twentytwenty-handle:before,
.twentytwenty-horizontal .twentytwenty-handle:after {
  width: 6px;
  height: 9999px;
  left: 50%;
  margin-left: -3px;
}
.twentytwenty-vertical .twentytwenty-handle:before,
.twentytwenty-vertical .twentytwenty-handle:after {
  width: 9999px;
  height: 6px;
  top: 50%;
  margin-top: -3px;
}
.twentytwenty-left-arrow,
.twentytwenty-right-arrow,
.twentytwenty-up-arrow,
.twentytwenty-down-arrow {
  width: 0;
  height: 0;
  border: 6px inset transparent;
  position: absolute;
}
.twentytwenty-left-arrow,
.twentytwenty-right-arrow {
  top: 50%;
  margin-top: -6px;
}
.twentytwenty-up-arrow,
.twentytwenty-down-arrow {
  left: 50%;
  margin-left: -6px;
}
.twentytwenty-container {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  z-index: 0;
  overflow: hidden;
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
}
.twentytwenty-container img {
  max-width: 100%; 
  min-width: 100%;
  min-height: auto;
  width: 100%;
  height: auto;
  position: absolute;
  top: 0;
  display: block;
}
.twentytwenty-container.active .twentytwenty-overlay,
.twentytwenty-container.active:hover.twentytwenty-overlay {
  background: rgba(0, 0, 0, 0);
}
.twentytwenty-container.active .twentytwenty-overlay .twentytwenty-before-label,
.twentytwenty-container.active .twentytwenty-overlay .twentytwenty-after-label,
.twentytwenty-container.active:hover.twentytwenty-overlay .twentytwenty-before-label,
.twentytwenty-container.active:hover.twentytwenty-overlay .twentytwenty-after-label {
  opacity: 0;
}
.twentytwenty-container * {
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}
.twentytwenty-overlay {
  -webkit-transition-property: background;
  -moz-transition-property: background;
  transition-property: background;
  background: rgba(0, 0, 0, 0);
  z-index: 25;
}
.twentytwenty-before {
  z-index: 20;
}
.twentytwenty-after {
  z-index: 10;
}
.twentytwenty-handle {
  height: 32px;
  width: 48px;
  position: absolute;
  left: 50%;
  top: 66.67%;
  margin-left: -27px;
  margin-top: -27px;
  border: 3px solid #00ffc7;
  background-color: #00ffc7;
  /*background: url('https://cdn.prod.website-files.com/65cf50253f4a97ad82250d93/65e0a8c6704d1bb215af7ece_baa-arw.svg') no-repeat 5px 5px 5px 5px;*/
  -webkit-border-radius: 1000px;
  -moz-border-radius: 1000px;
  border-radius: 1000px;
  /*-webkit-box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);
  -moz-box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);
  box-shadow: 0px 0px 12px rgba(51, 51, 51, 0.5);*/
  z-index: 40;
  cursor: pointer;
}
.twentytwenty-horizontal .twentytwenty-handle:before {
  bottom: 50%;
  margin-bottom: 18px;
  /*-webkit-box-shadow: 0 3px 0 #00ffc7, 0px 0px 12px rgba(51, 51, 51, 0.5);
  -moz-box-shadow: 0 3px 0 #00ffc7, 0px 0px 12px rgba(51, 51, 51, 0.5);
  box-shadow: 0 3px 0 #00ffc7, 0px 0px 12px rgba(51, 51, 51, 0.5);*/
}
.twentytwenty-horizontal .twentytwenty-handle:after {
  top: 50%;
  margin-top: 18px;
 /* -webkit-box-shadow: 0 -3px 0 #00ffc7, 0px 0px 12px rgba(51, 51, 51, 0.5);
  -moz-box-shadow: 0 -3px 0 #00ffc7, 0px 0px 12px rgba(51, 51, 51, 0.5);
  box-shadow: 0 -3px 0 #00ffc7, 0px 0px 12px rgba(51, 51, 51, 0.5);*/
}
.twentytwenty-vertical .twentytwenty-handle:before {
  left: 50%;
  margin-left: 22px;
  /*-webkit-box-shadow: 3px 0 0 #00ffc7, 0px 0px 12px rgba(51, 51, 51, 0.5);
  -moz-box-shadow: 3px 0 0 #00ffc7, 0px 0px 12px rgba(51, 51, 51, 0.5);
  box-shadow: 3px 0 0 #00ffc7, 0px 0px 12px rgba(51, 51, 51, 0.5);*/
}
.twentytwenty-vertical .twentytwenty-handle:after {
  right: 50%;
  margin-right: 22px;
  /*-webkit-box-shadow: -3px 0 0 #00ffc7, 0px 0px 12px rgba(51, 51, 51, 0.5);
  -moz-box-shadow: -3px 0 0 #00ffc7, 0px 0px 12px rgba(51, 51, 51, 0.5);
  box-shadow: -3px 0 0 #00ffc7, 0px 0px 12px rgba(51, 51, 51, 0.5);*/
}
.twentytwenty-left-arrow {
  /*border-right: 6px solid white;
  left: 50%;
  margin-left: -17px;*/
  display:none;
}
.twentytwenty-right-arrow {
  /*border-left: 6px solid white;
  right: 50%;
  margin-right: -17px;*/
  right: 50%;
    margin-right: -14px;
    width: 16px;
    background: url(https://cdn.prod.website-files.com/65cf50253f4a97ad82250d93/65e0a8c6704d1bb215af7ece_baa-arw.svg) no-repeat;
    background-size: 28px;
    background-position: center;
    height: 1px;
}
.twentytwenty-up-arrow {
  border-bottom: 6px solid white;
  top: 50%;
  margin-top: -17px;
}
.twentytwenty-down-arrow {
  border-top: 6px solid white;
  bottom: 50%;
  margin-bottom: -17px;
}

/* --- from /our-work/straight-smiles-specialist-orthodontic-care --- */
@media screen and (max-width: 1380px){
  #beforeafter { min-height:56vw; }
}
/*@media screen and (max-width: 991px){
  #beforeafter { width: 80vw; }
}*/

/* --- from /booking --- */
@media (min-width:992px) {html.w-mod-js:not(.w-mod-ix) [data-w-id="7fcf27dd-152d-186d-62a1-944f4d5c3fe3"] {-webkit-transform:translate3d(0, 0px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(0, 0px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(0, 0px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(0, 0px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);}html.w-mod-js:not(.w-mod-ix) [data-w-id="7fcf27dd-152d-186d-62a1-944f4d5c3ff7"] {-webkit-transform:translate3d(0, 220px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(0, 220px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(0, 220px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(0, 220px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);}}@media (max-width:991px) and (min-width:768px) {html.w-mod-js:not(.w-mod-ix) [data-w-id="7fcf27dd-152d-186d-62a1-944f4d5c3fe3"] {-webkit-transform:translate3d(0, 0px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(0, 0px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(0, 0px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(0, 0px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);}html.w-mod-js:not(.w-mod-ix) [data-w-id="7fcf27dd-152d-186d-62a1-944f4d5c3ff7"] {-webkit-transform:translate3d(0, 220px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-moz-transform:translate3d(0, 220px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);-ms-transform:translate3d(0, 220px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);transform:translate3d(0, 220px, 0) scale3d(1, 1, 1) rotateX(0) rotateY(0) rotateZ(0) skew(0, 0);}}

/* --- from /booking --- */
#_form_7_wrapper form._form_7 {
   background:transparent!important;
}
._form_7 ._form_element {
   display: none;
}
._form_7 ._form_element.active {
   display:block;
}

/*  step value */
span.current-step,
span.total-step {
  display:none;
}

/*  step header */
.step_header {
    position: absolute;
    top: 0;
    right: 0;
}
.step_div {
    position: relative;
    display: flex;
    flex-direction: row;
    column-gap: 5px;
    color: var(--td-green);
    align-content: center;    
    font-weight: 700;
    font-size: 17px;
}
/*  footer button */
._button-wrapper {
    display: grid;
    grid-template-columns: 1fr auto;
    margin-top: 30px;
}
._form-content.last .btn_next ,
._form-content.first .btn_back ,
._form-content ._submit {
    display:none;
}
._form-content.last ._submit {
    display:block;
}
.footer-buttons {
    display: flex;
    width: 100%;
    justify-content: space-between;
    flex-direction: row;
    column-gap: 10px;
    color: var(--white);
    align-items: flex-start;
}
.next_div {
    display: flex;
    flex-direction: column;
    margin-left: auto;
    align-items: center;    
    row-gap: 10px;
}
span.btn_next {
    background-color: var(--td-pink);
    color: var(--white);
    padding: 12px 55px 12px 30px;
    border-radius: 35px;
    background-image: url(https://cdn.prod.website-files.com/65cf50253f4a97ad82250d93/6672cf26913854e93f35d67a_arrow-nxt.svg);
    background-size: 15px;
    background-repeat: no-repeat;
    background-position: center right 30px;
    font-size: 18px;
    cursor: pointer;
}

span.btn_next:hover {
   background-color: #FF00AB !important;
   filter: saturate(150%);
}
/* back button */
.btn_back {
    padding: 12px 12px 12px 30px;
    border-radius: 35px;
    background-image: url(https://cdn.prod.website-files.com/65cf50253f4a97ad82250d93/6672cf2629ab3d10e3c24702_arrow-bck.svg);
    background-size: 15px;
    background-repeat: no-repeat;
    background-position: center left;
    font-size: 18px;
    cursor: pointer;
}

/* last item */
._form-content.last ._submit {
    grid-column-start: 2;
}
._form-content.last .footer-buttons {
    grid-column-start: 1;
    grid-row-start: 1;
}
._form-content.last span.next_info {
    position: absolute;
    bottom: -35px;
    right: 10px;
}
/* next info */

.next_info {
    background-image: url(https://cdn.prod.website-files.com/65cf50253f4a97ad82250d93/66699f3571036f6ba6aa6e35_enter.svg);
    background-size: 10px;
    background-repeat: no-repeat;
    background-position: center right;
    font-size: 14px;
    padding-right: 20px;
}

/*  error message */
.error-msg { 
  color: var(--white);
    background-color: #f84441;
    font-family: "Esklarheitkurrent Rg Trial", sans-serif ! IMPORTANT;
    font-size: 13px !important;
    letter-spacing: 0.5px;
    padding: 16px 20px 16px 48px;
    margin-top: 10px;
    border-radius: 5px;
    font-weight: 400 !important;
    background-image: url(https://cdn.prod.website-files.com/65cf50253f4a97ad82250d93/666abc0db9a7f0f41e81a631_error-white.svg);
    background-size: 18px;
    background-repeat: no-repeat;
    background-position: center left 20px;
  display:none; 
}
.haserror .error-msg { display:block; }
.error-msg.email-msg { display:none!important; }
.hasemailerror .error-msg.email-msg { display:block!important; }

#_form_7_wrapper ._error {
    display: none !important;
}
#_form_7_wrapper ._form-thank-you {
    display:none!important;
}

/* flashing - radio button */
#_form_7_wrapper ._form-fieldset ._checkbox-radio.flash-1 input[type=radio]:checked + span > label {
    animation: 0.2s ease 0s 2 normal none running blicking;
}

/* flashing - textbox */
#_form_7_wrapper ._field-wrapper.flash-2 input {
    animation: 0.2s ease 0s 2 normal none running blicking!important;
}

@keyframes blicking {
    50% {  opacity: 0.3;  }
}

/* --- from /booking, /get-more-patients, /website-optimisation-checklist --- */
.lightbox_overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.75); z-index: 10000001; display: none; }
	.lightbox_overlay iframe { height: 90vh; width: 90vw; position: absolute; top: 50%; left: 50%; margin-left: -45vw; margin-top: -45vh; z-index: 999999; background-color: #fff; border: none; box-shadow: 0 0 20px #000; border-radius: 24px; }
   ._form-thank-you { display:none!important; }