*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'poppins', sans-serif;
}

html{
    scroll-behavior: smooth;
}

.upcont{
    width: 100%;
    display: flex;
    background-color: #ffffff;
}

.upconto{
    display: flex;
	height:45px;
    padding-left: 20px;
    padding-top: 20px;
    gap: 20px;
    color: #0038a5;
    font-size: 13px;
    margin-left: 0%;
    
}

.upcont a{
    background-color: transparent;
    border: 2px solid #0038a5 ;
    border-radius: 8px;
    padding: 10px 20px;
    color: #0038a5;
    text-decoration: none;
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: 30%;
}

.upcont a:hover{
    background-color: #0031b8;
    color: #fff;
}

.upconto p{
    
}


.upcont i{
    margin-right: 10px;
    color: #0038a5;
}
/*
.upcont img{
    width: 15px;
    height: 15px;
}*/

.upcont:hover{
    color: blue;
    cursor: pointer;
}


hr{
    width: 95%;
    margin-left: 2%;
    display: none;
}
.nav{
    width: 100%;
    display: flex;
    height: 80px;
    background-color: #0038a5;
    padding-top: 10px;
    padding-bottom: 10px;
}




.navbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 20px;

}

.navbar .logo a {
    color: #fff;
    font-size: 24px;
    text-decoration: none;
}

.nav img{
    margin-left: 20px;
    border-radius: 10px;
}

@media (max-width: 480px) {
    .nav img {
        margin-left: 5px;   /* Even smaller margin for very small screens */
        max-width: 70%;     /* Adjust image size for mobile screens */
    }
}

.navbar .nav-links {
    list-style-type: none;
    display: none;
}

.navbar .nav-links li {
    margin: 0 15px;
}

.navbar .nav-links li a {
    color: #fff;
    text-decoration: none;
    font-size: 18px;
}

/* Hamburger Icon */
.hamburger {
    position: absolute;
    margin-bottom: 100px;
    margin-left:75%;
    right: 20;
    display: none;
    font-size: 0px;
    font-weight: lighter;
    color: #fff;
    cursor: pointer;

}

.hamburger {
        color: #fff;
        font-size: 50px;
}

/* Media Query for Mobile Devices */
@media (max-width: 768px) {
    .navbar .nav-links {
        padding-top: 10px;
        padding-bottom: 20px;
        margin-top: 0px;
		margin-left:20px;
        width: 100%;
        flex-direction: column;
        align-items: center;
        position: absolute;
        top: 60px;
        border-radius: 25px;
		
        background-color:gray;
        backdrop-filter: blur(20px) ;
    }

    .navbar .nav-links.active {
        display: flex;
    }

    .navbar .nav-links li {
        margin: 10px 0;
    }

    .hamburger {
        
        display: block;

    }

    .hamburger button{
       
    }
    
}



.logo{
    color: #ffffff;
    font-size: 16px;
    padding-left: 40px;
    padding-top: 10px;
    padding-right: 10%;
    margin-left: 3%;
}

ul{
    list-style: none;
    display: flex;
}

ul li{
  display: inline-block;
  padding-top: 20px;
  
}

ul li a{
    padding-left: 40px;
    padding-top: 0px;
    text-decoration: none;
    color: #fff;
    position: relative;
    justify-content: center;
    display: flex;
    align-items: center;
    float: right;
    font-size: 13px;
    font-weight: bold;
   
}

.active,ul li a:hover{
   color: red;
}

.sub-menu{
    display: none;
    text-align: left;
}
ul li:hover .sub-menu{
    display: flex;
    position: absolute;
    margin-top: 15px;
    margin-left: -15px;
    background-color: #0038a5;
}
ul li:hover .sub-menu ul{
    display:flex;
    flex-direction: column;
    margin: 10px;
}
ul li:hover .sub-menu ul li{
    display: flex;
    flex-direction: column;
    width: 250px;
    padding: 20px;
    border-bottom: 1px dotted #fff;
}
 ul li i{
    margin-left: 10px;
    font-size: 15px;
}

ul li:hover .sub-menu ul li:last-child{
    border-bottom: none;
}

