@charset "UTF-8";
/* CSS Document */

:root {
 --primary: #00b0bc;
 --secondary: #0e3a55;
 --text: #414343;
 --portal-pink: #c0246d;
 --portal-orange: #f0802b;
 --portal-green: #58b891;
 --portal-purple: #8b3e90;
 --dark-blue: #09416e;
 --white-fillings: #09416e;
 --veneers: #186f9a;
 --implants: #00b0bc;
 --dentures: #48bcc7;
 --gum-disease: #58b891;
 --root-canal: #f7af24;
 --teeth-straight: #f0802b;
 --whitening: #c0246d;
 --extraction: #812885;
 --invisalign: #3b2a71;
 --grey-text: #c6c6c6;
 --grey-bkg: #f5f4f4;
 --footer: #303030;
--yellow: #f7af24;
--orange: #f0802b;
  --pink: #c0246d;
}

body {
  font-family: 'Lato', sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color: var(--text);
  line-height: 1.4;
}

body.no-scroll {
    overflow: hidden !important;
}
/*Containers*/

/*
@media (max-width:567px) {
  .container {
      padding-left: 1.5rem;
      padding-right: 1.5rem;
  }
}
*/

@media (min-width:1200px) {
  .container-fluid {
    max-width: 1392px;
    margin: 0 auto;
  }
}
.container-fluid {
    padding: 0 1.5rem;
}
.container {
  padding-left: 1.5rem;
/*  padding-left: 4rem;*/
  padding-right: 1.5rem;
/*  padding-right: 4rem;*/
}

@media (min-width:1200px) {
.container {
  max-width: 1200px;
/*  max-width: none;*/
/*
  width: 100%;
  padding-left: 6%;
  padding-right: 6%;
*/
}
}
/*
.container {
  width: 100%;
  padding-right: 2rem;
  padding-left: 2rem;
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 576px) {
  .container {
    max-width: 1200px !important; 
  }
}
.container-fluid {
  width: 90%;
  margin-right: auto;
  margin-left: auto;
}
*/

/* Grid */

/* Colours */

.dark-blue {
  color: var(--dark-blue);
}
.primary {
  color: var(--primary);
}
.pink {
  color: var(--pink);
}
/* Typography */

h3.times {
    margin-bottom: 1.5rem;
}
.contact .intro p.lead {
    font-size: 1.1rem;
}
@media (min-width:768px) {
  .contact .intro p.lead {
    font-size: 1.3rem;
}
  p {
    font-size: 1.1rem;
  }
  footer p {
    font-size: 1rem;
  }
}
sup {
    font-size: 50%;
}
.h3, h3 {
  line-height: 1.4;
}
.h5, h5 {
  line-height: 1.2;
}
h6, .h6 {
  letter-spacing: 0.1em;
}
h1, .h1 {
  color: var(--primary);
  font-weight: 900;
  font-size: 1.8rem;
  margin-bottom: 1.5rem;
}
h3, .h3 {
  font-weight: 900;
  font-size: 1.5rem;
}
h4, .h4 {
  font-size: 1.1rem;
  font-weight: 600;
}
h2, .h2 {
  font-weight: 900;
  font-size: 1.6rem;
}
.h5, h5 {
  font-weight: 900;
  font-size: 1.15rem
}

@media (min-width:768px) {
h1, .h1 {
  font-size: 1.7rem;
}
.h5, h5 {
  font-size: 1.25rem
}  
}

@media (min-width:992px) {
h1, .h1 {
  font-size: 1.9rem;
}
h3, .h3 {
  font-size: 1.6rem;
}
h2, .h2 {
  font-size: 1.7rem;
}
.pullout .lead {
  font-size: 1.5rem;
  }
}

@media (min-width:1200px) {
h1, .h1 {
  font-size: 2.2rem;
}
h3, .h3 {
  font-size: 1.8rem;
}

h2, .h2 {
  font-size: 1.8rem;
}  
  
}
.lead {
  font-size: 1.15rem;
  font-weight: 400;
}
/*.testimonials .lead,*/
.pullout .lead {
    font-weight: 300;
}
@media (min-width:576px) {
.lead {
  font-size: 1.2rem;
}
}

@media (min-width:1200px) {
.lead {
  font-size: 1.5rem;
}
.pullout .lead {
  font-size: 1.7rem;
  }  
}
/*Buttons*/
a {
    color: var(--secondary);
  -webkit-transition: all ease-in-out 0.2s;
  -o-transition: all ease-in-out 0.2s;
  transition: all ease-in-out 0.2s;   
}
a:hover,
a:active,
a:focus {
    color: var(--primary);    
/*

  opacity: 0.5;
  -webkit-transition: all ease-in-out 0.2s;
  -o-transition: all ease-in-out 0.2s;
  transition: all ease-in-out 0.2s; 
*/
  text-decoration: none;
}
.treatments-tabs a {
  font-weight: 600;
}
.btn-primary {
  background: 0;
  border-radius: 0;
  padding: .5rem 1.5rem .5rem 1.5rem;
  text-transform: uppercase;
  font-size: .6rem;
  font-weight: 900;
  letter-spacing: 0.1em;
  border-color: white;
  position: relative;
  text-align: left;
  max-width: 245px;
  width: 100%;
}
.btn-primary.focus, .btn-primary:focus {
  box-shadow: none !important;
}
.btn-blue {
  border-color: var(--primary);
  color: var(--primary);
}
.btn-pink {
  border-color: var(--pink);
  background: var(--pink);
  color: white;
}
.btn-dark-blue {
  border-color: var(--dark-blue);
  color: var(--dark-blue);
}

