body {
    padding-top: 0px;
    background: #fff;
    font-family: Times New Roman, Helvetica, sans-serif;
    font-weight: 400;
    color: #282828;
    line-height: 20px;
}

.about{
  flex: 1;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  line-height: 1.5;
}

.about-effect {
  width: 400px;
  flex: 1 0 auto;
  height: 300px;
  position: relative;
  overflow: hidden;
  box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
  background: #CCC;
}
.about__img-wrapper {
  position: absolute;
  width:420px;
  height:320px;
  animation: 7s linear 1 both about-clg;
}

.about-us {
  width: calc(25% - 4rem);
  height:100%;
  flex: 1 0 auto;
  font-size: 20px;
  padding-left: 2rem;
  box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.37 );
  border: 1px solid rgba( 255, 255, 255, 0.18 );
}

@keyframes about-clg {
  0% {
    opacity: 0;
    transform: translate3d(-280%, 150%, 0) scale(2);
  }
  6% {
    opacity: 1;
    transform: translate3d(-280%, 150%, 0) scale(2);
  }
  100% {
    transform: translate3d(-120%, -70%, 0) scale(1);
  }
}
.mentor{
     width: 100%;
     height: 50vh;
     display: flex;
     justify-content: center;
     align-items: center;
     background-color: lightblue;
   }
.profile-card{
     position: relative;
     font-family: sans-serif;
     width: 220px;
     height:290px;
     background: #fff;
     padding: 30px;
     border-radius: 50%;
     box-shadow: 0 0 22px #3336;
     transition: .6s;
     margin: 0 55px;
     
   }
   .profile-card:hover{
     border-radius: 10px;
     height:310px;
   }
   .profile-card .img{
     position: relative;
     width: 100%;
     height: 100%;
     transition: .6s;
     z-index: 99;
   }
   .profile-card:hover .img{
     transform: translateY(-60px);
   }
   .img img{
     width:100%;
     border-radius: 150%;
     box-shadow: 0 0 22px #3336;
     transition: .6s;
   }
   .profile-card:hover img{
     border-radius: 10px;
   }
   .caption{
     text-align: center;
     transform: translateY(-80px);
     opacity: 0;
     transition: .6s;
   }
   .profile-card:hover .caption{
     opacity: 1;
   }
   .caption h3{
     font-size: 21px;
     font-family: sans-serif;
     color:#000;
   }
   .caption p{
     font-size: 15px;
     color: #0c52a1;
     font-family: sans-serif;
     margin: 2px 0 9px 0;
   }
   .box{
    background: #fab779;
    font-family: 'Raleway', sans-serif;
    overflow: hidden;
    position: relative;
}
.box img{
    width: 100%;
    height: auto;
    transform: scale(1.5);
    transform-origin: right center;
    transition: all 0.7s ease 0s;
}
.box:hover img{
    opacity: 0.7;
    transform: translateX(50px) scale(1.2);
}
.box .box-content{
    background: #fff;
    text-align: center;
    width: 75%;
    padding: 20px;
    box-shadow: 0 0 20px rgba(0,0,0,0.9);
    opacity: 0;
    transform-origin: left center;
    transform: translateX(-100%) translateY(-50%) scale(0);
    position: absolute;
    top: 50%;
    left: 50%;
    transition: all 0.7s ease 0s;
}
.box:hover .box-content{
    opacity: 1;
    transform: translateX(-50%) translateY(-50%) scale(1);
}
.box .title{
    color: #f93f48;
    font-size: 26px;
    font-weight: 600;
    letter-spacing: 0.5px;
    text-transform: capitalize;
    margin: 0 0 5px;
}
.box .title:after{
    content: '';
    height: 2px;
    width: 60px;
    margin: 7px auto 0;
    
    display: block;
    clear: both;
}

.carousel-wrapper {
  width: 520px;
  height: 350px;
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 5px 5px 25px 0px rgba(46, 61, 73, 0.2);
  border-radius: 20px;
  margin: 10px auto 20px;
}

.carousel-container {
  width: 400px;
  height: 250px;
  overflow: hidden;
  margin: 0 auto;
}

.carousel {
  display: flex;
  width: 1200px;
  animation: sliding 12s infinite;
}
.carousel div {
  width: 400px;
  height: 250px;
  background-size: cover;
  background-position: center;
}
.carousel:hover {
  animation-play-state: paused;
}

@keyframes sliding {
  30% {
    transform: translateX(0);
  }
  35% {
    transform: translateX(-400px);
  }
  65% {
    transform: translateX(-400px);
  }
  70% {
    transform: translateX(-800px);
  }
  98% {
    transform: translateX(-800px);
  }
  100% {
    transform: translateX(0);
  }
}
@media screen and (max-width: 768px) {
  .carousel-wrapper {
    width: 312px;
    height: 210px;
  }

  .carousel-container {
    width: 240px;
    height: 150px;
  }

  .carousel {
    width: 720px;
  }
  .carousel > div {
    width: 240px;
    height: 150px;
  }

  @keyframes sliding {
    30% {
      transform: translateX(0);
    }
    35% {
      transform: translateX(-240px);
    }
    65% {
      transform: translateX(-240px);
    }
    70% {
      transform: translateX(-480px);
    }
    98% {
      transform: translateX(-480px);
    }
    100% {
      transform: translateX(0);
    }
  }
}
logo-slider {
  --image-size: 100px;
  border: 1px solid #D3D3D3;
  padding: 20px;
  overflow: hidden;
  max-width:1110px;
  width: 100%;
  margin: 0 auto;
  position: relative;
  display: flex;
}
logo-slider:hover div {
  animation-play-state: paused;
}
logo-slider div {
  display: flex;
  position: relative;
  animation: marquee 25s linear infinite;
  justify-content: space-around;
}
logo-slider img {
  display: block;
  min-width: var(--image-size);
  height: var(--image-size);
  margin: 0 1vw;
}
logo-slider:after {
  content: "";
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background: linear-gradient(to right, white, rgba(255, 255, 255, 0) 80px, rgba(255, 255, 255, 0) calc(100% - 80px), white);
}
@media (max-width: 900px) {
  logo-slider {
    --image-size: 50px;
    --image-size: min(max(50px, 10vw), 100px);
  }
}

