/*
Template Name: Institute
File: Layout CSS
Author: TemplatesOnWeb
Author URI: https://www.templateonweb.com/
Licence: <a href="https://www.templateonweb.com/license">Website Template Licence</a>
*/
body{
font-family: 'Poppins', sans-serif;
color: #000;
}
ul{
list-style:none;
padding:0;
 }
h1{
font-size:50px; 
 }
h2{
font-size:42px; 
 }
h3{
font-size:34px; 
 }
h1,h2,h3,h4,h5{
font-weight:bold;
 }

h6{
font-weight:normal;
 }
p{
color:#666; 
 }

a{
color: #000;
text-decoration:none;
 }
a:hover{
text-decoration:none;
color: #27ab43;
 }
a:focus{
text-decoration:none;
color: #27ab43;
 }

.button{
background:#27ab43;
color:#fff!important;
display: inline-block;
transition: 0.3s;
padding:1.3rem 2rem;
font-weight:bold;
border-radius:30px;
 }
.button:hover{
background:#fdc800;
color:#fff;
 }

.button_1{
background:#fdc800;
color:#fff!important;
display: inline-block;
transition: 0.3s;
padding:1.3rem 2rem;
font-weight:bold;
border-radius:30px;
 }
.button_1:hover{
background:#27ab43;
color:#fff;
 }


.grid figure {
position: relative;
float: left;
overflow: hidden;
width: 100%;
text-align: center;
cursor: pointer;
}
figure.effect-jazz figcaption::after,
figure.effect-jazz img
{
-webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
transition: opacity 0.35s, transform 0.35s;
}

figure.effect-jazz:hover img {
-webkit-transform: scale3d(1.05,1.05,1);
transform: scale3d(1.05,1.05,1);
}

.col_green{
color: #27ab43!important; 
 }
.col_yell{
color:#fdc800!important; 
 }
.bg_green{
background:#27ab43;
 }
.bg_yell{
background:#fdc800;
 }
.bg_light{
background:#27ab430d; 
 }


hr{
opacity:1;
background-color:#27ab432e; 
 }
.font_14{
font-size:14px; 
 }
.font_12{
font-size:12px; 
 }
.font_8{
font-size:8px; 
 }
.font_60{
font-size:60px; 
 }

.line {
height: 5px!important;
width: 50px;
background-color: #27ab43;
}
.p_3{
padding-top:30px;
padding-bottom:30px; 
 }
.radius_10{
border-radius:10px; 
 }
.radius_30{
border-radius:30px; 
 }  
.border_1{
border:1px solid #27ab432e; 
 }


/*********************top****************/
#top{
width:82%;
border-radius:5px 5px 0px 0px; 
 }
.drop_top a {
padding-top: 12px;
padding-bottom: 12px;
border-bottom: 1px dashed #27ab432e;
}
.drop_top a:hover {
color:#27ab43;
background:none;
}
.drop_top {
min-width: 220px;
padding: 0;
margin-top: 8px!important;
background: #fff;
border-radius: 5px;
border: 1px solid #27ab432e;
}

.main_1{
z-index:3;
top:20px; 
 }
/*********************top_end****************/

/*********************header****************/
.navbar{
width:82%; 
border-radius:0px 0px 5px 5px; 
 }
.navbar-brand{
font-size:30px;
}

#header .nav-link{
color:#000;
padding-left:25px;
padding-left:25px;
font-weight:bold;
 }
#header .nav-link:hover{
color:#27ab43;
 }
#header .nav-link:focus{
color:#27ab43;
 }
#header .active{
color:#27ab43;
 }

.drop_1{
min-width:220px;
padding:0;
margin-top:18px!important;
border:none;
background:#fff;
border-radius:0;
border:1px solid #27ab432e;
 }
.drop_1 a{
padding-top:15px;
padding-bottom:15px;
border-bottom:1px dashed #27ab432e;
color:#000;
font-weight:bold;
 }
.drop_1 a:hover{
color:#27ab43;
background:none;
 }

.sticky {
position: fixed;
top: 0;
width: 100%;
z-index:3;
border-radius:0;
}
.sticky {
top: -40px;
transform: translateY(40px);
transition: transform .3s;
}

.dropdown_search:after{
display:none; 
 }
#header .button{
padding: 0.6rem 2rem 0.5rem 2rem!important; 
 }
.drop_2{
min-width:300px;
padding:0;
margin-top:18px!important;
border:none;
background:#fff;
border-radius:0;
border:1px solid #27ab432e; 
right:0!important;
left:auto!important;
 }