@media (min-width:992px) {
.btn-primary {
  font-size: .7rem;
}
}
.btn-primary:hover, .btn-primary:active, .btn-primary:focus, .btn-primary.focus, .btn-primary:focus, .btn-primary:not(:disabled):not(.disabled):active {
  background: var(--primary);
  border-color: var(--primary);
  color: #fff;
}
.btn-dark-blue:hover, .btn-dark-blue:active, .btn-dark-blue:focus, .btn-dark-blue.focus, .btn-dark-blue:focus, .btn-dark-blue:not(:disabled):not(.disabled):active {
  background: var(--dark-blue);
  border-color: var(--dark-blue);
  color: #fff;
}

.portal-box .btn-primary:hover, .portal-box .btn-primary:active, .portal-box .btn-primary:focus, .portal-box .btn-primary:not(:disabled):not(.disabled):active {
  background: #ffffff;
  border-color: #ffffff;
}
.treatments-page .portals .portal-box .btn-primary:hover, .treatments-page .portals .portal-box .btn-primary:active, .treatments-page .portals .portal-box .btn-primary:focus, .treatments-page .portals .portal-box .btn-primary:not(:disabled):not(.disabled):active {
  background: #ffffff;
  border-color: #ffffff;
  color: var(--yellow);
}
.team .portals .portal-box .btn-primary:hover, .team .portals .portal-box .btn-primary:active, .team .portals .portal-box .btn-primary:focus, .team .portals .portal-box .btn-primary:not(:disabled):not(.disabled):active,
.appointments .portals .portal-box .btn-primary:hover, .appointments .portals .portal-box .btn-primary:active, .appointments .portals .portal-box .btn-primary:focus, .appointments .portals .portal-box .btn-primary:not(:disabled):not(.disabled):active {
  background: #ffffff;
  border-color: #ffffff;
  color: var(--orange);
}
.home .portal-box .btn-primary:hover, .home .portal-box .btn-primary:active, .home .portal-box .btn-primary:focus, .home .portal-box .btn-primary:not(:disabled):not(.disabled):active {
  color: var(--portal-pink);
}
.home .testimonials .portal-box .btn-primary:hover, .home .testimonials .portal-box .btn-primary:active, .home .testimonials .portal-box .btn-primary:focus, .home .testimonials .portal-box .btn-primary:not(:disabled):not(.disabled):active {
  color: var(--primary);
}
.treatments-page .testimonials .portal-box .btn-primary:hover, .treatments-page .testimonials .portal-box .btn-primary:active, .treatments-page .testimonials .portal-box .btn-primary:focus, .treatments-page .testimonials .portal-box .btn-primary:not(:disabled):not(.disabled):active {
  color: var(--primary);
}
section.testimonials .portal-box .btn-primary:hover, section.testimonials .portal-box .btn-primary:active, section.testimonials .portal-box .btn-primary:focus, section.testimonials .portal-box .btn-primary:not(:disabled):not(.disabled):active {
  color: var(--primary);
}
body.testimonials .portal-box .btn-primary:hover, body.testimonials .portal-box .btn-primary:active, body.testimonials .portal-box .btn-primary:focus, body.testimonials .portal-box .btn-primary:not(:disabled):not(.disabled):active {
  color: var(--gum-disease);
}
body.referrals .portal-box .btn-primary:hover, body.referrals .portal-box .btn-primary:active, body.referrals .portal-box .btn-primary:focus, body.referrals .portal-box .btn-primary:not(:disabled):not(.disabled):active {
  color: var(--portal-purple);
}
body.contact .portal-box .btn-primary:hover, body.contact .portal-box .btn-primary:active, body.contact .portal-box .btn-primary:focus, body.contact .portal-box .btn-primary:not(:disabled):not(.disabled):active {
  color: var(--portal-pink);
}
.treatments .btn-primary {
  align-self: flex-start;
}

@media (min-width:768px) {
.treatments .btn-primary {
  padding-left: .6rem;
  padding-right: .6rem;
  width: 100%;
  max-width: none;
}
}
a.cc-btn.cc-dismiss {
  font-family: 'Lato';
  background: 0 !important;
  border-color: var(--primary);
  font-size: .7rem !important;
  letter-spacing: 0.125em;
  border-radius: 0;
  width: auto !important;
  color: var(--primary);
  padding-left: 3rem !important;
  padding-right: 3rem !important;
  text-transform: uppercase;
}

/*cookie consent ipad fix*/
@media screen and (min-device-width : 385px) {
.cc-window.cc-floating {
  max-width: none !important;
	width: 100% !important;
  flex-direction: row !important;
}
.cc-floating .cc-message {
  width: 100% !important;
  margin-bottom: 0px !important;
}
.cc-window.cc-floating .cc-compliance {
  margin-top: -5px !important;
  float: right !important;
}
.cc-link {
  padding-left: 0px !important;
}
.cc-window.cc-floating .cc-compliance {
  min-width: 100px !important;
}
.cc-bottom {
  bottom: 0 !important;
}
}
/*end fix*/


