/* alert banner */
.alertBanner
{
    padding:0.5rem 0;
    background-color:var(--gfColors-bodyText);
    color:white;
}

.alertBanner a:hover {
    color: var(--gfColors-gold);
    box-shadow: inset 0px -1px 0px var(--gfColors-slateText);
}

.alertBanner a
{
    color:white;
    box-shadow: inset 0px -1px 0px var(--gfColors-slateText);
}


/* CTA banner overlay option */
@media(min-width:992px) {
    .bannerCTA {
    background-color: transparent;
    background-image: none;
    position:relative;
    padding-bottom: 3rem;
    }
    .bannerCTA .container {
    z-index: 200;
    position: absolute;
    top: -6rem;
    left: 50%;
    transform: translate(-50%);
    }
}
@media(min-width:1200px) {
    .bannerCTA {
        padding-bottom: 0;
    }
    .bannerCTA .container {
        top: -8rem;
    }
}

/* applications now open, start your application, applicatons due */

.deadline h2 {
    position: relative;
    font-family: var(--gfVars-bodyFont);
    text-transform: uppercase;
    letter-spacing: .1em;
    font-weight: bold;
    font-size: 1.5rem;
    margin-bottom: .5rem;
    text-wrap: pretty;
}
.deadline h2 span {
    font-size:2.3em;
    font-family: var(--gfVars-thirstyFont);
    text-transform: capitalize;
    letter-spacing: 0;
    font-weight: normal;
    position: relative;
    color: var(--gfColors-slate80);
}
.deadline p {
    text-transform: uppercase;
    letter-spacing: .1em;
    font-weight: bold;
    font-size: 1.5rem;
    line-height:1.3;
    text-wrap: pretty;
}

#applicationsOpen h2 {
    line-height: 1.3;
}
@media (max-width:991.98px) {
    #startYourApplication h2 {
        line-height:1.6;
        margin-bottom:0;
    }
    #startYourApplication h2 span {
        display: block;
    }
   .deadline .u-grid2Columns {
        text-align: center;
        gap: 2rem;
    }
    #applicationsOpen p, #startYourApplication p, #applicationDeadline p, #applicationDeadline h2 {
        font-size:1.1rem;
    }
}
@media(min-width:768px) and (max-width:992px) {
    .deadline .u-grid2Columns {
    grid-template-columns: 64% 34%;
}
}
@media(max-width:767.98px) {
    .deadline h2 span{
       font-size: 2em;
       display: block;
    }
    #startYourApplication h2 span {
        line-height:1.8;
    }
}
@media(max-width:575.98px) {
    #applicationsOpen p span, #startYourApplication p span {
        display:block;
    }
    /*.deadline.wysiwyg--navyTiles>.container {*/
    /*    background-color: rgba(0, 0, 0, 0);*/
    /*}*/
    #startYourApplication.wysiwyg--navyTiles>.container {
        padding-top:1rem;
    }
    #applicationDeadline p {
        display: flex;
        flex-direction: column;
    }
}

@media(min-width:768px) {
    #applicationsOpen .u-grid2Columns, #startYourApplication .u-grid2Column {
        grid-template-columns: auto auto;
}
    .deadline .button--xl {
        padding: 1rem 3.4rem 1rem;
}
}
@media(min-width:992px) and (max-width:1200px) {
    #applicationDeadline p, #applicationDeadline h2{
        font-size: 1.15rem;
    }
}

@media(min-width:1200px) {
    .deadline .u-grid2Columns {
        grid-template-columns: 62% 1fr;
    }
    
}
.deadline a.button.button--gold{
    border: 1.5px solid var(--gfColors-gold);
    background-color:var(--gfColors-gold);
    color: var(--gfColors-navy);
}
.deadline a.button.button--gold:hover {
    background-color: rgba(0,0,0,0);
    color: var(--gfColors-gold);
    border: 1.5px solid var(--gfColors-gold);
}