.drop_2 .btn{
border-color: #27ab43;
padding:12px 20px; 
 }
.drop_2 .btn:hover{
background:#fdc800;
border-color:#fdc800;
 }
/*********************header_end****************/


/*********************common****************/
.pages ul li{
 display:inline-block;
 }
.pages ul li a{
display:block;
color: #111;
 margin: 0 2px;
 width:40px;
 height:40px;
 line-height:40px;
 text-align:center;
 border:1px solid #27ab432e;
 border-radius:50%;
 }
.pages ul li a:hover{
 background: #27ab43;
 border:1px solid #27ab43;
 }
.pages ul li a:hover{
 color: #fff!important;
 }
.act{
background:#27ab43!important;
border:1px solid #27ab43!important;
color:#fff!important;
 }

 /* footer social icons */
ul.social-network {
list-style: none;
display: block;
margin-left:0 !important;
padding: 0;
}
ul.social-network li {
display: inline-block;
}

/* footer social icons */
.social-network a.icoRss:hover {
background-color: #F56505;
}
.social-network a.icoFacebook:hover {
background-color:#3B5998;
}
.social-network a.icoTwitter:hover {
background-color:#33ccff;
}
.social-network a.icoGoogle:hover {
background-color:#BD3518;
}
.social-network a.icoVimeo:hover {
background-color:#0590B8;
}
.social-network a.icoLinkedin:hover {
background-color:#007bb7;
}
.social-network a.icoRss:hover i, .social-network a.icoFacebook:hover i, .social-network a.icoTwitter:hover i,
.social-network a.icoGoogle:hover i, .social-network a.icoVimeo:hover i, .social-network a.icoLinkedin:hover i {
color:#fff;
}
a.socialIcon:hover, .socialHoverClass {
color:#44BCDD;
}

.social-circle li a {
display:inline-block;
position:relative;
margin:0 auto 0 auto;
-moz-border-radius:50%;
-webkit-border-radius:50%;
border-radius:50%;
text-align:center;
width: 40px;
height: 40px;
}
.social-circle li i {
margin:0;
line-height:40px;
text-align: center;
}

.social-circle li a:hover i, .triggeredHover {
-moz-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
-ms--transform: rotate(360deg);
transform: rotate(360deg);
-webkit-transition: all 0.2s;
-moz-transition: all 0.2s;
-o-transition: all 0.2s;
-ms-transition: all 0.2s;
transition: all 0.2s;
}
.social-circle i {
color: #fff;
-webkit-transition: all 0.8s;
-moz-transition: all 0.8s;
-o-transition: all 0.8s;
-ms-transition: all 0.8s;
transition: all 0.8s;
}

/* ============================================
   3D IMAGE ANIMATIONS - Applied to all images
   ============================================ */

/* Base 3D perspective container */
.img-3d-container {
  perspective: 1000px;
  overflow: hidden;
}

/* 3D Float Animation */
@keyframes float3d {
  0%, 100% {
    transform: translateY(0) rotateX(0) rotateY(0);
  }
  25% {
    transform: translateY(-10px) rotateX(2deg) rotateY(2deg);
  }
  50% {
    transform: translateY(-5px) rotateX(0) rotateY(0);
  }
  75% {
    transform: translateY(-15px) rotateX(-2deg) rotateY(-2deg);
  }
}

/* 3D Pulse/Breathing Animation */
@keyframes breathe3d {
  0%, 100% {
    transform: scale(1) perspective(1000px) rotateY(0deg);
    box-shadow: 0 5px 15px rgba(0,0,0,0.3);
  }
  50% {
    transform: scale(1.05) perspective(1000px) rotateY(5deg);
    box-shadow: 0 20px 40px rgba(0,0,0,0.4);
  }
}

/* 3D Rotate Animation */
@keyframes rotate3d {
  0% {
    transform: perspective(1000px) rotateY(0deg);
  }
  100% {
    transform: perspective(1000px) rotateY(360deg);
  }
}

/* 3D Swing Animation */
@keyframes swing3d {
  0% {
    transform: perspective(1000px) rotateX(10deg);
  }
  50% {
    transform: perspective(1000px) rotateX(-10deg);
  }
  100% {
    transform: perspective(1000px) rotateX(10deg);
  }
}

/* 3D Tilt on Hover */
.img-3d-tilt {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  transform-style: preserve-3d;
}

.img-3d-tilt:hover {
  transform: perspective(1000px) rotateX(10deg) rotateY(-10deg) scale(1.1);
  box-shadow: 0 25px 50px rgba(0,0,0,0.5);
}

