@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

:root {
    --primary: #c78f3d;
    --secondary: #0B2154;
    --light: #F2F2F2;
    --dark: #111111;
}

*:focus {
    box-shadow: none !important;
}

body {
    font-size: 1rem;
    font-weight: 400;
    margin: 0;
      font-family: "Montserrat", sans-serif;
    line-height: 1.7;
    color: #717171;
    background-color: #fff;
    -webkit-text-size-adjust: 100%;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

html, body {
    overflow-x: hidden;
    width: 100%;
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
    font-family: "Montserrat", sans-serif;
    color: #e1ac46!important;
	    margin-bottom: 0.5rem;
    font-weight: 600;
    line-height: 1.2;
    color: #565D61;
    letter-spacing: 1px;
}

h2::after {
    content: "";
    position: absolute;
    display: block;
    width: 30px;
    height: 2px;
    background: #000;
    left: calc(50% - 20px);
    margin-top: 5px;
}


.fw-medium {
    font-weight: 600 !important;
}

.back-to-top {
    position: fixed;
    display: none;
    right: 45px;
    bottom: 45px;
    z-index: 99;
	 width: 50px;
  height: 50px;
  transition: all 0.4s;
  padding:12px 0px 10px 15px;
    background: #fbbe17;
	box-shadow: rgba(0, 0, 0, 0.65) 0px 5px 5px;
}

.back-to-top i {
    font-size: 22px;
    color:#fff;
    line-height: 0;
	font-weight:700 !important;
}

.back-to-top.btn, .back-to-top.btn:active, .back-to-top.btn:focus {
 border-color: transparent !important;
}


/*** Button ***/
.btn {
    font-weight: 500;
    text-transform: uppercase;
    transition: .5s;
}

.btn.btn-primary,
.btn.btn-secondary {
    color: #FFFFFF;
}

.btn-square {
    width: 38px;
    height: 38px;
}

.btn-sm-square {
    width: 32px;
    height: 32px;
}

.btn-lg-square {
    width: 48px;
    height: 48px;
}

.btn-square,
.btn-sm-square,
.btn-lg-square {
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: normal;
    border-radius: 2px;
	border-color: transparent !important;
	
}

/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
#header {
  background: rgba(0, 0, 0, 0.6);
  transition: all 0.5s;
  z-index: 997;
  padding: 0px;
  top: 0px;
}

@media (max-width:893px){
#header {
  background: rgba(0, 0, 0, 1);
  transition: all 0.5s;
  z-index: 997;
  padding: 0px 0;
  top: 0px;
}	
	
}

@media (max-width:768px){
#header {
  background: rgba(0, 0, 0, 1);
  transition: all 0.5s;
  z-index: 997;
  padding: 0px 0;
  top: 0px;
}	
	
}

#header.header-scrolled {
  top: 0;
  background: rgba(0, 0, 0, 0.85);
  border-bottom: 1px solid #37332a;
}

@media (max-width:893px){
#header.header-scrolled {
  top: 0;
  background: rgba(0, 0, 0, 1);
  border-bottom: 1px solid #37332a;
}	
}

#header .logo {
  font-size: 28px;
  margin: 0;
  padding: 0;
  line-height: 1;
  font-weight: 300;
  letter-spacing: 1px;
  text-transform: uppercase;
  font-family: "Poppins", sans-serif;
}

#header .logo a {
  color: #fff;
}

#header .logo img {
  max-height: 40px;
}
					
/*--------------------------------------------------------------
# Top Bar
--------------------------------------------------------------*/

.header .topbar {
  height: 40px;
  padding: 0;
  font-size: 15px;
  background-image: linear-gradient(to right, rgba(228, 170, 73), rgba(244, 196, 125), rgba(228, 170, 73));
  font-family: "Montserrat", sans-serif !important;
    color:#383737 !important;
  font-weight:500;	
  	z-index:998;
}

.header .topbar .contact-info i {
    color:#383737 !important;
	margin-right:10px
}

.header .topbar .contact-info i a,
.header .topbar .contact-info i span {

    color:#383737 !important;
}



.header .topbar .contact-info i a {
  line-height: 0;
  transition: 0.3s;
}

.header .topbar .contact-info i a:hover {
  text-decoration: underline;
}

.header .topbar .social-links a,
.header .topbar .social-links i {
  line-height: 0;
  color:#383737 !important;
      font-size: 18px;
}

.ex-mar{
	margin-right:20px
}

.divider{
	display:none
}

@media (max-width: 478px) {

.header .topbar .contact-info i{
	display:none
}

.header .topbar {
  font-size: 11px;
}

.header .topbar .social-links a,
.header .topbar .social-links i {
  line-height: 0;
  color:#383737 !important;
      font-size: 17px;
}

.ex-mar{
	margin-right:10px
}

.header .topbar .contact-info i {
    color:#383737 !important;
	margin-right:0px
}

.divider{
	display:inline
}
}

/*** Navbar ***/

#mainNav {
  padding-top: 0.2rem;
  padding-bottom: 0.2rem;
  background-color: #212529;
}
#mainNav .navbar-toggler {
  padding: 0.75rem;
  font-size:1.2rem;
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  text-transform: uppercase;
  font-weight: 700;
}
#mainNav .navbar-brand {
  color: #ffc800;
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-weight: 700;
  letter-spacing: 0.0625em;
  text-transform: uppercase;
}
#mainNav .navbar-brand img {
  height: 3rem;
}
#mainNav .navbar-nav .nav-item .nav-link {
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 0.95rem;
  color: #fff;
  letter-spacing: 0.0625em;
}
#mainNav .navbar-nav .nav-item .nav-link.active, #mainNav .navbar-nav .nav-item .nav-link:hover {
  color: #ffc800;
}

