body{font-family: "Poppins", sans-serif !important; position: relative; overflow-x: hidden; isolation: isolate; scroll-snap-type: y mandatory; scroll-padding: 500px;}

.B-Body{overflow-y: hidden; height: 100vh;}

a{text-decoration: none;}

:root{--color-one: #4d8ac8; --color-two: #1b498c; --black-color: #000000; --white-color: #fff; --grey-color: #0f0f0f; --border-radius: 1.25rem; --black-bg: #000000;}

.border-radius{border-radius: var(--border-radius); border: 1px solid var(--black-color);}

.black-color{color: var(--black-color);}

.w-10{width: 25px;}

.w-60{width: 60px;}

.ul li{margin-bottom: 10px; font-size: 14px;}

.loader{display: flex; align-items: center; justify-content: center; height: 100dvh; width: 100%; background: #ffffffcb; position: fixed; left: 0px; top: 0px; z-index: 9;}

.loader_circle_2_counter{animation: rotateCounterClockwise 0.9s linear infinite; transform-origin: center; transform-box: fill-box; } 

@keyframes rotateCounterClockwise {
    from {
      transform: rotate(0deg);
    }
    to {
      transform: rotate(-360deg);
    }
  }



/* darktheme */

.darktheme{background: #000; --white-color: #000;}

.darktheme #loadingText{ color: #000;}

.darktheme #owner .bg-white{background: #00183c !important;}

.darktheme .blog-sec ul{margin-bottom: .5rem !important; padding-left: 16px;}

.darktheme .blog-sec ul li{color: #fff !important; font-size: 14px; line-height: 28px;}

.darktheme .four-box .white-box{background: #000 !important; border: 1px solid #fff;} 

.darktheme .apexcharts-legend-text{color: #fff !important;}

.darktheme .ul_solution li{color: #fff;}

.darktheme #CompanyMission ul li{color: #fff;}

.darktheme #changeTemplate ul li{color: #fff !important; font-family: "Poppins", sans-serif !important; }

.darktheme .btn{color: #fff;}

.darktheme .about-ul li{color: #fff !important;}

.darktheme .btn:hover{color: #fff;}

.white-bg{background-color: var(--white-color);}

.darktheme .white-box{background-color: #011f3cfc;}

.darktheme .white-box label{color: #ffff !important;}

.darktheme .white-box a{color: #ffff !important;}

.darktheme .white-box p{color: #ffff !important;}

.darktheme .access-ui .nav-pills .nav-item .btn.active{background: #fff; color: #000;}


.darktheme h1{color: #fff;}
.darktheme h2{color: #fff;}
.darktheme h3{color: #fff;}
.darktheme h4{color: #fff;}
.darktheme h5{color: #fff;}
.darktheme h6{color: #fff;}
.darktheme p{color: #fff;}

.darktheme .footer .box{border: 1px dashed #ffffff !important;}

.darktheme .footer .box .link{color: #fff !important;}

.darktheme .header .nav-link{color: #ffffff !important;}

.darktheme .darkmode-li li{color: #ffff !important;}

.darktheme .blog-sec .jumppage ol li a{color: #ffff !important;}

.darktheme .inner{background: #00183c !important; border: 1px solid #fff !important;}

.darktheme .cards-bg{border: 1px solid #fff !important;}

.darktheme .dashboard .title-box{border-bottom: 1px solid #fff;}

.darktheme .first-text, .darktheme .first-text .color-two{color: #fff !important;}

.darktheme .table-stu .table{background: #011f3cfc !important;} 

.darktheme .table-stu th, .darktheme .table-stu .table td{color: #fff !important;}

.darktheme .table-stu .bi-check-circle-fill {color: #08df08 !important;}

.darktheme .table-stu .table .infohoverbox{background: #00183c;}

.darktheme .table-stu .table tr:hover{background: #ffffff29 !important;}

.darktheme .why-sec .line, .darktheme .why-sec .dot{background: #fff !important;}



/*  */


.color-one{color: var(--color-one) !important;}

.color-two{color: var(--color-two) !important;}

.rounded-3, .rounded, .rounded-top {border-radius: var(--border-radius) !important;}

.color-round{position: absolute; left: 50%; top: 50%; filter: blur(200px); -webkit-filter: blur(200px); -moz-filter: blur(200px); -ms-filter: blur(200px); transform: translate(-50%, -50%); z-index: -1; opacity: 64%; width: 70%; height: 70%; border-radius: 100%; background: var(--color-one); box-shadow: 1px 1px 70px var(--color-one);}

.bg-one, .bg-two, .bg-three, .bg-four{background: var(--color-one);}

.side-round {position: absolute; right: 0px; bottom: 0px; filter: blur(200px); -webkit-filter: blur(847px); -moz-filter: blur(200px); -ms-filter: blur(200px); width: 73%; height: 100%;
border-radius: 100%; z-index: -1; opacity: 0.3;}

.btn{background: var(--color-one); color: var(--white-color); padding: 6px 30px; border-radius: var(--border-radius); 
border: 1px solid var(--white-color); transition: linear 0.5s; text-transform: capitalize !important;}

.dt-buttons .dt-button{background: var(--color-one); color: var(--white-color); padding: 6px 30px; border-radius: var(--border-radius); border: 1px solid var(--white-color); transition: linear 0.5s; text-transform: capitalize !important;}

.btn:hover{background: var(--color-two); color: var(--white-color);}

.btn-white{background: var(--white-color); padding: 6px 30px; color: var(--color-one); 
border-radius: 50px; border: 2px solid var(--color-one);}

.title{color: var(--black-color); font-weight: 700; text-transform: uppercase;}

.arrow-upbtn{position: fixed; right: -50px; bottom: 82px; z-index: 2; transition: linear 0.5s;}

.arrow-upbtn.sidepeek{right: 15px;}

.heading{text-transform: capitalize;}

.paragraph::first-letter{text-transform: uppercase;}

.small-font { font-size: 13px !important;}

.form-select{color: #5e5c6e;}

.form-select option{background: #fff; color: #5e5c6e;}

.form-select option:hover{background: #f8f8f8;}









/* h1{font-size: 60px;}

h2{font-size: 50px;}

h3{font-size: 40px;}

h4{font-size: 30px;}

h5{font-size: 20px;}

h6{font-size: 18px;} */

p{color: var(--grey-color); font-size: 14px; line-height: 28px; margin-bottom: 0px;}

.ptb-100{padding: 50px 0px;}

.ptb-30{padding: 30px 0px;}

.pt-100{padding-top: 100px;}

.pb-100{padding-bottom: 100px;}

.h-100vh{height: 100vh !important;}

.h-100vh-two{height: 100vh !important;}

.mt-100{margin-top: 100px;}


.svg-box{position: absolute; bottom: 500px; left: 0px; width: 100%; height: 100%; z-index: -1;}

.svg-box svg{height: 100%; width: 100%;}

.svg-box svg .path{fill: var(--color-one) !important;}

.white-box{padding: 24px !important; justify-content: start; border-radius: 15px; background: var(--white-color);  transition: linear 0.5s; width: 100%;}


.warrper .white-box {background: var(--white-color); border: 1px solid var(--border-color); border-radius: 15px !important; box-shadow: 1px 1px 10px #00000029; position: relative; overflow: hidden;}

.z-indexAnimation{z-index: 99999999 !important;}

.font-12{font-size: 12px;}




/* search box */

.search-box{border-radius: 100px; position: fixed; bottom: 0px; width: 100%; margin-bottom: 15px; border: 1px solid var(--black-color); background: var(--white-color);}

.search-box input{border-radius: 50px;}

#output{text-transform:uppercase; color:#fdf6f0; font-size:6em; font-weight:bold; text-align:left;}
polygon

/* header */

.header{position: relative;}

.header.form-header{position: absolute; left: 0px; top: 0px; width: 100%; z-index: 3; background: var(--white-color);}

.header .navbar{padding: 10px 0px;}

.header .navbar.stickey{position: fixed; z-index: 9; width: 100%; background: var(--white-color); left: 0px; top: 0px; box-shadow: 0px 0px 10px #000;}

.header .navbar .nav-item .form-select{border-radius: 50px;}

.header .navbar-nav .dropdown-menu{background: #fff; border: 1px solid #000; left: unset !important; right: 0px !important;}

.header .navbar-nav .dropdown-menu li{padding: 5px; border-bottom: 1px solid #000;}

.header .navbar-nav .dropdown-menu li:last-child{margin-bottom: 0px;}

.header .gg-header{visibility: visible;}

.header .navbar-nav{align-items: center;}

.header .navbar .navbar-brand .logo{width: 170px; transition: linear 0.5s;}

.header .navbar.stickey .navbar-brand .logo{width: 100px; transition: linear 0.5s;}

.header .navbar-toggler{background: aliceblue;}

.header .navbar .navbar-brand span{position: relative; height: 100px; isolation: isolate;}

.header .navbar .nav-item{margin-right: 20px;}

.header .navbar .nav-item:last-child{margin-right: 0px;}

.header .navbar .nav-item .nav-link{font-size: 14px; display: flex; align-items: center; 
 text-transform: capitalize; color: var(--black-color);}

.header .navbar .nav-item .nav-link span{margin-right: 10px; color: var(--color-one);}

.header .navbar .nav-item .nav-link .bi.bi-globe2{color: var(--color-one); margin-right: 10px;} 

.header .checkbox{ opacity: 0; position: absolute;}

.checkbox-label { background-color: var(--color-two); width: 50px; height: 30px;
border-radius: 50px; position: relative; padding: 5px; cursor: pointer; display: flex;
justify-content: space-between; align-items: center; color: #fff;}
  
.fa-moon {color: #f1c40f;} .fa-sun {color: #f39c12;}
  
.checkbox-label .ball {background-color: #fff; width: 22px; height: 22px; position: absolute; 
    left: 2px; top: 50%; transform: translateY(-50%);  border-radius: 50%; transition: transform 0.2s linear;}

.checkbox-label .ball.activeball{left: 50%;}

.header .nav-item .btn-white, .header .nav-item .btn{font-weight: 600;}

/* hero-sec */


/* hero-text */

.hero-text h4{font-size: 40px;}

.hero-text h5{margin-top: 25px; font-size: 30px;}


/* slider */

.slider{height: 100vh; border-radius: 0px var(--bdr-r) 0px 0px; position: relative; isolation: isolate;}

/* .slider::after{position: absolute; left: 0px; content: ""; top: 0px; width: 100%; height: 100%; background: #000; opacity: 0.4; z-index: 1;} */

.slider .video-container{position: relative;}

.slider .video-container .YoutubeIcon::after{position: absolute; left: 0px; top: 0px; content: ""; background: #3295F0; border-radius: 100%; transform: scale(1.1); width: 100%; height: 100%; z-index: -1; animation: infinite linear 1.5s ripple;}

@keyframes ripple {

    0%{transform: scale(1); opacity: 1;}

    100%{transform: scale(2); opacity: 0;}

}

.slider .video-container .youtube-icon{position: absolute; width: 100px; height: 100px; left: 50%; top: 50%; transform: translate(-50%, -50%); cursor: pointer; background: var(--white-color); border-radius: 100%; z-index: 2; display: flex; align-items: center; justify-content: center;}

.slider .video-container .youtube-icon-two{position: absolute; width: 100px; height: 100px; left: 50%; top: 50%; transform: translate(-50%, -50%); cursor: pointer; background: var(--white-color); border-radius: 100%; z-index: 2; display: flex; align-items: center; justify-content: center;}

.slider .video-container .youtube-icon-three{position: absolute; width: 100px; height: 100px; left: 50%; top: 50%; transform: translate(-50%, -50%); cursor: pointer; background: var(--white-color); border-radius: 100%; z-index: 2; display: flex; align-items: center; justify-content: center;}

.slider .carousel-item{height: 100%;}

.slider .leftTEXT{position: absolute; left: 0px; width: 100%; top: 25%; transform: translateY(-50%); transition: linear 0.5s; z-index: 3; text-align: center;}

.slider .leftTEXT h1{color: #fff;}

.slider .leftTEXT p{color: #fff;}

.slider .leftTEXT p span{color: #fff;}

.slider .carousel-inner{height: 100%;}

.slider svg{fill: var(--color-one); width: 45px; height: 45px;}

.slider .slider-box .carousel .carousel-item img{object-fit: cover;}

.slider-box .play-button{display: flex; align-items: center; justify-content: center; width: 100px; height: 100px; position: absolute; left: 50%; background: #ffffffdb; border-radius: 100%; z-index: 0; top: 50%; transform: translate(-50%, -50%); isolation: isolate;}

.slider-box .play-button::after{position: absolute; content: ""; top: 0px; left: 0px; width: 100%; height: 100%; z-index: -1; background: var(--color-one); animation: linear 0.9s blub infinite; border-radius: 100%;}

@keyframes blub {
    0%{transform: scale(1); opacity: 1; background: #fff;}
    50%{transform: scale(1.4); opacity: 0.5; background: var(--color-one);}
    100%{transform: scale(1.9); opacity: 0; background: #fff;}
}


.slider-box .play-button a span i{font-size: 70px; color: var(--color-one);}

.slider .slider-box .carousel{display: flex; height: 100%; justify-content: center; align-items: center;}

.slider .slider-box .carousel .bottom-text p{color: #fff; position: absolute; padding: 30px; padding-left: 69.6667px; left: 0px; width: 100%; bottom: 0px;}

.slider .slider-box .carousel-indicators{position: absolute;right: 0;
bottom: 0; left: unset; z-index: 2; display: inline-block; justify-content: center;
padding: 0; margin-bottom: 0%; margin-left: 0%; list-style: none; margin-right: 0px; display: flex; width: 100%;}

.slider .slider-box .carousel-indicators button{width: 10px; background: #fff;  height: 10px; border-radius: 100%; opacity: 1; border: 5px solid #fff; margin-bottom: 40px; box-shadow: 0px 0px 10px #474646;} 

.slider .slider-box .carousel-indicators .active{background: var(--color-one); border: 5px solid #fff;}

.carousel-control-next, .carousel-control-prev{z-index: 3;}

.slider .carousel-control-next, .carousel-control-prev{opacity: 1 !important;}

.slider .carousel-control-next-icon, .carousel-control-prev-icon{width: 50px; height: 50px;}



/* slider */


/* about-us */

.about-sec .bg-white-border{padding: 30px; background: var(--white-color); border-radius: 30px; overflow: hidden;}

.about-sec .about-ul{padding: 0px; margin: 0px; list-style: none;}

.about-sec .about-ul li{position: relative; padding-left: 30px; font-size: 14px; line-height: 28px; color: var(--black-bg)}

.about-sec .about-ul li span{position: absolute; left: 0px; top: 0px; font-size: 14px;}


/* services-sec */

.services-sec .white-box .drawsvg{fill: var(--color-one) !important; width: 60px; height: 60px;}

.services-sec .white-box{ transition: transform 0.5s linear;transform: translateY(0px);}

.services-sec .white-box p{display: -webkit-box; -webkit-line-clamp: 5; -webkit-box-orient: vertical; overflow: hidden;}

.services-sec .white-box:hover{box-shadow: 1px 1px 10px #00000079 !important;}


/* why-sec */

.why-sec .white-box{display: flex; box-shadow: 1px 1px 10px #d3d3d3; flex-flow: column; height: 100%; position: relative; padding-top: 40px !important; overflow: visible; transition: linear 0.5s;}

.why-sec.home .white-box:hover h6{color: #fff;}

.why-sec .white-box:hover p{color: #fff;}

.why-sec .white-box:hover{background: var(--color-two);}

.why-sec .line{border: 1px dashed var(--color-one); width: 100%; height: 1px;}

/* .why-sec .dot{display: flex; align-items: center; justify-content: center; width: 10px; height: 10px; background: var(--color-one); left: 50%; bottom: -19px; border-radius: 100%; position: relative;} */

.why-sec .dot.top{left: 50%; bottom: 18px;}

.why-sec .dot.bottom{left: 50%; top: -18px !important; bottom: unset !important;}

.why-sec .white-box:hover .about-sec .about-ul li{color: #fff;}

.why-sec .white-box h3{position: absolute; left: 24px; top: -24px; width: 50px; height: 50px;  background: var(--color-one); border-radius: 10px; display: flex; align-items: center; color: #fff; justify-content: center; }

.why-sec h2{background: #fff; padding: 10px; border-radius: 10px;}

.why-sec.home .white-box{padding-top: 15px !important;}


/* pricing-sec */


.pricing-sec .white-bg{background: var(--white-color); padding: 15px; display: inline-block; 
border-radius: 30px;}

.pricing-sec .nav-pills .nav-item .active{background: var(--color-one) !important;}

.pricing-sec .nav-pills .nav-item .btn{background: var(--white-color); color: var(--black-color); 
box-shadow: 1px 1px 10px #ebebeb;}

.pricing-sec .tab-content .ul{padding: 0px; margin: 0px; list-style: none;}

.pricing-sec .tab-content .ul li{position: relative; padding-left: 25px; margin-bottom: 10px;}

.pricing-sec .tab-content .ul li:last-child{margin-bottom: 0px;}

.pricing-sec .tab-content .ul li span{position: absolute; left: 0px; font-size: 18px;}



.table-stu .table{ background-color: #ffffff !important; box-shadow: 1px 1px 10px #e5e5e5;  border-radius: 10px; overflow: hidden;}

.table-stu .table th{font-size: 18px; padding: 15px;} 

.table-stu .table td{font-size: 14px; vertical-align: middle; width: 150px; height: 50px;}

.table-stu .table tr:hover{background: #fff; box-shadow: 1px 1px 10px #979797;}

.table-stu .table tr{transition: linear 0.5s;}

.table-stu .table tr td:first-child{text-align: left;}

.table-stu .table>:not(caption)>*>*{border-color: #ccc;}

.table-stu .table .bi-check-circle-fill{color: #03860375;}

.table-stu .table .bi-x-circle-fill{color: #f16279;}

.table-stu .table .bi-info-circle-fill{cursor: pointer;}

.table-stu .table .green{background: #32ec321c; font-size: 25px; text-align: center;}

.table-stu .table .red{background: #ec32321c; font-size: 25px; text-align: center;}

.table-stu .table .hoverbox:hover .infohoverbox{filter: blur(0px); opacity: 1; z-index: 2;}

.table-stu .table .infohoverbox p{font-size: 12px;}
  
.table-stu .table .infohoverbox{position: absolute; padding: 5px; border-radius: 10px; box-shadow: 1px 1px 10px #00000032; background: #fff; filter: blur(10px); opacity: 0; height: auto; left:110%; z-index: -1; top: 0px; width: 100%; transition: linear 0.5s;}

#inlineRadio1:checked #beginner{background: #000;}




/* footer */

.footer{background: black !important;}

.footer.mb-90{padding-bottom: 90px !important; }

.footer hr{border: 1px solid #fff;}

.footer .footer-ul-one{margin: 0px; padding: 0px; list-style: none;}

.footer .footer-link-one{display: inline-block; margin-right: 15px;}

.footer .footer-link-one a{font-size: 14px; color: #fff}

.footer .footer-link-one:last-child{margin-right: 0px;}

.footer .border-top-bottom{padding-top: 15px; padding-bottom: 15px; margin-top: 15px; margin-bottom: 15px; border-top: 1px solid #fff; border-bottom: 1px solid #fff;}



/* inner page */

.inner-page .breadcrumb{background: rgb(255,255,255); background: linear-gradient(97deg, rgba(255,255,255,1) 45%, rgba(50,149,240,1) 100%); padding: 15px; border-radius: 50px; box-shadow: 1px 1px 10px #00000040;}

.inner-page .breadcrumb .breadcrumb-item a{color: var(--color-one);}

.inner-page .breadcrumb .breadcrumb-item{text-transform: capitalize;}

/* info-sec */

.info-sec .image-box{border-radius: 15px; overflow: hidden; background: #fff; box-shadow: 1px 1px 10px #00000072; height: 100%;}

.info-sec .image-box img{height: 100%; object-fit: cover;}

/* form-sec */

.form-sec{position: relative; isolation: isolate; background: var(--color-one);}

.form-sec .btn{border: 2px solid #fff;}

.form-sec::after{position: absolute; content: ""; bottom: 0px; left: 0px; width: 100%; height: 100%; background: url(../image/dotted.png) no-repeat; opacity: 0.6;  z-index: -1; background-size: cover;}


/* login */

.svg-line{height: 100%; width: 100%; } 

.svg-line svg{width: 100%; height: 100%; display: flex; align-items: center; position: absolute; z-index: -1;}

.svg-line svg path.svg-elem-1 { stroke-dasharray: 3078.0673828125px; animation: drawPath1 linear forwards 3s;}

.svg-line svg path.svg-elem-2 {stroke-dasharray: 3054.35986328125px; animation: drawPath2 linear forwards 4s;}

.svg-line svg path.svg-elem-3 {stroke-dasharray: 3078.068603515625px; animation: drawPath3 linear forwards 5s;}

.svg-line svg path.svg-elem-4 {stroke-dasharray: 3078.068359375px; animation: drawPath4 linear forwards 6s;}

@keyframes drawPath1 {from {stroke-dashoffset: 3078.0673828125px;} to {stroke-dashoffset: 0;}}

@keyframes drawPath2 {from {stroke-dashoffset: 3078.0673828125px;} to {stroke-dashoffset: 0;}}

@keyframes drawPath3 {from {stroke-dashoffset: 3078.0673828125px;} to {stroke-dashoffset: 0;}}

@keyframes drawPath4 {from {stroke-dashoffset: 3078.0673828125px;} to {stroke-dashoffset: 0;}}


.login{height: 100vh;  display: flex; align-items: center; justify-content: center; position: relative; isolation: isolate;}

.login::after{position: absolute; content: ""; width: 400px; height: 400px; background: var(--first-color); border-radius: 100%; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: -1; filter: blur(100px);}

.register{height: 100vh;  display: flex; justify-content: center; align-items: center; position: relative; isolation: isolate;}

.register::after{position: absolute; content: ""; width: 400px; height: 400px; background: var(--first-color); border-radius: 100%; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: -1; filter: blur(100px);}






/* blog-sec */

.blog-sec .blog-image{position: relative; object-fit: cover; overflow: hidden;}

.blog-sec .blog-text{margin-top: 15px; border: 1px dashed; transition: linear 0.5s;}

.blog-sec .blog-text h5 a{color: #000;}

.blog-sec .blog-text:hover{border: 1px double;}

.blog-sec .left-bordertext{border-left: 3px solid var(--color-one); background: #2196f30d;}

.blog-sec .jumppage{position: sticky; top: 96px; border: 1px dashed;}

.blog-sec .jumppage ol{padding-left: 1rem; margin-bottom: 0px;}

.blog-sec .jumppage ol li:last-child{margin-bottom: 0px;}

.blog-sec .jumppage ol li{margin-bottom: 15px;}

.blog-sec .jumppage ol li a{color: var(--color-two);}

.blog-sec .blog-text h5{display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font-size: 18px;}

.blog-sec .blog-text p{display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;}


/* career-sec */

.career-sec .white-box{display: flex; flex-flow: column; justify-content: space-between;}

.career-sec ul{padding: 0px; margin: 0px; list-style: none;}

.career-sec ul li{margin-bottom: 15px;}

.career-sec ul li:last-child{margin-bottom: 0px;}


/* response */

.response{width: 100%; position: fixed; bottom: 100px; left: 0px; z-index: 3;}

.response .white-box{background: var(--white-color); border-radius: 10px; text-transform: capitalize; position: relative; border: 1px solid var(--color-two); box-shadow: 1px 1px 10px #00000040;}

.response .left-response .Close-btn{cursor: pointer; display: block; font-size: 30px; position: absolute; right: 30px; top: -45px;}

.response .right-response .Close-btn{cursor: pointer; display: block; font-size: 30px; position: absolute; right: 0px; top: -45px;}


.response .boxContainer {display: flex; justify-content: space-between; height: 15px; --boxSize: 2px; --gutter: 4px; width: calc((var(--boxSize) + var(--gutter)) * 5);}
  
.response .boxContainer .box{transform: scaleY(0.4); height: 100%; width: var(--boxSize);
 background: var(--color-two); animation-duration: 1.2s; animation-timing-function: ease-in-out; animation-iteration-count: infinite; border-radius: 8px;}
  
.response .boxContainer .box.box1 {animation-name: quiet;}
  
.response .boxContainer .box.box2 {animation-name: normal;}
  
.response .boxContainer .box.box3 {animation-name: quiet;}
  
.response .boxContainer .box.box4 {animation-name: loud;}
  
.response .boxContainer .box.box5 {animation-name: quiet;}

@keyframes quiet {
25% {transform: scaleY(0.6);} 50% {transform: scaleY(0.4);} 75% {transform: scaleY(0.8);}
}
  
@keyframes normal {
25% {transform: scaleY(1);} 50% {transform: scaleY(0.4);} 75% {transform: scaleY(0.6);}
}

@keyframes loud {
25% {transform: scaleY(1);} 50% {transform: scaleY(0.4);} 75% {transform: scaleY(1.2);}
}


/* movingtext */

.movingtext{position: fixed; transition: linear 0.7s; filter: blur(10px); opacity: 0; z-index: -1; bottom: 70px; width: 100%; left: 0px;}

.movingtext.show{opacity: 1; z-index: 2; filter: blur(0px);}

.movingtext .marquee-container{overflow: hidden; white-space: nowrap;}

.movingtext .leftsidemoving{display: inline-block; animation: marquee 50s linear infinite;}

@keyframes marquee {0% {transform: translateX(50%);} 100% { transform: translateX(-100%);}}

.marquee-container:hover .leftsidemoving{animation-play-state: paused;}

.movingtext .leftsidemoving a{background: #fff; display: inline-block; padding: 3px 10px; border: 1px solid #000; border-radius: 30px; color: #000;}

.movingtext .leftsidemoving a:hover{border: 1px solid var(--color-one);}



/* movingtext */


/* counter-animation */

.counter-animation{position: fixed; bottom: 100px; left: 50%; transform: translateX(-50%); z-index: 3;}

.counter-animation .white-box{position: relative; background: #fff;}

/* .counter-animation .white-box::after{position: absolute; content: ""; left: 0px; top: 0px; width: 100%; height: 100%; animation: blinkq linear 1.05s infinite forwards; background: var(--color-two); transform: scale(1.5); z-index: -2; }

@keyframes blinkq{
    0%{transform: scale(0.5); opacity: 0.6;}
    50%{transform: scale(1.5); opacity: 0.7;}
    0%{transform: scale(0.7); opacity: 0;}
}
   */

/* bottom-input-box */

.bottom-input-box{position: fixed; bottom: 0px; left: 0px; width: 100%; padding: 15px; z-index: 9;}

.bottom-input-box .row{position: relative;}

.bottom-input-box .arrow-btn{position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%);}

.bottom-input-box .form-control::placeholder{font-size: 14px; font-weight: 500;}

.bottom-input-box .inputbox{position: relative; isolation: isolate; display: flex; align-items: center;}

@property --angle {syntax: "<angle>"; initial-value: 0deg; inherits: false;}

.bottom-input-box .inputbox.moveingBorder:after{position: absolute; content: ""; inset: -0.2rem;
z-index: -1; background: linear-gradient(var(--angle), #3295F0, #fff); animation: rotate 1.5s ease-in-out infinite; border-radius: 30px;}

@keyframes rotate {0% {--angle: 0deg;} 100% {--angle: 360deg;}}

.bottom-input-box .inputbox:hover::after{width: 100%;}

.bottom-input-box .inputbox .loading-text .innertext{position: absolute; left: 20px; top: 44%; transform: translateY(-50%);}

.bottom-input-box .inputbox input{height: 50px; box-shadow: 1px 1px 10px #00000022; border-radius: 30px; padding: .375rem 1.75rem; position: relative;}

.bottom-input-box .inputbox .svg-iconbox{display: flex; align-items: center; position: absolute; right: 0px; bottom: 0px; height: 100%; z-index: 1;}

.bottom-input-box .inputbox .svg-iconbox svg{width: 40px; height: 40px;}

.bottom-input-box .inputbox .svg-iconbox svg ellipse{fill: var(--color-one);}

.bottom-input-box .inputbox .svg-iconbox .mic.MicOn{position: relative; isolation: isolate;}

.bottom-input-box .inputbox .svg-iconbox .mic.MicOn:after{position: absolute; content: ""; left: 0px; top: 0px; width: 100%; height: 100%; background: var(--color-two); transform: scale(1.5); border-radius: 100%; z-index: -1;  animation: linear 1.2s infinite waveqiuck;}

@keyframes waveqiuck{0%{transform: scale(1); opacity: 1;} 50%{transform: scale(1.6); opacity: 0.5;}
70%{transform: scale(1.7); opacity: 0.7;} 100%{transform: scale(2); opacity: 0;}}

.bottom-input-box .inputbox .svg-iconbox .mic.MicOn svg ellipse{fill: var(--black-color);}

.bottom-input-box .inputbox .animate-text{position: absolute; z-index: 9; left: 0; top: 50%; transform: translateY(-50%); background: #fff; width: 100%; height: 100%; border-radius: 30px;  align-items: center;}

.bottom-input-box .inputbox .animate-text p span{animation: linear 1.3s infinite Mblink;}

.bottom-input-box .inputbox .animate-text p span:nth-child(2){animation-delay: 0.5s;}

.bottom-input-box .inputbox .animate-text p span:nth-child(3){animation-delay: 0.10s;}

@keyframes Mblink{0%{opacity: 0;} 50%{opacity: 50%;} 100%{opacity: 100%;}}


/* bottom-input-box */

.videoPlay{transition: linear 0.5s;}

.videoPlay .ggwp-video{position: relative;}

.videoPlay:hover{transform: scale(0.9);}

.videoPlay .videoIcon{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 1;}

.videoPlay video{border-radius: 10px;}

.videoPlay .videoIcon i{position: relative; isolation: isolate;}

.videoPlay .videoIcon i{font-size: 25px; color: var(--white-color); mix-blend-mode: difference; cursor: pointer;}




/* big-modalImg */

.round-drip{width: 100%; position: fixed; right: 0px; bottom: 0px;}

.round-drip .first-video{width: calc(100vh - 25%); position: absolute; right: 0px; bottom: 0px;  transition: linear 0.9s; }

.round-drip .roundbox{ width: 200px; height: 200px; transform: scale(0.5); overflow: hidden; bottom: 142px !important; animation: qqq linear 0.8s forwards;}

@keyframes  qqq {

    0%{background: transparent; border-radius: 0%;}

    50%{background: transparent; border-radius: 100%;}

    100%{background: #fff; border-radius: 100%;}
    
}



.round-drip .roundbox video{ transition: linear 0.9s; position: absolute; left: 10px;
top: 98px; transform: scale(2.4);}

.ai-model{overflow: hidden; z-index: 9; position: fixed; right: 0px; width: 200px; height: 200px;}

.ai-model svg{position: absolute; transform: scale(2.02); display: none; left: 0px; width: 100%; height: 100%; top: 0px;}

.ai-model.ggwp svg{display: block;}

.ai-model.ggwp svg path{transition: linear 0.5s;}

.ai-model.ggwp svg #bodies path{fill: var(--color-one);}

.ai-model.ggwp svg #edges path{stroke: var(--white-color);}

.ai-model.ggwp{border-radius: 100%; width: 200px; height: 200px; right: 0; top: 50%; background: #fff; transform: scale(0.5) translateY(-50%); border: 2px solid var(--color-one);}


.ai-model.ggwp #videoPlayer1{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) scale(0.8); }

.ai-model.ggwp img{bottom: -10px;}

.ai-model.ggwp img{bottom: -15px;}

.ai-model.ggwp #videoPlayer1{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%) scale(0.8); z-index: -1; }

.ai-model.ggwp img{bottom: -10px;}



/* sitemap */

.sitemap .side-map-links{border: 1px solid var(--black-color); padding: 15px; border-radius: 10px;}

.sitemap .side-map-links p{font-size: 25px; font-weight: 700; margin-bottom: 15px;}

.sitemap .side-map-links ul{padding: 0px; margin: 0px; list-style: none;}

.sitemap .side-map-links ul li{margin-bottom: 10px;}

.sitemap .side-map-links ul li a{color: var(--black-color); text-transform: capitalize;}

.sitemap .side-map-links ul li:last-child{margin-bottom: 0px;}



/* warrper */

.warrper .buttons .nav-tabs .active{background: var(--color-one) !important;}

.warrper .buttons .nav-tabs .active i{mix-blend-mode: difference; transition: linear 0.5s;}

.warrper .buttons .nav-tabs .btn{background: var(--white-color); text-transform: capitalize; box-shadow: 1px 1px 10px #00000029; color: var(--black-color); display: flex; justify-content: space-between; font-size: 13px; padding: 10px 20px; align-items: center;}

.warrper .image-text {overflow: hidden; isolation: isolate; border-radius: 20px; box-shadow: 1px 1px 10px #00000075; position: relative;}

.warrper .image-text .image {border-bottom: 3px solid var(--color-two);}

.warrper .image-text .text {background: var(--white-color); padding: 15px;}



/* info-sec */

.info-sec .white-box{box-shadow: 0px 0px 10px #00000072;}

/* login */


/* investor */

.investor-sec .investorSlider, .investor-sec .investorSlider .swiper-slide{height: 100%;}

.investor-sec .investorSlider .swiper-slide{position: relative; background: rgb(0,51,97);
background: linear-gradient(97deg, rgba(0,51,97,1) 0%, rgba(50,149,240,1) 100%);}

.investor-sec .investorSlider .swiper-slide .white-box{overflow: visible !important; margin-bottom: 30px !important; padding: 10px;}

.investor-sec .investorSlider .swiper-slide .white-box.left-30{position: relative; left: -100px;}

.investor-sec .investorSlider .swiper-slide .white-box p{position: relative; padding-left: 35px;}

.investor-sec .investorSlider .swiper-slide .white-box p span{border: 3px solid var(--color-one); position: absolute; left: -34px; top: 50%; transform: translateY(-50%) rotateZ(45deg); color: var(--color-one); width: 50px; height: 50px; display: flex; align-items: center; justify-content: center; background: var(--color-two); border-radius: 5px;}

.investor-sec .investorSlider .swiper-slide .white-box p span .number{transform: rotateZ(315deg); color: #fff;} 


/* address */

#address ul{padding: 0px !important; margin: 0px !important; list-style: none;}

#address ul li{position: relative; padding-left: 30px; font-size: 14px; margin-bottom: 8px;}

#address ul li span{position: absolute; left: 0px; top: 0px;}

#address ul li span i{color: var(--color-one);}

#address ul li a{color: var(--black-color);}

#address ul li:last-child{margin-bottom: 0px;}

#address .maps{height: 400px !important; position: relative; border-radius: 10px;}

#address .maps .white-box{position: absolute; padding: 10px !important; width: 200px; right: 15px; top: 15px; border-radius: 5px !important;}


/* testimonials */

#testimonials .col-box {columns: 300px;}

#testimonials .col-box .white-box{margin-bottom: 15px;}


/* ceo */

#ceo .owner-box{margin-top: -60px;}

#ceo .owner-box img{border-radius: 15px;}

#ceo .mb-100{margin-bottom: 100px;}



/* ceo */


/* owner */

#owner .icon-box{display: flex;}

#owner .icon-box .icon{width: 20px; margin-right: 10px;}

#owner .icon-box .icon img{width: 100%;}

#owner .owner-box{margin-top: -60px; overflow: hidden;}

#owner .owner-box img{border-radius: 15px;}

#owner .mb-100{margin-bottom: 100px;}




/* team */

#team h3{text-transform: capitalize;}

#team .color-two{text-transform: capitalize;}

/* core */

#core .text-Box p::first-letter{text-transform: uppercase;}

#core .white-box{height: 100%;}

#core p b{text-transform: lowercase;}


/* servicesOffer */

#servicesOffer{font-size: 23px; line-height: 53px; color: var(--black-color);}

#servicesOffer p{font-size: 23px; line-height: 53px; color: var(--black-color);}

#servicesOffer p::first-letter {text-transform: capitalize;}

/* CompanyMission */

#CompanyMission p .color-two{text-transform: capitalize;}


/* thank you */

.thank-you-svg .cls-1 {fill: #2c51a3;}

.thank-you-svg .cls-2 {fill: #faaf4c;}

.thank-you-svg .cls-3 {fill: #f16279;}

.thank-you-svg .cls-4 {fill: #78c8aa;}

.thank-you-svg .cls-5 {fill: none; stroke-width: 6px;}

.thank-you-svg .cls-5, .cls-6 {stroke: #000; stroke-linecap: round; stroke-miterlimit: 10;}
  
.thank-you-svg .mask {fill: black; stroke: white; stroke-width: 5px;}
  
.thank-you-svg #squiggle-mask-path {stroke-dasharray: 80; stroke-dashoffset: 80; animation: animate-stroke 1s 1.1s forwards cubic-bezier(0,1,.53,1);}
  
.thank-you-svg #left-line-mask-path {stroke-dasharray: 38; stroke-dashoffset: -38; animation: animate-stroke 1s 1.2s forwards cubic-bezier(0,1,.53,1);}
   
.thank-you-svg #right-line-mask-path {stroke-dasharray: 38; stroke-dashoffset: -38; animation: animate-stroke 1s 1.2s forwards cubic-bezier(0,1,.53,1);}
  
@keyframes animate-stroke {100% {stroke-dashoffset: 0;}}
  
  
.thank-you-svg #mint-burst {transform: translateY(70px); animation: move-stars 1s 1s forwards cubic-bezier(0,1,.53,1);}
  
.thank-you-svg #yellow-burst {transform: translate(40px, 10px); animation: move-stars 1s 1s forwards cubic-bezier(0,1,.53,1);}
  
.thank-you-svg #red-burst {transform: translate(-40px, 10px); animation: move-stars 1s 1s forwards cubic-bezier(0,1,.53,1);}
        
.thank-you-svg #blue-star {transform: translate(10px, 40px); animation: move-stars 1s 1025ms forwards cubic-bezier(0,1,.53,1); display: inherit;}
  
.thank-you-svg #yellow-star {transform: translate(-10px, 45px); animation: move-stars 1s 1050ms forwards cubic-bezier(0,1,.53,1);}
  
@keyframes move-stars {100% {transform: translateY(0);}}

.thank-you-svg .dot {animation: reveal-dots 0.9s 1.2s both cubic-bezier(0,1,.53,1); opacity: 0; transform: translate(-5px, 10px);}
  
.thank-you-svg .dot.left-side {transform: translate(5px, 10px);}
  
@keyframes reveal-dots {100% { opacity: 1; transform: translate(0, 0);}}

.thank-you-svg svg {width: 300px;}

.thank-you-svg .thank-you-text{font-size: 40px; text-transform: uppercase;}

.thank-you-svg .thank-you-text p{text-transform: capitalize;}

.thank-you-text .color-one{color: #2c51a3;}
.thank-you-text .color-two{color: #faaf4c;}
.thank-you-text .color-three{color: #f16279;}

.thank-you-text .color-four{color: #78c8aa;}
.thank-you-text .color-five{color: #faaf4c;}
.thank-you-text .ccolor-six{color: #f16279;}

.thank-you-text .color-seven{color: #78c8aa;}
.thank-you-text .color-eight{color: #faaf4c;}

.thank-you-text .color-one,
.thank-you-text .color-two,
.thank-you-text .color-three,
.thank-you-text .color-f,
.thank-you-text .color-five,
.thank-you-text .color-six,
.thank-you-text .color-seven,
.thank-you-text .color-eight {display: inline-block; animation: scale-and-rotate 1s ease-in-out;}

@keyframes scale-and-rotate { 
    0% { transform: scale(0.5) rotate(0deg) translateY(0);}
    50% {transform: scale(1.2) rotate(20deg) translateY(-10px);}
    100% {transform: scale(1) rotate(0deg) translateY(0);}
}

/* tooltip */

.heightFullwidth{height: 100dvh !important; overflow: hidden;}

.bg-tooltip{position: absolute; width: 100%; height: 100vh; z-index: 99999;}

.bg-tooltip .first-bg{height: 100%; width: 100%; position: absolute; top: 0px; left: 0px;}

.bg-tooltip .first-bg .black-background{height: 100%; background: #0000008a;}

.bg-tooltip .first-bg .black-background p{color: #fff; position: absolute; bottom: 80px; 
left: 30px; font-size: 40px; }



/* screen-one */

.svg-line{position: absolute; z-index: -1;}

.screen-one .six-input input{ text-align: center;}

.screen-one .six-input input { border: none; text-align: center; width: 44px;height:44px;font-size: 36px; background-color: #fff; margin-right:7px;}

.screen-one .six-input input:focus { border: 1px solid #573D8B;outline:none;}

#pin-setup-btn { text-transform:capitalize; }

.screen-one .six-input input::-webkit-outer-spin-button,
.screen-one .six-input input::-webkit-inner-spin-button {  -webkit-appearance: none;  margin: 0; }
/* screen-one */

/* dashboard */

/* dashboard */

/* login screen pin css */


.loginpage{ width: 100%; isolation: isolate; height: 100vh; overflow: hidden; padding: 30px; position: relative;}

.loginpage::after{content: ""; position: absolute; background: url(../image/deepmind.jpg) no-repeat; background-size: cover; z-index: -1; animation: linear 50s scale;  width: 100%; height: 100%; left: 0px; top: 0px;}

@keyframes scale {
    0%{transform: scale(1);} 50%{transform: scale(1.5);} 100%{transform: scale(1.10);}
}

.loginpage .border{border-color: #fff !important; position: relative;}

.loginpage .transparent-bg{height: 100%;}

.login-box-ani{position: absolute; background: #fff; right: 0px; top: 0px; height: 100%; width: calc(100% - 60%); padding: 30px; display: flex; align-items: center; 
animation: linear 1.9s sideanimation forwards;}

@keyframes sideanimation {0%{right: 0%; filter: blur(10px); opacity: 0;}
    100%{right: 60%; filter: blur(0px); opacity: 1;}
}


.login .six-input input{ text-align: center;}

.login .six-input input {border: none; text-align: center; width: 44px; height:44px; font-size: 36px; background-color: #fff; border: 1px solid #dee2e6; margin-right:7px;} 

.login .six-input input:focus { border: 1px solid #dee2e6; outline:none;}

#pin-setup-btn { text-transform:capitalize; }

.login .six-input input::-webkit-outer-spin-button, .login .six-input input::-webkit-inner-spin-button {-webkit-appearance: none;  margin: 0;}

.login .select2-container{width: 100% !important;}


.login .select-two .tags-container { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px;}

.login .select-two .tag { background-color: #ddd; padding: 5px 10px; border-radius: 5px; display: inline-flex; align-items: center;}

.login .select-two .tag .close-btn { margin-left: 5px; cursor: pointer; color: var(--color-one);}

.password-box{position: relative;}

.password-box .show-P{position: absolute; z-index: 2; color: var(--color-two); cursor: pointer; right: 10px; font-size: 20px; top: 0px;}
  
.register .iti{display: block !important;}


/* register-form */




/* text transform used for transform the case */

.text-upper { text-transform: uppercase !important;}

.text-capital { text-transform: capitalize !important;}


#animatedText {font-size: 14px; font-weight: 500; color: #474646; animation: fade 2s infinite; position: absolute; left: 16px; z-index: 9;}

@keyframes fade {0%, 100% {opacity: 0;} 50% {opacity: 1;}}

/* dropdown */


/* tabs-ui */

.tabs-ui .nav-pills{display: flex; white-space: nowrap;}

.linus .active.linus-tab{border: 1px solid #000; box-shadow: 1px 1px 10px #00000041; background: #cccccc28; border-radius: 5px;}

.linus .linus-tab{border: 0px; background: transparent; }

.linus .linus-tab img{width: 50px;}

.access-ui .select2{width: 100% !important;}

/* atabs-ui */

  
/* vm-preview-form */

.vm-preview-form p{position: relative; padding-left: 83px;}

.vm-preview-form p span{position: absolute; left: 0px; }

    /* Success message styling */
    .success-message {
        background: #28a745; /* Green */
        color: #fff; /* White text */
        font-weight: bold;
        padding: 10px;
        border-radius: 5px;
        text-align: center;
        margin-bottom: 15px;
    }

    /* Policy details styling */
    .policy-details {
        background: #f9f9f9;
        padding: 15px;
        border-radius: 5px;
        border: 1px solid #ddd;
    }
    .policy-details ul {
        padding-left: 0;
        list-style: none;
    }
    .policy-details li {
        margin-bottom: 8px;
    }
    .policy-details strong {
        color: #333;
    }



    
/* ===================== dashboard */


.header.dashboardheader{position: absolute !important; width: 100%;}

.dashboard .dataTables_wrapper{padding: 10px;}

foreignObject{width: 100% !important;}

.dashboard{position: relative;}

.dashboard .warrper{padding-bottom: 100px;}

.dashboard .cards-bg{position: relative; border-radius: var(--border-radius); border: 1px solid #000; isolation: isolate; overflow: hidden;}

.dashboard .color-bg{position: absolute; right: 0px; bottom: 0px; filter: blur(20px); width: 70%; height: 100%; z-index: -1; opacity: 0.5;}

.color-bg.one{background: var(--color-one); }

.color-bg.two{background: #78c8aa;}

.color-bg.three{background: #f86631;}

.color-bg.four{background: #f83131;}





.dashboard .admin-person .dropdown-menu{position: absolute; left: 0px; top: 100%;}

.dashboard .inner{border: 1px solid #000; border-radius: 10px; background: #fff; height: 100%;}

.dashboard .title-box{padding: 10px; border-bottom: 1px solid #000;}

.dashboard .title-box .bi-three-dots{cursor: pointer;}

 
.dashboard .inputType-search{border-radius: 30px; height: 30px; border: 1px solid var(--color-one);}

.dashboard .alert-icon{width: 30px; height: 30px; border: unset; background: var(--color-one); border-radius: 100%; font-size: 12px; color: #fff;}

.dashboard .leftside{background: #fff; border-right: 1px solid #ccc; width: calc(100% - 85%); position: fixed; height: 100vh;}


/* Dashboard */

.dashboard .dropdown .person{width: 30px; height: 30px; overflow: hidden; border-radius: 100%; background: #faaf4c;}

.dashboard .dropdown .person img{height: 100%; object-fit: cover;}

.admin-person .text p{line-height: normal !important;}

.dashboard .navigation .menuClick{font-size: 24px; cursor: pointer; font-weight: 900;}


.dashboard .four-box .card-bg{position: relative;isolation: isolate; border: 1px solid #000; background: #fff; border-radius: 10px; overflow: hidden;}


/* Dashboard */

.ul_solution{position: relative; padding-left: 18px; }

.ul_solution li{font-size: 14px; line-height: 28px; color: var(--black-color); text-transform: capitalize;}

.dataTables_info{width: 50%; float: left;}

.dataTables_paginate{width: 50%; float: left;}

.table-stu .table th{font-size: 14px;}
