@import url(https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap);
@import url(https://fonts.googleapis.com/css2?family=Itim&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap);
body{
    font-family: "Poppins", serif;
    font-weight: 300;
    font-style: italic;
}
	*,.navigation ul {
	margin:0
}
::selection{color: #fff;background: #2dce89;}
.content-section .bar,.right-text .bar,.section-title .bar {
	height:4px;
	width:85px;
	background:#10af60;
	border-radius:5px;
	overflow:hidden
}
#copy-right,.content-section h6,.download-content h3,.section-title h2 {
	text-align:center
}
#download-app,.about-section,.content-section,.modal,.right-text .bar,.section-title .bar {
	overflow:hidden
}
.key-points li,.right-text li {
	list-style:none
}
* {
	padding:0;
	box-sizing:border-box
}
.sec-padding {
	padding:50px 0
}
.footer-padding {
	padding:21px 0 0
}
.clearfix {
	clear:both;
	content:""
}
.container1 {
	width:100%;
	margin:0 auto;
	position:relative;
	z-index:5
}
.container2 {
	width:80%;
	margin-left:auto;
	height:100%
}
a:hover {
	text-decoration:none!important
}
.side-navigation {
	position:fixed;
	top:20%;
	margin-left:40px;
	z-index:11
}
#box,#download-app,#menu li a,#two,.download-content,.right-text .bar,.section-title .bar,.single-protfolio {
	position:relative
}
.navigation ul li {
	margin:0 0 8px;
	display:block
}
.navigation ul li a {
	width:75px;
	height:75px;
	background:#fff;
	border-radius:50%;
	padding:8px;
	display:flex;
	justify-content:center;
	align-items:center;
	flex-direction:column;
	-webkit-box-shadow:inset 7px 3px 18px 0 rgb(215 215 215);
	-moz-box-shadow:inset 7px 3px 18px 0 rgb(215 215 215);
	box-shadow:inset 7px 3px 18px 0 rgb(215 215 215);
	margin:0 0 8px;
	font-size:10px;
	color:#207eaa;
	line-height:13px;
	font-weight:700
}
.navigation ul li a img {
	width:30px;
	padding-bottom:2px
}
.img-23 {
	width:150px
}
#shadow,.logo {
	width:200px;
	height:65px
}
@media only screen and (max-width:1260px) {
	.side-navigation {
	margin-left:15px
}
}
#download-app {
	background-image:url(../assets/request-page/image\ DARKGREEN.png);
	background-position:center;
	background-size:cover;
	background-repeat:no-repeat;
	width:100%;
	height:400px;
	z-index:1;
	padding:10px;
	display:flex;
	align-items:center;
	justify-content:center
}
#download-app::before {
	content:'';
	position:absolute;
	left:0;
	width:100%;
	height:100%;
	background-color:rgb(70 201 159 / 50%);
	backdrop-filter:blur(1px);
	z-index:2
}
.download-content {
	height:100%;
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	z-index:4
}
.download-content h3 {
	color: #fff;
    line-height: 50px;
    font-size: 40px;
}
.download-content h5{
    color: #fff;
    font-weight: 300;
    font-size: 15px;
}
.content-section h6,.content-section p,.right-text p {
	color:#666;
	font-weight:400
}
.download-content ul {
	display:flex;
	justify-content:space-evenly;
	align-items:center;
	min-width:150px
}
#menu li,.image img,.social-icons ul li {
	display:inline-block
}
.download-content ul a,.single-protfolio:hover h3,.single-protfolio:hover span {
	color:#fff
}
.download-content ul a:hover {
	color:#10af60;
	transition:1s ease-in-out
}
.download-content svg {
	padding:1px 10px;
	font-size:20px
}
.left-image img {
	max-width:100%;
	-webkit-animation:.4s infinite alternate bounce;
	margin-top:20px
}
@-webkit-keyframes bounce {
	0% {
	text-shadow:0 5px 0 #ccc,0 2px 3px #000
}
100% {
	transform:translateY(-20px);
	text-shadow:0 50px 0 #000,0 0 20px rgba(0,0,0,.8)
}
}
.right-text h3 {
	font-size:40px
}
.right-text .bar {
	margin-bottom:16px
}
.content-section .bar::before,.right-text .bar::before,.section-title .bar::before {
	content:'';
	position:absolute;
	left:0;
	top:0;
	height:100%;
	width:5px;
	background:#fff;
	-webkit-animation-duration:2s;
	animation-duration:2s;
	-webkit-animation-timing-function:linear;
	animation-timing-function:linear;
	-webkit-animation-iteration-count:infinite;
	animation-iteration-count:infinite;
	-webkit-animation-name:MOVE-BG;
	animation-name:MOVE-BG
}
@keyframes MOVE-BG {
	0% {
	-webkit-transform:translateX(0);
	transform:translateX(0)
}
100% {
	-webkit-transform:translateX(85px)
}
}
.right-text h4 {
	margin-bottom:10px;
	margin-top:10px;
	line-height:1.8
}
.right-text p {
	margin-bottom:1px;
	line-height:1.8;
	font-size:16px
}
span {
	color:#28a745;
}
.content-section .bar {
	position:relative;
	margin-bottom:10px
}
.fot-location,.point-section {
	display:flex
}
.point-section i {
	padding:10px;
	transform-origin:top center;
	animation:2s infinite swing
}
.content-section h4 {
	font-size:30px;
	margin-top:20px;
	margin-bottom:20px
}
.content-section h5,.content-section h6,.content-section p {
	line-height:1.8;
	font-size:16px
}
.content-section p {
	margin-bottom:20px
}
.content-section h6 {
	margin-bottom:40px
}
.content-section h5 {
	color:#000;
	font-weight:500;
	margin-bottom:10px
}
.foot-contact input,.foot-contact textarea {
	background:#ffffff;
	font-size:14px;
	color:#fff;
	padding:10px;
	width:100%
}
@keyframes grow {
	from {
	transform:scale(0)
}
to {
	transform:scale(1)
}
}
.section-title .bar {
	margin:20px auto
}
.protfolio-section.bg-color {
	background-color:#f2f0fe
}
.image img {
	width:100%
}
#two {
	z-index:1;
	display:block;
	opacity:0;
	transition:1s linear
}
#one {
	position:absolute;
	z-index:0
}
#one:hover+#two,#two:hover {
	opacity:1
}
.single-protfolio {
	margin-bottom:30px;
	-webkit-transition:.5s;
	transition:.5s;
	box-shadow:rgba(0,0,0,.35) 0 5px 15px
}
.single-protfolio:hover {
	margin-top:-10px;
	background:linear-gradient(87deg,#2dce89 0,#2dcecc 100%)
}
.single-protfoli .single-protfolio .content {
	-webkit-box-shadow:0 5px 40px 0 rgba(0,0,0,.11);
	box-shadow:0 5px 40px 0 rgba(0,0,0,.11);
	-webkit-transition:.5s;
	transition:.5s
}
.single-protfolio .content {
	padding:30px
}
.single-protfolio .content h3 {
	font-size:20px;
	margin-bottom:15px;
	color:#000
}
.single-protfolio .content span {
	color:#000;
	font-weight:200
}
#footer {
	background:#fff
}
.footercontct {
	color:#fff;
	font-size:35px;
	font-weight:700;
	margin-bottom:15px
}
.foot-contact input {
	border:none;
	margin-bottom:15px;
	border-radius:5px
}
.foot-contact textarea {
	margin-top:0;
	margin-bottom:15px;
	border-radius:5px;
	border:none;
	height:120px
}
.foot-contact .footer-btnn {
	border:none;
	width:140px;
	border-radius:14px;
	-moz-box-shadow:0 7px 15px -3px rgb(163 163 163 / 46%);
	box-shadow:0 7px 15px -3px rgb(24 24 24 / 46%)
}
.foot-contact .footer-btnn a {
	font-size:16px;
	font-weight:500;
	display:block;
	padding:9px;
	color:#2dce89;
	border-radius:14px
}
.social-icons {
	margin-top:25px
}
.social-icons ul {
	display:flex;
	justify-content:center;
	align-items:center
}
.social-icons ul li a {
	font-size:30px;
	color:#fff;
	margin:0 20px 0 0
}
.txtrigh {
	text-align:right
}
:focus-visible {
	outline:0
}
.fot-location i {
	color:#fff;
	padding:8px
}
.fot-location span {
	color:#fff;
	font-size:17px;
	font-weight:600
}
.fot-location p {
	font-size:12px;
	color:#ffffffa1;
	font-weight:200
}
.fort-location-main {
	height:100%;
	display:flex;
	flex-direction:column;
	justify-content:center
}
.foot-nav ul {
	margin:0;
	padding:20px 0 0;
	display:block
}
#menu li,.foter-main i {
	padding:0 8px
}
.foot-nav ul li {
	display:block;
	padding:5px 0;
	transition:.5s
}
.foot-nav ul li:hover a {
	color:#fff;
	transition:.5s
}
.foot-nav ul li a {
	color:#ffffffa1;
	display:flex;
	align-items:center;
	font-size:14px
}
.foot-nav ul li a img {
	width:20px;
	margin-right:7px
}
.foot-logo a {
	width:100%;
	height:100%;
	display:block
}
.foot-logo a img {
	width:110px
}
.foot-nav-main {
	height:100%;
	display:flex;
	justify-content:center;
	flex-direction:column
}
.foter-main {
	display:block;
	font-size:13px!important;
	color:#ffffffa1!important;
	font-weight:200!important
}
#copy-right {
	background-color:#fff;
	padding:22px 0
}
#header,header.fixed-to-top {
 /* background: linear-gradient(87deg, #28a745 0, #28a745 100%); */
 background: #28a745;
}
#content,#menu {
	text-align:right
}
#copy-right h5 {
	margin:0;
	font-size:13px;
	color:#000;
	font-weight:400
}
#copy-right h5 a {
	margin:0;
	font-size:13px;
	color:#10af60;
	font-weight:400;
	text-decoration:underline
}
@keyframes ripple {
	0% {
	box-shadow:0 0 0 0 rgba(30,125,169,.1),0 0 0 .2em rgba(30,125,169,.1),0 0 0 .3em rgba(30,125,169,.1),0 0 0 .4em rgba(30,125,169,.1)
}
100% {
	box-shadow:0 0 0 .2em rgba(30,125,169,.1),0 0 0 .3em rgba(30,125,169,.1),0 0 0 .4em rgba(30,125,169,.1),0 0 0 1em rgba(30,125,169,0)
}
}
@keyframes lipple {
	0% {
	box-shadow:0 0 0 0 rgba(228,228,228,.4),0 0 0 .4em rgba(228,228,228,.4),0 0 0 .6em rgba(228,228,228,.4),0 0 0 .8em rgba(228,228,228,.4)
}
100% {
	box-shadow:0 0 0 .4em rgba(228,228,228,.4),0 0 0 .6em rgba(228,228,228,.4),0 0 0 .8em rgba(228,228,228,.4),0 0 0 1em rgba(228,228,228,0)
}
}
@keyframes kipple {
	0% {
	box-shadow:0 0 0 0 rgba(30,125,169,.1),0 0 0 .4em rgba(30,125,169,.1),0 0 0 .6em rgba(30,125,169,.1),0 0 0 .8em rgba(30,125,169,.1)
}
100% {
	box-shadow:0 0 0 .4em rgba(30,125,169,.1),0 0 0 .6em rgba(30,125,169,.1),0 0 0 .8em rgba(30,125,169,.1),0 0 0 1em rgba(30,125,169,0)
}
}
@keyframes UpDown {
	0%,100% {
	bottom:0
}
50% {
	bottom:1em
}
}
@keyframes UpDown-mid {
	0%,100% {
	top:0
}
50% {
	top:20px
}
}
#header {
	width:100%;
	height:85px;
	padding:10px;
	position:fixed;
	line-height:60px;
	z-index:111;
	transition:.5s ease-in-out;
	top:0
}
header.fixed-to-top {
	padding:0!important;
	height:65px!important
}
.nav-wrapper {
	display:flex;
	height:65px;
	align-items:center
}
.logo {
	margin:0
}
.logo a img {
	width: 190px;
    margin-left: 0;
    height: 80%;
    padding: 3px 0px;
}
#content {
	width:100%;
	height:100%
}
#shadow {
	position:absolute;
	z-index:-1;
	content:"";
	background:rgba(0,0,0,.5);
	left:4px;
	top:4px;
	filter:blur(40px);
	-webkit-clip-path:polygon(0 100%,0 0,100% 0,80% 100%)
}
#menu {
	margin:0;
	flex:1;
	-webkit-transition:transform .5s ease-out;
	padding-right:30px
}
#menu li,#menu li a img,#menu li:hover {
	transition:.4s
}
#menu li a {
	color:#ffffffde;
	font-size:12px;
	text-decoration:none;
	text-transform:uppercase;
	padding:0 0 7px;
	transition:2s;
	font-weight:700
}
#menu li a::after {
	content:"";
	position:absolute;
	background-color:#fff;
	left:0;
	bottom:0;
	opacity:0;
	animation:forwards fill;
	-webkit-animation:forwards fill;
	-moz-animation:forwards fill;
	width:0%;
	height:2px
}
#menu li:hover a::after {
	animation:1s forwards fill;
	-webkit-animation:1s forwards fill;
	-moz-animation:1s forwards fill;
	transition:1s;
	width:100%;
	opacity:1
}
#menu li a img {
	width:15px;
	margin:-8px 5px 0 2px;
	opacity:1
}
.mysocial {
	width:160px
}
.mysocial ul {
	display:flex;
	margin:0
}
.mysocial ul li {
	display:block;
	margin:0 5px
}
.mysocial ul li a {
	color:#fff;
	display:flex
}
.mysocial ul li a i {
	font-size:20px
}
/* Mega menu layout */
.dropdown-menu.mega-dropdown {
  width: 950px;
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%) translateY(20px);
  /* background: rgba(255, 255, 255, 0.85); */
  background: #fff;
  backdrop-filter: blur(10px);
  border-radius: 16px;
  padding: 40px;
  display: none;
  z-index: 9999;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
  opacity: 0;
  visibility: hidden;
  transition: all 0.4s ease;
}