/* Video rotator countdown timer overlay */
/*
@media(min-width:768px) {
.videoRotator-video::before {
    content: "";
    background-image: linear-gradient(10deg, var(--gfColors-navy) 29%, transparent 60%);
    opacity: .55;
    width: 100%;
    height: 100%;
}
main .videoRotator-content {
    align-self: end;
    justify-self: center;
    margin-right: 0;
    width: 100%;
}
.countdownOverlay .u-grid2Columns {
    grid-template-columns: 60% 1fr;
}
.videoRotator-content {
    text-shadow: none;
}
.countdownOverlay h2, .countdownOverlay p, .videoRotator-content {
    text-align:left !important;
}
.countdownOverlay {
    width:100%;
}

.videoRotator-content img, .videoRotator-content svg {
       width: 300px;
       filter: none;
}
}
*/


/*Nationally recognized banner */

#christian-university-banner {
        padding-top: 2rem;
    padding-bottom: 2.5rem;
    background-color: var(--gfColors-slate45);
}
@media(max-width:767.98px) {
    #christian-university-banner {
    padding-top: 1rem;
    padding-bottom: 1.5rem;
}
}

/* Nationally Recognized */


#recognition .gf-logo {
    grid-column: 2;
    padding-top: 2rem;
}

#recognition {
    position:relative;
    margin-bottom:4rem;
}

#recognition::before {
    content: "";
    background-color: #e4eaee;
    border: 1px solid transparent;
    width: 30em;
    height: 30em;
    border-radius: 100%;
    position: absolute;
    top: -30em;
    display: grid;
    z-index: -10;
    justify-self: center;
    box-sizing:b;
    opacity:0;
    -webkit-animation: ripple 2s ease-out 1s forwards;
    animation: ripple 2s ease-out 1s forwards;
    box-sizing:content-box;
}

@media (max-width:768.98px) {
    #recognition::before {
        width: 20em;
        height: 20em;
        top: -11em;
        opacity: 1;
        animation: none;
    }
    #recognition .gf-logo {
        padding-top:1rem;
    }
}
@media (max-width:575.98px) {
    #recognition::before {
        width: 14em;
        height: 14em;
        top: -8em;
    }
    ul.u-stepList>li::before {
        left:-.01rem;
    }
    }
@media(min-width:768px) {
    .u-stepList>li>span:first-child {
        display: inline-block;
    }
}

#recognition {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
}
#recognition ul.u-stepList {
    padding: 0;
    grid-column: 2;
}
#recognition h1 {
    grid-column: 1/-1;
    font-size: 1.3rem;
    font-weight: 600;
    font-family: var(--gfVars-bodyFont);
    text-transform: uppercase;
    letter-spacing: 0.25rem;
    margin: 4rem 0 -1.5rem;
    text-align: center;
    color: var(--gfColors-navyAccent);
}
#recognition h2 {
    grid-column: 1/-1;
    font-size: clamp(3rem, 7.9vw, 5rem);
    letter-spacing: 0.2rem;
    text-transform: uppercase;
    margin: 2rem 0;
    text-align: center;
}
@media(min-width: 992px) {
    #recognition h2 {
        letter-spacing: 0.4rem;
    }
}
@media(min-width: 768px) and (max-width: 992.98px) {
    #recognition h1 {
        font-size: .9rem;
    }
    #recognition h2 {
        font-size:3.9rem;
        letter-spacing: 0.3rem;
    }
}
@media(max-width: 767.98px) {
    #recognition h2 {
        font-size:3rem;
    }
    #recognition .u-stepList>li {
    font-size: 1.2rem;
    }
}

@media(max-width: 575.98px) {

    #recognition {
        background-position: top center;
    }
    #recognition h1 {
        margin-top:2rem;
        font-size: 1rem;
        line-height: 1.4;
    }
}

