@import url(normalize.css);
@import url(https://fonts.googleapis.com/css?family=Kanit:300,400,500&subset=latin,thai);
@import url(animate.css);
@import url(sidebar.css);
@import url(bootstrap.min.css);
body {
  font-family: "Kanit", sans-serif;
  font-size: 14px;
  font-weight: 300;
}

img {
  max-width: 100%;
  height: auto;
}

a {
  text-decoration: none !important;
}

p {
  font-weight: 300;
  color: #808080;
}

#sidebar-wrapper {
  background-color: #b3d8ec;
  z-index: 0;
}

#sidebar-wrapper .sidebar-brand {
  background-color: #fff;
  padding: 20px 40px;
}

#sidebar-wrapper .sidebar-nav {
  position: relative;
}

#sidebar-wrapper .sidebar-nav li.active a {
  background-color: #80bedf;
}

#sidebar-wrapper .sidebar-nav li a {
  color: #fff;
  border-bottom: 1px solid #fff;
  padding: 10px 20px;
}

#sidebar-wrapper .sidebar-nav li a:hover {
  background-color: #80bedf;
}

#sidebar-wrapper .sidebar-nav .nav-icon a {
  position: relative;
}

#sidebar-wrapper .sidebar-nav .nav-icon a:before {
  content: '';
  display: block;
  background-size: 100%;
  background-repeat: no-repeat;
  width: 30px;
  height: 30px;
  position: absolute;
  top: 50%;
  margin-top: -15px;
}

#sidebar-wrapper .sidebar-nav .nav-icon a span {
  margin-left: 20px;
}

#sidebar-wrapper .sidebar-nav .nav-about a:before {
  background-image: url("../img/icon/icon-about.png");
}

#sidebar-wrapper .sidebar-nav .nav-services a:before {
  background-image: url("../img/icon/icon-service.png");
}

#sidebar-wrapper .sidebar-nav .nav-dentists a:before {
  background-image: url("../img/icon/icon-dentist.png");
}

#sidebar-wrapper .sidebar-nav .nav-why a:before {
  background-image: url("../img/icon/icon-why-us.png");
}

#sidebar-wrapper .sidebar-nav .nav-sterilization a:before {
  background-image: url("../img/icon/icon-Sterilization.png");
}

#sidebar-wrapper .sidebar-nav .nav-payment a:before {
  background-image: url("../img/icon/icon-payment.png");
}

#sidebar-wrapper .sidebar-nav .nav-article a:before {
  background-image: url("../img/icon/icon-article.png");
}

#sidebar-wrapper .sidebar-nav .nav-contact a:before {
  background-image: url("../img/icon/icon-contact.png");
}

.page-title {
  margin: 0;
  font-weight: 500;
  margin-top: 17px;
}

.wrapper-top {
  background-color: #80bedf;
  height: 77px;
  color: #fff;
  text-transform: uppercase;
  text-align: center;
  position: relative;
  z-index: 999;
}

.wrapper-top:after {
  content: '';
  display: block;
  clear: both;
}

.wrapper-top a#menu-toggle {
  border-radius: 0;
  background-color: transparent;
  border-top: 0;
  border-bottom: 0;
  border-left: 0;
  border-right: 1px solid #fff;
  position: absolute;
  left: 0;
  top: 0;
  color: #fff;
  float: left;
  height: 77px;
  padding: 30px 26px 26px 26px;
  font-size: 30px;
  display: block;
  margin: 0;
  line-height: 0;
}

.wrapper-top a#menu-toggle .icon-bar {
  background-color: #fff;
}

.wrapper-top .lang {
  margin: 0;
  margin-top: 27px;
  text-align: right;
}

.wrapper-top .lang li {
  padding: 0;
}

.wrapper-top .lang li:first-child:after {
  content: '/';
  padding-left: 5px;
  color: #608fa7;
}

.wrapper-top .lang li a {
  color: #608fa7;
}

.wrapper-top .lang .active a {
  color: #fff;
}

#page-content-wrapper {
  padding: 0;
  border-radius: 0;
}

#menu-toggle {
  display: block !important;
}

.height-left.active {
  height: 100% !important;
}

.wrapper-content {
  padding: 0 15px;
  min-height: 100vh;
}

.wrapper-dentists {
  padding: 20px 15px 20px 15px;
  margin-top: 30px;
  transition: .5s all;
}