/* 3D Lift Effect */
.img-3d-lift {
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.img-3d-lift:hover {
  transform: translateY(-20px) perspective(1000px) rotateX(5deg);
  box-shadow: 0 30px 60px rgba(0,0,0,0.4);
}

/* 3D Flip Effect */
.img-3d-flip {
  transition: transform 0.8s;
  transform-style: preserve-3d;
}

.img-3d-flip:hover {
  transform: rotateY(180deg);
}

/* 3D Spin Effect */
.img-3d-spin {
  transition: transform 0.6s ease-out;
}

.img-3d-spin:hover {
  transform: perspective(1000px) rotate(360deg) scale(1.1);
}

/* 3D Wave Effect */
@keyframes wave3d {
  0%, 100% {
    transform: perspective(500px) rotateX(0deg);
  }
  50% {
    transform: perspective(500px) rotateX(10deg);
  }
}

.img-3d-wave {
  animation: wave3d 3s ease-in-out infinite;
}

/* 3D Card Effect */
.img-3d-card {
  transition: all 0.4s ease;
  transform-style: preserve-3d;
}

.img-3d-card:hover {
  transform: translateZ(30px) rotateX(15deg) rotateY(-15deg);
  box-shadow: 0 30px 60px rgba(0,0,0,0.4);
}

/* 3D Zoom & Rotate */
.img-3d-zoom-rotate {
  transition: all 0.5s ease;
}

.img-3d-zoom-rotate:hover {
  transform: perspective(1000px) scale(1.2) rotate(10deg);
  box-shadow: 0 25px 50px rgba(0,0,0,0.5);
}

/* Apply 3D animations to all images in the site */
img {
  transition: all 0.4s ease;
}

/* Default 3D animation for all images - subtle lift effect */
img:not(.no-3d):not(.carousel-item img):not(.img-circle):not(.img-fluid):not(.w-100) {
  animation: breathe3d 4s ease-in-out infinite;
  transform-style: preserve-3d;
}

img:not(.no-3d):not(.carousel-item img):not(.img-circle):not(.img-fluid):not(.w-100):hover {
  animation: none;
  transform: perspective(1000px) translateY(-15px) rotateX(5deg) scale(1.05);
  box-shadow: 0 25px 50px rgba(0,0,0,0.4);
  z-index: 10;
  position: relative;
}

/* Carousel images - subtle float */
.carousel-item img {
  animation: none !important;
  transition: transform 0.5s ease;
}

.carousel-item img:hover {
  transform: scale(1.05);
}

/* Circular images - smaller animation */
.img-circle {
  animation: none !important;
  transition: all 0.3s ease;
}

.img-circle:hover {
  transform: scale(1.1) rotate(5deg);
  box-shadow: 0 15px 30px rgba(0,0,0,0.3);
}

/* Grid images with effect-jazz - enhanced */
.grid figure.effect-jazz img {
  animation: none !important;
  transition: all 0.5s ease;
  transform-style: preserve-3d;
}

.grid figure.effect-jazz:hover img {
  transform: perspective(1000px) scale3d(1.1, 1.1, 1.1) rotate(5deg);
}

/* Profile/Leadership images */
.leadership-img,
.governor-img,
.team-member img,
.leader-profile img {
  animation: float3d 6s ease-in-out infinite;
}

.leadership-img:hover,
.governor-img:hover,
.team-member img:hover,
.leader-profile img:hover {
  animation: none;
  transform: perspective(1000px) translateY(-20px) rotateX(10deg);
  box-shadow: 0 30px 60px rgba(0,0,0,0.4);
}

/* News/Blog images */
.news_h1l1 img,
.blog-image img {
  animation: swing3d 5s ease-in-out infinite;
}

.news_h1l1 img:hover,
.blog-image img:hover {
  animation: none;
  transform: perspective(1000px) rotateX(10deg) scale(1.05);
}

/* About section images */
.about_h1l img {
  animation: none !important;
  transition: all 0.4s ease;
}

.about_h1l img:hover {
  transform: perspective(1000px) translateZ(20px) scale(1.05);
  box-shadow: 0 25px 50px rgba(0,0,0,0.5);
}

/* Footer trending post images */
.footer_1i1 img {
  animation: none !important;
  transition: all 0.3s ease;
}

.footer_1i1 img:hover {
  transform: perspective(500px) rotateY(15deg) scale(1.1);
}

/* Testimonial images */
.testim_1i img {
  animation: none !important;
  transition: all 0.3s ease;
}

.testim_1i img:hover {
  transform: scale(1.15) rotate(5deg);
  box-shadow: 0 15px 30px rgba(0,0,0,0.3);
}

/* List/Course images */
.list_1i1l img,
.trend_1i1 img {
  animation: none !important;
  transition: all 0.4s ease;
  transform-style: preserve-3d;
}

.list_1i1l img:hover,
.trend_1i1 img:hover {
  transform: perspective(1000px) rotateX(10deg) rotateY(-10deg) scale(1.1);
  box-shadow: 0 25px 50px rgba(0,0,0,0.4);
}

/* Featured images in learn section */
.learn_1l img {
  animation: float3d 5s ease-in-out infinite;
}

.learn_1l img:hover {
  animation: none;
  transform: perspective(1000px) translateY(-20px) rotateX(5deg);
}

/* Small thumbnail images */
.about_h1rn1l img,
.thumbnail img {
  animation: none !important;
  transition: all 0.3s ease;
}

.about_h1rn1l img:hover,
.thumbnail img:hover {
  transform: scale(1.2) rotate(10deg);
  box-shadow: 0 10px 20px rgba(0,0,0,0.3);
}

/* Background images - subtle movement */
[class*="background-image"] {
  transition: transform 10s ease;
}

[class*="background-image"]:hover {
  transform: scale(1.1);
}
.form-control:focus{
 box-shadow:none;
 border-color:#27ab432e; 
 }
.form-select:focus{
 box-shadow:none;
 border-color:#27ab432e;  
 }
.form-control{
border-color:#27ab432e;
box-shadow:none;
border-radius:0;
height:50px;
 }
.form-select{
border-color:#27ab432e;
box-shadow:none; 
border-radius:0;
height:50px;
 }

.shadow_box{
box-shadow: 0 0 4px 3px #27ab432e;
 }
.carousel-indicators [data-bs-target] {
 background-color: #27ab43;
}

.input-group .form-control{
height:auto; 
 }
.news_h1l3_last{
border-top:1px solid #27ab432e; 
 }
.news_h1l3l{
border-right:1px solid #27ab432e; 
 }
.form_text{
height:150px; 
 }
.popular_m{
background:#0000009c;
 }
#testim {
background-image: url(../img/2.jpg);
background-position: center;
}

