﻿@font-face {
  font-family: "tradegothicbold";
  src: url("../fonts/trade-gothic/TradeGothicLT-Bold.eot?#iefix")
      format("embedded-opentype"),
    url("../fonts/trade-gothic/TradeGothicLT-Bold.woff") format("woff"),
    url("../fonts/trade-gothic/TradeGothicLT-Bold.woff2") format("woff2");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "tradegothic";
  src: url("../fonts/trade-gothic/TradeGothicLT-Light.eot?#iefix")
      format("embedded-opentype"),
    url("../fonts/trade-gothic/TradeGothicLT-Light.woff") format("woff"),
    url("../fonts/trade-gothic/TradeGothicLT-Light.woff2") format("woff2");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "questa";
  src: url("../fonts/questa/Questa_Regular.eot?#iefix")
      format("embedded-opentype"),
    url("../fonts/questa/Questa_Regular.woff") format("woff"),
    url("../fonts/questa/Questa_Regular.woff2") format("woff2");
  font-weight: normal;
  font-style: normal;
}



.aspect-1x1{
  aspect-ratio:  1 / 1;
}

.aspect-16x12{
  aspect-ratio:  16 / 12;
}

.aspect-16x9{
  aspect-ratio:  16 / 9;
}

.font-weight-bold, b, strong, h1,h2,h3,h4,h5,h6, th{
  font-family: "tradegothicbold", sans-serif;
}

.icon-circular{
  width: 35px;
  height: 35px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #116a36;
  border: 1px solid;
  font-size: .875em;
}

.padding {
  padding: 2rem 0 4rem;
}

.rounded{
  border-radius: 10px !important;
}

.filter-white{
  -webkit-filter: brightness(55);
  filter: brightness(55);
}

.text-justify{
  text-align: justify;
}

.text-serif{
	font-family: "questa", serif;
}

.text-light{
  color: #f8faf8 !important;
}

.text-primary{
	color: #002a60 !important;
}

.text-secondary{
	color: #fdca06 !important;
}

.bg-primary{
	background-color: #116a36 !important;
	color: #fff;
}

.bg-secondary{
	background-color: #fdca06 !important;
}

.bg-lightgreen{
	background-color: #f4fff4;
}

.bg-light{
	background-color: #f8faf8 !important;
}

.bg-pattern{
}
.bg-pattern::before{
  content: '';
  position: absolute;
  inset: 0;
  background: url(../images/schoolbg.png) center / 20%;
  filter: invert(1);
  opacity: 0.05;
  z-index: -1;
}

.bg-red {
	background-color: #940000 !important;
}

.bg-222 {
background-color: #222222 !important;
}

.bg-gray {
background-color: #dddddd !important;
}

.position-relative{
	z-index: 1;
}

/* Custom Scroll */
.scroller {
  overflow: auto;
}

.scroller::-webkit-scrollbar {
  width: 5px;
}

/* Track */
.scroller::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px #292929;
  border-radius: 10px;
}

/* Handle */
.scroller::-webkit-scrollbar-thumb {
  background: #116a36;
  border-radius: 10px;
}

/* Handle on hover */
.scroller::-webkit-scrollbar-thumb:hover {
  background: #116a36;
}
/* Custom Scroll */

/*header*/
.notice-marquee{
  background-color: #fdca06;
  position: relative;
  z-index: 2;
}

.marqueeBox{
  padding: 4px 0;
  overflow: hidden;
}

.marquee{
  display: flex;
  width: max-content;
  gap: 10px;
  transform: translateX(65%);
  animation: marquee 40s linear infinite;
}

@keyframes marquee{
  from{transform: translateX(65%);}
  to{transform: translateX(-100%);}
}

.marqueeBox:hover .marquee{
  animation-play-state: paused;
}

.marquee-slide:not(:last-child){
  padding-right: 10px;
  border-right: 1px solid #212121;
}

.marquee-slide *{
  font: 600 13px "tradegothicbold", sans-serif;
  word-break: keep-all;
  color: #212121;
}

.marquee-slide a:hover{
  color: #212121;
  text-decoration: underline;
}

.header {
	width: 100%;
  background: #116a36;
  box-shadow: 0 1px 5px 0px rgba(0, 0, 0, 0.22);
  position: absolute;
  z-index: 11;
  top: 0;
  transition: all 300ms ease-in-out;
}

.header.fixed, .header.active{
  position: fixed;
  /* top: -32px; */
}

.mainHeader{
	display: flex;
  justify-content: space-between;
}



.navi {
  position: relative;
  display: flex;
  z-index: 2;
}
.navi ul {
  margin-bottom: 0;
  display: flex;
}

.navi ul li a {
	height: 100%;
  color: #fff;
  font: 20px "tradegothicbold", sans-serif;
  text-transform: uppercase;
  padding: 8px 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: .5rem;
  transition: all 300ms ease-in-out;
}
.navi ul li a:hover {
  color: #fdca06;
}

.menuBtn {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  padding: 0;
  background-color: transparent;
  border: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: center;
  cursor: pointer;
  transition: all 300ms ease-in-out;
}