.wrapper-dentists:hover,
.wrapper-dentists.active {
  background-color: #80bedf;
}

.wrapper-dentists:hover .name,
.wrapper-dentists.active .name {
  color: #fff;
}

.wrapper-dentists .img-dentist {
  padding: 0 10px;
}

.wrapper-dentists img {
  border-radius: 50%;
  margin-bottom: 15px;
}

.wrapper-dentists .meta {
  color: #808080;
}

.name {
  color: #80bedf;
}

.wrapper-right {
  position: relative;
}

.wrapper-right .right-content {
  min-height: 100vh;
  padding: 25px;
  color: #808080;
}

.wrapper-right .right-content img {
  margin-bottom: 10px;
}

.detail-items,
.wrapper-description {
  display: none;
}

.detail-items.active,
.wrapper-description.active {
  display: block;
}

.no-padding {
  padding: 0 !important;
}

ul.nav.nav-tabs {
  border-bottom: 1px solid #f2f2f2;
}

ul.nav.nav-tabs > li {
  border: 0 !important;
}

ul.nav.nav-tabs > li.active {
  background-color: #50add8;
}

ul.nav.nav-tabs > li.active a {
  background-color: #50add8;
  border-radius: 0 30px 0px 0;
  color: #fff;
  border: 0;
}

ul.nav.nav-tabs > li:first-child {
  background-color: #50add8;
}

ul.nav.nav-tabs > li:first-child.active {
  background-color: #b3d8ec;
}

ul.nav.nav-tabs > li:first-child.active a {
  background-color: #50add8;
  border-radius: 0 30px 0px 0;
  color: #fff;
  border: 0;
}

ul.nav.nav-tabs > li:last-child {
  background-color: #fff;
}

ul.nav.nav-tabs > li a {
  background-color: #b3d8ec;
  border-radius: 0 30px 0px 0;
  color: #80bedf;
  border: 0;
}

.bg-white {
  background-color: #fff;
}

.bg-gray {
  background-color: #f2f2f2;
}

.bg-gray ul.nav.nav-tabs li:last-child {
  background-color: #f2f2f2;
}

.wrapper-services {
  background-color: transparent !important;
  padding: 0 !important;
}

.wrapper-services.active > a {
  background-position: 0 -406px;
}

.wrapper-services > a {
  display: block;
  width: 192px;
  min-height: 202px;
  margin: auto;
  background-repeat: no-repeat;
  background-size: 100%;
}

.wrapper-services > a:hover {
  background-position: 0 -203px;
}

.wrapper-services .dentist-1 {
  background-image: url("../img/img-service/bt-service-veneer.png");
}

.wrapper-services .dentist-2 {
  background-image: url("../img/img-service/bt-service-root-canal-treatment.png");
}

.wrapper-services .dentist-3 {
  background-image: url("../img/img-service/bt-service-filling.png");
}

.wrapper-services .dentist-4 {
  background-image: url("../img/img-service/bt-service-periodontal-treatment.png");
}

.wrapper-services .dentist-5 {
  background-image: url("../img/img-service/bt-service-gingical-graft.png");
}

.wrapper-services .dentist-6 {
  background-image: url("../img/img-service/bt-service-crown-lightening.png");
}

.wrapper-services .dentist-7 {
  background-image: url("../img/img-service/bt-service-extraction.png");
}

.wrapper-services .dentist-8 {
  background-image: url("../img/img-service/bt-service-pedodontics.png");
}

.wrapper-services .dentist-9 {
  background-image: url("../img/img-service/bt-service-bleaching.png");
}


.affix {
  position: fixed;
  bottom: 2%;
  right: 1%;
}

.affix a {
  background-color: #80bedf;
  color: #fff;
}

.theme-sky #sidebar-wrapper {
  background-color: #b3d8ec;
}

.theme-sky #sidebar-wrapper .sidebar-nav li.active a {
  background-color: #80bedf;
}

.theme-sky #sidebar-wrapper .sidebar-nav li a {
  color: #fff;
}

.theme-sky #sidebar-wrapper .sidebar-nav li a:hover {
  background-color: #80bedf;
}

.theme-sky .wrapper-top {
  background-color: #80bedf;
  color: #fff;
}

.theme-sky .wrapper-top .lang li:first-child:after {
  color: #608fa7;
}

.theme-sky .wrapper-top .lang li a {
  color: #608fa7;
}

