@font-face {
	font-family: "futura bold";
	src: url(/fonts/Futura-Bold.woff2) format("woff2"), url(/fonts/Futura-Bold.woff) format("woff");
	font-display: swap;
	font-style: normal;
	font-weight: 400
}
@font-face {
	font-family: "futura medium";
	src: url(/fonts/Futura-Medium.woff) format("woff"), url(/fonts/Futura-Medium.woff) format("woff");
	font-display: swap;
	font-style: normal;
}


html {
background:black}

body {
    color: #4b6878;
    font-family: "futura medium",helvetica neue, Arial, sans-serif;
    /*font-family: "futura medium"*/
}
a {
    color: #00afd7
}
a:hover {
    text-decoration: none;
    color: #007bff;
}

a h6,
a p{
    color: #4b6878;
}
    #mainLayoutWrapper {
        padding: 0;
    }
    /*causing an issue with the overflow of the browser in mobile. */
    #mainLayoutWrapper .row{margin:0}

header {
    position:relative
}

h2 {margin-top:50px; margin-bottom:40px}

/****** Search page / Search Bar ******/
#SearchFormContainer{
    background: #3f5b6b;
    color: white;
}
#SearchFormContainer .col-12{
    text-align:center;
}
#SearchFormContainer .input_search{
    width: 300px;
    height: 2.5em;
    padding-left: 10px;
    font-size: 16px;
    padding-top: 0;
}
#SearchFormContainer .btn_search{
    font-size: 16px;
    border: none;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    letter-spacing: .03em;
    color: #fff;
    box-sizing: border-box;
    height: 32px;
    display: inline-block;
    margin: 0;
    transition: all 0.23s ease-in-out 0s;
    padding: 20px;
    background-color: #00afd7;
    line-height: 0;
}
/****** END Search page / Search Bar ******/  

/*=== NEW GENERAL PAGE PAGE SECTIONS===*/

.page-section{padding: 45px 15px 45px 15px;}
.bgGreen, .bgBlue, .bgGray{color:white;}
    .bgGreen .ctaBtn, .bgBlue .ctaBtn, .bgGray .ctaBtn{border-color:white;}
    .bgGray{background-color:#58585A}
    .bgBlue{background-color:#00AFD7}
    .bgGreen{background-color:#00B189}
    .bgLightGray{background-color:#e3e5e4}
    .bgLightBlue{background-color:#e3f2f6}
    .bgLightGreen{background-color:#eefffb}

/*=== END NEW GENERAL PAGE SECTIONS*/



.pullQuote {
    font-size: 36px;
    color: #4b6878;
    width: 100%;
    display: block;
    margin: 20px 30px;
}

    .pullQuote:before {
        content: "|";
        padding-right:20px;
        opacity:0.4
    }
    /*button override styles*/

.btn-outline-primary{ color: white;
    background: #00afd7;
    font-size: 18px;
    border: 1px solid white;
}
.btn-outline-primary:hover{background:white;
    border: 1px solid #00afd7;color:#00afd7;}
.btn-outline-primary.homepageMoreBtn {display:block;width:80%; margin:0 auto;justify-self:center;}


#logo {
    position: absolute;
    top: 20px;
    z-index: 500 /*left:40px; */
}
#navTrigger {color:white;z-index:999; position:absolute; top:20px; right:40px;}

#mainNav {
    position: fixed;
    right: -9999px;
    top: 0;
    transition: 0.2s;
    width: 100%;
    z-index: 900;
    /*  background:white; */
    height: 100vh;
    display: flex;
    align-content: center;
    justify-content: center;
    align-items:center;
}

#navContentCover {
    position: fixed;
    right: -9999px;
    z-index: 800;
    background: #3f5b6b;
    opacity: 0.9;
    width: 100%;
    height: 100%;
    content: " ";
    top: 0;
}
#mainNav::after {
}
    #mainNav.active, #navContentCover.active {
        transition: 0.2s;
        right: 0;
    }
    #mainNav.active{position:absolute; 
    top:0;
     overflow-y:hidden;
    }
    #mainNav.moveTop{top:50px;}
    
    /*====NAVIGATION====*/

#mainNav ul {
    position: relative;

}

