@font-face {
    font-family: 'ge_dinar_onelight';
    src: url('../fonts/arbfonts-ge_dinar_one_light.woff2') format('woff2'),
         url('../fonts/arbfonts-ge_dinar_one_light.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'ge_dinar_onemedium';
    src: url('../fonts/arbfonts-ge_dinar_one_medium.woff2') format('woff2'),
         url('../fonts/arbfonts-ge_dinar_one_medium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

:root {

  --white: #ffffff; 

  --black: #000000;

  --grey: #f8f8f8;

  --primary-color: #16254c;

  --secondary-color: #cfb78b;

  --dark-golden: #685326;

  --light-blue: #e0f5ff;

  --dark-blue: #01052b;

}





/* @font-face {

    font-family: 'goldenregular';

    src: url('../fonts/golden.woff2') format('woff2'),

         url('../fonts/golden.woff') format('woff');

    font-weight: normal;

    font-style: normal;

    font-display: swap;

}



@font-face {

    font-family: 'nocturnalregular';

    src: url('../fonts/nocturnal-regular.woff2') format('woff2'),

         url('../fonts/nocturnal-regular.woff') format('woff');

    font-weight: normal;

    font-style: normal;

    font-display: swap;

}



@font-face {

    font-family: 'nocturnallight';

    src: url('../fonts/nocturnal-light.woff2') format('woff2'),

         url('../fonts/nocturnal-light.woff') format('woff');

    font-weight: normal;

    font-style: normal;

    font-display: swap;

} */





* { box-sizing: border-box;}

html, body { margin: 0;	padding: 0;	border: 0; vertical-align: baseline; font-family: "Montserrat", sans-serif; font-optical-sizing: auto; font-style: normal; font-weight: 400; line-height:1.3; list-style: none; color:var(--black); font-size: 20px; background: url(../img/body-bg.webp) repeat left top;}

a:focus,button:focus,input:focus,textarea:focus { outline:0; text-decoration:none;}

h1,h2,h3,h4,h5,h6 { margin:0; padding:0; -webkit-font-smoothing:antialiased; margin-bottom:15px; color:var(--black); line-height: 1.1; font-family: "Montserrat", sans-serif;}

h1 { font-size: 65px; font-weight: normal; font-weight: 700;}

h2 { font-size: 55px; color: #16254c; font-weight: 700;}

h3 { font-size: 28px; font-weight: 700;}

h4 { font-size:16px;}

a { color:#018aff; text-decoration:none; transition:all ease-out .3s; -webkit-transition:all ease-out .3s; -moz-transition:all ease-out .3s;-ms-transition:all ease-out .3s; -o-transition:all ease-out .3s;  word-break: break-all;}

a:hover { text-decoration:none;color:#3b90ff;}

label { font-weight:400;margin:0;}

p { font-size: 16px; line-height: 1.4; color: var(--black); margin:0; padding:0; font-weight: 400; margin-bottom:15px;}

li,ol,ul { list-style:none; margin:0; padding:0;}

focus { outline:0;}



/* ==========================================================================

   Commen Style Begin

   ========================================================================== */

::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: #787878;}

::-moz-placeholder { /* Firefox 19+ */ color: #787878;}

:-ms-input-placeholder { /* IE 10+ */ color: #787878;}

:-moz-placeholder { /* Firefox 18- */ color: #787878;}



.primary-btn { display: inline-block; position: relative; border: none; background: var(--secondary-color); color: var(--black); padding: 17px 40px; border-radius: 30px; font-size: 16px; font-weight: 400; overflow: hidden; line-height: 1.1;}

.primary-btn::before { content: ''; width: 0; height: 100%; display: block; position: absolute; top: 0; right: 0; left: 0; margin: auto; background: #00000027; transition: all ease-out 0.3s;}

.primary-btn span { color: var(--white); position: relative; z-index: 2;}

.primary-btn:hover { background: var(--primary-color); color: var(--white);}

.primary-btn:hover::before { width: 100%;}



.line-btn { display: inline-block; border-radius: 30px; border: 1px solid #ffffff; color: #ffffff; padding: 14px 30px; line-height: 1.1; font-weight: 400;}

.line-btn:hover { background: #ffffff; color: #16254c;}



section { display: block; padding: 75px 0;}

.white-text h1,

.white-text h2,

.white-text h3,

.white-text h4,

.white-text h5,

.white-text h6,

.white-text p,

.white-text span,

.white-text ul li { color: var(--white);}



.bg-grey { background: var(--grey) !important;}

.bg-black { background: var(--black) !important;}



.owl-carousel .owl-item img { width: auto;}

.owl-carousel .owl-stage { display: flex;}

.owl-carousel .owl-nav { width: 100%; height: 1px; position: absolute; left: 0; top: 0; bottom: 0; margin: auto; display: flex; align-items: center; justify-content: space-between;}

.owl-carousel .owl-nav button { font-size: 24px; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 100%; background: #0000007d !important; transition: all ease-out 0.3s;}

.owl-carousel .owl-nav button span { font-size: 20px; color: #ffffff;}

.owl-carousel .owl-nav button:hover { background: #000000ec !important;}

/* ==========================================================================

   Commen Style End

   ========================================================================== */



.home-page { display: block; background: url(../img/body-bg.webp) repeat left top; position: relative;}



.header { display: block; width: 100%; height: auto; position: absolute; left: 0; top: 0; z-index: 99; padding: 20px 0;}

.header .container {  position: relative;}

.logo { display: block;}

.logo a { display: block;}

.logo a img { display: block;}



.top-menu { display: block; position: relative;}

.top-menu-toggle { display: flex; align-items: center; position: relative; background: none; border: none; color: #ffffff; font-weight: 400; padding: 0;}

.top-menu-toggle .top-menu-tog-icon { display: flex; align-items: center; justify-content: center; width: 46px; height: 46px; box-sizing: border-box; border: 1px solid #ffffff; border-radius: 100%; background: none; padding: 0; margin-left: 20px; transition: all ease-out 0.3s;}

.top-menu-toggle .top-menu-tog-icon i { color: var(--white); font-size: 20px; line-height: 1;}

.top-menu-toggle:hover .top-menu-tog-icon { background: var(--secondary-color);}

.top-menu-toggle:hover .top-menu-tog-icon i { color: var(--primary-color);}

.top-menu ul { display: block; position: absolute; right: 0; top: 30px; padding: 25px 0 0 0; transition: all ease-out 0.3s; transform: translateX(-10px); pointer-events: none; opacity: 0; width: 175px;}

.top-menu ul li { display: block; position: relative;}

.top-menu ul li a { display: block; color: var(--white); font-size: 16px; text-align: right; padding: 15px 0; padding-right: 60px; position: relative;}

.top-menu ul li a i { width: 45px; height: 45px; display: flex; justify-content: center; align-items: center; background: var(--secondary-color); color: var(--primary-color); border-radius: 100%; position: absolute; right: 0; top: 3px; font-weight: 400; border: 1px solid #ffffff; transition: all ease-out 0.3s; font-size: 16px;}

.top-menu ul li a:hover i { background: var(--primary-color); color: var(--white);}

/* .top-menu:hover ul { opacity: 1; transform: translateX(0px); pointer-events: all;} */

@media (min-width: 991px) {

   .top-menu:hover ul { opacity: 1; transform: translateX(0px); pointer-events: all;}

}



.top-menu ul.expand { opacity: 1; transform: translateX(0px); pointer-events: all;}

.top-menu-toggle.active .top-menu-tog-icon { background: var(--secondary-color);}

.top-menu-toggle.active .top-menu-tog-icon i { color: var(--primary-color);}





.portal-click { display: block; position: relative; z-index: 99999999; margin-right: 25px;}

.portal-click .bottom-menu { display: block; position: relative;}

.bottom-menu-toggle { display: flex; align-items: center; position: relative; background: none; border: none; color: var(--black); font-weight: 400; padding: 0; -webkit-border-radius: 40px; -moz-border-radius: 40px; border-radius: 40px; padding: 3px 20px 3px 3px; background-color: #cfb78bc2; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); font-size: 16px;}

.menu-hide .bottom-menu-toggle {background-color: inherit;}

.menu-show .bottom-menu-toggle {background-color: inherit;backdrop-filter:inherit}

.menu-show .bottom-menu-toggle, .menu-hide .bottom-menu-toggle{padding: 3px;}

.menu-show .bottom-menu-toggle .bottom-menu-tog-icon, .menu-hide .bottom-menu-toggle .bottom-menu-tog-icon{margin: 0px;}



.bottom-menu-toggle .bottom-menu-tog-icon { display: flex; align-items: center; justify-content: center; width: 46px; height: 46px; box-sizing: border-box; border: 1px solid var(--white); border-radius: 100%; background: none; padding: 0;  transition: all ease-out 0.3s; margin-right:15px;}

.bottom-menu-toggle .bottom-menu-tog-icon i { color: var(--black); font-size: 20px; line-height: 1;}

.menu-show .bottom-menu-toggle{background-color: inherit;}



.bottom-menu-toggle:hover .bottom-menu-tog-icon { background: var(--secondary-color);}

.bottom-menu-toggle:hover .bottom-menu-tog-icon i { color: var(--primary-color);}

.portal-click ul { display: block; position: absolute; right: 0; top: 50px; padding: 0 0 20px 0; transition: all ease-out 0.3s; transform: translateX(-10px); pointer-events: none; opacity: 0; background: #264729ba;

 border-radius: 12px; padding: 10px 10px 21px 10px; width: 220px; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);}

.portal-click ul li { display: block; position: relative;}

.portal-click ul li a { display: block; color: var(--white); font-size: 16px; text-align: left; padding: 15px 10px; padding-left: 60px; position: relative;}

.portal-click ul li a i { width: 45px; height: 45px; display: flex; justify-content: center; align-items: center; background: var(--secondary-color); color: var(--primary-color); border-radius: 100%; position: absolute; left: 0; top: 3px; font-weight: 400; border: 1px solid #ffffff; transition: all ease-out 0.3s; font-size: 16px;}

.portal-click ul li a:hover i { background: var(--primary-color); color: var(--white);}

/* .top-menu:hover ul { opacity: 1; transform: translateX(0px); pointer-events: all;} */

@media (min-width: 991px) {

   .portal-click:hover ul { opacity: 1; transform: translateX(0px); pointer-events: all;}

}



.portal-click ul.expand { opacity: 1; transform: translateX(0px); pointer-events: all;}

.bottom-menu-toggle.active .bottom-menu-tog-icon { background: var(--secondary-color);}

.bottom-menu-toggle.active .bottom-menu-tog-icon i { color: var(--primary-color);}













/* ==========================================================================

   Menu with dropdown menu begin

   ========================================================================== */

.mega-drop { border-top: none; position: absolute; width: 100%; top: 101px; left: 0; display: block; opacity: 0; pointer-events: none; /*overflow: hidden;*/ transition:all ease 0.3s; transform: scale(0.96); text-align: left; padding: 45px 0; box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.144); background: var(--white); z-index: 9; background: rgba(255, 255, 255, 0.808); backdrop-filter: blur(13px);}

.mega-drop.expand { opacity: 1; pointer-events: auto; transform: scale(1); z-index: 9;}

.mega-drop-main { display: block; overflow: hidden;}



.main-menu { display:block;}

.main-menu h3 { font-size: 30px; color: var(--dark-golden);}

.main-menu ul { display:block;}

.main-menu ul li { display: block; margin-bottom: 5px;}

.main-menu ul li a { color: var(--black); display: block; font-size: 18px; position: relative; line-height: 1.1; font-weight: 400; padding: 2px 0; padding-left: 20px;}

.main-menu ul li a::before { content: ''; width: 5px; height: 5px; display: block; background: var(--dark-golden); position: absolute; left: 0; top: 7px;}

.main-menu ul li:hover a, .main-menu ul li.active a { color: var(--dark-golden);}



/*======================================== Menu Style End =======================================*/

.menu-toggle { display:flex; align-items: center; justify-content: space-between; max-width: 130px; box-sizing:border-box; border: none; background: none; padding: 0; position: absolute; right: 0; top: -13px; color: var(--white);}

.menu-toggle-icon { display:block; width:46px; height:46px; box-sizing:border-box; border: 1px solid #ffffff; border-radius: 100%; background: none; padding: 0; margin-right: 20px; padding: 17px 11px; text-align: left; position: relative;}

.menu-toggle-icon span.line { position:relative; width:100%; height:1px; background: var(--white); display:block; transition:all ease .3s; -webkit-transition:all ease .3s; -moz-transition:all ease .3s; -o-transition:all ease .3s; -ms-transition:all ease .3s}

.menu-toggle-icon span.line.b { width: 50%; margin-top: 5px;}

.menu-toggle.active .menu-toggle-icon span.line { position:absolute; top:0; right: 0; bottom: 0; left:0; margin: auto; transform-origin:center center; width: 50%;}

.menu-toggle.active .menu-toggle-icon span.line.a { transform:rotate(45deg)}

.menu-toggle.active .menu-toggle-icon span.line.b { transform:rotate(-45deg);}

/*======================================== Menu Style End =======================================*/



/* ==========================================================================

  Menu with dropdown menu End

  ========================================================================== */



/* .banner-block { height: 100vh; width: 100%; top: 0; left: 0; position: relative; overflow: hidden;} */

.banner-padding-bottom { padding-bottom: 150px;}

.banner-block { display: block; width: 100%; height: auto; position: relative; overflow: hidden;}

.banner-block video { margin: 0px; padding: 0px; bottom: 0; height: 100%; display: block; width: 100%; object-fit: cover;}

.banner-cont-block { display: flex; align-items: center; width: 100%; height: 100%; position: absolute; left: 0; top: 0; padding: 100px 0;}

.banner-cont-block h1 { font-size: 60px;}

.banner-cont-block .primary-btn { font-size: 18px;}



.border-devider { width: 35px; display: block; height: 155px; position: absolute; left: 0; bottom: -180px; right: 0; margin: auto; border-top: 1px solid #737989; z-index: 99;}

.border-devider::after { content: ''; width: 32px; height: 32px; display: block; position: absolute; left: 0; bottom: -20px; right: 0; margin: auto; background: url(../img/diamond-icon.svg) no-repeat center center; background-size: 32px;}

.border-devider span { display: block; width: 1px; height: 50%; position: absolute; left: 0; right: 0; margin: auto; border-left: 1px dotted #ffffff;}

.border-devider .dev-before { top: 0;}

.border-devider .dev-after { bottom: 0; border-color: #000000;}

.border-devider.devider2 .dev-before { border-color: #000000;}

.border-devider.devider2 .dev-after { border-color: #ffffff;}



.why-us-block { display: block; background: #161F3A; background: linear-gradient(0deg, rgba(22, 31, 58, 1) 25%, rgba(38, 71, 41, 1) 97%); padding-top: 0; position: relative;}

.why-us-block::before { content: ''; width: 100%; height: 112px; display: block; background: url(../img/why-us-curve.svg) no-repeat center top; background-size: 100%; position: absolute; left: 0; bottom: -107px;}

.why-us-block .container { position: relative; z-index: 2;}

.why-us-top { display: block; max-width: 975px; margin: auto;}

.why-us-top h3 { font-size: 36px; font-weight: 600; margin-bottom: 30px;}

.why-us-top p { font-size: 24px; font-weight: 300; line-height: 1.5;}

.world-school { display: inline-block; overflow: hidden;}





.flipchar {

  display: inline-block;

  animation: mirrorflip 8s 0s linear infinite;

}



@keyframes mirrorflip {

	0% {

		transform: scale(1, 1);

		-webkit-transform: scale(1, 1);

		-moz-transform: scale(1, 1);

		-o-transform: scale(1, 1);

		-ms-transform: scale(1, 1);

		

	}

	50% {

		transform: scale(-1, 1);

		-webkit-transform: scale(-1, 1);

		-moz-transform: scale(-1, 1);

		-o-transform: scale(-1, 1);

		-ms-transform: scale(-1, 1);

	}

	100% {

		transform: scale(1, 1);

		-webkit-transform: scale(1, 1);

		-moz-transform: scale(1, 1);

		-o-transform: scale(1, 1);

		-ms-transform: scale(1, 1);

	}

}



.why-us-top-second { display: block; max-width: 930px; margin: auto;}

.home-stats { display: flex; flex-direction: column;}

.home-stats .icon { display: flex; justify-content: center; align-items: center; min-height: 75px; margin-bottom: 25px;}

.home-stats .content { display: flex; flex-wrap: wrap; justify-content: center;}

.home-stats .content h4 { font-size: 40px; font-weight: 700; margin-right: 20px;}

.home-stats .content p { font-size: 20px; line-height: 1.2;}



.classroom-srtd-exp-block { display: block; position: relative; padding: 250px 0 0 0;}

.classroom-srtd-exp-block::before { content: ''; width: 45%; height: 75%; display: block; position: absolute; right: 0; top: 0;  background: url(../img/classroom-srtd-before.webp) no-repeat right top; background-size: 100%;}

.classroom-srtd-exp-block::after { content: ''; width: 45%; height: 75%; display: block; position: absolute; left: 0; bottom: 0;  background: url(../img/classroom-srtd-after.webp) no-repeat left bottom; background-size: 100%;}

.classroom-srtd-exp-block .border-devider { bottom: 26px; height: 120px;}

span.dotted-round { display: block; width: 100%; height: 100%; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; z-index: 1; overflow: hidden; opacity: 0.6;}

span.dotted-round::before { content: ''; width: 100%; height: 50%; display: block; position: absolute; top: 185px; left: 0; background: url(../img/dotted-round-top.svg) no-repeat center top; background-size: cover;}

span.dotted-round::after { content: ''; width: 100%; height: 50%; display: block; position: absolute; bottom: 200px; left: 0; background: url(../img/dotted-round-bottom.svg) no-repeat center top; background-size: cover;}



.classroom-block { display: block; position: relative; z-index: 3; padding-bottom: 200px; position: relative;}

.classroom-block .container { max-width: 1500px}

.classroom-card { display: block;}

.classroom-card-image { display: block;}

.classroom-card-image img { display: block;}

.classroom-card-body { display: block; padding-top: 45px;}

.classroom-card-body h3 { color: var(--dark-golden); font-weight: 700;}

.classroom-block .border-devider { z-index: 99;}



.home-classroom-block { display: block; padding-top: 30px; position: relative; z-index: 3; background: #24452A; background: linear-gradient(180deg,rgba(36, 69, 42, 1) 25%, rgba(36, 69, 42, 0) 87%);padding-bottom: 250px; position: relative;}

.home-classroom-block::before { content: ''; width: 100%; height: 112px; display: block; background: url(../img/why-us-curve-green.svg) no-repeat center top; background-size: 100%; position: absolute; left: 0; top: -107px; transform: rotate(180deg);}



.home-classroom-block h2 { color: var(--white);}

.experiences-card { display: block; padding: 40px; position: relative;}

.experiences-card-front { display: block; position: relative;display: flex; align-items: center;justify-content: center;}

.experiences-card-image { display: flex; align-items: flex-end; justify-content: center; position: relative; height: auto; background: var(--grey);}

.experiences-card-image img { display: block;}

.experiences-card-body { display: block; background: #ffffffd9; position: absolute; left: 0; bottom: 25px; right: 0; margin: auto; width: 80%; height: auto; text-align: center; padding: 15px; border-radius: 10px; transition: all ease-out 0.5s;}

.experiences-card-body h3 { font-size: 20px; color: var(--primary-color); margin-bottom: 0px;}

.experiences-card-body p { font-size: 16px; margin-bottom: 0; color: var(--dark-golden);}

.experiences-card .frame { display: block; width: 0; height: 0; border: 1px solid var(--primary-color); position: absolute; transition: all ease-out 0.8s; opacity: 0;}

.experiences-card .frame.top { border-color: var(--white) transparent transparent var(--white); left: 5px; top: 5px;}

.experiences-card .frame.bottom { border-color: transparent var(--white) var(--white) transparent; right: 5px; bottom: 5px;}



.student-experiences-slider .center .frame { opacity: 1; width: 55px; height: 55px;}

.student-experiences-slider .center .experiences-card-body { background: #16254cd2;}

.student-experiences-slider .center .experiences-card-body h3 { color: var(--white);}

.student-experiences-slider .center .experiences-card-body p { color: var(--secondary-color);}

.student-experiences-slider .center .experiences-card-image { background: var(--secondary-color);}



.experiences-card-back { display: flex; flex-direction: column; justify-content: space-between; width: 95%; height: 95%; padding: 20px; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; background: #16254cea; padding: 30px; text-align: center; overflow: hidden; opacity: 0; transition: all ease-out 0.5s;}

.experiences-hover-top { display: block; padding: 35px 0; position: relative;}

.experiences-hover-top::before { content: '"'; width: 20px; height: 20px; display: block; position: absolute; left: 0; top: 0; font-size: 55px; color: var(--secondary-color); line-height: 1;}

.experiences-hover-top::after { content: '"'; width: 20px; height: 20px; display: block; position: absolute; right: 0; bottom: 20px; font-size: 55px; color: var(--secondary-color); line-height: 1;}

.experiences-hover-top p { font-size: 18px; color: var(--white); margin-bottom: 0; display: -webkit-box; -webkit-line-clamp: 5; line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis;}

.experiences-hover-bottom { display: block; padding: 25px 0 25px 0; position: absolute; bottom: 0; right: 0; left: 0;}

.experiences-hover-bottom p { color: var(--secondary-color); font-size: 18px;}

.experiences-hover-bottom p span { display: block; color: var(--white); font-size: 20px;}





.owl-dots { display: flex; align-items: center; justify-content: center;}

.owl-dots .owl-dot { width: 5px; height: 5px; display: block; background: var(--white) !important; border-radius: 100%; margin: 0 6px;}

.owl-dots .owl-dot.active { background: var(--secondary-color) !important;}



.event-update-block { display: block; position: relative; padding: 50px 0; background: url(../img/event-update-bg.webp) repeat left top #16254cef; z-index: 3;}

.event-update-block .container-fluid { position: relative; z-index: 2;}

.event-update-block::before { content: ''; width: 100%; height: 87px; display: block; background: url(../img/blue-curve-bottom.webp) no-repeat center bottom; background-size: 100%; position: absolute; left: 0; top: -85px;}

.event-update-block::after { content: ''; width: 100%; height: 87px; display: block; background: url(../img/blue-curve-top.webp) no-repeat center top; background-size: 100%; position: absolute; left: 0; bottom: -85px;}

.event-update-block .border-devider { bottom: -144px; height: 120px;}

.student-exper-box { display: block; position: relative;}

.event-box { display: inline-block; position: relative; z-index: 2; border: 1px solid #796e58;}

/* .event-box::before { content: ''; width: 100%; height: 100%; display: block; position: absolute; left: 0; bottom: 0; right: 0; margin: auto; background: #000000; background: linear-gradient(0deg, rgba(0, 0, 0, 0.72) 18%, rgba(214, 203, 178, 0) 90%);} */

.event-box-body { display: block; position: absolute; left: 0; bottom: 0; padding: 30px; z-index: 3;}

.event-box-body p { margin-bottom: 0; font-size: 22px; font-weight: 300;}

.event-box-body p span { display: block; font-size: 30px;}

.event-box .more-btn { width: 42px; height: 42px; display: block; position: absolute; right: -20px; bottom: -20px; background: var(--secondary-color); border-radius: 100%;}

.event-box .more-btn::before { content: ''; width: 45%; height: 1px; display: block; background: var(--primary-color); position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto;}

.event-box .more-btn::after { content: ''; width: 1px; height: 45%; display: block; background: var(--primary-color); position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto;}

.event-box:hover .more-btn { background: var(--white);}

.event-box:hover::before { background:rgba(0, 0, 0, 0.76)0;}

.event-update-slider .owl-item { padding-bottom: 25px;}

/* .event-update-slider .owl-item:nth-child(even) .student-exper-box { margin-top: 85px;} */

.event-update-slider .owl-dots { padding-top: 20px;}



.home-partners-block { display: block; padding: 200px 0; position: relative;}

.our-partner-box { display: flex; align-items: center; justify-content: center;}

.home-partners-block .border-devider { bottom: 25px; height: 120px;}



.footer-block { display: block; background: url(../img/event-update-bg.webp) repeat left top #16254cef; position: relative;}

.footer-block::before { content: ''; width: 100%; height: 87px; display: block; background: url(../img/blue-curve-bottom.webp) no-repeat center bottom; background-size: 100%; position: absolute; left: 0; top: -85px;}

.footer-top-block { display: block; position: relative; z-index: 2; padding-top: 50px;}

.footer-left { display: block;}

.footer-about { display: block; position: relative; padding-left: 110px; margin-bottom: 60px;}

.footer-about .footer-logo { display: inline-block; position: absolute; left: 0; top: 0;}

.footer-about p { font-size: 22px;}



.footer-contact { display: flex; align-items: center; flex-wrap: wrap; margin-bottom:60px;}

.footer-contact a { display: inline-flex; align-items: center; padding-left: 35px; position: relative; color: var(--white); margin-right: 40px; padding-bottom: 10px; text-transform: uppercase; font-size: 18px;margin-bottom: 25px;}

.footer-contact a i { display: inline-block; position: absolute; left: 0; top: 2px; font-size: 18px;}

.footer-contact a::before { content: ''; width: 100%; height: 1px; display: block; background: var(--white); position: absolute; left: 0; bottom: 0; transition: all ease-out 0.3s;}

.footer-contact a:hover { color: var(--secondary-color);}

.footer-contact a:hover::before { background: var(--secondary-color);}



.footer-address-block { display: block;}

.footer-cognita { display: flex; align-items: center; flex-wrap: wrap;}

.footer-address { display: block;}

.footer-address ul { display: block;}

.footer-address ul li { display: block; position: relative; font-size: 20px; padding-left: 37px; margin-bottom: 25px;}

.footer-address ul li i { display: inline-block; position: absolute; left: 0; top: 5px; font-size: 18px;}

.footer-address ul li:last-child { margin-bottom: 0;}



.footer-top-btns { display: flex; flex-wrap: wrap; align-items: center; margin-bottom: 60px;}

.footer-top-btns a { margin-right: 30px;}

.footer-top-btns a:last-child { margin-left: 0;}



.accordion-style1 .accordion-box .accordion-item { background: none; color: #ffffff; border: none; border-radius: 0; border-bottom: 1px solid #596584; padding: 14px 0; padding-right: 35px; position: relative; cursor: pointer;}

.accordion-style1 .accordion-box .accordion-item i { font-size: 10px; width: 23px; height: 23px; display: flex; align-items: center; justify-content: center; border-radius: 100%; border: 1px solid #586483; color: #ffffff; position: absolute; right: 0; top: 13px;}

.accordion-style1 .accordion-box .accordion-item.open i { transform: rotate(180deg);}

.accordion-style1 .accordion-box .data { display: none;}

.accordion-style1 .accordion-box .data p { color: #ffffff;}



.footer-menu { display: block; padding: 18px 0;}

.footer-menu ul li { display: block; margin-bottom: 5px;}

.footer-menu ul li a { font-size: 17px; color: #d4daeb; padding-left: 25px; position: relative;}

.footer-menu ul li a::before { content: ''; width: 11px; height: 11px; display: block; background: url(../img/diamond-icon.svg) no-repeat left top; background-size: 11px; position: absolute; left: 0; top: 2px;}

.footer-menu ul li a:hover { color: var(--secondary-color);}



.footer-bottom-block { display: block; border-top: 1px solid #596584; padding: 28px 0; position: relative; z-index: 2;}

.footer-bottom-block .container { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap;}

.footer-bottom-block .container p { margin-bottom: 0; font-size: 16px; color: #d4daeb;}

.footer-social { display: flex; align-items: center; flex-wrap: wrap;}

.footer-social a { display: inline-block; font-size: 18px; margin-right: 25px; color: var(--white);}

.footer-social a:hover { color: var(--secondary-color);}



/* ============================================================

   Sub Pages Begin

   ============================================================ */

.padding-style1 { padding: 90px 0 130px;}

.inner-page h1 { font-size: 55px;}

.inner-page h2 { font-size: 38px; margin-bottom: 20px;}

.inner-page p { line-height: 1.5; margin-bottom: 20px;}



.sub-banner-block { display: block; min-height: 605px; background-repeat: no-repeat !important; background-position: center top !important; background-size: cover !important; padding-top: 105px !important; position: relative;}

.sub-banner-block .container { display: flex;  min-height: 380px !important; position: relative; flex-direction: column; justify-content: center;}

.sub-banner-main { display: block; position: relative; z-index: 999;}

/* .sub-banner-block:after { content: ""; width: 100%; height: 110px; background: url(../img/gry-curve-top.webp) no-repeat center bottom; background-size: cover; display: block; position: absolute; bottom:-8px;} */



.breadcrumb-menu { display: flex; align-items: center; flex-wrap: wrap; }

.breadcrumb-menu li { display: block; position: relative; padding-left: 28px; margin-right: 15px; font-size: 16px;text-shadow: 0.075em 0.08em 0.1em rgba(0, 0, 0, 1);}

.breadcrumb-menu li::before { content: ''; width: 11px; height: 11px; display: block; background: url(../img/diamond-icon.svg) no-repeat left top; background-size: 11px; position: absolute; left: 0; top: 6px;}

.breadcrumb-menu li a { color: #ffffff; position: relative;}

.footer-menu ul li a:hover { color: var(--secondary-color);}

.breadcrumb-menu li:first-child:before { width: 16px; height: 16px; background: url(../img/home-icon.svg) no-repeat left top; top: 3px;}

.breadcrumb-menu li.active { color: var(--secondary-color);}



.commen-table .table-responsive { box-shadow: 0px 1px 7px 0px rgba(0, 0, 0, 0.07); border-width: 1px; border-color: rgb(255, 255, 255); border-style: solid; border-radius: 9px;}

.commen-table table { border: none; margin: 0;}

.commen-table table tr { border-bottom: 1px solid #e5e5e5;}

.commen-table table th { padding: 12px 15px; font-size: 16px; color: #000000; font-weight: 500;}

.commen-table table td { padding: 10px 15px; font-size: 16px; color: #acacac; font-weight: 400;}

.commen-table table th { font-size: .85em;}

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

  .commen-table table { border: 0;}

  .commen-table table caption { font-size: 1.3em;}

  .commen-table table thead { border: none; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px;}

  .commen-table table tr { border-bottom: 3px solid #ddd; display: block; margin-bottom: .625em;}

  .commen-table table td { border-bottom: 1px solid #ddd; display: block; font-size: .8em; text-align: right;}

  .commen-table table td::before { content: attr(data-label); float: left; font-weight: bold; text-transform: uppercase;}

  .commen-table table td:last-child { border-bottom: 0;}

}



.commen-section-block { display: block;}

.about-top-sec img { display: block; float: left; margin: 0 35px 20px 0;}

.about-top-sec .commen-table table tr { border: none;}

.about-top-sec .commen-table table thead tr th { width: calc(100%/3); background: var(--light-blue); border: none; color: #16254c; padding: 20px 25px;}

.about-top-sec .commen-table table tbody tr td { border: none; padding: 20px 25px; color: #16254c;}

.about-top-sec .commen-table table tbody tr:nth-child(even) td { background: #f4f9fb;}



.admission-process-wraper { display: block;}

.admission-process { display: block; margin-top: 60px; background: var(--white); box-shadow: 0px 1px 7px 0px rgba(0, 0, 0, 0.07); border-radius: 9px; overflow: hidden;}

.admission-process-left { display: flex; align-items: center; justify-content: center; background: #fff9ef; min-height: 330px; padding: 0px;}

.admission-process-left img{margin: 0px; width: 220px;}





ul.listing-leftArrow{margin-bottom: 30px;}

ul.listing-leftArrow li { margin-bottom: 15px; background: url(../img/left-arrow.svg) no-repeat 0 4px; padding:  0 0 0 25px; background-size:7px; font-size: 16px;}

ul.listing-leftArrow li:last-child { margin-bottom: 0px;}





.hyperlink {

  display: inline-block;

  vertical-align: middle;

  -webkit-transform: perspective(1px) translateZ(0);

  transform: perspective(1px) translateZ(0);

  box-shadow: 0 0 1px rgba(0, 0, 0, 0);

  position: relative;

  overflow: hidden;

  color: var(--primary-color);

}

.hyperlink:hover{color: var(--primary-color);}



.hyperlink::before {

  content: "";

  position: absolute;

  z-index: -1;

  left: 0;

  right: 100%;

  bottom: 0;

  background: var(--dark-golden);

  height: 1px;

  -webkit-transition-property: right;

  transition-property: right;

  -webkit-transition-duration: 0.3s;

  transition-duration: 0.3s;

  -webkit-transition-timing-function: ease-out;

  transition-timing-function: ease-out;

}



.hyperlink:hover::before, .hyperlink:focus::before, .hyperlink:active::before {

  right: 0;



}







/* ======================================================

   Faisal New Styles begin

   ====================================================== */

.welcome-message { display: block;}

.welcome-message h5 { font-size: 22px; margin-bottom: 0;}

.welcome-message h5 span { display: block; font-size: 30px; font-weight: 500; line-height: 1.1; padding-bottom: 8px;}



.admission-steps-wraper { display: block;}

.admission-step { display: block; }

.admission-step h2 a { color: #16254c;}

.step-span { width: 140px; line-height: 1; font-size: 35px; background: #e0f5ff; color: var(--primary-color); display: block; margin-bottom: 35px; border-radius: 35px; padding: 9px 25px; text-align: center;}

.admission-step ul.listing-leftArrow li { margin-bottom: 15px;}



.note-box { display: block; background: var(--light-blue); padding: 20px 30px; border-radius: 8px; margin-bottom: 40px;}

.note-box p span { font-weight: 500;}



.bank-account { display: block; max-width: 470px; width: 100%; border: 1px solid #16254c; padding: 30px 41px; padding-bottom: 15px; border-radius: 10px;}

.bank-account ul li { display: block; margin-bottom: 18px; word-break: break-all;}

.bank-account ul li span { font-weight: 500;}

.admission-step .commen-table table thead tr th { vertical-align: middle; width: calc(100%/5); padding: 11px 25px;}

.admission-step .commen-table table tbody tr td { vertical-align: middle;}



.full-image-banner { position: relative;}

.full-image-banner::before { content: ''; width: 100%; height: 100%; display: block; position: absolute; left: 0; top: 0; background: #16254C;
background: linear-gradient(180deg, rgba(22, 37, 76, 1) 9%, rgba(36, 69, 42, 0) 94%); opacity: 0.9;}

.full-image-banner .container { position: relative; z-index: 3;}



.leadership-team-block { display: block;}

.ldsp-card { display: block;}

.ldsp-card-image { display: block;}

.ldsp-card-image img { display: block; width: 100%;}

.ldsp-card-body { display: block; padding-top: 30px;}

.ldsp-card-body h5 { color: var(--secondary-color);}

.ldsp-popup { padding: 50px;}

.ldsp-popup h2 { color: #16254c; font-size: 40px;}

.ldsp-popup h5 { color: var(--secondary-color); font-size: 25px;}

.learner-card { display: block; background: var(--white); box-shadow: 0px 1px 7px 0px rgba(0, 0, 0, 0.07); height: 100%;}

.learner-card-img { display: flex; align-items: center; justify-content: center; background: #f4f9fb; min-height: 328px; padding: 25px;}

.learner-card-img img { display: block;}

.learner-card-body { display: block; padding: 45px;}

.learner-card-body h2 { margin-bottom: 20px;}



.student-leadership-sec .learner-card { background: #f4f9fb;}

.student-leadership-sec .learner-card-img { padding: 0; min-height: auto;}

.clinic-card { display: block;}





.hyperlink {

  display: inline-block;

  vertical-align: middle;

  -webkit-transform: perspective(1px) translateZ(0);

  transform: perspective(1px) translateZ(0);

  box-shadow: 0 0 1px rgba(0, 0, 0, 0);

  position: relative;

  overflow: hidden;

  color: var(--primary-color);

}

.hyperlink:hover{color: var(--primary-color);}



.hyperlink::before {

  content: "";

  position: absolute;

  z-index: -1;

  left: 0;

  right: 100%;

  bottom: 0;

  background: var(--dark-golden);

  height: 1px;

  -webkit-transition-property: right;

  transition-property: right;

  -webkit-transition-duration: 0.3s;

  transition-duration: 0.3s;

  -webkit-transition-timing-function: ease-out;

  transition-timing-function: ease-out;

}



.hyperlink:hover::before, .hyperlink:focus::before, .hyperlink:active::before {

  right: 0;



}

















/*----------------------------------------*/

/*  2.10 Offcanvas

/*----------------------------------------*/

.body-overlay {

  position: fixed;

  top: 0;

  left: 0;

  z-index: 9999;

  width: 100%;

  height: 100%;

  visibility: hidden;

  opacity: 0;

  transition: 0.45s ease-in-out;

  background: rgba(24, 24, 24, 0.4);

}

.body-overlay.opened {

  opacity: 1;

  visibility: visible;

}



.tp-offcanvas-logo img {

  width: 85px;

  height: 100%;

}

.tp-offcanvas-area {

  position: fixed;

  top: 0;

  right: 0;

  width: 450px;

  height: 100%;

  z-index: 99;

  z-index: 99999;

  padding: 50px 50px;

  overflow-y: scroll;

  overflow-x: hidden;

  scrollbar-width: none;

  background: #FFF;

  overscroll-behavior-y: contain;

  -webkit-transform: translateX(calc(100% + 80px));

  -moz-transform: translateX(calc(100% + 80px));

  -ms-transform: translateX(calc(100% + 80px));

  -o-transform: translateX(calc(100% + 80px));

  transform: translateX(calc(100% + 80px));

}

@media (max-width: 767px) {

  .tp-offcanvas-area {

    width: 100%;

  }

}

@media only screen and (min-width: 576px) and (max-width: 767px) {

  .tp-offcanvas-area {

    width: 450px;

  }

}

.tp-offcanvas-area.opened {

  -webkit-transform: translateX(0);

  -moz-transform: translateX(0);

  -ms-transform: translateX(0);

  -o-transform: translateX(0);

  transform: translateX(0);

}

.tp-offcanvas-area .tp-homemenu-wrapper {

  margin-top: 20px;

}

.tp-offcanvas-area .tp-homemenu-wrapper .gx-25 {

  --bs-gutter-x: 10px;

}

.tp-offcanvas-area .homemenu-thumb-wrap {

  margin-bottom: 0;

  margin-bottom: 10px;

}

.tp-offcanvas-area .homemenu {

  margin-bottom: 15px;

}

.tp-offcanvas-area .homemenu-title {

  font-size: 13px;

}

.tp-offcanvas-area .tp-megamenu-list-box {

  padding: 0;

}

.tp-offcanvas-area .tp-megamenu-wrapper {

  padding: 20px 0px;

}

.tp-offcanvas-area .tp-megamenu-title {

  margin-bottom: 15px;

}

.tp-offcanvas-area .tp-megamenu-list-wrap ul {

  margin-left: 0;

}

.tp-offcanvas-area .tp-megamenu-list-wrap ul li a::before {

  top: 17px;

}

.tp-offcanvas-area .tp-main-menu-mobile ul li > a {

  font-size: 15px;

}

.tp-offcanvas-area .tp-megamenu-shop-style .tp-shop-banner-thumb {

  margin-bottom: 20px;

}

.tp-offcanvas-area .tp-megamenu-portfolio {

  padding-top: 20px;

}

.tp-offcanvas-area .tp-megamenu-portfolio-banner {

  display: none;

}

.tp-offcanvas-area .tp-megamenu-list-2 {

  padding-left: 0;

}

.tp-offcanvas-top {

  margin-bottom: 90px;

}

.tp-offcanvas-close-btn {

  color: black;

}

.tp-offcanvas-close-btn:hover {

  opacity: 1;

  -webkit-transform: rotate(90deg);

  -moz-transform: rotate(90deg);

  -ms-transform: rotate(90deg);

  -o-transform: rotate(90deg);

  transform: rotate(90deg);

}

.tp-offcanvas-content {

  margin-bottom: 45px;

}

.tp-offcanvas-content p {

  font-size: 16px;

  font-weight: 400;

  line-height: 24px;

  color: #414144;

}

.tp-offcanvas-title {

  font-size: 40px;

  line-height: 1;

  letter-spacing: -0.8px;

  font-weight: 700;

  margin-bottom: 15px;

  color: var(--tp-common-black);

}

.tp-offcanvas-title.sm {

  font-size: 20px;

  font-weight: 700;

  margin-bottom: 15px;

  text-transform: uppercase;

  color: var(--tp-common-black);

}

.tp-offcanvas-gallery {

  margin-bottom: 65px;

}

.tp-offcanvas-contact {

  margin-bottom: 55px;

}

.tp-offcanvas-contact ul li {

  list-style: none;

}

.tp-offcanvas-contact ul li:not(:last-child) {

  margin-bottom: 2px;

}

.tp-offcanvas-contact ul li a {

  display: inline-block;

  color: #414144;

  font-size: 18px;

  position: relative;

}

.tp-offcanvas-contact ul li a::after {

  position: absolute;

  bottom: 2px;

  right: 0;

  width: 0;

  height: 1px;

  content: "";

  transition: 0.4s;

  background-color: #1e1e1e;

}

.tp-offcanvas-contact ul li a:hover {

  color: var(--tp-common-black);

}

.tp-offcanvas-contact ul li a:hover::after {

  width: 100%;

  right: auto;

  left: 0;

}

.tp-offcanvas-social ul {

  display: -webkit-box;

  display: -moz-box;

  display: -ms-flexbox;

  display: -webkit-flex;

  display: flex;

  align-items: center;

}

.tp-offcanvas-social ul li {

  list-style: none;

}

.tp-offcanvas-social ul li:not(:last-child) {

  margin-right: 8px;

}

.tp-offcanvas-social ul li a {

  display: inline-block;

  text-align: center;

  width: 40px;

  height: 40px;

  line-height: 38px;

  border-radius: 40px;

  color: var(--tp-common-black);

  border: 1px solid rgba(2, 11, 24, 0.1);

}

.tp-offcanvas-social ul li a:hover {

  background-color: var(--tp-common-black);

  border-color: var(--tp-common-black);

  color: var(--tp-common-white);

}

.tp-offcanvas-social ul li a svg {

  -webkit-transform: translateY(-1px);

  -moz-transform: translateY(-1px);

  -ms-transform: translateY(-1px);

  -o-transform: translateY(-1px);

  transform: translateY(-1px);

}



.tp-offcanvas-2-area {

  position: relative;

  z-index: 99999;

}

.tp-offcanvas-2-area.opened .animated-text > nav > ul > li a::after {

  visibility: visible;

  opacity: 1;

  bottom: 35px;

}

.tp-offcanvas-2-area.opened .animated-text > nav > ul > li a::before {

  width: 100%;

}

.tp-offcanvas-2-area.opened .animated-text > nav > ul > li a .tp-text-hover-effect-word .single-char span {

  -webkit-transform: translateZ(0.1px);

  -moz-transform: translateZ(0.1px);

  -ms-transform: translateZ(0.1px);

  -o-transform: translateZ(0.1px);

  transform: translateZ(0.1px);

}

.tp-offcanvas-2-area.opened .tp-offcanvas-2-left, .tp-offcanvas-2-area.opened .tp-offcanvas-2-right {

  visibility: visible;

  opacity: 1;

}

.tp-offcanvas-2-area.opened .tp-offcanvas-2-wrapper {

  visibility: visible;

  opacity: 1;

}

.tp-offcanvas-2-area.opened .tp-offcanvas-2-bg.is-left, .tp-offcanvas-2-area.opened .tp-offcanvas-2-bg.is-right {

  -webkit-transform: scale(1, 1);

  -moz-transform: scale(1, 1);

  -ms-transform: scale(1, 1);

  -o-transform: scale(1, 1);

  transform: scale(1, 1);

  transition-delay: 0s;

}

.tp-offcanvas-2-area.opened .tp-offcanvas-2-menu {

  transition-delay: 0s;

}

.tp-offcanvas-2-area.opened .tp-offcanvas-2-close {

  visibility: visible;

  opacity: 1;

  -webkit-transform: translateY(0);

  -moz-transform: translateY(0);

  -ms-transform: translateY(0);

  -o-transform: translateY(0);

  transform: translateY(0);

  transition-delay: 0.9s;

}

.tp-offcanvas-2-area.opened .tpoffcanvas__right-info, .tp-offcanvas-2-area.opened .tpoffcanvas__social-link, .tp-offcanvas-2-area.opened .tpoffcanvas__logo {

  visibility: visible;

  opacity: 1;

  -webkit-transform: translateY(0);

  -moz-transform: translateY(0);

  -ms-transform: translateY(0);

  -o-transform: translateY(0);

  transform: translateY(0);

}

.tp-offcanvas-2-area.opened .tpoffcanvas__right-info {

  transition-delay: 0.9s;

}

.tp-offcanvas-2-area.opened .tpoffcanvas__social-link {

  transition-delay: 0.7s;

}

.tp-offcanvas-2-area.opened .tpoffcanvas__logo {

  transition-delay: 0.3s;

}

.tp-offcanvas-2-area.opened .tpoffcanvas__logo img {

  flex: 0 0 auto;

}

.tp-offcanvas-2-area .tp-main-menu-mobile {

  padding-top: 80px;

  padding-left: 90px;

  padding-right: 130px;

}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {

  .tp-offcanvas-2-area .tp-main-menu-mobile {

    padding-left: 50px;

    padding-right: 50px;

  }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .tp-offcanvas-2-area .tp-main-menu-mobile {

    padding-left: 30px;

    padding-right: 30px;

  }

}

@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {

  .tp-offcanvas-2-area .tp-main-menu-mobile {

    padding: 30px;

  }

}

.tp-offcanvas-2-area .tp-main-menu-mobile > nav > ul {

  margin-bottom: 10px;

}

.tp-offcanvas-2-area .tp-main-menu-mobile > nav > ul > li > a {

  padding: 15px 0;

  font-size:22px;

  position: relative;

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .tp-offcanvas-2-area .tp-main-menu-mobile > nav > ul > li > a {

    font-size: 50px;

  }

}

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

  .tp-offcanvas-2-area .tp-main-menu-mobile > nav > ul > li > a {

    font-size: 40px;

    padding-left: 0;

  }

}

@media (max-width: 767px) {

  .tp-offcanvas-2-area .tp-main-menu-mobile > nav > ul > li > a {

    padding: 15px 0;

    font-size:25px;

    padding-left: 0;

  }

}



@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {

  .tp-offcanvas-2-area .tp-main-menu-mobile > nav > ul > li > a::after {

    display: none;

  }

}





@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {

  .tp-offcanvas-2-area .tp-main-menu-mobile > nav > ul > li ul li {

    padding-left: 0;

  }

}

.tp-offcanvas-2-area .tp-main-menu-mobile > nav > ul > li ul li a {

  width: 100%;

  font-size: 18px;

  border-bottom: 0;

  padding: 12px 0;

  transition: 0.4s;

  color: #b9ccfa;

}

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

  .tp-offcanvas-2-area .tp-main-menu-mobile > nav > ul > li ul li a {

    font-size: 20px;

  }

}

@media (max-width: 767px) {

  .tp-offcanvas-2-area .tp-main-menu-mobile > nav > ul > li ul li a {

    font-size: 18px;

  }

}

.tp-offcanvas-2-area .tp-main-menu-mobile > nav > ul > li ul li a:hover {

  padding-left:10px;

  color: var(--white);

}

.tp-offcanvas-2-area .tp-main-menu-mobile nav ul li.has-dropdown > a .dropdown-toggle-btn {

  top: 0;

  right: 0;

  padding: 44px 20px;

  padding-left: 200px;

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .tp-offcanvas-2-area .tp-main-menu-mobile nav ul li.has-dropdown > a .dropdown-toggle-btn {

    padding: 28px 20px;

    padding-left: 200px;

  }

}

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

  .tp-offcanvas-2-area .tp-main-menu-mobile nav ul li.has-dropdown > a .dropdown-toggle-btn {

    padding: 33px 20px;

    padding-left: 200px;

  }

}

@media (max-width: 767px) {

  .tp-offcanvas-2-area .tp-main-menu-mobile nav ul li.has-dropdown > a .dropdown-toggle-btn {

    padding: 17px 20px;

    padding-left: 200px;

  }

}

.tp-offcanvas-2-area .tp-main-menu-mobile nav > ul > li {

border-bottom: 1px solid rgba(168, 170, 226, 0.1);

}

.tp-offcanvas-2-area .tp-main-menu-mobile nav ul li:not(:last-child) a {

  border-bottom: 0;

}

.tp-offcanvas-2-area .tp-main-menu-mobile > nav > ul > li ul.submenu {

  border-top: 1px solid rgba(6, 7, 40, 0.1);

}

.tp-offcanvas-2-area .tp-main-menu-mobile nav ul li.has-dropdown > a .dropdown-toggle-btn {

  font-size: 22px;

  background: transparent;

  border: none;

  width: 100%;

}

.tp-offcanvas-2-bg.left-box {

  position: fixed;

  top: 0;

  height: 100%;

  width: 60%;

  -webkit-transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);

  -moz-transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);

  -ms-transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);

  -o-transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);

  transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);

  z-index: 1111;

}

@media (max-width: 767px) {

  .tp-offcanvas-2-bg.left-box {

    width: 100%;

  }

}

.tp-offcanvas-2-bg.right-box {

  position: fixed;

  top: 0;

  height: 100%;

  width: 40%;

  -webkit-transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);

  -moz-transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);

  -ms-transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);

  -o-transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);

  transition: all 1s cubic-bezier(0.77, 0, 0.175, 1);

  z-index: 1111;

}

@media (max-width: 767px) {

  .tp-offcanvas-2-bg.right-box {

    width: 100%;

  }

}

.tp-offcanvas-2-bg.is-left {

  left: 0;

  -webkit-transform: scale(1, 0);

  -moz-transform: scale(1, 0);

  -ms-transform: scale(1, 0);

  -o-transform: scale(1, 0);

  transform: scale(1, 0);

  transform-origin: top center;

  transition-delay: 1s;

background: rgba(38, 71, 41, 10.02);

background: linear-gradient(151deg, rgba(38, 71, 41, 1) 0%, rgba(22, 31, 58, 0.92) 52%);

}

.tp-offcanvas-2-bg.is-right {

  right: 0;

  transform-origin: bottom center;

  -webkit-transform: scale(1, 0);

  -moz-transform: scale(1, 0);

  -ms-transform: scale(1, 0);

  -o-transform: scale(1, 0);

  transform: scale(1, 0);

 background: url(../img/bright-and-beautiful-milky.jpg);

  transition-delay: 1s;

}

.tp-offcanvas-2-wrapper .tp-offcanvas-2-left {

  overflow-y: scroll;

}

.tp-offcanvas-2-wrapper .left-box {

  position: fixed;

  top: 0;

  width: 60%;

  height: 100vh;

  overscroll-behavior-y: contain;

  scrollbar-width: none;

  z-index: 9999;

  padding-bottom: 50px;

}

.tp-offcanvas-2-wrapper .left-box::-webkit-scrollbar {

  display: none;

}

@media (max-width: 767px) {

  .tp-offcanvas-2-wrapper .left-box {

    width: 100%;

  }

}

.tp-offcanvas-2-wrapper .right-box {

  position: fixed;

  top: 0;

  width: 40%;

  height: 100vh;

  overscroll-behavior-y: contain;

  scrollbar-width: none;

  z-index: 9999;

  padding-bottom: 50px;

}

.tp-offcanvas-2-wrapper .right-box::-webkit-scrollbar {

  display: none;

}

@media (max-width: 767px) {

  .tp-offcanvas-2-wrapper .right-box {

    width: 100%;

  }

}

.tp-offcanvas-2-left {

  visibility: hidden;

  opacity: 0;

  left: 0;

  transition-delay: 1.2s;

}

.tp-offcanvas-2-right {

  visibility: hidden;

  opacity: 0;

  right: 0;

  transition-delay: 1.2s;

}

.tp-offcanvas-2-right-inner {

  padding:0 70px 0 70px;

}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {

  .tp-offcanvas-2-right-inner {

    padding-left: 50px;

    padding-right: 50px;

  }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .tp-offcanvas-2-right-inner {

    padding: 50px;

  }

}

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

  .tp-offcanvas-2-right-inner {

    padding: 30px;

  }

}

.tp-offcanvas-2-close {

  padding-top: 30px;

  padding-right: 70px;

  visibility: hidden;

  opacity: 0;

  -webkit-transform: translateY(20px);

  -moz-transform: translateY(20px);

  -ms-transform: translateY(20px);

  -o-transform: translateY(20px);

  transform: translateY(20px);

  transition-delay: 0.9s;

}

@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {

  .tp-offcanvas-2-close {

    padding-right: 30px;

  }

}

.tp-offcanvas-2-close-btn {

  text-transform: uppercase;

  font-size: 14px;

  font-weight: 500;

  border: none;

  background: none;

}

.tp-offcanvas-2-close-btn .text {

  width: 55px;

  height: 20px;

  overflow: hidden;

  display: inline-block;

  transform: translateY(7px);



}

.tp-offcanvas-2-close-btn .text span {

  display: inline-block;

  -webkit-transform: translateX(120%);

  -moz-transform: translateX(120%);

  -ms-transform: translateX(120%);

  -o-transform: translateX(120%);

  transform: translateX(120%);

  transition-duration: 1s;

}

.tp-offcanvas-2-close-btn:hover .text span {

  transform: translateX(0%);

  transition-duration: 1s;

}

.tp-offcanvas-2-close-btn:hover span svg {

  -webkit-transform: rotate(90deg);

  -moz-transform: rotate(90deg);

  -ms-transform: rotate(90deg);

  -o-transform: rotate(90deg);

  transform: rotate(90deg);

}

.tp-offcanvas-2-text {

  right: 0;

  bottom: 0;

  position: absolute;

  transform: rotate(-90deg) translateY(100%);

}

.tp-offcanvas-2-text span {

  font-size: 320px;

  font-weight: 700;

  color: rgba(33, 35, 41, 0.3);

}



.tpoffcanvas__logo {

  opacity: 0;

  padding-left: 90px;

  padding-top: 35px;

  visibility: hidden;

  transition-delay: 0s;

  -webkit-transform: translateY(30px);

  -moz-transform: translateY(30px);

  -ms-transform: translateY(30px);

  -o-transform: translateY(30px);

  transform: translateY(30px);

}

@media only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {

  .tpoffcanvas__logo {

    padding-left: 30px;

  }

}

.tpoffcanvas__logo img {

  width: 245  px;



}

.tpoffcanvas__right-wrap {

  height: 100%;

  padding: 100px;

  padding-right: 60px;

}

.tpoffcanvas__right-info {

  opacity: 0;

  text-align: right;

  visibility: hidden;

  transition-delay: 0.6s;

  -webkit-transform: translateY(60px);

  -moz-transform: translateY(60px);

  -ms-transform: translateY(60px);

  -o-transform: translateY(60px);

  transform: translateY(60px);

}

.tpoffcanvas__right-info  h3{color: var(--secondary-color);}

.tpoffcanvas__tel a, .tpoffcanvas__mail a, .tpoffcanvas__text p {

  font-weight: 300;

  font-size:18px;

  line-height: 20px;

  letter-spacing: 0.04em;

  color: var(--white);

  display: inline-block;

  

}

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

  .tpoffcanvas__tel a, .tpoffcanvas__mail a, .tpoffcanvas__text p {

    font-size: 18px;

   

  }

}

.tpoffcanvas__social-link {

  visibility: hidden;

  opacity: 0;

  -webkit-transform: translateY(60px);

  -moz-transform: translateY(60px);

  -ms-transform: translateY(60px);

  -o-transform: translateY(60px);

  transform: translateY(60px);

  transition-delay: 0.9s;

  -webkit-transition: all 1s ease-in-out;

  -moz-transition: all 1s ease-in-out;

  -ms-transition: all 1s ease-in-out;

  -o-transition: all 1s ease-in-out;

  transition: all 1s ease-in-out;

}

.tpoffcanvas__social-link ul li {

  list-style: none;

}

.tpoffcanvas__social-link ul li:not(:last-child) {

  margin-bottom: 10px;

}

.tpoffcanvas__social-link ul li a {

  display: inline-block;

  font-weight: 300;

  font-size: 20px;

  line-height: 1.3;

  position: relative;

  padding-left: 16px;

  color: var(--tp-common-black);

}

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

  .tpoffcanvas__social-link ul li a {

    font-size: 22px;

  }

}

.tpoffcanvas__social-link ul li a::before {

  position: absolute;

  content: "";

  left: 16px;

  bottom: 3px;

  width: 0;

  height: 1px;

  background-color: var(--tp-common-black);

}

.tpoffcanvas__social-link ul li a:hover::before {

  width: calc(100% - 16px);

}



.tp-offcanvas-gallery-img {

  position: relative;

}

.tp-offcanvas-gallery-img::after {

  position: absolute;

  top: 0;

  left: 0;

  content: "";

  height: 100%;

  width: 100%;

  opacity: 0;

  visibility: hidden;

  background-color: rgba(0, 0, 0, 0.3);

  transition: 0.4s;

}

.tp-offcanvas-gallery-img img {

  transition: 0.4s;

  width: 100%;

}

.tp-offcanvas-gallery-img:hover img {

  transform: scale(1.2);

}

.tp-offcanvas-gallery-img:hover::after {

  opacity: 1;

  visibility: visible;

}







/* HEADER CSS */

/*----------------------------------------*/

/*  4.1 Main menu css

/*----------------------------------------*/

.header-main-menu > nav > ul > li > .submenu {

  position: absolute;

  width: 330px;

  z-index: 999;

  padding: 35px 0px;

  top: 100%;

  opacity: 0;

  visibility: hidden;

  transition: 0.4s;

  text-align: left;

  margin-left: 0;

  overflow: hidden;

  transform-origin: top;

  transition-duration: 0.1s;

  backdrop-filter: blur(8px);

  background: rgba(255, 255, 255, 0.9);

  box-shadow: 0px 10px 30px 0px rgba(25, 25, 26, 0.1);

  -webkit-transform: perspective(300px) rotateX(-18deg);

  -moz-transform: perspective(300px) rotateX(-18deg);

  -ms-transform: perspective(300px) rotateX(-18deg);

  -o-transform: perspective(300px) rotateX(-18deg);

  transform: perspective(300px) rotateX(-18deg);

}

.header-main-menu > nav > ul > li > .submenu > li {

  list-style: none;

  display: block;

  padding: 0 45px;

}

.header-main-menu > nav > ul > li > .submenu > li:not(:last-child) {

  margin-bottom: 13px;

}

.header-main-menu > nav > ul > li > .submenu > li > a {

  color: #575758;

  font-size: 15px;

  font-weight: 500;

  line-height: 1;

  letter-spacing: -0.3px;

  text-transform: uppercase;

  position: relative;

}

.header-main-menu > nav > ul > li > .submenu > li > a::before {

  position: absolute;

  top: 10px;

  left: 0;

  content: "";

  height: 2px;

  width: 0px;

  opacity: 0;

  visibility: hidden;

  display: inline-block;

  transition: all 0.3s ease-out 0s;

  background-color: var(--tp-common-black);

}

.header-main-menu > nav > ul > li > .submenu > li:hover > a {

  padding-left: 25px;

  color: var(--tp-common-black);

}

.header-main-menu > nav > ul > li > .submenu > li:hover > a::before {

  width: 20px;

  visibility: visible;

  opacity: 1;

}

.header-main-menu > nav > ul > li > .submenu .submenu {

  left: 100%;

  top: 0;

}

.header-main-menu > nav > ul > li:hover > .submenu {

  visibility: visible;

  opacity: 1;

  transition-duration: 0.2s;

  -webkit-transform: perspective(300px) rotateX(0deg);

  -moz-transform: perspective(300px) rotateX(0deg);

  -ms-transform: perspective(300px) rotateX(0deg);

  -o-transform: perspective(300px) rotateX(0deg);

  transform: perspective(300px) rotateX(0deg);

}

.header-main-menu > nav > ul > li.has-homemenu {

  position: static;

}

.header-main-menu > nav > ul > li.has-homemenu .tp-mega-menu {

  width: 100%;

}

.header-main-menu > nav > ul > li > .tp-mega-menu {

  position: absolute;

  top: 100%;

  left: 0;

  right: 0;

  padding: 0;

  width: 1170px;

  margin: 0 auto;

}

.header-main-menu > nav > ul > li > .tp-mega-menu .tp-homemenu-wrapper {

  padding: 70px 70px 20px 70px;

}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {

  .header-main-menu > nav > ul > li > .tp-mega-menu .tp-homemenu-wrapper {

    padding: 50px 50px 20px 50px;

  }

}

.header-main-menu > nav > ul > li > .tp-mega-menu .tp-homemenu-wrapper .homemenu {

  margin-bottom: 40px;

}

.header-main-menu > nav > ul > li > .tp-mega-menu .tp-megamenu-portfolio {

  padding: 20px 0px 25px 70px;

}

@media only screen and (min-width: 1600px) and (max-width: 1700px), only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {

  .header-main-menu > nav > ul > li > .tp-mega-menu .tp-megamenu-portfolio {

    padding: 20px 0px 25px 20px;

  }

}



.homemenu-title {

  font-size: 15px;

  font-weight: 500;

  line-height: 1;

  letter-spacing: -0.15px;

  color: var(--tp-common-black);

  text-transform: uppercase;

}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {

  .homemenu-title {

    font-size: 13px;

    letter-spacing: normal;

  }

}

.homemenu-thumb img {

  width: 100%;

  transition: 1s;

}

.homemenu-thumb-wrap {

  padding: 10px;

  border: 1px solid rgba(0, 0, 0, 0.1);

}

.homemenu-thumb:hover img {

  transform: scale(1.1);

}



.tp-megamenu-title {

  font-size: 16px;

  font-weight: 700;

  line-height: 1;

  display: block;

  padding-bottom: 20px;

  margin-bottom: 30px;

  letter-spacing: -0.32px;

  text-transform: uppercase;

  color: var(--tp-common-black);

  border-bottom: 1px solid rgba(58, 57, 54, 0.1);

  padding-left: 20px;

}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {

  .tp-megamenu-title {

    font-size: 15px;

  }

}

.tp-megamenu-title a {

  padding-left: 20px;

}

.tp-megamenu-list-box {

  padding: 25px 0px 30px 20px;

}

.tp-megamenu-list-wrap ul {

  margin-left: 20px;

  display: inline-block;

}

.tp-megamenu-list-wrap ul li {

  list-style: none;

  width: 50%;

  float: left;

}

.tp-megamenu-list-wrap ul li:not(:last-child) {

  margin-bottom: 15px;

}

.tp-megamenu-list-wrap ul li a {

  color: #575758;

  font-size: 15px;

  font-weight: 500;

  line-height: 1;

  letter-spacing: -0.3px;

  text-transform: uppercase;

  position: relative;

}

@media only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px) {

  .tp-megamenu-list-wrap ul li a {

    font-size: 13px;

    letter-spacing: normal;

  }

}

.tp-megamenu-list-wrap ul li a::before {

  position: absolute;

  top: 10px;

  left: 0;

  content: "";

  height: 2px;

  width: 0px;

  opacity: 0;

  visibility: hidden;

  display: inline-block;

  transition: all 0.3s ease-out 0s;

  background-color: var(--tp-common-black);

}

.tp-megamenu-list-wrap ul li:hover a {

  padding-left: 25px;

  color: var(--tp-common-black);

}

.tp-megamenu-list-wrap ul li:hover a::before {

  width: 20px;

  visibility: visible;

  opacity: 1;

}

.tp-megamenu-list-2 .tp-megamenu-list-wrap ul li {

  float: inherit;

  width: 100%;

}

@media only screen and (min-width: 1600px) and (max-width: 1700px), only screen and (min-width: 1400px) and (max-width: 1599px), only screen and (min-width: 1200px) and (max-width: 1399px), only screen and (min-width: 992px) and (max-width: 1199px), only screen and (min-width: 768px) and (max-width: 991px), (max-width: 767px) {

  .tp-megamenu-list-2 {

    margin-left: 0;

  }

}

.tp-megamenu-shop-style {

  height: 100%;

}

.tp-megamenu-shop-style .tp-shop-banner-left {

  height: 100%;

}

.tp-megamenu-shop-style .tp-shop-banner-thumb {

  height: 100%;

  overflow: hidden;

}

.tp-megamenu-shop-style .tp-shop-banner-thumb img {

  height: 371px;

  width: 100%;

}

.tp-megamenu-shop-style .tp-shop-banner-content {

  margin: 25px;

}

.tp-megamenu-shop-style .tp-shop-banner-title {

  font-size: 50px;

  margin-bottom: 10px;

}

.tp-megamenu-shop-style .tp-shop-banner-content span {

  font-size: 14px;

  margin-bottom: 18px;

}

.tp-megamenu-shop-style .tp-shop-btn {

  font-size: 13px;

  height: 30px;

  line-height: 29px;

  padding: 0px 18px;

  transition: 0.3s;

}

.tp-megamenu-shop-style .tp-shop-btn:hover {

  background-color: var(--tp-common-white);

  color: var(--tp-common-black);

  border-color: var(--tp-common-white);

}

.tp-megamenu-portfolio-banner {

  position: absolute;

  top: 0;

  right: 0px;

  height: 100%;

}

.tp-megamenu-portfolio-banner img {

  height: 100%;

}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {

  .tp-megamenu-portfolio-banner {

    right: -130px;

  }

}

.tp-megamenu-wrapper {

  padding: 20px;

}

.tp-megamenu-portfolio-text {

  position: relative;

  z-index: 99;

  bottom: -35px;

  transform: rotate(-90deg) translateY(-110%);

}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {

  .tp-megamenu-portfolio-text {

    bottom: -40px;

  }

}

.tp-megamenu-portfolio-text h4 {

  font-size: 160px;

  font-weight: 900;

  line-height: 1;

  margin-bottom: 0;

  letter-spacing: -1.6px;

  -webkit-text-stroke-width: 1px;

  -webkit-text-stroke-color: rgba(25, 25, 26, 0.1);

  color: transparent;

}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {

  .tp-megamenu-portfolio-text h4 {

    font-size: 120px;

  }

}

.tp-megamenu-portfolio-text span {

  font-size: 30px;

  font-weight: 700;

  line-height: 1;

  letter-spacing: -0.3px;

  color: rgba(25, 25, 26, 0.4);

}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {

  .tp-megamenu-portfolio-text span {

    font-size: 21px;

  }

}



.tp-main-menu-mobile .tp-submenu {

  display: none;

}

.tp-main-menu-mobile .header-icon {

  display: none;

}

.tp-main-menu-mobile nav ul {

  position: static;

  display: block;

  box-shadow: none;

  margin-bottom: 50px;

}

.tp-main-menu-mobile nav ul li {

  list-style: none;

  position: relative;

  width: 100%;

  padding: 0;

}

.tp-main-menu-mobile nav ul li:not(:last-child) > a {

  border-bottom: 1px solid rgba(6, 7, 40, 0.1);

}

.tp-main-menu-mobile nav ul li.has-dropdown > a .dropdown-toggle-btn {

  position: absolute;

  right: 0;

  top: 0;

  -webkit-transform: translateY(-2px);

  -moz-transform: translateY(-2px);

  -ms-transform: translateY(-2px);

  -o-transform: translateY(-2px);

  transform: translateY(-2px);

  font-size: 18px;

  color: var(--secondary-color);

  font-family: "Font Awesome 5 Pro";

  transition: all 0.3s ease-in-out;

  text-align: center;

  transition: background-color 0.3s ease-in-out, border-color 0.3s ease-in-out, color 0.3s ease-in-out;

  padding: 15px 20px;

  padding-left: 100px;

}

@media (max-width: 767px) {

  .tp-main-menu-mobile nav ul li.has-dropdown > a .dropdown-toggle-btn {

    right: 0;

  }

}

.tp-main-menu-mobile nav ul li.has-dropdown > a .dropdown-toggle-btn i {

  transition: all 0.3s ease-in-out;

  right: 0;

  top: 15px;

  position: absolute;

  font-size:30px !important;

}

.tp-main-menu-mobile nav ul li.has-dropdown > a .dropdown-toggle-btn.dropdown-opened i {

  -webkit-transform: rotate(45deg);

  -moz-transform: rotate(45deg);

  -ms-transform: rotate(45deg);

  -o-transform: rotate(45deg);

  transform: rotate(45deg);

}

.tp-main-menu-mobile nav ul li.has-dropdown > a.expanded {

  color: var(--white);

}

.tp-main-menu-mobile nav ul li.has-dropdown > a.expanded .dropdown-toggle-btn.dropdown-opened {

   color: var(--white);

}

.tp-main-menu-mobile nav ul li.has-dropdown > a.expanded .dropdown-toggle-btn.dropdown-opened i {

    color: var(--white);

}

.tp-main-menu-mobile nav ul li:last-child a span {

  border-bottom: 0;

}

.tp-main-menu-mobile nav ul li > a {

  display: block;

  position: relative;

  padding: 15px 0;

  padding-right: 20px;

  font-size: 16px;

  font-weight: 500;

  line-height: 1;

  letter-spacing: -0.15px;

  color: var(--white);

}

.tp-main-menu-mobile nav ul li > a svg {

  -webkit-transform: translateY(-2px);

  -moz-transform: translateY(-2px);

  -ms-transform: translateY(-2px);

  -o-transform: translateY(-2px);

  transform: translateY(-2px);

}

.tp-main-menu-mobile nav ul li > a > i {

  display: inline-block;

  width: 11%;

  margin-right: 13px;

  -webkit-transform: translateY(4px);

  -moz-transform: translateY(4px);

  -ms-transform: translateY(4px);

  -o-transform: translateY(4px);

  transform: translateY(4px);

  font-size: 21px;

  line-height: 1;

}

.tp-main-menu-mobile nav ul li > a .menu-text {

  font-size: 16px;

  line-height: 11px;

  border-bottom: 1px solid #EAEBED;

  width: 82%;

  display: inline-block;

  padding: 19px 0 17px;

}

.tp-main-menu-mobile nav ul li img {

  width: 100%;

}

.tp-main-menu-mobile nav ul li ul {

  padding: 0;

}

.tp-main-menu-mobile nav ul li ul li {

  padding: 0;

}

.tp-main-menu-mobile nav ul li ul li a {

  margin-left: auto;

  width: 93%;

  padding: 10px 5%;

  text-shadow: none !important;

  visibility: visible;

  padding-left: 0;

  padding-right: 20px;

}

.tp-main-menu-mobile nav ul li ul li li a {

  width: 88%;

  padding: 10px 7%;

  padding-left: 0;

  padding-right: 20px;

}

.tp-main-menu-mobile nav ul li ul li li li a {

  width: 83%;

  padding: 10px 9%;

  padding-left: 0;

  padding-right: 20px;

}

.tp-main-menu-mobile nav ul li ul li li li li a {

  width: 68%;

  padding: 10px 11%;

  padding-left: 0;

  padding-right: 20px;

}

.tp-main-menu-mobile nav ul li:hover .mega-menu {

  visibility: visible;

  opacity: 1;

  top: 0;

}

.tp-main-menu-mobile nav ul li .mega-menu, .tp-main-menu-mobile nav ul li .submenu {

  position: static;

  min-width: 100%;

  padding: 0;

  box-shadow: none;

  visibility: visible;

  opacity: 1;

  display: none;

}

.tp-main-menu-mobile nav ul li .mega-menu li, .tp-main-menu-mobile nav ul li .submenu li {

  float: none;

  display: block;

  width: 100%;

  padding: 0;

}

.tp-main-menu-mobile nav ul li .mega-menu li:hover a .dropdown-toggle-btn, .tp-main-menu-mobile nav ul li .submenu li:hover a .dropdown-toggle-btn {

  color: var(--tp-theme-1);

}

.tp-main-menu-mobile .tp-main-menu-content ul li:not(:last-child) .home-menu-title a {

  border-bottom: none;

}

.tp-main-menu-mobile * ul, .tp-main-menu-mobile * li {

  transition: none !important;

}



.tp-portfolio-menu-style.tp-megamenu-list-wrap ul li {

  width: 100%;

  float: inherit;

}





.tp-header-6-area{

  position: absolute;

    z-index: 99;

    width: 100%;

}

/* .tp-header-logo img{width: 250px;} */

.tp-header-logo { max-width: 375px; display: block; text-align: center; position: absolute; left: 0; top: 0; right: 0; margin: auto; z-index: 9999; padding: 15px 0;}

.tp-header-logo a { display: inline-block;}





.menu-round { display: flex; align-items: center;}

.menu-round span {color: var(--white);}

.menu-round .menu-text { opacity: 1; transition: all ease-out 0.3s;}

/* .menu-round .menu-text {opacity: 0;-webkit-transform: translateX(60%);

  -moz-transform: translateX(60%);

  -ms-transform: translateX(60%);

  -o-transform: translateX(60%);

  transform: translateX(60%);

  transition-duration: 1s;}  */



.menu-round:hover .menu-text{opacity: 1;transform: translateX(0%);  transition-duration: 1.5s;}

.menu-round:hover .menu-toggle-icon span.line{background-color: var(--primary-color);}

.menu-round .menu-toggle-icon{transition-duration: 1s;}

.menu-round:hover .menu-toggle-icon{background-color: var(--secondary-color); border: 1px solid var(--secondary-color); transition-duration: 1s;}



.tp-reveal-line {

  overflow: hidden;



}



.sameline-block{display: flex; align-items: center;}

.top-menu ul li:last-child:after{display: none;}





.hyperlink {

  display: inline-block;

  vertical-align: middle;

  -webkit-transform: perspective(1px) translateZ(0);

  transform: perspective(1px) translateZ(0);

  box-shadow: 0 0 1px rgba(0, 0, 0, 0);

  position: relative;

  overflow: hidden;

  color: var(--primary-color);

}

.hyperlink:hover{color: var(--secondary-color);}



.hyperlink::before {

  content: "";

  position: absolute;

  z-index: -1;

  left: 0;

  right: 100%;

  bottom: 0;

  background: var(--secondary-color);

  height: 1px;

  -webkit-transition-property: right;

  transition-property: right;

  -webkit-transition-duration: 0.3s;

  transition-duration: 0.3s;

  -webkit-transition-timing-function: ease-out;

  transition-timing-function: ease-out;

}



.hyperlink:hover::before, .hyperlink:focus::before, .hyperlink:active::before {

  right: 0;



}



.top-menu-toggle .top-menu-tog-text { transition: all ease-out 0.3s; opacity: 1; display: block; font-size: 16px;}



#fix-header {

  position: fixed;

  top: 0;

  left: 0;

  right: 0;

  color: white;



  z-index: 1000;

  transition: all 0.5s ease;

}



.menu-hide  {
  /* top: -100px !important;
  transition: all 0.5s ease; */

}



/* Style when at top */

/* .menu-show {

  background: url(../img/event-update-bg.webp) !important;

  box-shadow: -3px 8px 5px -7px rgba(0,0,0,0.48);

  -webkit-box-shadow: -3px 8px 5px -7px rgba(0,0,0,0.48);

  -moz-box-shadow: -3px 8px 5px -7px rgba(0,0,0,0.48);

  transition: all 0.5s ease;

} */

.close-btn rect{fill: #fff;}



.menu-hide .menu-toggle-icon { background: var(--secondary-color);}

.menu-hide .menu-toggle-icon span { background: var(--primary-color);}

.menu-hide .menu-round .menu-text { opacity: 0; display: none;}

.menu-hide .top-menu-toggle .top-menu-tog-text { opacity: 0; display: none;}

.menu-hide .top-menu-toggle .top-menu-tog-icon { background: var(--secondary-color);}

.menu-hide .top-menu-toggle .top-menu-tog-icon i { color: var(--primary-color);}



.menu-show .menu-toggle-icon { background: var(--secondary-color);}

.menu-show .menu-toggle-icon span { background: var(--primary-color);}

.menu-show .menu-round .menu-text { opacity: 0; display: none;}

.menu-show .top-menu-toggle .top-menu-tog-text { opacity: 0;}

.menu-show .top-menu-toggle .top-menu-tog-icon { background: var(--secondary-color);}

.menu-show .top-menu-toggle .top-menu-tog-icon i { color: var(--primary-color);}





.menu-hide .menu-toggle-icon { background: var(--secondary-color);}

.menu-hide .menu-toggle-icon span { background: var(--primary-color);}

.menu-hide .menu-round .menu-text { opacity: 0;}

.menu-hide .bottom-menu-toggle .bottom-menu-tog-text { opacity: 0;display: none; }

.menu-hide .bottom-menu-toggle .bottom-menu-tog-icon { background: var(--secondary-color);}

.menu-hide .bottom-menu-toggle .bottom-menu-tog-icon i { color: var(--primary-color);}



.menu-show .menu-toggle-icon { background: var(--secondary-color);}

.menu-show .menu-toggle-icon span { background: var(--primary-color);}

.menu-show .menu-round .menu-text { opacity: 0;}

.menu-show .bottom-menu-toggle .bottom-menu-tog-text { opacity: 0;}

.menu-show .bottom-menu-toggle .bottom-menu-tog-icon { background: var(--secondary-color);}

.menu-show .bottom-menu-toggle .bottom-menu-tog-icon i { color: var(--primary-color);}



.admission-process-wraper .admission-process:nth-child(odd) .admission-process-left { background: #f4f9fb;}

.admission-step h3 { font-size: 30px; color: var(--primary-color); margin-bottom: 30px;}

.school-clinic-sec .admission-process-right h3 { color: var(--primary-color); font-size: 40px;}

.stem-initiatives-page .learner-card .learner-card-img { min-height: auto;}

.stem-initiatives-page .learner-card .learner-card-body { padding: 35px;}

.stem-initiatives-page .learner-card .learner-card-body h2 { font-size: 30px;}



.contact-form-block { display: block; background: var(--white); padding: 45px;}

.contact-form-block h2 { font-size: 40px;}

.contact-form { display: block; position: relative;}

.contact-form span { display: inline-block; background: #ffffff; padding: 2px 12px; position: absolute; left: 15px; top: -10px; font-size: 16px; line-height: 1.1;}

.contact-iput { width: 100%; height: 55px; padding: 0 15px; border: 1px solid #dedddd; font-size: 16px;}

.contact-iput:focus { outline: none;}

.contact-textarea { width: 100%; height: 155px; padding: 10px 15px; border: 1px solid #dedddd; font-size: 16px; resize: none;}



.address-overlay { display: block; position: relative; background-size: cover !important; background-repeat: no-repeat !important; background-position: top center !important; height: 100%;}

.address-box { display: block; background: #ffffff; height: 100%; padding: 30px; position: relative; z-index: 2;}

.address-box .icon { width: 52px; height: 54px; display: flex; align-items: center; justify-content: center; border: 1px solid #dedddd; margin-bottom: 45px;}

.address-box h5 { font-weight: 600; color: var(--primary-color); font-size: 20px;}

.address-box p a { color: var(--black);}



.application-form-sec .contact-form-block { max-width: 900px; margin: auto;}

.myp-page .about-top-sec h3 { font-size: 30px; color: var(--primary-color);}

.learner-card-body h3 { font-size: 30px; color: var(--primary-color);}

.myp-page .home-partners-block .learner-card-img { min-height: auto;}

.myp-page .home-partners-block .learner-card-body { padding: 35px;}



.diploma-programme-content { display: block;}

.diploma-programme-content img { display: block; float: left; margin: 0 2% 2% 0;}

.school-policies-main { display: flex; justify-content: center; flex-wrap: wrap;}

.school-policies-main .school-policies-box { display: block; text-align: center; width:100%; margin: 0 15px 15px 0; padding: 25px 15px; border-radius: 15px; border: 1px solid var(--white); text-align: center; transition: all ease-out 0.3s;}

.school-policies-main .school-policies-box img { display: inline-block; margin-bottom: 15px;}

.school-policies-main .school-policies-box p { margin-bottom: 0;}

.school-policies-main .school-policies-box:hover { border-color: #ffffff; background: var(--white); color: var(--primary-color) !important;}
.school-policies-main:hover .school-policies-box p{color: var(--primary-color);}



.book-tour-iframe { width: 100%; min-height: 800px;}

.contact-address-block .address-box { background: #16254cad;}

.contact-address-block .white-text .address-box h5 { color: var(--white);}

.contact-address-block .white-text .address-box p a { color: var(--white);}

.contact-address-block .white-text .address-box .icon { background: var(--white); border-radius: 10px;}



.why-parent-testi-block { display: block; border-top: 1px solid #c4c4c4; margin-top: 60px;}

.par-testi-video {
  display: flex;
  position: relative;
  overflow: hidden;
  border-radius: 15px;
  transition: all ease-out 0.3s;
  height: 350px;
  justify-content: center;
} 

.par-testi-video img {
  display: block;
  height: auto;
}

.par-testi-video::after { content: ''; width: 100%; height: 100%; display: block; position: absolute; left: 0; top: 0; bottom: 0; right: 0; margin: auto; z-index: 2; background: var(--primary-color); opacity: 0.5; transition: all ease-out 0.3s;}

.par-testi-video::before { content: ''; width: 65px; height: 45px; display: block; background: url(../img/play-fill.svg) no-repeat center center #da2c2b; background-size: 20px; border-radius:10px; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; z-index: 3;}

.par-testi-video:hover:after { opacity: 0.8;}





.floating-warp { display: inline-block; position: fixed; bottom: 30px; right: 1%; z-index: 9999;}

.whatsapp-icon { width: 55px; height: 55px; border-radius: 100%; background: #39be50; color: #ffffff; font-size: 22px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 25px; border-radius: 100%; -webkit-transition: all .3s ease; -ms-transition: all .3s ease; transition: all .3s ease; display: flex; justify-content: center; align-items: center;}

.whatsapp-icon:hover { background: #28993b; color: #ffffff;}

.floating-contact { display: inline-block; position: relative;}

.phone-number { width: 55px; height: 55px; background: #cdb06e; color: #ffffff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 25px; border-radius: 100%; -webkit-animation: yellow 2s infinite; -moz-animation: yellow 2s infinite; -o-animation: yellow 2s infinite; animation: yellow 2s infinite;}

.phone-number:hover { background: #fae0a3; color: #ffffff;}

@keyframes yellow {

  0%, 100% { -webkit-box-shadow: 0 0px 0 4px #fae0a3; -moz-box-shadow: 0 0px 0 4px #fae0a3; -ms-box-shadow: 0 0px 0 4px #fae0a3; -o-box-shadow: 0 0px 0 4px #fae0a3; box-shadow: 0 0px 0 4px #fae0a3;}

  50% { -webkit-box-shadow: 0 0px 0 0px #fae0a3; -ms-box-shadow: 0 0px 0 0px #fae0a3; -o-box-shadow: 0 0px 0 0px #fae0a3; -moz-box-shadow: 0 0px 0 0px #fae0a3; box-shadow: 0 0px 0 0px #fae0a3;} 

}

.phone-number i { display: inline-block; font-size: 18px; color: #ffffff; -webkit-transition: all .3s ease; -ms-transition: all .3s ease; transition: all .3s ease; -webkit-animation: phonering-alo-circle-img-anim 1s infinite ease-in-out; animation: phonering-alo-circle-img-anim 1s infinite ease-in-out; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%;}

@-webkit-keyframes phonering-alo-circle-img-anim {

  0% { -webkit-transform: rotate(0) scale(1) skew(1deg)}

  10% { -webkit-transform: rotate(-25deg) scale(1) skew(1deg)}

  20% { -webkit-transform: rotate(25deg) scale(1) skew(1deg)}

  30% { -webkit-transform: rotate(-25deg) scale(1) skew(1deg)}

  40% { -webkit-transform: rotate(25deg) scale(1) skew(1deg)}

  50% { -webkit-transform: rotate(0) scale(1) skew(1deg)}

  100% { -webkit-transform: rotate(0) scale(1) skew(1deg)}

}

.phone-number::before { content: ''; width: 87px; height: 87px; top: -16px; left: -16px; position: absolute; background-color: transparent; border-radius: 100%; border: 2px solid #fae0a3;

 -webkit-animation: phonering-alo-circle-anim 1.2s infinite ease-in-out; animation: phonering-alo-circle-anim 1.2s infinite ease-in-out; transition: all .5s; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; opacity: .5}

@-webkit-keyframes phonering-alo-circle-anim {

  0% {

      -webkit-transform: rotate(0) scale(.5) skew(1deg); -webkit-opacity: .1

  }

  30% {

      -webkit-transform: rotate(0) scale(.7) skew(1deg); -webkit-opacity: .5

  }

  100% {

      -webkit-transform: rotate(0) scale(1) skew(1deg); -webkit-opacity: .1

  }

}



.right-floating { display: inline-block; position: fixed; right: 0px; bottom: 30%; z-index: 5;}



/* ======================================================

   Faisal New Styles End

   ====================================================== */



   .menu-round-img img{border-radius: 25px;}

   .menu-address{text-align: left;}

   .menu-address i{margin-right: 12px; font-size: 17px; color: var(--secondary-color);}



  .footer-top-block h2 { font-size: 55px;}

  .footer-left p{color: #9dafd4; font-size: 16px;}

  .footer-left p i{color: var(--secondary-color); font-size: 18px; margin-right: 10px;}

  .footer-left .footer-contact a{color: #9dafd4 !important;}

  

  .footer-btn-link .primary-btn-border { border: 1px solid var(--white); background-color: inherit !important; color: var(--white);padding: 15px 30px; margin-right: 10px;}

  .foooter-logo{ display: block;}

  .foooter-logo a{cursor: pointer; display: block; opacity: .3; position: relative; -webkit-transition: all .3s ease; -o-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease; display: inline-block; vertical-align: middle;}

  .foooter-logo img{margin-right: 10px; margin-bottom: 10px;}

  .foooter-logo a:hover{opacity: 1;}



table.commen-table2 { border: 1px solid #ccc; border-collapse: collapse; margin: 0; padding: 0; width: 100%; table-layout: fixed;}

table.commen-table2 caption { font-size: 1.5em; margin: .5em 0 .75em;}

table.commen-table2 tr { background-color: #f8f8f8; border: 1px solid #ddd; padding: .35em;}

table.commen-table2 th,

table.commen-table2 td { padding: .625em;}

table.commen-table2 th { background: var(--primary-color); color: var(--white); font-weight: 600; border-left: 1px solid #ffffff; text-align: center;}

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

  table.commen-table2 { border: 0;}

  table.commen-table2 caption { font-size: 1.3em;}

  table.commen-table2 thead { border: none; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px;}

  table.commen-table2 tr { border-bottom: 3px solid #ddd; display: block; margin-bottom: .625em;}

  table.commen-table2 td { border-bottom: 1px solid #ddd; display: block; font-size: 16px; text-align: right;}

  table.commen-table2 td::before { content: attr(data-label); float: left; font-weight: 600;}

  table.commen-table2 td:last-child { border-bottom: 0;}

}



.commen-table2 th ul { display: flex; justify-content: center; flex-wrap: wrap; margin-bottom: 5px;}

.commen-table2 th ul li { font-weight: 400; padding: 0 5px; border-left: 1px solid #14264b; line-height: 1; color: #14264b;}

.commen-table2 th ul li:first-child { border-left: none;}

.commen-table2 tr th { vertical-align: middle;}

.commen-table2 tr th p { font-size: 14px; font-weight: 400; color: #14264b; text-align: center;}

.commen-table2 tr td { text-align: center; vertical-align: middle; font-size: 18px; font-weight: 400; border: none;}

.commen-table2 tr td:first-child { text-align: left;}

.commen-table2 tr th:first-child { text-align: left; border-left: none;} 

.commen-table2 tbody tr:nth-child(even) td { background: #fffaf2;}



.transportation-top-sec p a,

.transportation-top-sec .listing-leftArrow li a { color: var(--primary-color); font-weight: 600; word-break: break-all;}

.transportation-top-sec p a:hover,

.transportation-top-sec .listing-leftArrow li a:hover { color: var(--secondary-color);}

.school-event { display: block; position: relative;}

.school-event img { width: 100%; display: block;}



.commen-section-block h3 { font-size: 32px; color: #16254c; margin-bottom: 25px;}

.uniform-top-sec { display: block;}

.uniform-top-sec h3 { font-size: 28px; color: #16254c; margin-bottom: 25px;}

.commen-listing { display: block; margin-bottom: 25px; padding-left: 18px;}

.commen-listing li { margin-bottom: 10px; list-style: circle;}



.student-testi-top-sec .school-event i { display: flex; justify-content: center; align-items: center; width: 70px; height: 70px; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; z-index: 3; color: red; font-size: 41px; background: #ffffff; border-radius: 100%;}


.play-btn:hover { background: var(--white); color: var(--primary-color);}

.play-btn:hover i { color: var(--primary-color);}



.insta-feed-block { display: block; overflow: hidden;}

.admission-top-block { display: block;}

.admission-top-left { display: block;}







.admission-calculator { display: block; border: 1px solid var(--white); padding: 35px; border-radius: 15px; max-width: 500px;}

.calculator-output { display: block; background: var(--light-blue); padding: 15px; font-size: 18px; color: var(--black);}

.calculator-output span { font-weight: 700;}



.commen-accodian { display: block;}

.commen-accodian .accordion-box { display: block; background: #ffffff; margin-top: 10px;}

.commen-accodian .accordion-item { display: flex; align-items: center; flex-wrap: wrap; padding: 24px; padding-left: 100px; padding-right: 60px; border-radius: 0; border: none; position: relative; min-height: 102px;}

.commen-accodian .accordion-item p { font-size: 22px; font-weight: 400; line-height: 1.2;}

.commen-accodian .accordion-item .bi-chevron-down { display: block; width: 30px; height: 30px; line-height: 30px; text-align: center; position: absolute; right: 20px; top: 0; bottom: 0; margin: auto;}

.step-count { display: inline-block; padding: 10px 15px; border-radius: 10px; background: #16254c; color: #ffffff; text-align: center; font-size: 16px; position: absolute; left: 20px; top: 20px;}

.step-count span { display: block; font-weight: 600; font-size: 24px; line-height: 1;}

.commen-accodian .accordion-item p a { color: #000000;}

.commen-accodian .accordion-item.open .step-count { background: #cfb78b;}

.commen-accodian .accordion-item.open p { color: #16254c;}

.commen-accodian .accordion-item.open p a { color: #16254c;}

.commen-accodian .data { display: none; padding: 30px 40px; border-top: 1px solid #cecece;}



/* ----------------------- Begin --------------------- */

.simple-accodian { display: block;}

.simple-accodian .accordion-box { display: block; background: #ffffff; margin-top: 10px;}

.simple-accodian .accordion-item { display: flex; align-items: center; flex-wrap: wrap; padding: 15px 20px; padding-right: 40px; border-radius: 0; border: none; position: relative; color: var(--primary-color); cursor: pointer; font-size: 17px;}

.simple-accodian .accordion-item .bi-chevron-down { display: block; width: 30px; height: 30px; line-height: 30px; text-align: center; position: absolute; right: 16px; top: 13px;}

.simple-accodian .accordion-item.open { background: var(--secondary-color);}

.simple-accodian .data { display: none; padding: 30px; border-top: 1px solid #cecece;}

.simple-accodian .data h3{font-size: 25px; color: var(--primary-color); margin-bottom: 15px;}

/* ------------------------ End ---------------------- */



.fee-page .admission-process-left { min-height: 250px;}

.school-policy-list { display: block;}

.school-policy-list li { display: block;}

.school-policy-list li a { display: block; position: relative; padding: 18px 0; padding-left: 35px; padding-right: 90px; border-bottom: 1px solid #abaeb4; color: var(--black);}

.school-policy-list li a .bi-file-earmark-pdf { display: inline-block; position: absolute; left: 0; top: 17px; color: red;}

.school-policy-list li a .download { display: inline-block; position: absolute; right: 0; top: 20px; font-size: 14px; font-weight: 600;}

.school-policy-list li a .download:hover { color: red;}







/* ============================================================

   New Sub Pages Begin

   ============================================================ */

.inner-padding-style { padding: 150px 0;}

.sub-banner-block { position: relative;}

.sub-banner-block .inner-dotted-round { display: block; width: 100%; height: 430px; position: absolute; bottom: -60px; left: 0; z-index: 99; background: url(../img/inner-dotted-round-bottom.svg) no-repeat center bottom; background-size: cover;}

.inner-page .sub-banner-block .border-devider { bottom: -43px;}

.inner-devider { height: 105px; border-top-color: #cfb78b;}

.inner-devider .dev-before,

.inner-devider .dev-after { border-color: #cfb78b;}

.sub-banner-block .container { z-index: 999;}

.inner-page { background: var(--dark-blue);}

.inner-page h1 { font-size: 55px; color: var(--secondary-color); text-shadow: 0.075em 0.08em 0.1em rgba(0, 0, 0, 1);}

.inner-page h2 { color: var(--secondary-color);}

.sub-banner-block:after { content: ''; width: 100%; height: 50%; display: block; position: absolute; bottom: 0; left: 0; background: #24452A;

background: linear-gradient(0deg, rgba(36, 69, 42, 1) 17%, rgba(214, 203, 178, 0) 92%);}

.bg-gradiant { background: #01052B; background: linear-gradient(0deg, rgba(1, 5, 43, 1) 35%, rgba(36, 69, 42, 1) 96%) !important;}

.inner-wraper { display: block;}



.left-menu-block { display: block; position: relative;}

.left-menu-head { display: block; border-bottom: 1px solid #ffffff; padding-bottom: 15px;}

.left-menu-block ul { display: block;}

.left-menu-block ul li { display: block; margin-bottom: 15px;}

.left-menu-block ul li a { display: block; position: relative; font-size: 15px; color: var(--white); padding: 3px 0;}

.left-menu-block ul li a:hover { color: var(--secondary-color);}

.left-menu-block ul li.active a { padding-left: 31px; color: var(--secondary-color);}

.left-menu-block ul li.active a::before { content: ''; width: 17px; height: 17px; display: block; position: absolute; left: 0; top: 5px; background: url(../img/diamond-icon.svg) no-repeat left top; background-size: 17px;}



.inner-content-block { display: block;}

.inner-content-block h2 { color: var(--secondary-color);}

.welcome-avatar { display: block; position: relative;}

.left-menu-toggle { display: none; align-items: center; border: none; color: var(--white); background: none; font-weight: 300;}

.left-menu-toggle span { width: 35px; height: 35px; display: flex; align-items: center; justify-content: center; background: var(--white); border-radius: 100%; margin-left: 10px; padding: 8px;}



.float-left { float: left;}

.small-content .sml-img { float: left; margin: 0 20px 15px 0; max-width: 300px; width: 100%;}

.par-testi-video::before { width: 60px; height: 40px; background-size: 16px;}

.ldsp-card-body { padding-top: 15px;}

.ldsp-card-body h2 { font-size: 26px;}

.ldsp-card-body h5 { font-size: .9rem; color: #ffffff; font-weight: 300;}

.full-image-banner::before { opacity: 0.85;}



.admission-calculator .contact-form span { background: #cfb78b; border-radius: 15px; font-weight: 500; font-size: 14px;}

.calculator-output { text-align: center; font-size: 25px; color: var(--secondary-color); background-color: inherit; border: 1px solid var(--secondary-color);}

.calculator-output span { color: var(--secondary-color);font-size: 25px;}

.admission-calculator h4{font-size: 30px; margin-bottom:30px ;}



.inner-content-block .commen-accodian .accordion-box { background: none; border: 1px solid var(--secondary-color);}

.inner-content-block .commen-accodian .accordion-item p { color: var(--primary-color);}

.inner-content-block .commen-accodian .accordion-item.open { background: var(--secondary-color);}

.inner-content-block .commen-accodian .accordion-item.open p a,

.inner-content-block .commen-accodian .accordion-item p a { color: var(--primary-color);}

.inner-content-block .commen-accodian .accordion-item.open .step-count { background: var(--primary-color);}

.inner-content-block .commen-accodian .data { border-top-color: var(--secondary-color); padding: 25px;}

.inner-content-block ul.listing-leftArrow li { background: url(../img/diamond-bullet-point.svg) no-repeat 0 4px; background-size: 14px;}

.note-box { background: var(--secondary-color);}

.bank-account { border: 1px solid #cfb78b;}



.inner-content-block .commen-table table thead tr th { background: var(--secondary-color);}

.inner-content-block .commen-table table tbody tr td { color: var(--black);}

.inner-content-block .commen-table table tbody tr:nth-child(even) td { background: var(--grey);}

.inner-content-block .commen-table .table-responsive { box-shadow: none; border: none;}

.inner-content-block .commen-table table thead tr th { line-height: 1.1;}

.admission-step h2 { font-size: 30px;}

.note-box p,

.note-box p span { color: var(--primary-color);}



.inner-content-block .simple-accodian .data p { color: var(--black);}

.inner-content-block .simple-accodian .data ul li { color: var(--black); font-size: 16px;}

.inner-content-block ul.listing-leftArrow li a { color: var(--secondary-color);}

.inner-content-block .contact-form-block { background: none; border: 1px solid var(--white); border-radius: 15px;}

.inner-content-block .contact-form-block .contact-form .contact-iput { background: none; color: var(--white);}

.inner-content-block .contact-form-block .contact-form select option { color: var(--black);}

.inner-content-block .contact-form-block .contact-form span { background: #ffffff; color: var(--primary-color); border-radius: 15px; font-weight: 500; font-size: 14px;}

.inner-content-block p a { color: var(--secondary-color);}

.commen-table2 th ul li { font-size: 16px;}

.inner-content-block .school-policy-list li a { color: var(--white);}



.learner-card { background: none; border: 1px solid var(--secondary-color);}

.learner-card-img { background: #f0ddba;}

.admission-step h3 { color: var(--secondary-color);}



.stdnt-tstml-block .school-event { border-radius: 16px; overflow: hidden;}

.stdnt-tstml-block .school-event i { display: flex; justify-content: center; align-items: center; width: 50px; height: 50px; position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; z-index: 3; color: var(--secondary-color); font-size: 25px; background: #ffffff; border-radius: 100%;}

.play-btn { display: flex; justify-content: center; align-items: center; width:60px; height:40px; color: #ffffff; font-size: 20px; background: #da2c2b; margin: auto; margin-top: 20px; z-index: 9999; position: absolute; border-radius:8px;}

.play-btn:hover { background: var(--white); color: var(--primary-color);}

.play-btn:hover i { color: var(--primary-color);}



.admission-process { background: none; border: 1px solid var(--secondary-color);}

.admission-process-right h3 { color: var(--secondary-color);}

.contact-form-block { background: none; border: 1px solid var(--white); border-radius: 15px;}

.contact-form span { background: #cfb78b; border-radius: 15px; font-weight: 500; font-size: 14px;}



.inner-content-block  .learner-card-img { min-height: auto; padding: 0;}

.student-leadership-wraper { display: block;}

.student-leadership-card { display: block; padding: 35px 0 25px; border-bottom: 1px solid var(--white);}

.student-leadership-card:first-child { padding-top: 0;}



.student-leadership-main { display: block;}

.student-card { display: block; position: relative;}

.student-card-image { display: block;}

.student-card-body { display: block; padding-top: 15px;}

.student-card-body h5 span { display: block; font-size: 16px; font-weight: 300; padding-top: 5px;}

.learner-profile-page .inner-content-block .learner-card-img { padding: 15px;}



.new-learner-card { display: block; position: relative;}

.new-learner-card-head { display: block; position: relative;}

.new-learner-card-head::after { content: ''; width: 100%; height: 100%; display: block; position: absolute; left: 0; bottom: 0; z-index: 2; transition: all ease-out 0.3s; background: #01052B;

background: linear-gradient(0deg, rgba(1, 5, 43, 0.88) 19%, rgba(9, 19, 43, 0.75) 38%, rgba(36, 69, 42, 0) 96%);}

.new-learner-card-head .head-text { display: block; width: 100%; padding: 20px; position: absolute; left: 0; bottom: 0; z-index: 3;}

.new-learner-card-head .head-text h2 { font-size: 24px; margin-bottom: 15px;}

.new-learner-card-body { display: none;}

.expand-btn { width: 35px; height: 35px; display: block; border: none; background: var(--secondary-color); position: absolute; right: 0; bottom: -15px; left: 0; margin: auto; border-radius: 100%; border: 1px solid #ffffff; z-index: 5;}

.expand-btn::before { content: ''; width: 50%; height: 1px; display: block; background: var(--primary-color); position: absolute; left: 0; top: 0; right: 0; bottom: 0; margin: auto;}

.expand-btn::after { content: ''; height: 50%; width: 1px; display: block; background: var(--primary-color); position: absolute; left: 0; top: 0; right: 0; bottom: 0; margin: auto;}

.new-learner-card.expand .new-learner-card-body { display: block; padding: 25px 0; border-bottom: 1px solid var(--secondary-color);}

.expand-btn.active::after { display: none;}

.new-learner-card .new-learner-card-head:hover::after { background: #01052B; background: linear-gradient(0deg, rgba(1, 5, 43, 0.88) 35%, rgba(9, 19, 43, 0.75) 68%, rgba(36, 69, 42, 0) 96%);}



.stram-exibition { display: block; border-top: 1px solid var(--white); padding-top: 40px;}

.stram-exibition .resp-tabs-container { background-color: transparent;}

.stram-exibition .resp-tab-content { border-color: var(--secondary-color) !important;}

.stram-exibition .resp-tabs-list li { background-color: transparent !important; font-weight: 400; font-size: 18px;}

.stram-exibition .resp-tabs-list li.resp-tab-active { border-color: var(--secondary-color) !important; background: var(--dark-blue) !important;}

.stram-exibition .resp-accordion { color: var(--primary-color);}

.stram-exibition .resp-accordion.resp-tab-active { color: var(--secondary-color); border-color: var(--secondary-color) !important;}



.admission-process { margin-top: 30px;}

.admission-process-left { min-height: 280px;}

















/* ============================================================

   New Sub Pages End

   ============================================================ */





/* .insta-outer-style { background-color: #00000042;padding: 20px; border-radius: 0; position: relative;} */

.insta-outer-style { border-radius: 0; position: relative; height: 100%; background-color: var(--white); padding:30px 0 0 0;}

.event-update-block h3 { font-size: 38px; color: var(--primary-color); font-weight: 400;}

.insta-block{width:500px; margin: 0px auto; position: relative;height: 450px;display: flex;justify-content: center;align-items: center;}

.insta-block .main-img{width: 400px !important;box-shadow: -1px 5px 24px 1px rgba(0,0,0,0.44);

-webkit-box-shadow: -1px 5px 24px 1px rgba(0,0,0,0.44);

-moz-box-shadow: -1px 5px 24px 1px rgba(0,0,0,0.44);}

.sprite{background-repeat:no-repeat;display:block;}



.layer{

  position: absolute;

  z-index: 99999999;

}



.animationimg1 {

  bottom: -20px;

  transition: all ease-out 0.3s;

  animation: animationRotate 18s linear infinite;

  position: absolute;

  right: 10px;

  z-index: 999;

}

.animationimg1 img{width:70px !important;



}



.animationimg2{

  right: 20%;

  top:40px;

   position: absolute;

  transition: all ease-out 0.3s;

  animation: animationRotate 18s linear infinite;

}

.animationimg2 img{width:50px !important;}



.animationimg3{

  right: 0;

  top:50%;

}



.animationimg4{

  right: 14%;

  top:60%;

}





.animationimg5{

  left: 17%;

  top: 4%;

}





.animationimg6{

  left:20%;

  top:60%;

}



.animationimg7{

  left:10%;

  top:50%;

}





.animationimg8{

  right:5%;

  top:99%;

}



.animationimg9{

  left:15%;

  top:7%;

}

.animationimg9 img{border-radius: 0px !important;}



.animationimg10{

  left:20%;

  top:80%;

}



.animationimg11{

  right:20%;

  top:20%;

}



.animationimg12{

  right:20%;

  top:60%;

}



.animationimg13{

  left:20%;

  top:14%;

}





.animationimg14{

  right:15%;

  top:40%;

}





.animationimg15{

  right:10%;

  top:70%;

}









.animationimg16{

  left:20%;

  top:30%;

}





.animationimg17{

  right:20%;

  top:30%;

}



.animationimg18{

  right:25%;

  top:80%;

}





.animationimg19{

  left:20%;

  top:15%;

}



.animationimg20{

  left:25%;

  top:80%;

}





.animationimg21{

  right:25%;

  top:25%;

}



.animationimg22{

  right:20%;

  top:90%;

}





.animationimg23{

  right:20%;

  top:30%;

}





@keyframes animationRotate {



  0% {



    transform :rotate(0deg);



  }



  100% {



    transform :rotate(360deg);



  }



}





.astronaut{text-align: center; margin: 0px auto;}

.astronaut .astronaut-img{margin: 0px auto; text-align: center;}



.vibrate-1 {

	-webkit-animation: vibrate-1 0.7s linear infinite ;

	        animation: vibrate-1 0.7s linear infinite ;

          position: relative;

}



/**

 * ----------------------------------------

 * animation vibrate-1

 * ----------------------------------------

 */

@-webkit-keyframes vibrate-1 {

  0% {

    -webkit-transform: translate(0);

            transform: translate(0);

  }

  20% {

    -webkit-transform: translate(-2px, 2px);

            transform: translate(-2px, 2px);

  }

  40% {

    -webkit-transform: translate(-2px, -2px);

            transform: translate(-2px, -2px);

  }

  60% {

    -webkit-transform: translate(2px, 2px);

            transform: translate(2px, 2px);

  }

  80% {

    -webkit-transform: translate(2px, -2px);

            transform: translate(2px, -2px);

  }

  100% {

    -webkit-transform: translate(0);

            transform: translate(0);

  }

}

@keyframes vibrate-1 {

  0% {

    -webkit-transform: translate(0);

            transform: translate(0);

  }

  20% {

    -webkit-transform: translate(-2px, 2px);

            transform: translate(-2px, 2px);

  }

  40% {

    -webkit-transform: translate(-2px, -2px);

            transform: translate(-2px, -2px);

  }

  60% {

    -webkit-transform: translate(2px, 2px);

            transform: translate(2px, 2px);

  }

  80% {

    -webkit-transform: translate(2px, -2px);

            transform: translate(2px, -2px);

  }

  100% {

    -webkit-transform: translate(0);

            transform: translate(0);

  }

}



.currentColor{fill: var(--white) !important; background-color: #fff !important;}

.tp-offcanvas-2-close-btn .text span {color: #fff;}

.tp-offcanvas-2-close-btn svg path { stroke:#ffffff}



.insta-block-outer { background-color: var(--white); max-width: 600px; margin: 0px auto; padding: 15px;}

.insta-block-outer .head-insta{display: flex; align-items: center;}

.insta-block-outer .dp-box{margin-right: 15px; width: 40px; height: 40px; background-color: var(--black); border-radius: 100%; overflow: hidden; }

.insta-block-outer .title{font-weight: 500; color: var(--primary-color);}

.insta-block-outer .insta-slider{margin:15px 0 0 0;}

.insta-block-outer .insta-slider .owl-dots{margin:20px auto}

.insta-block-outer .insta-slider .owl-dots .owl-dot{background-color: var(--primary-color) !important;}

.insta-block-outer .insta-slider .owl-dots .owl-dot.active{background-color: var(--secondary-color) !important}

.insta-block-outer .insta-bottom {
  width:100%;
  justify-content: space-between;
  display: flex;
  background: #fff;
  padding-top: 15px;
}


.event-block { width: 100%; height: auto;  margin: 0px auto; padding: 10px 10px 26px 10px; height: auto; display: flex; align-items: center;}

.event-slider { width: 100%; margin: 0px auto;}

.event-slider .owl-item {margin:0 auto 0;}

.event-slider .owl-dots .owl-dot{margin-top: 20px;background-color: var(--primary-color) !important;}

.event-slider .owl-dots .owl-dot.active{background-color: var(--secondary-color) !important}









.flight-object {

  position: absolute;

  bottom: 0;

  right: 0;

  animation: flyTopLeft 4s ease-in-out infinite;

}



@keyframes flyTopLeft {

  0% {

    transform: translate(0, 0) rotate(0deg);



  }





  100% {

    transform: translate(-30vw, -100vh) rotate(-10deg);

 

  }

}



.bank-card{border-radius:30px;padding:40px; width:auto;background: #24452A;

background: linear-gradient(136deg, rgba(36, 69, 42, 1) 0%, rgba(25, 41, 81, 1) 100%);box-shadow: 1px 0px 5px 0px rgba(0,0,0,0.11);

-webkit-box-shadow: 1px 0px 5px 0px rgba(0,0,0,0.11);

-moz-box-shadow: 1px 0px 5px 0px rgba(0,0,0,0.11);}

.bank-card h5{font-weight: 500; font-size: 16px; display: block; margin-bottom: 10px; color: var(--secondary-color);}

.bank-card .number{border-bottom: 1px solid var(--white); padding: 0 0 10px 0; font-size: 18px; display: block;}



ul.payment-methods li{display: inline-block; margin-right: 15px; text-align: center;}

ul.payment-methods li img{width: 50px; margin-bottom: 10px;}

ul.payment-methods li span{display: block; font-size: 15px;}

.footer-contact-left{justify-content: left !important;}



.journey-space{margin: 50px 0 0 0; background: #04130E, ;

background: linear-gradient(146deg, rgba(4, 19, 14, 1) 0%, rgba(0, 3, 31, 1) 100%); border-radius: 15px; border: 1px solid var(--secondary-color);}

.journey-space-inner{background: url(../img/space.webp) bottom no-repeat;padding: 50px;}

.exhibitions-block h4{margin: 20px 0; font-size: 25px;}



.footer-bottom-links { display: flex; align-items: center; justify-content: center; flex-wrap: wrap;}

.footer-bottom-links li { display: block; padding: 0 15px; border-left: 1px solid #d4daeb; line-height: 1.1;}

.footer-bottom-links li:first-child { border-left: 0; padding-left: 0;}

.footer-bottom-links li a { font-size: 16px; color: #d4daeb; display: block;}

.footer-bottom-links li a:hover { color: var(--white);}



.sitemap-box { display: block;}

.sitemap-box h2 { margin-bottom: 25px;}

.sitemap-box h2 a { color: var(--secondary-color); text-decoration: underline;}

.sitemap-box ul { margin-bottom: 35px;}

.sitemap-box ul li { margin-bottom: 7px;}

.sitemap-box ul li a { display: block; position: relative; font-size: 20px; color: var(--white); padding: 3px 0; padding-left: 31px;}

.sitemap-box ul li a:hover { color: var(--secondary-color);}

.sitemap-box ul li a::before { content: ''; width: 16px; height: 16px; display: block; position: absolute; left: 0; top: 9px; background: url(../img/diamond-icon.svg) no-repeat left top; background-size: 16px;}



.terms-block h3 { color: var(--secondary-color); font-size: 30px;}

.terms-block ul { margin-bottom: 35px;}

.terms-block ul li { margin-bottom: 7px; display: block; position: relative; font-size: 20px; color: var(--white); padding: 3px 0; padding-left: 31px;}

.terms-block ul li::before { content: ''; width: 16px; height: 16px; display: block; position: absolute; left: 0; top: 9px; background: url(../img/diamond-icon.svg) no-repeat left top; background-size: 16px;}



.header-right-block { display: flex; flex-wrap: wrap; align-items: center; position: relative;}

.menu-show .bottom-menu-tog-text { display: none;}

.menu-show .top-menu-toggle .top-menu-tog-text { display: none;}

.menu-show .portal-click { margin-right: 0;}

.menu-hide .portal-click { margin-right: 0;}



.pay-fees-block h4 { font-size: 28px;}

.learner-profile-page .inner-content-block .learner-card-img { padding: 0;}

.learner-card-body { padding: 35px;}



.overflow-hidden { overflow: hidden;}


.insta-block-outer { padding:10px; max-width: 100%; position: relative; width: 100%;}
.animationimg2 { top: 0;}

.insta-block-outer-main{align-items: center; display: flex;height: auto; background-color: var(--white);}


.newsletter-section h3{margin-bottom: 0px; padding-bottom: 0px;}
.newsletter-section ul li{display: inline-block;}
.newsletter-section .newsletter-item{-webkit-border-radius: 7px;-moz-border-radius: 7px;border-radius: 7px; padding: 20px; background-color: var(--white); text-align: center; display: block; text-align: center; color: var(--dark-blue); margin-top: 20px; font-size: 14px;}
.newsletter-section .newsletter-item span{display: block; color: var(--dark-blue); font-weight: bold;}
.newsletter-section {font-size: 18px;}
.newsletter-section .newsletter-item:hover{background-color: var(--dark-golden); color: var(--secondary-color);}
.newsletter-section .newsletter-item:hover span{color: var(--white);}

.language-btn { font-family: 'ge_dinar_onemedium'; color: var(--dark-blue); font-weight: 600; margin-right: 10px; font-size:15px; padding: 15px 25px;}
.test{width: 100px; height: 100px; background-color: #000; display: block;}




.dropdown .dropdown-menu {
    background-color: inherit;
    display: none !important;
    padding: 15px;
    margin-bottom: 0px;
    margin-left: 15px;
    border: none;
      transform: scaleY(0);    
    transform-origin: top;
    transition: transform 0.26s ease !important;
  opacity:0;
  transition: opacity .25s ease-in-out !important;
  -moz-transition: opacity .25s ease-in-out !important;
  -webkit-transition: opacity .25s ease-in-out !important;
  border-left: 1px solid var(--white);
  padding-left: 15px;
}

.dropdown:hover .dropdown-menu {
    display:block !important;
    margin-top: 0; /* remove the gap so it doesn't close */
    transform: scaleY(1);
        transition: transform 0.26s ease !important;
opacity: 1;
    

}

.dropdown .dropdown-menu li a{color: var(--white) !important; font-size: 16px !important;}
.dropdown .dropdown-menu li a:hover{color: #b9ccfa !important;}
.dropdown-toggle::after {
  content: "\f282";
  border: none;
  font-family: bootstrap-icons !important;
  color: var(--secondary-color);
  top: 5px;
  position: relative;
  left: 15px;
  font-size: 15px;
}
.inner-menu-list{margin-left: 15px;}
ul.inner-menu-list {
    margin-top: 10px;
    border-left: 1px solid #fff;
    padding-left: 16px;
}
ul.inner-menu-list a {
    font-size: 14px !important;
}
.simple-accodian .accordion-box h4{color: var(--black) !important; font-weight:bold;}
h1.ng-binding{color: var(--white) !important; box-shadow: none;}
/* .why-us-block::after {
  content: "55";
  width: 100%;
  background-color: #000;
  height: 100px;
  top: -87px;
  position: absolute;
}
 */












/*
font-family: "Montserrat", sans-serif;
*/


/* 
:root {
  --white: #ffffff; 
  --black: #000000;
  --grey: #f8f8f8;
  --primary-color: #16254c;
  --secondary-color: #cfb78b;
  --dark-golden: #685326;
  --light-blue: #e0f5ff;
  --dark-blue: #01052b;
} 
*/