.theme-sky .wrapper-top .lang .active a {
  color: #fff;
}

.theme-sky .wrapper-dentists:hover,
.theme-sky .wrapper-dentists.active {
  background-color: #80bedf;
}

.theme-sky .wrapper-dentists:hover .name,
.theme-sky .wrapper-dentists.active .name {
  color: #fff;
}

.theme-sky .wrapper-dentists .meta {
  color: #808080;
}

.theme-sky .name {
  color: #80bedf;
}

.theme-sky ul.nav.nav-tabs {
  border-bottom: 1px solid #f2f2f2;
}

.theme-sky ul.nav.nav-tabs > li.active {
  background-color: #50add8;
}

.theme-sky ul.nav.nav-tabs > li.active a {
  background-color: #50add8;
  color: #fff;
}

.theme-sky ul.nav.nav-tabs > li:first-child {
  background-color: #50add8;
}

.theme-sky ul.nav.nav-tabs > li:first-child.active {
  background-color: #b3d8ec;
}

.theme-sky ul.nav.nav-tabs > li:first-child.active a {
  background-color: #50add8;
}

.theme-sky ul.nav.nav-tabs > li:last-child {
  background-color: #f2f2f2;
}

.theme-sky ul.nav.nav-tabs > li a {
  background-color: #b3d8ec;
  color: #80bedf;
}

.theme-sky .bg-white {
  background-color: #fff;
}

.theme-sky .bg-gray {
  background-color: #f2f2f2;
}

.theme-sky .bg-gray ul.nav.nav-tabs li:last-child {
  background-color: #f2f2f2;
}





/* Large Devices, Wide Screens */
/* Medium Devices, Desktops */
@media only screen and (max-width: 992px) {
  .wrapper-top a#menu-toggle {
    padding: 32px 26px 26px 26px;
  }
  .wrapper-top .lang {
    margin-top: 30px;
  }
  .wrapper-top .lang li:after {
    display: none;
  }
  .nav-tabs {
    border-bottom: 1px solid #ddd;
    margin-top: 30px;
  }
  h1.page-title {
    margin-left: 77px;
    margin-top: 19px; font-size: larger
	
  }
  .wrapper-services.active > a {
    background-position: 0 -264px;
  }
  .wrapper-services > a {
    width: 125px;
    min-height: 132px;
    margin: auto;
  }
  .wrapper-services > a:hover {
    background-position: 0 -132px;
  }
  #page-content-wrapper {
    padding: 0;
    border-radius: 0;
  }
}

/* Small Devices, Tablets */
/* Extra Small Devices, Phones */
/* Custom, iPhone Retina */
@media only screen and (max-width: 320px) {
  .wrapper-top a#menu-toggle {
    padding: 32px 26px 26px 26px;
  }
  .wrapper-top .lang {
    margin-top: 30px;
  }
  .wrapper-top .lang li:after {
    display: none;
  }
}

/* Custom for iPad landscape layouts only */
@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation: landscape) {
  .wrapper-services > a {
    width: 121px;
    min-height: 127px;
    margin: auto;
  }
  .wrapper-services > a:hover {
    background-position: 0 -127px;
  }
  .wrapper-services.active > a {
    background-position: 0 -256px;
  }
}



/* theme-orange */
.theme-orange #sidebar-wrapper {
  background-color: #f0cca2;
}

.theme-orange #sidebar-wrapper .sidebar-nav li.active a {
  background-color: #f0cca2;
}

.theme-orange #sidebar-wrapper .sidebar-nav li a {
  color: #fff;
}

.theme-orange #sidebar-wrapper .sidebar-nav li a:hover {
  background-color: #ecc08b;
}

.theme-orange .wrapper-top {
  background-color: #ecc08b;
  color: #fff;
}

.theme-orange .wrapper-top .lang li:first-child:after {
  color: #808080;
}

.theme-orange .wrapper-top .lang li a {
  color: #808080;
}

.theme-orange .wrapper-top .lang .active a {
  color: #fff;
}


.theme-orange .name {
  color: #f0cca2;
}

.theme-orange ul.nav.nav-tabs {
  border-bottom: 1px solid #f2f2f2;
}

.theme-orange ul.nav.nav-tabs > li.active {
  background-color: #edab64;
}

.theme-orange ul.nav.nav-tabs > li.active a {
  background-color: #edab64;
  color: #fff;
}