#mainNav ul li {
    list-style: none;
    text-align: center;
}

    #mainNav ul li a {
        color: white;
        text-decoration: none;
        font-size: 2em;
        padding: 0 20px 5px 20px;
        display: inline-flex;
        font-weight: 700;
        transition: 0.5s;
    }

    #mainNav ul:hover li a {
       /* color: #000;*/
    }

    #mainNav ul li a:hover {
        transition: 0.5s;
        color: #87e9ff;
        /*background: rgba(63,91,107,1);*/
        border:3px solid white;
        border-radius:5px;
    }

    #mainNav ul li a:before {
        content: '';
        position: absolute;
        top: 50%;
        left: 40%;
        transform: translate(-50%,-50%);
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 5em;
        color: rgba(0,0,0,.1);
        border-radius: 50%;
        z-index: -1;
        opacity: 0;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: 500px;
        transition: letter-spacing 0.5s,left 0.5s;
    }

    #mainNav ul li a:hover:before {
        content: attr(data-text);
        opacity: 1;
        left: 50%;
        letter-spacing: 10px;
        /*width: 1800px;
        height: 1800px;*/
    }

#mainNav ul li ul.subNavList{font-size:12px; 
    padding-top: 15px;}
#mainNav ul li ul li{}
#mainNav ul li ul li a{}
#mainNav ul li ul.subNavList li a:hover{color: #87e9ff !important; border-bottom:2px solid #87e9ff}



/*new nav styles*/
 #mainNav ul{padding-left:0;min-width:375px;}
    #mainNav ul li{list-style: none;
   /* display: flex;*/
    text-align: left;
    /*align-items: center;*/}
    #mainNav ul li a{ 
        color: white;
    text-decoration: none;
    font-size: 2em;
    padding: 0 20px 5px 20px;
    font-weight: 700;
    transition: 0.5s;
    border: 4px solid transparent;}
    /*.subNavList{padding-left:0;position:fixed;display:block;right:0;}*/
    .subNavList{padding-left:0;position:absolute;display:block;}
    .subNavList li{}
    .subNavList li a, #mainNav ul li ul li a{font-weight:normal}
    .subNavList a:hover{color:white !important}
    .subNavTrigger{color:white; padding:10px; background:#3b5462;border:1px solid #74a6c2;margin-right:15px /*position:absolute; right:0*/}
    .subNavTrigger:hover{/*border:2px solid white;*/ color:#87e9ff;cursor:pointer}
    #mainNav{}
    #mainNav ul li:hover ul li a{border:none;}
     #mainNav ul li a{min-width:330px;     
     text-align: center;
   /* display: block;*/}
   
    .parentActive a{}
    .subActive{border-top:1px solid #87e9ff}
   .subActive a, .subActive li{border:none !important}


/*=== DONATE BUTTON*/

 #mainSite #donateBtn{
         /* width: 100px; */
    padding: 8px 15px;
    position: absolute;
     right: 95px;
    border-radius: 5px;
    color: white;
    border: 2px solid white;
    top: 13px;
    /* background: white; */
    /* color: #007bff; */
     }
#subsite #mainTopNav{
    margin: 0;
    display: flex;
    align-items: flex-end;
}
     #subsite #donateBtn{
         /* width: 100px; */
    padding: 8px 15px;
    position: relative;
    /* right: 0; */
    border-radius: 5px;
    color: white;
    border: 2px solid white;
    top: 13px;
    /* background: white; */
    /* color: #007bff; */
     }
    #subsite #donateBtn:hover{background:white; color:#00afd7}
     #subsite #donateBtnMobile{display:none;}




    /*======END NAVIGATION======*/

    /*Homepage*/
/*mainHeadSection*/
section {}
#mainHomeHeadSection {
    height: 100vh;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
}
/*
#mainHomeHeadSection::before {content:" "; background:black; opacity:0.5; position:absolute; z-index:400; top:0; left:0; height:100vh; width:100%}
*/

#mainHomeHeadSection {
    background-position:center center;
    background-color: rgba(0, 0, 0, 0.4) !important;
    background-blend-mode: multiply;
}

    #mainHomeHeadSection h2, #pageHeader h2 {
        font-weight: 400;
    }

#pageHeader {
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 450px;
    background-position: center center;
    background-color: rgba(0, 0, 0, 0.5) !important;
    background-blend-mode: multiply;
    margin:0;/*override for negative margin issue*/
}
    #pageHeader h2 {
        text-align: center;
        /*font-size: 5.0rem;*/
    }
    #pageHeader .lead {
        text-align: center;
       /* font-size: 1.8rem;*/
        padding-left: 20px;
        padding-right: 20px;
    }
    #pageHeaderImage {
        margin: 0;
        padding: 0;
    }
#pageHeaderImage img {
    width: 100%;
    object-fit: cover;
    object-position: center;
    max-height: 450px; 
}
#pageHeaderImage:before {
    background:white;
    content:" ";
    position:absolute; left:0; top:0; 
    width:100%; height:100%;
    opacity:0
}