@media (max-width: 1400px) {
  #mainNav .navbar-nav .nav-item .nav-link {
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 0.75rem;
  color: #fff;
  letter-spacing: 0.0425em;
}	
	
}


@media (max-width: 1200px) {
  #mainNav .navbar-nav .nav-item .nav-link {
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 0.55rem;
  color: #fff;
  letter-spacing: 0.0425em;
}	
	
}

@media (max-width: 1024px) {
  #mainNav .navbar-nav .nav-item .nav-link {
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 0.55rem;
  color: #fff;
  letter-spacing: 0.0425em;
}	
	
}

@media (min-width: 992px) {
  #mainNav {
    padding-top: 1rem;
    padding-bottom: 1rem;
    border: none;
    background-color: transparent;
    transition: padding-top 0.3s ease-in-out, padding-bottom 0.3s ease-in-out;
  }
  


  #mainNav .navbar-brand img {
    height: 4rem;
    transition: height 0.3s ease-in-out;
  }
  #mainNav.navbar-shrink {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    background-color: #212529;
  }
  #mainNav.navbar-shrink .navbar-brand svg,
  #mainNav.navbar-shrink .navbar-brand img {
    height: 3rem;
  }
  #mainNav .navbar-nav .nav-item {
    margin-right: 1rem;
  }
  #mainNav .navbar-nav .nav-item:last-child {
    margin-right: 0;
  }
}

@media (max-width: 893px) {
  #mainNav .navbar-nav .nav-item .nav-link {
  font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 0.95rem;
  color: #fff;
  letter-spacing: 0.0425em;
}	
	
}

@media (max-width: 320px) {
#mainNav .navbar-brand img {
  height: 2rem;
}
  
  
}

.navbar-dark .navbar-toggler {
    color: rgba(255, 255, 255, 1);
    border-color: transparent !important;
}

/*** Header ***/
.carousel-caption {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 30px;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: end;
}

.carousel-caption-content {
    text-align: end;
    padding-right: 300px;
	max-width:1000px
}

.carousel-caption-content .btn{
	background:#ffbe01;
	border:none;
	border-radius:18px;
	color:#000 !important;
	font-weight:600;
	text-transform:inherit;
	font-size:18px
}

.carousel-caption-content h1{
	font-size:48px !important;
		color:#000 !important;
		background-image: linear-gradient(to right, rgba(228,170,73,0.1), rgba(228,170,73,0.8), rgba(228,170,73,0.1));
		padding:0px 20px;
		font-weight:600 !important
}


.carousel-caption-content .carousel-caption-content-btn {
    display: flex;
    justify-content: end;
}


.carousel-control-prev,
.carousel-control-next, .carousel-control-prev:hover,.carousel-control-next:hover {
    width: 50px;
	height:50px;
	top:50%;
	z-index:999;
	margin:0 10px;
	opacity:1;
	font-size:38px;
	padding:15px;
	font-weight:300;
	color:#000
}




#header-carousel .carousel-item {
        position: relative;
        max-height: 650px;
		top:0px
    }
	
	
.bs{
	display:block
}

.ss{
	display:none
}

.xss{
	display:none
}


@media (max-width: 1024px) {


.carousel-caption-content {
 
    padding-right:220px
}


.carousel-caption-content h1{
	font-size:38px !important;
		color:#000 !important;
		background-image: linear-gradient(to right, rgba(228,170,73,0.2), rgba(228,170,73,0.6), rgba(228,170,73,0.2));
		padding:0px 0px;
		font-weight:600 !important;
		text-align:end
}


}


@media (max-width: 893px) {

}

@media (max-width: 768px) {
	

.carousel-caption-content h1{
	font-size:35px !important
}
.carousel-caption-content {
 
    padding-right:180px
}

    #header-carousel .carousel-item {
        position: relative;
        min-height: 450px;
    }
    
    #header-carousel .carousel-item img {
        position: absolute;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

}


@media (max-width: 600px) {
	
.carousel-caption-content {
 
    padding-right:150px
}

	

.bs{
	display:none
}

.ss{
	display:block
}

.xss{
	display:none
}



.carousel-caption-content h1{
	font-size:25px !important;
		color:#000 !important;
		background-image: linear-gradient(to right, rgba(228,170,73,1), rgba(228,170,73,1), rgba(228,170,73,1));
		padding:0px 20px;
		font-weight:700 !important
}
	
}


@media (max-width: 478px) {
	
	
.carousel-caption-content {
 
    padding-right:120px
}

	
	.carousel-caption-content h1{
	font-size:20px !important
}


    #header-carousel .carousel-item {
        position: relative;
        min-height: 350px;
    }
	
	
	
}


@media (max-width: 320px) {
	
		.carousel-caption-content h1{
	font-size:15px !important;
}



.carousel-caption-content .btn{
	background:#ffbe01;
	border:none;
	border-radius:16px;
	color:#000 !important;
	font-weight:600;
	text-transform:inherit;
	font-size:14px
}


	    #header-carousel .carousel-item {
        position: relative;
        min-height: 300px;
    }
	
	.bs{
	display:none
}

.ss{
	display:none
}

.xss{
	display:block
}
	
	
}




/*** Services ***/

.smile{
	background:#fff;
position:relative;
padding:70px 0px 70px 0px;
}

.smile-studio {
    position: relative;
    text-align: center;
		width: 100%;
  margin: 0px auto;
   box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;  
}