.trend_1i2 ul li a{
padding-top:8px;
padding-bottom:8px; 
 }
.trend_1i2 ul li a:hover{
background:#111; 
 }
.trend_1i2{
 bottom:-18px;
 }
/*********************common_end****************/

/*********************about_ho1****************/
.about_h1rn1r span{
width:50px;
height:50px;
line-height:50px; 
 }
#about_ho1{
padding-bottom:80px; 
 }
.about_h1l3{
width:40%;
top:50px; 
 }
.about_h1l2{
bottom:-170px; 
 }
/*********************about_ho1_end****************/

/*********************list****************/
.list_1i ul li a:hover{
background:#27ab43;
color:#fff;
 }
.list_1i ul li {
margin-top:5px;
margin-bottom:5px;
 }
/*********************list_end****************/


/*********************footer****************/

/*********************footer_end****************/


@media screen and (max-width : 767px){
.navbar-collapse{
max-height:300px;
overflow-y:scroll;
border-top:1px solid #27ab432e;
margin-top:15px;
transition: all 0.3s ease;
 }
.navbar-collapse .nav-link {
background: #f8f9fa;
margin: 5px 0;
padding: 10px 15px;
border-radius: 5px;
border: 1px solid #dee2e6;
}
.navbar-collapse .nav-link:hover {
background: #e9ecef;
}
#header .nav-link{
font-size:24px;
border-bottom:1px solid #27ab432e;
padding-top:10px;
padding-bottom:10px;
margin:0!important;
 }
.navbar .navbar-toggler{
box-shadow:none!important;
background:#27ab430d;
border:none;
border-radius:0;
margin-top:-1px;
 }
.drop_1{
margin-top:0!important; 
 }
.drop_1 a{
font-size:22px; 
 }
.drop_2{
min-width:100%; 
 }
.sticky .drop_1{
margin-top:0!important; 
 }
.line{
margin-left:auto;
margin-right:auto; 
 }

.navbar{
width:100%; 
border-radius:0; 
 }
.navbar .button{
margin-top:10px;
 }
#top{
display:none;
 }
.main_1{
position:static!important;
}
.font_60{
font-size:45px; 
 }
