/*
  Theme Name: Nap App
  Theme URL: http://demo.themeregion.com/nap-app
  Author: ThemeRegion
  Author URI: http://www.themeregion.com
  Description: Nap app - App Landing bootstrap Template
  Version: 1.0
*/

/*=======================================================================
[Table of contents]
=========================================================================

1.	Typography
2.	navigation-section
3.	slider-section
4.	Features-section
5.	Description
6.	Choose Color
7.	Screenshots
8.	video-section
9.	Pricing-section
10.	Review Section
11.	ownload-app
12.	Contact us
13.	Index Blue

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


/*========================
=======Typography=========
==========================*/
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

body{
        font-family: 'Inter', sans-serif;
        font-size: 1.4rem;
        color: #4f4f4f;
        background-color: #fff;
        padding-top: 120px;
}

p{
        font-family: 'Inter', sans-serif;
        font-size: 1.4rem;
}


ul {
	list-style: none;
	margin:0;
	padding:0;
}
.navbar-nav li a
{
       font-family: 'Inter', sans-serif;
       font-weight:600;
}
.navbar-nav li a:hover,
.navbar-nav li a:focus {
	outline:none;
	outline-offset: 0;
	text-decoration:none;
	background: transparent;
}

a {
	color: #fff;
	text-decoration: none;
	-webkit-transition: 300ms;
	-moz-transition: 300ms;
	-o-transition: 300ms;
	transition: 300ms;
}

a:focus,
a:hover {
	text-decoration: none;
	outline: none;
	color: #a0d48c;
}

h1 {
        font-size:36px;
}

h2 {
        font-size: 24px;
}

h3 {
        font-size: 20px;
}

h4 {
        font-size: 18px;
}

h5 {
        font-size: 16px;
}

h6 {
        font-size: 14px;
}

h1, h2, h3, h4, h5, h6 {
        font-family: 'Inter', sans-serif;
        font-weight:600;
        /* text-transform:capitalize; */
}

.main-title{
    color: #0077c8;
    text-align: center;
    padding: 20px;
}

.padding{
	padding:35px 0;
}

.section-title {
	margin-bottom: 70px;
	padding-bottom: 0;
	position:relative;
	color: #214D87;
}

.section-title h1 {
	font-size:48px;
	font-weight:700;
	margin-bottom:0;
	/* text-transform:capitalize; */
	color:#214D87;
}

#main-contact-form .btn-animated
{
	color:#00aeef !important;
}

.btn-primary.btn-animated {
	font-size: 12px;
	font-weight: 700;
	padding: 17px 47px;
	background-color:transparent;
	text-transform: uppercase;
	border-color: #fff;
	border-width:3px;
	border-style:solid;
	color:#fff;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	overflow:hidden;
	webkit-box-shadow:none;
	box-shadow:none;
	outline:none;
	letter-spacing:2px;
}

.btn-primary.btn-animated:hover,
.btn-primary.btn-animated:focus {
	background-color:transparent;
	outline:none;
	border:3px solid #a0d48c;
}
.more{
	padding: 6px 20px !important;
}

.btn-primary{
	background-color:#a0d48c;
	color:#fff;
	border:0;
	font-size:12px;
	text-transform:uppercase;
}

.btn-primary:hover {
	background-color:#fff;
	color:#a0d48c
}

.parallax-section {
	background-position: 50% 0;
	background-repeat: no-repeat;
	background-size: cover;
	background-attachment:fixed;
	width: 100%;
	min-height:437px;
	color:#fff;
	position:relative;
}

.overlay-bg {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}

.form-control {
  height: 50px;
  padding:6px 20px;
  color: #000;
  border:1px solid #ededed;
  border-radius:0;
  box-shadow: none;
  -webkit-box-shadow: none;
  outline: none;
  background-color:#fff;
  font-weight:500;
}

.form-control:focus {
  outline: 0;
  -webkit-box-shadow:none;
  box-shadow:none;
  border:1px solid #a0d48c;
  background-color:#fff;
}

textarea.form-control {
    padding: 15px 20px;
}

.form-group {
  margin-bottom: 20px;
}

.navbar-toggle {
	border: 1px solid #fff;
	margin-top: 13px;
}

.navbar-toggle .icon-bar {
	background-color: #fff;
}

 .navbar-toggle,
.navbar-fixed-top .navbar-toggle {
	border: 1px solid #fff;
}

.navbar-toggle .icon-bar,
.navbar-fixed-top .navbar-toggle .icon-bar {
	background-color: #fff;
}

.image-bg {
	background-size: cover;
    background-repeat: no-repeat;
	color:#fff;
	position:relative;
	height: 100%;
	overflow: hidden;
	width: 100%;
}
.slide1 {
	background:linear-gradient(0deg, rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.15)),url(../images/Main_banner_mix.jpg) no-repeat;
	height: 700px;
	background-size: cover;
}

.image-bg .section-title h1 {
	color:#fff;
}
div#main-slider {
    position: absolute;
    width: 100vw;
    height: 700px;
    overflow: hidden;
    left: 0;
}
.image-bg1 {
	background-size: cover;
    background-repeat: no-repeat;
	color:#fff;
	position:relative;
}
.slide2 {
	background:linear-gradient(0deg, rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.15)),url(../images/czeusplanets_banner.png) no-repeat;
	height: 700px;
    background-size: cover;
}

.image-bg1 .section-title h1 {
	color:#fff;
}


.section-title img {
	display:inline-block;
}
.error
{
	color:#ff0000;
}
.overlay-bg {
	background: rgb(40,171,149);
	background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzI4YWI5NSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM3YmQxYTAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
	background: -moz-linear-gradient(left,  rgba(40,171,149,1) 0%, rgba(123,209,160,0.90) 100%);
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(40,171,149,1)), color-stop(100%,rgba(123,209,160,0.90)));
	background: -webkit-linear-gradient(left,  rgba(40,171,149,1) 0%,rgba(123,209,160,0.90) 100%);
	background: -o-linear-gradient(left,  rgba(40,171,149,1) 0%,rgba(123,209,160,0.90) 100%);
	background: -ms-linear-gradient(left,  rgba(40,171,149,1) 0%,rgba(123,209,160,0.90) 100%);
	background: linear-gradient(to right,  rgba(40,171,149,1) 0%,rgba(123,209,160,0.90) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#28ab95', endColorstr='#7bd1a0',GradientType=1 );
}