#EventsListContainer {
    padding: 0;
}
#EventsListContainer #pageHeader {
    margin-bottom: 30px
}

#upcomingEventList, #pastEventList {
}
.eventList, .postList {
    margin-bottom: 40px
}




.eventList .card {
    /*padding: 0*/
    margin:0;
    border:1px solid #e9e9e9 !important;
    height:100%;
}
    .postList .card,  .videoGrid .card{
        margin: 0;
       /* margin-bottom: 30px;*/
       height:100%;
       border:1px solid #e9e9e9 !important;
    }
    
    .postCardImgLink{position:relative;}
    
    .postList .card .card-footer {}
    .postList .card .card-footer a{display:block;}
    .postList .col-md-4, .eventList .col-md-4, .videoGrid .col-md-4{
        margin-bottom:20px;
    }
    
    
    

    .eventList .card img, .postList .card img{
        max-height: 200px;
        object-fit: cover;
        object-position: center;
        background-color: #00afd7
    }
#pageGridList img {
    /*max-height: 250px;*/
    object-fit: cover;
    object-position: center;
}

.postList .card img {
    min-height: 200px
}

#pageContent {
    padding-top: 40px;
    padding-bottom: 60px
}

#pageContent h2 {
    font-size: 2.5rem;
    margin-bottom: 30px;
}
#pageContent h3 {
    margin-bottom:30px
}

#PostsDetailContainer #pageContent .row.postDetailPageRow img{
    max-width:100% !important;
    height:auto !important;
}
.contentPageContent img{max-width:100%;height:auto}


/*======SECTIONS STYLES ==========*/

.centerAlignAllContent{text-align:center;}





/*Posts*/
/*Homeposts*/
.homepageArticles {
}
    .homepageArticles h2 {}

    .homeLargePost {
        padding-left: 0
    }
.postCard {
    margin-bottom: 15px; word-wrap:normal
}
.card {
    word-wrap: normal
}
.sidePostCard img {
    object-fit: cover;
    object-position: center;
    background-color: #00afd7;
    width: 100%
}
.cardPostImage {

}
.cardPostDetails {
    padding: 0.7rem;
    border: 1px solid #eee;
    margin: 0;
}
.cardPostTitleAndAuthor {
     padding: 0;
}
.cardPostTitle {
    font-size: 18px;
    font-weight: normal;
    /*margin-top: .75rem;*/
    padding-left:0; padding-right:0;
}
    .cardPostTitle a {
        color: #4b6878;
        font-weight: bold;
    }
        .cardPostTitle a:hover {
            color: #00afd7;
        }
        .cardPostAuthor {
            font-size:14px; padding-left:0;padding-right:0;
        }
.cardPostCategoriesAndDate {
    text-align: right;
    padding-right: 0
}
.cardPostPublishedDate {
    font-size: 14px;
    display: block;
    text-align:right
    
}
a.cardCategoryLink {
    font-size: 11px;
    background: #0ab289;
    border-radius: 10px;
    padding: 2px 8px;
    color: white;
    display: inline-block;
    border: 1px solid #0ab289;
    text-align:center;
}
    a.cardCategoryLink:hover {
        background: white;
        color: #0ab289
    }
    
    
    .postSeriesText{font-size:12px}
    
    /*Post Category List page*/
.postCategoryListFilters {
    display: inline-flex;
    flex-direction: row;
    justify-content: center;

}
.postCategoryFilter {
    color: white;
    display: inline-block;
    background: #01add4;
    padding: 10px 15px;
    font-size: 20px;
    margin: 10px;
    border: 2px solid #01add4;
    border-radius:4px;
}
    a.postCategoryFilter.active, a.postCategoryFilter:hover {
        background: white;
        color: #01add4
    }
.postTagsList {
    padding-left: 0;
    padding-right:0;
    padding-top:10px;
    text-align:left;
    
}
.cardPostPublishedDateCol{padding-left: 0;
    padding-right:0;
    /*Moved this to the top so new styles*/
    position: absolute;
    bottom: 1px;
    right: 1px;
    background: #fff;
    padding: 5px 5px 0 5px;
    border-top-left-radius: 4px;
    color:#585858;
}

.postCategoryListFilters .dropdown-item:hover{color:#01add4}

/*Post detail page*/

#PostsDetailContainer .cardPostCategoriesAndDate {
    margin-bottom:20px
}