button:focus {
  outline: none;
}
img.btn-arrow {
  width: .4rem;
  position: absolute;
  right: .6rem;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
}
.arrow-white {
  visibility: hidden;
  opacity: 0;
  -webkit-transition: all ease-in-out .15s;
  -o-transition: all ease-in-out .15s;
  transition: all ease-in-out .15s;
}
.btn-primary:hover .arrow-white,
.btn-primary:not(:disabled):not(.disabled):active .arrow-white {
  opacity: 1;
  visibility: visible;
  -webkit-transition: all ease-in-out .15s;
  -o-transition: all ease-in-out .15s;
  transition: all ease-in-out .15s;
}
.btn-primary:hover .arrow-colour,
.btn-primary:not(:disabled):not(.disabled):active .arrow-colour {
  visibility: hidden;
  opacity: 0;
  -webkit-transition: all ease-in-out .15s;
  -o-transition: all ease-in-out .15s;
  transition: all ease-in-out .15s;
}

.card.fillings .btn-primary {
  border-color: var(--white-fillings);
  color: var(--white-fillings);
}

.card.fillings .btn-primary:hover,
.card.fillings .btn-primary:focus,
.card.fillings .btn-primary:active,
.card.fillings .btn-primary:not(:disabled):not(.disabled):active {
  background: var(--white-fillings);
  border-color: var(--white-fillings);
  color: #fff;
}

.card.veneers .btn-primary {
  border-color: var(--veneers);
  color: var(--veneers);
}

.card.veneers .btn-primary:hover,
.card.veneers .btn-primary:focus,
.card.veneers .btn-primary:active,
.card.veneers .btn-primary:not(:disabled):not(.disabled):active {
  background: var(--veneers);
  border-color: var(--veneers);
  color: #fff;
}

.card.implants .btn-primary {
  border-color: var(--implants);
  color: var(--implants);
}

.card.implants .btn-primary:hover,
.card.implants .btn-primary:focus,
.card.implants .btn-primary:active,
.card.implants .btn-primary:not(:disabled):not(.disabled):active {
  background: var(--implants);
  border-color: var(--implants);
  color: #fff;
}

.card.dentures .btn-primary {
  border-color: var(--dentures);
  color: var(--dentures);
}

.card.dentures .btn-primary:hover,
.card.dentures .btn-primary:focus,
.card.dentures .btn-primary:active,
.card.dentures .btn-primary:not(:disabled):not(.disabled):active {
  background: var(--dentures);
  border-color: var(--dentures);
  color: #fff;
}

.card.gums .btn-primary {
  border-color: var(--gum-disease);
  color: var(--gum-disease);
}

.card.gums .btn-primary:hover,
.card.gums .btn-primary:focus,
.card.gums .btn-primary:active,
.card.gums .btn-primary:not(:disabled):not(.disabled):active {
  background: var(--gum-disease);
  border-color: var(--gum-disease);
  color: #fff;
}

.card.canal .btn-primary {
  border-color: var(--root-canal);
  color: var(--root-canal);
}

.card.canal .btn-primary:hover,
.card.canal .btn-primary:focus,
.card.canal .btn-primary:active,
.card.canal .btn-primary:not(:disabled):not(.disabled):active {
  background: var(--root-canal);
  border-color: var(--root-canal);
  color: #fff;
}

.card.straight .btn-primary {
  border-color: var(--teeth-straight);
  color: var(--teeth-straight);
}

.card.straight .btn-primary:hover,
.card.straight .btn-primary:focus,
.card.straight .btn-primary:active,
.card.straight .btn-primary:not(:disabled):not(.disabled):active {
  background: var(--teeth-straight);
  border-color: var(--teeth-straight);
  color: #fff;
}

.card.extraction .btn-primary {
  border-color: var(--extraction);
  color: var(--extraction);
}

.card.extraction .btn-primary:hover,
.card.extraction .btn-primary:focus,
.card.extraction .btn-primary:active,
.card.extraction .btn-primary:not(:disabled):not(.disabled):active {
  background: var(--extraction);
  border-color: var(--extraction);
  color: #fff;
}

.card.whitening .btn-primary {
  border-color: var(--whitening);
  color: var(--whitening);
}

.card.whitening .btn-primary:hover,
.card.whitening .btn-primary:focus,
.card.whitening .btn-primary:active,
.card.whitening .btn-primary:not(:disabled):not(.disabled):active {
  background: var(--whitening);
  border-color: var(--whitening);
  color: #fff;
}

.card.invisalign .btn-primary {
  border-color: var(--invisalign);
  color: var(--invisalign);
}

.card.invisalign .btn-primary:hover,
.card.invisalign .btn-primary:focus,
.card.invisalign .btn-primary:active,
.card.invisalign .btn-primary:not(:disabled):not(.disabled):active {
  background: var(--invisalign);
  border-color: var(--invisalign);
  color: #fff;
}

/* Navbar */

a.navbar-brand {
  display: block;
  width: 16rem;
  padding-top: 0;
  padding-bottom: 2rem;
  position: relative;
  top: -.05rem;
}

@media (max-width:575px) {
a.navbar-brand {
    width: 100%;
    margin-right: 30%;
}  
}

@media (min-width:992px) {
a.navbar-brand {
  width: 15rem;
}
}

@media (min-width:1200px) {
a.navbar-brand {
  width: 16rem;
}
}
.navbar-toggler-icon {
  width: 1.3em;
  height: 1.3em;
}
nav.navbar {
/*  border-top: solid 4px var(--primary);*/
  padding-top: 0;
  padding-bottom: 0;
/*
  padding-left: 1.5rem;
  padding-right: 1.5rem;
*/
}
.navbar-nav .nav-link {
  color: var(--secondary);
  text-transform: uppercase;
  font-weight: 700;
  letter-spacing: 0.05em;
  margin: 0 .3rem;
  -webkit-transition: all ease-in-out 0.2s;
  -o-transition: all ease-in-out 0.2s;
  transition: all ease-in-out 0.2s;
}