.overlay-bg1
{
    background: linear-gradient(to left, rgba(2,175,239, 0.7) 0%, rgba(38,81,137, 0.7) 100%) !important
}

.whatsit h1,
.whatsit h2,
.section-title h1,
.feature h2,
#testimonial-slider .item h2,
.twitter-feed h1,
download-apps.html h1 {
	letter-spacing:-2px;
	font-weight:700;
}
/*==============================
=========Home-section=========
================================*/
.white-icon
{
        font-family: 'Inter', sans-serif;
}
#home-section {
	background-color:#7e90a2;
	color:#fff;
	height:700px;
	background-position: center;
    background-size: cover;

}

#home-section-school {
	background-color:#7e90a2;
	background:linear-gradient(0deg, rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.15)),url(../images/Main_banner_school.jpg);
	color:#fff;
	height:600px;
	background-position: center;
    background-size: cover;
}

#home-section-public {
	background-color:#7e90a2;
	background:linear-gradient(0deg, rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.15)),url(../images/Main_banner_public.jpg);
	color:#fff;
	height:700px;
	background-position: center;
    background-size: cover;
}

.home-content.padding{
	padding:120px 70px !important;
}
.caret{
	scale: 1.3 !important;
}

.home-content h2{
	text-transform:initial;
	font-weight:300;
	margin-bottom:35px;
	max-width:400px;
}

.home-content .btn-primary{
	margin-right:25px;
	margin-bottom:10px;
}

.app-icons li a {
	padding:15px;
	font-size:20px;
	height:100px;
	width:100px;
	display:block;
	background-color:transparent;
}
.paddingTopic
{
	padding:80px 0px;
}
.subMenu li
{
	cursor:pointer;
}
.hoverChange:hover
{
	color: #fff;
}
.btn-primary
{
	color: #fff !important;
}
.btn-primary:hover
{
	color: #02aef0 !important;
}
.modal .list-inline a {
    padding: 15px;
    font-size: 26px;
    height: 120px;
    width: 120px;
    display: block;
    background-color: transparent;
}

.app-icons li a:hover {
	background-color:rgba(0, 0, 0, 0.40);
	color:#fff;
}
.strippedtable tr:nth-child(even) {background-color: #f2f2f2;}
.carousel-control-next {
    right: 0;
}
.carousel-control-prev {
    left: 0;
}
.carousel-control-next, .carousel-control-prev {
    position: absolute;
    top: 0;
    bottom: 0;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-align: center;
    opacity: .5;
    color:#000;
}
.borderDesktop
{
border-left: 1px solid #dbdbdb;
}

.maxWidth
{
	max-width: 200px;
}
.events
{
	width: 100%; border: 1px solid; font-size: 0.9em;
}
.events td
{
	padding:5px 5px;
}
.hideBottom
{
	margin-top: 15%;
}
.special-features
{
	margin-top:-35px;
}
.animateHover
{
	 transition: all .2s ease-in-out;
}
.animateHover3
{
	transform: scale(1.2);
}
.animateHover4
{
	transform: scale(0.8);
}
        /* Updated button style to match the provided image */
        .start-button {
            background-color: #00bfff; /* Bright sky blue */
            color: white;
            font-weight: 700;
            padding: 0.75rem 2rem;
            border-radius: 0.75rem; /* Rounded corners */
            border: none;
            border-bottom: 6px solid #008CBA; /* Darker blue bottom border for 3D effect */
            cursor: pointer;
            transition: all 0.15s ease-in-out;
            text-shadow: 1px 1px 1px rgba(0,0,0,0.1);
        }

        .start-button:hover {
            background-color: #1E90FF; /* Slightly darker blue on hover */
            transform: translateY(-2px); /* Move button up slightly */
            border-bottom-width: 8px;
        }

        .start-button:active {
            transform: translateY(1px); /* Move button down to simulate a press */
            border-bottom-width: 5px; /* Make the bottom border smaller */
        }
/*==============================
=========Navigation-section=========
================================*/
	#mainmenu
	{
		padding: 0px !important;
	}
#navigation, .navbar-fixed-top {
	min-height: 60px;
}

.navbar {
	min-height:60px;
	margin-bottom:0;
	border: 0px !important;
	max-height: 120px !important;
	background-color:rgba(33, 77, 135, 0.98);
}
.accountbar {
	display: flex;
    width: 100%;
    justify-content: flex-end;
    color: white;
    background: #00aeef;
    padding-right: 20px;
    align-items: center;
    height: 30px;
	font-weight: 600;
}

.accountbar a {
    color: white;
    font-size: 90%;
	padding: 0px 10px;
    cursor: pointer;
}

div#subMenuBunch {
    margin-top: -20px;
}

@media screen and (orientation: portrait) and (max-width: 600px) {
.expanded{
	max-height: 470px !important;
	margin-top: 60px;
}
.container.navmecontainer {
    width: 100%;
    background-color: rgba(33, 77, 135, 0.98);
    padding: 10px;
}
}


.menuBackground1 {
    position: absolute;
    background: #3372c5;
    height: 65px;
    width: 100%;
    z-index: 1;
    border-bottom: 4px solid #265189;
}

.menuBackground {
    z-index: 2;
    position: relative;
}

.navbar-fixed-top .navbar-collapse {
	width: 100% !important;
}

.navbar-nav>li>a {
	line-height:35px;
	text-transform:uppercase;
	font-size:14px;
	padding:10px 12px;
}

.navbar-nav li a.btn-primary{
	padding: 2px 24px;
	font-size: 12px;
	text-transform: uppercase;
	font-weight:700;
	margin-top: 10px;
	margin-left: 12px;
}

.navbar-nav li a.btn-primary:hover {
	background-color:#fff;
	color:#a0d48c;
}

.navbar-nav li a.active{
	color:#fff !important;
    background: rgba(246,106,48,.9) !important;
    border-start-start-radius: 1px;
    border-start-end-radius: 1px;
}

.navbar-nav li.active a{
	color:#fff;
    background: rgba(246,106,48,.9);
    border-start-start-radius: 1px;
    border-start-end-radius: 1px;
	height: 60px;
}
.navbar-nav li.active .dropdown-menu a {
    background-color: #ffffff;
    border: none;
	font-size: 0.9em;
	padding: 12px;
	 color: #333333;
	 height: auto !important;
}

