1 2
3<script> 4 5</script>
5 6<!DOCTYPE html> 7<html> 8<head> 9 <title>supermathsapp </title> 10 <meta name="viewport" content="width=device-width, initial-scale=1.0" /> 11 12 <meta name="description" content="World's 1st Games-based Abacus Maths App, making complex concepts engaging for children." /> 13 <meta name="keywords" content="abacus classes near me,abacus online classes,abacus maths,abacus class,abacus maths classes,abacus classes,abacus mental math,online abacus classes,abacus math near me,abacus maths online,abacus,abacus for kids,abacus tuition near me,abacus online,abacus tutor,abacus class near me, abacus near me,best online abacus classes,online abacus classes near me,abacus classes for kids,abacus learning online,abacus teaching near me,learn abacus online,maths abacus classes,abacus class online,best english speaking course,english learning classes,learn english online free speaking,english speaking course for beginners,speak english online,free english classes online,spoken english for beginners,free english lessons,best spoken english classes near me,free spoken english course,learn english grammar online,learn english speaking online,english speaking for beginners,free english learning course,advanced english speaking course,Coding Classes,Kids Programming,Coding for Children,Youth Coding Programs,Coding Education,Child-Friendly Coding,Interactive Coding,Kids Coding Workshops,Beginner Coding Classes,Creative Coding for Kids" /> 14 <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"> 15 16 <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/Swiper/11.0.5/swiper-bundle.min.css"> 17 <link rel="stylesheet" type="text/css" href="https://use.fontawesome.com/releases/v5.0.6/css/all.css"> 18 <link href="https://fonts.googleapis.com/css2?family=Heebo:wght@400;500;600&family=Inter:wght@600&family=Lobster+Two:wght@700&display=swap" rel="stylesheet"> 19 <link rel="manifest" href="/Webapp/manifest.webmanifest"> 20 21 <style> 22 /* .left-side.content::before { 23 24 content: ""; 25 background: url(https://supermathsapp.com/content/login/happy-new-year-2026.gif); 26 width: 200px; 27 height: 165px; 28 position: absolute; 29 bottom: 0; 30 left: 43%; 31 background-repeat: no-repeat; 32 background-size: contain; 33 z-index: 9; 34 }*/ 35 .newcal.year2026 .evtcal.new { 36 background: #d29d1e; 37 } 38 39 .newcal.year2026 .eventcal.new { 40 background: #0db560; 41 } 42 43 img.diwali-img { 44 margin-left: 25px; 45 width: 7% !important; 46 } 47 48 49 .homelogout { 50 width: 92%; 51 margin: 0 auto; 52 } 53 54 nav.navbar.navbar-expand-lg.navbar-light.homelogout img { 55 width: 100px; 56 } 57 58 .navbar-light.homelogout .navbar-nav .nav-link { 59 color: #fff; 60 } 61 62 .homelogout ul.navbar-nav.me-auto.mb-2.mb-lg-0 { 63 justify-content: end; 64 } 65 66 .homelogout .navbar-nav .nav-link { 67 color: #fff; 68 background: linear-gradient(90deg, #5c6bc0 35%, rgb(81 184 229) 100%); 69 margin: 2px 5px; 70 border-radius: 7px; 71 padding: 3px 13px; 72 font-size: 15px; 73 font-weight: 400; 74 } 75 76 .navbar-expand-lg.homelogout .navbar-collapse { 77 justify-content: end; 78 } 79 </style> 80 <style type="text/css"> 81 @import url("https://fonts.googleapis.com/css2?family=Comfortaa:wght@700&family=Nunito:wght@300;600&display=swap"); 82 @import url("https://fonts.googleapis.com/css2?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"); 83 84 i.fab::before { 85 color: #fff; 86 font-family: 'Font Awesome 5 Brands'; 87 } 88 89 .row.newcal { 90 margin-bottom: 30px !important; 91 } 92 93 .newcal .evtcal.new { 94 background: #2b9ae2; 95 } 96 97 .newcal .eventcal.new { 98 background: #e65dc1; 99 } 100 101 p.evtname { 102 font-size: 16px; 103 margin: 0px 15px; 104 } 105 106 .newcal .evtcal.new { 107 background: #2b9ae2; 108 } 109 110 .evtcal.new { 111 background: rgb(103, 173, 92); 112 } 113 114 .eventcal.new { 115 background: rgb(236, 160, 15); 116 } 117 118 .evtcal { 119 display: flex; 120 width: 96%; 121 align-items: center; 122 color: rgb(255, 255, 255);
123 box-shadow: rgb(179, 174, 174) 0px 0px 10px 0px; 124 background: cadetblue; 125 border-radius: 6px; 126 } 127 128 .eventcal { 129 width: 20%; 130 font-size: 14px; 131 font-weight: 600; 132 text-align: center; 133 padding: 5px 0px; 134 background: rgb(210, 88, 204); 135 border-radius: 5px 0px 0px 5px; 136 } 137 138 a.regbtn { 139 background: #eca00f; 140 padding: 5px 10px; 141 font-size: 18px; 142 color: #fff; 143 border-radius: 5px; 144 margin-left: 40px; 145 text-decoration: none; 146 } 147 148 button.crs { 149 position: absolute; 150 right: 7px; 151 background: #67ad5c; 152 border: 0; 153 width: 30px; 154 height: 30px; 155 padding: 0; 156 color: #fff; 157 } 158 159 .modal-dialog.evevtpopup { 160 max-width: 85%; 161 } 162 163 div#event { 164 padding: 0 !important; 165 } 166
167 .modal-dialog.evevtpopup .modal-content .modal-header { 168 height: 59px; 169 background-color: #7952b3; 170 position: relative; 171 border-radius: 0; 172 } 173 174 .evevtpopup .modal-body.event-scroll { 175 overflow-y: auto; 176 height: 420px; 177 } 178 179 button.fa.fa-times.closebtn { 180 width: 27px; 181 height: 27px; 182 padding: 0; 183 position: absolute; 184 right: 8px; 185 top: 5px; 186 z-index: 999; 187 } 188 189 body { 190 background: #162561; 191 background-image: radial-gradient( circle at 20% 100%, rgba(184, 184, 184, 0.1) 0%, rgba(184, 184, 184, 0.1) 33%, rgba(96, 96, 96, 0.1) 33%, rgba(96, 96, 96, 0.1) 66%, rgba(7, 7, 7, 0.1) 66%, rgba(7, 7, 7, 0.1) 99% ), linear-gradient(40deg, #040a22, #162561, #202e64, #6f7aa6); 192 background-repeat: no-repeat; 193 background-size: cover; 194 font-family: "Poppins", sans-serif; 195 min-height: 100vh; 196 } 197 198 .banner-section { 199 /* display: grid; 200 grid-template-columns: 50% 45%; 201 place-items: center; 202 gap: 60px; */ 203 min-height: 100vh; 204 } 205 /* CONTENT */ 206 207 .main-banner-box { 208 gap: 40px; 209 display: grid; 210 grid-template-columns: repeat(2, minmax(0, 1fr)); 211 align-items: center; 212 padding: 0px 70px; 213 } 214 215 .content h1 { 216 font-family: "Comfortaa", sans-serif; 217 font-size: 2.8vw; 218 font-weight: 700; 219 line-height: 1.2; 220 letter-spacing: 1px; 221 margin-bottom: 18px; 222 color: #fff; 223 } 224 225 .content p { 226 font-size: 1.2vw; 227 font-weight: 300; 228 line-height: 1.5; 229 margin-bottom: 30px; 230 color: #fff; 231 } 232 233 .content button { 234 background: #eaeaea; 235 color: #202134; 236 font-weight: 600; 237 border: 0; 238 outline: 0; 239 padding: 1.7% 3%; 240 border-radius: 10px; 241 transform: scale(1); 242 transition: all 0.4s ease-in; 243 cursor: pointer; 244 font-size: 1.1vw; 245 margin-right: 8px; 246 } 247 248 .content button:is(:hover, :focus) { 249 transform: scale(0.98); 250 background-color: #6f7aa6; 251 color: #eaeaea; 252 } 253 /* SLIDER */ 254 255 .swiper { 256 position: relative; 257 width: 80%; 258 height: auto; 259 } 260 261 .swiper-slide { 262 position: relative; 263 border: 1px solid rgba(255, 255, 255, 0.3); 264 user-select: none; 265 border-radius: 20px; 266 } 267 268 .cost { 269 position: absolute; 270 top: 8px; 271 right: 6px; 272 background: rgba(255, 255, 255, 0.3); 273 backdrop-filter: blur(6px); 274 -webkit-backdrop-filter: blur(6px); 275 box-shadow: 0 4px 30px rgba(0, 0, 0, 0.2); 276 border-radius: 30px; 277 padding: 6px 10px; 278 color: #fff; 279 font-size: clamp(0.8rem, 4vw, 0.9rem); 280 font-weight: 600; 281 } 282 283 .dark-text { 284 color: #202134; 285 } 286 287 .swiper-slide img { 288 width: 100%; 289 height: 100%; 290 border-radius: 20px; 291 } 292 293 .overlay { 294 position: absolute; 295 display: flex; 296 flex-direction: column; 297 justify-content: center; 298 left: 0; 299 bottom: 0; 300 width: 100%; 301 height: 6vw; 302 padding: 10px 20px; 303 background: rgba(93, 95, 145, 0.2); 304 backdrop-filter: blur(20px); 305 -webkit-backdrop-filter: blur(20px); 306 border-top: 1px solid rgba(255, 255, 255, 0.3); 307 color: #fff; 308 border-radius: 0 0 20px 20px; 309 } 310 311 .overlay h1 { 312 font-size: 1.8vw; 313 text-align: center; 314 font-weight: 600; 315 color: #fff; 316 text-decoration: none; 317 } 318 319 .overlay a { 320 text-decoration: none; 321 } 322 323 .overlay i { 324 padding: 5px; 325 border-radius: 6px; 326 background: linear-gradient( 90deg, rgba(131, 58, 180, 1) 0%, rgba(253, 29, 29, 1) 50%, rgba(252, 176, 69, 1) 100% ); 327 } 328 329 .overlay p { 330 font-size: clamp(0.8rem, 4vw, 0.9rem); 331 font-weight: 300; 332 line-height: 1.3; 333 } 334 335 336 .logobrand img { 337 width: 10%; 338 border-radius: 8px; 339 padding: 5px; 340 } 341 342 343 344 .btn-check:focus + .btn, 345 .btn:focus { 346 outline: 0; 347 box-shadow: none; 348 } 349 /*---- Social Sidebar --- */ 350 351 .social-icons { 352 position: fixed; 353 top: 70%; 354 right: 0; 355 transform: translateY(-50%); 356 font-size: 1.3rem; 357 } 358 359 .social-icons .icon i { 360 font-size: 1.8vw; 361 } 362 363 .icon { 364 width: 100%; 365 height: 100%; 366 display: flex; 367 justify-content: center; 368 align-items: center; 369 background-color: coral; 370 transition: width 0.5s ease; 371 cursor: pointer; 372 transition: 0.5s; 373 padding: 13px; 374 } 375 376 .icon:first-child { 377 border-top-left-radius: 5px; 378 } 379 380 .icon:last-child { 381 border-bottom-left-radius: 5px; 382 } 383 384 .icon:hover { 385 transform: scale(1.08); 386 transition: 0.5s; 387 } 388 389 .icon.fb { 390 background-color: #3a579a; 391 } 392 393 .icon.tw { 394 background-color: #00abf0; 395 } 396 397 .icon.pt { 398 background-color: #cd1c1f; 399 } 400 401 .icon.in { 402 background-color: #0077b5; 403 } 404 405 .icon.gp { 406 background-color: #dd4b39; 407 } 408 409 .navbar-nav .nav-link { 410 color: #fff; 411 background: linear-gradient(90deg, #5c6bc0 35%, rgb(81 184 229) 100%); 412 margin: 5px 5px; 413 border-radius: 7px; 414 padding: 8px 13px; 415 font-size: 1.2vw; 416 font-weight: 400; 417 } 418 419 a.nav-link i { 420 margin-right: 5px; 421 } 422 423 * { 424 margin: 0; 425 padding: 0; 426 box-sizing: border-box; 427 } 428 429 .profilebtn { 430 position: relative; 431 top: 0; 432 left: 57%; 433 width: 35%; 434 height: 50px; 435 margin: 0; 436 display: flex; 437 justify-content: center; 438 align-items: center; 439 } 440 441 .profilebtn a { 442 position: absolute; 443 top: 0; 444 left: 0; 445 width: 100%; 446 height: 100%; 447 display: flex; 448 justify-content: center; 449 align-items: center; 450 background: rgba(255, 255, 255, 0.05); 451 box-shadow: 0 15px 15px rgba(0, 0, 0, 0.3); 452 border-bottom: 1px solid rgba(255, 255, 255, 0.1); 453 border-top: 1px solid rgba(255, 255, 255, 0.1); 454 border-radius: 30px; 455 padding: 8%; 456 letter-spacing: 1px; 457 text-decoration: none; 458 overflow: hidden; 459 color: #fff; 460 font-weight: 400px; 461 z-index: 1; 462 transition: 0.5s; 463 backdrop-filter: blur(15px); 464 font-size: 1.2vw; 465 } 466 467 .profilebtn:hover a { 468 letter-spacing: 3px; 469 } 470 471 .profilebtn a::before { 472 content: ""; 473 position: absolute; 474 top: 0; 475 left: 0; 476 width: 50%; 477 height: 100%; 478 background: linear-gradient( to left, rgba(255, 255, 255, 0.15), transparent ); 479 transform: skewX(45deg) translate(0); 480 transition: 0.5s; 481 filter: blur(0px); 482 } 483 484 .profilebtn:hover a::before { 485 transform: skewX(45deg) translate(200px); 486 } 487 488 .profilebtn::before { 489 content: ""; 490 position: absolute; 491 left: 50%; 492 transform: translatex(-50%); 493 bottom: -5px; 494 width: 30px; 495 height: 10px; 496 background: #00adff; 497 border-radius: 10px; 498 transition: 0.5s; 499 transition-delay: 0.5; 500 } 501 502 .profilebtn:hover::before 503 /*lightup button*/ { 504 bottom: 0; 505 height: 50%; 506 width: 80%; 507 border-radius: 30px; 508 } 509 510 .profilebtn::after { 511 content: ""; 512 position: absolute; 513 left: 50%; 514 transform: translatex(-50%); 515 top: -5px; 516 width: 30px; 517 height: 10px; 518 background: #00adff; 519 border-radius: 10px; 520 transition: 0.5s; 521 transition-delay: 0.5; 522 } 523 524 .profilebtn:hover::after 525 /*lightup button*/ { 526 top: 0; 527 height: 50%; 528 width: 80%; 529 border-radius: 30px; 530 } 531 532 .profilebtn:nth-child(1)::before, 533 /*chnage 1*/ 534 .profilebtn:nth-child(1)::after { 535 background: #ff1f71; 536 box-shadow: 0 0 5px #ff1f71, 0 0 15px #ff1f71, 0 0 30px #ff1f71, 0 0 60px #ff1f71; 537 } 538 539 .profilebtn:nth-child(2)::before, 540 /* 2*/ 541 .profilebtn:nth-child(2)::after { 542 background: #2db2ff; 543 box-shadow: 0 0 5px #2db2ff, 0 0 15px #2db2ff, 0 0 30px #2db2ff, 0 0 60px #2db2ff; 544 } 545 546 .profilebtn:nth-child(3)::before, 547 /* 3*/ 548 .profilebtn:nth-child(3)::after { 549 background: #1eff45; 550 box-shadow: 0 0 5px #1eff45, 0 0 15px #1eff45, 0 0 30px #1eff45, 0 0 60px #1eff45; 551 } 552 553 figure.snip0056 { 554 overflow: hidden; 555 margin: 0px; 556 width: 100%; 557 height: 20vw; 558 color: #000000; 559 border: 1px solid #fff; 560 border-radius: 10px; 561 margin-top: 14px; 562 display: flex; 563 flex-direction: row-reverse; 564 gap: 50px; 565 } 566 567 figure.snip0056 * { 568 -webkit-box-sizing: border-box; 569 box-sizing: border-box; 570 } 571 572 figure.snip0056 > img { 573 width: auto; 574 border-radius: 0% 20% 20% 0%; 575 border: 4px solid #ffffff; 576 -webkit-transition: all 0.35s ease-in-out; 577 transition: all 0.35s ease-in-out; 578 } 579 /* figure.snip0056 figcaption { 580 padding: 10px 10px 10px 10px; 581 color: #fff; 582 } */ 583 584 figure.snip0056 figcaption { 585 padding: 15px 30px 15px 15px; 586 display: flex; 587 flex-direction: column; 588 justify-content: center; 589 align-items: flex-start; 590 /* position: absolute; 591 width: 27%; */ 592 color: #fff; 593 /* left: 24%; */ 594 } 595 596 figure.snip0056 figcaption h2, 597 figure.snip0056 figcaption p { 598 margin: 0; 599 text-align: left; 600 padding: 10px 0; 601 width: 100%; 602 } 603 604 figure.snip0056 figcaption h2 { 605 font-weight: 600; 606 padding-bottom: 10px; 607 font-size: 1.3vw; 608 text-transform: uppercase; 609 border-bottom: 1px solid rgb(255 255 255 / 20%); 610 } 611 612 .asign { 613 background: #eaeaea; 614 color: #202134; 615 font-weight: 600; 616 border: 0; 617 outline: 0; 618 padding: 1.2% 3%; 619 border-radius: 10px; 620 transform: scale(1); 621 transition: all 0.4s ease-in; 622 cursor: pointer; 623 font-size: 1vw; 624 margin-right: 8px; 625 text-decoration: none; 626 } 627 628 figure.snip0056 figcaption h2 span { 629 font-weight: 800; 630 } 631 632 figure.snip0056 figcaption p { 633 font-size: 1.1vw; 634 } 635 636 figure.snip0056 .position { 637 width: 100%; 638 text-align: left; 639 padding: 15px 30px; 640 font-size: 0.9em; 641 opacity: 1;
642 font-style: italic; 643 color: #ffffff; 644 background: #2d3c73; 645 clear: both; 646 } 647 648 .founder { 649 margin-top: 20px; 650 } 651 652 figure.snip0056:hover > img, 653 figure.snip0056.hover > img { 654 left: 6%; 655 } 656 657 .profilemodal { 658 padding: 0; 659 } 660 661 .profilemodalnew .modal-dialog { 662 transform: none; 663 max-width: 45%; 664 } 665 /* 15 */ 666 667 .btn-15 { 668 border: none; 669 z-index: 1; 670 } 671 672 .btn-15:after { 673 position: absolute; 674 content: ""; 675 width: 0; 676 height: 100%; 677 top: 0; 678 right: 0; 679 z-index: -1; 680 background-color: #663dff; 681 border-radius: 5px; 682 box-shadow: inset 2px 2px 2px 0px rgba(255, 255, 255, 0.5), 7px 7px 20px 0px rgba(0, 0, 0, 0.1), 4px 4px 5px 0px rgba(0, 0, 0, 0.1); 683 transition: all 0.3s ease; 684 } 685 686 .btn-15:hover { 687 color: #fff; 688 } 689 690 .btn-15:hover:after { 691 left: 0; 692 width: 100%; 693 } 694 695 .btn-15:active { 696 top: 2px; 697 } 698 699 .custom-btn { 700 font-size: 1.2vw; 701 font-weight: 500; 702 cursor: pointer; 703 transition: all 0.3s ease; 704 position: relative; 705 display: inline-block; 706 box-shadow: inset 2px 2px 2px 0px rgba(255, 255, 255, 0.5), 7px 7px 20px 0px rgba(0, 0, 0, 0.1), 4px 4px 5px 0px rgba(0, 0, 0, 0.1); 707 outline: none; 708 } 709 710 .profilemodalnew .modal-header .btn-close { 711 filter: invert(1); 712 opacity: 1; 713 border: 1px solid; 714 border-radius: 28px; 715 } 716 717 .profilemodalnew .modal-content { 718 background-image: radial-gradient( circle at 20% 100%, rgba(184, 184, 184, 0.1) 0%, rgba(184, 184, 184, 0.1) 33%, rgba(96, 96, 96, 0.1) 33%, rgba(96, 96, 96, 0.1) 66%, rgba(7, 7, 7, 0.1) 66%, rgba(7, 7, 7, 0.1) 99% ), linear-gradient(40deg, #040a22, #162561, #202e64, #6f7aa6); 719 } 720 721 .profilemodalnew .modal-title { 722 font-size: 1.4vw; 723 color: #fff; 724 } 725 726 .position ul li { 727 font-size: 1.5vw; 728 border: 1px solid; 729 padding: 10px; 730 border-radius: 10px; 731 width: 8%; 732 height: 43px; 733 display: flex; 734 justify-content: center; 735 align-items: center; 736 transition: 0.5s; 737 } 738 739 .position ul li:hover { 740 transform: scale(1.1); 741 transition: 0.5s; 742 } 743 744 .position ul { 745 display: flex; 746 list-style: none; 747 column-gap: 18px; 748 margin: 0; 749 padding: 0; 750 } 751 752 section::before { 753 content: ""; 754 position: absolute; 755 bottom: 0px; 756 background: url(math1.gif); 757 width: 14%; 758 height: 100px; 759 background-repeat: no-repeat; 760 background-size: contain; 761 left: 0%; 762 z-index: 999; 763 } 764 765 section::after { 766 content: ""; 767 position: absolute; 768 bottom: 0; 769 background: url(maths.gif); 770 width: 9%; 771 height: 18%; 772 background-size: contain; 773 background-repeat: no-repeat; 774 right: 0; 775 z-index: 999; 776 } 777 778 .sticky-icon { 779 z-index: 1; 780 position: fixed; 781 top: 5%; 782 right: 0%; 783 width: 220px; 784 display: flex; 785 flex-direction: column; 786 z-index: 9; 787 } 788 789 .sticky-icon a { 790 transform: translate(160px, 0px); 791 border-radius: 50px 0px 0px 50px; 792 text-align: left; 793 margin: 2px; 794 text-decoration: none; 795 text-transform: uppercase; 796 padding: 10px; 797 font-size: 14px; 798 font-family: "Oswald", sans-serif; 799 transition: all 0.8s; 800 font-weight: 600; 801 } 802 803 .sticky-icon a:hover { 804 color: #fff; 805 transform: translate(0px, 0px); 806 } 807 808 .sticky-icon a:hover i { 809 transform: rotate(360deg); 810 } 811 /*.search_icon a:hover i { 812 transform:rotate(360deg);}*/ 813 814 .Facebook { 815 background-color: #2c80d3; 816 color: #fff; 817 } 818 819 .Twitter { 820 background-color: #53c5ff; 821 color: #fff; 822 } 823 824 .Instagram { 825 background-color: #fd1d1d; 826 color: #fff; 827 } 828 829 .Google { 830 background-color: #d34836; 831 color: #fff; 832 } 833 834 .sticky-icon a i { 835 background-color: #fff; 836 height: 40px; 837 width: 40px; 838 color: #000; 839 text-align: center; 840 line-height: 40px; 841 border-radius: 50%; 842 margin-right: 9px; 843 transition: all 0.5s; 844 } 845 846 .sticky-icon a i.fa-eye { 847 background-color: #fff; 848 color: #2c80d3; 849 } 850 851 .sticky-icon a i.fa-calendar { 852 background-color: #fff; 853 color: #fa0910; 854 } 855 856 .sticky-icon a i.fa-trophy { 857 background-color: #fff; 858 color: #53c5ff; 859 } 860 861 .fas fa-shopping-cart { 862 background-color: #fff; 863 } 864 865 #myBtn { 866 height: 50px; 867 display: none; 868 position: fixed; 869 bottom: 20px; 870 right: 30px; 871 z-index: 99; 872 text-align: center; 873 padding: 10px; 874 text-align: center; 875 line-height: 40px; 876 border: none; 877 outline: none; 878 background-color: #1e88e5; 879 color: white; 880 cursor: pointer; 881 border-radius: 50%; 882 } 883 884 .fa-arrow-circle-up { 885 font-size: 30px; 886 } 887 888 #myBtn:hover { 889 background-color: #555; 890 } 891 892 @media (max-width: 1199px) { 893 figure.snip0056 { 894 height: 25vw; 895 gap: 50px; 896 } 897 } 898 899 @media (max-width: 991px) { 900 } 901 902 @media (max-width: 991px) { 903 section::after { 904 display: none; 905 } 906 907 section::before { 908 display: none; 909 } 910 911 .overlay { 912 height: 9vw; 913 } 914 915 .swiper { 916 width: 100%; 917 } 918 919 .banner-section { 920 padding: 100px 15px 25px; 921 } 922 923 .logobrand img { 924 width: 120px; 925 } 926 927 .main-banner-box { 928 grid-template-columns: repeat(1, minmax(0, 1fr)); 929 } 930 931 .content button, 932 .custom-btn { 933 padding: 8px 16px; 934 font-size: 22px; 935 border-radius: 30px; 936 } 937 938 figure.snip0056 { 939 height: unset; 940 flex-direction: column-reverse; 941 gap: 0; 942 } 943 944 figure.snip0056 figcaption h2 { 945 font-size: 18px; 946 } 947 948 figure.snip0056 figcaption p { 949 font-size: 18px; 950 } 951 952 figure.snip0056 > img { 953 width: 100%; 954 height: 400px; 955 border-radius: 0; 956 position: initial; 957 left: unset; 958 scale: unset; 959 transform: unset; 960 object-fit: cover; 961 object-position: top center; 962 } 963 964 .overlay h1 { 965 font-size: 30px; 966 } 967 968 .content h1 { 969 font-size: 35px; 970 } 971 972 .main-banner-box { 973 padding: 0px 30px; 974 } 975 } 976 977 @media (max-width: 767px) { 978 .navbar-light.homelogout .navbar-nav .nav-link { 979 color: #fff; 980 width: 80%; 981 margin-top: 6px; 982 } 983 984 .navbar-light .navbar-toggler { 985 filter: invert(1); 986 } 987 988 .social-icons .icon i { 989 font-size: 17px; 990 } 991 992 .social-icons .icon { 993 padding: 10px; 994 } 995 996 .swiper { 997 width: 90%; 998 } 999 1000 .main-banner-box { 1001 padding: 0px 15px; 1002 } 1003 1004 .overlay h1 { 1005 font-size: 16px; 1006 } 1007 1008 .overlay { 1009 height: 10vw; 1010 } 1011 1012 figure.snip0056 > img { 1013 height: 300px; 1014 } 1015 1016 .content h1 { 1017 font-size: 25px; 1018 width: 90%; 1019 } 1020 } 1021 1022 @media (min-width: 830px) and (max-width: 991px) { 1023 figure.snip0056 > img { 1024 height: 650px; 1025 } 1026 } 1027 1028 @media (min-width: 768px) and (max-width: 830px) { 1029 figure.snip0056 > img { 1030 height: 550px; 1031 } 1032 } 1033 1034 @media (min-width: 700px) and (max-width: 767px) { 1035 .overlay h1 { 1036 font-size: 32px; 1037 } 1038 1039 .content h1 { 1040 font-size: 35px; 1041 } 1042 } 1043 1044 @media (min-width: 550px) and (max-width: 767px) { 1045 figure.snip0056 > img { 1046 height: 500px; 1047 } 1048 } 1049 1050 @media (min-width: 430px) and (max-width: 550px) { 1051 figure.snip0056 > img { 1052 height: 400px; 1053 } 1054 } 1055 </style> 1056 <style> 1057 .partialModal button.fa.fa-times.closebtn { 1058 width: 17px; 1059 height: 17px; 1060 right: 5px; 1061 top: 5px; 1062 position: absolute; 1063 z-index: 999; 1064 font-size: 20px; 1065 padding: 21px; 1066 display: flex; 1067 justify-content: center; 1068 align-items: center; 1069 } 1070
1071 .partialModal .modal-dialog.modal-xl.modal-dialog-centered { 1072 margin: 0 auto; 1073 } 1074 1075 .partialModal .overlay-container .overlay i { 1076 background: transparent; 1077 } 1078 1079 .partialModal .btntxt::before { 1080 content: ""; 1081 background: url(https://supermathsapp.com/content/NewTheme/img/newblink.gif); 1082 width: 75px; 1083 height: 50px; 1084 position: absolute; 1085 right: 236px; 1086 top: 14px; 1087 background-size: contain; 1088 background-repeat: no-repeat; 1089 z-index: 999; 1090 } 1091 1092 .partialModal button.insprebtn { 1093 width: auto; 1094 right: 0; 1095 background: #12b3b8; 1096 padding: 9px 20px; 1097 margin-top: 20px; 1098 margin-right: 10px; 1099 font-size: 17px; 1100 } 1101 1102 .partialModal .btntxt { 1103 text-align: right; 1104 position: relative; 1105 z-index: 99; 1106 } 1107 1108 1109 .partialModal h2.ac-heading { 1110 font-size: 22px; 1111 margin-bottom: 0; 1112 } 1113 1114 .partialModal div#message { 1115 font-size: 11px; 1116 } 1117 1118 .partialModal .forpass { 1119 width: 100%; 1120 text-align: left; 1121 } 1122 1123 .partialModal .recapchafiled.wrap-input100.validate-input.m-b-20 { 1124 text-align: center; 1125 display: flex; 1126 align-items: center; 1127 } 1128 1129 .partialModal .verifymsg img { 1130 width: 23px; 1131 height: 23px; 1132 } 1133 1134 .partialModal .verifymsg { 1135 display: flex; 1136 align-items: center; 1137 column-gap: 5px; 1138 } 1139 1140 .partialModal p.otpmsg { 1141 text-align: center; 1142 color: green; 1143 /* margin: 0; */ 1144 padding-bottom: 14px; 1145 margin-bottom: 10px !important; 1146 } 1147 1148 .partialModal .modal-body button.btn.btn-primary.savebtn { 1149 text-align: center; 1150 display: flex; 1151 justify-content: center; 1152 align-items: center; 1153 padding: 10px 90px; 1154 margin: 0 auto; 1155 font-weight: 600; 1156 background: #FF5722; 1157 box-shadow: 0px 0px 10px 0px #f3a826; 1158 } 1159 1160 .partialModal .insspirenew::before { 1161 content: ""; 1162 background: url(https://supermathsapp.com/content/NewTheme/img/newblink.gif); 1163 width: 75px; 1164 height: 50px; 1165 position: absolute; 1166 right: 221px; 1167 top: 14px; 1168 background-size: contain; 1169 background-repeat: no-repeat; 1170 z-index: 999; 1171 } 1172 1173 .partialModal button.insprebtn { 1174 width: auto; 1175 right: 0; 1176 background: #12b3b8; 1177 padding: 9px 20px; 1178 margin-top: 20px; 1179 margin-right: 10px; 1180 font-size: 16px; 1181 } 1182 1183 .partialModal .insspirenew { 1184 text-align: right; 1185 position: relative; 1186 z-index: 99; 1187 top: -45%; 1188 } 1189 1190 .partialModal .modal-body input { 1191 background-color: #eee; 1192 border: none !important; 1193 } 1194 1195 .partialModal .modal-title { 1196 color: #fff; 1197 text-align: center; 1198 width: 100%; 1199 font-size: 22px; 1200 font-weight: 600; 1201 } 1202 1203 .partialModal p.txtile { 1204 margin: 0; 1205 color: #fff; 1206 text-align: center; 1207 font-size: 19px; 1208 margin-bottom: 10px; 1209 } 1210 1211 .partialModal .otp-input, .email-otp-input { 1212 width: 110px; 1213 height: 40px; 1214 text-align: center; 1215 font-size: 18px; 1216 margin: 0 5px; 1217 border: 1px solid #ccc; 1218 border-radius: 4px; 1219 outline: none; 1220 transition: border-color 0.3s; 1221 } 1222 1223 .partialModal .phone_no button.btn.dropdown-toggle.btn-light:focus { 1224 outline: 0 !important; 1225 border: 0 !important; 1226 box-shadow: none !important; 1227 } 1228 1229 .partialModal .phone_no button.btn.dropdown-toggle.btn-light { 1230 transform: scale(1); 1231 } 1232 1233 .partialModal .phone_no button.btn.dropdown-toggle.btn-light { 1234 background: #eee !important; 1235 border: none; 1236 padding: 10px 15px; 1237 } 1238
1239 .partialModal .phone_no select input:focus { 1240 outline: 0; 1241 border: 0; 1242 } 1243 1244 .partialModal .phone_no select input:focus { 1245 outline: 0; 1246 border: 0; 1247 } 1248 1249 .partialModal .phone_no { 1250 display: flex; 1251 align-items: center; 1252 column-gap: 10px; 1253 width: 100%; 1254 } 1255 1256 .partialModal .phone_no select { 1257 width: 97px; 1258 background-color: #eee; 1259 border: none; 1260 padding: 12px 15px; 1261 } 1262 1263 @import url('https://fonts.googleapis.com/css?family=Montserrat:400,800'); 1264 1265 * { 1266 box-sizing: border-box; 1267 } 1268 1269 1270 1271 1272 1273 .partialModal .captcha { 1274 padding: 0px !important; 1275 border: 2px solid #ee8a86 !important; 1276 width: 84px !important; 1277 height: 38px !important; 1278 text-align: center !important; 1279 font-size: 20px !important; 1280 font-weight: bold !important; 1281 color: green !important; 1282 } 1283 1284 .partialModal button:hover:enabled { 1285 background: #303030; 1286 } 1287 1288 .partialModal button#btnlogin:disabled { 1289 opacity: .5; 1290 cursor: default; 1291 } 1292 1293 .partialModal p#question { 1294 font-size: 25px; 1295 color: #e32227; 1296 font-weight: bold; 1297 margin-bottom: 13px; 1298 } 1299 1300 .partialModal .field-icon { 1301 float: right; 1302 margin-left: -25px; 1303 margin-top: 0; 1304 position: relative; 1305 z-index: 2; 1306 right: -48%; 1307 font-size: 20px; 1308 top: -38px; 1309 } 1310 1311 .partialModal h1 { 1312 font-weight: bold; 1313 margin: 0; 1314 } 1315 1316 .partialModal h2 { 1317 text-align: center; 1318 } 1319 1320 .partialModal p { 1321 font-size: 14px; 1322 font-weight: 100; 1323 line-height: 20px; 1324 letter-spacing: 0.5px; 1325 margin: 20px 0 30px; 1326 } 1327 1328 .partialModal span { 1329 font-size: 12px; 1330 } 1331 1332 .partialModal a { 1333 color: #333; 1334 font-size: 14px; 1335 text-decoration: none; 1336 margin: 15px 0; 1337 } 1338 1339 .partialModal button:hover { 1340 transform: scale(1.05); 1341 } 1342 1343 .partialModal button { 1344 border-radius: 20px; 1345 border: 1px solid #FF9800; 1346 background: linear-gradient(to right, #FF9800, #dd8d17); 1347 color: #FFFFFF; 1348 font-size: 12px; 1349 font-weight: bold; 1350 padding: 10px 45px; 1351 letter-spacing: 1px; 1352 text-transform: uppercase; 1353 transition: .5s; 1354 } 1355 1356 1357 1358 1359 1360 .partialModal input.otpinput { 1361 background: #fff; 1362 border: 1px solid gainsboro; 1363 border-radius: 10px; 1364 } 1365 1366 .partialModal button:active { 1367 transform: scale(0.95); 1368 } 1369 1370 .partialModal button:focus { 1371 outline: none; 1372 } 1373 1374 .partialModal button.ghost { 1375 background-color: transparent; 1376 border-color: #FFFFFF; 1377 margin-top: 10px; 1378 } 1379 1380 .partialModal form { 1381 background-color: #FFFFFF; 1382 display: flex; 1383 align-items: center; 1384 justify-content: center; 1385 flex-direction: column; 1386 padding: 0 30px; 1387 height: 100%; 1388 text-align: center; 1389 overflow: auto; 1390 overflow-x: hidden; 1391 } 1392 1393 .partialModal input { 1394 background-color: #eee; 1395 border: none; 1396 padding: 8px 15px; 1397 margin: 8px 0; 1398 width: 100%; 1399 } 1400 1401 .partialModal .frombox { 1402 width: 90%; 1403 min-height: 100%; 1404 background-color: #fff; 1405 border-radius: 10px; 1406 box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22); 1407 position: relative; 1408 overflow: hidden; 1409 } 1410 1411 .partialModal .form-container { 1412 position: absolute; 1413 top: 0; 1414 height: 100%; 1415 transition: all 0.6s ease-in-out; 1416 background: #fff; 1417 } 1418 1419 .partialModal .sign-in-container { 1420 left: 0; 1421 width: 50%; 1422 z-index: 2; 1423 } 1424 1425 .container.right-panel-active .sign-in-container { 1426 transform: translateX(100%); 1427 } 1428 1429 .sign-up-container { 1430 left: 0; 1431 width: 50%; 1432 opacity: 0; 1433 z-index: 1; 1434 } 1435 1436 .container.right-panel-active .sign-up-container { 1437 transform: translateX(100%); 1438 opacity: 1;
1439 z-index: 5; 1440 animation: show 0.6s; 1441 } 1442 1443 @keyframes show { 1444 0%, 49.99% { 1445 opacity: 0; 1446 z-index: 1; 1447 } 1448 1449 50%, 100% { 1450 opacity: 1; 1451 z-index: 5; 1452 } 1453 } 1454 1455 .partialModal .overlay-container { 1456 position: absolute; 1457 top: 0; 1458 left: 50%; 1459 width: 50%; 1460 height: 100%; 1461 overflow: hidden; 1462 transition: transform 0.6s ease-in-out; 1463 z-index: 100; 1464 } 1465 1466 .partialModal .container.right-panel-active .overlay-container { 1467 transform: translateX(-100%); 1468 } 1469 1470 .partialModal .overlay { 1471 background: linear-gradient(to right, #FFC107, #f0a22f); 1472 background-repeat: no-repeat; 1473 background-size: cover; 1474 background-position: 0 0; 1475 color: #FFFFFF; 1476 position: relative; 1477 left: -100%; 1478 height: 100%; 1479 width: 200%; 1480 transform: translateX(0); 1481 transition: transform 0.6s ease-in-out; 1482 } 1483 1484 .partialModal .container.right-panel-active .overlay { 1485 transform: translateX(50%); 1486 } 1487 1488 .partialModal .overlay-panel { 1489 position: absolute; 1490 display: flex; 1491 align-items: center; 1492 justify-content: center; 1493 flex-direction: column; 1494 padding: 0 40px; 1495 text-align: center; 1496 top: 0; 1497 height: 100%; 1498 width: 50%; 1499 transform: translateX(0); 1500 transition: transform 0.6s ease-in-out; 1501 } 1502 1503 .partialModal .overlay-left { 1504 transform: translateX(-20%); 1505 } 1506 1507 .container.right-panel-active .overlay-left { 1508 transform: translateX(0); 1509 } 1510 1511 .overlay-right { 1512 right: 0; 1513 transform: translateX(0); 1514 } 1515 1516 .container.right-panel-active .overlay-right { 1517 transform: translateX(20%); 1518 } 1519 1520 .partialModal .social-container { 1521 margin: 20px 0; 1522 position: absolute; 1523 right: 0; 1524 bottom: 0; 1525 } 1526 1527 .social-container a { 1528 border: 1px solid #DDDDDD; 1529 border-radius: 50%; 1530 display: inline-flex; 1531 justify-content: center; 1532 align-items: center; 1533 margin: 0 5px; 1534 height: 40px; 1535 width: 40px; 1536 color: #fff; 1537 } 1538 1539 .savebtn { 1540 background: linear-gradient(to right, #FF4B2B, #FF416C)6; 1541 border: 0; 1542 } 1543 1544 .savebtn:focus { 1545 background: #e63a1c; 1546 border: 1px solid #FF4B2B !important; 1547 outline: 0 !important; 1548 box-shadow: none !important; 1549 } 1550 1551 input.otpinput { 1552 background: #fff; 1553 border: 1px solid gainsboro; 1554 border-radius: 5px; 1555 } 1556 1557 input:focus { 1558 outline: 0; 1559 } 1560 1561 button.btn.btn-primary.savebtn:hover { 1562 background: #f46b3a !important; 1563 border: 0 !important; 1564 } 1565 1566 div#partialModal { 1567 padding: 0 !important; 1568 } 1569 1570 .trailbtnnew { 1571 position: absolute; 1572 z-index: 9999; 1573 left: -109px; 1574 top: 50%; 1575 transform: rotate(90deg); 1576 } 1577 1578 .techbtn a:hover { 1579 transform: scale(1.05); 1580 } 1581 1582 .modal button.btn.btn-primary.savebtn { 1583 text-align: center; 1584 display: flex; 1585 justify-content: center; 1586 align-items: center; 1587 padding: 10px 90px; 1588 margin: 0 auto; 1589 font-weight: 600; 1590 } 1591 1592 .modal .inputfield { 1593 width: 85%; 1594 display: flex; 1595 justify-content: space-around; 1596 margin: 20px auto; 1597 } 1598 1599 .modal button.btn.btn-primary.savebtn { 1600 text-align: center; 1601 display: flex; 1602 justify-content: center; 1603 align-items: center; 1604 padding: 10px 90px; 1605 margin: 0 auto; 1606 font-weight: 600; 1607 } 1608 1609 .modal .input { 1610 height: 3em; 1611 width: 3em; 1612 border: 2px solid #dad9df; 1613 outline: none; 1614 text-align: center; 1615 font-size: 1.5em; 1616 border-radius: 0.3em; 1617 background-color: #ffffff; 1618 outline: none; 1619 /*Hide number field arrows*/ 1620 -moz-appearance: textfield; 1621 } 1622 1623 input[type="number"]::-webkit-outer-spin-button, 1624 input[type="number"]::-webkit-inner-spin-button { 1625 -webkit-appearance: none; 1626 margin: 0; 1627 } 1628 1629 .techbtn a { 1630 margin: 0; 1631 color: #ff4b2b; 1632 font-weight: 600; 1633 background: linear-gradient(to right, #FF9800, #dd8d17); 1634 border: 0; 1635 padding: 10px 10px; 1636 margin-right: 10px; 1637 border-radius: 10px; 1638 color: #fff; 1639 font-size: 11px; 1640 transition: .5s; 1641 } 1642 1643 .headertxt { 1644 display: flex; 1645 position: relative; 1646 } 1647 1648 #form_alignment { 1649 display: flex; 1650 flex: 1; 1651 background-color: red; 1652 } 1653 1654 img.loginimg { 1655 width: 100%; 1656 } 1657 1658 h1.txtlogin { 1659 margin-bottom: 20px; 1660 font-size: 35px; 1661 } 1662 1663 img.btntxt { 1664 width: 50%; 1665 } 1666 1667 .techbtn { 1668 display: flex; 1669 justify-content: right; 1670 align-items: center; 1671 width: 100%; 1672 text-align: center; 1673 } 1674 1675 img.logobtn { 1676 width: 27%; 1677 border-radius: 10px; 1678 margin-left: 10px; 1679 } 1680 1681 .btnplay { 1682 display: flex; 1683 column-gap: 5px; 1684 align-items: center; 1685 margin: 0; 1686 margin-bottom: 0; 1687 } 1688 1689 .forgetpass { 1690 display: flex; 1691 align-items: center; 1692 width: 100%; 1693 column-gap: 25px; 1694 } 1695 1696 .custom-control.custom-checkbox.keeplogin { 1697 display: inline-flex; 1698 font-size: 12px; 1699 width: 31%; 1700 align-items: center; 1701 } 1702 1703 .keeplogin input.custom-control-input { 1704 width: 10%; 1705 margin-right: 10px; 1706 } 1707 1708 .signupbtn { 1709 border-radius: 20px; 1710 border: 1px solid #FF9800; 1711 background: linear-gradient(to right, #FF9800, #dd8d17); 1712 color: #FFFFFF; 1713 font-size: 12px; 1714 font-weight: bold; 1715 padding: 12px 45px; 1716 letter-spacing: 1px; 1717 text-transform: uppercase; 1718 transition: transform 80ms ease-in; 1719 } 1720 1721 .signupbtn:hover { 1722 background: #e63a1c; 1723 border: 1px solid #FF4B2B; 1724 } 1725 1726 .signupbtn:focus { 1727 background: #e63a1c; 1728 border: 1px solid #FF4B2B !important; 1729 outline: 0 !important; 1730 box-shadow: none !important; 1731 } 1732 1733 @keyframes slik { 1734 0% { 1735 transform: scale(.9) 1736 } 1737 1738 50% { 1739 transform: scale(1) 1740 } 1741 1742 100% { 1743 transform: scale(1) 1744 } 1745 } 1746 1747 .profile:hover { 1748 transform: scale(1); 1749 } 1750 1751 .profile { 1752 transition: .5s; 1753 display: flex; 1754 padding: 10px; 1755 border-radius: 5px; 1756 margin-top: 15px; 1757 transition: .5s; 1758 background: linear-gradient(to right, #FFC107, #f0a22f) !important; 1759 } 1760 1761 .profile { 1762 transition: .5s; 1763 display: flex; 1764 padding: 10px; 1765 background: linear-gradient(to right, #FF4B2B, #FF416C); 1766 border-radius: 5px; 1767 margin-top: 15px; 1768 transition: .5s; 1769 } 1770 1771 .focus { 1772 display: flex; 1773 justify-content: space-around; 1774 padding: 0; 1775 } 1776 1777 .focus img { 1778 width: auto; 1779 height: 100px; 1780 margin-right: 20px; 1781 border-radius: 10px; 1782 padding: 4px; 1783 object-fit: cover; 1784 } 1785 1786 p.txtpre { 1787 font-size: 13px; 1788 line-height: 20px; 1789 text-align: left; 1790 margin: 0; 1791 color: #fff; 1792 } 1793 1794 .txtpre span { 1795 font-weight: 600; 1796 margin-bottom: 0 !important; 1797 } 1798 1799 p.txtpre a { 1800 background: #FF9800; 1801 padding: 2px 15px; 1802 margin-top: 7px; 1803 border-radius: 5px; 1804 margin-top: 12px; 1805 font-size: 12px; 1806 color: #fff; 1807 display: flex; 1808 justify-content: right; 1809 width: fit-content; 1810 margin-bottom: 3px; 1811 } 1812 1813 .trailbtn { 1814 font-size: 14px; 1815 border: 0; 1816 animation: trailbtn 5s infinite; 1817 } 1818 1819 @keyframes trailbtn { 1820 0% { 1821 background: linear-gradient(to right, #FF4B2B, #FF416C); 1822 } 1823 1824 20% { 1825 background: linear-gradient(to right, #2196F3, #61cfdd); 1826 } 1827 1828 40% { 1829 background: linear-gradient(to right, #2196F3, #61cfdd); 1830 } 1831 1832 60% { 1833 background: blue; 1834 } 1835 1836 80% { 1837 background: orange; 1838 } 1839 1840 100% { 1841 background: red; 1842 } 1843 } 1844
1845 .modal-dialog { 1846 max-width: 700px; 1847 margin: 1.75rem auto; 1848 } 1849 1850 .modal-title { 1851 color: #fff; 1852 } 1853 1854 .trailbtn a { 1855 color: #fff; 1856 } 1857 1858 @media screen and (min-width:768px) and (max-width:991px) { 1859 1860 .frombox { 1861 min-height: 70%; 1862 } 1863 1864 .techbtn { 1865 justify-content: center; 1866 margin-top: 20px; 1867 text-align: center; 1868 } 1869 1870 .headertxt { 1871 display: block; 1872 text-align: center; 1873 } 1874 1875 img.logobtn { 1876 width: 35%; 1877 } 1878 1879 .phone_no button.btn.dropdown-toggle.btn-light { 1880 width: 100px; 1881 } 1882 1883 h2.ac-heading { 1884 font-size: 22px; 1885 margin-top: 0; 1886 margin-bottom: 0; 1887 } 1888 1889 body { 1890 background-size: cover !important; 1891 } 1892 1893 .forgetpass { 1894 display: block; 1895 } 1896 1897 .custom-control.custom-checkbox.keeplogin { 1898 width: 100%; 1899 } 1900 } 1901 1902 @media screen and (max-width: 767px) { 1903 .trailbtnnew { 1904 left: -99px; 1905 } 1906 1907 1908 1909 .partialModal button { 1910 padding: 9px 27px; 1911 } 1912 1913 .techbtn a { 1914 padding: 8px 8px; 1915 font-size: 11px; 1916 } 1917 1918 img.logobtn { 1919 width: 23%; 1920 } 1921 1922 .social-container a { 1923 height: 30px; 1924 width: 30px; 1925 } 1926 1927 h1.txtlogin { 1928 margin-bottom: 20px; 1929 font-size: 22px; 1930 } 1931 1932 .focus img { 1933 margin-right: 10px; 1934 } 1935 1936 img.loginimg { 1937 width: 63% !important; 1938 } 1939 1940 h2.ac-heading { 1941 font-size: 18px; 1942 margin-top: 30px; 1943 } 1944 1945 .partialModal input { 1946 padding: 8px 15px; 1947 } 1948 1949 .phone_no button.btn.dropdown-toggle.btn-light { 1950 padding: 8px 15px; 1951 width: 100px; 1952 } 1953 1954 .partialModal .frombox { 1955 width: 100%; 1956 } 1957 1958 .partialModal form { 1959 padding: 0 9px; 1960 } 1961 1962 .container.right-panel-active .overlay-container { 1963 transform: translateX(0%) !important; 1964 } 1965 1966 img.logobtn { 1967 object-fit: contain; 1968 } 1969 1970 .custom-control.custom-checkbox.keeplogin { 1971 width: 100%; 1972 } 1973 1974 .social-container { 1975 margin-bottom: 4px; 1976 } 1977 1978 .forgetpass { 1979 display: block; 1980 } 1981 1982 .overlay-container { 1983 left: 0% !important; 1984 width: 100% !important; 1985 height: 50% !important; 1986 } 1987 1988 .container.right-panel-active .sign-up-container { 1989 transform: translateX(0%); 1990 } 1991 1992 .sign-up-container { 1993 left: 0; 1994 width: 100%; 1995 } 1996 1997 .sign-in-container { 1998 left: 0 !important; 1999 width: 100% !important; 2000 } 2001 2002 .form-container form { 2003 justify-content: start !important; 2004 } 2005 2006 .form-container { 2007 top: inherit !important; 2008 bottom: 0 !important; 2009 height: 50% !important; 2010 overflow-y: scroll; 2011 padding: 24px 0px; 2012 } 2013 } 2014 2015 #success, #fail { 2016 display: none; 2017 } 2018 2019 #message, #success, #fail { 2020 margin-top: 10px; 2021 margin-bottom: 10px; 2022 } 2023 2024 p { 2025 display: inline; 2026 margin-right: 5px; 2027 } 2028 2029 .captcha { 2030 padding: 0px !important; 2031 border: 2px solid #ee8a86 !important; 2032 width: 60px !important; 2033 height: 32px !important; 2034 text-align: center !important; 2035 font-size: 20px !important; 2036 font-weight: bold !important; 2037 color: green !important; 2038 } 2039 2040 button:hover:enabled { 2041 background: #303030; 2042 } 2043 2044 button#btnlogin:disabled { 2045 opacity: .5; 2046 cursor: default; 2047 } 2048 2049 p#question { 2050 font-size: 22px !important; 2051 color: #e32227; 2052 font-weight: bold; 2053 } 2054 2055 .btnplay { 2056 display: flex; 2057 column-gap: 5px; 2058 align-items: center; 2059 margin: 20px; 2060 margin-bottom: 0; 2061 } 2062 2063 @keyframes blink { 2064 0%, 100% { 2065 background-color: #ce42e2; 2066 } 2067 2068 50% { 2069 background-color: #d6d013; 2070 } 2071 } 2072 2073 .blinking-button { 2074 background-color: #8EDDBE; 2075 color: white; 2076 animation: blink 1s linear infinite; 2077 } 2078 </style> 2079 <style>
2080 .inspire-popup .modal-content .modal-header { 2081 height: 59px; 2082 background-color: transparent; 2083 } 2084 2085 .inspire-popup .modal-content { 2086 text-align: center; 2087 background: linear-gradient(90deg, rgba(147, 42, 155, 1) 0%, rgba(171, 87, 199, 1) 50%, rgba(237, 221, 83, 1) 100%); 2088 border: 0; 2089 } 2090 2091 .inspire-popup .firstpopup { 2092 display: flex; 2093 flex-wrap: wrap; 2094 width: 100%; 2095 column-gap: 10px; 2096 justify-content: center; 2097 margin-bottom: 20px; 2098 } 2099 2100 .inspire-popup .modal-header h2 { 2101 color: #fff; 2102 text-align: center; 2103 margin: 0; 2104 flex: auto; 2105 } 2106 2107 .inspire-popup p.poptxt { 2108 font-size: 18px; 2109 background: linear-gradient(90deg, rgb(137 71 195) 0%, rgb(146 87 199) 50%, rgb(117 53 211) 100%); 2110 border-radius: 10px; 2111 padding: 6px 6px; 2112 margin: 0 auto; 2113 border-bottom: 3px solid; 2114 margin-top: 10px; 2115 color: #fff; 2116 margin: 0; 2117 } 2118 2119 .inspire-popup .poptxt1 { 2120 font-size: 24px; 2121 color: #fff; 2122 text-align: center; 2123 font-weight: 500; 2124 } 2125 2126 .poptxt1 a { 2127 background: #961197; 2128 color: #fff; 2129 padding: 9px 20px; 2130 border-radius: 9px; 2131 font-size: 20px; 2132 font-weight: 600; 2133 } 2134 </style> 2135 <style> 2136 /* ---- Kid-Friendly Loader (shown before Login/Register popup opens) ---- */ 2137 .kids-loader-overlay { 2138 display: none; 2139 position: fixed; 2140 top: 0; 2141 left: 0; 2142 width: 100%; 2143 height: 100%; 2144 background: rgba(22, 37, 97, 0.94); 2145 z-index: 10050; 2146 justify-content: center; 2147 align-items: center; 2148 text-align: center; 2149 } 2150 2151 .kids-loader-overlay.active { 2152 display: flex; 2153 } 2154 2155 .kids-loader-box { 2156 display: flex; 2157 flex-direction: column; 2158 align-items: center; 2159 } 2160 2161 .kids-loader-abacus { 2162 display: flex; 2163 gap: 14px; 2164 justify-content: center; 2165 margin-bottom: 22px; 2166 } 2167 2168 .kids-loader-bead { 2169 width: 30px; 2170 height: 30px; 2171 border-radius: 50%; 2172 display: inline-block; 2173 box-shadow: 0 4px 10px rgba(0,0,0,0.25); 2174 animation: kidsBeadBounce 1s infinite ease-in-out; 2175 } 2176 2177 .kids-loader-bead:nth-child(1) { 2178 background: #FF5252; 2179 animation-delay: 0s; 2180 } 2181 2182 .kids-loader-bead:nth-child(2) { 2183 background: #FFC107; 2184 animation-delay: 0.1s; 2185 } 2186 2187 .kids-loader-bead:nth-child(3) { 2188 background: #4CAF50; 2189 animation-delay: 0.2s; 2190 } 2191 2192 .kids-loader-bead:nth-child(4) { 2193 background: #2196F3; 2194 animation-delay: 0.3s; 2195 } 2196 2197 .kids-loader-bead:nth-child(5) { 2198 background: #E040FB; 2199 animation-delay: 0.4s; 2200 } 2201 2202 @keyframes kidsBeadBounce { 2203 0%, 80%, 100% { 2204 transform: translateY(0) scale(1); 2205 } 2206 2207 40% { 2208 transform: translateY(-26px) scale(1.15); 2209 } 2210 } 2211 2212 .kids-loader-mascot { 2213 width: 110px; 2214 height: auto; 2215 border-radius: 50%; 2216 border: 4px solid #fff; 2217 box-shadow: 0 0 20px rgba(255,255,255,0.4); 2218 margin-bottom: 16px; 2219 animation: kidsMascotWiggle 1.6s infinite ease-in-out; 2220 } 2221 2222 @keyframes kidsMascotWiggle { 2223 0%, 100% { 2224 transform: rotate(-6deg) scale(1); 2225 } 2226 2227 50% { 2228 transform: rotate(6deg) scale(1.05); 2229 } 2230 } 2231 2232 .kids-loader-text { 2233 color: #fff; 2234 font-family: "Comfortaa", sans-serif; 2235 font-size: 1.3vw; 2236 font-weight: 700; 2237 letter-spacing: 0.5px; 2238 margin: 0; 2239 } 2240 2241 .kids-loader-subtext { 2242 color: #dfe3f5; 2243 font-family: "Poppins", sans-serif; 2244 font-size: 0.9vw;
2245 font-weight: 300; 2246 margin-top: 8px; 2247 } 2248 2249 @media (max-width: 767px) { 2250 .kids-loader-bead { 2251 width: 20px; 2252 height: 20px; 2253 } 2254 2255 .kids-loader-mascot { 2256 width: 80px; 2257 } 2258 2259 .kids-loader-text { 2260 font-size: 20px; 2261 } 2262 2263 .kids-loader-subtext { 2264 font-size: 14px; 2265 } 2266 } 2267 </style> 2268
2268<script> 2269 if ("serviceWorker" in navigator) { 2270 window.addEventListener("load", () => { 2271 navigator.serviceWorker.register("/Webapp/sw.js"); 2272 }); 2273 } 2274 </script>
2274 2275</head> 2276<body><a href="https://supermathsapp.com/cdn-cgi/content?id=Smqc7QBiq8Ckjay9fwo5ajDLzRA5bnoIMDi.4RjQN_A-1790901209.741704-1.2.1.1-3z.084pj_6nVvGu0H7s7cRJY5_ES9Htm_RBp5R6Ga3GfolnJYmHGNBSGVIi5mZz3" aria-hidden="true" rel="nofollow noopener" style="display: none !important; visibility: hidden !important"></a> 2277 <div id="tsparticles"></div> 2278 <!-- Kid-Friendly Loader: shown while Login/Register content loads --> 2279 <div id="kidsLoader" class="kids-loader-overlay"> 2280 <div class="kids-loader-box"> 2281 <img src="https://supermathsapp.com/content/login/olivia_new.png" class="kids-loader-mascot" alt="Loading" /> 2282 <div class="kids-loader-abacus"> 2283 <span class="kids-loader-bead"></span> 2284 <span class="kids-loader-bead"></span> 2285 <span class="kids-loader-bead"></span> 2286 <span class="kids-loader-bead"></span> 2287 <span class="kids-loader-bead"></span> 2288 </div> 2289 <p class="kids-loader-text">Counting the beads for you... ð§®</p> 2290 <p class="kids-loader-subtext">Getting your maths adventure ready!</p> 2291 </div> 2292 </div> 2293 <div class="sticky-icon"> 2294 <a data-bs-toggle="modal" data-bs-target="#event" href="#" class="Instagram"> 2295 <i class="fa fa-calendar" aria-hidden="true"></i> 2296 Event Calendar 2297 </a> 2298 <a target="_blank" href="https://www.byitc.org/" class="Facebook"> 2299 <i class="fa fa-eye" aria-hidden="true"></i> 2300 Visit Website 2301 </a> 2302 2303 <a target="_blank" href="https://supermathsapp.com/utility/Byitc-Awards.html" class="Twitter"> 2304 <i class="fa fa-trophy" aria-hidden="true"></i> 2305 Award 2306 </a> 2307 2308 </div> 2309 <!--End Sticky Icon--> 2310 <div class="social-icons"> 2311 <div class="icon tw"> 2312 <a target="_blank" href="https://www.instagram.com/byitc_supermaths_uk"> 2313 <i class="fab fa-instagram" aria-hidden="true"></i> 2314 </a> 2315 </div> 2316 <div class="icon in"> 2317 <a target="_blank" href="https://www.linkedin.com/company/11059414/"> 2318 <i class="fab fa-linkedin-in" aria-hidden="true"></i> 2319 </a> 2320 </div> 2321 <div class="icon gp"> 2322 <a target="_blank" href="https://www.youtube.com/channel/UC9xJB7iUiLC0X9zd2rMiraw"> 2323 <i class="fab fa-youtube" aria-hidden="true"></i> 2324 </a> 2325 </div> 2326 </div> 2327 <nav class="navbar navbar-expand-lg navbar-light homelogout"> 2328 <div class="container-fluid"> 2329 <img src="https://www.supermathsapp.com/Content/Login/logo.png"> 2330 2331 <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="true" aria-label="Toggle navigation"> 2332 <span class="navbar-toggler-icon"></span> 2333 </button> 2334 <div class="navbar-collapse collapse " id="navbarSupportedContent"> 2335 <ul class="navbar-nav "> 2336 <li class="nav-item"> 2337 <a class="nav-link" href="/Home/Register">Try Free for 7 Days</a> 2338 </li> 2339 <li class="nav-item"> 2340 <a class="nav-link" href="/Home/Privacy">Child Safety</a> 2341 </li> 2342 <li class="nav-item"> 2343 <a class="nav-link" target="_blank" href="https://supermaths.co.uk/franchise/">Franchise</a> 2344 </li> 2345 2346 2347 <li class="nav-item"> 2348 <a class="nav-link" href="/home/application">App</a> 2349 </li> 2350 </ul> 2351 2352 </div> 2353 </div> 2354 </nav> 2355 <section> 2356 <div class="main-banner-box"> 2357 <div class="left-side content"> 2358 <h1> World's first Game- Based Abacus Maths Application</h1> 2359 <button onclick="LoginPopup()" style="cursor:pointer" class=" btn gradient-button blinking-button ">Login/Register</button> 2360 <div class="founder"> 2361 <figure class="snip0056">
2362 <figcaption> 2363 <h2>Founder, Director</h2> 2364 <p>Dr Rashmi Mantri is pioneering a new era of kidsâ learning with her award-winning Supermaths app. As an inspiring educator and entrepreneur, she equips children with essential life skills and prepares them for a future where they lead, not follow!</p> 2365 <a target="_blank" href="https://supermaths.co.uk/dr-rashmi-mantri/" class="asign custom-btn btn-15">Read More</a> 2366 </figcaption> 2367 <img src="https://www.supermathsapp.com/Content/Login/Dr Rashmi mantri-new.png" alt="sample8" /> 2368 </figure> 2369 </div> 2370 <!-- <div class="profilebtn"><a href="#">Read more</a></div> --> 2371 </div> 2372 2373 <div class="right-side"> 2374 2375 <div class="swiper"> 2376 <div class="swiper-wrapper"> 2377 2378 2379 2380 2381 <!--<div class="swiper-slide"> 2382 <a target="_blank" href="#"> 2383 <img src="https://www.supermathsapp.com/Content/login/Irelandlogin.png" /> 2384 </a>--> 2385 <!--</div>--> 2386 <!--<div class="swiper-slide"> 2387 <a target="_blank" href=""> 2388 <img src="https://www.supermathsapp.com/Content/login/summercourses.webp" /> 2389 </a>--> 2390 <!--</div>--> 2391 <div class="swiper-slide"> 2392 <a href="#"> 2393 <img src="https://www.supermathsapp.com/Content/Login/Business HQ.png" /> 2394 </a> 2395 2396 </div> 2397 <div class="swiper-slide"> 2398 <a target="_blank" href=""> 2399 <img src="https://www.supermathsapp.com/Content/login/winner%20NextGen%20Icon%20Award.jpeg" /> 2400 </a> 2401 2402 </div> 2403 2404 2405 <div class="swiper-slide"> 2406 <a href="#" id="chatbot-link"> 2407 <img src="https://supermathsapp.com/content/login/olivia_new.png" /> 2408 </a> 2409 <div class="overlay"> 2410 <a href="#" id="chatbot-link"> 2411 <h1> <i class="fas fa-hand-point-up"></i> OLIVIA(AI Assistant )</h1> 2412 </a> 2413 </div> 2414 </div> 2415 2416 <div class="swiper-slide"> 2417 <img src="https://www.supermathsapp.com/Content/Login/DIGITAL-TECH.png" /> 2418 <div class="overlay"> 2419 <h1> Digital Tech Award</h1> 2420 </div> 2421 </div> 2422 2423 2424 2425 2426 </div> 2427 </div> 2428 </div> 2429 </div> 2430 2431 </section> 2432 <div class="modal fade partialModal" id="partialModal" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true"> 2433 <div style="max-width:95%" class="modal-dialog modal-xl modal-dialog-centered"> 2434 <div style="max-width:100%" class="modal-content"> 2435 2436 <button onclick="HidePopup()" type="button" class="fa fa-times closebtn" data-bs-dismiss="modal" aria-label="Close"></button> 2437 2438 <div style="height:100vh" class="modal-body login-model"> 2439 <!-- About Start --> 2440 <!-- About End --> 2441 </div> 2442 </div> 2443 </div> 2444 </div> 2445 <!-- Modal --> 2446 <div class="modal fade" id="event" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true">
2447 <div class="modal-dialog evevtpopup modal-xl modal-dialog-centered"> 2448 <div class="modal-content "> 2449 <div class="modal-header " style=" padding: 10px 0px;"> <a href="https://www.byitc.org/register/" class="regbtn">Register Now</a><button type="button" class=" crs" data-bs-dismiss="modal" aria-label="Close">X</button></div> 2450 <div class="modal-body event-scroll"> 2451 2452 2453 <!-- About Start --> 2454 <div class="container-xxl py-2"> 2455 <div class="container"> 2456 2457 <h2 class="calhead">Events Calendar â 2026</h2> 2458 <div class="row newcal year2026"> 2459 <div class="col-lg-4 wow fadeInUp" data-wow-delay="0.1s"> 2460 <div class="evtcal new"> 2461 <div class="eventcal new"> 2462 24th 2463 <br> 2464 Jan 2465 </div> 2466 <p class="evtname"> 2467 Reading Skill Workshop 2468 </p> 2469 </div> 2470 <div class="evtcal new mt-3"> 2471 <div class="eventcal new"> 2472 16th - 22nd 2473 <br> 2474 Feb 2475 </div> 2476 <p class="evtname"> 2477 BYITC Coding Week (Python Challenge) 2478 2479 </p> 2480 </div> 2481 <div class="evtcal new mt-3"> 2482 <div class="eventcal new"> 2483 7th 2484 <br> 2485 Mar 2486 </div> 2487 <p class="evtname"> 2488 British Science Week - Webinar 2489 2490 </p> 2491 </div> 2492 <div class="evtcal new mt-3"> 2493 <div class="eventcal new"> 2494 20th-25th 2495 <br> 2496 Apr 2497 </div> 2498 <p class="evtname"> 2499 International Maths Olympiad 2500 </p> 2501 </div> 2502 <div class="evtcal new mt-3"> 2503 <div class="eventcal new"> 2504 16th 2505 <br> 2506 May 2507 </div> 2508 <p class="evtname"> 2509 11+ Webinar 2510 2511 </p> 2512 </div> 2513 </div> 2514 <div class="col-lg-4 wow fadeInUp" data-wow-delay="0.1s"> 2515 2516 2517 <div class="evtcal new"> 2518 <div class="eventcal new"> 2519 July to 2520 <br> 2521 Aug 2522 </div> 2523 <p class="evtname"> 2524 Summer Coding Course 2525 </p> 2526 </div> 2527 2528 <div class="evtcal new mt-3"> 2529 <div class="eventcal new"> 2530 July to 2531 <br> 2532 Aug 2533 </div> 2534 <p class="evtname"> 2535 Summer Science Course 2536 </p> 2537 </div> 2538 <div class="evtcal new mt-3 "> 2539 <div class="eventcal new"> 2540 22nd 2541 <br> 2542 Aug 2543 </div> 2544 <p class="evtname"> 2545 Creative Writing Workshop-2 2546 </p> 2547 </div> 2548 <div class="evtcal new mt-3"> 2549 <div class="eventcal new"> 2550 19th-27th 2551 <br> 2552 Sep 2553 </div> 2554 <p class="evtname"> 2555 International Maths Olympiad 2556 2557 </p> 2558 </div> 2559 2560 2561 <div class="evtcal new mt-3"> 2562 <div class="eventcal new"> 2563 19th 2564 <br> 2565 Sep 2566 2567 </div> 2568 <p class="evtname"> 2569 B2B Franchise Webinar 2570 </p> 2571 </div> 2572 </div> 2573 <div class="col-lg-4 wow fadeInUp" data-wow-delay="0.1s"> 2574 2575 2576 <div class="evtcal new"> 2577 <div class="eventcal new"> 2578 Sep 2579 <br> 2580 2026 2581 </div> 2582 <p class="evtname"> 2583 BYITC Inspire Awards 2026 2584 </p> 2585 </div> 2586 <div class="evtcal new mt-3"> 2587 <div class="eventcal new"> 2588 7th - 22nd 2589 <br> 2590 Oct 2591 </div> 2592 <p class="evtname"> 2593 Coding Diwali Week (European Coding Week) 2594 </p> 2595 </div> 2596 <div class="evtcal new mt-3"> 2597 <div class="eventcal new"> 2598 18th 2599 <br> 2600 Oct 2601 </div> 2602 <p class="evtname"> 2603 6th International English Olympiad 2604 </p> 2605 </div> 2606 </div> 2607 </div> 2608 2609 2610 <h2 class="calhead">Events Calendar â 2025</h2> 2611 <div class="row newcal"> 2612 <div class="col-lg-4 wow fadeInUp" data-wow-delay="0.1s"> 2613 <div class="evtcal new"> 2614 <div class="eventcal new"> 2615 18th 2616 <br> 2617 Jan 2618 </div> 2619 <p class="evtname"> 2620 B2B Franchise Webinar-1 2621 </p> 2622 </div> 2623 <div class="evtcal new mt-3"> 2624 <div class="eventcal new"> 2625 25th 2626 <br> 2627 Jan 2628 </div> 2629 <p class="evtname"> 2630 Creative Writing Workshop- 1 2631 2632 </p> 2633 </div> 2634 <div class="evtcal new mt-3"> 2635 <div class="eventcal new"> 2636 8th 2637 <br> 2638 Feb 2639 </div> 2640 <p class="evtname"> 2641 Science Webinar 2642 2643 </p> 2644 </div> 2645 <div class="evtcal new mt-3"> 2646 <div class="eventcal new"> 2647 16th-22nd 2648 <br> 2649 Feb 2650 </div> 2651 <p class="evtname"> 2652 BYITC Coding Week (Python Challenge) 2653 </p> 2654 </div> 2655 2656 </div> 2657 <div class="col-lg-4 wow fadeInUp" data-wow-delay="0.1s"> 2658 <div class="evtcal new"> 2659 <div class="eventcal new"> 2660 24th-29th 2661 <br> 2662 Mar 2663 </div> 2664 <p class="evtname"> 2665 7th International Maths Olympiad 2666 2667 </p> 2668 </div> 2669 <div class="evtcal new mt-3"> 2670 <div class="eventcal new cal2025">June</div> 2671 <p class="evtname">Science Webinar-2 </p> 2672 </div> 2673 <div class="evtcal new mt-3"> 2674 <div class="eventcal new"> 2675 July 2676 <br> 2677 Aug 2678 </div> 2679 <p class="evtname"> 2680 Summer Course 2025 2681 </p> 2682 </div> 2683 2684 <div class="evtcal new mt-3"> 2685 <div class="eventcal new"> 2686 23rd 2687 <br> 2688 Aug 2689 </div> 2690 <p class="evtname"> 2691 Drone and Robotics Discovery Workshop 2692 </p> 2693 </div> 2694 2695 </div> 2696 <div class="col-lg-4 wow fadeInUp" data-wow-delay="0.1s"> 2697 <div class="evtcal new "> 2698 <div class="eventcal new"> 2699 3rd 2700 <br> 2701 Sep 2702 </div> 2703 <p class="evtname"> 2704 BYITC Inspire Awards 2025 2705 </p> 2706 </div> 2707 <div class="evtcal new mt-3"> 2708 <div class="eventcal new"> 2709 15th-20th 2710 <br> 2711 Sep 2712 </div> 2713 <p class="evtname"> 2714 8th International Maths Olympiad 2715 2716 </p> 2717 </div> 2718 2719 2720 <div class="evtcal new mt-3"> 2721 <div class="eventcal new"> 2722 15th-18th 2723 <br> 2724 Oct 2725 2726 </div> 2727 <p class="evtname"> 2728 Coding Diwali Week (European Coding Week) 2729 </p> 2730 </div> 2731 <div class="evtcal new mt-3"> 2732 <div class="eventcal new"> 2733 15th 2734 <br> 2735 Nov 2736 </div> 2737 <p class="evtname"> 2738 5th International English Olympiad 2739 </p> 2740 </div> 2741 2742 </div> 2743 </div> 2744 <h2 class="calhead">Events Calendar â 2024</h2> 2745 <div class="row "> 2746 <div class="col-lg-4 wow fadeInUp" data-wow-delay="0.1s"> 2747 <div class="evtcal new"> 2748 <div class="eventcal new"> 2749 16th 2750 <br> 2751 Feb 2752 </div> 2753 <p class="evtname"> 2754 Workshop - Creative Writing I 2755 </p> 2756 </div> 2757 <div class="evtcal new mt-3"> 2758 <div class="eventcal new"> 2759
2759 26th Feb 2760 <br> 2761 3rd Mar 2762 </div> 2763 <p class="evtname"> 2764 CTF Challenge 2765 </p> 2766 </div> 2767 <div class="evtcal new mt-3"> 2768 <div class="eventcal new"> 2769 18th Mar 2770 <br> 2771 23rd Mar 2772 </div> 2773 <p class="evtname"> 2774 International Maths Olympiad 2775 </p> 2776 </div> 2777 <div class="evtcal new mt-3"> 2778 <div class="eventcal new"> 2779 30th 2780 <br> 2781 Apr 2782 </div> 2783 <p class="evtname"> 2784 Inspire Awards 2785 </p> 2786 </div> 2787 </div> 2788 <div class="col-lg-4 wow fadeInUp" data-wow-delay="0.1s"> 2789 <div class="evtcal new"> 2790 <div class="eventcal new">18th<br> May</div> 2791 <p class="evtname">Coding Masterclass Olympiad </p> 2792 </div> 2793 <div class="evtcal new mt-3"> 2794 <div class="eventcal new"> 2795 15th 2796 <br> 2797 June 2798 </div> 2799 <p class="evtname"> 2800 International English Olympiad 2801 </p> 2802 </div> 2803 <div class="evtcal new mt-3"> 2804 <div class="eventcal new"> 2805 1st July 2806 <br> 2807 30th Sep 2808 </div> 2809 <p class="evtname"> 2810 Launch of New Summer Courses 2811 </p> 2812 </div> 2813 <div class="evtcal new mt-3"> 2814 <div class="eventcal new"> 2815 10th 2816 <br> 2817 Aug 2818 </div> 2819 <p class="evtname"> 2820 Workshop - Creative Writing II 2821 </p> 2822 </div> 2823 2824 </div> 2825 <div class="col-lg-4 wow fadeInUp" data-wow-delay="0.1s"> 2826 <div class="evtcal new"> 2827 <div class="eventcal new"> 2828 25th Sep 2829 <br> 2830 1st Oct 2831 </div> 2832 <p class="evtname"> 2833 Scottish Maths Week 2834 </p> 2835 </div> 2836 <div class="evtcal new mt-3"> 2837 <div class="eventcal new"> 2838 21st 2839 <br> 2840 Sep 2841 </div> 2842 <p class="evtname"> 2843 Coding Week Special - Coding Carnival 2844 </p> 2845 </div> 2846 <div class="evtcal new mt-3"> 2847 <div class="eventcal new"> 2848 11th 2849 <br> 2850 Oct 2851 </div> 2852 <p class="evtname"> 2853 Franchise webinar 2854 </p> 2855 </div><div class="evtcal new mt-3"> 2856 <div class="eventcal new"> 2857 19th 2858 <br> 2859 Oct 2860 </div> 2861 <p class="evtname"> 2862 International English Olympiad 2863 </p> 2864 </div> 2865 <div class="evtcal new mt-3"> 2866 <div class="eventcal new">1st - 7th<br>Nov</div> 2867 <p class="evtname">Coding Diwali Event </p> 2868 </div> 2869 </div> 2870 </div> 2871 </div> 2872 </div> 2873 <!-- About End --> 2874 </div> 2875 </div> 2876 </div> 2877 </div> 2878 <!--<div class="modal inspire-popup fade" id="Inpire" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1" aria-labelledby="staticBackdropLabel" aria-hidden="true"> 2879 <div class="modal-dialog modal-xl modal-dialog-centered"> 2880 <div class="modal-content "> 2881 <div class="modal-header "> <h2>BYITC Inspire Awards 2025</h2> <button type="button" class=" crs" data-bs-dismiss="modal" aria-label="Close">X</button></div> 2882 <div class="modal-body event-scroll">--> 2883 2884 2885 <!-- About Start --> 2886 <!--<div class="container"> 2887 2888 2889 2890 2891 <div class="firstpopup"> 2892 <p class="poptxt"><b>Young Achievers Spotlight</b> <br>(AGE- 5 to 17)</p> 2893 <p class="poptxt"><b>Business Excellence Awards</b><br> (AGE- 18 & Above)</p> 2894 </div> 2895 <div class="poptxt1"> 2896 <p>Last Date For Nominations 30th June 2025</p> 2897 <br /> 2898 <br /> 2899 <p> 2900 <a href="https://www.byitc.org/inspire-awards-super-achievers-spotlight/" target="_blank" rel="noopener">Know More</a> 2901 </p> 2902 </div> 2903 </div>--> 2904 <!-- About End --> 2905 <!--</div> 2906 </div> 2907 </div> 2908 </div>--> 2909
2909<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/Swiper/11.0.5/swiper-bundle.min.js"></script>
2909 2910
2910<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/[email protected]/dist/tsparticles.min.js"></script>
2910 2911
2911<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
2911 2912
2912<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-ygbV9kiqUc6oa4msXn9868pTtWMgiQaeYH7/t7LECLbyPA2x65Kgf80OJFdroafW" crossorigin="anonymous"></script>
2912 2913 2914
2914<script type="text/javascript"> 2915 var swiper = new Swiper(".swiper", { 2916 effect: "cube", 2917 grabCursor: true, 2918 loop: true, 2919 speed: 1000, 2920 cubeEffect: { 2921 shadow: false, 2922 slideShadows: true, 2923 shadowOffset: 10, 2924 shadowScale: 0.94, 2925 }, 2926 autoplay: { 2927 delay: 2600, 2928 pauseOnMouseEnter: true, 2929 }, 2930 }); 2931 2932 tsParticles.load("tsparticles", { 2933 fpsLimit: 60, 2934 backgroundMode: { 2935 enable: true, 2936 zIndex: -1, 2937 }, 2938 particles: { 2939 number: { 2940 value: 30, 2941 density: { 2942 enable: true, 2943 area: 800, 2944 }, 2945 }, 2946 color: { 2947 value: [ 2948 "#3998D0", 2949 "#2EB6AF", 2950 "#A9BD33", 2951 "#FEC73B", 2952 "#F89930", 2953 "#F45623", 2954 "#D62E32", 2955 ], 2956 }, 2957 destroy: { 2958 mode: "split", 2959 split: { 2960 count: 1, 2961 factor: { 2962 value: 5, 2963 random: { 2964 enable: true, 2965 minimumValue: 4, 2966 }, 2967 }, 2968 rate: { 2969 value: 10, 2970 random: { 2971 enable: true, 2972 minimumValue: 5, 2973 }, 2974 }, 2975 particles: { 2976 collisions: { 2977 enable: false, 2978 }, 2979 destroy: { 2980 mode: "none", 2981 }, 2982 life: { 2983 count: 1, 2984 duration: { 2985 value: 1, 2986 }, 2987 }, 2988 }, 2989 }, 2990 }, 2991 shape: { 2992 type: "circle", 2993 stroke: { 2994 width: 0, 2995 color: "#000000", 2996 }, 2997 polygon: { 2998 sides: 5, 2999 }, 3000 }, 3001 opacity: { 3002 value: 1, 3003 random: false, 3004 animation: { 3005 enable: false, 3006 speed: 1, 3007 minimumValue: 0.1, 3008 sync: false, 3009 }, 3010 }, 3011 size: { 3012 value: 8, 3013 random: { 3014 enable: true, 3015 minimumValue: 4, 3016 }, 3017 animation: { 3018 enable: false, 3019 speed: 40, 3020 minimumValue: 0.1, 3021 sync: false, 3022 }, 3023 }, 3024 collisions: { 3025 enable: true, 3026 mode: "destroy", 3027 }, 3028 move: { 3029 enable: true, 3030 speed: 7, 3031 direction: "none", 3032 random: false, 3033 straight: false, 3034 out_mode: "out", 3035 attract: { 3036 enable: false, 3037 rotateX: 600, 3038 rotateY: 1200, 3039 }, 3040 }, 3041 }, 3042 detectRetina: true, 3043 }); 3044 function HidePopup() { 3045 $("#partialModal").find(".login-model").html(''); 3046 } 3047 function LoginPopup() { 3048 $("#kidsLoader").addClass("active"); 3049 $.ajax({
3050 type: "GET", 3051 url: "/home/LoginPopup", 3052 data: {}, 3053 contentType: "application/json; charset=utf-8", 3054 dataType: "html", 3055 success: function (response) { 3056 3057 $("#partialModal").find(".login-model").html(response); 3058 $("#kidsLoader").removeClass("active"); 3059 3060 var loginModal = new bootstrap.Modal(document.getElementById('partialModal')); 3061 loginModal.show(); 3062 3063 }, 3064 failure: function (response) { 3065 $("#kidsLoader").removeClass("active"); 3066 alert(response.responseText); 3067 }, 3068 error: function (response) { 3069 $("#kidsLoader").removeClass("active"); 3070 alert(response.responseText); 3071 } 3072 }); 3073 } 3074 </script>
3074 3075
3075<script> 3076 document.addEventListener("DOMContentLoaded", function () { 3077 var otpInputs = document.querySelectorAll(".otp-input"); 3078 var emailOtpInputs = document.querySelectorAll(".email-otp-input"); 3079 3080 function setupOtpInputListeners(inputs) { 3081 inputs.forEach(function (input, index) { 3082 input.addEventListener("paste", function (ev) { 3083 var clip = ev.clipboardData.getData('text').trim(); 3084 if (!/^\d{6}$/.test(clip)) { 3085 ev.preventDefault(); 3086 return; 3087 } 3088 3089 var characters = clip.split(""); 3090 inputs.forEach(function (otpInput, i) { 3091 otpInput.value = characters[i] || ""; 3092 }); 3093 3094 enableNextBox(inputs[0], 0); 3095 inputs[5].removeAttribute("disabled"); 3096 inputs[5].focus(); 3097 updateOTPValue(inputs); 3098 }); 3099 3100 input.addEventListener("input", function () { 3101 var currentIndex = Array.from(inputs).indexOf(this); 3102 var inputValue = this.value.trim(); 3103 3104 if (!/^\d$/.test(inputValue)) { 3105 this.value = ""; 3106 return; 3107 } 3108 3109 if (inputValue && currentIndex < 5) { 3110 inputs[currentIndex + 1].removeAttribute("disabled"); 3111 inputs[currentIndex + 1].focus(); 3112 } 3113 3114 if (currentIndex === 4 && inputValue) { 3115 inputs[5].removeAttribute("disabled"); 3116 inputs[5].focus(); 3117 } 3118 3119 updateOTPValue(inputs); 3120 }); 3121 3122 input.addEventListener("keydown", function (ev) { 3123 var currentIndex = Array.from(inputs).indexOf(this); 3124 3125 if (!this.value && ev.key === "Backspace" && currentIndex > 0) { 3126 inputs[currentIndex - 1].focus(); 3127 } 3128 }); 3129 }); 3130 } 3131 3132 function enableNextBox(input, currentIndex) { 3133 var inputValue = input.value; 3134 3135 if (inputValue === "") { 3136 return; 3137 } 3138 3139 var nextIndex = currentIndex + 1; 3140 var nextBox = otpInputs[nextIndex] || emailOtpInputs[nextIndex]; 3141 3142 if (nextBox) { 3143 nextBox.removeAttribute("disabled"); 3144 } 3145 } 3146 3147 function updateOTPValue(inputs) { 3148 var otpValue = ""; 3149 3150 inputs.forEach(function (input) { 3151 otpValue += input.value; 3152 }); 3153 3154 if (inputs === otpInputs) { 3155 document.getElementById("verificationCode").value = otpValue; 3156 } else if (inputs === emailOtpInputs) { 3157 document.getElementById("emailverificationCode").value = otpValue; 3158 } 3159 } 3160 3161 setupOtpInputListeners(otpInputs); 3162 3163 3164 //otpInputs[0].focus(); // Set focus on the first OTP input field 3165 //emailOtpInputs[0].focus(); // Set focus on the first email OTP input field 3166 3167 otpInputs[5].addEventListener("input", function () { 3168 updateOTPValue(otpInputs); 3169 }); 3170 3171 3172 }); 3173 </script>
3173 3174
3174<script> 3175 function setCookie(name, value, days) { 3176 var expires = ""; 3177 if (days) { 3178 var date = new Date(); 3179 date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000)); 3180 expires = "; expires=" + date.toUTCString(); 3181 } 3182 document.cookie = name + "=" + (value || "") + expires + "; path=/"; 3183 } 3184 3185 function getCookie(name) { 3186 var nameEQ = name + "="; 3187 var ca = document.cookie.split(';'); 3188 for (var i = 0; i < ca.length; i++) { 3189 var c = ca[i]; 3190 while (c.charAt(0) == ' ') c = c.substring(1, c.length); 3191 if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length, c.length); 3192 } 3193 return null; 3194 } 3195 3196 $(document).ready(function () { 3197 if (!getCookie('modal_shown_today')) { 3198 var myModal = new bootstrap.Modal(document.getElementById('Inpire')); 3199 myModal.show(); 3200 setCookie('modal_shown_today', 'yes', 1); // expires in 1 day 3201 } 3202 }); 3203 </script>
3203 3204
3204<script type="text/javascript"> 3205 (function () { 3206 var s1 = document.createElement("script"), 3207 s0 = document.getElementsByTagName("script")[0]; 3208 s1.async = true; 3209 s1.src = 'https://trial.supermathsapp.com/js/widget.js?ver=27'; 3210 s1.charset = 'UTF-8'; 3211 s1.setAttribute('crossorigin', '*'); 3212 s0.parentNode.insertBefore(s1, s0); 3213 })(); 3214 </script>
3214 3215 3216 3217 <div id="chatbot-popup" style="display:none;"> 3218 <div id="chatbot-content"> 3219 <button id="chatbot-close">×</button> 3220 <iframe style="display:block" id="chatbot-frame" 3221 allow="microphone; autoplay; clipboard-read; clipboard-write"></iframe> 3222 </div> 3223 </div> 3224 <style> 3225 #chatbot-popup { 3226 display: none; 3227 position: fixed; 3228 top: 0; 3229 left: 0; 3230 width: 100%; 3231 height: 100%; 3232 background: rgba(0,0,0,0.6); 3233 justify-content: center; 3234 align-items: center; 3235 z-index: 9999; 3236 } 3237 3238 #chatbot-content { 3239 position: relative; 3240 background: #fff; 3241 padding: 0; 3242 border-radius: 10px; 3243 width: 80%; 3244 height: 500px; 3245 } 3246 3247 #chatbot-frame { 3248 width: 100%; 3249 height: 100%; 3250 border: none; 3251 border-radius: 10px; 3252 } 3253 3254 #chatbot-close { 3255 position: absolute; 3256 top: 5px; 3257 right: 10px; 3258 font-size: 22px; 3259 background: none; 3260 border: none; 3261 cursor: point-er; 3262 } 3263 </style> 3264
3264<script> 3265 const link = document.getElementById("chatbot-link"); 3266 const frame = document.getElementById("chatbot-frame"); 3267 const popup = document.getElementById("chatbot-popup"); 3268 const close = document.getElementById("chatbot-close"); 3269 3270 3271 link.addEventListener("click", function (e) { 3272 e.preventDefault(); 3273 frame.src = "https://trial.supermathsapp.com/olivia.html?ver=6"; // set on open 3274 popup.style.display = "flex"; 3275 }); 3276 3277 close.addEventListener("click", function () { 3278 popup.style.display = "none"; 3279 frame.src = ""; // optional â unload chatbot when closed 3280 }); 3281 3282 3283 </script>
vendor: 2 bytes, line 3283
3283
3284<script type="module" src="https://static.cloudflareinsights.com/beacon.min.js/v31edd6df95cf4e85bb4c19e7a9bdbcba1788362987495" integrity="sha512-iIg7k2xntmwu6/uSb5tpc/hySgZc4eoL31yB29W6tJFo2akwjPWcEqnCEdJvGexCL0KEQwVYv5BlowfhVz26hg==" data-cf-beacon='{"version":"2024.11.0","token":"81e396186f8e4a0c8c5ac3d49477974c","spa":2}' crossorigin="anonymous"></script>
3284 3285</body> 3286</html>
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.