@-webkit-keyframes ripple {
  0% {
      top: -30em;
    width: 30em;
    height: 30em;
    opacity: 0;
  }
  80% {
    top: -28em;
    width: 36em;
    height: 36em;
    opacity: .7;
  }
  100% {
    top: -28em;
    width: 36em;
    height: 36em;
    opacity: 1;
  }
}
@keyframes ripple {
  0% {
      top: -30em;
    width: 30em;
    height: 30em;
    opacity: 0;
  }
  80% {
    top: -28em;
    width: 36em;
    height: 36em;
    opacity: .7;
  }
  100% {
    top: -28em;
    width: 36em;
    height: 36em;
    opacity: 1;
  }
}


/* Video Block */
#beKnownVideo
{
    background-size: cover;
    background-position:center;
    background-repeat:no-repeat;
    background-color:var(--gfColors-navy);
    padding:4rem 0;
    position: relative;
}

#beKnownVideo::before
{
    content: "";
    height:100%;
    width:100%;
    position:absolute;
    top:0;
    left:0;
    background-color: var(--gfColors-navy);
    opacity:0.6;
    z-index:10;
}

#beKnownVideo *
{
    color:white;
}

.beKnownVideo-bgImage
{
    height:100%;
    width:100%;
    position:absolute;
    top:0;
    left:0;
    display:flex;
}

.beKnownVideo-bgImage img
{
    object-fit:cover;
    object-position:center center;
    height:100%;
    width:100%;
}

.beKnownVideo-content
{
    display:grid;
    align-items:center;
    justify-items:center;
    position:relative;
    z-index:20;
    font-size:1.5rem;
}

.beKnownVideo-content .videoBlock-thumbnail
{
    width:160px;
    height:160px;
    box-shadow:none;
}

.beKnownVideo-content > *
{
    max-width:620px;
    text-align:center;
}

.beKnownVideo-content h2
{
    font-family:ThirstySoftExtraBold, var(--gfVars-headerFont);
    margin-top:1em;
}

@media(min-width:768px) {
    .beKnownVideo-content .videoBlock-thumbnail
    {
        width:180px;
        height:180px;
        box-shadow:none;
    }
    
    .beKnownVideo-content .videoBlock-thumbnail::after {
        width: 160px;
        height: 160px;
        top: calc(50% - 80px);
        left: calc(50% - 80px);
        font-size: 4rem;
        line-height: 10rem;
    }
}

@media (max-width:767.98px) {
    #beKnownVideo {
        background-image: url(images/mobile-beknown-video_gfu1158.jpg);
        height: 600px;
    }
    .beKnownVideo-content{
        font-size:1rem;
    }
    .beKnownVideo-content h2 {
            margin: 0;
    }
    .beKnownVideo-content > * {
        margin-bottom:0;
    }
}


/*  ---------   Find Your Program update 2022  ---------  */

.u-gfColors-gold {
    color:var(--gfColors-gold);
}
.u-gfColors-navy {
    color:var(--gfColors-navy);
}
.uppercase {
    text-transform: uppercase;
    letter-spacing: .05rem;
}

#programList .container {
    position:relative;
}

#programList ul li::before {
    display:none;
}
#programList a span {
    font-family: var(--gfVars-headerFont);
    text-transform: uppercase;
    font-size: 1.4rem;
    font-weight: 500;
    letter-spacing: .1rem;
    color: var(--gfColors-navy);
    box-shadow: none;
    text-shadow: none;
    display: block;
    line-height: 1.5em;
    margin-bottom: 0.5rem;
    transition: .25s;
    position: relative;
}
#programList a span::after {
    content: "";
    display: inline-block;
    width: 2ex;
    margin-left: .5ex;
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='23 9 148 90' style='enable-background:new 23 0 148 106;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st7%7Bfill:none;stroke:%23c4161c;stroke-width:15;stroke-miterlimit:10;%7D%0A%3C/style%3E%3Cg id='Layer_2'%3E%3C/g%3E%3Cg id='Layer_1'%3E%3Cg%3E%3Cpolyline class='st7' points='108.4,14.8 147.3,53.7 108.4,92.6 '/%3E%3Cline class='st7' x1='147.3' y1='53.7' x2='23.1' y2='53.7'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    position: relative;
    left: 0;
    transition: left .3s;
    height: .9ex;
    bottom: .2ex;

}
#programList .cardLink:hover span::after {
    left: .5ex;
}