.menuBtn span {
  width: 30px;
  height: 2px;
  background-color: #fff;
  position: relative;
  transition: all 400ms ease-in-out;
  z-index: 1;
}
.menuBtn span::before,
.menuBtn span::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  background-color: #fff;
  border-radius: 10px;
  transition: all 400ms ease-in-out;
}
.menuBtn:hover span {
  background: #fdca06;
}
.menuBtn:hover span::before,
.menuBtn:hover span::after {
  background: #fdca06;
}
.menuBtn span::before {
  top: -9px;
}
.menuBtn span::after {
  bottom: -9px;
}
.menuBtn.menuBtnActive {
  background: #fff;
}
.menuBtn.menuBtnActive span {
  -webkit-transform: rotate(225deg);
  transform: rotate(225deg);
  background-color: #116a36;
}
.menuBtn.menuBtnActive span::before {
  opacity: 0;
}
.menuBtn.menuBtnActive span::after {
  -webkit-transform: rotate(-90deg) translateX(9px);
  transform: rotate(-90deg) translateX(9px);
  background-color: #116a36;
}

.headerContainer {
  --menuContainer-size: 500px;
  position: fixed;
  background-color: #212121;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
  overflow: hidden;
  display: none;
}

.headerContainer section {
  position: relative;
  left: 0;
  height: 100%;
  padding: 3rem;
  background-color: #212121;
  transition: all 300ms ease-in-out;
  z-index: 1;
  overflow: auto;
}
.headerContainer section.active {
  transform: translateX(calc(var(--menuContainer-size) * -1));
}

.headerContainer section::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url(../images/building-sketch.jpg) center 0% / cover no-repeat;
  opacity: 0.1;
  background-blend-mode: lighten;
  -webkit-filter: invert(1);
  filter: invert(1);
  z-index: -1;
}

.headerContainer section .menuContainer {
  position: relative;
  display: flex;
  align-items: center;
}

.menuContainer ul {
	width: 100%;
  padding-left: 0;
  margin-bottom: 0;
}

.menuContainer ul li {
  margin-bottom: 15px;
}

.menuContainer ul li .menu-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  width: calc(100% - 50px);
  font: 3.5rem "tradegothicbold", sans-serif;
  padding: 0;
  text-align: left;
  background-color: transparent;
  color: #fff;
  text-transform: uppercase;
  transition: all 300ms ease-in-out;
  border: 0;
}

.menuContainer ul li .menu-link.active,
.menuContainer ul li .menu-link:hover {
  color: #fdca06;
}

.menuContainer ul li i {
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid #fff;
  color: #fff;
  font-size: initial;
  text-align: center;
  cursor: pointer;
  transition: all 300ms ease-in-out;
}

.menuContainer ul li .menu-link.active i,
.menuContainer ul li i:hover {
  background-color: #fdca06;
  border-color: #fdca06;
  color: #000;
  transition: all 300ms ease-in-out 300ms;
}

.menuContainer ul li .menu-link.active i{
  transform: translateX(80px) rotate(-90deg);
}

.menuContainer ul li i::after{
  content: '';
  position: absolute;
  left: 50%;
  bottom: calc(100% + 1rem);
  border-left: 2px dashed rgb(255 255 255 / .15);
  height: 200px;
  width: 2px;
  margin-left: -1px;
  opacity: 0;
}

.menuContainer ul li .menu-link.active i::after{
  opacity: 1;
  transition: opacity 300ms ease-in-out 700ms;
}