.theme-orange ul.nav.nav-tabs > li:first-child {
  background-color: #ecc08b;
}

.theme-orange ul.nav.nav-tabs > li:first-child.active {
  background-color: #ecc08b;
}

.theme-orange ul.nav.nav-tabs > li:first-child.active a {
  background-color: #ecc08b;
}

.theme-orange ul.nav.nav-tabs > li:last-child {
  background-color: #f2f2f2;
}

.theme-orange ul.nav.nav-tabs > li a {
  background-color: #ecc08b;
  color: #f0cca2;
}

.theme-orange .bg-white {
  background-color: #fff;
}

.theme-orange .bg-gray {
  background-color: #f2f2f2;
}

.theme-orange .bg-gray ul.nav.nav-tabs li:last-child {
  background-color: #f2f2f2;
}


/* theme-green */
.theme-green #sidebar-wrapper {
  background-color: #aedfd5;
}

.theme-green #sidebar-wrapper .sidebar-nav li.active a {
  background-color: #aedfd5;
}

.theme-green #sidebar-wrapper .sidebar-nav li a {
  color: #fff;
}

.theme-green #sidebar-wrapper .sidebar-nav li a:hover {
  background-color: #64d6c8;
}

.theme-green .wrapper-top {
  background-color: #64d6c8;
  color: #fff;
}

.theme-green .wrapper-top .lang li:first-child:after {
  color: #808080;
}

.theme-green .wrapper-top .lang li a {
  color: #808080;
}

.theme-green .wrapper-top .lang .active a {
  color: #fff;
}


.theme-green .name {
  color: #aedfd5;
}

.theme-green ul.nav.nav-tabs {
  border-bottom: 1px solid #f2f2f2;
}

.theme-green ul.nav.nav-tabs > li.active {
  background-color: #64d6c8;
}

.theme-green ul.nav.nav-tabs > li.active a {
  background-color: #64d6c8;
  color: #fff;
}

.theme-green ul.nav.nav-tabs > li:first-child {
  background-color: #64d6c8;
}

.theme-green ul.nav.nav-tabs > li:first-child.active {
  background-color: #64d6c8;
}

.theme-green ul.nav.nav-tabs > li:first-child.active a {
  background-color: #64d6c8;
}

.theme-green ul.nav.nav-tabs > li:last-child {
  background-color: #f2f2f2;
}

.theme-green ul.nav.nav-tabs > li a {
  background-color: #64d6c8;
  color: #aedfd5;
}

.theme-green .bg-white {
  background-color: #fff;
}

.theme-green .bg-gray {
  background-color: #f2f2f2;
}

.theme-green .bg-gray ul.nav.nav-tabs li:last-child {
  background-color: #f2f2f2;
}




/* theme-pink */
.theme-pink #sidebar-wrapper {
  background-color: #e6acc4;
}

.theme-pink #sidebar-wrapper .sidebar-nav li.active a {
  background-color: #d5759c;
}

.theme-pink #sidebar-wrapper .sidebar-nav li a {
  color: #fff;
}

.theme-pink #sidebar-wrapper .sidebar-nav li a:hover {
  background-color: #d5759c;
}

.theme-pink .wrapper-top {
  background-color: #d5759c;
  color: #fff;
}

.theme-pink .wrapper-top .lang li:first-child:after {
  color: #608fa7;
}

.theme-pink .wrapper-top .lang li a {
  color: #608fa7;
}

.theme-pink .wrapper-top .lang .active a {
  color: #fff;
}

.theme-pink .wrapper-dentists:hover,
.theme-pink .wrapper-dentists.active {
  background-color: #d5759c;
}

.theme-pink .wrapper-dentists:hover .name,
.theme-pink .wrapper-dentists.active .name {
  color: #fff;
}

.theme-pink .wrapper-dentists .meta {
  color: #808080;
}

.theme-pink .name {
  color: #d5759c;
}

.theme-pink ul.nav.nav-tabs {
  border-bottom: 1px solid #f2f2f2;
}

.theme-pink ul.nav.nav-tabs > li.active {
  background-color: #e05392;
}

.theme-pink ul.nav.nav-tabs > li.active a {
  background-color: #e05392;
  color: #fff;
}

.theme-pink ul.nav.nav-tabs > li:first-child {
  background-color: #e05392;
}