@media (min-width:992px) {
.navbar-nav .nav-link {
  font-size: 0.7rem;
}
}

@media (min-width:1200px) {
.navbar-nav .nav-link {
  font-size: 0.8rem;
}
}
.nav-item.active a {
  color: var(--primary);
}

@media (max-width:991px) {
.navbar-nav .nav-link {
  margin: 1rem 0;
  font-size: .9rem;
}
.navbar-nav .nav-item {
  border-top: solid 3px grey;
} 
.navbar-nav .nav-item:nth-child(1) {
  border-color: var(--dark-blue);
} 
.navbar-nav .nav-item:nth-child(2) {
  border-color: var(--veneers);
} 
.navbar-nav .nav-item:nth-child(3) {
  border-color: var(--implants);
} 
.navbar-nav .nav-item:nth-child(4) {
  border-color: var(--dentures);
}  
.navbar-nav .nav-item:nth-child(5) {
  border-color: var(--gum-disease);
}  
.navbar-nav .nav-item:nth-child(6) {
  border-color: var(--root-canal);
} 
.navbar-nav .nav-item:nth-child(7) {
  border-color: var(--teeth-straight);
}  
div#navbarNav.show .nav-item {
  opacity: 1;
  -webkit-transition: all ease-in-out 0.3s;
  -o-transition: all ease-in-out 0.3s;
  transition: all ease-in-out 0.3s;
  -webkit-transition-delay: 0.5s;
  -o-transition-delay: 0.5s;
  transition-delay: 0.5s;
}
div#navbarNav .nav-item {
  opacity: 0;
  -webkit-transition: all ease-in-out 0.3s;
  -o-transition: all ease-in-out 0.3s;
  transition: all ease-in-out 0.3s;
}
  
}
.navbar-nav .nav-link:hover, .navbar-nav .nav-link:active, .navbar-nav .nav-link:focus {
  color: var(--primary);
  -webkit-transition: all ease-in-out 0.2s;
  -o-transition: all ease-in-out 0.2s;
  transition: all ease-in-out 0.2s;
}
ul.socnets img {
  width: 1.8rem;
}

@media (min-width:992px) {
ul.socnets img {
  width: 1.6rem;
}
}
.socnets .list-group-item {
  padding: .3rem;
  border: 0;
}
header.header {
  border-top: solid 3px var(--primary);
}
body.aux header {
    border-bottom: solid 1px var(--grey-text);
}

@media (max-width:991px) {
header  .nav-item {
    width: 0;
}

header .show .nav-item {
    width: 100%;
    -webkit-transition: width 1.5s cubic-bezier(0.39, 0.58, 0.57, 1);
    -o-transition: width 1.5s cubic-bezier(0.39, 0.58, 0.57, 1);
    transition: width 1.5s cubic-bezier(0.39, 0.58, 0.57, 1);
    -webkit-transition-delay: 1s;
    -o-transition-delay: 1s;
    transition-delay: 1s;
  transition-duration: .1s !important;  
}  
header .show .nav-item:nth-child(2) {
  transition-duration: .2s !important;
}
header .show .nav-item:nth-child(3) {
  transition-duration: .4s !important;
}
header .show .nav-item:nth-child(4) {
  transition-duration: .6s !important;
}
header .show .nav-item:nth-child(5) {
  transition-duration: .8s !important;
}
header .show .nav-item:nth-child(6) {
  transition-duration: 1s !important;
}
header .show .nav-item:nth-child(7) {
  transition-duration: 1.2s !important;
}
ul.socnets {
  margin-right: 4rem;
}
.navbar-nav .nav-link {
    color: #a1a1a1;
}
  .navbar-nav .nav-link:hover, .navbar-nav .nav-link:active, .navbar-nav .nav-link:focus {
    color: var(--dark-blue);
  }
.nav-item.active a {
    color: var(--dark-blue);
}  
header .navbar-nav {
    max-width: 245px;
}  
div#navbarNav {
  position: fixed;
  width: 100%;
  left: 0;
  top: 0;
  background: white;
  height: 100%;
  min-height: 100vh;
  bottom: 0;
/*  padding: 2.1rem 1.25rem 0 2rem;*/
  padding: 2.95rem 5rem 0 2rem;
  z-index: 999;
  border-top: solid 3px var(--primary);
}
div#navbarNav.show {
  opacity: 1;
  -webkit-transition: all ease-in-out 0.3s;
  -o-transition: all ease-in-out 0.3s;
  transition: all ease-in-out 0.3s;
}
div#navbarNav {
  opacity: 0;
  -webkit-transition: all ease-in-out 0.3s;
  -o-transition: all ease-in-out 0.3s;
  transition: all ease-in-out 0.3s;
}
}
.navbar-toggler {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
  transform: translateY(-50%);
/*  right: .7rem;*/
  right: -12px;
  z-index: 999;
}

@media (max-width:575px) {
.navbar-toggler {
    top: 11.5vw;
}  
div#navbarNav {
    padding-top: 9.2vw;
}  
}

/*Header*/

