body {
  font-family: 'Roboto', sans-serif;
}


body {
  overflow-x: hidden;
  /* Hide horizontal scrollbar */
}

.card p {
  text-align: justify;
}

.card {
    /*width: 100%;*/
    height: 100%;
}


.font-size {
  font-size: 500px;
}

.font {
  font-family: sans-serif;
}

.nav-link {
  color: white;
}

.dropdown-toggle::after {
  display: none !important;
}

.carousel>.carousel-inner>.carousel-item>img {
  /* Yeap you can change the width and height*/
  height: 550px;

}

.fsize {
  font-size: 18px;
}


.button-3 {
  background-color: #71a3ca;
  border-radius: 20px;
  cursor: pointer;
  color: #fff;

  transition: all 0.25s ease-out;
}

.button-3:hover {

  cursor: pointer;
  transform: scale(1.25);
  background: #FFB367;
  color: #000;
}

.mtop {
    margin-top: 57px;
    /*margin-top: 100px;*/
}

.margintop {
  margin-top: 150px;
}

/* animation css */
.animation {
  /* animation properties */
  animation-name: my-animation;
  animation-duration: 2s;
  animation-direction: alternate;
  animation-iteration-count: infinite;
  animation-timing-function: linear;

  /* other properties */
  border-radius: 10px;
  position: ;
  left: 0;
  right: 0;
  margin-left: auto;
  margin-right: auto;

}

@keyframes my-animation {
  from {
    /* background-color: #ff7a59; */
    width: px;
    top: 10px;
  }

  to {
    /* background-color: #33475b; */
    width: px;
    top: 100px;
  }
}


/* sucess story card css */
.card:hover {
    transform: scale(1.05);
    box-shadow: 0 10px 20px rgba(0, 0, 0, .12), 0 4px 8px rgba(0, 0, 0, .06);
}

.testimonial-card .card-up {
  height: 120px;
  overflow: hidden;
  border-top-left-radius: 0.25rem;
  border-top-right-radius: 0.25rem;
}

.testimonial-card .avatar {
  width: 110px;
  margin-top: -60px;
  overflow: hidden;
  border: 3px solid #fff;
  border-radius: 50%;
}

.tales {
  width: 80%;
}


/* corousel caption */
.carousel-content {
  position: absolute;
  bottom: 60%;
  left: 18%;
  z-index: 20;
  text-shadow: 0 1px 2px rgba(0, 0, 0, .6);
  /*font-size: ;*/
}

.clinic-carousel {
  width: 100%;
  height: 600px;
  /*height:auto;*/
}

/* color code
  #91d0cc
  #d9be93
  #0192bc
  #44f3c9 
  
  style="background-color: #background: rgb(34,195,169);
                    background: linear-gradient(0deg, rgba(34,195,169,1) 0%, rgba(65,192,174,1) 14%, rgba(100,191,150,1) 30%, rgba(139,190,123,1) 48%, rgba(187,189,90,1) 70%, rgba(218,188,69,1) 84%, rgba(253,187,45,1) 100%);
                    ;">*/

#91d0cc

/* navbar hover effect css */
.navbar .navbar-nav .nav-link {
  color: #fff;
  font-size: 1.1em;
}

.navbar .navbar-nav .nav-link:hover {
  background-color: #FFB367;
  color: #fff;
}

.list:hover {
  color: #FFB367;
}

.icon-hover:hover {
  /* background-color: #FFB367; */
  color: #FFB367;

}

@media screen and (max-width: 768px) {
    /* General Page Layout */
    body {
        font-family: 'Roboto', sans-serif;
        padding: 10px;
        font-size: 16px;
    }

    /* Navigation */
    .navbar .navbar-nav {
        display: block;
        text-align: center;
    }

        .navbar .navbar-nav ul {
            padding: 0;
            list-style-type: none;
        }

            .navbar .navbar-nav ul li {
                margin-bottom: 10px;
            }

                .navbar .navbar-nav ul li a {
                    font-size: 18px;
                }

    /* Header */
    header {
        text-align: center;
    }

    /* Hero Section */
    .hero-section {
        font-size: 18px;
    }

        .hero-section h1 {
            font-size: 22px;
        }

        .hero-section img {
            width: 100%;
        }

    /* Sections */
    section {
        padding: 20px 0;
    }

    /* Images */
    img {
        /*width: 100%;*/
        height: auto;
    }

    /* Form Adjustments */
    form {
        width: 100%;
    }

        form input, form button {
            width: 100%;
            margin: 10px 0;
        }

    /* Footer */
    footer {
        padding: 20px;
        font-size: 14px;
        text-align: center;
    }
}



