/*@import url('https://fonts.googleapis.com/css2?family=Philosopher:ital@1&display=swap');*/
@import url('https://fonts.googleapis.com/css2?family=Baloo+Tammudu+2:wght@500&display=swap');

body{
  overflow-x: hidden;
/*font-family: 'Philosopher', sans-serif;*/
font-family: 'Baloo Tammudu 2', cursive;
  color: #505962;
}
.offset:before{

  height: 3.8rem;
  margin-top:-3.8rem;
  content: '';
  display: block; 
}
/*-----------navbar*/
.navbar{
	
  text-transform: uppercase;
  /*font-weight: 700;*/
  font-size: 0.95rem;
  letter-spacing: 0.1rem;
  background: rgba(0, 0, 0, 0.6)!important;

}
.navbar-brand img{
  height: 4rem;
}
.navbar-nav li{
  padding: 0.7rem;
  font-size: 1.2rem;
}

.navbar-dark .navbar-nav .nav-link{
  color: white;
  padding-top: 0.8rem; 
}

.navbar-dark .navbar-nav .nav-link.active,
.navbar-dark .navbar-nav .nav-link:hover{
color: DeepSkyBlue;
}


/*-----------slider*/

.carousel-item{
  height: 100vh;
}
.carousel-caption {
  position: absolute;
  top: 38%;
  text-transform: uppercase;
}
.carousel-caption h1{
  font-size: 3.8rem;
  font-weight: 700;
  letter-spacing: 0.3rem;
  text-shadow: 0.1rem 0.1rem 0.8rem black;
  padding-bottom: 1rem;
}
.carousel-caption h3{
font-size: 2.5rem;
  text-shadow: 0.1rem 0.1rem 0.5rem black;
  padding-bottom: 1rem;
}
.btn-lg{
  border-width: medium;
  border-radius: 0;
  font-size: 1.1rem;
}

/*Keyword*/
.three-col{
	display: flex;
}
.three-col div{
	flex: 1;	
	text-align: center;
	margin-top: 500px;

}
.three-col h3{
	color: #F0F0F0;
font-size: 1.5rem;
  text-shadow: 0.1rem 0.1rem 0.5rem black;
}




/*///////////////////////About*/
.about{
	min-height: 100vh;
	/*display: flex;*/
	justify-content: center;
	align-items:center;
	/*flex-direction: column;*/
	background-color: #f4ebeb;
	color: black;
	/*opacity: 0.5;*/
}
.about h2{
	font-weight: bold;
	margin-bottom: 15px;
}
.about h4{
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 25px;
}
.about p{
	margin-bottom: 50px;
	font-size: 18px;
}
.about .img-wrap{
margin-top:60px;

}

.about .img-wrap img{
	width: 250px;
	height: 250px;
	padding: 10px;
	border-radius: 50%;
	box-shadow: 0 0 10px black

}

/*/////////////////////// END  About*/

/*////////////////////////////////////SPECIALITIES*/

.specialities{
	background: #ddd;	
}
.specialities .section-header{
	text-align: center;
	margin-bottom: 30px;
	margin-top: 15px;
	font-weight: bold;
	font-size: 60px;
}
.specialities .section-header h2{
	font-weight: bold;
	font-size: 43px;
}
.specialities .knee{
	border: 1px solid DeepSkyBlue;
	text-align: center;
	background: #fff;	
	margin-bottom: 30px;
}
.specialities .service-bg{
	height: 200px;
	position: relative;
}
.specialities .service-bg-1{
	background: url(../images/s1.jpeg);
	background-size: cover;
	background-position: center ;
}
.specialities .service-bg-2{
	background: url(../images/s2.jpeg);
	background-size: cover;
	background-position: center ;
}
.specialities .service-bg-3{
	background: url(../images/s3.jpeg);
	background-size: cover;
	background-position: center ;
}
.specialities .service-bg-4{
	background: url(../images/s4.jpeg);
	background-size: cover;
	background-position: center ;
}
.specialities .service-bg-5{
	background: url(../images/s5.jpeg);
	background-size: cover;
	background-position: center ;
}
.specialities .service-bg-6{
	background: url(../images/s6.jpeg);
	background-size: cover;
	background-position: center ;
}
.specialities .service-bg h3{
	color: #fff;
	background: DeepSkyBlue;
	border: 1px solid DeepSkyBlue;
	font-size: 17px;
	text-align: center;
	font-weight: 700;
	padding: 15px;
	position: absolute;
	left: 8%;
	width: 84%;
	margin: 0;
	bottom: -25px;
	border-radius: 50px;
	letter-spacing: 2px;
}
.specialities .knee:hover .service-bg h3{
	background: #fff;
	transition: 0.9s;
	color: DeepSkyBlue;

}
.specialities .service-text{
	padding: 50px 30px 20px;
	font-size: 15px;
	font-weight: 400;
}
.specialities .service-text p:last-child{
	line-height: 1.8;
}
@media only screen and (max-width: 767px){
	.carousel-caption h1{
  font-size: 2.3rem;

  letter-spacing: 0.15rem;
  padding-bottom: 0.5rem;
}
.carousel-caption h3{
font-size: 1.2rem;
  padding-bottom: 1.2rem;
}
.btn-lg{

  font-size: 1.1rem;
}
	.specialities .knee{
		margin-top: 30px;
	}
	.specialities .service-bg h3{
		font-size: 13px;

	}
}