/* Slider */
/*
.carousel-caption {
  position: static;
  color: var(--text);
  padding: 2rem;
}
*/
.owl-theme .owl-dots {
    margin-top: 1.5rem !important;
}
.owl-theme .owl-dots .owl-dot span {
    background: var(--grey-text);
}
.owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {
    background: var(--secondary);
}
p.slide-header {
  font-weight: 300;
  color: #fff;
  font-size: 1.5rem;
  line-height: 1.2em;/*
  padding: 1rem;
  margin: 0;
  position: absolute;
  top: 0;
  padding-right: 3rem; 
*/
}
.carousel-caption {
  height: 93%;
}

@media (min-width:768px) {
.carousel-caption {
  height: 65%;
}
}
.carousel-caption {
  top: 0;
  left: 0;
  text-align: left;
  padding: 2rem;
  width: 100%;/*  height: 100%;*/
}
.intro-text {
  padding: 2rem 1.5rem;
  z-index: 1;
}

@media (min-width:576px) {
.intro-text {
  padding: 2rem;
}
}

@media (max-width:767px) {
.common section.intro {
    padding: 0 1.5rem;
}  
section.testimonials-area {
    padding: 0 1.5rem;
}  
}
.carousel-indicators {
  margin-left: 30px;
  bottom: 2%;
  left: 0;
  justify-content: left;
}

@media (min-width:768px) {
.carousel-indicators {
  bottom: 30%;
}
}

@media (min-width:992px) {
.carousel-indicators {
  margin-left: 5.5rem;
}
}

@media (min-width:1200px) {
.carousel-indicators {
  top: 32rem;
  margin-left: 5.5rem;
}
}
.carousel-indicators li {
  border-radius: 50%;
  height: .6rem;
  width: .6rem;
  background: 0;
  border: solid 1px white;
  opacity: 1;
}
.carousel-indicators li.active {
  background: #fff;
}

.carousel-indicators {
    position: static;
    position: absolute;
    margin: 0;
    /* bottom: 0; */
    left: 1.5rem;
}


@media (min-width:768px) {
.carousel-caption {
  width: 49%;
}
.carousel-caption.caption-smile {
  width: 60%;
}
.intro-text {
/*  position: absolute;*/
  /* top: 21rem; */
  background: white;
  margin: 0 15px;
/*  bottom: -15rem;*/
}
.bd-example {
  position: relative;
}
.intro-text {
padding: 2.5rem 3rem 2rem;
    margin-top: -6rem;
    position: relative;
}
}

@media (min-width:576px) {
p.slide-header {
  /*    padding: 2rem 7rem 2rem 2rem;*/
  font-size: 1.9rem;
}
}
p.slide-header strong {
  font-weight: 900;
}
/*
.home div#carouselExampleCaptions {
    max-height: 29rem;
}
*/
.bd-example {
  margin: 0 1.5rem;
}
 
.home div#carouselExampleCaptions {
  height: 18rem;
}  
/*
.common div#carouselExampleCaptions {
  height: 18rem;
}
*/
.common div#carouselExampleCaptions,
.home div#carouselExampleCaptions {	
    height: 40vh;
    min-height: 12rem;
	max-height: 17rem;
}


@media (min-width:576px) {
  .home div#carouselExampleCaptions {
  min-height: 20rem;
  }
  .common div#carouselExampleCaptions {
  height: 15rem;
		
  }
	
}

@media (max-width:575px) {
.common .carousel-item.item-1 {
    background-position: 64% 50%;
}
.common .carousel-item.item-2,
	.common .carousel-item.item-3,
	.common .carousel-item.item-5 {
    background-position: 64% 50%;
}	

	.common .carousel-item.item-4 {
	 background-position: 80% 50%;
	}	
	.common .carousel-item.item-6 {
	 background-position: 70% 50%;
	}	
}

.carousel-item.item-1 {
  background-image: url("../images/hero/hero-1-min.jpg");
}
.treatments-page .carousel-item.item-1 {
  background-image: url("../images/hero/hero-treatments-min.jpg");
}
.appointments .carousel-item.item-3 {
  background-image: url("../images/hero/hero-appointments-min.jpg");
}
.testimonials .carousel-item.item-4 {
  background-image: url("../images/hero/hero-testimonials-min.jpg");
}
.referrals .carousel-item.item-5 {
  background-image: url("../images/hero/hero-referrals-min.jpg");
}
.team .carousel-item.item-2 {
  background-image: url("../images/hero/hero-team-min.jpg");
}
.contact .carousel-item.item-6 {
  background-image: url("../images/hero/hero-contact-min.jpg");
}
.carousel-item.item-2 {
  background-image: url("../images/hero/hero-2-min.jpg");
}
.carousel-item.item-3 {
  background-image: url("../images/hero/hero-3-min.jpg");
}
.carousel-item.item-4 {
  background-image: url("../images/hero/hero-4-min.jpg");
}
.carousel-item {
  background-size: cover;
  background-position: center;
}
@media (max-width:767px) {
.carousel-item {
    background-position: right;
}  
}
.carousel-inner {
  height: 100%;
}
.carousel-item {
  height: 100%;
}
.carousel-control-next, .carousel-control-prev {
  height: calc(100% - 10rem);
}

@media (min-width:768px) {
p.slide-header {
padding-top: 3rem;
    margin-bottom: 3rem;
}  
.common div#carouselExampleCaptions {
  height: calc(53vh - 250px);
	  min-height: 19rem;
	/*    padding-bottom: 10rem;*/
}  
.home div#carouselExampleCaptions {
  height: calc(53vh - 116px);
  min-height: 34rem;
}