.smile-studio .smile-text {
	width:90%;
	position:absolute;
	height:140px;
	bottom:15px;
	right:20px;
		padding:10px
}


.smile-studio .smile-text {
        background-image: linear-gradient(to right, rgba(228, 170, 73), rgba(244, 196, 125), rgba(228, 170, 73));
}

@media (max-width:1024px){
.smile-studio .smile-text {
	width:90%;
	position:absolute;
	height:120px;
	bottom:15px;
	right:20px;
		padding:5px
}	
	
}


@media (max-width:768px){
.smile-studio .smile-text {
	width:90%;
	position:absolute;
	height:120px;
	bottom:15px;
	right:20px;
		padding:5px
}	
	
}

 .smile-text p {
	color:#383737 !important;
}


 .smile-text h4 {
	color:#383737 !important;
}



.smile-text h4 .fw-bold::after {
    content: "";
    position: absolute;
    display: block;
    width: 30px;
    height: 3px;
    background: #ac6d2a;
    left: calc(50% - 20px);
    margin-top: 5px;
}



/*** Meet The Expert ***/


.meettheexpert{
background:#f7f7f7;
position:relative;
padding:70px 0px 70px 0px;
}

.mte-name{
	color:#e1ac46
}

.meettheexpert img{
    box-shadow: 0px 15px 20px -15px #111;
}

.yrsofexp {
	background: linear-gradient(90deg, rgba(225, 172, 70, 1) 0%, rgba(241, 198, 100, 1) 50%, rgba(225, 172, 70, 1) 100%);
			text-align:center !important;
			box-shadow: rgba(0, 0, 0, 0.15) 0px 5px 15px;
}


.meettheexpert i{
	color:#000!important
}

@media (min-width: 320px) {
	
}

.meettheexpert h3{
    font-size:35px;
	text-transform:uppercase;
	display:block
}




/*** Treatments ***/


.treatments{
	background:fff;
position:relative;
padding:70px 0px 40px 0px;
}

.treatment-name{
	background: linear-gradient(45deg, rgba(225, 172, 70, 1) 0%, rgba(241, 198, 100, 1) 50%, rgba(225, 172, 70, 1) 100%);
	padding:10px;
	box-shadow: 0px 15px 20px -15px #111;
	text-align:center;
	font-weight:500;
	font-size:1.1rem;
	text-transform:uppercase;
	color:#fff
}



.treatments .treat-item {
	    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;	
			background:#f7f7f7;
}

.treatments .treat-content-inner {
    position: relative;
	padding:0px 15px 20px 15px;

}

@media (max-width: 1200px) {
.treatments .treat-content-inner {
    position: relative;
	padding:0px 5px 20px 5px;

}
}

.treatments .treat-item .treat-item-img {
    position: relative;
    overflow: hidden;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}


.treatments .treat-item .treat-btn {
	display:block;
	margin:auto;
    align-items: center;
    justify-content: center;
    transition: .5s;
    text-align: center;
    font-weight: 500;
    font-size: 1.1rem;
}


.button-52 {
      background: linear-gradient(45deg, rgba(225, 172, 70, 1) 0%, rgba(241, 198, 100, 1) 50%, rgba(225, 172, 70, 1) 100%);
  color: #000;
  font-size: 1rem;
  font-weight: 600;
  line-height: 24px;
  text-decoration: none;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
  border-radius:18px;
  padding:13px 10px
}

.button-52:hover,
.button-52:active {
  outline: 0;
  background: #000;
  color:#e1ac46!important
}



.shine {
  position: relative;
  overflow: hidden;
}
.shine::before {
  background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.2) 100%);
  content: "";
  display: block;
  height: 100%;
  left: -75%;
  position: absolute;
  top: 0;
  transform: skewX(-25deg);
  width: 50%;
  z-index: 2;
}
.shine:hover::before, .shine:focus::before {
  -webkit-animation: shine 0.85s;
          animation: shine 0.85s;
}
@-webkit-keyframes shine {
  100% {
    left: 125%;
  }
}
@keyframes shine {
  100% {
    left: 125%;
  }
}


.treatments .icon{
	max-height:80px; 
	margin-top:10px !important;
	display:block;
	margin:auto
}



.treatments p{
	margin-top:10px;
		font-size: 1rem !important;
			text-align:center
}

.treatments h3{
	color:#383737 !important;
	font-weight:500 !important;
	font-size:1.4rem;
	text-align:center
}


.treatments h3::after {
    content: "";
    position: absolute;
    display: block;
    width: 30px;
    height: 2px;
    background: #e1ac46;
    left: calc(50% - 20px);
    margin-top: 5px;
}


@media (max-width: 1200px) {
	.treatments h3{
	color:#383737 !important;
	font-weight:500 !important;
	font-size:1rem
}
	
}

@media (max-width:1024px){
	.treatments h3{
	color:#383737 !important;
	font-weight:500 !important;
	font-size:1.1rem
}


}


@media (max-width:893px){
.treatments h3{
	color:#383737 !important;
	font-weight:500 !important;
	font-size:1.2rem
}	

}

@media (max-width:768px){
.treatments h3{
	color:#383737 !important;
	font-weight:500 !important;
	font-size:1.4rem
}

.treatments .treat-item {
	    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;	
			background:#f7f7f7;
			margin-bottom:20px			
}


}

@media (max-width:600px){

.treatments .treat-item {
	    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;	
			background:#f7f7f7;
			margin-bottom:20px			
}


}








/* Cosmetic Dentistry */
#cosmetic-dentistry {
	background: white;
	padding: 10px;
	text-align: left;
	max-width: 850px;
	margin: 40px auto;
	position: relative;
		max-height:600px;
	overflow-y:auto
}

