/*************************************************************/
/* CSS ADDITIONS: 
/* Quick place for CSS before moving into Master CSS in Git. 
/*************************************************************/
 .flexGrid.actionBtns .flexCard a {
     align-content: center;
}
 div.form_container div[data-required="1"] label:after {
     content: "*";
}
 .localist_widget_container span.lw_event_item_image .event_item_day {
     top: 10px !important;
}
 div.lw_event_item_title:not(:has(+ .lw_event_item_description)), div.lw_event_item_title:not(:has(+ .lw_event_item_description)) a.event_title {
     color: #236595 !important;
}
 div.lw_event_item_title:not(:has(+ .lw_event_item_description)):hover, div.lw_event_item_title:not(:has(+ .lw_event_item_description)) a.event_title:hover {
     color: #00b2e2 !important;
}
.nocontent div.lw_event_item_title:not(:has(+ .lw_event_item_description)) {
    color: #000 !important;
    text-decoration: none;
}
.nocontent div.lw_event_item_title:not(:has(+ .lw_event_item_description)):hover {
    color: #000 !important;
}
 div.form_question.required label, div.form_question.required label * {
     color: #000 !important;
}
 .flexCard.blue section td a:not([class*="btn"]) {
     color: #00b2e2 !important;
}
 p.openp, span.openp{
     font-size:1.25em;
     line-height:150% 
}
 @media only screen and (max-width: 450px) {
     .deadlineList .upwardList {
         margin-left: -15px !important;
    }
}
 @media only screen and (max-width: 1024px) {
     .tier.parallax.leftSubject {
         background-position: 40% 50%;
    }
     .tier.parallax.rightSubject {
         background-position: 60% 50%;
    }
}
 header .searchAZ a {
     font-size: 1em;
}
 header .searchCode {
     min-height: 32.52px;
}
 ul:not([class]) li:not([class]) a:not([class]), ol:not([class]) li:not([class]) a:not([class]), ul.anchors li a, ul.noBullets li a, ul.columns2 li a, ul.columns3 li a, ul.columns4 li a, ul.newsCategories li a, ul.newsRecents li a {
     text-decoration: underline;
}
 div#sideContent {
     word-break: break-word;
}
 .blue article.none.flexCard a:not([class*="btn"]), .blue article.blue.flexCard a:not([class*="btn"]) {
     color: #00b2e2;
}
 article.blue.flexCard a:not([class*="btn"]) {
     color: #00b2e2 !important;
}
 article.cyan.flexCard a:not([class*="btn"]) {
     color: #0a233f !important;
}
 a.calculator-container {
     display: none;
}
 form[data-embed="form_embed"] div[data-required="1"] label:after, form[data-embed="form_embed"] div[data-required="1"] div.form_label:after {
     content: "*";
}
 main table u, main table span {
     text-decoration: none !important;
}
 div.cyanpopout *, div.graypopout * {
     color: #0a233f !important;
}
 .localist-widget-hl .event-specs dt, .event-specs dd {
     min-height: 60px;
}
 .caption[class*="align"] .heading {
     line-height: 40px;
}
 @media only screen and (max-width: 767px) {
     blockquote.quote.quoteBlue, blockquote.quote {
         font-size: 18px;
    }
}
 @media only screen and (max-width: 600px) {
     .flexGrid.noGutters>.flexCard {
         width: 100% !important;
    }
}
 table td>a,ul>li>a,ol>li>a {
     text-decoration:underline;
}