.navbar-nav li:hover, .dropdown-menu li:hover, .dropdown-menu li a:hover {
	color:#fff !important;
    background: rgba(246,106,48,.8) !important;
    border-start-start-radius: 1px;
    border-start-end-radius: 1px;
}

.nav .open>a, .nav .open>a:focus, .nav .open>a:hover {
	color:#fff !important;
    background: rgba(246,106,48,.8) !important;
}
li.dropdown.open, li.active.dropdown.open, li.dropdown.open .fas {
	color:#fff !important;
    background: rgba(246,106,48,.7) !important;
}
  /* --- Dropdown Menu Styling --- */

/* This styles the dropdown menu container itself (the white box) */
.navbar-custom .dropdown-menu {
    background-color: #ffffff;
    border: none;
    border-radius: 4px;
    box-shadow: 0 6px 12px rgba(0,0,0,.175);
    padding: 5px 0;
}

/* This styles the individual links (list items) inside the dropdown */
.navbar-custom .dropdown-menu > li > a, .navbar-nav li.active .dropdown-menu > li > a {
    color: #333333;
    padding: 8px 20px;
    display: flex;
    align-items: center;
}

/* This styles the Font Awesome icons within the dropdown links */
.navbar-custom .dropdown-menu > li > a > i {
    margin-right: 10px;
    width: 20px;
    text-align: center;
    color: #555555;
}

.navbar-nav li.active .dropdown-menu > li > a > i {
    margin-right: 10px;
    width: 20px;
    text-align: center;
    color: #555555;
}

/* --- Responsive Behavior for Submenus --- */

/* For screens 768px and wider (desktops/tablets), this CSS rule makes the dropdown appear on hover */
@media (min-width: 768px) {
    .navbar-custom .nav > li.dropdown:hover > .dropdown-menu {
        display: block;
    }
}

/* For screens smaller than 768px (mobile), this styles the dropdown links when the menu is open */
@media (max-width: 767px) {
    .navbar-custom .navbar-nav .open .dropdown-menu > li > a {
        color: #eee !important; /* Lighter color for submenu items on mobile */
    }
    .navbar-custom .navbar-nav .open .dropdown-menu > li > a:hover {
        color: #ffffff;
		background: rgba(246, 106, 48, .9) !important;
    }
}

.dropdown-menu li a:hover .fas {
	color:#fff !important;
}

.navbar-nav li a.active1{
	color:#02aef0 !important;
}
ul.nav.nav-pills a {
    color: #222;
    text-align: center;
}
.tab-content
{
	padding-top: 40px;
}
.textingrey a:hover {
    color: #fff;
}

/*==============================
=========whatsit-section=========
================================*/

.whatsit {
	padding: 30px 0 30px 30px;
    text-align: justify;
}

.whatsit h1 {
	font-size:48px;
	font-weight:700;
	color:#43575d;
}

.whatsit h2 {
	font-size:30px;
	font-weight:300;
	margin-bottom:25px;
	text-transform:initial;
	color:#43575d;
}
.rule2 {
    margin-top: -140px;
    width: 60%;
    font-size: 13px !important;
}

/*===============================
=========compare cZeus===
================================*/
.noAds
{
	margin-top:-25px;
}
.topIcons
{
	padding-top: 40px !important;
}
.schoolIcons
{
	color:#3b0759;
}
.mainIcons
{
	color:#317296;
}
.boxMe
{
	border: 1px #f5f5f5 solid;
    box-shadow: 0 3px 61px 0 rgba(0, 0, 0, 0.16);
    border-radius: 24px;
    padding-bottom: 60px;
    margin-top: 27px;
}
.icon-sm
{
	width:10%;
	text-align: center;
	vertical-align: top;
	padding: 5%;
}
.icon-des
{
	width:90%;
	text-align: left;
	padding: 5%;
}
.compare td
{
	padding: 20px 20px;
	vertical-align: top;
}
/*===============================
=========czeus-app section===
================================*/

.img-mix-text1 img {
    float: right;
    padding-left: 20px !important;
    padding-bottom: 20px !important;
    max-height: 420px;
}

.blacklink a
{
	color:#fff;
	padding:5px;
	text-decoration: underline;
	cursor:pointer;
}
.blacklink a:hover
{
	color:#fff;
	padding:5px;
	text-decoration: underline;
}
.blacklink li
{
	padding:5px;
}
.close
{
	opacity: 1;
	color:#fff;
}

/*===============================
=========whats-special-section===
================================*/

#whats-special {
	position:relative;
	background-image:url(../images/bg/special-bg.jpg);
	padding-bottom:0;
	overflow:hidden;
}

.special-content {
	margin-top:80px;
}

.special-content h2 {
	margin-bottom:20px;
}

.special-image {
	text-align:center;
	margin-bottom:-150px;
}

.special-image img {
	display:inline-block;
}
.linksTo a{
	color:#02aef0 !important;
}

.mediaul a{
	color:#02aef0 !important;
}
.feature a
{
	color:#4f4f4f;
}
.feature a:hover
{
	color:#4f4f4f;
}
hr
{
	border-top: 1px solid #ccc;
}


.fa.no:after {
  content: "X";
  color: red;
  font-weight: 700;
  margin-left: -20px;
  font-size: 1em;
}
.stars li
{
	color:#ffdd68;
}
/*================================
=========compatibility-section====
================================*/

.compatibility {
	padding:40px 0;
}

.compatibility .os {
	position:relative;
}

.left-side  {
	border-right:1px solid #dbdbdb;
}

.left-side .compatibility .os {
	padding-right:180px;
}

.right-side .compatibility .os {
	padding-left:180px;
}

.compatibility .os-image {
	position:absolute;
	top:40px;
}

.left-side  .compatibility .os-image {
	right:35px;
}

.right-side .compatibility .os-image {
	left:35px;
}

.compatibility h2 {
	margin-bottom:15px;
	color:#43575d;
}

.compatibility a{
	color:#797877;
	font-weight:600;
	text-transform:uppercase;
	font-size:12px;
       font-family: 'Inter', sans-serif;
       display:inline-block;
       margin-top:10px;
}

.compatibility a:hover {
	color:#a0d48c;
}

/*================================
=========video-section ====
================================*/

#video-section {
	background-image:url(../images/bg/video-bg.jpg);
}

.video {
	position:relative;
}

.video img {
	display:inline-block;
}

.video .video-link {
	position:absolute;
	top:50%;
	left:50%;
	font-size:120px;
	line-height:120px;
	margin-top:-78px;
	margin-left:-60px;
}