#programList div > a {
    box-shadow: none;
    color: var(--gfColors-navyAccent);
     line-height: 1.75em;
}

#programList .cardLink {
    background-color: rgba(187, 201, 212, 0.2);
    padding: 1.5rem 1.5rem 1.75rem;
    margin-bottom: 0;
    position:relative;
    transition: .2s;
}
#programList .cardLink:hover {
    background-color: transparent;
    box-shadow: inset 0 0 0 2px var(--gfColors-slate15);
}
#programList .u-grid3Columns {
        padding-left: 0;
}
@media(max-width:992px) {
     #programList h2 {
         text-align:center;
            margin-top: 1.2rem;
     }
}

@media (min-width:992px) {
    #programList .u-grid3Columns {
        gap:1rem;
    }
    #programList .container {
        padding-bottom: 12rem;
    }
    #programList .uppercase {
        padding-left:4rem;
    }
}

@media (min-width:992px) {
    .bg-tiles {
    position: absolute;
    top: 10%;
    right: 0%;
    width: 45%;
    height: 150px;
    }
    .bg-tiles-bottom {
       position: absolute;
       bottom:1%;
       left:0%;
       width: 45%;
       height: 150px;
        left: -20%;
    }
    .bg-tiles-bottom li {
    position: absolute;
    list-style: none;
    display: block;
    width: 60px;
    height: 60px;
    background-repeat: no-repeat;
    background-size: 60px 60px;
    bottom: -60px;
}
    .bg-tiles li {
        position: absolute;
        list-style: none;
        display: block;
        width: 60px;
        height: 60px;
        background-image:url(images/tile-gear.svg);
        background-repeat:no-repeat;
        background-size:60px 60px;
        bottom: -60px;
    }
    .bg-tiles li:nth-child(1) {
        left: 0;
    }
    .bg-tiles li:nth-child(2) {
        background-image:url(images/tile-pennington.svg);
        left: 120px;
        -webkit-animation: fade-out-in 6s ease 6s infinite;
        animation: fade-out-in 6s ease 6s infinite;
    }
    .bg-tiles li:nth-child(3) {
        background-image:url(images/tile-mountain.svg);
        left: 180px;
    }
    .bg-tiles li:nth-child(4), .bg-tiles-bottom li:nth-child(1) {
        background-image:url(images/tile-trees.svg);
        left: 240px;
    }
    .bg-tiles li:nth-child(5), .bg-tiles-bottom li:nth-child(2) {
        background-image:url(images/tile-oregon.svg);
        left: 360px;
    }
    .bg-tiles li:nth-child(6), .bg-tiles-bottom li:nth-child(3) {
        background-image:url(images/tile-bible.svg);
        left: 420px;
        -webkit-animation: fade-out-in 5s ease infinite;
        animation: fade-out-in 5s ease infinite;
    }
    .bg-tiles li:nth-child(7), .bg-tiles-bottom li:nth-child(4) {
        background-image:url(images/tile-stethoscope.svg);
        left: 480px;
        -webkit-animation: fade-out-in 6s ease 7s 4;
        animation: fade-out-in 6s ease 7s 4;
    }
    .bg-tiles li:nth-child(8) {
        background-image:url(images/tile-pens.svg);
        left: 60px;
        bottom:0;
    }
    .bg-tiles li:nth-child(9) {
        background-image:url(images/tile-bible.svg);
        left: 120px;
        bottom:0;
        -webkit-animation: fade-out-in 6s ease 1s infinite;
        animation: fade-out-in 6s ease 1s infinite;
    }
    .bg-tiles li:nth-child(10), .bg-tiles-bottom li:nth-child(5) {
        background-image:url(images/tile-stethoscope.svg);
        left: 240px;
        bottom:0;
        -webkit-animation: fade-out-in 6s ease 3s infinite;
        animation: fade-out-in 6s ease 3s infinite;
    }
    .bg-tiles li:nth-child(11), .bg-tiles-bottom li:nth-child(8){
        background-image:url(images/tile-woodmar.svg);
        left: 300px;
        bottom:0;
    }
    .bg-tiles li:nth-child(12), .bg-tiles-bottom li:nth-child(9) {
        background-image:url(images/tile-pens.svg);
        left: 420px;
        bottom:0;
        -webkit-animation: fade-out-in 8s ease 5s infinite;
        animation: fade-out-in 8s ease 5s infinite;
    }
    .bg-tiles li:nth-child(13){
        background-image:url(images/tile-drink.svg);
        left: 480px;
        bottom:0;
        opacity:0;
        -webkit-animation: fade-in-left 8s ease 3s infinite;
        animation: fade-in-left 8s ease 3s infinite;
    }
    .bg-tiles li:nth-child(14) {
        background-image:url(images/tile-gear.svg);
        left: 180px;
        bottom:60px;
        opacity:0;
        -webkit-animation: fade-in-down 11s ease 3s infinite;
        animation: fade-in-down 11s ease 3s infinite;
    }
    .bg-tiles li:nth-child(15), .bg-tiles-bottom li:nth-child(6) {
        background-image:url(images/tile-forest.svg);
        left: 300px;
        bottom:60px;
        -webkit-animation: fade-out-in 6s ease 2s 8;
        animation: fade-out-in 6s ease 2s 8;
    }
    .bg-tiles li:nth-child(16), .bg-tiles-bottom li:nth-child(7) {
        background-image:url(images/tile-gf.svg);
        left: 360px;
        bottom:60px;
        -webkit-animation: fade-out-in 6s ease 4s infinite;
        animation: fade-out-in 6s ease 4s infinite;
    }
    .bg-tiles li:nth-child(17) {
        background-image:url(images/tile-circuit-board.svg);
        left: 480px;
        bottom:60px;
    }
    .bg-tiles li:nth-child(18) {
        background-image:url(images/tile-circuit-board.svg);
        left: 120px;
        bottom:60px;
        opacity:0;
        -webkit-animation: fade-in-out 7s ease 2s infinite;
        animation: fade-in-out 7s ease 2s infinite;
    }
}    



    
    @-webkit-keyframes fade-out-in {
      0% {
        opacity:1;
      }
      50% {
        opacity:0;
      }
      100% {
        opacity:1;
      }
    }
    @keyframes fade-out-in {
      0% {
        opacity:1;
      }
      50% {
        opacity:0;
      }
      100% {
        opacity:1;
      }
    }

    
    @-webkit-keyframes fade-in-out {
      0% {
        opacity:0;
      }
      50% {
        opacity:1;
      }
      100% {
        opacity:0;
      }
    }
    @keyframes fade-in-out {
      0% {
        opacity:0;
      }
      50% {
        opacity:1;
      }
      100% {
        opacity:0;
      }
    }

    @-webkit-keyframes fade-in-down {
      0% {
        opacity:0;
        bottom:60px;
      }
      15% {
        opacity:1;
        bottom:60px;
      }
      40% {
        opacity:1;
        bottom:60px;
      }
      60% {
        opacity:1;
        bottom:0;
      }
      80% {
        opacity:0;
        bottom:0;
      }
      100% {
        opacity:0;
        bottom:60px;
      }
    }
    @keyframes fade-in-down {
      0% {
        opacity:0;
        bottom:60px;
      }
      15% {
        opacity:1;
        bottom:60px;
      }
      40% {
        opacity:1;
        bottom:60px;
      }
      60% {
        opacity:1;
        bottom:0;
      }
      80% {
        opacity:0;
        bottom:0;
      }
      100% {
        opacity:0;
        bottom:60px;
      }
    }


    @-webkit-keyframes fade-in-left {
      0% {
        opacity:0;
        left:480px;
      }
      40% {
        opacity:1;
        left:480px;
      }
      60% {
        opacity:1;
        left:420px;
      }
      80% {
        opacity:0;
        left:420px;
      }
      100% {
        opacity:0;
        left:480px;
      }
    }
    @keyframes fade-in-left {
      0% {
        opacity:0;
        left:480px;
      }
      40% {
        opacity:1;
        left:480px;
      }
      60% {
        opacity:1;
        left:420px;
      }
      80% {
        opacity:0;
        left:420px;
      }
      100% {
        opacity:0;
        left:480px;
      }
    }

    @-webkit-keyframes fade-out-right {
      0% {
        opacity:1;
        left:420px;
      }
      20% {
        opacity:0;
        left:420px;
      }
      30% {
        opacity:0;
        left:480px;
      }
      60% {
        opacity:1;
        left:480px;
      }
      100% {
        opacity:1;
        left:420px;
      }
    }
    @keyframes fade-out-right {
      0% {
        opacity:1;
        left:420px;
      }
      20% {
        opacity:0;
        left:420px;
      }
      30% {
        opacity:0;
        left:480px;
      }
      60% {
        opacity:1;
        left:480px;
      }
      100% {
        opacity:1;
        left:420px;
      }
    }