#cosmetic-dentistry p{
	margin-bottom:0px
}

#cosmetic-dentistry i{
	color:#e1ac46
}

#cosmetic-dentistry .table td, .table th {padding: 0;}

#cosmetic-dentistry h5{
	color:#717171 !important
}

#cosmetic-dentistry h3::after {
    content: "";
    position: absolute;
    display: block;
    width: 30px;
    height: 2px;
    background: #000;
    left: calc(50% - 20px);
    margin-top: 5px;
}

#cosmetic-dentistry img{
	    box-shadow: rgba(0, 0, 0, 0.15) 0px 5px 15px;
}

/* Full Mouth Rehabilitation / Restorative */
#full-mouth-rehab {
	background: white;
	padding: 10px;
	text-align: left;
	max-width: 850px;
	margin: 40px auto;
	position: relative;
		max-height:600px;
	overflow-y:auto
}

#full-mouth-rehab p{
	margin-bottom:0px
}

#full-mouth-rehab i{
	color:#e1ac46
}

#full-mouth-rehab .table td, .table th {padding: 0;}

#full-mouth-rehab h5{
	color:#717171 !important
}

#full-mouth-rehab h3::after {
    content: "";
    position: absolute;
    display: block;
    width: 30px;
    height: 2px;
    background: #000;
    left: calc(50% - 20px);
    margin-top: 5px;
}






/* Teeth Alignment / Invisalign */
#teeth-alignment {
	background: white;
	padding: 10px;
	text-align: left;
	max-width: 850px;
	margin: 40px auto;
	position: relative;
		max-height:600px;
	overflow-y:auto
}

#teeth-alignment p{
	margin-bottom:0px
}

#teeth-alignment i{
	color:#e1ac46
}

#teeth-alignment .table td, .table th {padding: 0;}

#teeth-alignment h5{
	color:#717171 !important
}

#teeth-alignment h3::after {
    content: "";
    position: absolute;
    display: block;
    width: 30px;
    height: 2px;
    background: #000;
    left: calc(50% - 20px);
    margin-top: 5px;
}



/* Implants */
#implants {
	background: white;
	padding: 10px;
	text-align: left;
	max-width: 850px;
	margin: 40px auto;
	position: relative;
		max-height:600px;
	overflow-y:auto
}

#implants p{
	margin-bottom:0px
}

#implants i{
	color:#e1ac46
}

#implants .table td, .table th {padding: 0;}

#implants h5{
	color:#717171 !important
}

#implants h3::after {
    content: "";
    position: absolute;
    display: block;
    width: 30px;
    height: 2px;
    background: #000;
    left: calc(50% - 20px);
    margin-top: 5px;
}



/* Root Canals */
#root-canals {
	background: white;
	padding: 10px;
	text-align: left;
	max-width: 850px;
	margin: 40px auto;
	position: relative;
		max-height:600px;
	overflow-y:auto
}

#root-canals p{
	margin-bottom:0px
}

#root-canals i{
	color:#e1ac46
}

#root-canals .table td, .table th {padding: 0;}

#root-canals h5{
	color:#717171 !important
}

#root-canals h3::after {
    content: "";
    position: absolute;
    display: block;
    width: 30px;
    height: 2px;
    background: #000;
    left: calc(50% - 20px);
    margin-top: 5px;
}



/* Dentures */
#dentures {
	background: white;
	padding: 10px;
	text-align: left;
	max-width: 850px;
	margin: 40px auto;
	position: relative;
	max-height:600px;
	overflow-y:auto
}

#dentures p{
	margin-bottom:0px
}

#dentures i{
	color:#e1ac46
}

#dentures .table td, .table th {padding: 0;}

#dentures h5{
	color:#717171 !important
}

#dentures h3::after {
    content: "";
    position: absolute;
    display: block;
    width: 30px;
    height: 2px;
    background: #000;
    left: calc(50% - 20px);
    margin-top: 5px;
}

#dentures li{
	margin-left:30px
}

#dentures li::marker {
  color: #e1ac46;
}



/* Dental Laser */
#dental-laser {
	background: white;
	padding: 10px;
	text-align: left;
	max-width: 850px;
	margin: 40px auto;
	position: relative;
	max-height:600px;
	overflow-y:auto
}

#dental-laser p{
	margin-bottom:0px
}

#dental-laser i{
	color:#e1ac46
}

#dental-laser .table td, .table th {padding: 0;}

#dental-laser h5{
	color:#717171 !important
}

#dental-laser h3::after {
    content: "";
    position: absolute;
    display: block;
    width: 30px;
    height: 2px;
    background: #000;
    left: calc(50% - 20px);
    margin-top: 5px;
}

#dental-laser li{
	margin-left:30px
}

#dental-laser li::marker {
  color: #e1ac46;
}




/* Facial Aesthetics */
#facial-aesthetics {
	background: white;
	padding: 10px;
	text-align: left;
	max-width: 850px;
	margin: 40px auto;
	position: relative;
	max-height:600px;
	overflow-y:auto
}

#facial-aesthetics p{
	margin-bottom:0px
}

#facial-aesthetics i{
	color:#e1ac46
}

#facial-aesthetics .table td, .table th {padding: 0;}

#facial-aesthetics h5{
	color:#717171 !important
}

#facial-aesthetics h3::after {
    content: "";
    position: absolute;
    display: block;
    width: 30px;
    height: 2px;
    background: #000;
    left: calc(50% - 20px);
    margin-top: 5px;
}