.postsDisclosureStatement {
    margin-top: 10px; font-size:12px
}
.postAuthorCard {
    border-radius: 8px;
    border: 1px solid #ddd;
    padding-top: 15px;
    padding-bottom: 15px; margin-bottom:20px
}
    .postAuthorCard img {border-radius:50%;}
    .postAuthorCard .cardPostAuthor {
        font-size:16px;/* margin-bottom:10px; */ display:block;
        

    }
    .postAuthorCard .cardPostAuthorJobTitle {margin-bottom:0;font-size:14px}
    /*Event Detail Page*/
    .eventDateTimeContainer {
        margin-bottom: 40px
    }


    /*PERSON MODULES*/
.peopleGridModule {margin-top:50px}
.peopleGridList img{cursor:pointer}
.peopleGridList .card .personPositionOrTitle{}
.personPositionOrTitle {
    font-weight: bold;
    font-size: 18px;
    margin-bottom: 20px
}
.peopleGridList .card .personPositionOrTitle{font-size:14px; font-weight:normal}
.personBio {}
.personModalInfo{padding-bottom:20px}
.personModalInfo .personPositionOrTitle{margin-top:15px}
.modalPersonImg {margin-bottom:20px}
.half-and-half-row{width:100%}
.halfBox {padding:40px; 
          color:white;
}
    .halfBox h3 {
        font-size:36px; text-transform:uppercase
    }
    .halfBox .half-and-half-content {
        font-size:24px
    }
    
.subPageGrid {
    margin-top: 30px;
    padding-top: 40px;
    padding-bottom:40px;
    border-top: 1px solid #eee;
    background-color: #fafafa
}

/*=== IMAGE GALLERY GRID WITH MODAL SLIDESHOW ===*/
.gallery .col{padding-top:15px; padding-bottom:15px;overflow:hidden}
    .gallery .card{height:100%}
    .gallery .card img{height: 100%;object-fit: cover;}
    .gallery .card img:hover{cursor:pointer;}



.gallery .card {
  background-color: #fff;
  border-radius: 5px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
  -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.gallery .card::after {
  content: "";
  border-radius: 5px;
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
  opacity: 0;
  -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
}

.gallery .card:hover {
  -webkit-transform: scale(1.25, 1.25);
  transform: scale(1.25, 1.25);
}

.gallery .card:hover::after {
    opacity: 1;
}





/*Does this really need this?*/
#pageGridList.card-deck {
    /*width: 100%;*/
}

.card-deck .card{/*margin-bottom:20px !important*/}

.postSideContent {margin-bottom:20px}
    .postSideContent .cardPostPublishedDate { text-align:right
    }
.postAuthorCardTriggerContainer {
    display: none;
}
.socialSharing {
    display: flex;
    align-items: center;
    justify-content: right;
}

.socialShareIcons {
    text-align:right;
    margin-bottom:15px
}

footer {
    background: #3f5b6b;
    color: white;
    padding-bottom: 80px;
    padding-top:40px;
}