/* Show dropdown on hover */
.nav-item.dropdown:hover .dropdown-menu {
  display: block;
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
}

/* Dropdown row layout */
.dropdown-menu .row {
  display: flex;
  flex-wrap: nowrap; /* Ensures items stay in a row */
  justify-content: space-between;
}

.dropdown-menu .col-md-4 {
  flex: 1 1 0; /* All 3 columns share space equally */
  min-width: 0;
  padding: 0 15px;
}


/* Headers */
.dropdown-header {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 20px;
  color: #333;
  position: relative;
}

.dropdown-header::after {
  content: '';
  display: block;
  width: 30px;
  height: 3px;
  background: linear-gradient(to right, #7bff00, #28a744);
  margin-top: 6px;
  border-radius: 2px;
}

/* Dropdown items */
.dropdown-item {
  position: relative;
  display: flex;
  align-items: center;
  font-size: 15px;
  color: #222 !important;
  padding: 8px 0;
  transition: all 0.3s ease;
}

.dropdown-item:hover {
  color: #28a744 !important;
  padding-left: 8px;
}

/* Optional icons - if you add <i class="..."> in items */
.dropdown-item i {
  margin-right: 10px;
  font-size: 16px;
  color: #555;
  transition: color 0.3s ease;
}

.dropdown-item:hover i {
  color: #28a744;
}

/* Responsive tweaks */
@media (max-width: 768px) {
  .dropdown-menu.mega-dropdown {
    width: 100%;
    left: 0;
    transform: translateY(20px);
    padding: 20px;
  }

  .dropdown-menu .row {
    flex-direction: column;
  }

  .dropdown-header {
    font-size: 20px;
  }

  .dropdown-item {
    font-size: 16px;
  }
}
.dropdown-menu.mega-dropdown {
  max-width: 100vw;
  overflow-x: auto;
}
@media(max-width:991px) {
	#menu,.mysocial {
	display:none
}
#header {
	padding:0;
	height:65px
}
.menuIcon {
	cursor:pointer;
	display:block;
	position:fixed;
	right:15px;
	top:20px;
	height:23px;
	width:27px;
	z-index:12
}
.icon-bars,.icon-bars::after,.icon-bars::before {
	background:#fff;
	position:absolute;
	height:2px
}
.icon-bars {
	left:1px;
	top:45%;
	width:20px;
	-webkit-transition:.4s;
	transition:.4s
}
.icon-bars::before {
	content:'';
	left:0;
	top:-8px;
	width:20px;
	-webkit-transition:width .3s .4s;
	transition:width .3s .4s
}
.icon-bars::after {
	margin-top:0;
	content:'';
	left:0;
	bottom:-8px;
	width:20px;
	-webkit-transition:width .3s .4s;
	transition:width .3s .4s
}
.icon-bars.overlay {
	background:#b7c7d3;
	width:20px;
	animation:3s .5s infinite middleBar;
	-webkit-animation:3s .5s infinite middleBar
}
@keyframes middleBar {
	0%,100% {
	width:0
}
50% {
	width:20px
}
}
@-webkit-keyframes middleBar {
	0%,100% {
	width:0
}
50% {
	width:20px
}
}
.icon-bars.overlay::before {
	background:#b7c7d3;
	width:10px;
	animation:3s .2s infinite topBar;
	-webkit-animation:3s infinite topBar
}
@keyframes topBar {
	0%,100% {
	width:0
}
50% {
	width:10px
}
}
@-webkit-keyframes topBar {
	0%,100% {
	width:0
}
50% {
	width:10px
}
}
.icon-bars.overlay::after {
	background:#b7c7d3;
	width:15px;
	animation:3s 1s infinite bottomBar;
	-webkit-animation:3s 1s infinite bottomBar
}
@keyframes bottomBar {
	0%,100% {
	width:0
}
50% {
	width:15px
}
}
@-webkit-keyframes bottomBar {
	0%,100% {
	width:0
}
50% {
	width:15px
}
}
.menuIcon.toggle .icon-bars {
	top:5px;
	transform:translate3d(0,5px,0) rotate(135deg);
	transition-delay:0.1s;
	transition:transform .4s cubic-bezier(.68, -.55, .265, 1.55)
}
.menuIcon.toggle .icon-bars::before {
	top:0;
	transition-delay:0.1s;
	opacity:0
}
.menuIcon.toggle .icon-bars::after {
	top:10px;
	transform:translate3d(0,-10px,0) rotate(-270deg);
	transition-delay:0.1s;
	transition:transform .4s cubic-bezier(.68, -.55, .265, 1.55)
}
.menuIcon.toggle .icon-bars.overlay {
	width:20px;
	opacity:0;
	-webkit-transition:none;
	transition:none
}
}
.hide_show_over,.modal,.overlay-menu {
	position:fixed;
	height:100%
}
.overlay-menu {
	 background:#28a745;
	color:#0d1a26;
	display:flex;
	backdrop-filter:blur(14px);
	flex-direction:column;
	box-shadow:-4px 0 24px -9px rgb(0 0 0 / 72%);
	-webkit-box-shadow:-4px 0 24px -9px rgb(0 0 0 / 45%);
	-moz-box-shadow:-4px 0 24px -9px rgba(0,0,0,.72);
	top:0;
	width:300px;
	padding:10px 5px 0;
	right:0;
	transform:translateX(100%);
	-webkit-transition:transform .2s ease-out;
	transition:transform .2s ease-out;
	z-index:3
}
.overlay-menu #menu {
	display:flex;
	flex-direction:column;
	flex:1;
	text-align:left;
	align-items:start;
	padding:0
}
.overlay-menu #menu .sidemenu-side {
	line-height:30px;
	justify-content:start;
	border-radius:13px;
	align-items:center;
	background-color:#28a745;
	transition:.5s;
	margin:7px;
	box-shadow:5px 5px 9px #7070708c
}
.overlay-menu #menu .sidemenu-side:hover {
	background:#28a744;
	box-shadow:inset -2px -3px 7px #828282b8;
	transition:.5s
}
.overlay-menu #menu .sidemenu-side a {
	color:#2dce89;
	font-size:12px;
	font-weight:700;
	text-align:center;
	letter-spacing:-1px
}
.overlay-menu #menu .sidemenu-side img {
	filter:none;
	margin:0;
	width:30px
}
.overlay-menu .sidemenu-side a {
	display:block;
	font-size:1.8em;
	letter-spacing:4px;
	padding:10px 0;
	text-align:right;
	text-transform:uppercase;
	-webkit-transition:color .3s;
	transition:color .3s
}
.overlay-menu .sidemenu-side a span {
	display:block
}
.overlay-menu .sidemenu-side a:active,.overlay-menu .sidemenu-side a:hover {
	color:#1c79b8;
	-webkit-transition:color .3s;
	transition:color .3s
}
.overlay-menu .logo1 {
	width:100%;
	margin-bottom:20px
}
.overlay-menu .logo1 img {
	width:141px;
	padding:10px
}
.mysocial1 {
	margin-top:10px;
	text-align:center
}
.mysocial1 ul li a i {
	font-size:26px
}
.hide_show_over {
	margin:0;
	padding:0;
	width:100%;
	float:left;
	background:#f9f9f9;
	top:0;
	z-index:999999999;
	display:block;
	align-items:center
}
.hide_show_over img {
	margin:auto;
	position:absolute;
	left:0;
	right:0;
	top:0;
	bottom:0;
	width:34%;
	animation:2s infinite grow
}
.modal {
	display:none;
	left:0;
	top:0;
	width:100%;
	background-color:rgba(0,0,0,.4)
}
.modal-content {
	width:90%;
	height:80%;
	padding:28px 40px 15px;
	max-width:1000px;
	background-color:#fff;
	display:flex;
	flex-direction:column;
	overflow-y:auto;
	border-radius:0;
	position:relative;
	margin:0;
	transform:translate(-50%,-50%);
	top:10%;
	left:10%;
	transform:scale(.7);
	transition:transform .3s
}
.zoom-in.show {
	transform:scale(1)
}
.modal-content::-webkit-scrollbar {
	width:8px;
	display:none
}
.modal-content::-webkit-scrollbar-track {
	background-color:#fff;
	border-radius:10px;
	display:none
}
.modal-content::-webkit-scrollbar-thumb {
	border-radius:10px;
	background-color:#fff
}
.modal-content::-webkit-scrollbar-thumb:hover {
	background-color:#fff
}
.main-text {
	width:100%;
	padding:0 30px
}
.main-text p {
	text-align:start;
	font-size:15px;
	line-height:34px;
	margin-bottom:0;
	color:#000
}
.modal-content .logo {
	width:100%;
	text-align:center;
	margin-bottom:30px
}
.modal-content .logo img {
	width:100px;
	height:auto;
	display:block;
	margin:0 auto
}
.modal-content .text p {
	color:#000;
	text-align:center;
	margin-bottom:20px
}
.key-feature,.key-points {
	width:100%;
	margin-top:30px
}
.key-feature h4 {
	color:#000;
	font-size:27px;
	padding:0 30px
}
.key-points li {
	color:#000;
	font-size:13px;
	text-align:start;
	padding:0 30px 10px 13px
}
.key-points li i {
	margin-right:10px;
	animation:2s infinite swing
}
.key-points .point-section {
	display:flex;
	padding:10px 0 0 26px
}
@keyframes swing {
	20% {
	transform:rotate(15deg)
}
40% {
	transform:rotate(-10deg)
}
60% {
	transform:rotate(5deg)
}
80% {
	transform:rotate(-5deg)
}
100% {
	transform:rotate(0)
}
}
.close {
	position:absolute;
	top:50px;
	right:50px;
	color:#000;
	font-size:28px;
	font-weight:700;
	transition:.3s;
	z-index:1
}
.close:focus,.close:hover {
	color:#000;
	text-decoration:none;
	cursor:pointer
}
@media only screen and (max-width:575px) {
	#content {
	text-align:left
}
}
@media (min-width:260px) and (max-width:575px) {
	.about-section,.content-section {
	padding:10px 20px 0
}
.protfolio-section {
	padding:10px 10px 0
}
.key-points li {
	text-align:start
}
.modal {
	display:none;
	position:fixed;
	width:100%;
	height:100%;
	overflow:hidden;
	background-color:rgba(0,0,0,.5)
}
.modal-content {
	width:90%;
	height:80%;
	padding:28px 10px 15px;
	max-width:1000px;
	background-color:#fff;
	display:flex;
	flex-direction:column;
	overflow-y:auto;
	border-radius:0;
	position:relative;
	margin:0;
	transform:translate(-50%,-50%);
	top:10%;
	left:5%;
	transform:scale(.7);
	transition:transform .3s
}
.modal-content::-webkit-scrollbar {
	width:8px;
	display:none
}
.modal-content::-webkit-scrollbar-track {
	background-color:#fff;
	border-radius:10px;
	display:none
}
.modal-content::-webkit-scrollbar-thumb {
	border-radius:10px;
	background-color:#fff
}
.modal-content::-webkit-scrollbar-thumb:hover {
	background-color:#fff
}
.main-text {
	width:100%;
	padding:0 30px
}
.main-text p {
	text-align:start;
	font-size:15px;
	line-height:34px;
	margin-bottom:0;
	color:#000
}
.modal-content .logo {
	width:100%;
	text-align:center;
	margin-bottom:30px
}
.modal-content .logo img {
	width:100px;
	height:auto;
	display:block;
	margin:0 auto
}
.modal-content .text p {
	color:#000;
	text-align:center;
	margin-bottom:20px
}
.key-feature {
	width:100%;
	margin-top:30px
}
.key-feature h4 {
	color:#000;
	font-size:27px;
	padding:0 30px
}
.key-points {
	display:flex;
	justify-content:space-evenly;
	width:100%;
	margin-top:30px
}
.key-points li {
	color:#000;
	font-size:15px;
	list-style:none;
	text-align:start;
	padding:0 30px 10px 13px
}
.key-points li i {
	margin-right:10px;
	animation:2s infinite swing
}
.key-points .point-section {
	display:flex;
	padding:10px 0 0 26px
}
@keyframes swing {
	20% {
	transform:rotate(15deg)
}
40% {
	transform:rotate(-10deg)
}
60% {
	transform:rotate(5deg)
}
80% {
	transform:rotate(-5deg)
}
100% {
	transform:rotate(0)
}
}
.close {
	position:absolute;
	top:30px;
	right:30px;
	color:#000;
	font-size:40px;
	font-weight:700;
	transition:.3s;
	z-index:1
}
.close:focus,.close:hover {
	color:#000;
	text-decoration:none;
	cursor:pointer
}
}
@media (min-width:500px) and (max-width:989px) {
	.modal {
	display:none;
	position:fixed;
	width:100%;
	height:100%;
	overflow:hidden;
	background-color:rgba(0,0,0,.5)
}
.modal-content {
	width:90%;
	height:80%;
	padding:28px 10px 15px;
	max-width:1000px;
	background-color:#fff;
	display:flex;
	flex-direction:column;
	overflow-y:auto;
	border-radius:0;
	position:relative;
	margin:0;
	transform:translate(-50%,-50%);
	top:10%;
	left:5%;
	transform:scale(.7);
	transition:transform .3s
}
.close {
	color:#000;
	font-size:28px;
	font-weight:700;
	position:absolute;
	top:20px;
	right:45px
}
}
@media (min-width:970px) and (max-width:1199px) {
	.modal {
	display:none;
	position:fixed;
	width:100%;
	height:100%;
	overflow:hidden;
	background-color:rgba(0,0,0,.5)
}
.modal-content {
	width:90%;
	height:80%;
	padding:28px 10px 15px;
	max-width:1000px;
	background-color:#fff;
	display:flex;
	flex-direction:column;
	overflow-y:auto;
	border-radius:0;
	position:relative;
	margin:0;
	transform:translate(-50%,-50%);
	top:10%;
	left:5%;
	transform:scale(.7);
	transition:transform .3s
}
.close {
	color:#000;
	font-size:28px;
	font-weight:700;
	position:absolute;
	top:20px;
	right:45px
}
}
@media (min-width:1200px) and (max-width:1286px) {
	.modal {
	display:none;
	position:fixed;
	width:100%;
	height:100%;
	overflow:hidden;
	background-color:rgba(0,0,0,.5)
}
.modal-content {
	width:90%;
	height:80%;
	padding:28px 10px 15px;
	max-width:1000px;
	background-color:#fff;
	display:flex;
	flex-direction:column;
	overflow-y:auto;
	border-radius:0;
	position:relative;
	margin:0;
	transform:translate(-50%,-50%);
	top:10%;
	left:5%;
	transform:scale(.7);
	transition:transform .3s
}
.close {
	color:#000;
	font-size:28px;
	font-weight:700;
	position:absolute;
	top:20px;
	right:45px
}
}
.dropdown-menu.mega-dropdown {
  max-width: 100vw;
  overflow-x: auto;
}
/* Base Dropdown Menu Styles */
.dropdown-menu.mega-dropdown {
  width: 950px;
  max-width: 100vw;
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%) translateY(20px);
  background: #fff;
  backdrop-filter: blur(10px);
  border-radius: 16px;
  padding: 40px;
  display: none;
  z-index: 9999;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15);
  opacity: 0;
  visibility: hidden;
  transition: all 0.4s ease;
  overflow-x: auto;
  box-sizing: border-box;
}

