/* Fida Marwat (Sr. UXUI and Front End Developer) */

body{
  font-family: 'Poppins', sans-serif;
}

/* For modern browsers */
input::placeholder{
  color: rgba(68, 68, 68, 0.5) !important; 
}

/* For older versions of Internet Explorer */
input:-ms-input-placeholder{
  color: rgba(68, 68, 68, 0.5) !important; 
}

textarea::placeholder{
  color: rgba(68, 68, 68, 0.5) !important; 
}

/* For older versions of Internet Explorer */
textarea:-ms-input-placeholder{
  color: rgba(68, 68, 68, 0.5) !important; 
}

p{
	line-height: 28px;
  font-family: 'Poppins', sans-serif;
  color: #5E6282;
}

ul{
  line-height: 28px;
  list-style: none;
}


h1{
  font-family: 'Poppins', sans-serif;
  font-size: 32px;
  line-height: 40px;
  color: #444;
  font-weight: 700;
}


h2{
  font-family: 'Poppins', sans-serif;
  font-size: 24px;
  line-height: 60px;
  color: #444;
  font-weight: 700;
}

h3{
  font-family: 'Poppins', sans-serif;
  line-height: 42px;
  color: #444;
  font-weight: 500;
}

h5{
  font-family: 'Poppins', sans-serif;
  color: #5E6282;
  font-size: 18px;
  line-height: 30px;
}

.form-control,
.form-select{
  height: 44px;
}

textarea{
  min-height: 100px !important;
}

.carousel-indicators{
  bottom: -60px;
}

.carousel-indicators [data-bs-target] {
  background-color: #30B6F3;
}

.text-primary{
  color: #30B6F3 !important;
}

.text-title{
  color: #002D4B;
}

.text-secondary{
  color: #7B868B !important;
}

.border-secondary{
  color: rgba(255, 255, 255, 1) !important;
}

.btn-primary{
	background-color: #30B6F3 !important;
	border-color: #30B6F3 !important;
  color: #fff;
  padding: 8px 16px;
}

.btn-outline-primary{
  border-color: #30B6F3 !important;
  color: #30B6F3;
  padding: 8px 16px;
}

.btn-primary:hover,
.btn-outline-primary:hover{
  background-color: #012842 !important;
  border-color: #012842 !important;
}

.bg-primary{
  background-color: #30B6F3 !important;
}

.bg-success{
  background-color: #19284E !important;
}

.bg-grey{
  background-color: #F0EFF4 !important;
}

.bg-light{
  background-color: #E7E7FF !important;
}


.line{
  width: 50px;
  margin-bottom: 30px;
  margin-top: 15px;
  height: 6px;
}

hr{
  border-color: #fff;
  margin-top: 60px;
  margin-bottom: 40px;
}

.navbar-nav{
  line-height: unset;
}

.navbar .nav-item{
  padding-left: 6px !important;
  padding-right: 6px !important;
}

.nav-link:focus, .nav-link:hover{
  color: #30B6F3;
}

/* topbar */

#topbar{
  background-color: #012842;
  padding: 8px 0px;
}

/* banner */

#banner{
  background-image: url('../images/banner-img3.jpg');
  background-repeat: no-repeat;
  background-position: center center;
  height: auto;
  padding: 280px 0px;
  background-size: cover;
}

/* banner content */

#banner-content{
  margin: 60px 0px;
}

#banner-content h1 {
  color: #10143b;
  line-height: 60px;
  font-size: 34px;
  font-weight: 500;
}

#banner-content p{
  line-height: 38px;
  color: #002d4b;
}

#banner-content .bg-primary {
    background-color: #10143b !important;
}

#banner-content .text-primary {
    color: #4aadd3 !important;
}

/* header */

#header{
  background-image: url('../images/banner-img.jpg');
  background-repeat: no-repeat;
  background-position: center center;
  padding: 50px 0px;
  background-size: cover;
}

/* documentation */

#documentation{
  padding: 60px 0px;
  background-image: url('../images/documentation-bg.jpg');
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}

/* medical-software */

#medical-software{
  margin-top: 60px;
}

/* patient-history-slider */

#patient-history-slider{
  background-image: url('../images/main-slider-bg.jpg');
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  margin-top: 60px;
  padding: 60px 0px;
  border-bottom: 2px solid #ccc;
}

/* patient-imunization-slider */

#patient-imunization-slider,
#patient-medication-slider,
#patient-image-slider{
  background-image: url('../images/main-slider-bg.jpg');
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  padding: 60px 0px;
  border-bottom: 2px solid #ccc;
}

/* patient-appointment-slider */

#patient-appointment-slider{
  background-image: url('../images/main-slider-bg.jpg');
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  padding: 60px 0px;
}

/* software-features */

#software-features{
  margin-top: 60px;
}

#software-features .circle{
  width: 100px;
  height: 100px;
  border-radius: 100px;
  display: flex;
  align-items: center;
  padding: 5px;
  margin: auto;
  justify-content: center;
  border: 6px solid rgb(180 230 249 / 80%);
}

#software-features .card{
  border-radius: 20px;
  height: 205px;
  width: 18%;
  cursor: pointer;
  margin: 10px;
}

#software-features .card:hover{
  border-color: #30B6F3;
}

/* interuptions */

#interuptions{
  margin-top: 60px;
}

/* footer */

#footer{
  background-color: #012842;
  margin-top: 60px;
  padding: 60px 0px;
}

/* contact us */

#documentation .card{
  border-radius: 20px;
  width: 22%;
  margin: 0px 15px;
}

#documentation .circle{
  width: 50px;
  height: 50px;
  border-radius: 100px;
  display: flex;
  align-items: center;
  padding: 5px;
  margin: auto;
  justify-content: center;
  border: 6px solid rgb(180 230 249 / 80%);
}

/* services */

#services{
  padding-top: 60px;
  background-color: #fbfdff;
}

#services .col-md-6{
  margin-bottom: 24px;
}

#services .card{
  box-shadow: rgba(17, 17, 26, 0.1) 0px 0px 16px;
  border-radius: 24px;
  border-bottom: 7px solid #30b6f3 !important;
}

#services img{
  width: 26%;
}


/* capabilities */

#capabilities{
  margin-top: 60px;
}

#capabilities .card{
  border-color: #c7c7c7;
  background-color: #f0f1f4;
  border-radius: 24px;
}

#capabilities img{
  width: 22%;
}


/* functionalities */

#functionalities{
  padding: 60px 0px;
  background-color: #f5f5f5;
}

#functionalities .col-md-6{
  margin-bottom: 24px;
}


#functionalities .card{
  border: 0px solid red;
  box-shadow: rgba(17, 17, 26, 0.1) 0px 0px 16px;
  border-radius: 16px;
  border-bottom: 6px solid #30b6f3 !important;
}

#functionalities .card-title{
  color: #444;
}

#functionalities img{
  width: 16%;
}


/* bottom */

#bottom{
  padding: 0px 0px 30px 0px;
  background-color: #f5f5f5;
}

#bottom .col-md-4{
  margin-bottom: 24px;
}


#bottom .card{
  border-radius: 8px;
  border-top-left-radius: 50px; 
  border-bottom-right-radius: 50px;
  border-bottom: 5px solid #07568b !important;
}