.footerDivider {background:#efefef; height:10px}
.footerDonorRecognition {
    display: flex;
    color: white;
    /* margin-left: 245px;*/
    margin-bottom: 60px;
    background: #476373;
    color: #c9e1ef;
    justify-content: center;
    padding: 25px 15px
}
    .footerDonorRecognition span {
        display: inline-flex;
        letter-spacing: 2px;
        align-items: center;
    }
.donorRecognitionFromPhrase {
    font-size: 12px;
    padding-right: 2em;
}

.donorRecognitionListContainer {
    border-left: 1px solid white;
    padding-left:20px
    /*max-width:505px;*/
}

.footerDonorRecognition dl {
    margin: 0; font-weight:normal
}
    .footerDonorRecognition dl dt {font-weight:normal}

    .donorRecognitionListContainer span br {
        display: none;
    }


footer p {}

ul.footerLinks{
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    text-align: center;
    width: 100%;
    margin-top: 30px;
    border-top: 1px solid #517285;
    justify-content:center;
}
ul.footerLinks li{padding:10px;}
ul.footerLinks a{color:white; font-size:12px}
ul.footerLinks a:hover{ color:#00AFD7}

.newletterSignUp {
padding:20px}
.projecBy {
    text-align: center;
}
    .projecBy p {
        font-size:14px
    }
    .projecBy img {
        max-width:300px
    }


.socialMedia {
    text-align:center;
    align-content:center;
    justify-content:center;
}
    .socialMedia a {
        display:inline-block;
        color:white;margin-right:10px
    }
        .socialMedia a:hover {color:#eee;}
        .socialMedia a:hover i{}
        
 .promoHomeBanner{margin-top:30px;min-height:300px; padding:20px;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    background-position: center center;
    background-color: rgba(0, 0, 0, 0.5) !important;
    background-blend-mode: multiply;
        }
        
.promoBannerContentContainer{
     display: flex;
    align-items: center;text-align:center;
}
        .promoBannerContent{}
        
        .promoBannerContent h4{padding:15px;}
        .promoBannerContent .btn-outline-primary{color: white; background:#00afd7;font-size: 18px;
    border: 1px solid white;}
     .promoBannerContent .btn-outline-primary:hover{background:white; color:#00afd7}
     
     
     @media(max-width:625px){
        .promoBannerContent h4{font-size:32px;}
     }       
        
        
        /*MEDIA QUERIES*/
@media(min-width:992px) {
        .sidePostCard img {
        max-height: 148px;
        min-height: 148px;
    }
}


    @media(max-width:992px) {
        .homepageArticles .postCard {}
        .sidePostCard {
            padding-left:0
        }
        .sidePostCard img {
            max-height: 220px;
            min-height: 225px;
        }

        .footerDonorRecognition {
            margin: 15px
        }

        .footerDonorRecognition span {
            letter-spacing: 2px;
            vertical-align: middle;
        }
        .donorRecognitionFromPhrase br {
            display: none;
        }

        .donorRecognitionListContainer br, .donorRecognitionListContainer span br {
            display: inline-block;
        }
        
    }
@media(max-width:768px){
   #pageHeader h2#pageHeaderTitle {font-size:3.0rem}
    .postDetailPageRow {
        flex-direction: column-reverse
    }

    .cardPostCategoriesAndDate {
        text-align: left;
        margin-bottom: 10px
    }
    .cardPostPublishedDate {text-align:right; margin-bottom:10px; margin-top:10px}
    .postTagsList {
        padding-left: 15px;
        text-align: left;
    }
    .postSideContent .cardPostPublishedDate {
        text-align: left;
        margin-top:0
    }
    /*Display none the author card then show when selected*/
 
    .postSideContent {
        padding-left: 0;
        padding-bottom: 15px;
        border-bottom: 1px solid #efefef;
    }
    .postAuthorCardTrigger {
       
    }
    .postAuthorCard {
        
    }

    .postAuthorCardTriggerContainer {
        display: block;
        margin-top: 20px;
    }

    .postAuthorCard, .postsDisclosureStatement {
        display: none;
    }
    .socialShareIcons {
        text-align: left;
        margin-bottom: 5px;
    }
}

    @media(max-width:500px) {
        
        #navTrigger{right:20px !important}
        #logo {
            max-width: 150px;
            top: 10px
        }

            #logo img {
                /* max-width: 100px*/
            }

        #mainNav {
            width: 100%;
            text-align: center;
            display: flex;
            align-items: center;
            justify-content: center;
        }
            #mainNav ul {padding:0; font-size:12px!important}
            #mainNav ul li a{min-width:300px !important}
            #mainNav ul li ul{font-size:.8em !important}
            #mainHomeHeadSection h2 {
                font-size: 2.2rem
            }


        .postCategoryListFilters {
            text-align: center;
            display: block;
        }

        a.postCategoryFilter {
           margin:5px
        }
        .socialMedia{margin-top:40px}
    }
    
    
     @media only screen and (max-width:992px){
       .firstThreeVids, .otherVids{display:block}
       .otherVids{}
       #navTrigger{display:block !important}
       #mainTopNav{display:none !important;}
       #headerNavs{width: auto; 
       position: absolute;
        right: 80px;
    top: 10px;}
   #subsite #donateBtn{display:none}
      #subsite #donateBtnMobile{
             display:block;
            /* width: 100px; */
            padding: 8px 15px;
            position: absolute;
            z-index:999;
            right: 65px;
            border-radius: 5px;
            color: white;
            border: 2px solid white;
            top: 13px;
            /* background: white; */
            /* color: #007bff; */
        }

#mainSite #donateBtn{right:65px}
    
     }
@media only screen and (max-width:992px) and (min-width:484px){
     #mainSite #donateBtn{right:95px}
}
@media only screen and (max-width:484px){
    #mainSite #donateBtn{right:65px !important}
    
}

    
    
    #miniDonationForm{width:100%; height:auto; border:2px solid #ddd;padding:20px;margin-top:20px; margin-bottom:20px}
      #miniDonationForm .donationTabsGroup{width:100%}
    #miniDonationForm .donationTabsGroup .donationTab{width:50%; text-align:center;  border: 1px solid #ddd;
    }
    
    
      .instituteDonationForm{height:auto}
    .instituteDonationForm iframe{min-height:1124px}
    