/* Hover Stats */
.tier:has(.holderAngle) {
    overflow: hidden;
}
.holderAngle {
    position: relative;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 10px;
}
.holderAngle h3, .holderAngle h2 {
    position: absolute;
    margin-top: 0;
    text-transform: uppercase;
    margin-bottom: 0;
    padding: 5px;
    font-size: 1.5em;
    transition: ease .5s;
    top: 50%;
    transform: translate(0, -50%);
}
.holderAngle p {
    position: absolute;
    top: 25%;
    left: 2%; 
    padding-right: 2%;
    visibility: hidden;
    opacity: 0;
    transition: ease .5s;
}
.holderAngle .holdover {
    width: 100%;
    height: 100%;
    position: absolute;
    opacity: 0;
    transition: ease .5s;
}
.windowBlock {
    height:300px;
}
.holderAngle:hover p, .holderAngle:has(h3:focus) p, .holderAngle:has(h2:focus) p {
    visibility: visible;
    opacity: 1;
    transition: ease .5s;
}
.holderAngle:hover h3, .holderAngle h3:focus, .holderAngle:hover h2, .holderAngle h2:focus {
    top: 4%; 
    transition: ease .5s;
    font-size: 1.5em;
    transform: translate(0, 0);
}
.holderAngle h3:focus, .holderAngle h2:focus {
    outline: none;
}
.holderAngle:hover .holdover, .holderAngle:has(h3:focus) .holdover, .holderAngle:has(h2:focus) .holdover {
    opacity: .8;
    transition: ease .5s;
    background-color: #fff;
    width: 70%;
    transform: skew(-30deg);
    margin-left: 15%;
}
@media only screen and (max-width: 1280px) {
    .holderAngle:hover h3, .holderAngle h3:focus, .holderAngle:hover h2, .holderAngle h2:focus {
        transition: ease .5s;
        font-size: 1.3em;
    }
}
@media only screen and (max-width: 1024px) {
    .flexGrid.hovereffect {
        display: block;
        margin-right: auto;
        margin-left: auto;
    }
    .flexGrid.hovereffect .flexCard.holderAngle {
        display: block;
        margin-left: auto;
        margin-right: auto;
        max-width: 950px !important;
    }
    .col4 .holderAngle:hover h3, .col4 .holderAngle h3:focus, .col4 .holderAngle:hover h2, .col4 .holderAngle h2:focus {
        transition: ease .5s;
        font-size: 1.5em;
    }
    .col3 .holderAngle:hover h3, .col3 .holderAngle h3:focus, .col3 .holderAngle:hover h2, .col3 .holderAngle h2:focus {
        transition: ease .5s;
        font-size: 1.3em;
    }
}
@media only screen and (min-width: 601px) and (max-width: 850px) {
    .col3 .holderAngle:hover h3, .col3 .holderAngle h3:focus, .col3 .holderAngle:hover h2, .col3 .holderAngle h2:focus {
        transition: ease .5s;
        font-size: 1.2em;
        top: 0;
    }
}
@media only screen and (min-width: 601px) and (max-width: 767px) {
    .flexGrid.hovereffect .flexCard.holderAngle {
        max-width: 48% !important;
    }
    .flexGrid.hovereffect {
        display: flex;
    }
}
@media only screen and (min-width:601px) and (max-width: 700px) {
    .col3 .holderAngle:hover h3, .col3 .holderAngle h3:focus, .col3 .holderAngle:hover h2, .col3 .holderAngle h2:focus {
        transition: ease .5s;
        font-size: 1.2em;
        top: 10px;
    }
    .col3 .windowBlock {
        height: 400px;
    }
}
@media only screen and (max-width: 600px) {
    .windowBlock {
        height: 100px;
        transition: ease .5s;
    }
    .holderAngle:hover h3 ~ .windowBlock, .holderAngle h3:focus ~ .windowBlock, .holderAngle:hover h2 ~ .windowBlock, .holderAngle h2:focus ~ .windowBlock {
        height: 300px;
        transition: ease .5s;
    }
    .holderAngle h3, .holderAngle h2 {
        background: linear-gradient(to right, #0a233f 4px, transparent 4px) 0 0, linear-gradient(to right, #0a233f -5px, transparent 0px) 0 100%, linear-gradient(to left, #0a233f -5px, transparent 0px) 100% 0, linear-gradient(to left, #0a233f 4px, transparent 4px) 100% 100%, linear-gradient(to bottom, #0a233f 4px, transparent 4px) 0 0, linear-gradient(to bottom, #0a233f -5px, transparent 0px) 100% 0, linear-gradient(to top, #0a233f -5px, transparent 0px) 0 100%, linear-gradient(to top, #0a233f 4px, transparent 4px) 100% 100%;
        background-repeat: no-repeat;
        background-size: 50px 30px;
        padding: 10px;
        transition: ease .5s;
        width: 100%;
        text-align: center;
        background-color: #efefef;
    }
    .holderAngle h3:focus, .holderAngle h3:hover, .holderAngle:hover h3, .holderAngle h2:focus, .holderAngle h2:hover, .holderAngle:hover h2 {
        border: 0px !important;
        transition: ease .5s;
        outline: 0px !important;
        outline-offset: 0px !important;
        padding: 10px !important;
        transition: ease .5s;
        background-size: 15px 15px;
        background-color: transparent;
    }
    .col3 .holderAngle:hover h3, .col3 .holderAngle h3:focus, .col3 .holderAngle:hover h2, .col3 .holderAngle h2:focus {
        transition: ease .5s;
        font-size: 1.5em;
    }
}
/*Hover Cards*/
    .card-container {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      justify-items: center;
      justify-self: center;
    }
    .profile-card {
      align-content: center;
      overflow: hidden;
      cursor: pointer;
      position: relative;
    }
    .tier.hoverCards .overlay{
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        padding: .9375rem;
        text-align: center;
        margin: 0;
    }
    .profile-card.flexCard{
        justify-items: center;
    }
    .image-container {
      position: relative;
      overflow: hidden;
    }
    
    .image-container img{
        height: 100%;
        width: fit-content;
        justify-self: center;
    }
    
    .profile-image {
      width: 100%;
      display: block;
    }
    
 .overlay:focus-within .more-info{
        outline:#00B2E2;
        visibility: visible;
        transition: ease .5s;
    }
    
    .more-info{
        margin-bottom: 1rem;
        overflow: hidden;
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
    }
    .tier.hoverCards .profile-card .overlay{
        display:block;
        position: absolute;
        color: #fff;
        background: rgba(10, 35, 63, 0.8);
        overflow:hidden;
        text-align: left;
        transition: all .5s ease;
     }
    .card-container .overlay{
      height: 120px; /* or your preferred consistent height */
      overflow: hidden;
      padding: 0.9375rem;
    }
    .more-info-hide{
        display:none !important;
    }

    .card-container .image-container:hover .overlay, .overlay:focus-within{
        height:100%;
    }

    .image-container:hover .more-info-hide, .overlay:focus-within .more-info-hide{
        display:block !important;
        
    }
  
    .more-info h2 {
      color: #fff;
      font-size: 1.9em;
      margin-bottom:0;
    }
    .more-info h3 {
      margin: 5px 0;
      color: #fff;
    }
    .more-info p {
      font-size: 14px;
    }
    .tier.hoverCards .overlay .more-info-hide a{
        color:#fff;
    }
    .tier.hoverCards .overlay .more-info-hide a:hover{
        color: #00b2e2;
    }
   
    .profile-card .overlay:hover div, .profile-card .overlay:focus-within div{
        overflow: visible;
        display: block;
    }
   
    .more-info h2{
        text-transform: uppercase;
        font-size: 1em;
        font-weight:bold;
    }

    @media only screen and (max-width:700px){
        .card-container .flexGrid{
            display: flex;
            flex-direction: row;
            flex-wrap:wrap;
        }
    }