@media (max-width:575.98px) {
    .circle-bg {
        background-size: min(75vw, 75%),min(45vw, 60%);
        background-position-x: -2rem, 110%;
        background-position-y: center, bottom;
    }
}


/* Top Christian College */


#topCollege .u-navyBackground {
    background-color: var(--gfColors-navyAccent);
    padding-bottom: 5rem;
}

#topCollege h2 {
    font-weight: 300;
    text-transform: uppercase;
    letter-spacing: .12em;
    font-size: 2.6rem;
    line-height: 1.3;
    padding-top:5rem;
    margin-bottom: 2.5rem;
    text-align:center;
}
#topCollege h2 span {
   font-family: var(--gfVars-bodyFont);
   color: var(--gfColors-gold);
    font-weight: bold;
    letter-spacing: .15em;
    display:block;
    font-size: .5em;
}

#topCollege .circles > div {
    max-width: 300px;
    padding: 1rem;
    display: grid;
    align-content: center;
}
#topCollege .circles span.h3.d-block {
    margin:0;
    font-size: 3em;
    font-weight: 500;
}

#topCollege .imageBanner {
    padding-bottom: 8rem;
    background-image:url(images/top-colleges_dji_0015.jpg);
    background-position-y: 20%;
    background-size: cover;
}
#topCollege ul.u-stepList>li::before {
    height: 1.7rem;
    width: 1.7rem;
}
@media(min-width:768px) {
    #topCollege ul.u-2ColumnList {
        gap:2rem;
}
    #topCollege .container.circles.u-grid3Columns {
        margin-top: -5rem;
}
#topCollege .circles > div {
    background-color: var(--gfColors-slate45);
    max-width: 230px;
    height: 230px;
    padding: 1.4rem;
    border-radius: 50%;
    display: grid;
    align-content: center;
}
}
@media(max-width:767.98px) {
    #topCollege h2 {
        font-size: 2.2rem;
        line-height: 1.2;
        padding-top: 3rem;
        margin-bottom: 1.5rem;
        text-align: left;
    }
    #topCollege .u-navyBackground {
        padding-bottom: 1.5rem;
    }
    #topCollege .circles {
         margin-top: 2rem;
    }
    #topCollege .circles > div, #topCollege .circles span.h3.d-block {
        color:white;
        z-index: 10;
        padding: 0.2rem 0.5rem;
    }
    #topCollege .imageBanner::before {
        background-color: var(--gfColors-navy);
        position: absolute;
        content: "";
        opacity: .55;
        width: 100%;
        height: 100%;
        z-index: 0;
}
    #topCollege .imageBanner {
        padding-bottom: 3rem;
        background-image:url(images/mobile_dji_0015.jpg);
        background-position-y: 20%;
        background-size: cover;
}
}
@media(max-width:381.98px) {
    #topCollege h2 {
        font-size: 1.8rem;
    }
}