/*================================
=========features-section ====
================================*/
#features {
	padding-bottom:35px;
}

.feature {
	margin-bottom:60px;
}

.feature img {
	display:inline-block;
	/* -webkit-filter: grayscale(60%) contrast(100%);
	-moz-filter: grayscale(60%) contrast(100%);
	-o-filter: grayscale(60%) contrast(100%);
	-ms-filter: grayscale(60%) contrast(100%);
	filter: grayscale(60%) contrast(100%); */
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-ms-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
}

.feature:hover img {
	-webkit-filter: grayscale(0) contrast(100%);
	-moz-filter: grayscale(0);
	-o-filter: grayscale(0);
	-ms-filter: grayscale(0);
	filter: grayscale(0);
}

.feature h2{
	margin-top:5px;
	margin-bottom:25px;
	color:#43575d;
}



/*================================
=========Call-to-action ==========
================================*/


#call-to-action {
	background-image:url(../images/bg/action-bg.jpg);
	overflow:hidden;
}

.action-content {
	margin-top:100px;
	max-width:500px;
}

.action-content h1 {
	font-size:48px;
}

.action-content h2 {
	font-size:26px;
	font-weight:300;
	text-transform:initial;
	margin-bottom:35px;
}


/*================================
========= Screenshots Section ==========
================================*/
#screenshot-slider {
	margin-left:-7.5px;
}

.screenshot {
	margin:15px;
	text-align:center;
}

.screenshot img {
	display:inline-block;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.screenshot img:hover {
	opacity:0.6;
}

.owl-theme .owl-controls .owl-pagination {
	text-align:center;
	margin-top:30px;
}
.owl-theme .owl-controls .owl-page{
	display: inline-block;
	zoom: 1;
	*display: inline;
}
.owl-theme .owl-controls .owl-page span{
	display: block;
	width: 12px;
	height: 12px;
	margin: 5px 7px;
	background-color:#a0d48c;
	-webkit-border-radius: 100%;
	-moz-border-radius: 100%;
	border-radius: 100%;
}

.owl-theme .owl-controls .owl-page.active span,
.owl-theme .owl-controls.clickable .owl-page:hover span{
	background-color:#43575d;
}



/*================================
========= Price Section ==========
================================*/

#price {
	background-image:url(../images/bg/price-bg.jpg);
}

.price {
	background-color:#fff;
	color:#4f4f4f;
	padding-top:30px;
	padding-bottom:60px;
}

.price h1 {
	font-size:60px;
	color:#000;
}

.price h2 {
	font-size:20px;
	color:#000;
	margin-top:0;
}

.price ul {
	padding-top:20px;
	padding-bottom:45px;
	min-height:257px;
}

.price ul li {
	margin-top:10px
}

.price .btn-primary {
	color:#000;
	border-color:#a0d48c;
}

.price .btn-primary:hover {
	border-color:#a0d48c;
	color:#a0d48c;
}

.price.featured {
	background-color:#43575d;
	color:#fff;
}

.price.featured h1,
.price.featured h2 {
	color:#fff;
}

.price.featured .btn-primary {
	border-color:#fff;
	color:#fff;
}

.price.featured .btn-primary:hover {
	color:#a0d48c;
	border-color:#a0d48c;
}


/*================================
=========Testimonial Section ====
================================*/
#testimonial-slider .item img {
	display:inline-block;
	border-radius:4px;
}

#testimonial-slider .item h2 {
	margin-bottom:15px;
	color:#43575d;
}

#testimonial-slider .item ul {
	margin-bottom:15px;
}

#testimonial-slider .item ul li {
	color:#ffdd68;
}

#testimonial-slider .item> p {
	max-width:750px;
	display:inline-block
}


/*=========Carousel Fade==========*/

.carousel-fade .carousel-inner .item {
	opacity: 0;
	-webkit-transition-property: opacity;
	-moz-transition-property: opacity;
	-o-transition-property: opacity;
	transition-property: opacity;
	background-repeat: no-repeat;
	background-size: cover;
}

.carousel-fade .carousel-inner .active {
	opacity: 1;
}

.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {
	left: 0;
	opacity: 0;
	z-index: 1;
}

.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {
	opacity: 1;
}

.carousel-fade .carousel-control {
	z-index: 2;
}



/*================================
=========Team Section ====
================================*/
#team {
	background-image:url(../images/bg/team-bg.jpg);
	padding-bottom:25px;
}

.team-info {
	font-weight:700;
	font-size:14px;
	opacity:0;
	-webkit-transition: all 0.5s ease-in-out;
	-moz-transition: all 0.5s ease-in-out;
	-ms-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
	-moz-transform: translateY(78px);
	-webkit-transform: translateY(78px);
	-o-transform: translateY(78px);
	-ms-transform: translateY(78px);
	transform: translateY(78px);
}

.team:hover .team-info {
	opacity:1;
	-moz-transform: translateY(0px);
	-webkit-transform: translateY(0px);
	-o-transform: translateY(0px);
	-ms-transform: translateY(0px);
	transform: translateY(0px);
}

