.u-gfColors-navy {
     color:var(--gfColors-navy) ! important;
}
 .u-gfColors-slate100 {
     color:var(--gfColors-slate100) ! important;
}
 .add-anim {
     position:relative;
}
 .add-anim::after {
     content:"";
     background-image:url('images/ghost.png');
     width: 45px;
     height: 63px;
     background-repeat: no-repeat;
     background-size: contain;
     position: absolute;
     top: 0;
     left: 11rem;
     display: block;
     transform: translate(0px, 0px);
     animation-name: slide;
     animation-duration: 3s;
     animation-direction: reverse;
     animation-iteration-count:infinite;
}
 @keyframes slide {
     0% {
        transform: translate(0px, 0px);
    }
     50% {
        transform: translate(0px, -30px);
    }
     100% {
        transform: translate(0px, 0px);
    }
}
.donut {
     position:relative;
}
.donut::after {
     content:"";
     background-image:url('images/donut.svg');
     background-repeat:no-repeat;
     width: 3rem;
     height: 3rem;
     position: absolute;
     bottom: -3rem;
     left: calc(50% - 1.5rem);
}
 .starred {
     position:relative;
}
 .starred::after {
     content:"";
     background-image:url('../../../../__template/t1/images/doodle-illustrations/navy-stars.svg');
     background-repeat:no-repeat;
     width: 4rem;
     height: 4rem;
     position: absolute;
     top: 3rem;
     right: calc(50% - 150px);
}

 .add-gold-star {
     position:relative;
}
 .add-gold-star::after {
     content: "";
     background-image: url(../../../../__template/t1/images/doodle-illustrations/gold-stars.svg);
     background-repeat: no-repeat;
     width: 3rem;
     height: 3rem;
     position: absolute;
     top: -2rem;
     left: -1rem;
}
 @media (max-width:575.98px) {
     .add-gold-star::after {
         top: -2.5rem;
         left:0;
    }
}


/* Schedules with photos on index page */

.photoLeft-grid h2, .photoRight h2 {
        grid-area: heading;
        margin-top: 1rem;
    }
.photoLeft-grid .scheduleList-beforeContent {
        grid-area: img;
        grid-column:1;
    }
     .photoRight img {
        width:350px;
    }
    
@media(max-width:767.98px) {
    .photoRight, .photoLeft-grid  {
        display: grid;
        grid-template-areas:
            "img"
            "heading"
            ".";
     }
     .photoRight .scheduleList-beforeContent {
        grid-area: img;
     }
     .photoRight img, .photoLeft-grid img {
        width:330px;
    }
}
@media(min-width:768px) and (max-width:992px) {
    .photoRight img, .photoLeft-grid img {
        max-width:300px;
    }
    .scheduleList-scheduleItem-dateTimeLocation {
        max-width: 350px;
    }
}
@media(min-width:768px) {
    .photoLeft-grid {
        display: grid;
        grid-template-columns: auto 1fr;
        grid-template-rows: auto 1fr 1fr 1fr;
        grid-template-areas:
            ". heading"
            "img ."
            "img ."
            "img .";
    }
    .photoLeft-grid.short-list {
        grid-template-rows: auto 1fr 1fr;
        grid-template-areas:
        "img heading"
        "img ."
        "img .";
    }
    .photoLeft-grid .scheduleList-scheduleItem {
        grid-column:2;
    }
    .photoLeft-grid .scheduleList-scheduleItem, .photoRight .scheduleList-scheduleItem {
        grid-template-columns: auto 1fr 10px !important;
    }
    .scheduleList-scheduleItem-dateTimeLocation-location {
        width: auto;
    }   
    .photoLeft-grid .scheduleList-beforeContent img {
        max-width:300px;
    }
}