@media(min-width:1200px) {
    #topCollege .container.circles.u-grid3Columns {
        padding-inline: 3rem;
    }
    #topCollege h2 {
        font-size: 3rem;
    }
    #topCollege {
        margin-bottom: 8rem;
    }
    #topCollege ul.u-2ColumnList {
        padding-inline: 4rem;
        gap: 4rem;
    }
}



/* Hear our stories */

#hearStories h2 {
    text-transform:uppercase;
    color:var(--gfColors-slate100);
    letter-spacing:0.1em;
    word-spacing:0.2em;
    padding-bottom:4rem;
    text-align: center;
}
#hearStories h2 span {
    font-family:ThirstySoftExtraBold, var(--gfVars-headerFont);
    font-size:1.8em;
    color:var(--gfColors-navy);
    text-transform:none;
    letter-spacing:0;
}
@media(max-width:992px) {
    #hearStories h2::after {
    content: "";
    display: block;
    background-color: var(--gfColors-gold);
    width: 3ch;
    height: 3px;
    margin-bottom: 1.25rem;
    margin-top: 1.75rem;
    margin-left: auto;
    margin-right: auto;
}
#hearStories h2 {
    padding-bottom:1rem;
}
}

@media(min-width:992px) {
    #hearStories h2 {
        display: grid;
        grid-template-columns: auto auto 1fr;
        gap: 1rem;
        align-items: center;
    }
    #hearStories h2::after {
    content: "";
    height: 2px;
    background-color:var(--gfColors-gold);
    width: 100%;
    position: absolute;
    background-position: bottom;
    top: 2rem;
    position:absolute;
    grid-column: 3;
}
}
#hearStories a.button.sparkle {
    padding: 0.75rem 2.5rem;
    position: relative;
}
#hearStories a.button.sparkle::after {
    content: "";
    background-image: url(../__template/t1/images/doodle-illustrations/gold-stars.svg);
    background-repeat: no-repeat;
    width: 4rem;
    height: 4rem;
    position: absolute;
    bottom: 1rem;
    left: -2rem;
    display: block;
}