#facial-aesthetics li{
	margin-left:30px
}

#facial-aesthetics li::marker {
  color: #e1ac46;
}






/* Dental Hygienist */
#dental-hygienist {
	background: white;
	padding: 10px;
	text-align: left;
	max-width: 850px;
	margin: 40px auto;
	position: relative;
	max-height:600px;
	overflow-y:auto
}

#dental-hygienist p{
	margin-bottom:0px
}

#dental-hygienist i{
	color:#e1ac46
}

#dental-hygienist .table td, .table th {padding: 0;}

#dental-hygienist h5{
	color:#717171 !important
}

#dental-hygienist h3::after {
    content: "";
    position: absolute;
    display: block;
    width: 30px;
    height: 2px;
    background: #000;
    left: calc(50% - 20px);
    margin-top: 5px;
}

#dental-hygienist li{
	margin-left:30px
}

#dental-hygienist li::marker {
  color: #e1ac46;
}




/* New Service */
#new-service {
	background: white;
	padding: 10px;
	text-align: left;
	max-width: 850px;
	margin: 40px auto;
	position: relative;
	max-height:600px;
	overflow-y:auto
}

#new-service p{
	margin-bottom:0px
}

#new-service i{
	color:#e1ac46
}

#new-service .table td, .table th {padding: 0;}

#new-service h5{
	color:#717171 !important
}

#new-service h3::after {
    content: "";
    position: absolute;
    display: block;
    width: 30px;
    height: 2px;
    background: #000;
    left: calc(50% - 20px);
    margin-top: 5px;
}

#new-service li{
	margin-left:30px
}

#new-service li::marker {
  color: #e1ac46;
}





/* Pricing */
#pricing {
	background: white;
	padding: 10px;
	text-align: left;
	max-width: 850px;
	margin: 40px auto;
	position: relative;
	max-height:600px;
	overflow-y:auto
}

#pricing p{
	margin-bottom:0px
}

#pricing i{
	color:#e1ac46
}

#pricing .table td, .table th {padding: 0;}

#pricing h5{
	color:#717171 !important
}

#pricing h3::after {
    content: "";
    position: absolute;
    display: block;
    width: 30px;
    height: 2px;
    background: #000;
    left: calc(50% - 20px);
    margin-top: 5px;
}

#pricing li{
	margin-left:30px
}

#pricing li::marker {
  color: #e1ac46;
}



/* Complaint */
#complaint {
	background: white;
	padding: 10px;
	text-align: left;
	max-width: 850px;
	margin: 40px auto;
	position: relative;
	max-height:600px;
	overflow-y:auto
}

#complaint p{
	margin-bottom:0px
}

#complaint i{
	color:#e1ac46
}

#complaint .table td, .table th {padding: 0;}

#complaint h5{
	color:#717171 !important
}

#complaint h3::after {
    content: "";
    position: absolute;
    display: block;
    width: 30px;
    height: 2px;
    background: #000;
    left: calc(50% - 20px);
    margin-top: 5px;
}

#complaint li{
	margin-left:30px
}

#complaint li::marker {
  color: #e1ac46;
}




.ht{
	font-weight:600
}




/**
 * Fade-zoom animation for first dialog
 */

/* start state */
.my-mfp-zoom-in .zoom-anim-dialog {
	opacity: 0;

	-webkit-transition: all 0.2s ease-in-out; 
	-moz-transition: all 0.2s ease-in-out; 
	-o-transition: all 0.2s ease-in-out; 
	transition: all 0.2s ease-in-out; 



	-webkit-transform: scale(0.8); 
	-moz-transform: scale(0.8); 
	-ms-transform: scale(0.8); 
	-o-transform: scale(0.8); 
	transform: scale(0.8); 
}

/* animate in */
.my-mfp-zoom-in.mfp-ready .zoom-anim-dialog {
	opacity: 1;

	-webkit-transform: scale(1); 
	-moz-transform: scale(1); 
	-ms-transform: scale(1); 
	-o-transform: scale(1); 
	transform: scale(1); 
}

/* animate out */
.my-mfp-zoom-in.mfp-removing .zoom-anim-dialog {
	-webkit-transform: scale(0.8); 
	-moz-transform: scale(0.8); 
	-ms-transform: scale(0.8); 
	-o-transform: scale(0.8); 
	transform: scale(0.8); 

	opacity: 0;
}

/* Dark overlay, start state */
.my-mfp-zoom-in.mfp-bg {
	opacity: 0;
	-webkit-transition: opacity 0.3s ease-out; 
	-moz-transition: opacity 0.3s ease-out; 
	-o-transition: opacity 0.3s ease-out; 
	transition: opacity 0.3s ease-out;
}
/* animate in */
.my-mfp-zoom-in.mfp-ready.mfp-bg {
	opacity: 0.8;
}
/* animate out */
.my-mfp-zoom-in.mfp-removing.mfp-bg {
	opacity: 0;
}



/**
 * Fade-move animation for second dialog
 */

/* at start */
.my-mfp-slide-bottom .zoom-anim-dialog {
	opacity: 0;
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	-o-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;

	-webkit-transform: translateY(-20px) perspective( 600px ) rotateX( 10deg );
	-moz-transform: translateY(-20px) perspective( 600px ) rotateX( 10deg );
	-ms-transform: translateY(-20px) perspective( 600px ) rotateX( 10deg );
	-o-transform: translateY(-20px) perspective( 600px ) rotateX( 10deg );
	transform: translateY(-20px) perspective( 600px ) rotateX( 10deg );

}

