/* DETAILS
==================================================
	Theme Name: NIOBI
==================================================
*/

@charset "utf-8";

@import url("https://use.typekit.net/mcp4twh.css");
@import url('https://fonts.googleapis.com/css2?family=Epilogue:ital,wght@0,100..900;1,100..900&display=swap');
@font-face {
    font-family: 'Gilroy';
    src: url('../webfonts/Gilroy-Medium.eot');
    src: url('../webfonts/Gilroy-Medium.eot?#iefix') format('embedded-opentype'),
        url('../webfonts/Gilroy-Medium.woff2') format('woff2'),
        url('../webfonts/Gilroy-Medium.woff') format('woff'),
        url('../webfonts/Gilroy-Medium.ttf') format('truetype'),
        url('../webfonts/Gilroy-Medium.svg#Gilroy-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gilroy';
    src: url('../webfonts/Gilroy-Semibold.eot');
    src: url('../webfonts/Gilroy-Semibold.eot?#iefix') format('embedded-opentype'),
        url('../webfonts/Gilroy-Semibold.woff2') format('woff2'),
        url('../webfonts/Gilroy-Semibold.woff') format('woff'),
        url('../webfonts/Gilroy-Semibold.ttf') format('truetype'),
        url('../webfonts/Gilroy-Semibold.svg#Gilroy-Semibold') format('svg');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Gilroy';
    src: url('../webfonts/Gilroy-Bold.eot');
    src: url('../webfonts/Gilroy-Bold.eot?#iefix') format('embedded-opentype'),
        url('../webfonts/Gilroy-Bold.woff2') format('woff2'),
        url('../webfonts/Gilroy-Bold.woff') format('woff'),
        url('../webfonts/Gilroy-Bold.ttf') format('truetype'),
        url('../webfonts/Gilroy-Bold.svg#Gilroy-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

:root{
    /* ~-~-~-~-~ common transition ~-~-~-~-~ */
    --transition-common: all 0.5s ease 0s;
    /* ~-~-~-~-~ common transition ~-~-~-~-~ */

    /* ~-~-~-~-~ colors ~-~-~-~-~ */
    --color-accent: #003371;
    --color-bg:#081424;
    --color-blue: #253B6A;
    --color-primary: #003371;       
    --color-secondary: #333335;
    --rgb-secondary: 0, 46, 56;
    --color-tertiary: #4F676C;   
    --color-light-green: #8CDCF8;   
    --color-quaternary: #EDF4F5;
    --color-quinary: #000;              
    --color-senary: #000;              
    --color-octonary: #000;      
    --color-nonary: #000;        
    --color-denary: #000;        
    
    --color-white: #fff;
    --color-black: #000;
    /* ~-~-~-~-~ colors ~-~-~-~-~ */

    /* ~-~-~-~-~ declare font family & weight ~-~-~-~-~ */
    --ff-base: 'Gilroy';
    --ff-accent: 'Gilroy';
    --ff-heading: "ivyora-display", serif;
    --ff-awesome: "Font Awesome 6 Free";
    --fw-regular: 400;
    --fw-medium: 500;
    --fw-semi-bold: 600;
    --fw-bold: 700;
    /* ~-~-~-~-~ declare font family & weight ~-~-~-~-~ */

    /* ~-~-~-~-~ declare font size ~-~-~-~-~ */
    --f-size-XXXL: 100px;    
    --f-size-XXL: 60px;      
    --f-size-XL: 36px;       
    --f-size-L: 24px;       
    --f-size-M: 18px;      
    --f-size-S: 16px;     
    /* ~-~-~-~-~ declare font size ~-~-~-~-~ */

    /* ~-~-~-~-~ other adjustments ~-~-~-~-~ */
    --margin-title: 0 0 25px 0;
    --margin-paragraph: 0 0 25px 0;

    --border-radius-image: 10px;
    --padding-height: clamp(60px, 9.76563vw, 100px);
    --gap-40:40px;
    --gap-50:50px;
    /* ~-~-~-~-~ other adjustments ~-~-~-~-~ */

    /* ~-~-~-~-~ form adjustments ~-~-~-~-~ */
    --form-height: 80px;
    --form-font-color: #5B5B5B;
    --form-placeholder-color: #5B5B5B;
    --form-border-radious: 100px;
    --form-holder-bg: #E9E5DDCC;
    /* ~-~-~-~-~ form adjustments ~-~-~-~-~ */
}
::selection{
    background-color: #181a1d;
    color: #fff;
}

@media only screen and (max-width: 1600px) { 
    :root{
        --f-size-XXXL: 60px;    
        --f-size-XXL: 42px;
        --f-size-XL: 30px;  
   }
}
@media screen and (max-width:1550px){
    :root { --f-size-XXXL: 55px; --f-size-XXL: 40px; }
}
@media only screen and (max-width: 1399px) { 
    :root{
        /* ~-~-~-~-~ declare font size ~-~-~-~-~ */
        --f-size-XXXL: 52px;    
        --f-size-XXL: 36px;      
        --f-size-XL: 22px;       
        --f-size-L: 18px;     
        /* ~-~-~-~-~ declare font size ~-~-~-~-~ */
        --gap-40:30px;
        --gap-50:40px;
   }
}
@media only screen and (max-width: 1199px) { 
    :root{
    /* ~-~-~-~-~ declare font size ~-~-~-~-~ */
    --f-size-XXXL: 46px;    
    --f-size-XXL: 32px;      
    --f-size-XL: 20px;       
    --f-size-L: 16px;
    --f-size-M: 16px;      
    --f-size-S: 15px;    
    /* ~-~-~-~-~ declare font size ~-~-~-~-~ */
    --gap-40:25px;
    --gap-50:30px;
   }
}

@media only screen and (max-width: 767px){
    :root{
        --f-size-XXXL: 38px;    
        --f-size-XXL: 28px; 
        --f-size-XL: 18px;
   }
}
/* ~-~-~-~-~-~-~-~-~-~ global font settings start ~-~-~-~-~-~-~-~-~-~ */
html{ overflow-x: hidden; scroll-behavior: smooth;}
body{ font-family: var(--ff-base); font-weight: var(--fw-regular); font-size: var(--f-size-M); color: var(--color-primary); counter-reset: my-carousel-counter;
overflow-x: hidden; color: var(--color-secondary); margin: 0px; padding: 0px;}
body,p{ margin: 0;}
p:not(:last-child){ margin: var(--margin-paragraph);}
h1,.h1,h2,.h2,h3,.h3,h4,.h4,h5,.h5,h6,.h6{ font-weight: var(--fw-regular); color: var(--color-secondary); line-height: 1.3; margin: var(--margin-title); font-family: var(--ff-heading);}
h1,.h1{ font-size: var(--f-size-XXXL);}
h2,.h2{ font-size: var(--f-size-XXL); color: var(--color-accent);}
h3,.h3{ font-size: var(--f-size-XL);}
h4,.h4{ font-size: var(--f-size-L);}
h6,.h6{ font-size: var(--f-size-M);}
/* ~-~-~-~-~-~-~-~-~-~ global adjustments start ~-~-~-~-~-~-~-~-~-~ */
img{ max-width: 100%;}
a, img{ border: none; text-decoration: none; outline: none;}
a, a:link, a:visited, a:focus, a:hover{ outline: none; text-decoration: none; transition: var(--transition-common);}
ul{ list-style: none; margin: 0; padding: 0;}

.padding-common{ padding-top: var(--padding-height); padding-bottom: var(--padding-height);}
.padding-top-common{ padding-top: var(--padding-height);}
.padding-bottom-common{ padding-bottom: var(--padding-height);}

/* ==##==##== utility classes ==##==##== */

.decorated-title{ display: inline-flex; font-family: var(--ff-accent-regular); font-weight: var(--fw-semi-bold); font-size: var(--f-size-M); color: var(--color-accent); text-transform: uppercase; letter-spacing: 0.15rem; position: relative; padding-bottom: 3px; isolation: isolate; margin-bottom: 15px;}
.decorated-title::before{ content: ""; position: absolute; z-index: -1; top: 0; bottom: 0; left: 0; width: 95%; background: rgb(237,28,36); background: linear-gradient(0deg, rgba(237,28,36,0.12) 0%, rgba(237,28,36,0) 100%);}
.overlay-content{ position: relative; z-index: 3;}
.arrow{ display: inline-flex; justify-content: center; align-items: center; width: 45px; height: 45px; background: var(--color-accent); transition: var(--transition-common);}
.arrow::before{ content: ""; background: url(../images/right-arrow.svg) top left no-repeat; background-size: 100%; width: 20px; height: 20px;}
.fade-bg{ background: var(--color-quaternary);}
.background-cover { background-size: cover !important; background-position: center !important; background-repeat: no-repeat !important; }
.responsive-image-wrapper { position: relative; overflow: hidden; }
.responsive-image-wrapper img { display: block; position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.mb-50{ margin-bottom: var(--gap-50);}

/* ==##==##== utility classes ==##==##== */

/* ==##==##== container adjustments ==##==##== */
@media only screen and (min-width: 1601px){
    .container{ max-width: 1600px;}
}
/* ==##==##== container adjustments ==##==##== */

/* ==##==##== button settings ==##==##== */

.btn { display: inline-flex; font-family: var(--ff-accent); font-weight: var(--fw-semi-bold); font-size: var(--f-size-M); color: var(--color-accent); border: 1px solid var(--color-accent); padding: 12px 30px; position: relative; isolation: isolate; overflow: hidden; border-radius: 50px; align-items: center; gap: 10px; font-style: normal;}
.btn:hover{background-color: var(--color-accent); color: var(--color-white);}

.white-btn.btn{ color: var(--color-white); border: 1px solid var(--color-white);}
.white-btn.btn:hover{background-color: var(--color-white); color: var(--color-accent);}

.button__primary, .header-button a{ display: inline-flex; font-family: var(--ff-accent); font-weight: var(--fw-semi-bold); font-size: var(--f-size-M); color: var(--color-white); background: var(--color-accent); border: 4px solid var(--color-accent); padding: 12px 30px; position: relative; isolation: isolate; overflow: hidden;}
.button__primary::before, .header-button a::before{ content: ""; position: absolute; z-index: -1; inset: 0; background: var(--color-secondary);}
.button__primary::after, .header-button a::after{ content: ""; position: absolute; z-index: -1; inset: 0; background: var(--color-accent); transform: rotate(45deg) translate(-30px, -30px); width: 200px; height: 200px; transition: var(--transition-common);}
.button__primary:hover, .header-button a:hover{ color: var(--color-white);}
.button__primary:hover::after, .header-button a:hover::after{ transform: rotate(45deg) translate(140px, -30px);}

.button__secondary{ display: inline-flex; align-items: center; font-family: var(--ff-accent); font-weight: var(--fw-semi-bold); color: var(--color-secondary); column-gap: 12px;}
.button__secondary::after{ content: ""; background: url(../images/dark-arrow.svg) top left no-repeat; background-size: 100%; width: 16px; height: 12px; transition: var(--transition-common);}
.button__secondary:hover{ color: var(--color-secondary);}
.button__secondary:hover::after{ transform: translate(10px,0);}

@media only screen and (max-width: 767px){
    .button__primary, .header-button a{ padding: 11px 25px;}
    .mb-5{ margin-bottom: 25px !important;}
}

/* ==##==##== button settings ==##==##== */

/* ==##==##== form control settings ==##==##== */
.form-control{ background-color: transparent !important; height: var(--form-height); border: 0 !important; border-radius: 0px !important; box-shadow: none !important; color: var(--form-font-color); font-size: var(--f-size-M); padding-right: 20px; padding-left: 20px; border: 1px solid var(--color-accent) !important;}
select.form-control { background: url(../images/select-arrow.svg); background-position: right 5px center; background-size: 13px; background-repeat: no-repeat; padding: 2px 22px 2px 15px; height: fit-content; color: var(--color-secondary); cursor: pointer; background-color: transparent !important; height: var(--form-height); border: 0 !important; border-radius: 0px !important; box-shadow: none !important; color: var(--form-font-color); font-size: var(--f-size-M); padding-right: 20px; padding-left: 20px; border: 1px solid var(--color-accent) !important;}
textarea.form-control{ height: 140px; padding-top: 15px; border-radius: 0px; resize: none;}

.form-control::-moz-placeholder { color: var(--form-placeholder-color); opacity: 1; font-weight: 400;}
.form-control:-ms-input-placeholder { color: var(--form-placeholder-color); font-weight: 400;}
.form-control::-webkit-input-placeholder { color: var(--form-placeholder-color); font-weight: 400;}


.form-row{ margin-bottom: 30px;}
@media only screen and (max-width: 991px){
    .form-row{ margin-bottom: 25px;}
}
/* ==##==##== form control settings ==##==##== */


::-webkit-scrollbar { width: 5px; border-radius: 10px;}
::-webkit-scrollbar-track {  box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);  }
::-webkit-scrollbar-thumb {   background: linear-gradient(180deg, #253B6A 0%, #253B6A 100%);  outline:0 none;  }

/* ~-~-~-~-~-~-~-~-~-~ common padding ~-~-~-~-~-~-~-~-~-~ */
.common-padding{padding-top: 120px; padding-bottom: 120px;}
.comm-padding-top{padding-top: 120px;}
.comm-padding-bottom{padding-bottom: 120px;}





/* ~-~-~-~-~-~-~-~-~-~ header adjustments start ~-~-~-~-~-~-~-~-~-~ */

/* ~~hamburger menu start~~ */
.hamburger-nav { display: none; vertical-align: top; width: 28px; height: 26px; position: relative; margin: 0 0 0 15px; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; -o-transition: .5s ease-in-out; transition: .5s ease-in-out; cursor: pointer; margin-top: 0; z-index: 9;}
.hamburger-nav span { display: block; position: absolute; height: 2px; width: 100%; background: var(--color-white); border-radius: 9px; opacity: 1; left: 0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}
.hamburger-nav span:nth-child(1) { top: 2px; -webkit-transform-origin: left center; -moz-transform-origin: left center; -o-transform-origin: left center; transform-origin: left center;}
.hamburger-nav span:nth-child(2) { top: 10px; -webkit-transform-origin: left center; -moz-transform-origin: left center; -o-transform-origin: left center; transform-origin: left center;}
.hamburger-nav span:nth-child(3) { top: 18px; -webkit-transform-origin: left center; -moz-transform-origin: left center; -o-transform-origin: left center; transform-origin: left center;}
.hamburger-nav-close { vertical-align: top; width: 30px; height: 24px; position: relative; margin: 0 0 0 15px; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; -o-transition: .5s ease-in-out; transition: .5s ease-in-out; cursor: pointer; margin-top: 0; z-index: 9;}
.hamburger-nav-close span { display: block; position: absolute; height: 2px; width: 100%; background: var(--color-white); border-radius: 9px; opacity: 1; left: 0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;}
.hamburger-nav-close span:nth-child(1) { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); top: 10px; left: 3px;}
.hamburger-nav-close span:nth-child(2) { width: 0%; opacity: 0;}
.hamburger-nav-close span:nth-child(3) { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); top: 10px; left: 2px;}
/* ~~hamburger menu end~~ */


.main-header{ position: fixed; z-index: 999; inset: 0 0 auto 0;  padding-top: 30px;}
.main-header .container-fluid{ max-width: 1800px; padding-right: 40px; padding-left: 40px;}
.main-header .header-inner-wrap{ position: relative; padding: 20px 0px;}
/* .main-header .header-inner-wrap::before{ content: ""; position: absolute; inset: auto auto 0 0; width: 90%; height: 1px; background: rgba(255,255,255,0.4);} */
.header-logo a{ display: block;}
.header-logo a img{ display: block; width: auto; transition: all 1s ease-out; width: 100px; }
.header-sticky .main-header img { width: 100px; transition: all 1s ease-out; }
.desktop-menu ul {  gap: 70px;}


.desktop-menu ul{ align-items: center;}
.desktop-menu ul li:not(.header-button) a{ display: block; font-family: var(--ff-accent); font-size: var(--f-size-S); color: var(--color-white); padding: 39px 0; margin: 0 10px; position: relative; text-transform: uppercase; letter-spacing: 1px;}
.desktop-menu ul li a:hover{ color: var(--color-light-green);}

.header-right-panel .links-block ul{ gap: 10px;}
.header-right-panel .links-block ul li a{ display: block; width: 55px; height: 55px; border: 1px solid rgba(var(--rgb-senary),0.5); border-radius: 50%; position: relative; font-size: 0;}
.header-right-panel .links-block ul li a::before{ content: ""; position: absolute; inset: 0; background-size: 100% !important; width: 25px; height: 25px; margin: auto; transition: var(--transition-common);}
.header-right-panel .links-block ul li.user a::before{ background: url(../images/user-icon.svg) top left no-repeat;}
.header-right-panel .links-block ul li.cart a::before{ background: url(../images/cart-icon.svg) top left no-repeat;}
.header-right-panel .links-block ul li a:hover{ background: var(--color-quinary); border-color: var(--color-quinary);}
.header-right-panel .links-block ul li a:hover::before{ filter: brightness(0) invert(1);}

/* sub-menu start */
.main-header .menu-item-has-children { position: relative; }
.main-header .menu-item-has-children .sub-menu { background: #FFF; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.13); width: 210px; border-radius: var(--border-radius-image); position: absolute; top: 80%; opacity: 0; visibility: hidden; overflow: hidden; transition: var(--transition-common); }
.main-header .menu-item-has-children .sub-menu li a{ display: block; margin: 0; padding: 10px 20px; color: var(--color-primary) !important;}
.main-header .menu-item-has-children .sub-menu a:hover { background: rgba(0, 46, 56, 0.2); color: var(--color-black) !important; }
.main-header .menu-item-has-children:hover .sub-menu { transform: translateY(10px); opacity: 1; visibility: visible; }
.main-header .menu-item-has-children>a { padding-right: 20px !important; }
.main-header .menu-item-has-children>a::before { position: absolute; content: ''; border: solid var(--color-white); border-width: 0 2px 2px 0; display: inline-block; padding: 3px; transform: rotate(45deg) translateY(-50%); -webkit-transform: rotate(45deg) translateY(-50%); right: 5px; top: 49%; transition: var(--transition-common); }
.desktop-menu ul li a:hover::before{ border-color: var(--color-accent);}
/* sub-menu end */

.main-header .header-button{ margin-left: 30px;}

/* Mobile Menu */
.mobile-menu { display: none; background: var(--color-secondary); width: 100vw; height: 100vh; position: fixed; top: 0; right: -100vw; overflow: hidden; z-index: 999; transition: var(--transition-common); }
.mobile-menu .top-row { padding: 20px; }
.mobile-menubar { height: calc(100vh - 120px); padding: 20px 0; overflow: auto; }
.mobile-menu .mobile-menubar li { opacity: 0; -webkit-transform: translateX(-150px); transform: translateX(-150px); -webkit-transition: -webkit-transform 0.4s, opacity 0.4s; transition: transform 0.4s, opacity 0.4s; padding: 0 20px; font-size: 22px;}
.mobile-menu .mobile-menubar li a{ color: var(--color-white);}
.mobile-menu .mobile-menubar li:not(.header-button) a{ display: inline-block; padding: 10px 0;}
.mobile-menu .mobile-menubar li .sub-arrow { display: flex; align-items: center; justify-content: end; width: 33px; height: 33px; position: absolute; z-index: 1; top: 10px; right: 20px; color: #fff; }

.mobile-menu .mobile-menubar li li{ padding: 0;}

.menu-open .mobile-menu { right: 0; }
.menu-open .mobile-menu .logo-wrap{position: absolute; left: 50%; transform: translateX(-50%); top: 20px;}
.menu-open .mobile-menu .mobile-menubar li { opacity: 1; -webkit-transform: translateX(0); transform: translateX(0); position: relative; text-align: center;}
.menu-open .mobile-menu .mobile-menubar li:nth-child(2) { transition-delay: 0.24s; }
.menu-open .mobile-menu .mobile-menubar li:nth-child(3) { transition-delay: 0.32s; }
.menu-open .mobile-menu .mobile-menubar li:nth-child(4) { transition-delay: 0.40s; }
.menu-open .mobile-menu .mobile-menubar li:nth-child(5) { transition-delay: 0.48s; }
.menu-open .mobile-menu .mobile-menubar li:nth-child(6) { transition-delay: 0.56s; }
.menu-open .mobile-menu .mobile-menubar li:nth-child(7) { transition-delay: 0.57s; }
.menu-open .mobile-menu .mobile-menubar li:nth-child(8) { transition-delay: 0.58s; }
.menu-open .mobile-menu .mobile-menubar li:nth-child(9) { transition-delay: 0.59s; }

/* ~~ header sticky start ~~ */
@keyframes slide-down {
    0% {
        opacity: 0;
        transform: translateY(-100%);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ~~ header sticky start ~~ */
@keyframes slide-down {
	0% {
		opacity: 0;
		transform: translateY(-100%);
	}

	100% {
		opacity: 1;
		transform: translateY(0);
	}
}

.header-sticky .main-header { width: 100%; background: rgba(0, 0, 0, 0.5) !important; box-shadow: 4px 4px 15px 0px rgb(0 0 0 / 10%); animation: slide-down 0.5s; backdrop-filter: blur(15px);}
.header-sticky .main-header .header-inner-wrap{ border-color: transparent;}
.header-sticky .top-header { display: none; }
.header-sticky header.main-header {  padding-top: 0;}

/* ~~ header sticky end ~~ */
@media only screen and (max-width: 1600px){
    .main-header .container-fluid{ padding:0 20px;}
    .desktop-menu ul {  gap: 80px;}
    .desktop-menu ul li:not(.header-button) a{ margin: 0 5px;}
    .main-header .header-button { margin-left: 10px; }
    .about-sec .left-about-wrap .about-logo{width: 100px; right:-50px;}
}
@media only screen and (max-width: 1399px) {
    .main-header .header-inner-wrap{ padding: 15px 0;}
    .mobile-menu { display: block; }
    .mobile-menu .logo-wrap a{ display: inline-block; height: 55px;}
    .mobile-menu .logo-wrap a img { display: block; width: auto; height: 100%; }
    .mobile-menu .sub-menu { display: none; width: calc(100% - 20px); margin-left: auto; }
    .mobile-menu .sub-menu li{ padding: 0;}
    .mobile-menu .header-button{ margin-top: 15px;}
    .desktop-menu ul {  gap: 60px;}
}
@media only screen and (max-width: 991px){
    .main-header .container-fluid { padding: 0 15px; }
    .mobile-menu .top-row { padding: 20px 15px; }
    .mobile-menu .mobile-menubar li{ font-size: 18px; padding: 0 15px;}
    .mobile-menu .mobile-menubar li .sub-arrow{ right: 15px;}
}
@media only screen and (max-width: 575px){
    .main-header .header-inner-wrap{ padding: 10px 0;}
    .mobile-menu .logo-wrap a { height: 40px; }
    .header-sticky header.main-header .hamburger-nav{top: 30px;}   
    .btn{padding: 12px 20px;} 
}

/* ~~ header sticky end ~~ */

/* ~-~-~-~-~-~-~-~-~-~ header adjustments End ~-~-~-~-~-~-~-~-~-~ */

/* ~-~-~-~-~-~-~-~-~-~ global adjustments  end ~-~-~-~-~-~-~-~-~-~ */










/* HOME PAGE START HERE ********************/
.hero-banner-sec {  position: relative;}
.hero-banner-sec .img-holder {  position: absolute;  top: 0;  right: 0;  left: 0;  bottom: 0;  width: 100%;  height: 100%;}
.hero-banner-sec .img-holder img { position: absolute; top: 0; right: 0; left: 0; bottom: 0; width: 100%; height: 100%; object-fit: cover; object-position: top center;}
.hero-banner-sec .content-wrap { position: relative; z-index: 2; padding-top: 16.01%; padding-bottom: 18.09svh; }
.hero-banner-sec .content-wrap .content-wrap-pannel { max-width: 667px; margin: auto; text-align: center; }
.hero-banner-sec .content-wrap:after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; z-index: -1; background: #001c3f94; }
.hero-banner-sec .content-wrap h1{  color: var(--color-quaternary)}
.hero-banner-sec .content-wrap .content-wrap-pannel span { display: block; color: #fff; text-transform: uppercase; letter-spacing: 6px; margin-bottom: 50px;}
.hero-banner-sec .floting-logo { position: absolute; z-index: 2; bottom: 110px; right: 110px; animation: animName 15s linear infinite;}
.hero-banner-sec .down-arrow { position: absolute; bottom: 50px; left: 50%; transform: translateX(-50%); z-index: 3; color: #fff; animation: bounce 1.5s infinite; cursor: pointer;}
.hero-banner-sec.inner-banner .content-wrap{padding-bottom:11.09svh;}

@keyframes animName {
 0%{
    transform: rotate(0deg);
    scale: 1;
   }
   50%{
    scale: 1.2;
   }
100%{
    transform: rotate(360deg);
    scale: 1;
   }
  }
@keyframes bounce {
    0%, 20%, 50%, 80%, 100% {
    transform: translateY(0);
    }
    40% {
    transform: translateY(10px);
    }
    60% {
    transform: translateY(5px);
    }
}


/* .about-sec .right-about-wrap .wrap-holder {padding-left: 45px;max-width: 978px;margin-left: auto;} */
.about-sec .left-about-wrap .about-logo { position: absolute; top: 30%; right: -64px; }
.about-sec .left-about-wrap .wrap-holder { position: relative; }
.about-sec .right-about-wrap .img-holder { margin-top: 50px; position: relative; padding-bottom: 45%; }
.about-sec .right-about-wrap .img-holder img { position: absolute; top: 0; right: 0; left: 0; bottom: 0; width: 100%; height: 100%; object-fit: cover; object-position: top; }

.infrastructure-sec{background: var(--color-bg); position: relative; overflow: hidden;}
.infrastructure-sec  .left-content-wrap { position: relative; z-index: 2; }
.infrastructure-sec .left-content-wrap .floting-logo { position: absolute; top: 0; left: 0; width: 80%; z-index: -1; }
.infrastructure-sec .left-content-wrap .floting-logo img { width: 100%; }
.infrastructure-sec .left-content-wrap  h2 { color: #fff; text-transform: uppercase; }
.infrastructure-sec .left-content-wrap p { color: #fff; }
.infrastructure-sec .left-content-wrap .left-holder { max-width: 500px; margin:0px auto 50px; text-align: center;}
.infrastructure-sec-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 50px; /* spacing between items */ position: relative; z-index: 2; }
.infa_hdn_bx{padding-bottom: 65%; position: relative;}
.infa_hdn_bx h2{color:#fff; text-align: center; font-size: var(--f-size-XXL);position: absolute; transform: translate(-50%, -50%) !important; top: 50%; left: 50%;}
.facilities-tag {display: flex;flex-wrap: wrap;gap: 20px;margin-bottom: 40px;}
.facilities-tag li { width: 30.3%; min-height: 50px; display: flex; text-align: center; justify-content: center; align-items: center; background: #fff;  text-align: center;  padding: 10px; border-radius: 50px; font-size: 12px; line-height: 1.2;}
.infrastructure-sec a.btn{position: relative; z-index: 5;}


.infrastructure-sec .right-img-wrap .img-grid-item a { display: block; position: relative; }
.infrastructure-sec .right-img-wrap .img-grid-item a .img-holder { position: relative; padding-bottom: 65%; }
.infrastructure-sec .right-img-wrap .img-grid-item a .img-holder img { position: absolute; top: 0; right: 0; left: 0; bottom: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 0px;}
.infrastructure-sec .right-img-wrap .img-grid-item a .content { position: absolute; bottom: 15px; left: 15px; color: #fff; }
.infrastructure-sec .right-img-wrap .img-grid-item a .content p { display: flex; align-items: center; gap: 15px; }
/* .infrastructure-sec .right-img-wrap .img-grid:last-child {  margin-top: 30px;} */
.infrastructure-sec .right-img-wrap .img-grid-item a .img-holder:after { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(202.53deg, rgba(0, 0, 0, 0) 2.33%, rgba(8, 20, 36, 0.8) 93.85%); transition:0.3s ease-in-out;}
.infrastructure-sec .right-img-wrap .img-grid-item a:hover .img-holder:after{ background: linear-gradient(202.53deg, rgba(0, 0, 0, 0.37) 0%, rgba(8, 20, 36, 0.637) 100%); }
/* .infrastructure-sec .right-img-wrap .img-grid .img-grid-item{   margin-bottom: 25px;} */
.infrastructure-sec .ac-floting-img{ position: absolute; width: calc(70% - 100px); top:50%; right:50%; transform: translateX(50%) translateY(-50%); animation: float 6s ease-in-out infinite; z-index: 1;}
.infrastructure-sec .ac-floting-img img{ width: 100%;}

.notice-sec .notice-wraper .notice-heading { background: #253B6A; text-align: center; padding: 15px; }
.notice-sec .notice-wraper .notice-heading h2 { color: #fff; margin-bottom: 0; }
.notice-sec .notice-wraper .notice-body { background: #fff; box-shadow: 0px 20px 50px 0px #00000012; padding: 50px 40px; }
.notice-sec .notice-list-wrap li { margin-bottom: 20px; padding-bottom: 10px; border-bottom: 1px solid #D0D0D0; }
.notice-sec .notice-list-wrap li:last-child { margin: 0; padding: 0; border: navajowhite; }
.notice-sec h4{font-family: var(--ff-base); color: var(--color-blue); font-size: var(--f-size-L); display: flex; align-items: center; gap: 4px; flex-wrap: wrap; font-weight: bold; margin-bottom: 10px;padding-left: 25px;position: relative;} 
.notice-sec .notice-list-wrap li h4:after { content: ""; position: absolute; left: 0; top: 10px; width: 12px; height: 12px; background: #253B6A; border-radius: 50%; }
.notice-wraper .notice-body-scroll { max-height: 464px; overflow-y: auto; padding-right: 15px;}
.notice_tag {animation: changeBackgroundColor 0.5s infinite; clip-path: polygon(50% 0%, 80% 10%, 100% 35%, 100% 70%, 80% 90%, 50% 100%, 20% 90%, 0% 70%, 0% 35%, 20% 10%); padding: 4px 10px; color: #fff; display: inline-block; font-size: 10px; }
@keyframes changeBackgroundColor {
  0% {
    background-color: var(--color-accent);
  }
  50% {
    background-color: #FF4136;
  }
  100% {
    background-color: var(--color-accent);
  }
}

.story-sec .heading-wrap { text-align: center; max-width: 1050px; margin: 0 auto 50px; }
.story-grid .img-wrap { position: relative; padding-bottom: 63%; border-radius: 15px; overflow: hidden; }
.story-grid .img-wrap img { position: absolute; top: 0; right: 0; left: 0; bottom: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 15px; }
.story-grid .content-wrap { position: absolute; left: 0; right: 0; top: 0; bottom: 0; z-index: 3; display: flex ; align-items: center; padding-left: 30px; background: linear-gradient(188.39deg, rgba(0, 0, 0, 0) -37.78%, rgba(0, 74, 172, 0.8) 61.7%); opacity: 0; visibility: hidden; transition: var(--transition-common); border-radius: 15px;}
.story-grid .wraper { position: relative; }

.story-grid .content-wrap h3 { color: #fff; font-size: 30px; font-family: "Epilogue", sans-serif; font-weight: 600; margin-bottom: 10px; max-width: 272px;}
.story-grid .content-wrap p { color: #fff;font-family: "Epilogue", sans-serif; font-weight: 400; margin-bottom: 0px;}
.story-grid:hover .content-wrap { visibility: visible; opacity: 1; }
.story-sec .row { row-gap: 30px; }

.testimonial-card{ background-color: #fff; border-radius: 20px; padding: 60px 38px; transition: var( --transition-common); }
.testimonial-card{ color: var(--color-primary); }
.testimonial-card:hover{ background-color: var(--color-primary); }
.testimonial-card h4{ margin-bottom:0px; font-size: 16px; font-family: var(--ff-base); color: var(--color-primary); }
.testimonial-card figure{ margin-bottom: 30px; }
.testimonial-card span{ font-size: 14px; font-weight: 300; font-style: italic; }
.testimonial-slider-item{ margin-right:30px; }
.testimonial-card .feedback-user{ display: flex; padding:16px 30px 16px; border-left: 1px solid var(--color-primary); gap: 20px; align-items: center; }
.testimonial-card div img{ width: 34px; height: 34px; object-fit: cover; border-radius: 30px; }
.testimonial-card:hover h4,
.testimonial-card:hover span,
.testimonial-card:hover p{ color: #fff; }
.testimonial-card:hover .feedback-user{ border-color: #fff; }
.testimonial-card:hover figure img{ filter: grayscale(1000%) brightness(1000%) contrast(0%); }
.test-cont-bx{ width: 100vw; padding-top: 10px; }
.testimonial-sec .testimonial-sec-bx { display: flex; align-items: center; justify-content: space-between; margin-bottom: 40px; }
.testimonial-sec .testimonial-sec-bx h2 { margin: 0; }

.blog-grid { position: relative; }
.blog-grid .img-wrap { position: relative; padding-bottom: 68%; }
.blog-grid .img-wrap img { position: absolute; top: 0; right: 0; left: 0; bottom: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 15px; }
.blog-grid .content-wrap { margin-top: 20px; }
.blog-grid .content-wrap .blog-info { display: flex; gap: 60px; font-size: 16px; color: #003371; margin-bottom: 22px; }
.blog-grid .content-wrap .blog-info li { display: flex; align-items: center; gap: 6px; }
.blog-sec .slide-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 30px; }
.blog-sec h2 span { display: block; color: #333333; }
.blog-grid .content-wrap h3 { color: #253B6A; }



.contact-sec .map-holder .map-wrap iframe { width: 100%; height: 550px; }
.contact-sec  .info-wrap { max-width: 618px; margin: auto; }
.contact-sec  .contact-info { display: flex; align-items: center; position: relative;}
.contact-sec .info-wrap ul li { display: flex; align-items: center; margin-bottom: 15px; }
.contact-sec .info-wrap ul li .content { margin-left: 25px; }
.contact-sec .info-wrap ul li .content p.label { margin-bottom: 5px; }
.contact-sec .info-wrap ul li .content .view { color: #253B6A; }
.contact-sec .info-wrap ul li span.icon-holder svg { color: #253B6A; font-size: 23px; }
.contact-sec .contact-info .floting-img { position: absolute; top: 50%; transform: translateY(-50%); left: 0; right: 0; margin: auto; text-align: center; }
.contact-info-img {position: absolute; margin: auto; transform: translate(-68%, -50%); max-width: 455px; top: 50%; left: 50%;}

.student-slider-wraper .student-card-item { position: relative; width: 33.03%; padding: 10px; }
.student-slider-wraper .student-card-item .img-holder { position: relative; padding-bottom: 140%; }
.student-slider-wraper .student-card-item .img-holder img { position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.student-slider-wraper .student-card-item .content-holder { position: absolute; bottom: 0; z-index: 3; left: 0; right: 0; width: 100%; top: 0; height: 100%; display: flex ; align-items: flex-end; padding: 10px; }
.student-slider-wraper .student-card-item .content-holder .content { padding: 30px; background: linear-gradient(0deg, #001C3F 0%, rgba(0, 28, 63, 0) 100%); overflow: hidden; display: flex; flex-direction: column; justify-content: center;}
.student-slider-wraper .slick-list { overflow: visible; }
.studentlife-sec  .left-content-wrap { position: relative; z-index: 3; background: #fff; }
.student-slider-wraper button.slick-arrow{display: none !important;}
.student-slider-wraper .student-card-item .content-holder h4{ font-weight: 700; color: #fff; font-size: 30px; }
.student-slider-wraper .student-card-item .content-holder p {color: #ccc; font-weight: 600;   overflow: hidden; display: -webkit-box;  -webkit-line-clamp: 3;          line-clamp: 3;   -webkit-box-orient: vertical;}
.student-slider-wraper .student-card-item .content-holder a {font-size: 18px; color: #8CDCF8;}
.studentlife-sec .left-content-wrap:after { content: ""; position: absolute; left: -100vw; right: 0; top: 0; bottom: 0; width: 100vw; height: 100%; background: #fff; z-index: 1; }
.studentlife-sec .left-content-wrap .content-wrap { position: relative; z-index: 3; }

.student-slider-wraper .slick-current .content-holder .content { height: 100%; background: #001C3FCC; }
.student-slider-wraper .student-card-item.slick-current.slick-active .content-holder p { line-clamp: inherit; -webkit-line-clamp: inherit; overflow: visible; }
.studentlife-sec  .logo-wrap { max-width: 125px; margin-bottom: 35px; }
.heading {font-style: italic; line-height: 1.4;}
.heading span { display: block; color: #333333; font-style: normal; text-transform: uppercase;}
.slider-arrow ul { display: flex; align-items: center; gap: 15px; }
.slider-arrow ul a { width: 67px; height: 67px; border-radius: 50%; color: var(--color-accent); border: 1px solid #253B6A; display: flex; align-items: center; justify-content: center; font-size: 23px; }
.slider-arrow ul a.active { background: #253B6A; color: #fff; }
.studentlife-sec .left-content-wrap:before { content: ""; position: absolute; right: -3px; top: 0; bottom: 0; border: 4px solid #fff; }
.right_sl_img{position: relative; width: 100vw; height: 100%; margin-bottom: 60%; overflow: hidden;}
.right_sl_img img{width: 100%; height: auto; object-fit: cover; position: absolute; top: 0; left: 0;}
.achievements-sec { background: #003371; background-image: url("../images/ac-bg.png"); background-repeat: no-repeat; background-size: cover; background-position: center center; position: relative; background-repeat: no-repeat; background-size: cover; background-position: center center; background-attachment: fixed;}
.achievements-sec  .ac-floting-img { position: absolute; top: 50%; width: 40%; right: 0; left: 0; margin: auto; transform: translateY(-50%); z-index: 1;}
.achievements-sec  .row { align-items: center; }
.achievements-sec .container {position: relative; z-index: 3;}
.achievements-sec h2.heading { color: #8CDCF8; }
.achievements-sec h2.heading span { color: #fff; max-width: 600px; }
.achievements-sec .left-content-wraper p{ max-width: 591px; color: #fff; }
.achievements-sec .slider-wraper .ac-slider-wraper { max-width:100%; margin-left: auto; text-align: center; }
.achievements-sec .slider-item .img-wrap { position: relative; padding-bottom: 120%; }
.achievements-sec .slider-item .img-wrap img { position: absolute; top: 0; right: 0; left: 0; bottom: 0; width: 100%; height: 100%; border-radius:0px; }
.achievements-sec .slider-item  .content-wrap { margin-top: 20px; }
.achievements-sec .slider-item .content-wrap h4 { color: #fff; font-size: 35px; margin: 0 auto 20px; font-weight: 700; }
.achievements-sec .slider-item .content-wrap p { letter-spacing: 4px; font-size: 16px; max-width: none; color: #fff;}
.achievements-sec .slick-arrow.slick-disabled{opacity: 0.5;}
.achievements-sec .slick-arrow:before { font-size: 0px; z-index: 6; }
.achievements-sec .slick-next.slick-arrow:before{background: url("../images/slider-right-arrow.png"); background-size:contain; background-position: center center; background-repeat: no-repeat; width: 23px; height: 18px; display: block;}
.achievements-sec .slick-prev.slick-arrow:before{background: url("../images/slider-left-arrow.png"); background-size: contain; background-position: center center; background-repeat: no-repeat; width: 23px; height: 18px; display: block; transform: translateY(-50%) translateX(-50%) !important;}
.achievements-sec .slick-prev.slick-arrow { width: 50px; height: 50px; border: 1px solid var(--color-accent); border-radius: 50%; background-color: var(--color-primary) !important; }
.achievements-sec .slick-next.slick-arrow { width: 50px; height: 50px; border: 1px solid var(--color-accent); border-radius: 50%; background-color: var(--color-primary) !important; }
.achievements-sec .slick-arrow:hover{background-color:var(--color-accent) !important;}
.achievements-sec .slick-arrow:hover::before{opacity: 1;}
/* -- Footer -- */

.ftr-top{padding-bottom: 40px; border-bottom: 1px solid #00337161;}
.main-ftr{background: #EBEEF3;padding: 70px;}
.ftr-logo{margin-bottom: 44px;max-width: 194px;}
.ftr-logo a{display: block;}

.ftr-logo-wrap p{max-width: 312px;margin-bottom: 0;color: #333335;line-height: 1.8;}

.ftr-menu h3 , .ftr-social h3{color: var(--color-primary);margin-bottom: 40px;}
.ftr-menu ul{display: block;}
.ftr-menu ul li{line-height: 1;color: #333335;}
.ftr-menu ul li:not(:last-child){padding-bottom: 24px;}
.ftr-menu ul li a{color: #333335; line-height: 1.3;}



.ftr-social ul{display: flex;gap: 14px;}
.ftr-social ul li{width: fit-content; padding-bottom: 0px !important;}
.ftr-social ul li a{width: 35px;height: 35px;border-radius: 50%;display: flex;align-items: center;justify-content: center;border: 1px solid var(--color-primary);border-radius: 50%;font-size: 16px;color: var(--color-primary);}
.address_list li a{display: flex; align-items: center;}
.ftr-social ul li a:hover{background:var(--color-primary);color: var( --color-white);}
.address_list li a span{width: 35px; min-width: 35px; height: 35px; margin-right:10px; font-size: 15px; border-radius: 50px; display: flex; justify-content: center; align-items: center; color: var(--color-accent); border: 1px solid var(--color-accent);} 
.ftr-btm{padding: 40px 0;}
.ftr-btm p{font-size: 16px;line-height: 1;color: #333335;}

.ftr-btm .term-list-wrap ul{display: flex;align-items: center;justify-content: end;gap: 20px; list-style: none;}
.ftr-btm .term-list-wrap ul li{position: relative;}
.ftr-btm .term-list-wrap ul li a{color: #333335;}
.ftr-btm .term-list-wrap ul li:not(:first-child)::after{content: '';width: 5px;height: 5px;border-radius: 50%;position: absolute;left: -12px;top: 50%;background: #333335;transform: translateY(-50%);}

 
/* ************* about us page **********  */
.about-us-header .heading{ padding-bottom: 30px; border-bottom: 1px solid #8CDCF8; }
.our-mission-sec{ background-color: #001C3F; }
.our-mission-sec h2,
.our-mission-sec p{ color: var(--color-white); }
.our-mission-sec figure img{ width: 100%; height: 100%; object-fit: cover; }
.history_page_bx{ margin-top: 50px; }
.quote-feeback-bx{ background-color: var(--color-accent); padding:40px; margin-left: 90px; color: var(--color-white) !important; text-align: center; }
.quote-feeback-bx h3{ font-size: 36px; color: var(--color-white); text-transform: uppercase;}
.quote-feeback-bx p{ font-size: 16px; }
.history-section .left-img-pannel img{ width:100%; height:100%; }
.quote-feeback-bx figure{width: 100%;text-align: left; opacity: 0.5;}
.quote-feeback-bx figure.quote-2{text-align: end; margin-top: 10px;}
.quote-feeback-bx figure.quote-2 img{text-align: end; transform: scaleX(-1);}
.about-sec.history-section .left-about-wrap .about-logo{ top: 50%; transform: translateY(-50%);}
.about-sec .heading{text-align:center;}
.spaces-bx {display: flex; align-items: center; gap:30px;}
.spaces-bx div{width: 590px; margin: 0px auto;}
.spaces-bx figure{max-width: 650px; width: 100%; height:575px;}
.spaces-bx figure img{width: 100%; height: 100%; object-fit: cover;}
.spaces-bx div h3{ font-size: 60px; color: var(--color-accent); margin-bottom: 20px;}
.spaces-bx div p{font-size: 16px;}
.facilities-main-grid{display:flex; flex-direction: column; margin-top: 60px;}
.facilities-main-grid h3 span{display: block;}
.facilities-main-grid .spaces-bx:nth-child(even){ flex-direction: row-reverse;}
.second-school-sec{ background-image: url(../images/second-scool-bg.png); background-repeat: no-repeat; background-size: cover; background-position: center center; position: relative; background-attachment: fixed;}
.second-school-sec-cont h2{color: var(--color-quaternary);}
.second-school-sec-cont h2 span{color:#8CDCF8; text-transform: uppercase;}
.science_park_img{position:relative; padding-bottom: 45%;}
.science_park_img img{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
.sci_park_activity_row{gap: 20px 0px;}
.sci_park_activity_row .basic_card figure{ position: relative; padding-bottom: 65%;}
.sci_park_activity_row .basic_card h3{ color: var(--color-accent);}
.sci_park_activity_row .basic_card figure img{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
.science-park-section h2 span{text-transform: uppercase;}
.environment-bx .study-language{ list-style: none; padding: 0; margin: 30px 0 0 0; }
.environment-bx .study-language h4{ margin-bottom: 10px;}
.study-language li{margin-bottom:30px; padding-left:40px; position: relative;}
.study-language li::after{ content: ''; width: 15.5px; min-width: 15.5px; height: 15.5px; border-radius: 50%; background: var(--color-accent); position: absolute; left: 5px; top: 10px; outline: 1px solid #6B8FBB; outline-offset:5px; }
.environment-main-sec-bx{position: relative;}
.environment-main-sec-bx {background-image: url(../images/LOGO-BG.png); background-size: contain; background-position: top right; background-repeat: no-repeat;}
.framework-section{
    background-color: #001C3F;
    color: var(--color-white);
}
.framework-section h2{ color: var(--color-light-green);}
.framework-section h2 span{ color: var(--color-white);}
.framework-section p{ color: var(--color-white);}
.framwork-card ul{ display: flex; flex-direction: column; gap: 20px; }
.framwork-card ul li{ padding-left: 40px; position: relative; font-size: 16px; }
.framwork-card h3{color: var(--color-light-green); margin-top: 30px;}
.framwork-card ul li::before{ content: ''; width: 25.15px; min-width: 25.15px; height: 25.15px; border-radius: 50%; border: 2px solid var(--color-white); position: absolute; left: 0; top: 0px; background-color: #c0c0c059; }
.framwork-card ul li::after{ content: ''; width: 15.5px; min-width: 15.5px; height: 15.5px; border-radius: 50%; background: var(--color-accent); position: absolute; left: 5px; top: 5px; }
.framwork-card figure{ position: relative; padding-bottom: 65%; margin-bottom: 25px;}
.framwork-card figure img{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
.get-bx-card{background-color:var(--color-accent); padding: 40px; text-align: center; color: var(--color-white); display: flex; flex-direction: column; align-items: center; gap: 20px; height: 100%;}
.get-bx-card h4{ font-size: 24px; font-family: var(--ff-base); font-weight: 600; color:#fff; margin-bottom: 0;}
.get-bx-card figure {width: 89px; height: 89px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--color-white);}
.main-form label{ font-size: 24px; color: var(--color-primary); margin-bottom: 16px; font-weight: 600; display: block;}
.main-form [type="submit"]{padding: 20px; background-color: var(--color-accent); color: var(--color-white); width: 100%; margin-top: 20px; border:1px solid var(--color-accent); box-shadow: none;}
.main-form [type="submit"]:hover{background-color: transparent; color: var(--color-accent);}
.office-hours-sec{ background-color: #001C3F; color: var(--color-white);}
.office-hours-sec-bx h2 {color:var(--color-light-green); font-style: normal;}
.office-hours-sec-bx h2 span{ color: var(--color-white);}
.list-check{ list-style: none; padding: 0; margin: 0px 0 0 0; display: flex; gap: 20px; margin-bottom: 30px;}
.list-check li{color: var(--color-white); position: relative; padding-left: 40px;}
.list-check li::before{ content: ''; width: 25.15px; min-width: 25.15px; height: 25.15px; border-radius: 50%; border: 2px solid var(--color-white); position: absolute; left: 0; top: 0px; background-color: var(--color-light-green); }
.list-check li::after{ content: ''; width: 15.5px; min-width: 15.5px; height: 15.5px; border-radius: 50%; background: var(--color-accent); position: absolute; left: 5px; top: 5px; }
.office-hours-sec-bx p span{ color: var(--color-light-green);}
.list-check li.time{ font-size: 22px; font-family: var(--ff-heading);}
.list-check li.time::before{top: 4px;}
.list-check li.time::after{top: 9px; left: 4.8px;}
.total-time {flex-direction: column;}
.total-time li span{color: var(--color-light-green);}
.office-hours-sec-bx p a{color: var(--color-light-green);}
.check-mounth-list{ display: flex; gap: 10px; flex-wrap:wrap; max-width: 590px;}
.check-mounth-list li a{padding-inline:20px; text-align: center; justify-content: center; max-width: 88px; min-width: 88px;}
.check-mounth-list li a.active{ background-color: var(--color-accent); color: var(--color-white); border-color: var(--color-accent);}
.year-event-header{ display: flex; align-items: center; justify-content: space-between; margin: 50px 0px 30px;}
.year-event-card{display: block; height: 100%; margin-top:40px;}
.year-event-card figure{position: relative; padding-bottom:60%;}
.year-event-card figure img{width: 100%; height: 100%; object-fit: cover; position:absolute; top: 0; left: 0;}
.year-event-card h3{font-size: 50px; color:#253B6A;margin-top: 40px;}
.year-event-card p{font-size: 20px; color:#333335; margin-bottom: 0;}
.year-event-bx{position: relative;}
.year-event-bx .event-bg-img{ width: calc(80% - 100px); position:absolute; transform: translateY(100px) translateX(-50%); left: 50%; z-index: -1;}
.basic_card{height: 100%;}
.office-bearers-sec{ background-color:#001C3F; }
.office-bearers-sec h2{ color: var(--color-white); margin-bottom: 60px;}
.office-bearers-sec h2 span{ color: var(--color-white);}
.basic_card figure{ position: relative; padding-bottom: 75%; margin-bottom: 25px;} 
.basic_card figure img{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}
.basic_card h3{margin-bottom: 12px;}
.office-bearers-sec .basic_card h3{ color: var(--color-white); line-height: 1.3;}
.office-bearers-sec .basic_card p{font-size:16px; color: var(--color-light-green);}
.captains-sec h2{margin-bottom: 60px;}
/* .captains-sec h2 span{color: var(--color-accent);} */
.captains-sec .basic_card p{ color: var(--color-accent); margin-bottom: 0px; font-weight: 600;}
.framework-section .row{ row-gap: 40px;}
/* -- Footer -- */


/* Sanchari css start */
/* gallery page start */
.middle-heading h2 { text-transform: uppercase; color: #333333; }
.middle-heading { height: 100%; display: flex ; align-items: center; justify-content: center; text-align: center; }


.gallery-slider-sec.common-padding { padding-top: 0; }
.gallery-list-sec .row .col-lg-4.col-md-6 { margin-bottom: 30px; }
.gallery-list-img { position: relative; padding: 0 0 80%; margin-bottom: 30px;}
.gallery-list-img img { position: absolute; height: 100%; width: 100%; top: 0; right: 0; bottom: 0; left: 0; object-fit: cover; }
.gallery-list-img-outer h3 { color: var(--color-primary); }
.gallery-list-load-more-btn a.btn:hover span img { filter: brightness(0) invert(1); }

.gallery-slider-img-item { margin: 0 10px; }
.gallery-slider-img { position: relative; padding: 0 0 80%; margin-bottom: 30px;}
.gallery-slider-img img { position: absolute; height: 100%; width: 100%; top: 0; right: 0; bottom: 0; left: 0; object-fit: cover; }
.gallery-img-slider-wrap .gallery-slider-img{
    margin-bottom: 20px;
}
/* gallery page end */

/* blog page start */
.blog-list-img{ position: relative; padding: 0 0 80%; margin-bottom: 30px;border-radius: 16px; overflow: hidden;}
.blog-list-img img { position: absolute; height: 100%; width: 100%; top: 0; right: 0; bottom: 0; left: 0; object-fit: cover; }

 ul.blog-list-time-wrap,  ul.blog-list-time-wrap li { display: flex; align-items: center;     color: var(--color-primary);}
 ul.blog-list-time-wrap { justify-content: space-between; }
 ul.blog-list-time-wrap li span{margin-right: 10px;}
 .blog-list-sec .row .col-lg-4.col-md-6 { margin-bottom: 50px; }
 .blog-list-cont-wrap { max-width: 378px; margin: 20px 0; }
.blog-list-cont-wrap h3 { margin-bottom: 0; margin-top: 20px; color: var(--color-primary); }

ul.blog-pagination{justify-content: center;}
ul.blog-cont-img-list li {width: 100%; padding-right: 10px; padding-bottom: 30%; position: relative; display: block;}
ul.blog-cont-img-list li img { border-radius: 16px; position: absolute; top: 0; left: 0; object-fit: cover; width: 100%; height: 100%;}
ul.blog-cont-img-list { display: flex ; }

.blog-details-cont h2 { margin: 60px 0 50px; }
ul.blog-cont-img-list { display: flex; margin: 50px 0; gap: 20px;}

.blog-recent-post-wrap { background-color: #F3F3F4; padding: 40px; }
.recent-post-item-wrap { display: flex; align-items: center; }
.blog-recent-post-wrap ul li { padding: 0 0 30px; }


.recent-post-img { min-width: 200px; overflow: hidden; }
.recent-post-cont a.btn { padding: 10px 19px; font-size: 14px; }
.blog-recent-post-wrap h3, .blog-recent-post-wrap h5 { color: var(--color-primary); }
.single_full_img{ position: relative; padding-bottom: 40%; }
.single_full_img img{ position: absolute; width: 100%; height: 100%; object-fit: cover;top: 0; left: 0;}

/* blog page end */

/* achievement page start */
.hero-banner-sec.inner-banner .content-wrap-pannel { max-width: inherit; }
.honoring-champions-heading h2 { max-width: 575px; text-align: center; margin: 0 auto 30px; text-transform: uppercase; color: #333333; }
.honoring-champions-heading { max-width: 951px; text-align: center; margin: 0 auto 30px; }
.honoring-champions-cont-part p { max-width: 1328px; text-align: center; margin: 30px auto; }
.key-accolades-sec { background-color: #001C3F; }
.key-accolades-sec .row:nth-child(odd) .key-accolades-cont{padding-left: 80px;}
.key-accolades-sec .row:nth-child(even) .key-accolades-cont{padding-left: 80px;}
.key-accolades-sec .row:nth-child(even) .key-accolades-cont{padding-right: 80px;}
.key-accolades-sec .row:nth-child(even){flex-direction: row-reverse; margin: 50px 0px;}
/* .key-accolades-sec .row:nth-child(even){} */
.key-accolades-cont h3, .key-accolades-cont p { max-width: 876px; color: #fff; }
.key-accolades-cont p{font-size: 16px;}

.key-accolades-sec h2 { color: #fff; margin-bottom: 50px; }

.key-accolades-certificate-img{ position: relative; padding: 0 0 80%; }
.key-accolades-certificate-img img { position: absolute; height: 100%; width: 100%; top: 0; right: 0; bottom: 0; left: 0; object-fit: cover; }
.key-accolades-certificate-img-item { padding: 20px; background-color: #fff; }
.get-bx-card a{color: var(--color-white);}
.program-features-cont{padding-left: 16px;}
/* achievement page end */
/* Sanchari css end */
/* wp css modification start */
.main-form-group p{margin: 0px;}
.main-form-group br{display: none;}
.pagination { justify-content: center; gap: 10px;}
.pagination li a{width: 67px; height: 67px; border-radius: 50% !important; display: flex; justify-content: center; align-items: center; background: transparent !important; padding: 0; border-color: var(--color-accent); color: var(--color-accent); font-size: 20px;}
.pagination li a span{width: auto; background:none !important; padding: 0px; font-size: 20px; border: none;}
.pagination .page-item.active .page-link,.pagination .page-item .page-link:hover{background-color: var(--color-accent) !important; border-color: var(--color-accent); color: var(--color-white);}
.achievements-sec .slick-prev.slick-arrow,.achievements-sec .slick-next.slick-arrow{background-color: transparent; color: var(--color-light-green); font-size: 0px;}

select.year-select{padding: 12px 42px; background-color: var(--color-accent); border-radius: 100px; border: 1px solid var(--color-accent); color: var(--color-white); box-shadow: none !important; outline: none !important; cursor: pointer; appearance: none; background-image: url(../images/arrow-down-white.png); background-repeat: no-repeat; background-size: 14px; background-position: calc(100% - 20px) 50%;}
select.year-select:hover{background-color:transparent; background-image: url(../images/arrow-down-blue.png); color: var(--color-accent);}
select.year-select:focus{background-color:transparent; background-image: url(../images/arrow-down-blue.png); color: var(--color-accent);}
.captains-slick-items{margin: 0px 10px;}
.captains-slick-items .basic_card{margin-bottom: 0px;}
.captains-sec .slick-prev{left: -20px;}
.captains-sec .slick-next{right: -20px;}
.modal-body .event-img{padding-bottom: 60%; position: relative; margin-bottom: 0px; border-radius: 5px; overflow: hidden;}
.modal-body .event-img img{ width: 100%; height: 100%; object-fit: cover; top: 0px; left: 0px; position: absolute;}
.modal-gallery-slider-img a{ display: block !important; overflow: hidden !important; border-radius: 10px !important; padding-bottom: 60% !important; position: relative !important; }
.modal-gallery-slider-img a img{ position: absolute !important; top: 0 !important; left: 0 !important; width: 100% !important; height: 100% !important; object-fit: cover !important; }
.main-form-group{position: relative;}
.main-form-group .wpcf7-spinner{position: absolute; top: 42px; left: 50%; transform: translateX(200%);}
.environment_bx_img{display: flex; position:relative;}
.environment_bx_img figure{margin: 0px; flex: 1; position: relative;}
.environment_bx_img figure:first-child{margin: 0px; flex: 1; padding-bottom: 70%;}
.environment_bx_img figure:first-child img{width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0;}
/* .environment_bx_img figure:first-child{margin-right: 23%} */
/* .environment_bx_img figure:first-child img{width: 100%;} */
/* .environment_bx_img figure:last-child{position: absolute; right: 0px; top: 50%; transform: translateY(-50%); max-width: 430px;} */
.modal-title{
    font-size: 30px;
    color: var(--color-primary);
    font-weight: 700;
}
.grecaptcha-badge{z-index: 999999;}
@media only screen and (max-width: 1600px){
   .header-logo a img{ max-width: 150px; }
   .common-padding{padding-top: 70px; padding-bottom: 70px;}
   .comm-padding-top{padding-top: 70px;}
   .comm-padding-bottom{padding-bottom: 70px;}
   .year-event-card h3 { font-size: 35px; margin-top: 20px; }
   .spaces-bx{gap: 0;}
   .spaces-bx figure,
   .spaces-bx div{width: 50%;}
   .spaces-bx div{padding: 0px 60px;}
   .spaces-bx div h3{font-size: 50px;}
   .spaces-bx figure{position: relative; padding-bottom: 50%; height: 470px;}
.spaces-bx figure img {width: 100%; object-fit: cover; height: 100%; position: absolute;}
.second-school-sec-cont a.btn{ margin-top: 20px; }
.blog-recent-post-wrap{padding: 25px;}
.recent-post-item-wrap{gap: 16px;}
.recent-post-img {min-width: 160px;}
.recent-post-img img{width: 100%; object-fit: cover;}
.blog-details-img{position: relative; padding-bottom: 70%;}
.blog-details-img img{width: 100%; height: 100%; object-fit: cover; position: absolute;}
.details-cont h2 { margin: 30px 0 20px; }
.blog-recent-post-wrap h3{font-size: 30px;}
.about-sec .left-about-wrap .about-logo{ right: -50px; }
.achievements-sec .slider-item .content-wrap h4{font-size: 30px;}
/* .achievements-sec .slider-wraper .ac-slider-wraper{max-width: 410px;} */
.achievements-sec .slick-prev.slick-arrow{left: -70px;}
.testimonial-card{padding: 50px 30px; }
.achievements-sec .slick-next.slick-arrow{right: -70px;}
.basic_card h3{font-size: 30px;}
/* .environment_bx_img figure:last-child{max-width: 330px;} */
.program-features-cont{padding-left: 16px;}
.ftr-menu h3, .ftr-social h3{font-size: 33px;}
.blog-details-cont h2 { margin: 40px 0 30px; }
.basic_card figure{margin-bottom: 20px;}
.captains-sec h2{margin-bottom: 50px;}
.study-language{margin-top: 20px !important;}
.study-language li{margin-bottom: 20px;}
.study-language li h4{margin-bottom: 10px;}
.key-accolades-sec .row:nth-child(odd) .key-accolades-cont{padding-left: 60px;}
.key-accolades-sec .row:nth-child(even) .key-accolades-cont{padding-left: 60px;}
.key-accolades-sec .row:nth-child(even) .key-accolades-cont{padding-right: 60px;}
.infrastructure-sec-grid { gap: 30px;}
}
@media screen and (max-width:1550px) {
    .slider-arrow ul a{width: 55px; height: 55px; font-size: 18px;}   
        .ftr-menu h3, .ftr-social h3 { font-size: 26px; }
}
@media only screen and (max-width: 1399px){
    .gallery-slider-img-item { margin: 0 5px; }
    .blog-list-item-wrap { display: flex; flex-direction: column; height: 100%; }
    .blog-list-btn { margin-top: auto; }
    .blog-list-btn a.btn { padding: 7px 15px; font-size: 14px; }
    .blog-list-sec .row .col-lg-4.col-md-6 { margin-bottom: 30px; }
    .blog-list-cont-wrap { margin: 0px 0 20px; }
    .blog-list-img { margin-bottom: 20px; }
    ul.blog-list-time-wrap li { align-items: center;margin-right: 15px; }
    ul.blog-list-time-wrap li span svg { font-size: 14px; }
    ul.blog-list-time-wrap li span { margin-right: 10px; }
    ul.blog-list-time-wrap { justify-content: flex-start; }
    .header-logo a img { max-width: 130px; }
    .main-header{padding-top: 20px;}
    .hero-banner-sec .content-wrap{padding-top: 22%;}
    .common-padding{padding-top: 80px; padding-bottom: 80px;}
   .comm-padding-top{padding-top: 80px;}
   .comm-padding-bottom{padding-bottom: 80px;}
   .slider-arrow ul a{width: 50px; height: 50px; font-size: 16px; color: var(--color-accent);}
   .spaces-bx div h3 { font-size: 40px; }
   .facilities-main-sec .heading{margin-bottom: 0px}
   .facilities-main-grid{margin-top: 40px;}
   .gallery-list-img{margin-bottom: 20px;}
   .gallery-list-img-outer h3{margin-bottom: 0px;}
   .gallery-list-sec .row .col-lg-4.col-md-6{margin-bottom: 20px;}
   .recent-post-img { min-width: 140px; }
   .recent-post-img img{ object-fit: cover;}
   .captains-sec h2 { margin-bottom: 30px; }
   .student-slider-wraper .student-card-item .content-holder h4{font-size: 25px;}
   .student-slider-wraper .student-card-item.slick-current.slick-active .content-holder p{font-size: 14px;}
   /* .achievements-sec .slider-wraper .ac-slider-wraper{max-width: 400px;} */
   .achievements-sec .slick-prev.slick-arrow{left: -60px; background-color: transparent; color: var(--color-light-green);}
   .achievements-sec .slick-next.slick-arrow{right: -60px; background-color: transparent; color: var(--color-light-green);}
   .story-grid .content-wrap h3{font-size: 25px;}
   .story-grid .content-wrap {padding: 16px;}
   .story-grid .content-wrap p{font-size: 14px;}
   .testimonial-card{padding: 50px 30px; }
   .testimonial-card figure{margin-bottom: 20px;}
   .testimonial-card figure img{width: 70px;}
   .basic_card figure{margin-bottom: 16px;}
   .testimonial-card .feedback-user{padding: 16px 20px 16px;}
   .ftr-menu ul li:not(:last-child){padding-bottom: 18px;}
   /* .environment_bx_img figure:last-child { max-width: 270px; } */
   .blog-details-cont h2 { margin: 30px 0 25px; }
   .key-accolades-sec .row:nth-child(odd) .key-accolades-cont{padding-left: 40px;}
.key-accolades-sec .row:nth-child(even) .key-accolades-cont{padding-left: 0px;}
.key-accolades-sec .row:nth-child(even) .key-accolades-cont{padding-right: 40px;}
    .infrastructure-sec-grid { gap: 20px; }
    .notice-sec .notice-wraper .notice-body{    padding: 40px 31px;}
    .notice-sec h4{padding-left: 20px; font-size: var(--f-size-XL);}
    .notice-sec .notice-list-wrap li h4:after{top: 7px;
    width: 10px;
    height: 10px;}
}
@media only screen and (max-width: 1199px){
        .header-logo a img { max-width: 100px; }
        .desktop-menu ul { gap: 30px; }
        .hero-banner-sec .content-wrap{padding-top: 22%;}
        .hero-banner-sec .floting-logo{bottom: 39px; right: 50px;}
        .facilities-tag li{font-size: 10px;}
        .blog-grid .content-wrap .blog-info{margin-bottom: 1rem;}
        .blog-grid .content-wrap .blog-info li{font-size: 14px;}
        .spaces-bx div h3 { font-size: 30px; }
        .spaces-bx div { padding: 0px 40px; }
        .heading{line-height: 1.4;}
        .achievements-sec .slider-item .content-wrap h4{font-size: 25px;}
        .basic_card h3{font-size: 20px;}
        .blog-list-time-wrap p{font-size: 14px;}
        .achievements-sec .slider-wraper .ac-slider-wraper{margin-right: 0px;}
        /* .environment_bx_img figure:last-child { max-width: 240px; } */
            .ftr-menu h3, .ftr-social h3 { font-size: 24px; margin-bottom: 30px; }
            .blog-details-sec {background-size: 80% auto;}
}
@media only screen and (max-width: 991px){
    .btn{font-size: 14px; padding: 10px 20px;}
    .common-padding{padding-top: 60px; padding-bottom: 60px;}
   .comm-padding-top{padding-top: 60px;}
   .comm-padding-bottom{padding-bottom: 60px;}
    .gallery-list-sec .row .col-lg-4.col-md-6:nth-child(5)  {width: 100%;}
    .desktop-menu ul.nav-left-menu,.desktop-menu ul.nav-right-menu{ display: none !important;}
    .desktop-menu {justify-content: center !important;}
    .hamburger-nav { display: block; top: 75px; display: block; position: fixed; top: 75px; left: 50px;}
    .header-sticky header.main-header .hamburger-nav { top: 35px; left: 20px; }
    .floting-logo {width: 90px;}
    .infrastructure-sec .right-img-wrap .img-grid-item a .content{left: 8px;}
    .infrastructure-sec .right-img-wrap .img-grid-item a .content p{gap: 8px; font-size: 10px;}
    .facilities-tag {display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
    .facilities-tag li{width:100%; display: flex; justify-content: center; align-items: center;}
    .blog-grid .content-wrap h3 {font-size: 18px; margin-bottom: 16px;}
    .test-cont-bx{width: auto;}
    .testimonial-card{padding: 40px 28px;}
   .testimonial-card .feedback-user{padding:16px; gap: 16px;}
   .about-us-sec .about-logo{max-width: 140px; margin-bottom: 20px;}
   .get-bx-card{margin-bottom: 20px; height: auto;}
   .main-form-group label{ margin-bottom: 10px;}
   input[type="text"], input[type="email"], input[type="password"], input[type="search"], input[type="tel"], input[type="url"], input[type="number"], input[type="date"], input[type="time"], input[type="datetime-local"], input[type="month"], input[type="week"], select, select.form-control { font-size: 16px; height: 60px;}
   .check-mounth-list{max-width: 100%;}
   .year-event-header{ flex-direction: column; gap: 16px; margin: 20px 0px;}
   .office-bearers-sec .basic_card,
   .captains-sec .basic_card {margin-bottom: 20px;}
   .program-section .row{ row-gap: 30px;}
   .framwork-card figure{ margin-bottom: 15px;}
   .framwork-card h3{ font-size: 24px; margin-top:0px; margin-bottom: 10px;}
   .study-language li h4{ font-size: 18px; margin-bottom: 10px;}
   .framwork-card ul li{ font-size: 14px; }
   .ftr-logo a{width: 180px;}
   .spaces-bx figure{position: relative; padding-bottom: 40%; height: auto;}
   .facilities-main-grid{margin-top: 30px;}
   .pagination li a{width: 45px; height: 45px;}
   .pagination li a span{font-size: 18px;}
   .blog-details-sec .row{row-gap: 30px;}
   ul.blog-cont-img-list{margin: 20px 0px;}
   .blog-recent-post-wrap h3{font-size: 25px;}
   .related-blog-sec .row{ row-gap: 20px; }
   .our-mission-sec h2{margin-top: 20px;}
   .key-accolades-sec .row .key-accolades-cont{padding-inline: 0px !important; padding-top: 50px !important;}
   .about-sec .right-about-wrap .img-holder{margin-top: 25px;}
   .student-slider-wraper .student-card-item .content-holder h4 { font-size: 20px; }
   .achievements-sec .slider-item .content-wrap p{font-size: 14px;}
   .story-grid .content-wrap h3{font-size: 20px;}
   .ftr-btm .term-list-wrap ul{justify-content: center;}
   .copyright-wrap{text-align: center; margin-bottom: 10px;}
   .program-features-cont{padding-left: 0px;}
   .ftr-menu h3, .ftr-social h3{margin-bottom: 20px; margin-top: 25px;}
   .slick-prev, .slick-next{width: 50px; height: 50px; font-size: 18px;}
   .basic_card h3{margin-bottom: 5px;}
   /* .environment_bx_img figure:last-child { max-width: 350px; } */
   .blog-details-cont h2 { margin: 18px 0 16px; } .infrastructure-sec-grid { gap: 16px; }
   .sci_park_activity_row .basic_card h3{font-size: var(--f-size-XL);}
}

@media only screen and (max-width: 991px) and (min-width: 576px){
   
}
@media only screen and (max-width: 767px){
    .common-padding{padding-top: 30px; padding-bottom: 30px;}
   .comm-padding-top{padding-top: 30px;}
   .comm-padding-bottom{padding-bottom: 30px;}
   .hero-banner-sec .content-wrap{padding:180px 20px 180px;}
   .left-img-pannel{padding-right: 50px;}
   .about-sec .left-about-wrap .about-logo{right: 0px;}
   .about-sec .right-about-wrap .wrap-holder{max-width:100%; margin-top: 30px; padding: 0px;}
   .blog-sec .slide-heading{margin-bottom: 20px; flex-wrap: wrap;}
   .blog-grid{margin-bottom: 20px;}
   .contact-sec .info-wrap{margin-top: 30px;}
   .contact-sec .contact-info .floting-img{z-index: -1;}
   .slider-arrow ul a{width: 45px; height: 45px; font-size: 14px;}
   /* .slick-slide img{max-width: 70px;} */
   .story-grid .content-wrap{opacity: 1; visibility: visible;}
   .notice-sec .notice-wraper .notice-body{padding: 40px;}
   .about-us-sec .about-logo{max-width: 120px;}
   .main-form-group label{ font-size:16px;}
      input[type="text"], input[type="email"], input[type="password"], input[type="search"], input[type="tel"], input[type="url"], input[type="number"], input[type="date"], input[type="time"], input[type="datetime-local"], input[type="month"], input[type="week"], select, select.form-control { font-size: 14px; height: 50px;}
      .check-mounth-list{width: 100%;}
      .year-event-card h3 { font-size: 28px; margin-top: 20px; margin-bottom: 10px;}
      .check-mounth-list{flex-wrap: nowrap; overflow-x: auto;   scrollbar-width: none; scrollbar-color: transparent transparent;}
      .year-event-card{margin-top:20px;}
      .year-event-card p{font-size: 16px;}
      .ftr-menu h3, .ftr-social h3{margin-bottom: 20px; margin-top: 10px;}
      .ftr-social{margin-top: 20px;}
      .ftr-logo{margin-bottom: 20px;}
      .ftr-logo a{width: 120px;}
      .main-ftr{padding: 40px 20px;}
      .ftr-btm{padding-bottom: 10px;}
      .spaces-bx{flex-direction: column !important;}
      .spaces-bx div, .spaces-bx figure{ width: 100%; }
      .spaces-bx figure{margin-bottom: 20px !important;}
       .spaces-bx div{ padding: 0px; padding-bottom: 30px; }
       .blog-recent-post-wrap{margin-bottom: 0px; padding-bottom: 0px;}
       /* .environment_bx_img figure:last-child { max-width: 50%; } */
      /* ===== Base container ===== */

/* Firefox: show thin scrollbar on hover */
.check-mounth-list:hover { scrollbar-width: thin; scrollbar-color: #888 transparent; }

/* Chrome, Edge, Safari: hide scrollbar */
.check-mounth-list::-webkit-scrollbar { width: 0; height: 0; }

/* Show small scrollbar on hover */
.check-mounth-list:hover::-webkit-scrollbar { width: 6px;   /* vertical */ height: 6px;  /* horizontal */ }

/* Thumb (draggable part) */
.check-mounth-list:hover::-webkit-scrollbar-thumb { background: #888; border-radius: 6px; }

/* Track (background) */
.check-mounth-list:hover::-webkit-scrollbar-track { background: transparent; }
.study-language li{margin-bottom: 20px;}
   .pagination li a{width: 30px; height: 30px; font-size: 16px;}
.pagination li a span{font-size: 16px;}
.year-event-header{ flex-direction: column; gap: 0px; margin: 20px 0px;}
.year-event-bx .event-bg-img{width: 100%;}
/* .infrastructure-sec .right-img-wrap .img-grid .img-grid-item{margin-bottom: 0px; margin-top: 20px;} */
.infrastructure-sec .right-img-wrap .img-grid-item a .img-holder{padding-bottom: 50%;}
.infrastructure-sec .right-img-wrap .img-grid:last-child{margin-top: 0px;}
.infrastructure-sec .right-img-wrap .img-grid-item a .content p{font-size: 16px;}
.studentlife-sec .logo-wrap { max-width: 110px; margin-bottom: 20px; }
.studentlife-sec .left-content-wrap .content-wrap{margin-bottom: 30px;}
.student-slider-wraper .student-card-item .img-holder { padding-bottom: 120%; }
.notice-wraper{margin-top: 30px;}
.achievements-sec .slider-wraper .ac-slider-wraper{margin: 30px auto;}
.captains-sec{padding-bottom: 60px;}
.basic_card h3{font-size: 18px;}
.slick-dots{position:static; padding: 0px 20px;}
.blog-details-cont h2 { margin: 20px 0 10px; }
.testimonial-sec .testimonial-sec-bx{margin-bottom: 20px; justify-content: center;}
.infrastructure-sec .left-content-wrap .floting-logo{transform: translateX(-50%);
    left: 50%;}
    .infrastructure-sec .left-content-wrap .left-holder{margin-bottom: 20px;}
    .infrastructure-sec-grid { gap: 20px; grid-template-columns: 1fr;}
    .right_sl_img{width: 100%;}
    .list-check li.time{padding-left: 30px;}
    .office-hours-sec .list-check{flex-direction: column; gap: 10px; margin-bottom: 20px;}
    .list-check li.time::before{width: 19.15px; min-width: 19.15px; height: 19.15px; top: 7px;}
    .list-check li.time::after{width: 10.5px; min-width: 10.5px; height: 10.5px; top: 11px; left: 4px;}
    .infrastructure-sec-grid{grid-template-columns: repeat(2, 1fr);}
    .infrastructure-sec-grid .img-grid { order: 2; }
    .infa_hdn_bx { padding-bottom:0px; position: relative; order: 1; grid-column: span 2 / span 2;}
    .infa_hdn_bx h2{position: relative; transform: none !important; top: auto; left:auto; margin-bottom: 10px;}
}
@media only screen and (max-width: 575px){
    .header-logo a img { max-width: 80px; }
        .main-header { padding-top: 10px; }
        .hamburger-nav { top: 55px; left: 10px; }
        .story-grid .content-wrap h3{font-size: 22px;}
        .story-grid .content-wrap p{font-size: 14px;}
        .notice-sec .notice-wraper .notice-body{padding: 30px;}
        .get-bx-card{padding: 30px; gap: 10px;}
        .main-form [type="submit"]{padding: 15px; font-size: 16px;}
        .framework-section .row{ row-gap: 30px;}
        .spaces-bx div h3 { font-size: 28px; margin-bottom: 10px; }
        .recent-post-img { min-width: 110px; max-width: 110px; }
        .recent-post-cont a.btn { padding: 7px 14px; font-size: 14px; }
        .blog-recent-post-wrap { padding: 20px; }
        ul.blog-list-time-wrap p, ul.blog-list-time-wrap li p{font-size: 14px;}
        .captains-sec h2 { margin-bottom: 25px; }
        .student-slider-wraper .slick-list{overflow: hidden;}
        .main-form-group .wpcf7-spinner{top: 36px;}
        .blog-recent-post-wrap h5 {font-size: 18px}
        .heading{text-align: center;}
        .ftr-logo{max-width: none; display: flex; justify-content: center;}
        .ftr-logo-wrap p{max-width: none;}
        .ftr-logo-wrap,.ftr-menu{text-align: center;}
        .address_list li a{justify-content: center; flex-direction: column; gap: 10px; }
        .ftr-social ul{justify-content: center;}
        .studentlife-sec .left-content-wrap .content-wrap{display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center;}
        .infrastructure-sec .left-content-wrap .left-holder,.achievements-sec .content-holder{text-align: center;}
        .achievements-sec .content-holder{margin-bottom: 0px;}
        .slider-arrow{display: none;}
        .testimonial-card{text-align: center;}
        .feedback-user{justify-content: center;}
         .testimonial-card figure{display: flex; justify-content: center;}
        .blog-sec .slide-heading{flex-direction: column; justify-content: center; align-items: center; text-align: center; margin-bottom: 30px;}
        .blog-sec .slide-heading .heading{text-align: center !important; margin-bottom: 16px;}
        .infrastructure-sec-grid { grid-template-columns: repeat(1, 1fr); gap: 10px;}
        .infa_hdn_bx { grid-column:span 1;}
        .gallery-img-slider-wrap .gallery-slider-img{ margin-bottom: 20px; }
        .slick-prev, .slick-next { width: 40px; height: 40px;}
}
/* HOME PAGE END HERE ********************/
/* HOME PAGE END HERE ********************/
.no-banner .main-header,.error404 .main-header{position: relative; width: 100%; background:var(--color-accent); padding: 14px 0px;}
.no-banner .main-header .header-logo a img,.error404 .main-header .header-logo a img {width: 100px;}
.no-banner.header-sticky .main-header, .error404.header-sticky .main-header {position: fixed; padding: 14px 0px; background-color: #021f428e !important;}
.common-pg-sec h1{font-size: var(--f-size-XXL); color: var(--color-accent);}