.team img {
	display:inline-block;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.team:hover img {
	opacity:0.4;
}

.team-info h2 {
	margin-bottom:0px;
	margin-top:15px;
}

.team-info li a {
	font-size:16px;
}

.team-info li a:hover {
	color:#43575d;
}

.team-slider-left, .team-slider-right {
	position:absolute;
	top:0;
	height:174px;
	width:70px;
	background-color:#43575d;
	color:#fff;
	-webkit-transition: all 0.3s ease-in-out;
	-moz-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.team-slider-left i,
.team-slider-right i {
	font-size: 45px;
	position: absolute;
	top: 50%;
	left:50%;
	line-height: 45px;
	margin-top: -25px;
}

.team-slider-left i {
	margin-left:-10px;
}

.team-slider-right i {
	margin-left:-5px;
}

.team-slider-left {
	left:0;
}

.team-slider-right {
	right:0;
}

.team-slider-left:hover,
.team-slider-right:hover {
	background-color:#fff;
	color:#43575d;
}

#team-slider {
	padding:0 80px;
}
/*================================
=========school league page ====
================================*/
.schoolTabImage
{
	max-height: 160px;
	margin:auto;
	overflow: visible;
	margin-top: -30px;
}
.schoolTabMain
{
    margin: 15px 0px;
}
.textingrey
{
	padding: 20px 0px;
	color:#fff;
	text-align: left;
}
.declare
{
	max-height: 120px;
}
.centerText
{
	text-align: center;
}
.schoolInfoDiv a
{
	color:#333;
}
.schoolInfoDiv .btn-primary
{
padding: 24px 24px;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: 700;
    margin-top: 10px;
    margin-left: 25px;
}

#teachers a
{
	color:#02aef0;
	overflow-wrap: break-word;
}
form a
{
	color:#02aef0;
}
.m-t {
  margin-top: 15px;
}
.form-control, .single-line {
    background-color: #FFFFFF;
    background-image: none;
    border: 1px solid #e5e6e7;
    border-radius: 1px;
    color: inherit;
    display: block;
    padding: 6px 12px;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    width: 100%;
}

 /* Fix reCAPTCHA positioning and size */
    .grecaptcha-badge {
        bottom: 14px !important;
        right: 14px !important;
       transform: translate(50px, 100px) scale(0.5) !important;
             position: sticky !important;
        transform-origin: bottom right !important;
        z-index: 9999 !important;
        pointer-events: auto !important;
    }
    
    /* Ensure the page doesn't have horizontal scroll due to reCAPTCHA */
    body {
        overflow-x: hidden !important;
    }
    
    /* Additional mobile responsiveness for reCAPTCHA */
    @media (max-width: 768px) {
        .grecaptcha-badge {
            bottom: 10px !important;
            right: 10px !important;
             transform: translate(0px, 100px) scale(0.5) !important;
             position: sticky !important;
        }
    }
    
    @media (max-width: 480px) {
        .grecaptcha-badge {
            bottom: 8px !important;
        right: 8px !important;
        /* transform: scale(0.1) !important; */
        transform: translate(0px, 100px) scale(0.5) !important;
        position: sticky !important;
        }
    }


/* Mobile responsive adjustments */
@media (max-width: 768px) {
    .registerMain {
        padding-top: 60px;
        height: auto;
        min-height: 70vh;
    }
    
    .registerMain h1 {
        margin-top: 20px;
    }
}

@media (max-width: 480px) {
    .registerMain {
        padding-top: 80px;
    }
}

.middle-box {
    max-width: 400px;
    z-index: 100;
    margin: 0 auto;
    padding-top: 40px;
}
.full-width {
    width: 100% !important;
}
.btn-white {
    color: inherit;
    background: white;
    border: 1px solid #e7eaec;
}
.btn-group-sm > .btn, .btn-sm {
    font-size: .8rem;
}
.btn {
    border-radius: 3px;
    font-size: inherit;
}

.btn-block {
    display: block;
    width: 100%;
}
#register a
{
	color:#02aef0;
}
.g-recaptcha.col-sm-12.col-md-12.col-xs-12.form-group {
    margin-left: -20px;
}
/*================================
=========Twitter Section ====
================================*/

#twitter {
	overflow:hidden;
}

.twitter-feed img {
	display:inline-block;
}

.twitter-feed h1 {
	font-size:48px;
	margin-bottom:40px;
	color:#43575d;
}

.twitter-feed a {
	color:#a0d48c;
}

/*===============================
======== Download-apps =========
================================*/

download-apps.html {
	background-image:url(../images/bg/apps-bg.jpg);
}

download-apps.html .overlay-bg {
	background:rgba(0, 114, 188, 0.90);
}

download-apps.html h1 {
	font-size:48px;
	margin-bottom:25px;
}

.apps ul {
	margin-top :35px;
}

.apps ul li a {
	font-size:36px;
	padding:20px;
}

.apps ul li a:hover {
	color:#004a80;
}

.pdesc h3
{
font-weight:bold;font-size:18px; line-height:22px;
}
.public-btn{
	background-color: #e3a100 !important;
}
a.btn.btn-primary.phoneFloat.public-btn{
	color: white;
	text-shadow:
			1px 1px 0 #000
		}
		a.btn.btn-primary.phoneFloat.school-btn{
			color: white;
			text-shadow:
					1px 1px 0 #000
				}

.public-btn:hover{
	color: white !important;
	transform: scale(0.9) !important;
	transition: transform .2s !important;
}

.school-btn{
	background-color: #632282 !important;

}

.school-btn:hover{
	color: white !important;
	transform: scale(0.94) !important;
	transition: transform .2s !important;
}

/*===============================
======== Contact Section =========
================================*/

#contact {
	overflow:hidden;
}

#main-contact-form .btn-primary {
	color:#000;
	margin-top:35px;
	border-color:#a0d48c;
}

#main-contact-form .btn-primary:hover {
	border-color:#a0d48c;
	color:#a0d48c;
}

#footer {
	position:relative;
	padding:35px 0 25px;
	color:#fff;
	background: #fff !important;
}

#footer a {
	font-weight:700;
}

#footer .footer-menu li a {
	font-weight:400;
}

#footer .footer-menu li a:hover {
	color:#43575d;
}

#footer p {
    font-size: 100%;
}

#footer a {
    font-size: 100%;
}
      /* Remove default margins and ensure footer reaches bottom */
      html, body {
        margin: 0;
        padding: 0;
        min-height: 100%;
      }
      
      body {
        display: flex;
        flex-direction: column;
        min-height: 100vh;
      }
      
      #footer {
        margin-top: auto;
      }


/*Magnific-popup overwrite CSS*/

.mfp-figure {
    background-color: #fff;
}

img.mfp-img {
	padding:12px;
}

.mfp-image-holder .mfp-close {
	top:-35px;
}

.mfp-zoom-out-cur .mfp-image-holder .mfp-close {
	cursor:pointer;
}

.mfp-counter {
	right: 50%;
    color: #fff;
    top: 50px;
    margin-right: -20px;
}

.compatibility h2
{
	text-align: center !important;
}

.navbar-fixed-bottom .navbar-collapse, .navbar-fixed-top .navbar-collapse {
    padding-bottom: 0px !important;
}

@media screen and (orientation: portrait) and (max-width: 600px) {
.container>.navbar-collapse, .container>.navbar-header {
    margin-right: -15px;
    margin-left: -15px;
    margin-bottom: 10px;
}
.navbar-nav li.active .dropdown-menu a {
   color: #fff !important;
    font-size: 100%;
    background: rgba(246,106,48,.7) !important;
}
.navbar-nav li.active a{
	height: auto !important;
}
}

