body {
  padding-bottom: 3rem;
  color: #000;
}
/* Header */
header .head_col_2{
  justify-content: center; align-items: center; display: flex;
}
.navbar h5{
	font-weight: 800;   margin: 0; margin-bottom: 2px; font-size: large; margin-right: 5px; font-weight: 600; color: red;
}
.navbar a{
	color: inherit; text-decoration: none; font-size: 17px;
}
.navbar-brand h3 {
	  display: inline-block; font-weight: 800; color: #074da2; line-height: 27px; padding-left: 10px; margin:0;
}
.navbar-brand{
	display: flex; align-items: center;
}
.navbar-brand h3 p{
	font-size: 14px; margin: 0; margin-top: -3px;     letter-spacing: 0.5px;    font-weight: 500;
}
.row{
    width: 100%;
}
.fa{
   color: #0c4da2 !important; font-size: 25px;
}
.main_outer h2{
	position: relative;
}
.main_outer h2:after {
  content: "";
  position: absolute;
  bottom: -10px;
  left: 0px;
  right: 0px;
  margin: auto;
  height: 5px;
  background-color: #0b74d8;
  width: 10%;
}

/* Banner */

#myCarousel .banner_content{
	background: rgba(0,0,0,0.75);
    color: #fff; padding: 40px 60px;
    border-radius: 20px;text-align: center;
}
.banner_content h3{
	    margin-bottom: 0;
}
.banner_content h3 span{
	color: #1090d5;  font-weight: 800;
}
.banner_content h2{
	margin: 0;
}
.banner_content hr{
	    border: 0;
    width: 40%;
    margin: 15px auto;
	background: rgb(199, 194, 194);
}
.banner_o h5{
  line-height: 28px;
    color: #bfcfd7;
}
.banner_o{
	position: absolute;
    z-index: 999; 
    top: 0;
    width: auto;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.carousel {
  margin-bottom: 0 !important;
}
/* Since positioning the image, we need to help out the caption */
.carousel-caption {
  bottom: 3rem;
  z-index: 10;
}
/* Declare heights because of positioning of img element */
.carousel-item {
  height: 32rem;
}
.carousel-item > img {
  position: absolute;
  top: 0;
  left: 0;
  min-width: 100%;
  height: 100%;
}
@media (min-width: 40em) {
  .carousel-caption p {
    margin-bottom: 1.25rem;
    font-size: 1.25rem;
    line-height: 1.4;
  }
}


/* Main Outer */
.main_outer .col-lg-4 {
  margin-bottom: 1.5rem;
  text-align: center;
}
.main_outer h2 {
  font-weight: 700; font-weight: 30px; font-size: 2.1rem; 
  text-align: center; 
  margin-bottom: 35px; 
}
.main_outer h2 span{
}

.main_outer .col-lg-4 p {
  margin-right: .75rem;
  margin-left: .75rem;
}

.steps .flex-center {
  display: flex !important; flex-direction: column; justify-content: center; align-items: center;
}

/* Courses Offered */
.courses_m .box-inner{
  color: #000; padding: 35px 35px 2px 35px; position: relative; background: #efefef;  transition: 0.3s;
}
.courses_m .box-inner h3{
	font-weight: 800;  color: #0c4da2;
}

/* Border Blue */
.courses_m .box-inner.border-blue h3, .courses_m .box-inner.border-blue i{
  color: #05adb3 !important;
}
.box-inner.border-blue:hover{
  border-top: 5px solid #05adb3;  transition: 0.3s ; border-bottom: 0;
}
.courses_m .box-inner.border-blue .hvr-icon-wobble-horizontal{
  border: 2px solid #05adb3;
}


/* Border Red */
.courses_m .box-inner.border-red h3, .courses_m .box-inner.border-red i{
  color: #fd4d40 !important;
}
.box-inner.border-red:hover{
  border-top: 5px solid #fd4d40;  transition: 0.3s ; border-bottom: 0;
}
.courses_m .box-inner.border-red .hvr-icon-wobble-horizontal{
  border: 2px solid #fd4d40;
}


/* Border Yellow */
.courses_m .box-inner.border-yellow h3, .courses_m .box-inner.border-yellow i{
  color: #efa71d !important;
}
.box-inner.border-yellow:hover{
  border-top: 5px solid #efa71d;  transition: 0.3s ; border-bottom: 0;
}
.courses_m .box-inner.border-yellow .hvr-icon-wobble-horizontal{
  border: 2px solid #efa71d;
}



.courses_m .col-lg-4:hover{
  cursor: pointer;
}
.box-inner.border-red:hover{
  border-top: 5px solid #fd4d40;  transition: 0.3s ; border-bottom: 0;
}

.box-inner.border-yellow:hover{
  border-top: 5px solid #efa71d;  transition: 0.3s ; border-bottom: 0;
}

.box-inner:hover .hvr-icon-wobble-horizontal{
  border: 2px solid #0c4da2;
}
.courses_m .box-inner::before{
    display: block;
    height: 100px;
    width: 100px;
    border-radius: 50%;
    position: absolute;
	  z-index: -1;
    left: 35%;
    top: -50px;
	font-size: 30px;
    font-weight: 800;
    padding-top: 10px;
}
.courses_m .box-inner .fa:hover{
	color: #fd4d40;
}
.courses_m1{
	justify-content: center;
}
/* BG */
.bg-pink{
	background: #ed145b; 
}
.bg-green{
	background: #62bb47; 
}
.bg-red{
	background: #ff3c14; 
}
.bg-blue1{
	background: #184995; 
}
.bg-blue{
	background: #05adb3; 
}
/* Highlights */
.highlights{
	background: #e2f0ff; padding: 75px 0;
}
.highlights h4{
  font-size: 1.35rem;
}
.highlights p {
	color: #000; font-size: 1rem;
}
.highlights .col-lg-5 {
	background: #fff; padding: 30px;
}
.highlights .col-lg-7{
	padding-left: 0;
}
.highlights .box-inner{
  color: #000; padding: 30px; position: relative; background: #fff; display: inline-block; width: 100%;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
   -webkit-transition: all .3s;
  -moz-transition: all .3s;
  transition: all .3s;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-property: transform;
  transition-property: transform;
}
/* .highlights .box-inner:before{
	content: '';
    display: block;
    height: 65px;
    width: 65px;
    position: absolute;
    left: 40%;
    top: -40px;
} */
.highlights .box-inner:hover:before{
	-webkit-transform: scale(1.1) rotate(4deg);
  transform: scale(1.1) rotate(4deg);
}
#course_main img{
  /* position: absolute;
  top: -25px;
  margin: 0 auto;
  text-align: center;
  left: 0;
  right: 0; */
}
/* Border */
.border-red{
	border-bottom: 5px solid #fd4d40;
}
.border-red:before{
	background: url('../img/icon1.jpg');
}
.border-red h3{
	color: #fd4d40; font-weight: 800;
}
.border-yellow{
	border-bottom: 5px solid #efa71d;
}
.border-yellow:before{
	background: url('../img/icon3.jpg');
}
.border-yellow h3{
	color: #efa71d; font-weight: 800;
}
.border-blue{
	border-bottom: 5px solid #16c3b0;
}
.border-blue:before{
	background: url('../img/icon2.jpg');
}
.border-blue h3{
	color: #16c3b0; font-weight: 800;
}
/* Flex Center */
.flex-center{
	/* display: flex; */
    flex-direction: column;
    align-items: center;
    width: 100%;
}
/* Instructions */
.instructions .col-lg-8 {
  position: relative;
  padding: 20px 75px;
  margin-bottom: 30px;
  background-color: #fff !important;
}
.instructions .col-lg-8:before{
    display: block;
    height: 50px;
    width: 50px;
    position: absolute;
    top: 10px;  
	color: #fff; font-size: 23px; padding: 10px 0 0 10px; background: #fff; border-radius: 50%; 
}
.instructions  .redcolor {
  border: 1px dotted #ff3c14 ;
}
.instructions  .yellowcolor {
  border: 1px dotted #184995 ;
}
.instructions  .bluecolor {
  border: 1px dotted #62bb47 ;
}
.instructions  .redcolor1 {
  border: 1px dotted #05adb3 ;
}
.instructions  .redcolor:before{
	border-radius: 0 15px 15px 0;
	left: 0;
	content: '01.';
	background: #ff3c14; 
}
.instructions  .yellowcolor:before{
	border-radius: 15px 0px 0px 15px;
	right: 0;
	content: '02.';
	background: #184995;  border: 1px solid #184995;
}
.instructions  .bluecolor:before{
	border-radius: 0 15px 15px 0;
	left: 0;
	content: '03.';
	background: #62bb47; border: 1px solid #62bb47;
}
.instructions  .redcolor1:before{
	border-radius: 15px 0px 0px 15px;
	right: 0;
	content: '04.';
	background: #05adb3; border: 1px solid #05adb3;
}
.inst_inner p, .inst_inner ul{
	margin: 0;   font-size: 18px;
}
.inst_inner h5{
	color: #0c4da2; font-weight: 800;
}
.inst_inner ul{
	margin-top: 15px;
}

	  
/* Icon Wobble Horizontal */
@-webkit-keyframes hvr-icon-wobble-horizontal {
  16.65% {
    -webkit-transform: translateX(6px);
    transform: translateX(6px);
  }
  33.3% {
    -webkit-transform: translateX(-5px);
    transform: translateX(-5px);
  }
  49.95% {
    -webkit-transform: translateX(4px);
    transform: translateX(4px);
  }
  66.6% {
    -webkit-transform: translateX(-2px);
    transform: translateX(-2px);
  }
  83.25% {
    -webkit-transform: translateX(1px);
    transform: translateX(1px);
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
@keyframes hvr-icon-wobble-horizontal {
  16.65% {
    -webkit-transform: translateX(6px);
    transform: translateX(6px);
  }
  33.3% {
    -webkit-transform: translateX(-5px);
    transform: translateX(-5px);
  }
  49.95% {
    -webkit-transform: translateX(4px);
    transform: translateX(4px);
  }
  66.6% {
    -webkit-transform: translateX(-2px);
    transform: translateX(-2px);
  }
  83.25% {
    -webkit-transform: translateX(1px);
    transform: translateX(1px);
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
.hvr-icon-wobble-horizontal {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: perspective(1px) translateZ(0);
  transform: perspective(1px) translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;  border: 2px solid #0c4da2;
    border-radius: 100%;
    padding: 10px;
    width: 50px;
    height: 50px;
}
.hvr-icon-wobble-horizontal .hvr-icon {
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}
.hvr-icon-wobble-horizontal:hover .hvr-icon, .hvr-icon-wobble-horizontal:focus .hvr-icon, .hvr-icon-wobble-horizontal:active .hvr-icon {
  -webkit-animation-name: hvr-icon-wobble-horizontal;
  animation-name: hvr-icon-wobble-horizontal;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}

/* media */
@media (min-width: 1100px) and (max-width: 1399px) {
  .navbar h5 {
    font-size: medium !important;
  }
  .navbar a {
    font-size: 15px !important;
}
}
@media (min-width: 993px) and (max-width: 1199px) {
#kmch_adm_nos {
  display: block !important; width: 100% !important;
}
.navbar h5 {
  font-size: medium !important;
}
.navbar a {
  font-size: 14px !important;
}
.navbar-brand h3{
  font-size: large; line-height: 20px;
}
.navbar-brand h3 p {
  font-size: x-small; margin-top: 0px;
}
}

@media (min-width: 1100px) and (max-width: 1199px) {
  .container, .container-lg, .container-md, .container-sm {
    max-width: 1050px;
}
.highlights .box-inner {
    padding: 55px 25px 35px 25px;
}
}

@media (min-width: 992px) and (max-width: 1099px) {
	.highlights .box-inner {
    padding: 55px 25px 35px 25px;
}
.courses_m h3, .highlights h3 {
    font-size: calc(1rem + 0.6vw);
}
}
@media (min-width: 992px) and (max-width: 1199px) {
	.courses_m .box-inner h3 {
    font-size: calc(1.1rem + .6vw);
}
.courses_m .box-inner{
	padding: 25px 25px 2px 25px;
}
.highlights p {
    font-size: 15px;
}
}
@media (min-width: 1200px) and (max-width: 1399px) {
.highlights .box-inner{
  padding: 20px;
}
}

@media(max-width: 575px) {
  .highlights {
    padding: 35px 0;
}
.banner_o{
  top: 5%;
}
  .banner_o h2{
    font-size: larger;
  }
  .banner_o h5{
    font-size: smaller;
  }
  .instructions .yellowcolor:before , .instructions .redcolor1:before{
    border-radius: 0 15px 15px 0;
  }
  .highlights h4 {
    padding-top: 20px;
  }
  .highlights .box_space {
    margin-top: 35px;
  }
  .instructions .col-lg-8 {
    padding: 20px 15px 20px 45px !important;
}
 .highlights .col-lg-5{
    order: 2;
 } 
 .highlights .col-lg-7{
  order: 1;
} 
	.navbar a {
    font-size: 16px;
}
.navbar h5 {
    font-size: 1.2rem;
}
.navbar .contact_nos, .contact_nos .email_h5{
	margin-top: 10px;
}
.navbar-brand img {
	width: 100% !important;
}

.navbar-brand h3{
	font-size: large; line-height: 18px; padding-left: 5px;
}
.navbar-brand h3 p {
    font-size: 8.5px; margin-top: -2px;
}
.main_outer h2{
	font-size: x-large !important; position: relative !important;
}
.main_outer .main_heading {
  margin-bottom: 0 !important;
}
.instructions .col-lg-8:before {
    height: 35px !important;
    width: 35px !important;
    font-size: 17px !important;
    padding: 5px 5px 0px 2px !important;
}
.instructions .yellowcolor:before , .instructions .redcolor1:before {
  left: 0 !important;
}
.main_outer h2:after {
  content: "";
  position: absolute;
  bottom: -10px !important;
  left: 0px;
  right: 0px;
  margin: auto;
  height: 2px;
  background-color: #0b74d8;
  width: 20%;
}
.carousel {
  margin-bottom: 0 !important;
}
.carousel-item > img {
    margin: 0;
}
#myCarousel .banner_content{
	padding: 20px;
}
.banner_content h3{
	font-size: calc(1rem + .6vw);
}
.banner_content h5{
	font-size: 0.9rem;
}
.carousel-item {
    height: 15rem;
}
.row {
    --bs-gutter-x: 0;
}
}