.hearStories-container
{
    display:grid;
    gap:0;
    margin-bottom: 6rem;
}

.hearStories-item
{
    display:grid;
    grid-template-columns: 1fr 2fr;
    gap:2rem;
    align-items:center;
}

.hearStories-imageLink, .hearStories-imageLink:hover
{
    box-shadow:none;
    text-align: center;
}

.hearStories-item:nth-child(2n)
{
    grid-template-columns: 2fr 1fr;
}

.hearStories-item:nth-child(2n) .hearStories-content
{
    grid-column: 1 / 2;
    grid-row: 1 / 2;
    text-align:right;
    justify-self: end;
}

.hearStories-item:nth-child(2n) .hearStories-image
{
    grid-column: 2 / 3;
    grid-row: 1 / 2;
}

.hearStories-content
{
    max-width:500px;
}

.hearStories-content :first-child
{
    margin-top:0;
}

.hearStories-content :last-child
{
    margin-bottom:0;
}

.hearStories-image
{
    border-radius: 50%;
}

@media(min-width:768px) and (max-width:991.98px) {
    .hearStories-container
    {
        gap: 3rem 0;
    }
}
@media(min-width:768px) {
     #hearStories h2::before {
     display:none;
 }
}
@media(max-width: 767.98px){
    .hearStories-container
    {
        gap:3rem;
    }

    .hearStories-item
    {
        grid-template-columns:1fr;
    }
    
    .hearStories-item:nth-child(2n)
    {
        grid-template-columns:1fr;
    }
    
    .hearStories-item:nth-child(2n) .hearStories-content
    {
        grid-row: 2 / 3;
        text-align:left;
        justify-self: start;
    }
    
    .hearStories-item:nth-child(2n) .hearStories-image
    {
        grid-column: 1 / 2;
        grid-row: 1 / 2;
    }
    
    .hearStories-content{
        text-align: center !important;
    }
    
    .hearStories-image
    {
        max-width:250px;
        justify-self:center;
    }
}