/*========================
=======Preloader CSS======
==========================*/
.preloader{
  display: table;
  background: #fff;
  z-index: 999999;
  position: fixed;
  height: 100%;
  width: 100%;
  left: 0;
  top: 0;
}

.button:hover {
    transform: scale(0.95);
    transition: transform .2s;
}

#loaderImage {
  display: table-cell;
  vertical-align: middle;
  overflow: hidden;
  text-align: center;
}

#canvas {
  display: table-cell;
  vertical-align: middle;
  margin: 0 auto;
}

#myCookieConsent {
    z-index: 999;
    min-height: 20px;
    font-family: 'Inter', sans-serif;
    padding: 10px 20px;
    background: rgba(0,0,0,0.9);
    overflow: hidden;
    position: fixed;
    color: #FFF;
    bottom: 0px;
    right: 10px;
    display: none;
    left: 0;
    text-align: left;
    font-size: 13px;
    font-weight: bold;
    width: 100%;
}
#myCookieConsent div {
    padding: 5px 5px;
}
#myCookieConsent a {
    color: #00aeef;
    display: inline-block;
    padding: 0 10px;
    text-align: center;
    cursor:pointer;
}
#myCookieConsent a:hover {
	color: #00aeef;
}
#myCookieConsent a#cookieButton {
    display: block;
    color: #fff;
    font-size: 1.1em;
	background: #00aeef;
    text-decoration: none;
    cursor: pointer;
    padding: 4px 20px;
    border-radius: 20px;
}
#myCookieConsent a#cookieButton:hover {
    background: #fff;
	color: #00aeef;
}
#myCookieConsent a#cookieButton1 {
    display: block;
    color: #fff;
    font-size: 1.1em;
	background: #00aeef;
    text-decoration: none;
    cursor: pointer;
    padding: 4px 20px;
    border-radius: 20px;
}
#myCookieConsent a#cookieButton1:hover {
    background: #fff;
	color: #00aeef;
}



/*========================
=======demo-chooser======
==========================*/

.demo-chooser {
	width: 100px;
	left: -100px;
	position: fixed;
	top: 77%;
	margin-top:-78px;
	z-index: 99999;
	-webkit-transition: all 0.4s ease-in-out;
	-moz-transition: all 0.4s ease-in-out;
	-ms-transition: all 0.4s ease-in-out;
	-o-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
	text-align: center;
}

.demo-chooser.opened {
	left: 0;
}

.demo-chooser.opened .toggler {
	color:#a0d48c;
}

.demo-chooser .toggler {
	position: absolute;
	top: 0;
	right: -40px;
	display: inline-block;
	background-color: #f5f5f5;
	width: 40px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	font-size: 24px;
	color: #3A3434;
	border-radius: 0 4px 4px 0;
}

.demo-chooser-inner {
	position: relative;
	background-color: #f5f5f5;
	padding:15px 20px;
}

.demo-chooser-inner h4 {
	margin: 0px 0 15px;
	text-transform: uppercase;
	font-size: 14px;
	font-weight: 700;
	color: #333;
}

.demo-chooser-inner ul {
	list-style: none;
	padding: 0;
	margin: -5px;
}

.demo-chooser-inner ul li {
	display: block;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
}

.demo-chooser-inner ul li  a {
	padding: 5px 7px;
    background-color: #fcfcfc;
    margin-bottom: 5px;
    display: block;
	color:#43575d;
}

.demo-chooser-inner ul li  a:hover,
.demo-chooser-inner ul li.active a {
	color:#a0d48c;
}

.demo-chooser-inner ul li.active a {
	cursor:default;
}
.show {
 display:block;
 transition: all .33s ease-out;
}

.hidden {
 display:none;
}
.goog-te-banner-frame
{
  display: none !important;
}

body
{
  top:0 !important;
}
.top20
{
	top:25px !important;
}
.blackbox
{
	background-color: rgba(33, 77, 135, 0.9);
    padding: 5px 10px;
    border-radius: 25px;
}
.glossarybox
{
	background-color: #214D87;
    width: 98%;
    padding: 1%;
    margin: 1% 2%;
    border-radius: 10px;
}
.glos
{
	width: 98%;
	text-align: center;
background-color: #f5f5f5;
padding: 2%;
border: 2px solid #e4e4e4;
margin: 1% 2%;
}
#up1
{
	float: right;
	max-width: 45px;
	padding-right: 2%;
}
.pic-youtube
{
	position: absolute;
text-align: center;
margin-left: 45%;
margin-top: 35%;
}
input:-webkit-autofill {
  border: 3px solid blue;
	max-height: 30px;
}
input:autofill {
  border: 3px solid blue;
	max-height: 30px;
}
.topdiv
{
    background: #F8f8f8;
    color:#214D87;
    text-align: center;
}
.topdiv h1
{
    color:#214D87;
    font-size:48px;
    font-family:  'Inter', sans-serif;
	font-weight:600;
    text-align: center;
}
.topdiv h3
{
    color:#214D87;
    font-size:24px;
    font-family:  'Inter', sans-serif;
	font-weight:400;
    text-align: center;
}

.certifyh1
{
    color:#214D87;
    font-size:48px;
    font-family:  'Inter', sans-serif;
	font-weight:600;
    text-align: center;
}
.certifyh2
{
    color:#214D87;
    font-size:36px;
    font-family:  'Inter', sans-serif;
	font-weight:600;
    text-align: center;
}
.certifyh3
{
    color:#214D87;
    font-size:24px;
    font-family:  'Inter', sans-serif;
	font-weight:400;
    text-align: center;
}

.certifybutton
{
    /* Button */


/* Auto Layout */

display: flex;
flex-direction: row;
align-items: flex-start;
padding: 16px 20px;
margin: auto;
position: static;
width: 149px;
height: 59px;
left: 653.5px;
top: 216px;

background: #214D87;
box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
border-radius: 8px;

/* Inside Auto Layout */

flex: none;
order: 2;
flex-grow: 0;
    
    font-family: 'Inter', sans-serif;
font-style: normal;
font-weight: 600;
font-size: 20px;
line-height: 27px;

color: #FFFFFF;
}