/*
.home .bd-example {
  padding-bottom: 15rem;
}
*/
/*
.carousel-item.item-1 {
  background-image: url("../images/hero/hero-1-min.jpg");
}
.treatments-page .carousel-item.item-1 {
  background-image: url("../images/hero/hero-treatments-min.jpg");
}
.team .carousel-item.item-2 {
  background-image: url("../images/hero/hero-team-min.jpg");
}
.carousel-item.item-2 {
  background-image: url("../images/hero/hero-2-min.jpg");
}
.carousel-item.item-3 {
  background-image: url("../images/hero/hero-3-min.jpg");
}
.carousel-item.item-4 {
  background-image: url("../images/hero/hero-4-min.jpg");
}
*/
.carousel-item {
  background-size: cover;
  background-position: center;
}
.carousel-inner {
  height: 100%;
}
.carousel-item {
  height: 100%;
}
.carousel-control-next, .carousel-control-prev {
  height: calc(100% - 10rem);
}
}

@media (min-width:992px) {
/*
.home .bd-example {
  padding-bottom: 8rem;
}
*/

.common div#carouselExampleCaptions {
  height: calc(75vh - 350px);
	min-height: 23rem;
}   
.home div#carouselExampleCaptions {
  height: calc(67vh - 116px);
}
.intro-text {
/*  bottom: -8rem;*/
  margin-top: -9rem;
/*  padding: 3rem 5rem;*/
  padding: 3rem 0;
}
p.slide-header {
  /* padding: 2rem 7rem 2rem 2rem; */
  font-size: 2.3rem;
}
.carousel-caption {
  width: 100%;
  max-width: 41%;
}
.carousel-caption.caption-smile {
  max-width: 50%;
}
.carousel-caption {
  /*    top: 0;*/
  left: 3.6rem;
  padding-top: 5rem;
}
}

@media (min-width:1200px) {
div#carouselExampleCaptions {
  height: calc(100vh - 116px);
  padding-bottom: 10rem;
  max-height: 67rem;
} 
.common div#carouselExampleCaptions {
  height: calc(100vh - 550px);
  padding-bottom: 0;
  max-height: 40rem;
min-height: 31rem;  
}  
.home div#carouselExampleCaptions {
/*  height: calc(100vh - 116px);*/
  height: calc(81vh - 116px);
  padding-bottom: 0;
/*  max-height: 67rem;*/
  max-height: 63rem;
  min-height: 44rem;
}

.home .bd-example {
  padding-bottom: 0;
}
.intro-text {
  bottom: 2rem;
  top: 0;
position: relative;
/*  padding-bottom: 2rem;*/
  padding: 4rem 0;
margin-top: -9rem;
}
p.slide-header {
  font-size: 3.1rem;
  padding-top: 7rem;
  margin-bottom: 6rem;
}
.common p.slide-header {
    padding-top: 0;
    margin-bottom: 0;
    position: absolute;
    left: 15px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}  
.carousel-caption {
  padding-top: 10%;
  bottom: 17rem;
  max-width: 40rem !important;
}
.common .carousel-caption {
    position: absolute;
    top: 50%;
     -webkit-transform: translateY(-50%); 
     -ms-transform: translateY(-50%); 
     -o-transform: translateY(-50%); 
     transform: translateY(-50%); 
    padding-top: 0 !important;
    padding-bottom: 0 !IMPORTANT;
    height: auto !important;
bottom: unset;  
    /* display: inline-block !important; */
    /* float: left; */
}  
}

.common .carousel-item {
  display: none;
}
.treatments-page .carousel-item.item-1 {
  display: block;
}
.team .carousel-item.item-2 {
  display: block;
}
.referrals .carousel-item.item-5 {
  display: block;
}

.appointments.common .carousel-item.item-3 {
  display: block;
}

.testimonials.common .carousel-item.item-4 {
  display: block;
}

.contact.common .carousel-item.item-6 {
  display: block;
}

.intro li.list-group-item {
    width: 33.3333%;
    padding: 0;
    border: 0;
}

/* Cards */

@media (min-width:768px) {
p.card-text {
  font-size: 0.9rem;
}
}

@media (max-width:767px) {
.card-body {
    padding: 1.5rem;
}  
}

/* Portals */

.portal-img {
  min-height: 16rem;
  background-image: url('../images/portals/portal-home.jpg');
  background-position: center;
  background-size: cover;
  height: 100%;
  overflow: hidden;
}
body.home .portal-img {
  background-image: url('../images/portals/portal-home.jpg');
}
body.treatments-page .portal-img {
  background-image: url('../images/portals/treatments-portal.jpg');
}
body.team .portal-img {
  background-image: url('../images/portals/team-portal.jpg');
}
body.appointments .portal-img {
  background-image: url('../images/portals/portal-appointments.jpg');
}
body.referrals .portal-img {
  background-image: url('../images/portals/portal-testimonials.jpg');
}
body.testimonials .portal-img {
  background-image: url('../images/portals/portal-testimonials.jpg');
}
body.contact .portal-img {
  background-image: url('../images/portals/portal-contact.jpg');
}
body.home .portal-box {
  background: var(--portal-pink);
  color: #fff;
}

.treatments-page .portal-box {
  background: var(--yellow);
  color: #fff;
}
.team .portal-box,
.appointments .portal-box {
  background: var(--orange);
  color: #fff;
}
body.testimonials .portal-box {
  background: var(--gum-disease);
  color: #fff;
}
body.referrals .portal-box {
  background: var(--portal-purple);
  color: #fff;
}
body.contact .portal-box {
  background: var(--portal-pink);
  color: #fff;
}