/* Show dropdown on hover */
.nav-item.dropdown:hover .dropdown-menu {
  display: block;
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
}

/* Dropdown Row Layout */
.dropdown-menu .row {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: space-between;
}

/* Column Settings */
.dropdown-menu .col-md-4 {
  flex: 1 1 30%;
  min-width: 250px;
  box-sizing: border-box;
  padding: 0 15px;
}

/* Headers */
.dropdown-header {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 20px;
  color: #333;
  position: relative;
}

.dropdown-header::after {
  content: '';
  display: block;
  width: 30px;
  height: 3px;
  background: linear-gradient(to right, #7bff00, #28a744);
  margin-top: 6px;
  border-radius: 2px;
}

/* Dropdown Items */
.dropdown-item {
  position: relative;
  display: flex;
  align-items: center;
  font-size: 15px;
  color: #222 !important;
  padding: 8px 0;
  transition: all 0.3s ease;
}

.dropdown-item:hover {
  color: #28a744 !important;
  padding-left: 8px;
}

.dropdown-item i {
  margin-right: 10px;
  font-size: 16px;
  color: #555;
  transition: color 0.3s ease;
}

.dropdown-item:hover i {
  color: #28a744;
}

/* -----------------------------------
   Media Queries for Responsiveness
------------------------------------ */

@media (max-width: 991px) {
  .dropdown-menu.mega-dropdown {
    width: 100vw;
    left: 0;
    right: 0;
    transform: translateY(0);
    padding: 20px;
    border-radius: 0;
    background-color: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(5px);
    max-height: 90vh;
    overflow-y: auto;
    display: none;
    /* position: fixed; */
    top: 60px;
    z-index: 10000;
  }

  .nav-item.dropdown.show .dropdown-menu.mega-dropdown {
    display: block;
  }

  .dropdown-menu .row {
    flex-direction: column;
    gap: 10px;
  }

  .dropdown-menu .col-md-4 {
    flex: 1 1 100%;
    padding: 10px 15px;
    background: #f8f9fa;
    border-radius: 12px;
    margin-bottom: 15px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
  }

  .dropdown-header {
           font-size: 16px;
        font-weight: bold;
        margin-bottom: 10px;
        cursor: pointer;
        display: flex;
        position: relative;
        justify-content: center;
  }

  .dropdown-header::after {
    content: "▼";
    position: absolute;
    right: 0;
    top: 0;
    font-size: 12px;
    transition: transform 0.3s ease;
  }

  .dropdown-header.active::after {
    transform: rotate(180deg);
  }

  .dropdown-section {
    display: none;
    padding-top: 5px;
  }

  .dropdown-header.active + .dropdown-section {
    display: block;
  }

  .dropdown-item {
    font-size: 14px;
    padding: 8px 0;
    border-bottom: 1px solid #ddd;
  }

  .dropdown-item:last-child {
    border-bottom: none;
  }
}
.about-modal-content {
    margin: auto;
    width: 93%;
    height: 90%;
    padding: 5px 10px 0px 20px;
    max-width: 1000px;
    background-color: #ffffff;
    display: flex;
    flex-direction: column;
    overflow-y: auto;
    top: 5%;
    left: 13%;
    position: absolute;
    border-radius: 15px
}
/* Custom scrollbar styles */
.about-modal-content::-webkit-scrollbar {
    width: 8px; /* Width of the scrollbar */
}

.about-modal-content::-webkit-scrollbar-track {
    background: #fff; /* Background of the scrollbar track */
    border-radius: 10px; /* Round the track edges */
}

.about-modal-content::-webkit-scrollbar-thumb {
    background-color: #fff;
    border-radius: 10px;    
    border: 2px solid #fff;
}
.about-modal-content::-webkit-scrollbar-thumb:hover {
    background-color: #fff;
}
.about-modal .main-text p {
    text-align: start;
    font-size: 15px;
    line-height: 34px;
    margin-bottom: 0;
    color: #000000;
}
.about-modal-content .logo{
    width: 100%;
    text-align: center;
    margin-bottom: 45px;    
}
.about-modal-content .logo img {
	width: 100px;
    height: auto;
    display: block;
    margin: 0 auto; 
}

.about-modal-content .text p {
    color: #fff;
	text-align: center;
	margin-bottom: 20px;
}

.about-modal .key-feature {
    width: 100%;
    margin-top: 30px;
}

.about-modal .key-feature h4 {
    color: #000000;
    font-size: 27px;
}
.about-modal .key-Points {
    width: 100%;
    margin-top: 30px;
    margin-bottom: 60px;
}
.about-modal .point-section {
    display: flex;
    width: 100%;
    margin-top: 20px;
}
.about-modal .point-section li {
    display: flex;
    list-style: none;
    color: #000000;
    font-size: 13px;
}
.about-modal .point-section p{
    color: #fff;
    font-size: 15px;
    margin-bottom: 0px;
}
.about-modal .point-section  i {
    margin-right: 10px;
}
.close {
    color: #000000;
    text-decoration: none;
    font-size: 40px;
    display: flex;
    justify-content: end;
    padding: 0px 20px;
}

.close:hover,
.close:focus {
    color: #27a2fe;
    text-decoration: none;
    cursor: pointer;
}
@media (min-width: 200px) and (max-width: 499px){
    .about-modal {
        display: none;
        position: fixed;
        z-index: 1050;
       top: 0; left: 0;
        width: 100%;
        height: 100%;
        overflow: hidden;
        background-color: #ffffff;
        background-color: rgba(0, 0, 0, 0.211);
    }
        	/* .about-modal {
  display: none;
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 999;
  overflow: hidden;
} */

    /* .about-modal-content {
        margin: auto;
        width: 93%;
        height: 80%;
        padding: 30px 10px 0px 20px;
        max-width: 1000px;
        background-color: #fff;
        display: flex;
        flex-direction: column;
        overflow-y: auto;
        top: 12%;
        left: 3%;
        position: absolute;
        border-radius: 15px;
    } */
	    .about-modal-content {
        width: 93%;
        height: 80%;
        max-width: 1000px;
           background-color: #fff;
        display: flex;
        flex-direction: column;
        overflow-y: auto;
        top: 12%;
        left: 3%;
        position: absolute;
        margin: auto;
        padding: 30px 10px 0px 20px;
        border-radius: 15px;
    }
    .about-modal-content::-webkit-scrollbar {
        width: 8px;
        display: none;
    }
    
    .about-modal-content::-webkit-scrollbar-track {
        background: #ffffff; 
        border-radius: 10px; 
    }
    
    .about-modal-content::-webkit-scrollbar-thumb {
        background-color: #ffffff;
        border-radius: 10px;    
        border: 2px solid #ffffff;
    }
    .about-modal-content::-webkit-scrollbar-thumb:hover {
        background-color: #ffffff;
    }
    .about-modal .main-text p {
        text-align: start;
        font-size: 15px;
        line-height: 34px;
        margin-bottom: 0;
        color: #000000;
    }
    .about-modal-content .logo{
        width: 100%;
        text-align: center;
        margin-bottom: 20px;    
    }
    .about-modal-content .logo img {
        width: 100px;
        height: auto;
        display: block;
        margin: 0 auto; 
    }
    .close {
        color: #000000;
        text-decoration: none;
        font-size: 40px;
        justify-content: end;
    }
    
    .close:hover,
    .close:focus {
        color: #27a2fe;
        text-decoration: none;
        cursor: pointer;
    }
}

@media (min-width: 500px) and (max-width: 574px){
    /* .about-modal {
        display: none;
        position: fixed;
        z-index: 1050;
        transform: translate(-50%, -50%);
        width: 100%;
        height: 100%;
        overflow: hidden;
        background-color: #ffffff;
        background-color: rgba(0, 0, 0, 0.211);
    } */
    	.about-modal {
  display: none;
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 999;
  overflow: hidden;
}
    .about-modal-content {
        margin: auto;
        width: 93%;
        height: 80%;
        padding: 30px 10px 0px 20px;
        max-width: 1000px;
        background-color: #ffffff;
        display: flex;
        flex-direction: column;
        overflow-y: auto;
        top: 12%;
        left: 3%;
        position: absolute;
        border-radius: 15px;
    }
    .about-modal-content::-webkit-scrollbar {
        width: 8px;
        display: none;
    }
    
    .about-modal-content::-webkit-scrollbar-track {
        background: #ffffff; 
        border-radius: 10px; 
    }
    
    .about-modal-content::-webkit-scrollbar-thumb {
        background-color: #ffffff;
        border-radius: 10px;    
        border: 2px solid #ffffff;
    }
    .about-modal-content::-webkit-scrollbar-thumb:hover {
        background-color: #ffffff;
    }
   .about-modal .main-text p {
        text-align: start;
        font-size: 15px;
        line-height: 34px;
        margin-bottom: 0;
        color: #000000;
    }
    .about-modal-content .logo{
        width: 100%;
        text-align: center;
        margin-bottom: 20px;    
    }
    .about-modal-content .logo img {
        width: 100px;
        height: auto;
        display: block;
        margin: 0 auto; 
    }
   .close {
        color: #000000;
        text-decoration: none;
        font-size: 40px;
        justify-content: end;
    }
    
    .close:hover,
    .close:focus {
        color: #27a2fe;
        text-decoration: none;
        cursor: pointer;
    }
}

@media (min-width: 575px) and (max-width: 765px){
    /* .about-modal {
        display: none;
        position: fixed;
        z-index: 1050;
        transform: translate(-50%, -50%);
        width: 100%;
        height: 100%;
        overflow: hidden;
        background-color: #fff;
        background-color: rgba(0, 0, 0, 0.211);
    } */
	 	.about-modal {
  display: none;
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 999;
  overflow: hidden;
}
    
    .about-modal-content {
        margin: auto;
        width: 93%;
        height: 80%;
        padding: 30px 10px 0px 20px;
        max-width: 1000px;
        background-color: #fff;
        display: flex;
        flex-direction: column;
        overflow-y: auto;
        top: 12%;
        left: 3%;
        position: absolute;
        border-radius: 15px;
    }
    .about-modal-content::-webkit-scrollbar {
        width: 8px;
        display: none;
    }
    
    .about-modal-content::-webkit-scrollbar-track {
        background: #fff; 
        border-radius: 10px; 
    }
    
    .about-modal-content::-webkit-scrollbar-thumb {
        background-color: #fff;
        border-radius: 10px;    
        border: 2px solid #fff;
    }
    .about-modal-content::-webkit-scrollbar-thumb:hover {
        background-color: #fff;
    }
   .about-modal .main-text p {
        text-align: start;
        font-size: 15px;
        line-height: 34px;
        margin-bottom: 0;
        color: #000000;
    }
    .about-modal-content .logo{
        width: 100%;
        text-align: center;
        margin-bottom: 20px;    
    }
    .about-modal-content .logo img {
        width: 100px;
        height: auto;
        display: block;
        margin: 0 auto; 
    }
   .close {
        color: #000000;
        text-decoration: none;
        font-size: 40px;
        justify-content: end;
    }
    
    .close:hover,
    .close:focus {
        color: #27a2fe;
        text-decoration: none;
        cursor: pointer;
    }
}

@media (min-width: 766px) and (max-width: 991px){
    /* .about-modal {
        display: none;
        position: fixed;
        z-index: 1050;
        transform: translate(-50%, -50%);
        width: 100%;
        height: 100%;
        overflow: hidden;
        background-color: #fff;
        background-color: rgba(0, 0, 0, 0.211);
    } */
    	.about-modal {
  display: none;
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 999;
  overflow: hidden;
}
    .about-modal-content {
        margin: auto;
        width: 93%;
        height: 80%;
        padding: 30px 10px 0px 20px;
        max-width: 1000px;
        background-color: #fff;
        display: flex;
        flex-direction: column;
        overflow-y: auto;
        top: 5%;
        left: 3%;
        position: absolute;
        border-radius: 15px;
    }
    .about-modal-content::-webkit-scrollbar {
        width: 8px;
        display: none;
    }
    
    .about-modal-content::-webkit-scrollbar-track {
        background: #fff; 
        border-radius: 10px; 
    }
    
    .about-modal-content::-webkit-scrollbar-thumb {
        background-color: #fff;
        border-radius: 10px;    
        border: 2px solid #fff;
    }
    .about-modal-content::-webkit-scrollbar-thumb:hover {
        background-color: #fff;
    }
   .about-modal .main-text p {
        text-align: start;
        font-size: 15px;
        line-height: 34px;
        margin-bottom: 0;
        color: #000000;
    }
    .about-modal-content .logo{
        width: 100%;
        text-align: center;
        margin-bottom: 20px;    
    }
    .about-modal-content .logo img {
        width: 100px;
        height: auto;
        display: block;
        margin: 0 auto; 
    }
   .close {
        color: #000000;
        text-decoration: none;
        font-size: 40px;
        justify-content: end;
    }
    
    .close:hover,
    .close:focus {
        color: #27a2fe;
        text-decoration: none;
        cursor: pointer;
    }
}

@media (min-width: 902px) and (max-width: 990px){
    /* .about-modal {
        display: none;
        position: fixed;
        z-index: 1050;
        transform: translate(-50%, -50%);
        width: 100%;
        height: 100%;
        overflow: hidden;
        background-color: #fff;
        background-color: rgba(0, 0, 0, 0.211);
    }
     */
	 	.about-modal {
  display: none;
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 999;
  overflow: hidden;
}
    .about-modal-content {
        margin: auto;
        width: 93%;
        height: 80%;
        padding: 30px 10px 0px 20px;
        max-width: 1000px;
        background-color: #fff;
        display: flex;
        flex-direction: column;
        overflow-y: auto;
        top: 5%;
        left: 3%;
        position: absolute;
        border-radius: 15px;
    }
    .about-modal-content::-webkit-scrollbar {
        width: 8px;
        display: none;
    }
    
    .about-modal-content::-webkit-scrollbar-track {
        background: #fff; 
        border-radius: 10px; 
    }
    
    .about-modal-content::-webkit-scrollbar-thumb {
        background-color: #fff;
        border-radius: 10px;    
        border: 2px solid #fff;
    }
    .about-modal-content::-webkit-scrollbar-thumb:hover {
        background-color: #fff;
    }
   .about-modal .main-text p {
        text-align: start;
        font-size: 15px;
        line-height: 34px;
        margin-bottom: 0;
        color: #000000;
    }
    .about-modal-content .logo{
        width: 100%;
        text-align: center;
        margin-bottom: 20px;    
    }
    .about-modal-content .logo img {
        width: 100px;
        height: auto;
        display: block;
        margin: 0 auto; 
    }
    .close {
        color: #fff;
        text-decoration: none;
        justify-content: end;
        font-size: 40px;
    }
    
    .close:hover,
    .close:focus {
        color: #27a2fe;
        text-decoration: none;
        cursor: pointer;
    }
}

@media (min-width: 902px) and (max-width: 1200px){
	/* .about-modal {
  display: none;
  position: fixed;
  top: 0; left: 0;
  width: 100%; height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
  z-index: 999;
} */
    .about-modal {
        display: none;
        position: fixed;
        z-index: 1050;
        transform: translate(0%,0%);
        width: 100%;
        height: 100%;
        overflow: hidden;
        background-color: #fff;
        background-color: rgba(0, 0, 0, 0.211);
    }
    
    .about-modal-content {
        margin: auto;
        width: 93%;
        height: 80%;
        padding: 30px 10px 0px 20px;
        max-width: 1000px;
        background-color: #fff;
        display: flex;
        flex-direction: column;
        overflow-y: auto;
        top: 10%;
        left: 3%;
        position: absolute;
        border-radius: 15px;
    }
    .about-modal-content::-webkit-scrollbar {
        width: 8px;
        display: none;
    }
    
    .about-modal-content::-webkit-scrollbar-track {
        background: #fff; 
        border-radius: 10px; 
    }
    
    .about-modal-content::-webkit-scrollbar-thumb {
        background-color: #fff;
        border-radius: 10px;    
        border: 2px solid #fff;
    }
    .about-modal-content::-webkit-scrollbar-thumb:hover {
        background-color: #fff;
    }
   .about-modal .main-text p {
        text-align: start;
        font-size: 15px;
        line-height: 34px;
        margin-bottom: 0;
        color: #000000;
    }
    .about-modal-content .logo{
        width: 100%;
        text-align: center;
        margin-bottom: 20px;    
    }
    .about-modal-content .logo img {
        width: 100px;
        height: auto;
        display: block;
        margin: 0 auto; 
    }
    .close {
        color: #fff;
        text-decoration: none;
        justify-content: end;
        font-size: 40px;
    }
    
    .close:hover,
    .close:focus {
        color: #27a2fe;
        text-decoration: none;
        cursor: pointer;
    }
}