.certifyicon
{
    /* Icon */


/* Auto Layout */

display: flex;
flex-direction: row;
align-items: flex-start;
padding: 16px;

position: static;
width: 64px;
height: 64px;
left: 148px;
top: 0px;

background: rgba(33, 77, 135, 0.1);
box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
border-radius: 16px;

/* Inside Auto Layout */

flex: none;
order: 0;
flex-grow: 0;
margin: auto;
}
.certifycenterleft
{
    margin: auto;
    text-align: left;
    margin-bottom: 30px;
}
.certifycenter
{
    margin: auto;
    text-align: center;
    margin-bottom: 30px;
}
.certifypadding
{
     padding: 80px 20px !important;
}
.certifyol li
{
    font-family: 'Inter', sans-serif;
font-style: normal;
font-weight: 600;
font-size: 18px;
line-height: 24px;
    color:#214D87;
    margin-bottom: 15px;
}
.certifyMax
{
    max-width: 150px !important;
    text-align: center;
    float: left;
}
.height50{
    width: 60% !important;
}
.fa-youtube-play{    
  font-size: 70%;
  color: #ff0034;
}
.white-bg {
    color: #fff;
}
.panel-heading .accordion-toggle:after {
    /* symbol for "opening" panels */
    font-family:  "Font Awesome 5 Free";  /* essential for enabling glyphicon */
    content: "\f077";    /* adjust as needed, taken from bootstrap.css */
    float: right;        /* adjust as needed */
    color: grey;         /* adjust as needed */
}
.panel-heading .accordion-toggle.collapsed:after {
    /* symbol for "collapsed" panels */
    content: "\f078";    /* adjust as needed, taken from bootstrap.css */
}
.certifycenter a
{
    display:inline-block;
}
table.compare {
    border: 0px solid #fff !important;
}
.list-inline
{
	padding-bottom: 80px;
}
.list-inline>li
{
	vertical-align: top !important;
}
/* Custom styles for specific brand colors if needed */
        .text-brand-blue { color: #0077c8 !important; }
        .bg-brand-blue { background-color: #0077c8; }
        .hover\:bg-brand-blue-light:hover { background-color: #00a9e0; }
        .text-brand-pink { color: #ec4899; } /* Example pink, adjust if cZeus has a specific one */
        .text-brand-teal { color: #14b8a6; } /* Example teal */

        /* Custom list bullets for visual appeal */
        .custom-list li {
            padding-left: 1.5em;
            position: relative;
			text-align: left;
        }
        h4.text-brand-blue {
    font-size: 0.75em !important;
}
    .slowAn {
        animation: fadeInAnimation ease 3s;
        animation-iteration-count: 1;
        animation-fill-mode: forwards;
}

@keyframes fadeInAnimation {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
.smallerH4
{
    font-size: 0.75em !important;   
}
        .custom-list li::before {
            content: '✓'; /* Or '•', '→', etc. */
            position: absolute;
            left: 0;
            color: #0077c8; /* Brand blue for checkmarks */
            font-weight: bold;
        }

        /* Basic Reset & Typography (since Tailwind is removed) */
        body, h1, h2, h3, p, ul, li, a {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        body {
            font-family: 'Inter', sans-serif;
            color: #4a5568; /* text-gray-700 equivalent */
            line-height: 1.6;
        }
        .container {
            width: 90%;
            max-width: 1200px;
            margin-left: auto;
            margin-right: auto;
            padding-left: 1.5rem; /* px-6 */
            padding-right: 1.5rem; /* px-6 */
        }
        /* Spacing utilities (approximations of Tailwind) */
        .py-12 { padding-top: 2rem; padding-bottom: 1rem; }
        .py-16 { padding-top: 4rem; padding-bottom: 4rem; }
        .mb-6 { margin-bottom: 1.5rem; }
        .mb-4 { margin-bottom: 1rem; }
        .mb-3 { margin-bottom: 0.75rem; }
        .mb-8 { margin-bottom: 2rem; }
        .mb-12 { margin-bottom: 3rem; }
        .mr-3 { margin-right: 0.75rem; }
        .mt-1 { margin-top: 0.25rem; }
        .px-4 { padding-left: 1rem; padding-right: 1rem; }

        @media (min-width: 640px) {
            .sm\:px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
        }

        @media (min-width: 768px) {
            .md\:py-20 { padding-top: 5rem; padding-bottom: 5rem; }
            .md\:py-24 { padding-top: 6rem; padding-bottom: 6rem; }
            .md\:mb-16 { margin-bottom: 4rem; }
            .md\:gap-16 { gap: 4rem; }
        }

        @media (min-width: 1024px) {
            .lg\:px-8 { padding-left: 2rem; padding-right: 2rem; }
        }

        /* Flexbox utilities */
        .flex { display: flex; }
        .flex-col { flex-direction: column; padding: 5%;}
        .items-start { align-items: flex-start; }
        .items-center { align-items: center; }
        .justify-center { justify-content: center; }
        .space-y-3 > * + * { margin-top: 0.75rem; }
        .space-y-4 > * + * { margin-top: 1rem; }


        /* Grid utilities (basic approximations) */
        .grid { display: grid; }
        .gap-8 { gap: 2rem; }
        .gap-10 { gap: 2.5rem; }

        @media (min-width: 768px) { /* md breakpoint */
            .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr));}
            .md\:grid-cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
			.md\:grid-rows-3 { grid-template-rows: repeat(3, minmax(1fr)); }
            .md\:order-1 { order: 1; }
            .md\:order-2 { order: 2; }
            .sm\:flex-row { flex-direction: row; }
            .sm\:space-y-0 > * + * { margin-top: 0; }
            .sm\:space-x-4 > * + * { margin-left: 1rem; }
        }

        /* Text utilities */
        .text-lg { font-size: 1.4rem; }
        .text-xl { font-size: 1.2em; }
        .text-2xl { font-size: 1.5rem; }
        .text-3xl { font-size: 1.875rem; }
		.text-4xl { font-size: 3rem; padding-top: 20px; }
        .text-sm { font-size: 0.9em; padding: 5%; }
        @media (min-width: 768px) {
            .md\:text-4xl { font-size: 2.25rem; }
        }
        .font-bold { font-weight: 700; }
        .font-semibold { font-weight: 600; }
        .text-center { text-align: center; }
        .text-white { color: #ffffff; }
        .text-gray-600 { color: #4c5663; }
        .text-gray-700 { color: #4a5568; }
        .text-gray-800 { color: #2d3748; }
        .text-green-500 { color: #48bb78; }
        .text-sky-700 { color: #0369a1; }
        .text-amber-700 { color: #b45309; }
        .text-emerald-700 { color: #047857; }
		.text-pink { color: #ec4899;}
		.text-lightgreen { color: #14b8a6;}


        /* Background utilities */
        .bg-slate-50 { background-color: #f8fafc; }
        .bg-sky-50 { background-color: #f0f9ff; }
		.bg-pink-50 { background-color: #fbeff6; }
		.bg-lightgreen-50 { background-color: #e3fbef; }
        .bg-testimonial3-50 { background-color: #ecdff8; }
        .bg-amber-50 { background-color: #fffbeb; }
        .bg-emerald-50 { background-color: #ecfdf5; }
        .bg-white { background-color: #ffffff; }
        .bg-yellow-400 { background-color: #facc15; }
        .bg-green-500 { background-color: #22c55e; }
        a.bg-white {
    color: #444 !important;
}


        /* Sizing and Layout */
        .w-full { width: 100%; }
        .max-w-lg { max-width: 40rem; }
        .max-w-3xl { max-width: 48rem; }
        .mx-auto { margin-left: auto; margin-right: auto; }
        .h-20 { height: 15em; }
        .w-20 { width: 15em; }
        .h-72 { height: 18rem; }
        .object-cover { object-fit: cover; }


        /* Borders and Shadows */
        .rounded-xl { border-radius: 0.75rem; }
        .rounded-lg { border-radius: 0.5rem; }
        .shadow-lg { box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05); }
        .shadow-2xl { box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25); }
        .shadow-md { box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -1px rgba(0,0,0,0.06); }

        /* Transitions and Transforms */
        .transition-transform { transition-property: transform; }
        .transition-shadow { transition-property: box-shadow; }
        .duration-300 { transition-duration: 300ms; }
        .ease-in-out { transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); }
        .hover\:scale-105:hover { transform: scale(1.05); }
        .hover\:shadow-2xl:hover { box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25); }
        .hover\:-translate-y-0\.5:hover { transform: translateY(-0.125rem); }


        /* Opacity */
        .opacity-90 { opacity: 0.9; }

        /* Links/Buttons */
        a {
            text-decoration: none;
            color: inherit;
        }
        .hover\:bg-slate-100:hover { background-color: #f1f5f9; }
        .hover\:bg-yellow-300:hover { background-color: #fde047; }
        .hover\:bg-green-400:hover { background-color: #4ade80; }

        /* Specific component styling */
        .section-title {
            font-size: 2.25rem; /* text-3xl */
            font-weight: 700; /* font-bold */
            color: #0077c8; /* text-brand-blue */
            margin-bottom: 1.5rem; /* mb-6 */
        }
        @media (min-width: 768px) { /* md breakpoint */
            .section-title {
                 font-size: 2.25rem; /* md:text-4xl (Tailwind's 4xl is 2.25rem, 3xl is 1.875rem. Adjusting for consistency) */
            }
        }


        .card {
            padding: 1.2rem; /* p-6 */
            border-radius: 0.75rem; /* rounded-xl */
            box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1), 0 4px 6px -2px rgba(0,0,0,0.05); /* shadow-lg */
            transition-property: box-shadow;
            transition-duration: 300ms;
            display: flex;
            flex-direction: column;
            align-items: center;
            text-align: center;
			min-height: 300px;
        }
        .card:hover {
            box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25); /* hover:shadow-2xl */
        }
        .card-icon {
            height: 5rem; /* h-20 */
            width: 5rem; /* w-20 */
            margin-bottom: 1rem; /* mb-4 */
        }
        .card-title {
            font-size: 1.5rem; /* text-xl */
            font-weight: 600; /* font-semibold */
            margin-bottom: 0.5rem; /* mb-2 */
        }

        .order-1.md\:order-2 {
    margin: auto;
}
h3.text-2xl {
    text-align: center;
	min-height: 2em;
}

ul.space-y-3.text-gray-700.custom-list {
    padding: 5%;
}
        .cta-button {
            font-weight: 600; /* font-semibold */
            padding-top: 0.75rem; /* py-3 */
            padding-bottom: 0.75rem; /* py-3 */
            padding-left: 2rem; /* px-8 */
            padding-right: 2rem; /* px-8 */
            border-radius: 0.5rem; /* rounded-lg */
            box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -1px rgba(0,0,0,0.06); /* shadow-md */
            transition-property: background-color, transform;
            transition-duration: 300ms;
            transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1); /* ease-in-out */
            display: inline-block; /* To allow padding and centering if text-align:center on parent */
            font-size: 1rem; /* text-base */
        }
         @media (min-width: 768px) { /* md breakpoint */
            .cta-button {
                font-size: 1.125rem; /* md:text-lg */
            }
        }

        .cta-button:hover {
            transform: translateY(-0.125rem); /* hover:-translate-y-0.5 */
        }
        .navbar-nav > li > a {
    color: #fff;
}
.py-3.px-8 {
    padding: 5px;
}
.cZeus-school-league h2 {
    padding: 10px;
}

.cZeus-school-league h3 {
    padding-bottom: 10px;
}
/* Styling for the element that will become sticky */
        .sticky-target {
            text-align: center;
            transition: all 0.1s ease; /* Smooth transition for stickiness */
            max-width: 1024px; /* Max width for readability */
        }

        /* Styles applied when the element is 'stuck' */
        .sticky-target.stuck {
            position: fixed;
            bottom: 0;
            width: 100%;
            border-radius: 0; /* No rounded corners when stuck */
            z-index: 100;
        }

        /* Utility class for placeholder */
        .placeholder-div {
            /* This div takes the space of the sticky element when it's fixed */
            display: none; /* Hidden by default */
        }

		button#toggleSubMenu {
    width: 100%;
    background: none;
    border: none;
    color: white;
}
.faSmall{
	max-width: 30px !important;
	/* filter: brightness(0) saturate(100%) invert(49%) sepia(96%) saturate(1463%) hue-rotate(161deg) brightness(97%) contrast(99%); */
}

.breadcrumbs {
    color: #fff;
    padding: 35px 0px 0px 10px;
    font-size: 1em;
}

.breadcrumbs a{
    text-decoration:underline;
}


.breadcrumbs.black{
	color: #000 !important;
	 padding: 65px 0px 0px 10px;
}

@media screen and (orientation: landscape) {
	.breadcrumbs {
    color: #fff;
    padding: 35px 0px 0px 100px;
    font-size: 1em;
}
	.breadcrumbs.black{
	color: #000 !important;
	 padding: 25px 0px 0px 100px;
}
}