/* News & Events */
#newsEvents h2
{
  width: 100%;
  display:grid;
  grid-template-columns: 1fr auto 1fr;
  grid-gap:1rem;
  align-items:center;
  text-transform:uppercase;
  letter-spacing:0.1em;
  margin-bottom: 3rem;
}


#newsEvents h2::before, #newsEvents h2::after
{
  content:"";
  height:1px;
  background-color:var(--gfColors-slate80);
  width: 100%;
  display:block;
}
#newsEvents .h5 a {
    line-height:1.2;
}
#newsEvents span span
{
  font-family:ThirstySoftExtraBold, var(--gfVars-headerFont);
  color: var(--gfColors-slate100);
  font-size:0.8em;
  font-weight:normal;
}

.newsEvents-itemHolder
{
    row-gap:1rem;
    column-gap:0;
}

.newsEvents-itemHolder > *
{
    padding:0 1rem;
    display:grid;
    justify-items:center;
    text-align:center;
    align-content: start;
}

.newsEvents-itemHolder img
{
    max-width:250px;
    width:100%;
}

.newsEvents-itemHolder > * + *
{
    border-left: 1px solid var(--gfColors-slate45);
}

.newsEvents-itemHolder-description {
    max-width:32ch;
}

@media(max-width: 767.98px){
    .newsEvents-itemHolder
    {
        grid-template-columns:1fr 1fr;
        column-gap:1rem;
    }
    
    .newsEvents-itemHolder > *
    {
        border-left:none;
        padding:0 0.5rem;
    }
    .newsEvents-itemHolder > div img {
        border-radius:50%;
    }
}

.newsEvents-itemHolder a.no-box-shadow {
    box-shadow:none;
}
.newsEvents-itemHolder > div img {
    border-radius:50%;
    aspect-ratio:1/1;
    object-fit:cover;
    box-shadow: 1px 1px 5px #eee;
    max-width: 250px;
}



@media(min-width:992px) {
    .newsEvents-itemHolder > * {
        padding: 0 3rem;
    }
    #newsEvents h2 {
        margin-bottom: 4rem;
        margin-top: 7rem;
    }
    h3.mt-2.newsEvents-itemHolder-heading {
    line-height: 1.2;
    font-size: 1.75rem;
}
}

@media (max-width: 475.98px) {
    .newsEvents-itemHolder {
        grid-template-columns: 1fr;
        row-gap: 3rem;
    }
    .newsEvents-itemHolder div img {
        max-width:250px;
    }
    #newsEvents h2 {
        font-size:2.1rem;
    }
}

#calendar-btn a.button.button--lg {
    padding-inline: 3rem;
}


/* Be Known Ending */
#beKnownEnding
{
    text-align:center;
    background-image:url(images/smiley-face.png);
    background-position:top center;
    background-repeat: no-repeat;
    background-size: 4rem auto;
    padding-top:4.5rem;
}

#beKnownEnding :first-child
{
    margin-top:0;
}