@import url(../css/normalize.css);

/*    Global    */
@import url(../css/_global/basestyles.css);
@import url(../css/_global/typography.css);
@import url(../css/_global/grid.css);
@import url(../css/_global/buttons.css);
@import url(../css/_global/forms.css);
@import url(../css/_global/lists.css);


/*    Partials    */
@import url(../css/_partials/header.css);
@import url(../css/_partials/footer.css);
@import url(../css/_partials/nav.css);
@import url(../css/_partials/blog.css);
@import url(../css/_partials/modal.css);


/*    Pages    */
@import url(../css/_pages/index.css);
@import url(../css/_pages/goals.css);
@import url(../css/_pages/join.css);
@import url(../css/_pages/about.css);
@import url(../css/_pages/search.css);
@import url(../css/_pages/contact.css);
@import url(../css/_pages/inthenews.css);






.blogpreview-featured-backgroundimage img {
    object-fit: cover;
    width: 100%;
    height: 100%;
}

/* STICKY - FADE IN */
.sticky-fadein {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 999;
    background: #FFF;
    border-bottom: 1px solid #ddd;
    height: 80px;
    opacity: 0;
    transition: opacity 0.15s linear;
}

.sticky-fadein-fixed{opacity:1 !important;}

@media (min-width: 1024px) {.sticky-fadein .logo-mobile {left: 72px;}}
@media (min-width: 1244px) {.sticky-fadein .logo-mobile {left: 97px;}}


/* STICKY - NAV SPACING */
@media (max-width: 767px) {.sticky-fadein nav {display: none;}}

.sticky-fadein nav {position: absolute; top: 17px; right: 50px;}
  @media (min-width: 850px)  {.sticky-fadein nav {top: 12px;}}
  @media (min-width: 1024px) {.sticky-fadein nav {right: 74px;}}
  @media (min-width: 1024px) {.sticky-fadein nav {right: 97px;}}


.sticky-fadein nav a.btn {padding: 7px 20px 9px;}
  @media (min-width: 850px) {.sticky-fadein nav a.btn {padding: 10px 30px 12px; }}