.testimonial-home,
.testimonial-team,
.testimonial-book,
.testimonial-contact,
.appointment-box,
.speech-marks-wrap,
.card-home,
.card-home-right,
.card-book-right,
.card-team,
.card-treatments,
.card-testimonials,
.card-contact,
.card-referrals {
  display: none !important;
}
body.home .testimonial-home,
body.team .testimonial-team,
body.appointments .testimonial-book,
body.treatments-page .appointment-box,
body.home .card-treatments,
body.home .card-home-right,
body.appointments .card-book-right,
body.treatments-page .card-treatments,
body.team .card-team,
body.testimonials .card-testimonials,
body.referrals .card-referrals,
body.contact .testimonial-contact,
body.contact .card-contact {
  display: block !important;
}
body.home .speech-marks-wrap,
body.team .speech-marks-wrap,
body.appointments .speech-marks-wrap,
body.contact .speech-marks-wrap {
  display: flex !important;
}

@media (max-width:767px) {
  .speech-marks-wrap img {
    display: none !important;
  }
}

/*
body.treatments-page .card-treatments {
  
}
*/

.card {
  border: 0;
  border-radius: 0;
}

.card.portal-box {
  padding: 1rem .5rem;
}

@media (min-width:576px) {
  .card.portal-box {
    padding: 2rem 1.5rem;
  }
}


@media (min-width:992px) {
.card.portal-box {
  padding: 2.5rem;
}
}

@media (min-width:1200px) {
.card.portal-box {
  padding: 3rem 4rem;
}
}
/* Treatments */
.tab-pane ul {
    padding-bottom: 1rem;
    list-style: none;
    padding-left: 20px;
}
.tab-pane h3 {
    margin-bottom: .8rem;
}
.treatments-tabs .nav-link:hover {
    color: var(--dark-blue);
}
section.treatments ,
section.booking-form {
  background: var(--grey-bkg);
  margin: 0 1.5rem;
}
.treatments-row > div {
  padding-left: 5px;
  padding-right: 5px;
  align-items: stretch;
  display: flex;
}
.treatments-row {
  margin-right: -5px;
  margin-left: -5px;
}
.treatments-outer {
  background: var(--grey-bkg);/*
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
*/
}
/*
@media (min-width:768px) {
  .treatments-outer {
    padding: 2.5rem 3rem;
}
}

@media (min-width:992px) {
  .treatments-outer {
    padding: 2.5rem 5rem;
}
}
*/
.treatments .card {
  border-top: solid 3px grey;
  margin-bottom: 1rem;
}

@media (min-width:768px) {
.treatments .card {
  margin-bottom: 10px;
}
}
.treatments h5 {
  margin-bottom: 1rem;
}

@media (min-width: 992px) {
.treatments h5 {
  margin-bottom: 1.5rem;
}
}
.card.fillings,
.treatments-tabs .nav-link.fillings {
  border-color: var(--dark-blue);
}
.card.veneers,
.treatments-tabs .nav-link.veneers {
  border-color: var(--veneers);
}
.card.implants,
.treatments-tabs .nav-link.implants {  
  border-color: var(--implants);
}
.card.dentures,
.treatments-tabs .nav-link.dentures {    
  border-color: var(--dentures);
}
.card.gums,
.treatments-tabs .nav-link.gum {     
  border-color: var(--gum-disease);
}
.card.canal,
.treatments-tabs .nav-link.canal {
  border-color: var(--root-canal);
}
.card.straight,
.treatments-tabs .nav-link.straight {
  border-color: var(--teeth-straight);
}
.card.extraction,
.treatments-tabs .nav-link.extractions {    
  border-color: var(--extraction);
}
.card.whitening,
.treatments-tabs .nav-link.whitening {   
  border-color: var(--whitening);
}
.card.invisalign,
.treatments-tabs .nav-link.invisalign {     
  border-color: var(--invisalign);
}
.treatments p.card-text {
  margin-bottom: 2rem;
}
.treatments .card-body {
  display: flex;
  flex-direction: column;
}
.treatments .btn-primary {
  margin-top: auto;
  margin-bottom: .5rem;
}

/* Pullouts */

section.pullout {
    margin: 0 1.5rem;
}
img.speech-marks {
    width: 7rem;
}
@media (min-width:1200px) {
  img.speech-marks {
    width: 8rem;
}
}
.home .testimonials .portal-box,
.treatments-page .testimonials .portal-box,
.team .testimonials .portal-box {
  background: var(--primary);
  background-position: center;
  background-size: cover;
}
section.testimonials .portal-box {
  background: var(--primary);
  background-position: center !important;
  background-size: cover !important;
}
.home .testimonials .portal-box {
  background-image: url('../images/portals/testimonials-blue.jpg');
}
.treatments-page .testimonials .portal-box {
  background-image: url('../images/portals/testimonials-blue.jpg');
}
.team .testimonials .portal-box {
  background-image: url('../images/portals/testimonials-blue.jpg');
}
section.testimonials .portal-box {
  background-image: url('../images/portals/testimonials-blue.jpg');
}
body.team .testimonials .portal-box {
   margin-top: 2rem;
}
@media (min-width:1200px) {

  section.testimonials .portal-box {
     margin-bottom: 2rem !important;
     margin-top: 2rem !important;
  }
}