/* ---- //// Traditions page //// ---- */
 #traditions {
     position:relative;
}
 #traditions::after {
     content:"";
     background-image:url('../events/_assets-traditions/images/coffee.svg');
     background-repeat:no-repeat;
     width: 3rem;
     height: 6rem;
     position: absolute;
     bottom: -6rem;
     left: calc(50% - 1.5rem);
}
/* ---- //// Get Involved page //// ---- */
 @media (max-width: 991.98px) {
     #getInvolved .u-grid2Columns {
         grid-template-columns: 1fr;
    }
}
 #experienceIntro.bg-circle::after {
     display:none;
}
 #volunteer {
     position:relative;
     z-index:10;
}
 #volunteer .add-gold-star::after {
     width: 4rem;
     height: 4rem;
     top: 0;
     left: -1rem;
}
 #dance {
     position: relative;
     margin-top: 4rem;
     padding-top: 4rem;
}
 #dance .u-grid2Columns {
     grid-template-columns: auto 1fr;
     gap: 3rem;
}
 #dance img, #superfans img {
     transition: all .5s;
}
 #dance img:hover {
     transform: scale(1.01) rotate(5deg);
}
 #superfans img:hover {
     transform: scale(1.01) rotate(-5deg);
}
 @media (max-width:991.98px) {
     #dance .u-grid2Columns {
         grid-template-columns: 1fr;
    }
}
 @media (max-width: 767.98px) {
     #dance .u-grid2Columns {
         gap: 1rem;
    }
}
 @media (max-width: 575.98px) {
     #dance {
         margin-top: 0;
         padding-top: 3rem;
    }
}
 @media (min-width: 768px) {
     #dance::after {
         content:"";
         background-image:url(https://media.giphy.com/media/1nbuFSAT7iAW1wDA4z/giphy.gif);
         background-repeat: no-repeat;
         background-size: cover;
         width: 143px;
         height: 220px;
         position: absolute;
         top: 330px;
         right: 3rem;
    }
}
 @media (min-width: 992px) {
     #dance::after {
         top:unset;
         bottom: -120px;
         right: 2rem;
    }
}
 .add-lightbulb {
     position:relative;
}
 .add-lightbulb::after {
     content:"";
     background-image:url('../../../../__template/t1/images/doodle-illustrations/gold-lightbulb.svg');
     background-repeat:no-repeat;
     width: 4rem;
     height: 5rem;
     position: absolute;
     bottom: -3rem;
     left: calc(50% - 2rem);
     display:block;
}
 @media (max-width:575.98px) {
     .add-lightbulb::after {
         width: 3.5rem;
         height: 6rem;
    }
}



/* ---- //// Photos & Videos page //// ---- */
 #eventVideos {
     position:relative;
}
 #eventVideos::before {
     content:"";
     background-image:url(https://www-test.georgefox.edu/Fallback%20Zone/2024-spring/student-involvement/_assets-videos/images/popcorn.svg);
     background-repeat:no-repeat;
     width: 120px;
     height: 150px;
     position: absolute;
     top: -135px;
     left: 23rem;
     display: block;
}
 @media (max-width:575.98px) {
     #eventVideos::before {
         display:none;
    }
}



/* ---- //// Winter Welcome //// ---- */
 #winterWelcome .bg-gold-circle {
     position:relative;
}
 #winterWelcome .bg-gold-circle::before {
     content:"";
     background-color: var(--gfColors-slate30);
     background-repeat: no-repeat;
     width: 8rem;
     height: 8rem;
     border-radius: 50%;
     position: absolute;
     top: -2.75rem;
     right: -3.45rem;
     display: inline-block;
     z-index: -1;
}
 #winterWelcome table {
     width:100%;
}
 #winterWelcome table p {
     margin-top:0;
     margin-bottom:.5rem;
}
 #winterWelcome .table-content tr td:first-child {
     width:16%;
}
 @media (max-width:767.98px) {
     #winterWelcome .table-content tr td:first-child {
         width:27%;
    }
}
 @media (min-width:992px) {
     #winterWelcome table p {
         max-width:85%;
    }
}