/* animate in */
.my-mfp-slide-bottom.mfp-ready .zoom-anim-dialog {
	opacity: 1;
	-webkit-transform: translateY(0) perspective( 600px ) rotateX( 0 ); 
	-moz-transform: translateY(0) perspective( 600px ) rotateX( 0 ); 
	-ms-transform: translateY(0) perspective( 600px ) rotateX( 0 ); 
	-o-transform: translateY(0) perspective( 600px ) rotateX( 0 ); 
	transform: translateY(0) perspective( 600px ) rotateX( 0 ); 
}

/* animate out */
.my-mfp-slide-bottom.mfp-removing .zoom-anim-dialog {
	opacity: 0;

	-webkit-transform: translateY(-10px) perspective( 600px ) rotateX( 10deg ); 
	-moz-transform: translateY(-10px) perspective( 600px ) rotateX( 10deg ); 
	-ms-transform: translateY(-10px) perspective( 600px ) rotateX( 10deg ); 
	-o-transform: translateY(-10px) perspective( 600px ) rotateX( 10deg ); 
	transform: translateY(-10px) perspective( 600px ) rotateX( 10deg ); 
}

/* Dark overlay, start state */
.my-mfp-slide-bottom.mfp-bg {
	opacity: 0;

	-webkit-transition: opacity 0.3s ease-out; 
	-moz-transition: opacity 0.3s ease-out; 
	-o-transition: opacity 0.3s ease-out; 
	transition: opacity 0.3s ease-out;
}
/* animate in */
.my-mfp-slide-bottom.mfp-ready.mfp-bg {
	opacity: 0.8;
}
/* animate out */
.my-mfp-slide-bottom.mfp-removing.mfp-bg {
	opacity: 0;
}


/*** Smile Gallery ***/


.smilegallery{
	position:relative;
padding:70px 0px 70px 0px;
background:#fff
}

@media (max-width:478px){
	

.smilegallery .twentytwenty-container img{
width:100%;
}

.smilegallery .twentytwenty-container{
margin:20px 
}	

.treatment-name{
	background: linear-gradient(45deg, rgba(225, 172, 70, 1) 0%, rgba(241, 198, 100, 1) 50%, rgba(225, 172, 70, 1) 100%);
	padding:10px;
	box-shadow: 0px 15px 20px -15px #111;
	text-align:center;
	font-weight:500;
	font-size:1.1rem;
	text-transform:uppercase;
	color:#fff;
	position:relative;
	top:-20px
}
	
	
	.smilegallery .treat-item {
	    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;	
			background:#f7f7f7;
			margin-bottom:20px			
}



}

@media (max-width:320px){
	
.smilegallery h3{
	color:#383737 !important;
	font-weight:500 !important;
	font-size:1rem
}

.smilegallery .treat-item {
	    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;	
			background:#f7f7f7;
			margin-bottom:20px			
}


}

/*** Happy Patients ***/


.happypatients{
	position:relative;
padding:70px 0px 70px 0px;
background:#f7f7f7
}