.sticky-fadein nav a:hover {color: #016F74;}
.sticky-fadein nav a.btn:hover {color: #FFF;}

.sticky-fadein nav a:hover::after {
  color: #016F74;
  content: '';
  display: inline-block;
  position: absolute;
  width: 7px;
  height: 7px;
  border-radius: 10px;
  background-color: #CCC;
  left: calc(50% - 4px);
  bottom: -17px;
}
  .sticky-fadein nav a.btn-donate:hover::after,
  .sticky-fadein nav a.search-icon:hover::after
  {display: none;}

.sticky-fadein nav a.active::after {
  content: '';
  display: inline-block;
  position: absolute;
  width: 7px;
  height: 7px;
  border-radius: 10px;
  background-color: #016F74;
  left: calc(50% - 4px);
  bottom: -17px;
}

.sticky-fadein nav a.search-icon {
  position: relative;
  top: 6px;
}
/*    MAIN NAVIGATION LINKS    */


/* ABOUT - CO-CHAIRS */
.about--commissionandstaff--wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-left: -25px;
    margin-right: -25px;
}
	@media screen and (min-width: 500px) and (max-width: 767px) {.about--commissionandstaff--wrap {margin-left: -10px; margin-right: -10px;}}
	@media screen and (min-width: 768px)  {.about--commissionandstaff--wrap {margin-left: -12px; margin-right: -12px;}}
	@media screen and (min-width: 1024px) {.about--commissionandstaff--wrap {margin-left: -15px; margin-right: -15px;}}
	@media screen and (min-width: 1244px) {.about--commissionandstaff--wrap {margin-left: -35px; margin-right: -35px;}}


.about--commissionandstaff {margin-right: 0 !important;}


.about--commissionandstaff--3 {
    -webkit-box-flex: 0;
    -ms-flex: 0 1 auto;
    flex: 0 1 auto;
    width: 100%;
}
	@media screen and (min-width: 500px) and (max-width: 899px) {.about--commissionandstaff--3 {width: 50% !important;}}
	@media screen and (min-width: 900px) {.about--commissionandstaff--3 {width: 33.33% !important;}}


.about--commissionandstaff--3 {
	padding: 25px;
	margin-bottom: 50px;
}
	@media screen and (min-width: 500px) and (max-width: 767px) {.about--commissionandstaff--3 {padding: 10px;}}
	@media screen and (min-width: 768px)  {.about--commissionandstaff--3  {padding: 12px;}}
	@media screen and (min-width: 1024px) {.about--commissionandstaff--3 {padding: 15px;}}
	@media screen and (min-width: 1244px) {.about--commissionandstaff--3 {padding: 35px;}}


	@media screen and (min-width: 500px) {
		.with-cochairs .about--commissionandstaff:nth-child(1), 
		.with-cochairs .about--commissionandstaff:nth-child(2) {
			width: 50% !important;
		}
	}
/* ABOUT - CO-CHAIRS */





.blogpost--bodycopy a, .page--bodycopy a {color: #008185;}
.blogpost--bodycopy a:hover, .page--bodycopy a:hover {color: #016f74;}
.blogpost--bodycopy a.btn, .page--bodycopy a.btn {color: #FFF;}


.blogpost--bodycopy a.btn, .page--bodycopy a.btn {
    color: #FFF;
}
	@media (min-width: 0px) and (max-width: 349px) {
		.blogpost--bodycopy a.btn,
		.page--bodycopy a.btn {
		    padding: 8px 8px 10px;
		    font-size: 12px;
		}
	}
	@media (min-width: 350px) and (max-width: 499px) {
		.blogpost--bodycopy a.btn,
		.page--bodycopy a.btn {
		    padding: 10px 14px 12px;
		    font-size: 13px;
		}
	}
	@media (min-width: 500px) and (max-width: 599px) {
		.blogpost--bodycopy a.btn,
		.page--bodycopy a.btn {
		    font-size: 16px;
		}
	}
	@media (min-width: 600px) and (max-width: 767px) {
		.blogpost--bodycopy a.btn,
		.page--bodycopy a.btn {
		    font-size: 18px;
		}
	}
	@media (min-width: 768px) and (max-width: 1599px) {
		.blogpost--bodycopy a.btn,
		.page--bodycopy a.btn {
		    font-size: 19px !important;
		}
	}


.blogpost--bodycopy figure {
	margin: 0;
	padding-bottom: 50px;
}

.blogpost--bodycopy h4 { line-height: 1.4; font-weight: 600; font-size: 2.0rem;}
	@media (min-width: 400px)  {.blogpost--bodycopy h4 {font-size: 2.45rem;}}
	@media (min-width: 600px)  {.blogpost--bodycopy h4 {font-size: 2.50rem;}}
	@media (min-width: 768px)  {.blogpost--bodycopy h4 {font-size: 2.50rem;}}
	@media (min-width: 1024px) {.blogpost--bodycopy h4 {font-size: 2.75rem;}}



@media (min-width: 1244px) {
	.blogpost--bodycopy,
	.blogpost--image,
	.blogpost--video,
	.header-image-wrapper,
	.page--bodycopy,
	.page--image {
		margin-bottom: 100px;
	}
}


/*.blog--category-sort ul {display: none;}
.blog--category-sort-select {display: block;}*/






/* BLOG SORT */
.blog--category-sort ul {list-style: none; margin-top: 5px; display: none;}
	@media screen and (min-width: 500px)  {.blog--category-sort ul {list-style: none; margin-top: 20px;}}
	@media screen and (max-width: 1099px) {.blog--category-sort ul {display: none;}}

.blog--category-sort .emdash {
    position: relative;
    top: 1px;
	color: #bbb;
	margin-left: -5px;
}
	@media screen and (min-width: 768px)  {.blog--category-sort .emdash {top: -1px;}}
	@media screen and (min-width: 1024px) {.blog--category-sort .emdash {top: -3px;}}
	@media screen and (min-width: 1244px) {.blog--category-sort .emdash {top: -3px;}}
	@media screen and (min-width: 1440px) {.blog--category-sort .emdash {top: -4px;}}


.blog--category-sort-select {
	position: relative;
	width: 80%;
	margin: 30px auto 20px;
	display: block;
	max-width: 600px;
}


.blog--category-sort ul li a {text-decoration: none; font-size: 15px; font-weight: 200; color: #00497B;}
	@media screen and (min-width: 1024px) {.blog--category-sort ul li a {font-size: 25px;}}
	@media screen and (min-width: 1244px) {.blog--category-sort ul li a {font-size: 28px;}}
	@media screen and (min-width: 1440px) {.blog--category-sort ul li a {font-size: 32px;}}



@media (min-width: 500px) {
	.footer-main nav a {
		/*margin: 0 0 0 10px;*/
	}
}






.blogpost--author p {
	min-width: 0 !important;
	width: auto !important;
}


.blogpost--header-share {
    margin-left: 0;
    width: 100%;
}
	@media screen and (min-width: 768px) {
		.blogpost--header-share {
			width: auto !important;
			margin-left: 50px;
		}
	}


.twitter-tweet {margin: 0 auto 100px !important;}


/* ABOUT THE AUTHOR */
.blogpost--authorblock {margin: 0 auto 50px;}
	@media (min-width: 768px)   {.blogpost--authorblock {margin-bottom: 75px;}}
	@media (min-width: 1024px)  {.blogpost--authorblock {margin-bottom: 100px;}}
	@media (min-width: 1244px)  {.blogpost--authorblock {margin-bottom: 150px;}}

.blogpost--authorblock {
	content: "";
	display: table;
	clear: both;
	background-color: #00497b;
	border-radius: 7px;
	padding: 30px;
	color: #FFF;
}
	@media (min-width: 600px)  {.blogpost--authorblock {padding: 50px;}}
	@media (min-width: 1024px) {.blogpost--authorblock {padding: 75px;}}

.blogpost--authorblock-row {
	float: left;
	width: 100%;
	display: block;
	margin-bottom: 50px;
}

.blogpost--authorblock-row:last-child {margin-bottom: 0;}

.blogpost--authorblock img {
	float: left;
	border-radius: 50%;
	width: 150px;
	margin-bottom: 20px;
}
	@media (min-width: 768px) {.blogpost--authorblock img {width: 270px;}}
	@media (min-width: 900px) {
		.blogpost--authorblock img {
			width: 270px;
			margin-bottom: 0;
		}
	}

.blogpost--authorblock-copy {float: left;}
	@media (min-width: 900px) {
		.blogpost--authorblock-copy {
			width: calc(100% - 270px);
			padding-left: 50px;
			padding-right: 25px;
		}	
	}

.blogpost--authorblock h3 {
	margin-bottom: 15px;
	font-size: 30px;
	margin-bottom: 30px;
	text-align: center;
}
	@media (min-width: 768px) {
		.blogpost--authorblock h3 {
			font-size: 32px;
			margin-bottom: 60px;
		}
	}

.blogpost--authorblock p {font-size: 16px;}
	@media (min-width: 768px) {.blogpost--authorblock p {font-size: 18px;}}

.blogpost--authorblock a {
	display: block;
	font-size: 16px;
	color: #FFF;
	margin-top: 20px;
}
	@media (min-width: 768px) {.blogpost--authorblock a {font-size: 18px;}}
/* ABOUT THE AUTHOR */






/* GOALS - VIDEO IN HEADER */
.goals--video {
  max-width: 1240px;
  margin-bottom: 0 !important;
}
/* GOALS - VIDEO IN HEADER */

/* BLOG - VIDEO IN HEADER */
.blogheader--video {
  max-width: 1240px;
  margin-bottom: 0 !important;
}
/* BLOG - VIDEO IN HEADER */

/* BLOG - OPTIONAL VIDEO HEADER */
.blogpost--video-intro {
	max-width: 840px;
	margin: 0 auto 15px;
}
	@media (min-width: 768px) {
		.blogpost--video-intro {
			max-width: 840px;
			margin: 0 auto 30px;
		}
	}

.blogpost--video-intro h1,
.blogpost--video-intro h2,
.blogpost--video-intro h3,
.blogpost--video-intro h4,
.blogpost--video-intro h5,
.blogpost--video-intro h6 {margin-bottom: 5px;}
	@media (min-width: 768px) {
		.blogpost--video-intro h1,
		.blogpost--video-intro h2,
		.blogpost--video-intro h3,
		.blogpost--video-intro h4,
		.blogpost--video-intro h5,
		.blogpost--video-intro h6 {margin-bottom: 15px;}
	}
/* BLOG - OPTIONAL VIDEO HEADER */


/* BLOG - BLOCKQUOTE */
h2.blockquote-quote {
	font-size: 26px;
	letter-spacing: 0;
}
	@media (min-width: 768px) {h2.blockquote-quote {font-size: 38px;}}
/* BLOG - BLOCKQUOTE */

/* BLOG -TITLE STYLING */
@media (min-width: 1024px) {.blogpost--title {width: calc(100% - 50px) !important;}}
@media (min-width: 1024px) {h2.blogpost--title {font-size: 70px;}}
/* BLOG -TITLE STYLING */

/* BLOG - CATEGORY PILLS */
.blogpreview ul {
	display: block;
	margin-bottom: 20px;
}

ul.blogpost--category {
    margin-bottom: 20px;
}

.blogpreview ul li, ul.blogpost--category li {margin: 14px 0 0 0;}
	@media screen and (min-width: 500px) {
		.blogpreview ul li {
			margin: 12px 0 0 0;
		}
		.ul.blogpost--category li {
			margin: 0;
		}
	}
	@media screen and (min-width: 1024px) {
		.blogpreview ul li, ul.blogpost--category li {
		    margin: 21px 0px 0px 0;
		}
		ul.blogpost--category li {
		    margin: 0;
		}
	}

.blogpost--author {margin: 30px 0 100px;}
/* BLOG - CATEGORY PILLS */


/* BLOG - FEATURED POST ON LANDING PAGE */
@media (min-width: 768px)  {.blogpreview-featured-inner {padding: 75px 50px 150px;}}
@media (min-width: 1024px) {.blogpreview-featured-inner {padding: 115px 50px 200px;}}
@media (min-width: 1244px) {.blogpreview-featured-inner {padding: 125px 50px 200px;}}

@media (min-width: 768px) and (max-width: 1023px) {
	.blogpreview-featured-readmore {
	    right: 50px;
	    bottom: 54px;
		font-size: 16px !important;
	}
}
@media (min-width: 1024px) {
	.blogpreview-featured-readmore {
	    right: 52px;
	    bottom: 49px;
	}
}
/* BLOG - FEATURED POST ON LANDING PAGE */


/* BLOG SEPARATORS */
.blogpost-border-divider {
	width: 100%;
	height: 1px;
	display: block;
	background-color: #CCC;
	margin-bottom: 50px;
}
	@media (min-width: 768px)   {.blogpost-border-divider {margin-bottom: 75px;}}
	@media (min-width: 1024px)  {.blogpost-border-divider {margin-bottom: 100px;}}


.lightblue {
	max-width: none;
	padding-top: 50px;
	margin-bottom: 50px;
	background-color: #00497B;
	color: #FFF;
}
	@media (min-width: 768px)   {
		.lightblue {
			padding-top: 75px;
			margin-bottom: 75px;
		}
	}
	@media (min-width: 1024px)  {
		.lightblue {
			padding-top: 100px;
			margin-bottom: 100px;
		}
	}
	.lightblue h1,
	.lightblue h2,
	.lightblue h3,
	.lightblue h4,
	.lightblue h5,
	.lightblue h6,
	.lightblue p {color: #FFF !important;} 
	.lightblue .swiper-pagination-bullet {background-color: #FFF;}


.darkblue {
	max-width: none;
	padding-top: 50px;
	margin-bottom: 50px;
	background-color: #263640;
	color: #FFF;
}
	@media (min-width: 768px)   {
		.darkblue {
			padding-top: 75px;
			margin-bottom: 75px;
		}
	}
	@media (min-width: 1024px)  {
		.darkblue {
			padding-top: 100px;
			margin-bottom: 100px;
		}
	}
	.darkblue h1,
	.darkblue h2,
	.darkblue h3,
	.darkblue h4,
	.darkblue h5,
	.darkblue h6,
	.darkblue p {color: #FFF !important;} 
	.darkblue .swiper-pagination-bullet {background-color: #FFF;}


.notoppadding {padding-top: 0;}
.nobottommargin {margin-bottom: 0;}
/* BLOG SEPARATORS */

/* HOMEPAGE VIDEO */

.index--mantle-learnmore {
    position: absolute;
    bottom: 50px;
}

	/* VIDEO MODAL */
	@keyframes modal-video {
	    from {opacity: 0;}
	    to {opacity: 1;}
	}
	@keyframes modal-video-inner {
	    from {transform: translate(0, 100px);}
	    to {transform: translate(0, 0);}
	}
	.modal-video {
	    position: fixed;
	    top: 0;
	    left: 0;
	    width: 100%;
	    height: 100%;
	    background-color: rgba(0, 73, 123, .9);
	    z-index: 1000000;
	    cursor: pointer;
	    opacity: 1;
	    animation-timing-function: ease-out;
	    animation-duration: 0.3s;
	    animation-name: modal-video;
	    -webkit-transition: opacity 0.3s ease-out;
	    -moz-transition: opacity 0.3s ease-out;
	    -ms-transition: opacity 0.3s ease-out;
	    -o-transition: opacity 0.3s ease-out;
	    transition: opacity 0.3s ease-out;
	}
	.modal-video-close {opacity: 0;}
	.modal-video-close .modal-video-movie-wrap {
	    -webkit-transform: translate(0, 100px);
	    -moz-transform: translate(0, 100px);
	    -ms-transform: translate(0, 100px);
	    -o-transform: translate(0, 100px);
	    transform: translate(0, 100px);
	}
	.modal-video-body {
	    max-width: 940px;
	    width: 100%;
	    height: 100%;
	    margin: 0 auto;
	    display: table;
	}
	.modal-video-inner {
	    display: table-cell;
	    vertical-align: middle;
	    width: 100%;
	    height: 100%;
		padding: 0 15px;
	}
	.modal-video-movie-wrap {
	    width: 100%;
	    height: 0;
	    position: relative;
	    padding-bottom: 56.25%;
	    background-color: #333;
	    animation-timing-function: ease-out;
	    animation-duration: 0.3s;
	    animation-name: modal-video-inner;
	    -webkit-transform: translate(0, 0);
	    -moz-transform: translate(0, 0);
	    -ms-transform: translate(0, 0);
	    -o-transform: translate(0, 0);
	    transform: translate(0, 0);
	    -webkit-transition: -webkit-transform 0.3s ease-out;
	    -moz-transition: -moz-transform 0.3s ease-out;
	    -ms-transition: -ms-transform 0.3s ease-out;
	    -o-transition: -o-transform 0.3s ease-out;
	    transition: transform 0.3s ease-out;
	}
	.modal-video-movie-wrap iframe {
	    position: absolute;
	    top: 0;
	    left: 0;
	    width: 100%;
	    height: 100%;
	}
	.modal-video-close-btn {
	    position: absolute;
	    z-index: 2;
	    top: -50px;
	    right: -20px;
	    display: inline-block;
	    width: 50px;
	    height: 60px;
	    border-radius: 50px;
	    overflow: hidden;
	    border: none;
	    background: transparent;
	}
	.modal-video-close-btn:hover {background: transparent;}

	.modal-video-close-btn:before {transform: rotate(45deg);}
	.modal-video-close-btn:after {transform: rotate(-45deg);}

	.modal-video-close-btn:before,
	.modal-video-close-btn:after {
	    content: "";
	    position: absolute;
	    height: 2px;
	    width: 40px;
	    top: 50%;
	    left: 0;
	    margin-top: -1px;
	    background: #FFF;
	    border-radius: 5px;
	    margin-top: -6px;
	}

	button.modal-video-close-btn:hover:before {background: #008185;}
	button.modal-video-close-btn:hover:after  {background: #008185;}
	/* VIDEO MODAL */

/* HOMEPAGE VIDEO */













/* BLOG FEATURED IMAGE */
@media screen and (min-width: 768px)  {.blogpreview-featured {margin-bottom: 50px;}}
@media screen and (min-width: 1440px) {.blogpreview-featured {margin-bottom: 75px;}}

.blogpreview-featured-inner {}
	@media (min-width: 768px)  {.blogpreview-featured-inner {padding: 65px 50px 150px;}}
	@media (min-width: 1024px) {.blogpreview-featured-inner {padding: 90px 50px 150px;}}
	@media (min-width: 1100px) {.blogpreview-featured-inner {padding: 100px 50px 170px;}}

.blogpreview-featured h2 {}
	@media screen and (min-width: 768px)  {.blogpreview-featured h2 {font-size: 38px}}
	@media screen and (min-width: 1024px) {.blogpreview-featured h2 {font-size: 40px}}
	@media screen and (min-width: 1244px) {.blogpreview-featured h2 {font-size: 55px}}
	@media screen and (min-width: 1440px) {.blogpreview-featured h2 {font-size: 58px}}

.blogpreview-featured-gradient {opacity: .9;}

.blogpreview-featured-readmore {}
	@media screen and (min-width: 1024px) {.blogpreview-featured-readmore {font-size: 20px;}}


.blogpreview-featured-gradient {background-color: #00497b}


	/* BELOW 768 CHANGE */
	@media screen and (max-width: 899px)  {
		.blogpreview-featured-inner {padding: 25px 30px 100px;}

		.blogpreview-featured h2 {
			font-size: 28px;
			position: relative;
			display: block;
			text-align: left;
			margin-bottom: 15px;
		}
		
		.blogpreview-featured ul {
		    position: relative;
		    text-align: left;
		    width: 100%;
		    float: left;
		    display: block;
		    left: 0;
		    top: 0;
		}

		.blogpreview-featured a {
			text-decoration: none;
			float: left;
			display: block;
			left: 0;
			top: 0;
		}

		.blogpreview-featured-readmore {
		    font-size: 16px;
		    margin-top: 10px;
		    margin-bottom: 30px;
		    left: 0;
		    top: 0;
		    position: relative;
		    text-align: left;
		}

		.blog--category {font-size: 11px;}
	}
	/* BELOW 768 CHANGE */

/* BLOG FEATURED IMAGE */



@media (min-width: 400px) {
	.blog-panel p,
	.blog-panel ul li {
		font-size: 18px !important;
		line-height: 1.6 !important;
	}

	.blog-panel ul {
	    margin-top: -25px !important;
	    margin-bottom: 35px !important;
	}

	.blog-panel ul li {
		margin-bottom: 1.25rem !important;
	}
}