/*RESPONSIVE STYLES- PAKPHSS 
CREATED ON 28/01/2026*/

@media only screen and (max-width: 1440px) {
	.carousel-item .inner-div{
		left: 16%;
	}
}

@media only screen and (max-width: 1366px) {
	.carousel-item .inner-div{
		left: 15%;
	}
	.slide{
		margin-top: 145px !important;
	}
	#about-banner, #results-banner, #contact-banner, #awards-banner{
		margin-top: 145px !important;
	}
}

@media only screen and (max-width: 1024px) {
	.slide{
		margin-top: 130px !important;
	}
	.carousel-item .inner-div{
		left: 5%;
	}
	#about-banner, #results-banner, #contact-banner, #awards-banner{
		margin-top: 130px !important;
	}
}

@media only screen and (max-width: 768px) {
	.top-bar{
		display: none;
	}
	.fixed-top{
		top: 0px !important;
	}
	.nav-list{
		/*display: none;*/
		/*display: flex;*/
		height: 0px !important;
	}
	.log-bar img {
    	width: 60%;
	}
	.navbar-toggler{
		position: fixed;
		right: 20px;
	}
	 .slide {
        margin-top: 100px !important;
    }
    .carousel-item .inner-div{
		left: 2%;
		bottom: 12%;
	}
	.carousel-control-next{
		top: 85%;
	}
	.carousel-control-prev{
		top: 85%;
	}
	#home-features .main-box{
		width: 100%;
	}
	.home-videos .latest-news{
		margin-top: 70px;
	}
	.academic{
		padding-left: 0px;
		margin-bottom: 20px !important;
	}
	.acadiv{
		padding-left: 20px;
	}
	.acadiv .mt-5{
		margin-top: unset !important;
	}
	.home-intro .col-lg-7{
		padding-left: 10px !important;
		padding-top: 60px;
	}
	#important{

	}
	#important .col-xs-3{
		margin-bottom: 30px;
	}
	
	.foo-quick{
		padding-left: 10px;
		width: 100%;
	}
	.foo-reach{
		padding-left: 10px;
		margin-bottom: 20px !important;
		width: 100%;
	}
	.foo-hours{
		width: 100%;
	}
	.foo-counter{
		width: 50%;
	}
	#about-banner, #results-banner, #contact-banner, #awards-banner{
		margin-top: 100px !important;
	}
	#about-banner .about-banner-title{
		margin-top: 100px;
	}
	.about-intro{
		padding-top: 50px;
	}
	.about-intro .col-md-6{
		width: 100%;
	}
	.awards{
		margin-top: 50px;
	}
	.result-table{
		padding-top: 0px !important;
		overflow-x: hidden;
	}
	.gallery{
		padding-top: 0px !important;
	}
	#contact-banner .contact-banner-title{
		margin-top: 100px;
	}
	#contact-form{
		padding-top: 10px;
	}
	#contact-form .col-md-6{
		width: 100%;
	}
	#contact-form .contact-box-right{
		padding-top: 50px;
		padding-left: 0px;
	}
	.navbar-nav .nav-item .nav-link{
		text-align: left;
		padding-left: 15px;
		font-weight: 500;
		font-size: 16px !important;
		padding-bottom: 12px;
	}
	.offcanvas-header{
		border-bottom: 1px solid #ddd;
		background-color: #f5b225;
	}

}

/*MOBILE*/

@media only screen and (max-width: 690px){
	
}

@media only screen and (max-width: 580px){
	 .log-bar img {
        width: 80%;
        padding-left: 8px;
    }
    .carousel-item .inner-div h1{
    	font-size: 1.1rem;
    }
    .carousel-item img{
    	display: none;
    }
    .carousel-item .inner-div{
    	bottom: 25%;
    	left: 0%;
    }
    .slide {
        margin-top: 80px !important;
    }
    .carousel-control-next{
		top: 75%;
	}
	.carousel-control-prev{
		top: 75%;
	}
	.video-background-img{
		height: unset;
	}
	.foo-counter {
        width: 90%;
    }
    .home-gal-box{
    	margin-bottom: 30px;
    	margin-top: unset !important;
    }
   	#about-banner, #results-banner, #contact-banner, #awards-banner{
		margin-top: 80px !important;
	}
	#about-banner .about-banner-title {
        margin-top: 70px;
    }
    .feature-right .col-md-6{
    	margin-bottom: 30px;
    }
    .feature-right br{
    	display: none !important;
    }
    .tbl-inner{
    	width: 100%;
    	overflow-x: scroll !important;
    }
    .fancybox-bg, .fancybox-inner, .fancybox-outer, .fancybox-stage{
    	top: 80px !important;
    }
    .fancybox-toolbar {
    	right: 20px !important;
	}
	.fancybox-caption{
		bottom: 40px !important;
	}
	.events .events-box {
		height: unset !important;
		max-height: unset !important;
		margin-bottom: 30px;
	}	
	#contact-banner .contact-banner-title{
		margin-top: 60px;
	}
	#contact-form .contact-box-right{
		padding-left: 20px;
	}
	#home-intro{
		margin-top: 50px;
	}
	#home-intro .col-lg-5{
		text-align: center;
	}
	#home-intro .img-fluid{
		width: 75%;
	}
    .home-intro .col-lg-7{
    	padding-top: 40px;
    }
    #header.header-scrolled{
    	top: 20px !important;
    }

}