/* Treatments */
.treatments-tabs h2 {
    color: var(--dark-blue);
    margin-bottom: 2rem;
}

.treatments-tabs .lead {
    margin-bottom: 2rem;
}

.treatments-tabs .nav-link {
    color: var(--grey-text);
    border-top: solid 3px;
    border-radius: 0;
    margin: 0;
    padding: 1.3rem 0;
    line-height: 1;
}

@media (max-width:767px) {
.treatments-tabs .nav-link {
    font-size: 1.2rem;
}  
}

@media (min-width:768px) {
 .treatments-tabs .nav-link {
max-width: 245px;  
} 
}

.treatments-tabs .nav-link.active {
    color: var(--dark-blue);
    background: 0;
}
.treatments-xs.treatments-tabs .nav-link.open {
    color: var(--dark-blue);
    background: 0;
}

/* Team*/

.team-member {
  background: var(--grey-bkg);
}

section.team-area {
  background: var(--grey-bkg);
  margin: 0 1.5rem;
  border-top: solid 3px var(--primary);
}
img.team-pic {
    max-width: 16rem;
}

@media (max-width:767px) {
  img.team-pic {
    width: 100%;
    max-width: none;
    padding-top: 1rem;
}

}

/*
@media (min-width:992px) {
  .team-member {
    padding: 3rem 5rem;
  }  
}
*/

/* Testimonials */


img.speech-marks-grey {
    max-width: 8rem;
    float: right;
    margin-top: 9px;
    margin-left: 6rem;
    display: none;
}
@media (min-width:768px) {
img.speech-marks-grey {
  display: flex;
}  
}
.testimonials .blockquote {
    margin: 4rem 0 0;
    min-height: 12rem;
    border-bottom: solid 1px var(--grey-text);
    padding-bottom: 4rem;
}

/*Forms*/
.form-control {
    border-radius: 0;
    border: 0;
}

.form-group label {
    margin: .5rem 0 .5rem;
  font-weight: 600;
}
/* Footer */
.footer .small a {
  color: inherit;
}
footer.footer {
  background: var(--footer);
  color: #fff;
}
.footer a.nav-link {
    padding: .3rem 0;
    text-align: left;
    font-size: .9rem;
/*    letter-spacing: .1em;*/
}
footer.footer h3 {
  color: var(--primary);
  font-size: 1rem;
}
footer a {
    color: #fff;
    -webkit-transition: all ease-in-out 0.2s; 
    -o-transition: all ease-in-out 0.2s; 
    transition: all ease-in-out 0.2s;  
}

footer a:hover {
    color: var(--primary);
    text-decoration: none;
    -webkit-transition: all ease-in-out 0.2s; 
    -o-transition: all ease-in-out 0.2s; 
    transition: all ease-in-out 0.2s;  
}
.nav-foot {
    border-bottom: solid 1px #525151;
    padding-bottom: 2rem;
}

@media (min-width: 768px) {
  .nav-foot {
    border-bottom: 0;
    border-left: solid 1px #525151;
    padding-bottom: 2rem;
/*    height: 100%;*/
    padding-left: 1.5rem;
  }
.footer li.nav-item {
    position: relative;
    top: -8px;
}  
}

@media (min-width: 992px) {
  .footer a.nav-link {
      letter-spacing: 0;
  }  
.footer li.nav-item {
    position: relative;
    top: -5px;
}  
.nav-foot {
    margin-top: 22px;
}  
.footer a.nav-link {
    padding: .1rem 0;  
}
}

/*cookie consent ipad fix*/
@media screen and (min-device-width : 385px) {
.cc-window.cc-floating {
  max-width: none !important;
  width: 100% !important;
  flex-direction: row !important;
}
.cc-floating .cc-message {
  width: 100% !important;
  margin-bottom: 0px !important;
}
.cc-window.cc-floating .cc-compliance {
  margin-top: -5px !important;
  float: right !important;
}
.cc-link {
  padding-left: 0px !important;
}
.cc-window.cc-floating .cc-compliance {
  min-width: 100px !important;
}
.cc-bottom {
  bottom: 0 !important;
}
}
/*end fix*/

/*map*/

.map-overlay iframe {
    margin-top: -200px;
}

#map iframe {
    border: 0;
/*
    filter: url(data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter i…0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale);
    filter: gray;
    -webkit-filter: grayscale(99%);
*/
    -webkit-backface-visibility: hidden;
}

#map .overlay {
    background: transparent;
    position: relative;
    width: 100%;
    height: 450px;
    top: 450px;
    margin-top: -450px;
    z-index: 999;
}

.map-overlay {
    height: 450px;
    overflow: hidden;
}

@media (max-width:767px) {
  .map-overlay iframe {
      margin-top: -245px;
  }
  #map .overlay {
      background: transparent;
      position: relative;
      width: 100%;
      height: 350px;
      top: 350px;
      margin-top: -350px;
      z-index: 999;
  }

  .map-overlay {
      height: 350px;
      overflow: hidden;
  }  
}

/*end map*/


/* Dropdown */
.dropdown-menu {
  left: auto;
  top: 75px;
}

.nav-link {
  position: relative;
}

a.dropdown-item {
font-size: 12px;
text-transform: uppercase;
letter-spacing: 1px;
}

@media (max-width:992px) {
  .dropdown-menu {
    border: 0px;
    padding-top: 0px;
  }
  .dropdown-menu a.dropdown-item {
    padding-left:0px!important;
  }
}

form .h5, form h5 {
font-size: 1rem;
}