:root {

      --black: #000;
      --white: #fff;

      --primary  : #0084cb;
      --secondary: #fceec4;
      --tertiary : #f5821f;
      --fourthclr: #0077c0;
}


/*CTA*/

.uk-button-primary{
      background: var(--secondary);
      color: var(--black);
}
.uk-button-primary:hover{
      background: var(--tertiary);
}

.uk-section-tertiary{
    background-color: var(--tertiary);
}

.uk-section-secondary .uk-list li a{
    color: var(--primary);
}

.uk-background-muted {
      background-color: var(--secondary);
      color: var(--black);
}

.uk-section-default{
      background-color: var(--fourthclr);
}

.uk-section-default .uk-list li
{
    color: var(--white);
}

.uk-section-default h2{
      color: var(--white);
}

.uk-section-muted{
      background-color: var(--secondary);
}

.uk-card-primary{
      background-color: var(--primary);
}
.uk-card-primary>:not([class*=uk-card-media]){
      color: var(--white);
}

/*Header*/
.uk-navbar-container{
      display: flex;
      margin: 0 auto;
      max-width: 1200px;
}

.uk-navbar-nav li,.uk-navbar-nav li a{
      color: var(--white);
}

.uk-navbar-nav li a {
  position: relative;
  transition: color 0.25s ease;
}

.uk-navbar-item{
      color: var(--white);
}

.uk-navbar-nav li a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 15px;
  width: 100%;
  height: 2px;
  background-color: var(--white);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s ease;
}

.uk-navbar-nav li a:hover {
  color: var(--white);
}

.uk-navbar-nav li a:hover::after {
  transform: scaleX(1);
}




header.uk-sticky.uk-active.uk-sticky-below.uk-sticky-fixed {
    background:var(--primary);
    color: var(--white);
}

header{
     background : var(--primary);
}

/*Announcement Bar*/
.marquee {
      white-space: nowrap;
      overflow: hidden;
}

.marquee span {
      display: inline-block;
      padding-left: 100%;
      animation: marquee 30s linear infinite;
}

@keyframes marquee {
0%   { transform: translateX(0); }
100% { transform: translateX(-100%); }
}


/*About School Card*/
.uk-card {
  transition: transform .2s ease, box-shadow .2s ease;
}

.uk-card:hover {
  transform: translateY(-4px);
}


/*Hero Slider*/
.hero-slideshow {
      min-height: 45vh;
}

/* Tablet */
@media (min-width: 640px) {
  .hero-slideshow {
    min-height: 45vh;
  }
}

/* Desktop */
@media (min-width: 960px) {
  .hero-slideshow {
    min-height: 40vh;
  }
}


/* Leadership Section */
.flip-card {
  perspective: 1000px;
  height: 100%;
}

/* Inner wrapper */
.flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  transition: transform 0.6s;
  transform-style: preserve-3d;
}

/* Front & back faces */
.flip-card-front,
.flip-card-back {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
}

/* Back face */
.flip-card-back {
  transform: rotateY(180deg);
}

/* Flip state */
.flip-card.flipped .flip-card-inner {
  transform: rotateY(180deg);
}

.flip-card {
  perspective: 1000px;
  min-height: 480px;
}

.flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  transition: transform 0.6s;
  transform-style: preserve-3d;
}

.flip-card:hover .flip-card-inner,
.flip-card.flipped .flip-card-inner {
  transform: rotateY(180deg);
}

.flip-card-front,
.flip-card-back {
  position: absolute;
  inset: 0;
  backface-visibility: hidden;
}

.flip-card-back {
  transform: rotateY(180deg);
}



/*Gallery*/
a.uk-position-center-left.uk-position-small.uk-icon.uk-slidenav-previous.uk-slidenav {
    background: var(--secondary);
    padding: 20px 25px;
    opacity: 0.7;
    left: -15px;
}

a.uk-position-center-right.uk-position-small.uk-icon.uk-slidenav-next.uk-slidenav {
    background: var(--secondary);
    padding: 20px 25px;
    opacity: 0.7;
    right: -15px;
}
a.uk-position-center-left.uk-position-small.uk-icon.uk-slidenav-previous.uk-slidenav svg
,a.uk-position-center-right.uk-position-small.uk-icon.uk-slidenav-next.uk-slidenav svg{
      color: var(--black);
}

.uk-dotnav>.uk-active>*{
      background-color: var(--secondary);
}
.uk-dotnav>*>*{
      border: 1px solid var(--secondary);
}


@media (max-width: 639px) {
  .flip-card {
    min-height: auto; /* stack naturally on mobile */
  }
}


@media (max-width: 1080px) {
    .uk-navbar-nav {
        gap: 20px !important;
    }
}


@media (max-width: 1280px) {
    .uk-navbar-nav {
        gap: 10px !important;
    }

    .uk-navbar-right .uk-margin-large-left {
       margin-left: 20px !important;   
     }


    .uk-navbar-container .uk-container {
        padding-left: 20px;
        padding-right: 20px;
    }

    .uk-navbar-right .uk-margin-large-left {
        margin-left: 10px !important;
    }
}

@media(max-width: 1024px){
    .uk-navbar-right .uk-button{
        padding: 0px 10px;
    }
}


@media(max-width: 480px){

      .uk-navbar-item img{
            height: 75px !important;
      }
      .uk-navbar-item .uk-text-bold{
            font-size: 18px;
      }
}