.menuLeftContainer {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.menuLeftContainer .topQuickLink {
  width: 70%;
}

.menuLeftContainer .topQuickLink li {
  text-align: center;
}

.menuLeftContainer .topQuickLink li.withoutIcon a {
  padding: 10px;
  background: rgb(0 0 0 / 33%);
  display: block;
  border-radius: 40px;
}

.menuLeftContainer .topQuickLink li.withoutIcon a:hover {
  background: #fdca06;
  color: #000;
}

.menuLeftContainer .topQuickLink li a {
  color: #fff;
  font-family: "tradegothicbold", sans-serif;
  text-transform: uppercase;
  transition: all 300ms ease-in-out;
}

.menuLeftContainer .topQuickLink li a:hover {
  color: #fdca06;
}

.menuLeftContainer .topQuickLink li a .img-fluid {
  width: 60px;
  margin: 0 auto 10px;
  background: rgb(0 0 0 / 33%);
  border-radius: 50%;
  padding: 12px;
  transition: all 300ms ease-in-out;
}
.menuLeftContainer .topQuickLink li a:hover .img-fluid {
  background-color: #fff;
}
.menuLeftContainer .topQuickLink li a:hover .img-fluid .filter-white {
  -webkit-filter: hue-rotate(60deg) contrast(0.4);
  filter: hue-rotate(60deg) contrast(0.4);
}

.socialMedia {
  width: 70%;
  text-align: center;
  display: flex;
  justify-content: center;
  margin-top: 30px;
  border: 1px solid rgba(255, 255, 255, 0.15);
  padding: 5px;
  border-radius: 40px;
}

.socialMedia li {
  margin: 0 15px;
}

.socialMedia li a {
  color: #fff;
}

.socialMedia li a:hover {
  color: #fdca06;
}

/* dropdown toggle menu container */
.dropdown-menu-container{
  position: absolute;
  inset: 0 calc(var(--menuContainer-size) * -1) 0 auto;
  max-width: var(--menuContainer-size);
  width: 100%;
  background-color: #f4fff4;
  border-left: 8px solid #116a36;
  padding: 5rem 0 2rem 2rem;
  transition: all 300ms ease-in-out;
  z-index: 1;
}
.dropdown-menu-container.active{
  right: 0;
}

.menu-close{
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  border: 0;
  background-color: transparent;
  color: #116a36;
  font: 700 13px / 1 "tradegothicbold", sans-serif;
  text-transform: uppercase;
}
.menu-close:hover{
  text-decoration: underline;
}

.dropdown-container{
  padding-right: 2rem;
}

.dropdown-menu-container a{
  font: 700 1.5rem / 1 "tradegothicbold", sans-serif;
  color: inherit;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 0;
  transition: all 300ms ease-in-out;
}

.dropdown-menu-container ul li:not(:last-child){
  border-bottom: 1px solid rgb(0 0 0 / 10%);
}

.dropdown-menu-container li:hover > a{
  color: #116a36;
}

.dropdown-menu-container a.active{
  color: #116a36;
  background-color: #fff;
  padding-left: 1rem;
  padding-right: 1rem;
  border-bottom: 1px solid rgb(0 0 0 / 10%);
  box-shadow: 0 0.125rem 0.25rem rgb(0 0 0 / 10%);
}

.dropdown-menu-container a i{
  font-size: 12px;
  color: #116a36;
  transition: all 300ms ease-in-out;
}

.dropdown-menu-container a.active i{
  transform: rotate(360deg);
}

.dropdown-menu-container a.active i::before{
  content: "\f068";
  font-size: 1rem;
}

.dropdown-menu-container .menuChild {
  display: none;
  padding: 10px 1rem;
  background-color: #fff;
  box-shadow: 0 0.125rem .25rem rgb(0 0 0 / 10%);
  margin-bottom: 1rem;
}

.dropdown-menu-container .menuChild a{
  font-size: 1.25rem;
}
/* dropdown toggle menu container */
/*header*/

/* hero banner */
.banner {
	position: relative;
	overflow: hidden;
	height: calc(100vh - 90px);
  margin-top: 90px;
}
.skewedOne{
    position: absolute;
    bottom: -100%;
    left: 50%;
    width: 100%;
    height: 100%;
    background-color: #fff;
    transform: skewY(-7deg);
    transform-origin: top left;
}
.skewedTwo{
    position: absolute;
    bottom: -100%;
    right: 50%;
    width: 100%;
    height: 100%;
    background-color: #fff;
    transform: skewY(7deg);
    transform-origin: top right;
}
/* hero banner */

/* hm overview */
.hm-overview-section::after{
	content: '';
	position: absolute;
	inset: auto 0 0;
	height: 400px;
	background: url(../images/building-sketch.jpg) center 0% / cover no-repeat;
	opacity: 0.2;
	z-index: -1;
}

.hm-overviewText p{
	line-height: 1.5;
    font-size:18px;
    text-align:justify;
}
/* hm overview */

/*----------------------------------------Client counter---------------------------*/
.counter-window{
	margin-top:3rem;
}

.counterBox .inner{
	padding: 1.5rem;
	border: 3px solid var(--clr);
  border-radius: 10px;
	color: var(--clr );
	text-align: center;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	position: relative;
	z-index: 1;
}

/* .counterBox .inner::before{
	content:'';
	position:absolute;
	left:-7px;
	top:-12px;
	background:#fff;
	width:19px;
	height:29px;
	border-right:3px solid var(--clr);
	transform:rotate(45deg);
} */

.counterBox .counter{
	font-size:3rem;
	font-family: "tradegothicbold", sans-serif;
}

.counterBox .counter-title{
	text-transform: uppercase;
	font: 600 14px "tradegothicbold", sans-serif;
}

/* .counter-window .main-div-cou #counter1{
	color:#60A688;
}

.counter-window .main-div-cou #counter2{
	color:#6086A6;
}

.counter-window .main-div-cou #counter3{
	color:#A67E60;
}

.counter-window .main-div-cou #counter4{
	color:#A69460;
}

.counter-window .main-div-cou #counter5{
	color:#7A60A6;
}

.counter-window .main-div-cou #counter6{
	color:#7A60A6;
}

.counter-window .main-div-cou #counter7{
	color:#A69460;
}

.counter-window .main-div-cou #counter8{
	color:#60A688;
}

.counter-window .main-div-cou #counter9{
	color:#A66087;
}

.counter-window .main-div-cou .counter:after{
	margin-left:5px;
}

.counter-window .main-div-cou #counter1:after{
}

.counter-window .main-div-cou #counter2:after{
}

.counter-window .main-div-cou #counter3:after{
}

.counter-window .main-div-cou #counter4:after{
	content:'';
}

.counter-window .main-div-cou #counter5:after{
	content:'';
}

.counter-window .main-div-cou #counter6:after{
	content:'';
}

.counter-window .main-div-cou .title{
	width:100%;
	margin-top:15px;
	color:#3D3D3D;
	font:14px/20px 'latoblack';
	text-transform:uppercase;
}

.counter-window .main-div-cou .title span{
	width:100%;
	float:left;
	font:400 13px 'lato';
	text-transform:capitalize;
	padding-top:10px;
} */
/*----------------------------------------Client counter end---------------------------*/

.readmore.d-flex{
  flex-wrap: wrap;
  gap: 1rem;
}

.readmore .button {
  font: 15px "tradegothicbold", sans-serif;
  text-transform: uppercase;
  letter-spacing: 1px;
  border-radius: 50px;
  color: #000;
  position: relative;
  display: inline-block;
  text-align: center;
  min-width: 150px;
  padding: 1rem 2rem;
  text-decoration: none;
  box-shadow: inset 0 0 0 2px #fdca06;
  overflow: hidden;
  vertical-align: middle;
  z-index: 1;
  border: 0;
  background-color: transparent;
  transition: color 0.3s ease;
  line-height: 1;
}

.readmore .button::before,
.readmore .button::after {
  position: absolute;
  content: "";
  width: 0;
  top: 0;
  height: 110%;
  left: -20%;
  transform: skewX(-35deg);
  z-index: -1;
}

.readmore .button::before {
  background: #fdca06;
  transition: all 0.6s;
}

.readmore .button::after {
  background: rgb(253 202 6 / 0.5);
  transition: all 0.45s;
}

.readmore .button:hover::before,
.readmore .button:hover::after {
  width: 140%;
}


.readmore .button.sm {
  min-width: 130px;
  padding: .75rem 1rem;
  font-size: 14px;
}

.readmore.lightReadmore .button {
  color: #fff;
}

.readmore.lightReadmore .button:hover {
  color: #000;
}

.readmore.whiteReadmore .button {
  box-shadow: inset 0 0 0 2px #fff;
  color: #fff;
}

.readmore.whiteReadmore .button:hover {
  color: #000;
}

.readmore.whiteReadmore .button::before {
  background: #fff;
}
.readmore.whiteReadmore .button::after {
  background: rgb(255 255 255 / 0.5);
}

.readmore.darkReadmore .button {
  box-shadow: inset 0 0 0 2px #000;
  color: #000;
}

.readmore.darkReadmore .button:hover {
  color: #fff;
}

.readmore.darkReadmore .button::before {
  background: #000;
}
.readmore.darkReadmore .button::after {
  background: rgb(0 0 0 / 0.5);
}

/*--events--*/
.hm-eventsContainer .inner{
  height: 100%;
  border-radius: 10px;
  overflow: hidden;
  
}
.hm-eventsContainer a {
  width: 100%;
  height: 100%;
  border-radius: 10px;
  overflow: hidden;
  position: relative;
  background: #041849;
  background: linear-gradient(30deg, #fdca06, #041849, #b80202);
  display: block;
}
.hm-eventsContainer a::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(transparent 30%, rgba(0, 0, 0, 0.5));
}

.hm-eventsContainer a img {
  height: 100%;
  object-fit: cover;
}

.hm-eventsContainer a article {
  position: absolute;
  left: 0;
  bottom: 20px;
  width: 100%;
  padding: 0 20px;
}

.hm-eventsContainer a article h4 {
  width: 100%;
  color: #fff;
  z-index: 9;
  font: 2.2rem/2rem "tradegothicbold", sans-serif;
  text-shadow: 1px 1px 0 #000;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
}

.date {
  font: 13px "tradegothicbold", sans-serif;
  text-transform: uppercase;
  color: #116a36;
}

.press-title {
  position: absolute;
  top: 10px;
  left: 10px;
  padding: 5px 10px;
  color: #000;
  background: #fdca06;
  z-index: 99;
  font: 13px "tradegothicbold", sans-serif;
  text-transform: uppercase;
}

.counting{
	position: absolute;
	right: 0px;
	top: 0px;
	color: #116a36;
	background-color: rgb(255 255 255 / 1);
	width: 50px;
	height: 40px;
	display: flex;
	justify-content: flex-end;
	padding: 5px;
	clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 0);
	font: 1rem "tradegothicbold", sans-serif;
	z-index: 1;
}