.icons img{
    width: 40px;
    height: 40px;
}
.nav a::after{
    content: '';
    position: absolute;
    width: 70px;
    background-color: #fff;
    height: 3px;
    border-radius: 10px;
    bottom: -6px;
    transform: scaleX(0);
    transition: transform.5s;
}
.nav a:hover::after{
   transform: scaleX(1);
}

@media (max-width: 480px) {
ul li:hover .sub-menu{
	position:none;
}
}
@media (max-width: 480px) {


    .upcont a{
        margin-left: 30px;
         background-color: #0038a5;
         color: #fff;
    }

    .upconto p{
        
    }
    .upcont {
       
        
    }
    .upconto{
        display:block ;
        justify-content: center;
        font-size: 9px;
        gap: 5px;
        padding-bottom: 40px;
        font-weight: bold;
    }
    .logo {
        text-align: center;
        font-size: 18px;
        padding-left: 20px;
        padding-right: 5%;
        
    }

    .nav {
        height: 90px;
    }
    .nav img{
        margin-top: 9px;
        width: 180px;
        height: 60px;
    }

    ul {
        display: none;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }

    ul li a {
        
        padding-left: 20px;
        font-size: 14px;
    }

    .icons img {
        width: 30px;
        height: 30px;
    }
}

.container{
    width: 100%;
    height: 120vh;
    background-image:linear-gradient(rgba(0,0,0,0.45),rgba(0,0,0,0.45)) ,url(images/college\(2\).jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    animation: change 10s infinite ease-in-out;
    
}

/*@keyframes change{
    0%{
        background-image:linear-gradient(rgba(0,0,0,0.45),rgba(0,0,0,0.45)), url(images/college\(2\).jpg);
    }

    60%{
        background-image:linear-gradient(rgba(0,0,0,0.45),rgba(0,0,0,0.45)), url(images/college\(2\).jpg);
    }
    100%{
        background-image:linear-gradient(rgba(0,0,0,0.45),rgba(0,0,0,0.45)), url(images/college\(2\).jpg);
    }
}*/



.content{
    display: flex;
    width: 650px;
    justify-content: center;
    display: inline-block;
}

.content a{
    background-color: #08549c;
    padding: 10px 20px;
    color: #fff;
    text-decoration: none;
    margin-left: 70px;
    border-radius: 5px;
    border: 1px solid white;

}
.content h1{
    color: #fff;
    padding-top: 10%;
    padding-left: 11%;
    font-family: 'poppins',sans-serif;
    font-size: 50px;
    font-weight: 550;
    
   
    
}


.content p{
    color: #fff;
    padding-top: 20px;
    padding-left: 11%;
    padding-bottom: 30px;
    line-height: 1.4;
}

/*button{
    background-color: #0038a5;
    margin-left: 11%;
    margin-top: 30px;
   padding: 10px 30px;
    border: 0;
    color: #fff;
    border-radius: 50px;
   
}*/

button:hover{
    background-color: #f0eeee;
    color: #000;
}

@media (max-width: 600px) {
    .container{
        height: 80vh;
    }
    .content {
        
        width: 97%;
        padding: 0 5%;
    }


    .content a{
        margin-left: -1px;
    }
    .content h1 {
        color: #fff;
        font-size: 30px;
        padding-top: 20%;
        padding-left: 0;
    }

    .content p {
        padding-left: 0;
        font-size: 16px;
    }

    button {
        width: 100%;
        margin-left: 0;
        padding: 12px 0;
        border-radius: 30px;
        font-size: 16px;
    }
}


/*************************/
/************SECTION CONTAINER*************/

.section{
    width: 100%;
    height: 30vh;
    background-color: #f4f5fa;
}

.card-cont{
    display: flex;
    gap: 20px;
    justify-content: center;
    padding: 20px;
}
.card-contt{
    background-color: #08549c;
    display: flex;
    padding: 20px;
    border-radius: 8px;
}
.card-contt a{
    text-decoration: none;
    color: goldenrod;
}

.card-contt h2{
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    padding-bottom: 10px;
}
.card-contt p{
    color: #fff;
    font-family: Arial, Helvetica, sans-serif;
}
.card-contt ion-icon{
    color: white;
    font-size: 57px;
}

@media screen and (max-width: 768px) {
    .section {
        height: auto; /* allow height to grow as needed */
        padding: 20px 5px;
    }

    .card-cont {
        flex-direction: column;
        align-items: center;
    }



   

}

/**************************************************/
/*****************CONTAINER DEPARTMENT*********************************/

.container-department{
    width: 100%;
    height: auto;
    display: flex;
    padding: 30px;
    background-color:#08549c;
    font-family: 'poppins',sans-serif;
}
.sub-section{
    padding-top: 20px;
    padding-right: 80px;
}
.apply-btn a{
    text-decoration: none;
    background-color: #fff;
    color: #08549c;
    padding: 10px 20px;
    border-radius: 30px;
    
}
.apply-btn a:hover{
    background-color: green;
    color: #fff;
}


.sub-section h1{
    font-size: 20px;
    color: #fff;
}
.parag{
    padding-top: 20px;
    line-height: 3.1;
    padding-bottom: 10px;
}
.parag a{
    font-size: 15px;
    text-decoration: none;
    color:#fff;
}
.parag a:hover{
    color: red;
}
.videos {
    flex: 1; /* This allows it to grow within the flex container */
    max-width: 100%;
    height: auto;
    padding-top: 0;
    padding-left: 20px; /* Optional: spacing from the text content */
    display: flex;
    align-items: center;
    justify-content: center;
}



.videos video {
    width: 100%;
    height: auto;
    border-radius: 10px; /* Optional for rounded corners */
}




@media (max-width: 768px) {
    .container-department {
        height: 100vh;
        display: flex;
        flex-direction: column; /* Stack sections vertically on smaller screens */
        padding: 20px;
    }

    .sub-section {
        padding-right: 0;
        padding-bottom: 20px;
        text-align: center;
    }

    .sub-section h1 {
        font-size: 18px; /* Slightly smaller font for mobile */
    }

    .parag {
        line-height: 2; /* Adjust line height for readability on mobile */
    }

    .apply-btn a {
        padding: 8px 16px; /* Reduce button padding for smaller screens */
    }

    .videos{
        flex: 0;
        padding-left: 0px;
    }

}


/********************************/
/***************PROCEDURE CONTAINER******************/
/******************************************/

.procedure{
    width: 100%;
    height: 50vh;
    background-color: #f4f5fa;
}
.sub-procedure{
    text-align: left;
    justify-content: center;
    align-items: center;
    padding: 30px;
    
}

.sub-procedure h1{
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  text-align: center;
  padding-top: 10px;
  padding-bottom: 10px;
}

.sub-procedure p{
    font-family: Arial, Helvetica, sans-serif;
    
  }
  .paragra p{
    line-height: 1.9;
  }

  @media (max-width: 480px) {
    .sub-procedure {
        padding: 10px;
    }

    .sub-procedure h1 {
        font-size: 1.25rem;
    }

    
    .paragra p {
        font-size: 0.9rem;
    }
}

/***********************************************/
/*****************ABOUT HISTORY CONTAINER******************************/
/***********************************************/

.about-history{
    background-color: #f4f5fa;
    width: 100%;
    height: 107vh;
}

.about-history-sub-section{
    width: 100%;
    display: flex;
    justify-content: space-evenly;
    padding: 30px;
}
.about-school{
    width: 600px;
    padding-right: 20px;
    flex: 1;
}
.about-school h1{
    font-size: 25px;
    padding-bottom: 20px;
	padding-top:10px;
    margin-top: 10px;
}
.about-school p{
    color: #343331;
    line-height: 1.9;
    font-size: 15px;
	padding-bottom:10px;
    margin-bottom: 10px;
}

.about-school a{
	text-decoration:none;
	color:#fff;
    background-color: #08549c;
    padding: 10px 20px;
    border-radius: 5px;
	
}


.about-school-NEWS img{
    width: 330px;
}


@media screen and (max-width: 768px) {

    .about-history{
        height: 170vh;
    }
    .about-history-sub-section {
        flex-direction: column; /* Stack items vertically on smaller screens */
        align-items: center;
    }

    .about-school {
        width: 100%; /* Make the about-school section take up more space on smaller screens */
        padding-right: 0;
    }

    .about-school h1 {
        text-align: center;
        font-size: 22px; /* Adjust font size for smaller screens */
    }

    .about-school p {
       padding-bottom: 10px;
        font-size: 14px; /* Adjust font size for smaller screens */
    }

    .about-school-NEWS img {
        width: 100%; /* Ensure images scale correctly on smaller screens */
    }
}

/***********************************************/
/*****************OFFICIALS CONTAINER******************************/
/***********************************************/
.officials{
    width: 100%;
    min-height: 100vh;
    background-color: #fafdfb;
}
.sub-official{
    width: 100%;
    display: flex;
    justify-content: space-evenly;
}

.sub-official .image img{
    width: 600px;
}
.sub-officials-content{
    padding-left: 20px;
}
.sub-officials-content h1{
    font-size: 19px;
    padding-top: 10px;
    padding-bottom: 20px;
}

.sub-officials-content h2{
    font-size: 18px;
    padding-top: 10px;
    padding-bottom: 10px;
}
.sub-officials-content p{
    font-size: 15px;
    line-height: 1.9;
    color: #252323;
}


/***********************************************/
/*****************VISIONS CONTAINER******************************/
/***********************************************/
.container-vision{
    width: 100%;
    height:50vh;
    background-color: #08549c;
}
.sub-vision{
    margin-left: 50px;
    display: flex;
    width: 90%;
    gap: 15px;
    padding-top: 20px;
}
.sub1{
    width: 400px;
}
.sub{
    color: #ffffff;
}
.sub h2{
    padding-bottom: 20px;
}
.sub p{
    line-height: 1.3;
    font-size: 15px;
}



@media (max-width: 768px) {
    .sub-official {
        flex-direction: column; /* Stack items vertically on smaller screens */
        align-items: center; /* Center align items */
    }

    .sub-official .image img {
        width: 100%; /* Make images fill the available width on small screens */
    }

    .sub-officials-content {
        padding-left: 0; /* Remove left padding on small screens */
        text-align: center; /* Center align text */
    }

    .sub-vision {
        margin-left: 20px; /* Reduce margin on smaller screens */
        flex-direction: column; /* Stack items vertically */
    }

    .sub1 {
        width: 100%; /* Make each sub1 section full width */
    }

    .container-vision{
        height: 70vh;
    }
}

/*********ABOUT US PAGE*********
*******************/
/*********ABOUT US PAGE*********
*******************/

.container2{
    width: 100%;
    height: 130vh;
    background-image:linear-gradient(rgba(0,0,0,0.50),rgba(0,0,0,0.50)) ,url(images/college\(2\).jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
.header{
    font-size: 20px;
    color: #fff;
    text-align: center;
    padding-top: 30px;
    padding-bottom: 20px
}

.content1{
   width: 90%;
   display: flex;
   justify-content: space-between;
   gap: 40px;
   padding-left: 40px;
  
}


.content1 video{
    width: 440px;
    height: 230px;
    margin-top: 20px;
    margin-left: 10px;
    
}

.content1 img{
    width: 300px;
    height: 200px;
    margin-left: 10%;
}

.left{
    padding-top: 25%;
    position: absolute;
    text-align: center;
    color: #fff;
    margin-left: 90px;
}


.about-content{
    color: #fff;
    padding-left: 20px;
    line-height: 1.5;
}


 .btnn{
    background-color: #08549c;
    margin-left: 43%;
}

@media (max-width: 768px) {

    .container2{
        height: 170vh;
    }
    .header {
        font-size: 15px;
    }

    .content1 {
        padding-left: 10px;
        flex-direction: column;
        align-items: center;
    }

    .content1 video {
        width: 100%;
        height: auto;
       
    }

    .content1 img {
        width: 80%;
        height: auto;
    }

    .btnn {
        margin-left: 0;
        width: 100%;
        padding: 10px;
        text-align: center;
    }

    .about-content h1{
        padding-top: 50px;
         font-size: 30px;
         text-align: center;
    }
    .left {
        position: absolute;
        margin-left: 0;
        padding-top: 60%;
    }
}



/***********RESOURCE CONTAINER******************/
/*****************************/

.resources-container{
     width: 100%;
     height: 100vh;
     background-color: #fafbfd;
}
.resources-container h1{
    padding-top: 20px;
    color: #111111;
    text-align: center;
}

.resources-boxx{
    padding: 40px;
    display: flex;
    gap: 20px;
    
}
.resources-box h3{
    color: red;
    padding-bottom: 20px;
}
.resources-box p{
    color: #222222;
    line-height: 1.5;
}


@media (max-width: 768px) {
    .resources-container {
        height: auto;  /* Allow height to adjust based on content */
    }

    .resources-box h3{
        text-align: center;
    }
    .resources-boxx {
        flex-direction: column; /* Stack items vertically on smaller screens */
        padding: 20px;
    }

    .resources-box {
        width: 100%; /* Full width for smaller screens */
        margin-bottom: 20px; /* Space between boxes */
    }
}



/*********OUR CORSES PAGE*********
*******************/
/*********OUR CORSES PAGE*********
*******************/

.container3{
    width: 100%;
    height: 220vh;
}


.cont{
    width: 100%;
    height: 200px;
    background-position: center;
    background-size: cover;
    background-image: linear-gradient(rgba(0,0,0,0.40),rgba(0,0,0,0.40)), url(images/college\(2\).jpg);
    border-bottom-left-radius: 30px;
    border-bottom-right-radius: 30px;
}

.table-container{
    padding: 20px;
    display: flex;
}
.head{
    text-align: center;
    padding-top: 2%;
    color: #fff;
    font-size: 50px;
}

.table-container table{
    font-size: 12px;
    width: 550px;
    text-align: left;
    padding-top: 30px;
    padding-left: 40px;
}

table tr td{
    border: 1px solid rgb(7, 7, 7);
}



.box{
    width: 60%;
    
    background-color: #0038a5;
    padding: 10px;
    border-radius: 40px;
    justify-content: center;
    align-items: center;
    display: flex;
    color: #fff;
    margin-left: 20%;
    
}
.box p{
    padding: 10px;
}

@media (max-width: 480px) {
    
    .head {
        font-size: 30px;
    }
    table {
        font-size: 9px;
        padding-left: 10px;
    }
    .table-container {
        background-color: white;
        padding: 5px;
    }
    .box {
        width: 90%;
        margin-left: 5%;
        margin-right: 5%;
        padding: 20px;
    }
    .box p{
        font-size: 14px;
    }
}

    .container3{
        height: 230vh;
    }



/*********CONTACT US PAGE*********
*******************/

/*********CONTACT US PAGE*********
*******************/

.container6{
    width: 100%;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    padding: 30px;
    background-color: #ffffff;
    gap: 150px;
}
.contact-right{   
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: 10px;
    margin-right: 5%;
}

.contact-right h2{
    color: #222222;
    font-family: 'poppins',sans-serif;
}

.contact-inputs{
    background-color: #ededed;
    width: 400px;
    height: 40px;
    border: 0;
    outline: none;
    padding-left:25px ;
    font-weight: 500;
    color: #666;
    border:none;
}

.contact-right textarea{
    height: 130px;
    padding-top: 15px ;
    font-size: 16px;
    
}

.contact-inputs:focus{
    border: 2px solid #4caf50;
}

.contact-inputs ::placeholder{
    color: #a9a9a9;
}

.contact-right button{
    width: 100%;
    font-size: 16px;
    color: #fff;
    margin-top: -3px;
    margin-left: -1px;
    border: none;
    border-radius: 3px;
    background: #111111;
    text-align: center;
    padding: 10px;
}


.contact-left {
    display: flex;
    flex-direction: column;
}

.contact-left h2{
    padding-bottom: 20px;
    padding-left: 20px;
    color:#111111;
}

iframe{
    width: 150%;
    height: 330px;
}
/**.contact-left img{
    margin-right: 40px;
    margin-left: 10px;
    width: 390px;
    height: 310px;
    box-shadow: #fff;
}
    **/


@media (max-width: 768px) {
    .container6 {
        height: 56vh;
        flex-direction: column; 
        padding: 20px;
    }

    iframe {
        width: 100%;
        display: none;
        max-width: 100%;
        height: auto;
        aspect-ratio: 16 / 9; /* Optional: Maintains the aspect ratio of the map */
    }

    .contact-right {
        
        margin-right: 0;
        align-items: center; /* Center the content on smaller screens */
        width: 98%; /* Limit the width */
    }

.contact-left{
    display: none;
}

    .contact-left img {
        display: none;
        width: 80%; 
        margin-left: 0;
    }

    .contact-inputs, .contact-right textarea {
        width: 100%; /* Make input fields take full width on smaller screens */
    }

    .contact-right button {
        font-size: 14px; /* Slightly smaller button text */
    }
}


.container7{
    background-color: #08549c;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    min-height: 80vh;
    display: flex;
    gap: 25px;
    justify-content: center;
    padding: 60px;
    color: #fff;
}
.container7 h1{
    font-size: 20px;
    padding-bottom: 20px;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}

.about-us{
    flex-direction: column;
    width:60%;
}

.about-us p{
    font-size: 12px;
    line-height: 1.5;
}

.iconsss{
    margin-top: 20px;
    font-size: 20px;
}
.iconsss i{
    margin: 5px;
}

.user-links h1{
    padding-left: 30px;
}
.user-links ul{
    list-style: none;
    display:block;
    width: 35%;
   margin-right: -50px;
}
.user-links ul li a{
text-decoration: none;
color: #fff;
font-size: 15px;
line-height: 1.3;
font-weight: lighter;

}

.contact{
    padding-right: 30px;
}
.contact i{
    margin-right: 10px;
}

.contact p{
   line-height: 1.4;
   font-size: 12px;
}
.logo2 h2{
    margin-top: 20px;
    font-size: 16px; 
}
.logo2 h1{
  color: rgb(161, 70, 14);
}

@media (max-width: 768px) {
    .container7 {
       
        padding: 30px;
        flex-direction: column; /* Stack content vertically */
        gap: 15px;
    }

    .about-us {
        width: 100%; /* Make the about-us section take up full width */
    }

    .user-links ul {
        width: 100%; /* Make the user links take full width on small screens */
        margin-right: 0; /* Reset margin */
    }

    .contact {
        padding-right: 0;
    }

    .container7 h1 {
        font-size: 20px; /* Further reduce the font size for small screens */
    }

    .about-us p {
        font-size: 15px; /* Increase font size slightly for better readability */
    }

    .logo2 h1 {
        font-size: 16px; /* Adjust logo size */
    }

    .logo2 h2 {
        font-size: 12px; /* Adjust logo2 subheading size */
    }
}



/****************************************************/
/**********************AGRICULTURE PAGE******************************/
.agric-container1{
    width: 100%;
    height: 326vh;
}
.agric-sub{
    display: flex;
    width: 100%;
    height: 85px;
    background-color: #d1d1d1;
    margin-top: -20px;
}

.ima{
    padding-left: 60%;
}
.agric-sub img{
  border: 2px solid #0038a5;
    width: 80px;
    height: 80px;
    border-radius: 50px;
    object-fit: cover;
}

.agric-sub h1{
    font-size: 17px;
    padding-top: 20px;
    padding-left: 30px;
    color: #343331;
}
.agric-content{
    width: 100%;
    padding: 20px;
}
.agric-content p{
    color: #343331;
    font-size: 15px;
    line-height: 1.5;
    padding-bottom: 20px;
}
.agric-content a{
    background-color: #0038a5;
    padding: 10px 20px;
    color: #fff;
    text-decoration: none;
    border-radius: 6px;
}

.agric-course{
    display: flex;
    padding: 20px;
    gap: 20px;
    justify-content: center;
}
.agric-box h1{
    font-size: 19px;
    padding-bottom: 20px;
    color: #0038a5;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
.agric-box p{
    color: #343331;
    font-size: 15px;
    line-height: 1.5;
}

.tables table{
    width: 100%;
    text-align: left;
}
table tr th {
    color: #111111;
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    margin: 10px;
    font-size: 15px;
}
table tr td{
    height: 40px;
    color: #343331;
    gap: 15px;
    font-size: 15px;
    padding-right: 0px;
    padding-left: 20px;
}
table tr td a{
    text-decoration: none;
}


@media (max-width: 1200px) {
    .agric-course {
        gap: 10px;
    }

    .agric-content p {
        font-size: 14px; /* Adjust text size for better readability on smaller screens */
    }

   
    .agric-sub h1 {
        font-size: 16px; /* Adjust header size */
        padding-left: 20px;
    }
}

@media (max-width: 768px) {
    .agric-container1 {
        height: auto; /* Adjust height for smaller screens */
    }

    .agric-sub {
        height: 60px;
    }

    .agric-sub h1 {
        font-size: 14px; /* Smaller font size for mobile */
        padding-left: 15px;
    }

    .agric-content {
        padding: 10px;
    }

    .agric-course {
        padding: 15px;
        flex-direction: column;
        gap: 15px;
    }

    .tables table {
        width: 100%;
    }

    table tr th,
    table tr td {
        font-size: 10px; /* Smaller text size on mobile */
    }

    .agric-box h1 {
        font-size: 18px;
    }
}



/******************************************LATEST BLOG CONTAINER 5***************************************************/


.container5{
    width: 100%;
    min-height: 100vh;
    align-items: center;
    
    
}

.imagess img{
    width: 80%;
    margin-left: 10%;
}

.matet h1{
    color: orangered;
    display: flex;
    justify-content: space-around;
    padding-top: 30px;
    padding-bottom: 30px;
}

.card-container{
    justify-content: center;
    width: 100%;
    min-height: 100vh;
    align-items: center;
    display: flex;
    gap: 15px;
    padding-bottom: 10%;
    
}
.card{
    background-color: #0038a5;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
    width: 100%;
    height: auto;
    border-radius: 10px;
    color: #fff;
    font-family: 'poppins',sans-serif;
    
}
.card img{
    width: 100%;
    height: auto;
    border-radius: 10px;
}
.card h4{
    color: #ffff;
    padding: 10px 10px;
}
.card p{
    padding: 10px 10px;
    font-family: 'poppins',sans-serif;
    
}
.prg{
    width: 100%;
    display: flex;
    gap: 20px;
}
.btttn {
     text-decoration: none;
     color: #fff;
     padding: 10px 20px;
     margin-left: 40px ;
     font-family: 'poppins',sans-serif;
}

@media (max-width: 480px) {
    .matet h1 {
        font-size: 1.5rem;
    }

    .card-container {
        display: flex;
        flex-direction: column;
        gap: 20px;
        padding-bottom: 5%;
    }

    .card {
        width: 100%;
    }
    .card img{
        width: 100%;
    }

    .imagess img{
        width: 100%;
        margin-left: 0px;
    }

    .btttn {
        font-size: 0.9rem;
        padding: 8px 16px;
    }
}



/************************/
/************gallery*****************/

  
  .title {
    text-align: center;
    margin-bottom: 40px;
    color: #333;
  }
  
  .gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 10px;
  }
  
  .gallery-item {
    overflow: hidden;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
    
  }
  
  .gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
   
  }
  
  .gallery-item img:hover {
    transform: scale(1.05);
  }
  

  /* Initial hidden state */
.animate-on-scroll {
    opacity: 0;
    transform: translateY(50px);
    transition: opacity 0.8s ease-out, transform 0.8s ease-out;
}

/* Final state when visible */
.animate-on-scroll.visible {
    opacity: 1;
    transform: translateY(0);
}


@media (max-width: 600px) {
  .gallery {
    grid-template-columns: repeat(3, 1fr);
  }

  .gallery{
     gap: 0;
  }

  .gallery-item{
    border-radius: 0px;
  }
}





/**************seperate SLIDER news*************/

 .news-section11{
      background: #fff;
      color: #08549c;
      display: flex;
      justify-content: center;
      align-items: center;
      padding: 40px;
    }
*/
    .news-section {
      width: 90%;
      max-width: 1200px;
    }

    .header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 20px;
    }

    .header h2 {
      font-size: 2.5rem;
      font-weight: 700;
      color: #1a34c6;
      padding-left: 20px;
    }

    .header h2 span {
      font-size: 2.5rem;
      color: #001489;
    }

    .header .nav-buttons {
      display: flex;
      gap: 10px;
    }

    .nav-buttons button {
      background: #001489;
      color: #fff;
      border: none;
      width: 40px;
      height: 40px;
      border-radius: 5px;
      cursor: pointer;
      font-size: 1.2rem;
      transition: 0.3s;
    }

    .nav-buttons button:hover {
      background: #0031b8;
    }

    .news-container {
      overflow: hidden;
      position: relative;
    }

    .news-slider {
      display: flex;
      transition: transform 0.6s ease;
    }

    .news-card {
      flex: 0 0 32%;
      background: #fff;
      margin-right: 20px;
      border-radius: 10px;
      overflow: hidden;
      box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1);
    }

    .news-card img {
      width: 100%;
      height: 240px;
      object-fit: cover;
    }

    .news-card h3 {
      font-size: 1.1rem;
      color: #08549c;
      padding: 15px;
    }

    .news-footer {
      display: flex;
      justify-content: space-between;
      padding: 10px 15px 20px 15px;
      color: #001489;
      font-size: 0.85rem;
      text-transform: uppercase;
      font-weight: 600;
    }

    .news-footer span {
      opacity: 0.7;
    }

    @media (max-width: 900px) {
      .news-card {
        flex: 0 0 48%;
      }
      .header h2{
        font-size: 1.5rem;
        padding-left: 10px;
      }
    }

    @media (max-width: 600px) {
      .news-card {
        flex: 0 0 100%;
      }

    }