.about_h1l  img{
width:100%; 
 }
.about_h1l2 {
position:static!important;
margin-top:10px;
 }
.about_h1r{
margin-top:15px;
 }
.about_h1r h5{
text-align:center;
 }
.about_h1r h2{
text-align:center;
 }
.about_h1r br{
display:none;
 }
.about_h1r .button{
width:70%;
text-align:center;
margin-left:auto;
margin-right:auto;
display:block;
 }
.trend_1i2 {
padding-left:10px!important;
padding-right:10px!important;  
 }
.trend_1i2 ul li a{
font-size:12px;
padding-left:10px!important; 
padding-right:10px!important; 
 }
.trend_1i_last {
margin-bottom:15px; 
 }
.course_1  br{
display:none; 
 }
.course_1  p{
text-align:left;
 }
.about_h1l3 {
width:60%; 
 }
.about_h1rn1l{
text-align:center; 
 }
#about_ho1{
padding-bottom:40px; 
 }
.news_h1l{
text-align:center;
margin-top:8px;
margin-bottom:8px;
 }
.news_h1l3l {
border:none!important; 
 }
.footer_1i{
margin-top:8px;
margin-bottom:8px; 
 }
.footer_1i h4{
text-align:center;
 }
.footer_1ism h6{
margin-top:10px!important;
font-size:14px;
 }
.footer_1ism p{
font-size:14px;
 }
.footer_2 {
text-align:left!important; 
 }
.footer_2 p{
font-size:14px; 
 }
.testim_1i {
margin-top:8px;
margin-bottom:8px;
text-align:center; 
 }
.testim_1i p{
text-align:left;
 }
.pages ul li{
margin-top:5px;
margin-bottom:5px; 
 }
.center_o1{
text-align:center; 
 }
.blog_1dt5il .form-control{
margin-top:10px; 
 }
.blog_1dt5il h6{
text-align:center;
 }
 
 }

@media (min-width:576px) and (max-width:767px) {

 }
@media (min-width:768px) and (max-width:991px) {
.navbar-expand-md {
flex-wrap:wrap!important;
}

.drop_1{
left:auto!important; 
right:0!important; 
 }
.navbar{
width:98%; 
 }
#top{
width:98%; 
 }
.navbar-brand{
margin-right:10px!important;
font-size:22px!important; 
 }
#header .nav-link {
padding-left: 9px;
padding-left: 9px;
font-size:12px;
}
#header .button {
font-size:12px;
}
.about_h1l  img{
width:100%; 
 }
.about_h1r br{
display:none;
 }
.trend_1i2 ul li a{
font-size:10px;
padding-left:5px!important; 
padding-right:5px!important; 
 }
.trend_1i_last  h5{
font-size:16px; 
 }
.about_h1l3 {
width:50%; 
 }
.about_h1rn1r h4{
font-size:14px; 
 }
.about_h1rn1r span{
width:30px;
height:30px;
line-height:30px;
font-size:14px!important; 
 }
.about_h1rn1r p{
font-size:12px!important; 
 }
.news_h1l3l  h6{
font-size:12px!important; 
 }
.news_h1l3l{
padding:10px!important; 
 }
#footer p{
font-size:13px; 
 }
#footer h6{
font-size:13px; 
 }
.sticky {
width: 100%;
}
 }
@media (min-width:871px) and (max-width:991px) {
.navbar-brand{
margin-right:20px!important;
 }
#header .nav-link {
padding-left: 25px;
padding-left: 25px;
}

 }
@media (min-width:992px) and (max-width:1200px) {
.navbar-expand-md {
flex-wrap:wrap!important;
}
.navbar{
width:95%; 
 }
#top{
width:95%; 
 }
.sticky {
width: 100%;
}
#header .nav-link {
padding-left: 15px;
padding-left: 15px;
}
.navbar-brand{
margin-right:20px!important;
 }
.trend_1i2 ul li a{
font-size:12px;
padding-left:10px!important; 
padding-right:10px!important; 
 }
.news_h1l3l{
padding:10px!important; 
 }
.about_h1rn1r span{
width:30px;
height:30px;
line-height:30px;
font-size:14px!important; 
 }
.about_h1rn1r p{
font-size:12px!important; 
 }
.news_h1l3l  h6{
font-size:12px!important; 
 }
.about_h1rn1r h4{
font-size:16px; 
 }
 }
@media (min-width:1201px) and (max-width:1270px) {
.navbar{
width:90%; 
 }
#top{
width:90%; 
 }
.sticky {
width: 100%;
}
 }