/*////////////////////////////////////END  SPECIALITIES*/

/*////////////////////////////////////start  gallery*/
    .gallery{
      background: #fff;
      font-family: Helvetica Neue, Helvetica, Arial, sans-serif;
      font-size: 14px;
      color: #000;
     /* margin: 0;
      padding: 0;*/
      display: flex;
      justify-content: center;
      align-items: center;
      min-height: 100vh;
      background: #111;
      overflow: hidden;
      width: 100%;

    }

    .gallery .swiper-container{
      width: 100%;
      padding-top: 50px;
      padding-bottom: 200px;
    }

    .gallery .swiper-slide{
      background-position: center;
      background-size: cover;
      width: 300px;
      height: 300px;
      background: #000;
      -webkit-box-reflect: below 1px linear-gradient(transparent,transparent,#0006);

    }
    .gallery .swiper-slide img{
    	width:300px;
    	height: 300px;
    }



/*////////////////////////////////////END  gallery*/


.contact{
	position: relative;
	min-height: 100vh;
	padding: 50px 100px;
	display: flex;
	justify-content: center;
	align-items:center;
	flex-direction: column; 
	background-color: #081419;
	/*background: url(../images/contact1.jpg);*/
	 /*background-image: url(../images/contact.jpg), linear-gradient(#eb01a5, #d13531);*/
	  /*opacity: 0.5;*/
	background-size: cover;
}
.contact .content{
	max-width: 800px;
	text-align: center;
}
.contact .content h2{
	font-size: 40px;
	font-weight: 700;
	color: #fff;


}
.contact .content p{
		font-size: 1.4rem;
	font-weight: 300;
	color: #fff;
	
}
.contact .container{
	width: 100%;
	display: flex;
		justify-content: center;
	align-items:center;
	margin-top: 30px;
}
.contact .container .contactInfo{
	width: 100%;
	display: flex;
	flex-direction: column;
}
.contact .container .contactInfo p{
	font-size: 1.2rem;
}
.contact .container .contactInfo .box{
	position: relative;
	padding: 20px 0;
	display: flex;
}
.contact .container .contactInfo .box .icon{
	min-width: 60px;
	height: 60px;
	background: #fff;
	display: flex;
		justify-content: center;
	align-items:center;
	border-radius: 50%;
	font-size: 22px;
}
.contact .container .contactInfo .box .text{
	display: flex;
	margin-left: 20px;
	font-size: 16px;
	color: #fff;
	flex-direction: column;
	font-weight: 300;
}
.contact .container .contactInfo .box .text h5{
	font-weight: 500;
	color: DeepSkyBlue;
}
.contact .contactForm{
	   
  /*height: 350px;*/
  width: 100%;
  height: auto;
  flex: 50%;
}
.contact .contactForm iframe{
	   
  /*height: 350px;*/
  width: 100%;
  height: 100%;
  
}



.middle{
  position: absolute;
  /*top: 50%;*/
  /*margin-top: 5%;*/
  transform: translateY(-50%);
  width: 100%;
  text-align: center;
   background: #081419; 
   display: flex;
   align-items: center;
   justify-content: center;
}
.middle a{
  display: inline-block;
 font-size: 30px;
 /*background-color: red;*/
 width: 50px;
 height: 100px;
 line-height: 100px;
 text-align: center;
 color: #E5E7E9;
 margin: 0 15px;
 transition: .4s linear;
 position: relative;
}
.middle a::before, .middle a::after{
  content: '';
  position: absolute;
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  /*border: 4px solid;*/
  left: 0;
  top: 0;
   transition: .4s linear;

}

.middle a:hover{
	color: DeepSkyBlue;
  transform: scale(0.8);
}
.middle a:hover::before{
	color: DeepSkyBlue;
  border-left: 4px solid;
  border-right: 4px solid;
  transform: skewX(20deg);

}
.middle a:hover::after{
	color: DeepSkyBlue;
  border-top: 4px solid;
  border-bottom: 4px solid;
  transform: skewY(-20deg);

}



@media (max-width: 991px){
	.contact{
		padding: 50px;
	}
	.contact .container{
		flex-direction: column;
	}
	.contact .container .contactForm{
		margin-bottom: 40px;
	}
	.contact .container .contactForm{
		width: 100%;
	}


}