/****************PROFILE CARD*********************/

.slider-container1 {
  background: linear-gradient(135deg, #141e30, #243b55);
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh;
  overflow: hidden;
}

.slider-container {
  position: relative;
  width: 90%;
  max-width: 1100px;
  overflow: hidden;
}

.slider-container h1{
  text-align: center;
  padding: 20px;
}

.slider {
  display: flex;
  transition: transform 0.6s ease-in-out;
}

.profile-card {
  flex: 0 0 calc(33.33% - 20px);
  background: rgba(255, 255, 255, 0.1);
  border-radius: 15px;
  padding: 25px;
  text-align: center;
  backdrop-filter: blur(8px);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.5);
  margin: 0 10px;
}

.profile-card img {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  object-fit: cover;
  margin-bottom: 15px;
  border: 3px solid #08549c;
}

.profile-card h2 {
  margin-bottom: 5px;
  color: #fff;
}

.profile-card h4 {
  color: #a3bffa;
  margin-bottom: 10px;
}

.profile-card p {
  font-size: 14px;
  line-height: 1.4;
  color: #d1d5db;
  margin-bottom: 15px;
}

.social-icons {
  display: flex;
  justify-content: center;
  gap: 15px;
}

.social-icons a {
  color: #fff;
  background: #261fb9;
  border-radius: 50%;
  padding: 8px;
  transition: 0.3s;
}

.social-icons a:hover {
  background: #6366f1;
}

.buttons {
  position: absolute;
  top: 45%;
  left: 0;
  width: 100%;
  display: flex;
  justify-content: space-between;
  padding: 0 20px;
}

button {
  background: #171285;
  border: none;
  color: #fff;
  font-size: 22px;
  border-radius: 50%;
  width: 45px;
  height: 45px;
  cursor: pointer;
  transition: 0.3s;
}

button:hover {
  background: #6366f1;
}

/* RESPONSIVE for mobile */
@media (max-width: 768px) {
  .profile-card {
    flex: 0 0 100%;
  }
}



.footer{
    background-color:#252323;
    padding-top: 20px;
    color: #fff;
    text-align: center;
    height: 50px;
}
.footer a{
    color: orangered;
}

@media (max-width: 600px) {
    .footer {
       padding: 20px;
        height: 70px; /* Reduce height for small screens */
        font-size: 15px; /* Adjust font size for small screens */
    }
    .footer p{
       
    }
}