.happypatients img{
	background-image: linear-gradient(-90deg, #f6f6f6, #f6f6f6, #f4c47d, #f8d993, #f8d993, #e1ac46, #e1ac46);
	padding:4px;
	border-top-left-radius: 18px;
	border-bottom-left-radius:18px
}


.happypatients p {
	margin:50px 20px 0px 0px;
	text-align:justify
}

/*************************
******Carousel CSS****
**************************/

.list_carousel2.responsive {
width: auto;
margin-left:0;
margin-bottom:10px;
    box-shadow: 0px 15px 20px -15px #111;
	background:#fff;
	overflow:hidden;
	border-radius:18px
}


.list_carousel2 ul {
margin: 0;
padding: 0;
list-style: none;
display: block;
border-radius:8px;
}

.list_carousel2 li {
width:100%;
height:308px;
display: block;
margin-right:50px;	
float:left;
}

.list_carousel2 li .pat{
	display:block;
	margin:0px 50px 0px 0px
}


.even-control-left, 
.even-control-right {
  position: absolute;
  color: #4ea9a4;
  padding-left:10px;
  padding-right:10px;
}

.even-control-left i{
 width: 50px;
    height: 50px;
    transition: all 0.4s;
    padding: 10px;
            background: linear-gradient(45deg, rgba(225, 172, 70, 1) 0%, rgba(241, 198, 100, 1) 50%, rgba(225, 172, 70, 1) 100%);
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 5px; 
    position: relative;
    padding:5px 0px 10px 15px;
	color:#fff;
	font-size:38px
}

.even-control-right i{
 width: 50px;
    height: 50px;
    transition: all 0.4s;
    padding: 10px;
            background: linear-gradient(45deg, rgba(225, 172, 70, 1) 0%, rgba(241, 198, 100, 1) 50%, rgba(225, 172, 70, 1) 100%);
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 5px; 
    position: relative;
    padding:5px 0px 10px 15px;
	color:#fff;
	font-size:38px
}

.even-control-left i:hover, 
.even-control-right i:hover{
  background: #000;
  color:#e1ac46!important
}

.even-control-left {
  right:13%;
  top:250px;
  width:30px;
  height:30px;
  padding-top:0px;
  padding-left:8px;
  position:absolute;
  right:130px
} 

.even-control-right {
  right:8%;
  top:320px;
  width:30px;
  height:30px;
  padding-top:0px;
  padding-right:8px;
  position:absolute;
  right:130px
}

.name {
    font-weight: 600;
    font-size: 24px;
    width: 100%;
margin-top: 15px;
color:#e1ac46
}


@media (max-width:1024px){
	
.list_carousel2 li {
width:100%;
height:190px;
display: block;
margin-right:50px;	
float:left;
}
	
.happypatients p {
	margin:5px 0px 0px 0px;
	text-align:justify
}

.name {
    font-weight: 600;
    font-size: 24px;
    width: 100%;
margin-top: 5px;
}	

.even-control-left {
  right:13%;
  top:195px;
  width:30px;
  height:30px;
  padding-top:0px;
  padding-left:8px;
  position:absolute;
  right:90px
} 

.even-control-right {
  right:8%;
  top:255px;
  width:30px;
  height:30px;
  padding-top:0px;
  padding-right:8px;
  position:absolute;
  right:90px
}
	
}


@media (max-width:893px){
	
.list_carousel2 li {
width:100%;
height:550px;
display: block;
margin-right:50px;	
float:left;
padding:40px
}
	
.happypatients p {
	margin:5px 0px 0px 0px;
	text-align:justify
}

.name {
    font-weight: 600;
    font-size: 24px;
    width: 100%;
margin-top: 5px;
}	

.even-control-left {
  right:13%;
  top:195px;
  width:30px;
  height:30px;
  padding-top:0px;
  padding-left:8px;
  position:absolute;
  right:90px
} 

.even-control-right {
  right:8%;
  top:255px;
  width:30px;
  height:30px;
  padding-top:0px;
  padding-right:8px;
  position:absolute;
  right:90px
}

.happypatients p {
	margin:20px 0px 0px 0px;
	text-align:justify
}

.happypatients img{
	background-image: linear-gradient(-90deg, #f6f6f6, #f6f6f6, #f4c47d, #f8d993, #f8d993, #e1ac46, #e1ac46);
	padding:4px;
	border-top-left-radius: 18px;
	border-bottom-left-radius:18px;
	border-top-right-radius: 18px;
	border-bottom-right-radius:18px
}
	
}


@media (max-width:768px){

.even-control-left {
  right:13%;
  top:195px;
  width:30px;
  height:30px;
  padding-top:0px;
  padding-left:8px;
  position:absolute;
  right:70px
} 

.even-control-right {
  right:8%;
  top:255px;
  width:30px;
  height:30px;
  padding-top:0px;
  padding-right:8px;
  position:absolute;
  right:70px
}
	
	
}


@media (max-width:600px){
	
.list_carousel2 li {
width:100%;
height:460px;
display: block;
margin-right:50px;	
float:left;
padding:40px
}

.even-control-left {
  right:13%;
  top:195px;
  width:30px;
  height:30px;
  padding-top:0px;
  padding-left:8px;
  position:absolute;
  right:60px
} 

.even-control-right {
  right:8%;
  top:255px;
  width:30px;
  height:30px;
  padding-top:0px;
  padding-right:8px;
  position:absolute;
  right:60px
}

}


@media (max-width:478px){
	
.list_carousel2 li {
width:100%;
height:400px;
display: block;
margin-right:50px;	
float:left;
padding:10px
}

.even-control-left {
  right:13%;
  top:195px;
  width:30px;
  height:30px;
  padding-top:0px;
  padding-left:8px;
  position:absolute;
  right:50px
} 

.even-control-right {
  right:8%;
  top:255px;
  width:30px;
  height:30px;
  padding-top:0px;
  padding-right:8px;
  position:absolute;
  right:50px
}
	
}

@media (max-width:320px){
	
.even-control-left {
  right:13%;
  top:175px;
  width:20px;
  height:20px;
  padding-top:0px;
  padding-left:8px;
  position:absolute;
  right:50px
} 

.even-control-right {
  right:8%;
  top:235px;
  width:20px;
  height:20px;
  padding-top:0px;
  padding-right:8px;
  position:absolute;
  right:50px
}

.list_carousel2 li {
width:100%;
height:auto;
display: block;
margin-right:50px;	
float:left;
padding:10px
}

.list_carousel2 li img{
	display:none
}
	
}




/*** Meet The Expert ***/


.dentists{
background:#fff;
position:relative;
padding:70px 0px 70px 0px;
}

.dentists p{
	margin-bottom:30px
}

.ess{
	color:#e1ac46
}

.dentists img{
background-image: linear-gradient(90deg, #f8d993, #f8d993, #f4c47d, #e1ac46, #e1ac46, #f8d993, #f8d993);
padding:6px;
box-shadow: 0px 15px 20px -15px #111;
}

.dentists h3{
    font-size:35px;
	text-transform:uppercase;
	display:block
}


.refer{
	background-image: linear-gradient(to right, rgba(228, 170, 73, 0.8), rgba(228, 170, 73, 0.8), rgba(228, 170, 73, 0.1));
    padding: 10px 15px;
	color:#000;
	font-size:19px;
	font-weight:500;
	border-radius:5px;
}

.refer:hover{
background-image: linear-gradient(to right, rgba(228, 170, 73, 0.1), rgba(228, 170, 73, 0.8), rgba(228, 170, 73, 0.8));	
	color:#000;
}

@media (max-width: 478px) {
	.refer{
	background-image: linear-gradient(to right, rgba(228, 170, 73, 0.8), rgba(228, 170, 73, 0.8), rgba(228, 170, 73, 0.1));
    padding: 10px 5px;
	color:#000;
	font-size:17px;
	font-weight:500;
	border-radius:5px;
}

}


@media (max-width: 320px) {
	.refer{
	background-image: linear-gradient(to right, rgba(228, 170, 73, 0.8), rgba(228, 170, 73, 0.8), rgba(228, 170, 73, 0.1));
    padding: 10px 5px;
	color:#000;
	font-size:13px;
	font-weight:500;
	border-radius:5px;
}

}



/*** Book an appointment ***/


.bookanappointment{
background: linear-gradient(rgba(0, 0, 0, .5), rgba(0, 0, 0, .5)), url(../img/background.jpg) no-repeat center center;
padding:70px 0px;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

.bookanappointment h2::after {
    content: "";
    position: absolute;
    display: block;
    width: 30px;
    height: 2px;
    background: #fff;
    left: calc(50% - 20px);
    margin-top: 5px;
}

/* Input form */
.form-control {
  padding: 10px 20px;
  margin:10px;
  border:1px solid transparent;
      display: block;
    width: 100%;
    height: 34px;
    padding: 0px 12px 12px 12px;
    color: #fff!important;
    background-color: transparent !important;
    border-bottom: 1px solid #fff !important;
}

.form-control::placeholder {
  color: #fff;
  opacity: 1; /* Firefox */
}

input, select, textarea{
    color: #fff!important;
}

textarea:focus, input:focus {
    color: #fff!important;
	    background-color: transparent !important;
    border-bottom: 1px solid #fff !important;
	border-top:1px solid transparent;
	border-left:1px solid transparent;
	border-right:1px solid transparent
}



.form-control:focus {
  box-shadow: none;
  border: 1px solid transparent;	
}

.button-53 {
      background: linear-gradient(45deg, rgba(225, 172, 70, 1) 0%, rgba(241, 198, 100, 1) 50%, rgba(225, 172, 70, 1) 100%);
  color: #000;
  font-size: 16px;
  font-weight: 600;
  line-height: 24px;
  padding: 16px 14px;
  text-decoration: none;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
  border-radius:28px;
}

.button-53:hover,
.button-53:active {
  outline: 0;
  background: #000;
  color:#e1ac46!important
}



@media (max-width: 768px) {
  .button-53 {
    padding: 16px 32px;
  }
}



/*** Footer ***/
.footer {
    background: linear-gradient(45deg, rgba(225, 172, 70, 1) 0%, rgba(241, 198, 100, 1) 50%, rgba(225, 172, 70, 1) 100%);
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.7;
    color: #fff;
    text-align: left;
}

.footer h6{
	color:#fff !important
}

.footer h3::after {
content: "";
    position: absolute;
    display: block;
    width: 30px;
    height: 2px;
    background: #fff;
    left: calc(50% - 195px);
    margin-top: 5px;
}

.footer h4::after {
 content: "";
    position: absolute;
    display: block;
    width: 30px;
    height: 2px;
    background: #fff;
    right: calc(50% - 280px);
    margin-top: 5px;
}

@media (max-width:1024px){

.footer h3::after {
content: "";
    position: absolute;
    display: block;
    width: 30px;
    height: 2px;
    background: #fff;
    left: calc(50% - 220px);
    margin-top: 5px;
}
	
}


@media (max-width:893px){
	
.footer h3::after {
content: "";
    position: absolute;
    display: block;
    width: 30px;
    height: 2px;
    background: #fff;
    left: calc(50% - 160px);
    margin-top: 5px;
}	
}

@media (max-width:768px){
	
.footer h3::after {
content: "";
    position: absolute;
    display: block;
    width: 30px;
    height: 2px;
    background: #fff;
    left: calc(50% - 260px);
    margin-top: 5px;
}	
}

@media (max-width:478px){
	
.footer h3::after {
content: "";
    position: absolute;
    display: block;
    width: 30px;
    height: 2px;
    background: #fff;
    left: calc(50% - 175px);
    margin-top: 5px;
}	
}

@media (max-width:320px){
	
.footer h3::after {
content: "";
    position: absolute;
    display: block;
    width: 30px;
    height: 2px;
    background: #fff;
    left: calc(50% - 135px);
    margin-top: 5px;
}	
}

.footer .copyright {
    padding: 10px 0;
    font-size: 17px;
	font-weight:500
}



.footer .footer-menu a {
    margin-right: 15px;
    padding-right: 15px;
    border-right: 1px solid rgba(255, 255, 255, .3);
}

.footer .footer-menu a:last-child {
    margin-right: 0;
    padding-right: 0;
    border-right: none;
}

.footer i{
	font-size:25px;
	color:#fff;
	padding:7px
}

.footer .footer-item a {
    line-height: 35px;
    color: var(--bs-body);
    transition: 0.5s;
}

.footer .footer-item p {
    line-height: 35px;
}


.footer .footer-item img{
	    box-shadow: 0px 15px 20px -15px #111;
}


@media (max-width:320px){
.footer .footer-item img{
	max-height:70px
}
	
}


/* Privacy Policy */
#privacy-policy {
	background: white;
	padding: 10px;
	text-align: left;
	max-width: 850px;
	margin: 40px auto;
	position: relative;
	max-height:600px;
	overflow-y:auto
}

#privacy-policy p{
	margin-bottom:0px
}

#privacy-policy i{
	color:#e1ac46
}

#privacy-policy .table td, .table th {padding: 0;}


#privacy-policy h3::after {
    content: "";
    position: absolute;
    display: block;
    width: 30px;
    height: 2px;
    background: #000;
    left: calc(50% - 20px);
    margin-top: 5px;
}

#privacy-policy li{
	margin-left:30px
}

#privacy-policy li::marker {
  color: #e1ac46;
}

/*** Footer End ***/

/*** copyright Start ***/
.copyright {
    background: var(--bs-dark);
	font-size:0.9em;
	color:#fff;

}


/*** copyright end ***/




































