/**/
/**/
/* Schools 2030 3.0*/
/**/
/**/

:root {
     --black:#1C1B1F;
     --primary:#20B8F1;
}
/**/ /*Slider*/ /**/
.slider-wrapper .et_pb_slide.et_pb_slide_0 .et_pb_slide_description {
    text-shadow: none;
    padding: 10% 0 0 !important;
    margin-top: 0 !important;
}


.slider-wrapper .et_pb_slide.et_pb_slide_0 .et_pb_slide_content {
  
    text-align: left;
    max-width: 50%;
    margin-left: auto;
     font-size: 30px;
    line-height:1.2em;
    font-weight:700;
      display: flex !important;
    flex-direction: column;
    gap: 60px;
}


.slider-wrapper .et_pb_slide.et_pb_slide_0 .et_pb_slide_content p {
    max-width: 400px;
    text-wrap: balance;
    padding: 0;
}

.slider-wrapper .et_pb_slide.et_pb_slide_0 .et_pb_slider_container_inner {
    vertical-align: top !important;

}


.slider-wrapper .et_pb_slide.et_pb_slide_0 img {
    width:277px;
}

/**/



    
        /* Slick mb-slider custom styles */
       
 


        .mb-icon-container {

            background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='100' ry='100' stroke='%23D9D9D9FF' stroke-width='1' stroke-dasharray='5%2c 5' stroke-dashoffset='51' stroke-linecap='round'/%3e%3c/svg%3e");
            --assess: #ED7D31;
            --innovate: #4472C4;
            --showcase:#62BB46;
            
        }

        .mb-media {
     
            width: auto;
            height: 150px;
            display: flex;
            justify-content: center;
            align-items: center;
            border-radius: 100%;
            aspect-ratio: 1;

        }



        .mb-mb-slider-container {
            max-width: 850px;
            margin: 0 auto;
            padding: 20px;
               
        }

        .mb-slide {
            display: flex !important;
            align-items: center;
            gap: 2rem;
            padding: 2rem;
            outline: none;
            max-width: 650px;
            margin: auto;
        }

        .mb-icon-container {
            width: 200px;
            height: 200px;
           
            display: flex;
            align-items: center;
            justify-content: center;
            position: relative;
            flex-shrink: 0;
            transition: transform 0.3s ease;
        }

        .mb-icon-container:hover {
            transform: scale(1.05);
        }

        .mb-number {
            position: absolute;
            width: 40px;
            height: 40px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: white;
            font-weight: bold;
            font-size: 1.2rem;
        }

        .mb-content {
            flex: 1;
        }

        /* Step 1 - Orange */
        [data-slick-index="0"] .mb-icon-container .mb-media {
            background: var(--assess);
        }

        [data-slick-index="0"] .mb-number {
            background: var(--assess);
            top: 0;
            left: 15px;
     
        }

        /* Step 2 - Blue */
        [data-slick-index="1"] .mb-icon-container .mb-media {
            background: var(--innovate);
        }

        [data-slick-index="1"] .mb-number {
            background: var(--innovate);
            top: 0;
            right: 15px;
    
        }

        /* Step 3 - Green */
        [data-slick-index="2"] .mb-icon-container .mb-media {
            background: var(--showcase);
        }

        [data-slick-index="2"] .mb-number {
            background: var(--showcase);
            bottom: 0;
            right: 15px;
  
        }
        .mb-content span {
            color:var(--black);
        font-size: 14px;font-weight:500;
        }       
        .mb-content h3 {
            font-size: 30px;
            font-weight:700;
            color: var(--black);
        }

        .mb-content p {
            font-size: 18px;
            line-height: 1.36;;
            color: var(--black);
            margin: 0;font-weight:600;
            text-wrap:balance;
        }

        .slick-prev,
        .slick-next {
            width: 40px;
            height: 40px;
            z-index: 1;
        }

        .slick-prev {
            left: -50px;
        }

        .slick-next {
            right: -50px;
        }

      .slick-prev:before, .slick-next:before {
    content: url(https://schools2030.org/wp-content/uploads/2024/11/arrow_forward.svg) !important;
    background:#fff;
    width: 40px;
    display: flex;
    opacity: 1;
    justify-content: center;
    align-items: center;
    top: 0;
    position: relative;
    height: 40px;
    border-radius: 100%;
}
.slick-prev:before {
    transform:rotate(180deg);
}

        .slick-dots li button:before {
            font-size: 12px;
            color: #333;
        }

        .slick-dots li.slick-active button:before {
            color: #333;
        }

        .mb-slide {
            opacity: 0;
            transform: scale(0.9);
            transition: all 0.5s ease;
        }

        .slick-active .mb-slide {
            opacity: 1;
            transform: scale(1);
        }

        @keyframes fadeIn {
            from {
                opacity: 0;
                transform: translateY(20px);
            }

            to {
                opacity: 1;
                transform: translateY(0);
            }
        }

        .slick-active .mb-content {
            animation: fadeIn 0.8s ease forwards;
        }
   
   /*Wheel hover section*/
  .wheel {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 100%;
    margin: 0 auto;
    max-height: 300px;

    /*var*/
    --word-spacing:12px;
}

.wheel__nav {
    flex: 1;
}

.wheel__item {
    cursor: pointer;
    transition: color 0.2s ease;
    font-size: 18px;
    color: var(--black);
    font-weight: 600;
}

.wheel__item:hover,
.wheel__item--active {
    color: var(--primary);
    font-weight: 900;
}

.wheel__display {
    flex: 4;
    max-height: 300px;
    display: flex;
    justify-content: end;
}

.wheel__image {
    height: 100%;
    transition: opacity 0.3s linear;
}


.wheel__nav > * {
    padding:var(--word-spacing) 0;
    position:relative;
    border-bottom:1px solid #A0A0A0;
}



@media all and (min-width:981px) {
.wheel__nav > *:last-child {
  border:none;
}}


/*donors grid*/

.donors-grid .et_pb_module .et_pb_image_wrap {
    display:flex;
    align-items:center;
    justify-content:center;
    }

@media all and (min-width:981px) {
    .donors-grid > *{  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-template-rows: auto;
 
  grid-auto-flow: row;
  grid-template-areas:
    "l1 l1 l2 l2 l3 l3 l4 l4"
    "l5 l5 l6 l6 l7 l7 l8 l8"
    "l9 l9 l10 l10 l11 l11 l12 l12"
    ". l13 l13 l14 l14 l15 l15 .";
                 gap:50px 0px;
                 justify-content:center;
                 align-items:center;
}
.donors-grid > * > * {
    width:100%;
    max-height:100%;
    margin: 0 !important;
    }

.donors-grid > * img {
    max-height:90px;
width:auto;
}


.donors-grid > * >:nth-child(1) img {max-height:70px;}

.donors-grid > * >:nth-child(1) { grid-area: l1; }

.donors-grid > * >:nth-child(2)  { grid-area: l2; }

.donors-grid > * >:nth-child(3)  { grid-area: l3; }

.donors-grid > * >:nth-child(4)  { grid-area: l4; }

.donors-grid > * >:nth-child(5)  { grid-area: l5; }

.donors-grid > * >:nth-child(6)  { grid-area: l6; }

.donors-grid > * >:nth-child(7)  { grid-area: l7; }

.donors-grid > * >:nth-child(8)  { grid-area: l8; }

.donors-grid > * >:nth-child(9)  { grid-area: l9; }

.donors-grid > * >:nth-child(10)  { grid-area: l10; }

.donors-grid > * >:nth-child(11)  { grid-area: l11; }

.donors-grid > * >:nth-child(12) { grid-area: l12; }

.donors-grid > * >:nth-child(13) { grid-area: l13; }

.donors-grid > * >:nth-child(14) { grid-area: l14; }

.donors-grid > * >:nth-child(15) { grid-area: l15; }


.donors-grid > * > * > * {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}


.donors-grid > * >:nth-child(2) img {max-height: 90px}

.donors-grid > * >:nth-child(3) img {max-height: 50px}

.donors-grid > * >:nth-child(4) img {max-height: 50px}

.donors-grid > * >:nth-child(5) img {max-height: 50px}

.donors-grid > * >:nth-child(6) img {max-height: 40px}

.donors-grid > * >:nth-child(7) img {max-height: 70px}

.donors-grid > * >:nth-child(8) img {max-height: 40px}

.donors-grid > * >:nth-child(9) img {max-height: 60px}

.donors-grid > * >:nth-child(10) img {max-height: 40px}

.donors-grid > * >:nth-child(11) img {max-height: 15px}

.donors-grid > * >:nth-child(12) img {max-height: 40px}

.donors-grid > * >:nth-child(13) img {max-height: 45px}

.donors-grid > * >:nth-child(14) img {max-height: 40px}

.donors-grid > * >:nth-child(15) img {max-height: 55px}
}

@media all and (max-width:981px) {
    .donors-grid > *{  display: grid;
  grid-template-columns: 1fr 1fr ;
  grid-auto-flow: row;
 
                 gap:40px 2rem;
                 justify-content:center;
                 align-items:center;
}
.donors-grid > * > * {
    width:100%;
    max-height:100%;
    margin: 0 !important;
 
    }

.donors-grid > * img {
    max-height:90px;
width:auto;
}

.donors-grid > * >:nth-child(1) img {max-height:70px;}

.donors-grid > * >:nth-child(2) img {max-height: 70px;}

.donors-grid > * >:nth-child(3) img {max-height: 50px;}

.donors-grid > * >:nth-child(4) img {max-height: 50px;}

.donors-grid > * >:nth-child(5) img {max-height: 50px;}

.donors-grid > * >:nth-child(6) img {max-height: 40px;}

.donors-grid > * >:nth-child(7) img {max-height: 70px;}

.donors-grid > * >:nth-child(8) img {max-height: 40px;}

.donors-grid > * >:nth-child(9) img {max-height: 60px;}

.donors-grid > * >:nth-child(10) img {max-height: 40px;}

.donors-grid > * >:nth-child(11) img {max-height: 15px;}

.donors-grid > * >:nth-child(12) img {max-height: 40px;}

.donors-grid > * >:nth-child(13) img {max-height: 45px;}

.donors-grid > * >:nth-child(14) img {max-height: 40px;}

.donors-grid > * >:nth-child(15) img {max-height: 55px;}

.wheel {
    flex-direction: column;
    max-height: max-content;
    gap: 50px;
}

.wheel__nav {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 20px;
}

}


/*other mobile*/ 

@media all and (max-width:981px) {
    .mb-slide {
    flex-direction: column;
}

.mb-mb-slider-container {
    padding:0;
}
}