@keyframes marquee {
  0% {
    transform: translateX(0%);
  }
  100% {
    transform: translateX(-100%);
  }
}
  .achievementsSlider {
    padding: 0;
    margin: 0;
    /* background: #13637d; */
    background: url(../img/achivements.jpg) no-repeat 0 0 / cover;
    color: #ffffff;
    border: 1px solid #13637d;
    padding: 20px 15px;
    overflow: hidden;
}
.noticeSlider {
    padding: 0;
    margin: 0;
    background: #515665;
    color: #ffffff;
    border: 1px solid #13637d;
    padding: 20px 15px;
    overflow: hidden;
}
/*.popup*/
    #overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: #000;
filter:alpha(opacity=70);
opacity: 0.7;
z-index:100;
display: none;
}
.cnt223 a{
text-decoration: none;
}
.rsce-onload{
width: 100%;
margin: 0 auto;
display: none;
position: fixed;
z-index:999999;
}
.cnt223{
/*min-width: 700px;*/
width: 820px;
/*min-height: 150px;*/
margin: 0px auto;
/*background: #f3f3f3;*/
position: relative;
z-index: 103;
padding: 15px 35px;
/*border-radius: 10px;*/
/*box-shadow: 0 2px 5px #000;*/
}
/*.popup*/
.inner_para p{
	font-size: 21px;
    line-height: 30px;
}
.list_inner_img {
    list-style-image: url(../images/bullet_list.jpg);
}
.list_inner_img > li {
    border-bottom: 1px solid #90002182;
    padding: 5px;
}
.list_inner_img a {
    color: #000;
    font-size: 14px;
}
.readmore_text {
    color: #fff;
    font-size: 17px;
    font-weight: bold;
    transition: all .5s;
}
.readmore_text:hover{
	color:#FEE715FF;
	font-size:14px;
	text-decoration:none;
	margin-left:10px;
}
.inner_side_bar {
    background-color:#03254c;
    padding: 17px;
    border-top-right-radius: 50px;
    line-height: 20px;
}
.inner_list_image > li {
    border-bottom: 1px solid #FEE715FF;
    padding: 5px;
}
.list_image {
    list-style-image: url(../images/Red_Arrow_right.png);
}
.list_image > li {
    border-bottom: 1px solid #ababab;
    padding: 5px;
}
.list_image a {
    color: #fff;
}
.footer_section{
	background-image: url(../img/backr.jpg);
	padding:10px;
}
.footer_copyright{
	background:#333333eb;
	padding:10px;
}
.footer_copyright p{
	margin-bottom:0px;
}
#scroll {
    position:fixed;
    right:10px;
    bottom:10px;
    cursor:pointer;
    width:50px;
    height:50px;
    background-color:#A4193D;
    text-indent:-9999px;
    display:none;
    -webkit-border-radius:60px;
    -moz-border-radius:60px;
    border-radius:60px
}
#scroll span {
    position:absolute;
    top:50%;
    left:50%;
    margin-left:-8px;
    margin-top:-12px;
    height:0;
    width:0;
    border:8px solid transparent;
    border-bottom-color:#ffffff;
	transition: all .5s;
}
#scroll:hover {
    background: linear-gradient(to left, #0e7e89, #0b2a42);
    opacity:1;filter:"alpha(opacity=100)";
    -ms-filter:"alpha(opacity=100)";
}
#scroll span:hover{
	top:20px;
}
.social_media_icon i{
	transition: all 1s;

}
.social-media{
  align-items: center;
  display: flex;
  transition: transform 0.3s ease-in-out;
}
.social-media:hover{
  transform: translateX(calc(-100% + 60px));
}

.social-media i{
  color: #fff;
  font-size: 20px;
  padding: 15px;
  text-align: center;
  width: 60px;
}
.social-media a{
  color: #fff;
  padding: 0 10px;
  text-align: center;
  text-decoration: none;
}
.social-media-container{
  top: 50%;
  list-style-type: none;
  padding: 0;
  position: fixed;
  left: calc(100% - 60px);
  transform: translateY(-50%);
  min-width: 150px;
  z-index: 1230;
}

.social-media.facebook{
  background-color: #3b5998;
}

.social-media.youtube{
  background-color: #FF0000;
}
.social-media.twitter{
  background-color: #00acee;
}
.social-media.instagram{
  background: #f09433; 
  background: -moz-linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%); 
  background: -webkit-linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); 
  background: linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); 
filter: '#f09433','#bc1888';
}
.social_media_icon  {
    padding-left:0px;
}
.social_media_icon li {
    padding-left: 20px;
	display: inline-block;
}
.social_media_icon i{
	transition: all 1s;
}
.facebook_icon:hover{
	transition-duration: 1s;
	transform: rotate(360deg);
}
.twitter_icon:hover{
	transition-duration: 1s;
	transform: rotate(360deg);
}
.google_plus_icon:hover{
	transition-duration: 1s;
	transform: rotate(360deg);
}
.linkedin_icon:hover{
	transition-duration: 1s;
	transform: rotate(360deg);
}
.instagram_icon:hover{
	transition-duration: 1s;
	transform: rotate(360deg);
}





























