@media screen and (max-width: 767px) {
  .slider-contact-form {
    position: relative !important;
    width: 100% !important;
    background: black !important; } }

@media screen and (max-width: 767px) {
  .contact-section a {
    padding: 5px 9px 11px !important; } }

.header-section {
  background-color: #d9850c; }

.header-inner {
  background-color: #01aed9; }

.footer-1 {
  background-color: #01aed9; }

.footer-2 {
  background-color: #d9850c; }

.footer-section a {
  font-size: 14px; }

.slide1 h2 {
  font-size: 3.5rem; }
.slide1 h4 {
  font-size: 2.5rem; }
.slide1 p {
  font-size: 17px; }
.slide1 a {
  background: #cb3146;
  padding: 10px 34px 13px;
  font-size: 20px;
  color: #fff;
  border-radius: 27px;
  width: 38%;
  /* position: absolute; */
  /* left: -12%; */
  border: 2px solid white; }

.service h5 {
  color: #f05098;
  font-size: 18px; }
.service a {
  color: #d9850c;
  font-size: 18px; }

.about {
  background-color: #c8e7ed; }

.bg-2 {
  background-color: #11416e; }
  .bg-2 p {
    font-size: 14px; }

.product1 a {
  color: #d9850c;
  font-size: 18px; }

.doctor h5 {
  padding: 0px; }
.doctor .item {
  text-align: left; }
.doctor .item {
  background-color: #e1e8f0; }

.contact-section {
  background: url(../img/bg2.jpg);
  background-position: center;
  background-size: cover;
  padding: 0;
  padding: 128px; }

.contact-section a {
  background: #cb3146;
  padding: 5px 34px 9px;
  font-size: 20px;
  color: #fff;
  border-radius: 27px;
  width: 38%;
  /* position: absolute; */
  /* left: -12%; */
  border: 2px solid white; }
.contact-section h5 {
  font-family: Muli !important; }

#comparison {
  width: 100%;
  padding-bottom: 86%;
  overflow: hidden;
  position: relative; }
#comparison1 {
  width: 100%;
  padding-bottom: 86%;
  overflow: hidden;
  position: relative; }

figure {
  position: absolute;
  background-image: url(../img/teeth-before.jpg);
  background-size: cover;
  font-size: 0;
  width: 100%;
  height: 88%;
  margin: 0; }

#divisor {
  background-image: url(../img/teeth-after.jpg);
  background-size: cover;
  position: absolute;
  width: 50%;
  box-shadow: 0 5px 10px -2px rgba(0, 0, 0, 0.3);
  bottom: 0;
  height: 100%; }
  #divisor::before, #divisor::after {
    content: '';
    position: absolute;
    right: -2px;
    width: 4px;
    height: calc(50% - 25px);
    background: white;
    z-index: 3; }
  #divisor::before {
    top: 0;
    box-shadow: 0 -3px 8px 1px rgba(0, 0, 0, 0.3); }
  #divisor::after {
    bottom: 0;
    box-shadow: 0 3px 8px 1px rgba(0, 0, 0, 0.3); }

#handle {
  position: absolute;
  height: 50px;
  width: 50px;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  z-index: 1; }
  #handle::before, #handle::after {
    content: '';
    width: 0;
    height: 0;
    border: 6px inset transparent;
    position: absolute;
    top: 50%;
    margin-top: -6px; }
  #handle::before {
    border-right: 6px solid white;
    left: 50%;
    margin-left: -17px; }
  #handle::after {
    border-left: 6px solid white;
    right: 50%;
    margin-right: -17px; }

input[type=range] {
  -webkit-appearance: none;
  -moz-appearance: none;
  position: absolute;
  top: 44%;
  left: -25px;
  transform: translateY(-50%);
  background-color: transparent;
  width: calc(100% + 50px);
  z-index: 2; }
  input[type=range]:focus, input[type=range]:active {
    border: none;
    outline: none; }

input[type=range]::-webkit-slider-thumb {
  -webkit-appearance: none;
  border: none;
  height: 50px;
  width: 50px;
  border-radius: 50%;
  background: transparent;
  border: 4px solid white;
  box-shadow: 0 0 8px 1px rgba(0, 0, 0, 0.3); }

input[type=range]::-moz-range-track {
  -moz-appearance: none;
  height: 15px;
  width: 100%;
  background-color: transparent;
  position: relative;
  outline: none; }

/*# sourceMappingURL=style.css.map */