.eventBox .inner {
  display: block;
  background: #fff;
  color: #000;
  position: relative;
  height: 100%;
  border-radius: 10px;
  overflow: hidden;
  transition: all 300ms ease-in-out;
  z-index: 1;
}

.eventBox a .img-fluid {
  overflow: hidden;
  background: #000;
}

.eventBox a .img-fluid img {
	aspect-ratio: 2 / 1;
  object-fit: cover;
  transition: all 2s ease-in-out;
}

.eventBox a:hover .img-fluid img{
  transform: scale(1.2, 1.2);
  opacity: 0.5;
}

.eventBox.newsBigBox a > img {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  object-fit: cover;
  z-index: -1;
  transition: all 2s ease-in-out;
}

.eventBox a article {
  padding: 20px;
}

.eventBox a:hover {
  box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175) !important;
}

.eventBox a h4,
.eventBox a h5 {
  font-family: "tradegothicbold", sans-serif;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.eventBox a:hover h4,
.eventBox a:hover h5 {
  color: #116a36;
}

.eventBox.newsBigBox a:hover h4 {
  color: #fdca06;
}
/*--events--*/

/*important dates*/
.importantDatesContainer .impDateheader {
  border-bottom: 1px solid rgba(255, 255, 255, 0.25);
  padding-bottom: 10px;
  margin-bottom: 30px;
}

.importantDatesContainer h6 {
  text-transform: uppercase;
  font-family: "tradegothicbold", sans-serif;
}

.importantDates .inner:hover{
  color: #fff;
}

.importantDates .impDate {
  text-align: center;
  font: 2.5rem "questa";
  padding-right: 20px;
  border-right: 1px solid rgba(255, 255, 255, 0.25);
  margin-bottom: 0;
}

.importantDates .impDate small {
  display: table;
  margin: 0 auto -10px;
  font: 14px "tradegothicbold", sans-serif;
  text-transform: uppercase;
  color: #fdca06;
}

.importantDates .inner p {
  font: 1.3rem "questa";
  padding-left: 20px;
  margin-bottom: 0;
}

.importantDates .inner:hover p{
  text-decoration: underline 1px #fdca06;
}
/*important dates*/

/* hm  principal */
.principal-text .inner{
  position: relative;
  z-index: 1;
}

.principal-text .inner::before{
  
  position: absolute;
  left: -10px;
  top: 0;
  font: 900 14rem / 1 "Font Awesome 6 Free";
  color: rgb(0 0 0 / 7%);
  z-index: -1;
}

.principal-text p{
	line-height: 1.5;
}
.principal-text p b{
	font-family: "tradegothicbold", sans-serif;
    font-size:23px;
}
/* hm  principal */

/* Former Principals */
.toppersBox.formerPrincipalBox .inner{
  padding: 1.5rem;
  border-radius: 10px;
  background-color: #fff;
}
.toppersBox.formerPrincipalBox .inner img{
  max-width: 150px;
}
/* Former Principals */

/* hm achievers */
.hm-toppers-section::before{
  content: '';
  position: absolute;
  inset: 0;
  background: url(../images/hand-holding-trophy.png) right top / 35% no-repeat;
  z-index: -1;
}


.toggleHeader{
  max-width: 600px;
  margin: 0 auto;
  display: flex;
  justify-content: center;
}
.toggleBtn{
  border: 0;
  flex: 1 0 0;
  padding: 1rem;
  border-radius: 10px 10px 0 0;
  background-color: transparent;
  border-top: 4px solid transparent;
  font: 600 1.25rem / 1 "tradegothicbold", sans-serif;
  color: #212121;
}
.toggleBtn.active{
  background-color: #fff;
  border-top-color: #116a36;
  color: #116a36;
}

.toggleWrapper{
  min-height: 407px;
  padding: 3rem 4rem;
  border-radius: 10px;
  background-color: #fff;
  position: relative;
  z-index: 1;
}

.object-cover{
    object-fit:cover;
}


.hm-toppers-wrapper::before,
.hm-toppers-wrapper::after{
  content: '';
  position: absolute;
  inset: 0;
  background: url(../images/icons/awards-lines.svg) 0 bottom / contain no-repeat;
  opacity: .25;
  z-index: -1;
}

.hm-toppers-wrapper::after{
  transform: rotateY(180deg);
}

.toggleContainer:not(.show){
  display: none;
}

.toppersBox .inner{
  padding: 0 2rem;
  text-align: center;
}

.toppersBox .inner .img-fluid{
  position: relative;
}

.topper-position{
  position: absolute;
  right: 1.25rem;
  top: 1rem;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  border-radius: 50%;
  background-image: linear-gradient(#ffde5a, #fdca06);
  font: 600 1rem / 1 "tradegothicbold", sans-serif;
}
.toppersBox .inner img{
  border-radius: 50%;
  max-width: 200px;
  margin: 0 auto;
}

.toppersBox-detail{
  margin-top: 1rem;
}

.toppersBox-detail .marks{
  display: block;
  font: 600 1.5rem "tradegothicbold", sans-serif;
  margin: 5px 0;
  color: #116a36;
}

.toppersBox-detail p:nth-child(1){
  text-transform: uppercase;
}
.toppersBox-detail p:last-child{
  font-family: "questa", serif;
} 
/* hm achievers */

/*news*/
.hm-newsBg {
  background: url(../images/schoolbg.png) #eaeaea;
  background-blend-mode: soft-light;
}
/*news*/

/* customize swiper */
div[class^=swiper-button] {
  color: #000;
  background-color: #fdca06;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  margin-top: -20px;
  transition: all 300ms linear
}

div[class^=swiper-button].bg-primary,div[class^=swiper-button]:hover {
  background-color: #116a36;
  color: #fff;
}

div[class^=swiper-button]::after {
  font-size: 16px
}

div[class^=swiper-button].bg-primary:hover {
  background-color: #fdca06 !important;
  color: #212121;
}

.bottomControls {
  padding: 0 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-top: 20px
}

.bottomControls.position-absolute {
  bottom: 2rem;
  width: 100%
}

.bottomControls div[class^=swiper-] {
  position: static;
  margin: 0!important
}

.bottomControls .swiper-pagination {
  width: max-content
}
/* customize swiper */

/*counter*/
.counterContainer .box .inner {
  border-radius: 10px;
  padding: 20px;
  height: 250px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  background-color: var(--boxbg);
}

.counterContainer .box h4 {
  font: 600 2.5rem "tradegothicbold", sans-serif;
}

.counterContainer .box h5 {
  font-family: "questa";
  margin-bottom: 0;
}

.counterContainer .box h6 {
  font: 20px "questa";
  padding: 0 20px;
  margin-bottom: 0;
  position: relative;
}

.counterContainer .box h6::before {
  content: "";
  position: absolute;
  left: calc(50% - 20px);
  top: -20px;
  width: 40px;
  height: 2px;
  background-color: #fff;
}

.counterContainer .box.qsiBox .inner {
  position: relative;
  background: url(../images/videobg.jpg) center / cover no-repeat;
  background-blend-mode: hard-light;
  justify-content: flex-end;
  align-items: flex-start;
  z-index: 1;
}

.counterContainer .box.qsiBox .inner::before {
  content: "";
  border-radius: 10px;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgb(0 0 0 / 25%);
  z-index: -1;
}

.counterContainer .box.qsiBox .img-fluid {
  position: absolute;
  right: 20px;
  top: 20px;
  width: 50px;
  z-index: 2;
}

.counterContainer .box.qsiBox p {
  font: 1.75rem "tradegothicbold", sans-serif;
  text-align: left;
}

.counterContainer .box.qsiBox a {
  color: #fdca06;
  font-family: "tradegothicbold", sans-serif;
}

.counterContainer .box.qsiBox a:hover {
  color: #fff;
  text-decoration: underline;
}
/*counter*/

/*--Home Videos--*/
.videos {
  padding: 100px 0;
  background: #000;
  position: relative;
  z-index: 1;
  overflow: hidden;
}

.videos::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: url(../images/videobg.jpg) center right no-repeat;
  background-size: cover;
  z-index: -1;
  opacity: 0.8;
  animation: videoMove 70s infinite linear;
}

@keyframes videoMove {
  50% {
    transform: scale(1.5, 1.5);
  }
}

.videoTextContainer {
  color: #fff;
  font-family: "questa";
}

.videoTextContainer article {
  padding: 40px 0;
  width: 75%;
  margin: 0 auto;
  text-align: center;
}

.videoTextContainer article h2 {
  font-family: "tradegothicbold", sans-serif;
  text-transform: uppercase;
  letter-spacing: 2px;
  color: #fdca06;
}

.videoTextContainer article p {
  letter-spacing: 2px;
  padding-top: 15px;
  text-transform: uppercase;
  margin-bottom: 0;
}

.videoIcon {
  text-align: center;
}

.videoIcon a {
  display: table;
  margin: 0 auto;
  color: #fff;
  font: 600 13px "tradegothicbold", sans-serif;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.videoIcon a .img-fluid {
  width: 100px;
  padding: 30px;
  margin: 0 auto 10px;
  border-radius: 50%;
  background-color: #fdca06;
  transition: all 300ms ease-in-out;
}

.videoIcon a:hover .img-fluid {
  background-color: #116a36;
}

.videoIcon a .img-fluid img{
  -webkit-filter: invert(1);
  filter: invert(1);
}

.videoIcon a:hover .img-fluid img{
  -webkit-filter: invert(0);
  filter: invert(0);
}
/*--Home Videos--*/

/* Infrastructure */
.infra-container{
  height: 538px;
  background: url(../images/abt-bg.png) center no-repeat;
  position: relative;
  z-index: 1;
}

.infra-item[data-item='1']{
  margin-top: 150px;
}

.infra-item[data-item='3']{
  margin-top: 50px;
}
.infra-item[data-item='4']{
  margin-top: 70px;
}

.infraBox[data-infra='1'] img{
  aspect-ratio: 1 / 1.5;
}

.infraBox[data-infra='2'] img{
  aspect-ratio: 1 / 1.25;
}

.infraBox[data-infra='4'] img{
  aspect-ratio: 1 / 1.25;
}

.infraBox[data-infra='5'] img{
  aspect-ratio: 1 / 1.5;
}

.infraBox[data-infra='7'] img{
  aspect-ratio: 1 / 1.5;
}

.infraBox[data-infra='square'] img{
  aspect-ratio: 1 / 1;
  filter: blur(10px);
}

.infraBox .inner{
	height:100%;
	display:block;
	position:relative;
	background-color:#000;
  border-radius: 10px;
	overflow:hidden;
}

.infraBox .inner::before{
	content:'';
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	background-image: linear-gradient(transparent 70%, rgba(0,0,0,0.5));
	transition:all 300ms ease-in-out;
	z-index:1;
}

.infraBox .inner:hover::before{
	background:rgba(0,0,0,0.4);
}

/* .infraBox .inner::after {
  content: '';
  position: absolute;
  left: -7px;
  top: -12px;
  background: #fff;
  width: 19px;
  height: 29px;
  transform: rotate(45deg);
  z-index: 2;
} */

.infraBox .inner .img-fluid{
	height:100%;
	position:relative;
	transition:all 1s ease-in-out;
}

.infraBox img{
	/* aspect-ratio: 1.5 / 1; */
	position:relative;
	height:100%;
	object-fit:cover;
}

.infraBox .inner p{
	position:absolute;
	color:#fff;
	z-index:10;
	bottom:10px;
	left:10px;
  font-family: "tradegothicbold", sans-serif;
	margin-bottom:0;
	transition:all 300ms cubic-bezier(.07,1.77,.8,1.5);
}

.infraBox .inner:hover .img-fluid{
	transform:scale(1.2,1.2);
}

.infraBox .inner:hover p{
	bottom:10px;
	opacity:1;
}
/* Infrastructure */

.headingContainer{
  margin-bottom: 3rem;
}

.headingContainer.d-flex{
  justify-content: space-between;
  align-items: center;
}

.heading {
  display: table;
  margin-bottom: 1rem;
}

.heading .h1 {
  font: 2.4rem "tradegothicbold", sans-serif;
  font-weight:800;
}

.heading h2 {
  font-family: "tradegothicbold", sans-serif;
  font-weight:600;
  font-size:27px;
}

.form-group {
  margin-bottom: 20px;
}

.form-group > label {
  margin-bottom: 0;
  font-size: 17px;
  font-weight: 500;
}

label{
  cursor: pointer;
  font-weight: 500;
  font-size: 13px;
}

.form-control {
  border: none;
  border-bottom: 1px solid rgb(0 0 0 / 16%);
  background: none;
  outline: none;
  font-family: "tradegothicbold", sans-serif;
}

.form-control[readonly] {
  background: none;
}

.form-control:focus {
  box-shadow: none;
  border-bottom-color: #212121;
}

select.form-control {
  padding-right: 2rem;
  background: url(../images/icons/arrow-down.svg) 85% center / 10px no-repeat;
}

/*-------Footer-------*/
.footer {
  background: url(../images/footer-bg.jpg) center bottom / cover no-repeat #116a36;
  position: relative;
  z-index: 1;
}

.footer::before{
  content: '';
  position: absolute;
  inset: 0;
  background-image: linear-gradient(#00cafda1 10%, rgb(0 0 0 / 0%));
  z-index: -1;
}

.footerLinks h5,
.footerMap h5 {
  font: 13px "tradegothicbold", sans-serif;
  color: #fff;
  text-transform: uppercase;
  margin-bottom: 30px;
}

.footerLinks ul li a {
  font-size: 13px;
  color: #fff;
}

.footerLinks ul li a:hover {
  color: #116a36;
}

#footerMap_inner {
  position: relative;
}

.footerAddress {
  top: 22%;
  left: 23%;
  position: absolute;
  width: 222px;
}

.footerAddress i {
  position: absolute;
  color: #116a36;
  left: calc(100% - 5px);
  top: 27%;
  font-size: 26px;
}

.footerAddress .footerAddressBox {
  border-radius: 10px;
  padding: 15px;
  background-color: #116a36;
  color: #fff;
  text-align: center;
}

.footerAddress .footerAddressBox h6 {
  font: 13px "tradegothicbold", sans-serif;
  text-transform: uppercase;
  color: #fdca06;
}

.footerAddress .footerAddressBox p {
  font: 12px "tradegothicbold", sans-serif;
}

.footerAddress .footerAddressBox a {
  display: block;
  padding-top: 10px;
  border-top: 1px solid rgb(255 255 255 / .15);
  color: #fdca06;
  font: 12px "tradegothicbold", sans-serif;
}

.bottom {
  margin-top: 15rem;
  padding: 10px 0;
  background-color: #116a36;
}

.bottom p {
  color: #fff;
  font-size: 13px;
  margin-bottom: 0;
  display: flex;
  align-items: center;
  gap: 4px;
}

.bottom p img {
  width: 20px;
}

.bottom .bottomLinks li a {
  color: #fff;
  font-size: 13px;
  padding: 0 5px;
  display: block;
}

.bottom .footerSocial li a {
  color: #fff;
  font-size: 16px;
  padding: 0 5px;
  display: block;
}

.bottom .bottomLinks li a:hover,
.bottom .footerSocial li a:hover {
  color: #fdca06;
}

.button-top {
  background-color: #fdca06;
  position: fixed;
  cursor: pointer;
  right: 20px;
  bottom: 60px;
  font-size: 14px;
  color: #000;
  opacity: 0;
  width: 35px;
  height: 35px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  z-index: 8;
}

.button-top i {
  margin-right: 0;
}

.button-top:hover {
  color: #fff;
  background-color: #212121;
}
/*-------Footer-------*/

.scaleTranslate {
  -webkit-transform: scale(0, 0);
  transform: scale(0, 0);
  opacity: 0;
  -webkit-transition: all 800ms;
  transition: all 800ms;
}

.doneScaleTranslate {
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
  opacity: 1;
}

.leftTranslate {
  -webkit-transform: translate(-200px, 0);
  transform: translate(-200px, 0);
  opacity: 0;
  -webkit-transition: all 600ms;
  transition: all 600ms;
}

.rightTranslate {
  -webkit-transform: translate(200px, 0);
  transform: translate(200px, 0);
  opacity: 0;
  -webkit-transition: all 600ms;
  transition: all 600ms;
}

.topTranslate {
  -webkit-transform: translate(0, -100px);
  transform: translate(0, -100px);
  opacity: 0;
  -webkit-transition: all 600ms;
  transition: all 600ms;
}

.bottomTranslate {
  -webkit-transform: translate(0, 200px);
  transform: translate(0, 200px);
  opacity: 0;
  -webkit-transition: all 1000ms;
  transition: all 1000ms;
}

.doTranslate {
  -webkit-transform: translate(0, 200px);
  transform: translate(0, 200px);
  opacity: 0;
  -webkit-transition: all 500ms;
  transition: all 500ms;
}

.doneTranslate {
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  opacity: 1;
}


.list{
  padding-left: 20px;
}
.list li:not(:last-child){
  margin-bottom: 10px;
}

.list li::marker{
  color: #116a36;
  font-weight: 700;
  font-family: "tradegothicbold", sans-serif;
}

/* ........... Inside Pages Start Here .......... */

.insideBanner{
  height: 30vw;
  overflow: hidden;
  position: relative;
  z-index: 1;
  /* clip-path: ellipse(65% 70% at 50% 100%); */
}

.insideBanner::before, .insideBanner::after{
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
}

.pageHeading-inner{
  transform: translateY(-50%);
  background-color: #002a60;
  padding: 10px 2rem;
  border-radius: 100px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.page-titles{
  color: #fff;
  font: 700 2rem / 1 "questa", serif;
}

.breadcrumb{
  width: auto;
	background:none;
	margin-bottom:0;
	padding-left:0;
  justify-content: center;
}

.breadcrumb li{
  font: 600 13px "tradegothicbold", sans-serif;
  font-weight: 600;
  text-transform: uppercase;
	color:#fff;
}

.breadcrumb-item+.breadcrumb-item::before{
  float: none;
  
  font: 900 13px "Font Awesome 6 Free";
	color:#fff;
}
.breadcrumb li a{
	color: #fff;
}

.breadcrumb li a:hover{
	text-decoration: underline;
}

.breadcrumb-item.active {
    color: #fdca06;
}

/* page header */
.page-header-slider{
  padding: 1px 20px;
}
.page-link-item.swiper-slide{
  height: auto;
  /* width: max-content; */
}
.page-link-item .inner{
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 10px 1rem;
  height: 60px;
  border-radius: 60px;
  background-color: #f8faf8;
  color: #212121;
  text-transform: uppercase;
  font: 600 14px / 1 "tradegothicbold", sans-serif;
  transition: all 300ms ease-in-out;
}

.page-link-item .inner.active,
.page-link-item .inner:hover{
  color: #116a36;
  box-shadow: 0 0 0 1px #116a36;
}
/* page header */

/* About us */
/* motto */
.mottoBox{
  max-width: 800px;
  margin: 0 auto;
}

.mottoBox .emblem{
  margin-bottom: 2rem;
  padding-bottom: 2rem;
  border-bottom: 1px dashed rgb(0 0 0 / 0.5);
  text-transform: uppercase;
  letter-spacing: 5px;
}

.mottoBox .emblem .img-fluid{
  max-width: 200px;
  margin: 0 auto 1rem;
}
/* motto */

/* vision mission */
.boxContainer .serviceBox{
  display: flex;
  align-items: center;
}
.boxContainer .serviceBox .inner{
  height: auto;
  text-align: justify;
  padding: 2rem;
}
.boxContainer .serviceBox .inner .img-fluid{
  max-width: 40px;
  margin-bottom: 10px;
  transition: filter 300ms ease-in-out;
}
.boxContainer .serviceBox .inner article > .scroller{
  height: 350px;
  padding-right: 10px;
  overflow-x: hidden;
}

.boxContainer .position-absolute
{
  position: absolute;
  bottom: 5px;
  right: 1rem;
}
/* vision mission */

/* Aims & objectives */
.aims-pointers{
  margin-top: 1rem;
}
.single-about-chose-us .inner{
  display: flex;
}

.single-about-chose-us .about-choose-img {
  flex: 0 0 60px;
  margin-right: 20px;
}

.single-about-chose-us h5{
  color: var(--clr);
}
/* Aims & objectives */

/* history */
.historycontent{
  color: #d6d2ca;
  margin-bottom: 3rem;
}
/* history */

/* Principal page */
.principal-text .scroller{
  height: 300px;
  padding-right: 10px;
  margin-bottom: 1rem;
}


/* Principal page */

/* PTA */
/* PTA */
/* About us */

/* DPS Society */
.profileContainer{
  padding: 3rem;
}

.profileBox .inner{
  padding-left: 2rem;
}

.profile-imgBox .img-fluid{
  border-radius: 50%;
  border: 1px solid #fdca06;
}

.profile-imgBox .img-fluid img{
  border-radius: 50%;
}
/* DPS Society */

/* contact page */
.contactCard:not(:last-of-type) {
  margin-bottom: 1.25rem;
}
.contactCard .inner{
	padding: 2rem;
  border-radius: 10px;
  background-color: #f8faf8;
  height:100%;
}
.contactCard ul {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 1rem;
}
.contactCard ul li {
  display: flex;
  align-items: center;
  gap: 5px;
}
.contactCard ul li i {
  width: 35px;
  height: 35px;
  font-size: 14px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgb(0 0 0 / 15%);
  color: #212121;
}
.contactCard ul li a{
  color: initial;
}
.contactCard ul li a:hover {
  text-decoration: underline;
  text-decoration-color: #212121;
}
/* contact page */

/* Newsletters */
.yearBtn .form-control{
  min-width: 110px;
  background-color: #f8faf8;
  border-radius: 40px;
}

.yearContainer:not(.show){
  display: none;
}
/* Newsletters */

/* examination systems */
.contact-list li{
  display: flex;
  align-items: center;
  gap: 10px;
}
.contact-list li:not(:last-of-type){
  margin-bottom: 10px;
}
/* examination systems */

/* iconBox */
.iconBox .inside{
  padding: .5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 10px;
  border-radius: 10px;
  font-family: "tradegothicbold", sans-serif;
  background-color: #f8faf8;
  font-size: 13px;
  text-transform: uppercase;
}
/* iconBox */


.principal-text .inner{
    padding:1rem 0 4rem;
}

.principal-img img{
    width:100%;
    height:300px;
}

.contactCard .inner h6{
    font-size: 24px;
    font-weight: 800;
    text-transform: uppercase;
}
/* ........... Inside Pages End Here .......... */