.theme-pink ul.nav.nav-tabs > li:first-child.active {
  background-color: #e6acc4;
}

.theme-pink ul.nav.nav-tabs > li:first-child.active a {
  background-color: #e05392;
}

.theme-pink ul.nav.nav-tabs > li:last-child {
  background-color: #f2f2f2;
}

.theme-pink ul.nav.nav-tabs > li a {
  background-color: #e6acc4;
  color: #d5759c;
}

.theme-pink .bg-white {
  background-color: #fff;
}

.theme-pink .bg-gray {
  background-color: #f2f2f2;
}

.theme-pink .bg-gray ul.nav.nav-tabs li:last-child {
  background-color: #f2f2f2;
}



.carousel-control.left {
    background-image: none; 
}
.carousel-control.right {
    background-image: none; 

}




/* add */
.wrapper-frame {
  padding: 0px 15px 20px 15px;
  margin-top: 30px;
  transition: .5s all;
}

.wrapper-slider {
  padding-left: -30px;
  padding-right:-30px;
  padding-top:-20px;
  padding-bottom:0px;
  transition: .5s all;
}

.wrapper-img {
  padding: 0px;
  margin-top: 30px;
  transition: .5s all;
}

.wrapper-img img {
	width:100%;
	height:auto;
	padding-bottom:20px
}

/* table */
.table-bordered {
    border: 1px solid #f2f2f2;
}
.table-bordered > tbody > tr > td, .table-bordered > tbody > tr > th, .table-bordered > tfoot > tr > td, .table-bordered > tfoot > tr > th, .table-bordered > thead > tr > td, .table-bordered > thead > tr > th {
    border: 2px solid #f2f2f2;
}
.table-title { background-color:rgba(244,112,0,1.00); color:rgba(255,255,255,1.00); font-size:18px}
.table-bg {background-color:#f0cca2}
.table-striped>tbody>tr:nth-of-type(odd){background-color:}
.table { color:rgba(113,113,113,1.00)}



/* service */
.wrapper-services .dentist-10 {
  background-image: url("../img/img-service/bt-service-braces.png");
}

.wrapper-services .dentist-11 {
  background-image: url("../img/img-service/bt-service-implant.png");
}

.wrapper-services .dentist-12 {
  background-image: url("../img/img-service/bt-service-amalgam-removal.png");
}

.wrapper-services .dentist-13 {
  background-image: url("../img/img-service/bt-service-diasteme-closure.png");
}

.wrapper-services .dentist-14 {
  background-image: url("../img.png");
}







/* service Thai */
.wrapper-services .dentist-1-th {
  background-image: url("../img/img-service/bt-service-veneer-th.gif");
}

.wrapper-services .dentist-2-th {
  background-image: url("../img/img-service/bt-service-root-canal-treatment-th.gif");
}

.wrapper-services .dentist-3-th {
  background-image: url("../img/img-service/bt-service-filling-th.gif");
}

.wrapper-services .dentist-4-th {
  background-image: url("../img/img-service/bt-service-periodontal-treatment-th.gif");
}

.wrapper-services .dentist-5-th {
  background-image: url("../img/img-service/bt-service-gingical-graft-th.gif");
}

.wrapper-services .dentist-6-th {
  background-image: url("../img/img-service/bt-service-crown-lightening-th.gif");
}

.wrapper-services .dentist-7-th {
  background-image: url("../img/img-service/bt-service-extraction-th.gif");
}

.wrapper-services .dentist-8-th {
  background-image: url("../img/img-service/bt-service-pedodontics-th.gif");
}

.wrapper-services .dentist-9-th {
  background-image: url("../img/img-service/bt-service-bleaching-th.gif");
}

.wrapper-services .dentist-10-th {
  background-image: url("../img/img-service/bt-service-braces-th.gif");
}

.wrapper-services .dentist-11-th {
  background-image: url("../img/img-service/bt-service-implant-th.gif");
}

.wrapper-services .dentist-12-th {
  background-image: url("../img/img-service/bt-service-amalgam-removal-th.gif");
}

.wrapper-services .dentist-13-th {
  background-image: url("../img/img-service/bt-service-diasteme-closure-th.gif");
}

.wrapper-services .dentist-14-th {
  background-image: url("../img/img-service/bth.gif");
}

.article img { padding-top: 25px; padding-bottom: 10px}
.text-color-pink { color: #cc6699; padding-bottom: 10px}