/*@import url("https://use.typekit.net/nvp6pqr.css");*/
body {
	font-family: proxima-nova, sans-serif;
	font-style: normal;
	color: #284972;
}
p {
	line-height: 1.35em;
}
h1, h2, h3, h4, h5 {
	font-weight: 700;
}
section {
	padding: 20px 0 20px;
}
a {
	color: #338DD8;
}

pre {
    white-space: pre-wrap;       /* Since CSS 2.1 */
    white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
    white-space: -pre-wrap;      /* Opera 4-6 */
    white-space: -o-pre-wrap;    /* Opera 7 */
    word-wrap: break-word;       /* Internet Explorer 5.5+ */
}
.anchor {scroll-margin-top: 6em;}

.back-white {
	background-color: #fff;
}  /**** custom form modifications **********/ .field-underline, select.form-control {
	background: transparent;
	border: none;
	border-bottom: 1px solid #ccc;
	-webkit-box-shadow: none;
	box-shadow: none;
	border-radius: 0;
}
.field-underline {
	padding-left: 0;
}
.field-underline, select.form-control:focus {
	-webkit-box-shadow: none;
	box-shadow: none;
}
.form-control:focus {
	box-shadow: none;
	outline: none;
	color: #197FD3;
	border-color: #197FD3;
}
.form-control:focus::-webkit-input-placeholder {
	color: #197FD3;
}
textarea.form-control {
	min-height: 300px;
}  /******* custom buttons ****************/ .btn-action {
	border-radius: 50px;
	background-color: #197fd3;
	color: #fff;
	padding: 3px 20px 3px;
	transition: ease .2s;
}
.btn-action:hover {
	color: #fff;
	opacity: .5;
	transform: scale(1.03);
}
.btn-action:active {
	opacity: 1;
}
.btn-search {
	border-radius: 50px;
	background-color: #d2e5f6;
	color: #338DD8;
	padding: 3px 20px 3px;
	transition: ease .2s;
}
.btn-download {
	border-radius: 50px;
	background-color: #fff;
	color: #8184a7;
	border-color: #d6d6e0;
	padding: 4px 14px 4px;
	transition: ease .2s;
}
.btn-footer {
	border-radius: 50px;
	background-color: #556D8F;
	color: #fff;
	padding: 3px 20px 3px;
}  /******** custom button colors **********/ .btn-gold {
	background-color: #f7d451;
	border-color: #f7d451;
	color: #284972;
}
.btn-gold:hover {
	color: #284972;
}
.bg-dk-gray {
	background-color: #284972;
	color: #fff;
}
.bg-dk-gray a {
	color: #fff;
}
.bg-blue {
background-color:#197FD3;
}

/**************for responsive youTube videos****************/ .videoWrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */ padding-top: 25px;
	height: 0;
}




.videoWrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
} /**************for responsive html5 videos****************/
video {
	width: 100%;
	max-width: 800px;
	height: auto;
} /**************other page elements****************/
div.yellow-line {
	border-top: #f7d451 solid 3px;
	width: 30px;
	margin-bottom: .7em;
	margin-left: 0;
	display: none;/*hide by default*/
}  /************ Main page carousel customization ******************/ .carousel-header-text {
	color: #f7d451;
	text-transform: uppercase;
	font-weight: 500;
	font-size: .8em;
	margin-bottom: 1.4em;
	letter-spacing: .12em;
}
.carousel-text {
	font-size: 1.5em;
	font-weight: 300;
}
.caption-text-block {
	padding-top: 4.45em;
	padding-right: 3em;
}
.caption-text-block, .carousel-indicators {
	padding-left: 1em;
}
.carousel-indicators {
	padding-bottom: 3.5em;
}
.carousel-indicators .active {
	background-color: #f7d451;
	width: 20px
}
.carousel-item {
	color: #fff;
}
.carousel-control-next, .carousel-control-prev {
	width: 40px;
}
.carousel-image {
	background-size: cover;
	background-repeat: no-repeat;
	height: 350px;
}
.carousel-image.one {
	background-image: url(../images/main-page/carousel-1.png);
}
.carousel-image.two {
	background-image: url(../images/main-page/carousel-2.png);
}
.carousel-image.three {
	background-image: url(../images/main-page/carousel-3.png);
}
#main-slides {
	margin-top: 220px;
}
.carousel-indicators {
	justify-content: left;
	margin: 0;
}  /************ article page defaults for desktop *******************/ section.sub-page.article-page .feature-block.back-dark {
	background-color: #fff;
}
section.sub-page.article-page h3:before {
	content: ""; /* This is necessary for the pseudo element to work. */ display: block; /* This will put the pseudo element on its own line. */ width: 30px; /* Change this to whatever width you want. */ padding-top: 8px; /* This creates some space between the element and the border. */ border-top: 4px solid #f7d451; /* This creates the border. Replace black with whatever color you want. */ margin-top: 3rem;
}
.credits {font-style: italic;}
@media screen and (max-width: 575px) {
	.section-title.article h2.article-date {
		color: rgba(255, 255, 255, 0.60);
		font-weight: 500;
		margin-bottom: 2px;
	}
	.article .credits a {
		color: #007bff;
	}
}
@media screen and (min-width: 576px) {
	.section-title.article h2.article-date {
		color: #9192A9;
	}
}
.section-title.article h2.subtitle {
	text-transform: none;
	letter-spacing: 0;
	font-weight: 500;
	font-size: 1.2em;
	margin-top: -.1em;
	margin-bottom: 1.2em;
}  /* On screens that are 961px or more.... */ @media screen and (min-width: 961px) {
	.carousel-control-next {
		right: -70px;
	}
	.carousel-control-prev {
		left: -70px;
	}
	.carousel-indicators li {
		width: 10px;
		transition: .2s ease;
	}
	#main-slides {
		background: url('../images/main-page/slideshow-back.png');
		background-size: contain;
		background-position: left;
		background-repeat: repeat-x;  		/*		background-color: #284972;*/ padding: 25px 0;
	}
}  /* On screens that are 961px or less.... */ @media screen and (max-width: 991px) {
	.carousel-text {
		font-size: 1.2em;
	}
	.caption-text-block {
		padding-top: 3.5em;
		padding-right: 2em;
	}
	.carousel-control-prev {
		left: -40px;
	}
	.carousel-control-next {
		right: -40px;
	}
}
@media screen and (max-width: 961px) {
	#main-slides {
		background-color: #284972;
	}
	.caption-text-block {
		padding-top: 2em;
		padding-right: 2em;
	}
	.carousel-indicators {
		padding-bottom: 2em;
	}
	.carousel-image {
		height: 280px;
	}
}
@media screen and (max-width: 767px) {
	.carousel-item {
		min-height: 470px;
	}
	#main-slides .container {
		padding-top: 20px;
	}
}
@media screen and (max-width: 768px) {
	#main-slides {
		margin-top: 0;
	}
	.dropdown-menu {
		display: block !important;
	}/*To make sure Mission dropdown in nav stays open on devices*/ .carousel-text {
		font-size: 1.2em;
	}
	.carousel-control-prev, .carousel-control-next {
		top: -20vh;
	}
}
@media screen and (max-width: 575px) {
	#main-slides .container {
		padding-left: 0;
		padding-right: 0;
	}
	.carousel-item {
		min-height: 450px;
	}
	.carousel-image {
		height: 200px;
	}
	.carousel-control-prev {
		left: 10px;
	}
	.carousel-control-next {
		right: 10px;
	}
	.carousel-control-prev, .carousel-control-next {
		top: -260px;
	}
}  /************ Nav bar customization ******************/


@media (min-width: 768px) {
	.navbar-expand-md .navbar-nav .nav-link {
		padding-right: 0rem;
		padding-left: 1.25rem;
		font-size: .9em;
	}
	.navbar-expand-md .navbar-nav .dropdown-menu {
		top: 62px;
	}
}
@media (min-width: 991px) {
	.navbar-expand-md .navbar-nav .nav-link {
		padding-left: 2rem;
		font-size: 1.1em;
	}
}
@media screen and (max-width: 768px) { 	 /*to hide dropdown (sub) navigation when navbar is collapsed*/ li.nav-item .dropdown-menu {
		border: none;
	}
}
.navbar-trans {
	background: transparent;
	border-bottom: #dee2e6 solid 1px;
}
.navbar .navbar-brand img {
	max-height: 60px;
}
.dropdown-toggle {
	cursor: pointer;
}
.dropdown-toggle::after {
	display: none;
}
.dropdown-toggle::before {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f054";
	padding-right: 7px;
	font-size: .6em;
	color: #197FD3;
	-webkit-text-stroke: 1px #197FD3; /* make bolder */
}
li.nav-item.active .nav-link.dropdown-toggle:before {
	color: #197FD3;
}  /* Add the below transitions to allow a smooth color change similar to lyft */ .navbar {
	-webkit-transition: all 0.2s ease-out;
	-moz-transition: all 0.2s ease-out;
	-o-transition: all 0.2s ease-out;
	-ms-transition: all 0.2s ease-out;
	transition: all 0.2s ease-out;
}
@media screen and (max-width: 420px) {
	.navbar .navbar-brand img {
		max-height: 50px;
	}
	.navbar { /* 		border-bottom: 1px solid #197fd342;*/
	}
}
.navbar.scrolled {
	background: rgb(255, 255, 255); /* IE */ background: rgba(255, 255, 255, 1); /* NON-IE */ border-bottom: 1px solid #bac0c5;
	padding-bottom: 10px;
}
.navbar-toggler {
	border: none;
	font-size: 1.75em;
	padding-right: 0;
}
section.main-page h2, section.sub-page h2 {
	color: #284972;
	text-transform: uppercase;
	font-size: 1.075em;
	font-weight: 700;
	margin-bottom: .8em;
	letter-spacing: .08em;
}
section.main-page .feature-block p.meta, section.sub-page .feature-block p.meta {
	color: #9192A9;
	;
}
section.main-page .feature-block p a, section.sub-page .feature-block p a {
	font-weight: 500;
}
section.main-page .feature-block.back-dark, .sidebar-block.back-dark {
	background-color: #EDEEF3;
}
section.sub-page .feature-block.back-dark {
	background-color: #197FD3;
}
.news-divider {
	border-top: #dee2e6 solid 1px;
	padding: 2px;
}
.feature-news-article {
	border-radius: .3em;
	border: 1px solid #dee2e6;
}
div#news-archives-itemContainer.home .news-article:nth-child(-n + 3) {
	border-bottom: #dee2e6 solid 1px;
}
.media-block {
	position: relative;
}
.media-block a.btn {
	position: absolute;
	bottom: 0;
}
.video.feature-block p a {
	font-size: 1.5em;
}



@media screen and (max-width: 991px) {
	.media-block a.btn {
		position: inherit;
	}
}
@media screen and (max-width: 767px) {
	section.main-page h2, section.sub-page h2 {
		font-size: 1.4em;
		font-weight: 700;
		margin-bottom: .6em;
		letter-spacing: .08em;
	}
	.feature-block {
		margin-bottom: 20px;
	}
	section.main-page .feature-block p a, section.sub-page .feature-block p a {
		font-size: 1.1em;
		font-weight: 600;
	}
	section.main-page .feature-block p.meta, section.sub-page .feature-block p.meta {
		color: #7A7B8C;
	}
	section.main-page .feature-block.back-dark p a {
		font-size: 1.1em;
	}
	.feature-news-article { /* 		border: #bac0c5 solid 1px;*/
	}
	.btn-action {
		font-size: 1.3em;
		padding: 8px 20px 8px;
	}
	section {
		padding: 0px;
	}
	section.sub-page .feature-block.back-dark, header.subhead, section.sub-page.article-page .feature-block.back-dark {
		background-color: #197FD3;
	}
    /*header.subhead {min-height: 110px;}*/
    header.subhead .section-title, .feature-block .section-title {
		color: #fff;
		min-height: 110px;
	}
	section.sub-page .feature-block h2 {
		color: #f7d451;
	}
	header.subhead .section-title p.lead, section.sub-page .feature-block h3 a, section.sub-page .feature-block p.meta {
		color: #fff;
	}
	header.subhead .section-title p.lead {
		padding-top: 2em;
	}
	header.subhead .section-title p.lead a {
		color: #fff;
	}
}
@media screen and (max-width: 575px) {
	header.subhead .section-title p.lead {
		padding-top: 16px;
	}
}  /******** news/resources page customizations ********/ 
@media screen and (min-width: 1199px) {
	.feature-box .col-12 {
		min-height: 350px;
	}
}
/* removed by Alysen 8/13/19 as it overwrote captions on mission page making them undistinquishable from other page text
section.sub-page.mission-page p {
	font-size: 1.05em;
	line-height: 1.4em;
}
*/
section.sub-page.mission-page .section-title p.lead a {
	color: #fff;
}
section.sub-page.mission-page .feature-title {
	display: flex;
	flex-direction: column;
	justify-content: center;
}
section.sub-page.team-page .feature-title {
	justify-content: top;
}
section.team-page h2 {
	color: #197FD3;
	text-transform: uppercase;
	font-size: 1em;
	font-weight: 700;
	margin-bottom: .8em;
	letter-spacing: .1em;
}
section.sub-page .feature-title h2 {
	color: #f7d451;
}
section.sub-page .feature-title h3 a, section.sub-page .feature-title p.meta {
	color: white;
}
.feature-title h3 {
	font-weight: 400;
	font-size: 2.4em;
}
.news-date, .article-date {
	color: #9192A9;  	/*	font-size: .9em;*/
}
.article-date {
	font-size: .8em;
	font-weight: 600;
}
.sidebar-block .news-article {
	border-bottom: #dee2e6 solid 1px;
}
.sidebar-block .news-article:nth-of-type(3) {
/*	border-bottom: none;*/
}
.recentNews-block .news-article {
	border-top: 1px solid #dee2e6!important;
	padding: 10px 0 0 0!important;
	margin-bottom: 12px!important;
}
@media screen and (min-width: 961px) {
	.news-article {
		font-size: 1.1em;
	}
}
section.sub-page .feature-title h2 {
	font-size: .9em;
}
@media screen and (max-width: 991px) {
	.feature-title h3 {
		font-size: 1.8em;
	}
}  /************Footer customization ******************/ footer .footer-logo-img {
	max-height: 50px;
}
footer li {
	font-size: 1.1em;
	margin-bottom: 6px;
}
footer .disclaimer-block a {
	color: #F7D451;
}
footer .disclaimer-block {
	border-top: 1px solid #4a6990;
}
footer .brand-icon-footer {
	padding-right: 80px;
}
@media (max-width: 991px) {
	footer .brand-icon-footer {
		padding-right: 40px;
	}
}
@media (min-width: 768px) {
	footer li {
		font-size: 1em;
	}
}
@media (max-width: 767px) {
	footer .text-right {
		text-align: center !important;
	}
	footer .footer-logos {
		border-top: 1px solid #4a6990;
		padding-top: 1em;
	}
	footer .brand-logo-footer {
		border-bottom: 1px solid #4a6990;
		text-align: center;
	}
	footer .brand-logo-footer img {
		width: 240px;
		margin-right: 30px;
	}
	.team-login {
		border-bottom: 1px solid #4a6990;
	}
}  /************ Nav bar expandable search box ******************/  /* content: "\f002"; 	font-weight: 900;   font-family: 'Font Awesome\ 5 Free'; 	color:#197FD3;  
input[type="submit"] {
	font-family: 'Font Awesome\ 5 Free';
	font-weight: 900;
}*/
.searchbox {
	position: relative;
	min-width: 20px;
	width: 0%;
	float: right;
	overflow: hidden;
	-webkit-transition: width 0.3s;
	-moz-transition: width 0.3s;
	-ms-transition: width 0.3s;
	-o-transition: width 0.3s;
	transition: width 0.3s;
}
.searchbox-input {
	top: 0;
	right: 0;
	border: 0;
	outline: 0;
	width: 50%;
	height: 24px;
	margin: 0;
	float: right;
	background-color: transparent;  	/*color:#197FD3;*/
}  /* .searchbox-input::-webkit-input-placeholder {     color: #d74b4b; } .searchbox-input:-moz-placeholder {     color: #d74b4b; } .searchbox-input::-moz-placeholder {     color: #d74b4b; } .searchbox-input:-ms-input-placeholder {     color: #d74b4b; } */ .searchbox-icon, .searchbox-submit {
	background-color: transparent;
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	padding: 0;
	margin: 0;
	border: 0;
	outline: 0;
	color: #197FD3;
	text-align: center;
	cursor: pointer;
}
.searchbox-open {
	width: 50%;
}
.masthead {
	overflow-x: hidden;
	background: #fff;
	background-image: url(../images/main-page/main-background-streaks.png), linear-gradient(146deg, rgba(255, 255, 255, 1) 20%, rgb(218, 234, 247) 49%, rgba(162, 203, 235, 1) 75%) /* W3C */;
}
.masthead .container {
	margin-top: 50px;
}
.masthead .container .col-12 {
	margin-bottom: 80px;
}
.subhead .container {
	margin-top: 66px;
}
@media screen and (max-width: 1199px) {
	.masthead .container .col-12 {
		margin-bottom: 60px;
	}
	.masthead .container {
		margin-top: 20px;
	}
}
@media screen and (max-width: 991px) {
	.masthead .container .col-12 {
		margin-bottom: -30px;
	}
	.subhead .container {
		margin-top: 45px;
	}
}
@media screen and (max-width: 961px) {
	.masthead .container {
		margin-top: 40px;
	}
}
@media screen and (max-width: 768px) {
	.masthead .container .col-12 {
		margin-bottom: 0;
	}
}
@media screen and (max-width: 420px) {
	.masthead .container .col-12 {
		margin-bottom: 20px;
	}
	.masthead {
		background-image: url(../images/main-page/main-background-streaks.png), linear-gradient(146deg, rgba(255, 255, 255, 1) 10%, rgb(218, 234, 247) 45%, rgba(162, 203, 235, 1) 85%) /* W3C */;
		background-position: top;
	}
}
.section-title {
	color: #197FD3;
}
@media screen and (max-width: 767px) {
	.subhead .container.news {
		margin-top: 70px;
	}
}
@media screen and (max-width: 575px) {
	.section-title {
		padding-top: 18px;
	}
	.subhead .container {
		margin-top: 28px;
	}
	.subhead .container.news {
		margin-top: 52px; /*		margin-top: 58px;*/
	}
}
.masthead .section-title h1 {
	font-size: 3.8em;
}
.section-title .lead {
	text-transform: uppercase;
	color: #284972;
	letter-spacing: .2em;
	font-size: .85em;
	font-weight: 500; /* 	margin-top: 1.5em;*/ padding-bottom: 5px;
}  /********NEWS PAGINATION*******/ a:not([href]):not([tabindex]) {
	text-decoration: none;
	color: #117ed1;
}
.holder {
	overflow: auto;
	padding: 20px 0 20px;
}
.holder a {
	cursor: pointer;
	padding: 12px 20px;
	border-radius: 50%;
	text-decoration: none;
	background-color: #117ed12e;
	margin: 0 2px;
}
.holder a:nth-of-type(2) {
	border-top-left-radius: 50%;
	border-bottom-left-radius: 50%;
}
.holder a:nth-last-of-type(2) {
	border-top-right-radius: 50%;
	border-bottom-right-radius: 50%;
}
.holder a:hover {
	background-color: #EDEEF0;
	color: #397192;
}
.holder a.jp-previous, .holder a.jp-next {
	font-size: 2em;
	margin: 0 15px;
	padding: 0px 16px 5px;
	border-radius: 50%;
	background-color: #ffffff00;
	border: 2px solid #117ed1;
	color: #117ed1;
	font-weight: 700;
}
.holder a.jp-current, a.jp-current:hover {
	color: #edeef3;
	padding: 12px 20px;
	border-radius: 50%;
	background-color: #117ed1;
	font-weight: bold;
}
.holder a.jp-disabled, a.jp-disabled:hover, a:not([href]):not([tabindex]):focus, a:not([href]):not([tabindex]):hover {
	color: #117ed12e;
	border-color: #117ed12e;
	background-color: #ffffff00;
}
.holder a.jp-disabled, a.jp-disabled:hover {
	cursor: context-menu;
/*	opacity: 0;*/
}
.holder span {  	
	margin: 0px 2px;
    font-size: 1.5em;
	opacity: .5;
}

.sidebar-block .holder a {
	background-color: #dee2e6;
}
.sidebar-block .holder a.jp-current {
    color: #edeef3;
    background-color: #117ed1;
    font-weight: bold;
}
.sidebar-block .holder a.jp-previous, .holder a.jp-next {
    background-color: #ffffff00;
}

@media screen and (max-width: 1199px) {
	.masthead .section-title h1 {
		font-size: 3.5em;
	}
	.masthead .section-title .lead {
		font-size: .85em;
	}
}
@media screen and (max-width: 991px) {
	.section-title h1 {
		font-size: 2em;
	}
	.section-title.article h1 {
		font-size: 2em;
	}
	.section-title .lead {
		font-size: .8em;
	}
}
@media screen and (max-width: 961px) {
	.masthead .section-title h1 {
		font-size: 3.6em;
	}
	.masthead .section-title .lead {
		font-size: 1.05em;
	}
}  /* On screens that are 961px or more.... */ @media screen and (min-width: 961px) {
	.masthead {
		background-size: cover;  		/* 		background-position: center;*/ background-position: right -140px;
		background-repeat: no-repeat;
	}
	.masthead .section-title {
		position: absolute;
		top: 0px;/*36px*/
		left: 0;
	}
}  /* On screens that are 961px or less.... */ @media screen and (max-width: 961px) {
	.masthead .section-title {
		position: absolute;
		top: 25vh;
		left: 0;
		font-size: .8em;
	}
}
@media screen and (max-width: 768px) {
	#masthead {
		margin-bottom: -80px;
	}
	.masthead .section-title {
		top: 10vh;
	}
	.masthead .section-title h1 {
		font-size: 2.8em;
	}
	.masthead .section-title .lead {
		font-size: .8em;
	}
}
@media screen and (max-width: 420px) {
	#masthead {  		/* 		margin-bottom: 160px;*/ margin-bottom: 20px;
	}
	.masthead .section-title {
		top: 305px;
	}
	.masthead .section-title h1 {
		font-size: 3.2em;
	}
	.masthead .section-title .lead {
		font-size: 1.2em;
		line-height: 1.5em;
		margin-top: 14px;
	}
}
@media screen and (max-width: 355px) {
	#masthead {  		/* 		margin-bottom: 175px;*/
	}
	.masthead .section-title {
		/*top: 55vh;*/
	}
	.masthead .section-title h1 {
		font-size: 2.8em;
	}
	.masthead .section-title .lead {  		/* 		font-size: .6em;*/
	}
}  /****************Paralax for main page header***************/ .parallaxParent {  	/* 	height: 50vh;*/ height: 490px;
	position: relative;
	top: -120px;
}
@media screen and (max-width: 991px) {
	.parallaxParent {
		top: -150px;
	}
}  /* On screens that are 961px or more.... */ @media screen and (min-width: 961px) {
	.parallaxParent {  		/* 		height: 50vh;*/ height: 530px;
	}
	.parallaxParent > * {
		height: 100%;
		position: relative;
	}
}  /* On screens that are 961px or less.... */ @media screen and (max-width: 961px) {
	.parallaxParent {
		height: 460px;
	}
	.parallaxParent > * {
		height: 30%;
		position: relative;
	}
}
@media screen and (max-width: 768px) {
	.parallaxParent {
		top: -20px;
	}
}
@media screen and (max-width: 420px) {
	.parallaxParent {
		top: -20px;
	}
	.parallaxParent {
		height: 490px;
	}
}  /*********** spacecraft/asteroid on mainpage ******************/ .dart-renders {
	position: relative;
}
@media screen and (max-width: 420px) {
	.dart-renders {
		opacity: .85;
	}
}
img#spacecraft {  	/*    animation: shake 1s;*/  	/*    animation-iteration-count: 1;*/ position: absolute;
	width: 470px;
	top: -150px;
	right: 10px;
	transform: rotate(3deg);
}
img#didymos-a {
	position: absolute;
	width: 165px;
	top: -92px;
	right: 110px;
}
img#didymos-b {
	position: absolute;
	width: 400px;
	right: -270px;
	transform: rotate(32deg);
	top: -50px;
}
@media screen and (max-width: 1199px) {
	img#spacecraft {
		width: 380px;
		top: -90px;
		right: 0px;
	}
	img#didymos-a {
		width: 160px;
		top: -100px;
		right: 110px;
	}
	img#didymos-b {
		width: 320px;
		top: -40px;
		right: -170px;
	}
}
@media screen and (max-width: 991px) {
	img#spacecraft {
		width: 320px;
		top: -50px;
		right: -90px
	}
	img#didymos-a {
		width: 100px;
		top: -50px;
		right: 25px
	}
	img#didymos-b {
		width: 250px;
		top: -20px;
		right: -210px
	}
}
@media screen and (max-width: 961px) {
	img#spacecraft {
		width: 320px;
		top: 120px;
		right: -90px;
	}
	img#didymos-a {
		width: 100px;
		top: 120px;
		right: 25px
	}
	img#didymos-b {
		width: 250px;
		top: 150px;
		right: -210px
	}
}
@media screen and (max-width: 768px) {
	img#spacecraft {
		width: 320px;
		top: 20px;
		right: 0px;
	}
	img#didymos-a {
		width: 120px;
		top: 0px;
		right: 120px;
	}
	img#didymos-b {
		width: 280px;
		top: 50px;
		right: -120px;
	}
}
@media screen and (max-width: 420px) {
	img#spacecraft {
		width: 220px;
		top: 98px;
		right: 0px;
		left: 4%;
		transform: rotate(5deg);
	}
	img#didymos-a {
		width: 100px;
		top: 59px;
		left: 21%;
	}
	img#didymos-b {
		width: 280px;
		top: 100px;
		left: 40%;
	}
}
@keyframes shake {
	0% {
		transform: translate3d(0px, 0px, 0px);
		animation-timing-function: ease-in;
	}
	50% {
		transform: translate3d(5px, 2px, 5px);
		animation-timing-function: ease-out;
	}
	100% {
		transform: ntranslate3d(0px, 0px, 0px);
	}
}  /*********** main page feature boxes ******************/
.zoom {
	overflow: hidden;
	transition: flex 0.3s ease-out; /* note that we're transitioning flex, not width!*/
	width: auto;
	flex: 1;
	background-size: cover;
	background-position: center;
	padding: 2em 2em;
	color: #fff;  	/* 	text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);*/ text-align: left;
	cursor: pointer;
	display: flex;
	flex-direction: column;
	justify-content: center;  	/* 	background-color: #197FD3;*/ background: rgb(0, 98, 188);
	background: linear-gradient(0deg, rgba(0, 98, 188, 1) 0%, rgba(25, 127, 211, 1) 100%);
}
@media screen and (min-width: 991px) {
	.zoom {
		margin: 1.1em .5em;
	}
}
@media screen and (min-width: 768px) {
	.zoom {
		margin: .7em .4em;
	}
	.zoom:first-child {
		margin-right: .5em;
		margin-left: 0;
	}
	.zoom:last-child {
		margin-right: 0;
		margin-left: .5em;
	}
}
@media screen and (min-width: 769px) {
	#main.call-to-action-row {
		position: absolute;
	}
}
.zoom .h1 {
	color: #fff;
	/*margin-bottom: .5em;*/
	font-size: 1.8em;
	font-weight: 600;
	margin-bottom: 0px;
	letter-spacing: .02em;
}
.zoom p {
	font-size: 1.1em;
}


#planning .zoom {
	padding:1em;
}

#planning .zoom .h1 {
	font-size: 1.2em;
}



/* for watch party page*/
.zoom.zoom-planning-ar {
	background-image: url('../watch-party/images/DART-AR-QR.png');
	background-size: cover;
	background-position-y: center;
}

.zoom.zoom-planning-printable {
	background-image: url('../watch-party/images/DART_Model_InsertArrayA.JPG');
	background-size: cover;
	background-position-y: center;
}

.zoom.zoom-planning-asteroid {
	background-image: url('../watch-party/images/Asteroid_Models_Photo.jpg');
	background-size: cover;
	background-position-y: center;
}

.zoom.zoom-planning-toy {
	background-image: url('../watch-party/images/Toy%20Brick%20Pic%202.png');
	background-size: cover;
	background-position-y: center;
}

.zoom.zoom-planning-eyes {
	background-image: url('../watch-party/images/eyes.png');
	background-size: cover;
	background-position-y: center;
}

.zoom.zoom-planning-blank {
background: #fff;
}




/* for home page*/
.zoom.zoom-mission-overview {
	background-image: url('../images/main-page/mission-overview1.png');
	background-size: cover;
	background-position-y: center;
}
.zoom.zoom-impactor-spacecraft {
	background-image: url('../images/main-page/impactor-spacecraft1.png');
	background-size: cover;
	background-position-y: center;
}
.zoom.zoom-planetary-defense {
	background-image: url('../images/main-page/planetary-defense1.png');
	background-size: cover;
	background-position-y: center;
}
.zoom.zoom-planetary-defender {
	background-image: url('../images/main-page/planetary-defender.png');
	background-size: cover;
	background-position-y: center;
}
@media screen and (min-width: 768px) {
	.zoom.expanded {
		background: url('../images/main-page/blue-block_idle.png');
	}
}
.zoom .expanded_content {
	display: none;
}
.zoom .expanded_content p{
	line-height:1.2em;
    font-size:1em;
}
.zoom.expanded .expanded_content {
	display: block;
}
@media (min-width:320px) { /* smartphones, iPhone, portrait 480x320 phones */
}
@media (min-width:481px) { /* portrait e-readers (Nook/Kindle), smaller tablets @ 600 or @ 640 wide. */
}
@media (min-width:641px) { /* portrait tablets, portrait iPad, landscape e-readers, landscape 800x480 or 854x480 phones */
}
@media (min-width:961px) { /* tablet, landscape iPad, lo-res laptops ands desktops */

}
@media (min-width:1281px) { /* hi-res laptops and desktops */
} 
/* On screens that are 961px or less.... */ @media screen and (max-width: 767px) {
    
   
	.zoom {
		text-align: center;
		max-height: 90px;
		padding: 2em 1em 2em;
		margin-left: 0px;
		margin-bottom: 10px;
	}
	.zoom .h1 {
		font-size: 1.4em;
		font-weight: 700;
	}
	
	.zoom:hover {
		opacity: .5;
	}
	.navbar-trans {
		background-color: #fff;
	}
	#navbar-main {
		padding: 10px 20px 10px 30px;
	}
	
	.navbar-collapse .nav-item:nth-child(n + 2) {
		border-top: solid 1px #bac0c5;
	}
	.zoom .expanded_content, .yellow-line {
		display: none !important; /*never show extra content or yellow lines in box on small devices*/
	}
		
}
@media screen and (min-width: 768px) {
	.zoom {
		text-align: center;
	}
	.call-to-action-row {
		display: flex;
		flex-direction: row;
		justify-content: flex-start;
		height: 250px;
		width:100%;
		margin-top: -50px;
	}
	.zoom .yellow-line {
		border-top: #f7d451 solid 4px;
		width: 30px;
		margin-bottom: .7em;
	}
	.zoom.expanded {
		flex: 2.7;
		margin-bottom: 0;
		margin-top: 0;
		justify-content: left;
		text-align: left;
	}
	.zoom.expanded p.h1 {
		margin-bottom: 12px;
		font-size: 2em;
	}
	.expanded_content p {
		margin-right: 1em;
		line-height: 1.5em;
	}
}
@media screen and (max-width: 961px) and (min-width: 768px) {
	.call-to-action-row {
		margin-top: -80px;
		margin-bottom: 40px;
	}
}
@media screen and (min-width: 768px) and (max-width: 991px) {
	.zoom {
		padding: 1em;
	}
	.zoom:first-child {
		margin-right: .2em;
		margin-left: 0;
	}
	.zoom:last-child {
		margin-right: 0;
		margin-left: .2em;
	}
	.zoom p.h1 {
		font-size: 1.3em;
	}
	.zoom .yellow-line {
		border: #f7d451 solid 2px;
	}
	.call-to-action-row {
		height: 210px;
	}
	.zoom.expanded p.h1 {
		margin-bottom: 12px;
		font-size: 1.5em;
	}
	.expanded_content p {
		margin: 0;
		font-size: .9em;
	}
}  /************ALYSEN ADDED FOR NEWS ARTICLE AND CONTACT PAGES*************/ .section-title.article h2 {
	font-size: 1em;
}
.article-page .credits, .mission-page .credits {
	line-height: 1.2em;
	color: #284972;
	font-size: .8em;
}
.sub-page.no-header { /*	 margin-top: 75px;;*/ margin-top: 93px;
}
.sub-page.no-header.article-page.article {
	margin-top: 69px;
}
@media (min-width: 991px) { 		 /*below is to change gallery filter buttons on smaller screens to make them look good on blue background header*/ .subhead .button-group {
		padding-bottom: 10px;
	}
	.subhead .button-group .btn-link {
		color: #0056b3;
	}
	.subhead .button-group .btn-link.active { /*		color:#fff;*/
	}
	.sub-page.no-header {
		margin-top: 90px;
		padding-top: 45px; /*		border-top: #dee2e6 solid 1px;*/
	}
	.sub-page.no-header.mission-page {
		border-top: none;
	}
	.sub-page.no-header.article-page.contact {
		margin-top: 81px;
	}
	.sub-page.no-header.article-page {
		margin-top: 89px;
	}
	.sub-page.no-header.article-page.article {
		margin-top: 89px;
	}
}
@media (max-width: 767px) {
	.sub-page.no-header {
		margin-top: 120px;
	}
	.sub-page.no-header.article-page.article {
		margin-top: 96px;
	}
	.subhead .button-group .btn-link {
		color: #fff;
	}
	.subhead .button-group .btn-link.active {
		color: #0056b3;
	} 		/*Alysen deleted the below. Doesn't display on mobile properly. Needs to be height needed to show all elements in this div*/ 	/*.section-title.article { 	  height: 110px; 	}*/
}
@media (max-width: 575px) {
	.sub-page.no-header {
		margin-top: 76px;
	}
	.sub-page.no-header.article-page.article {
		margin-top: 68px;
	}
}
.section-title.article .article-authorname-lg {
	text-transform: none;
	font-weight: normal;
}
.article-page .author-block p {
	margin: 0;
}
.sidebar { /* 	font-size: .8em;*/
}
.sidebar .recentNews-block .lead, .sidebar .side-bar-section .lead {
	font-weight: 700;
	margin-bottom: 10px;
}
.sidebar .author-block .name {
	font-weight: 600;
}
.sidebar .author-block .org, .sidebar .author-block i {
	color: #7A7B8C;
}
.sidebar .socialMedia-block, .sidebar .socialMedia-block i {
	color: #7A7B8C;
}  /* // Extra small devices (portrait phones, less than 576px) */ @media (max-width: 575px) {
	h3.border-top-sm { /*border top above headings on devices*/ border-top: 1px #ccc solid;
	}
	.section-title.article {
		background-color: #398ad9;
		color: #fff;
		padding: 0 2em 0;
	}
	.section-title.article .credits {
		color: #fff;
	}
	.section-title.article .lead {
		color: #fff;
	}
	.section-title.article h2 {
		color: #f7d451;
		font-size: 1em;
	}
	.sidebar {
		font-size: 1em;
	}
	.sidebar p.meta {
		color: #7A7B8C;
		font-size: .9em;
	}
}  /************ALYSEN ADDED FOR MISSION PAGES*************/
/******** mission page customizations ********/

section.sub-page.mission-page {
	margin-top: 110px;
}
@media (max-width: 991px) {
	section.sub-page.mission-page {
		margin-top: 90px;
	}
}
@media (max-width: 767px) {
	section.sub-page.mission-page {
		margin-top: 96px;
	}
}
@media (max-width: 575px) {
	section.sub-page.mission-page {
		margin-top: 86px;
	}
}
section.sub-page.mission-page .section-title, section.sub-page.mission-page .section-title .lead,section.sub-page.planning-page .section-title, section.sub-page.planning-page .section-title .lead {
	color: #fff;
}
section.sub-page.mission-page h3,section.sub-page.planning-page h3 {
	color: #197fd3;
	padding: 1em 0 .5em;
}
section.sub-page.mission-page .feature-box,section.sub-page.planning-page .feature-box-planning, section.sub-page.team-page .feature-block {
	color: #fff;
}
section.sub-page.mission-page .feature-box h2.lead, section.sub-page.team-page .feature-block h2.lead {
	color: #f7d451;
	text-transform: none;
	letter-spacing: .05em;
	font-weight: 600;
}
section.sub-page.mission-page h2,section.sub-page.planning-page h2, section.sub-page.team-page .feature-block h2 {
	font-size: 1.5em;
}
.back-blue {
	background-color: #398ad9;
	/*background-image: linear-gradient(0deg, rgba(19, 105, 189, 1) 0%, rgba(57, 138, 217, 1) 100%);*/

	overflow-x: hidden;
	background-image: url(../images/main-page/main-background-streaks-mission.png), linear-gradient(0deg, rgba(19, 105, 189, 1) 0%, rgba(57, 138, 217, 1) 100%);
	background-position: center;
	background-size: cover;
}
.mission-header-image {
	position: relative;
}
.mission-header-image .impactor {
	width: 570px;
	position: absolute;
	top: -120px;
	left: -80px;
}
.mission-header-image .overview {
	width: 430px;
	position: absolute;
	top: -55px;
	left: 10px;
}
.mission-header-image .planetary {
	width: 390px;
	position: absolute;
	top: -66px;
	left: -10px;
}
.mission-header-image .planetary div, .mission-header-image .overview div {
	position: relative;
}
.mission-header-image .planetary .earth {
	width: 35%;
	position: absolute;
	top: -6%;
	right: -6%;
}
.mission-header-image .overview .dart {
	width: 85%;
	position: absolute;
	bottom: 10%;
	right: -4%;
}
@media (max-width: 1199px) {
	.mission-header-image .impactor {
		width: 490px;
		left: -100px;
		top: -110px;
	}
	.mission-header-image .overview {
		width: 370px;
		top: -10px;
		left: -20px;
	}
	.mission-header-image .planetary {
		width: 340px;
		top: 5px;
		left: -30px;
	}
}
@media (max-width: 991px) {
	.mission-header-image .impactor {
		width: 380px;
		left: -10px;
		top: -80px;
	}
	.mission-header-image .overview {
		width: 340px;
		top: -40px;
		left: 10px;
	}
	.mission-header-image .planetary {
		width: 310px;
		top: -35px;
		left: 28px;
	}
}
@media (max-width: 767px) {
	.mission-header-image .impactor {
		width: 380px;
		position: initial;
	}
	.mission-header-image .overview {
		width: 380px;
		position: initial;
		margin-bottom: 20px;
	}
	.mission-header-image .planetary {
		width: 380px;
		position: initial;
		margin-top: -40px
	}
}
@media (max-width: 575px) {
	.mission-header-image .impactor, .mission-header-image .overview, .mission-header-image .planetary {
		width: 100%;
	}
}
.mission-image-box {
	width: 100%;
	height: 440px;
	background-color: #D6E5F0;
	background-size: cover;
	background-position: center;
	margin-bottom: 100px;
} /**** mission page images ****/ .draco {
	background-image: url("../images/mission/draco.png")
}
.licia {
	background-image: url("../images/mission/licia.png")
}
.technologies {
	background-image: url("../images/mission/technologies.png")
}
.smartnav {
	background-image: url("../images/mission/smartnav.png");
	position: relative;
}
.ion-propulsion {
	background-image: url("../images/mission/ionpropulsion.png");
	position: relative;
}
.rosa {
	background-image: url("../images/mission/rosa.png")
}
.trans-solar-array {
	background-image: url("../images/mission/trans-solar-array.png")
}
.coresat {
	background-image: url("../images/mission/coresat.png")
}
.rlsa {
	background-image: url("../images/mission/rlsa.png")
}
.mission-image-box img {
	border: white 4px solid;
}
.smartnav img, .ion-propulsion img {
	position: absolute;
	right: -2em;
	bottom: -2em;
	width: 55%;
}
.rosa img {
	position: absolute;
	left: -2em;
	bottom: -2em;
	width: 60%;
}
@media (max-width: 575px) {
	.mission-image-box img {
		border: none;
	}
	.smartnav img, .ion-propulsion img {
		right: 1em;
		bottom: 1em;
		width: 40%
	}
	.rosa img {
		left: 1em;
		bottom: 1em;
		width: 40%;
		border: none;
	}
	.mission-image-box {
		width: 100%;
		height: 400px;
		margin-bottom: 0;
	}
} /* The sticky class is added to the navbar with JS when it reaches its scroll position */ .sticky {
	position: fixed;
	top: 50px;
	left: 0px;
}/**/ /* Add some top padding to the page content to prevent sudden quick movement (as the navigation bar gets a new position at the top of the page (position:fixed and top:0) */ /*.sticky + .section-title {   padding-top: 60px; } */ .sidebar-item {  	/*height: 100%;  Full-height: remove this if you want "auto" height */ position: fixed; /* Fixed Sidebar (stay in place on scroll) */ z-index: 1; /* Stay on top */ top: 0px; /* Stay at the top */ overflow: hidden; /* Disable horizontal scroll */ margin-top: 180px;
	padding-top: 55px;
	height: 100%;
	max-width: 280px;
	width: 100%;
	font-size: 1.15em;
}
#sideNavBar div div {
	font-size: 1.1em;
	font-weight: 400; /* 	margin-right: 40px;*/ /*	 width: 100%;*/
} /*  .sidebar-item #sideNavBar div a {  	border-radius: 5px;  } */ #sidebar-item-sub div a {
	color: #8184a7;
	font-size: .7em;
}
#sidebar-item-sub div.active a {
	color: #284972;
	font-size: .7em;
	font-weight: 600;
	border-left: #f7d451 solid 3px;
}
.sidebar-item .border-bottom {
	border-bottom: 1px solid #6bb1ff91 !important; /*	width: 100%;*/
}
.dark-back a {
	color: rgba(255, 255, 255, 0.65);
}
.active-white-bold { /* 	background-color: #3e91d3;*/
}
.active-white-bold a {
	color: #fff;
	font-weight: 700;
	font-size: 1.05em;
}
.light-back a {
	color: #197fd3bd;
}
.active-blue-bold { /* 	background-color: #d3e4f6;*/
}
.active-blue-bold a {
	color: #197fd3;
	font-weight: 700;
}
.mission-page .partner-logos img {
	max-height: 70px;
}
.border-lg {
	border-left: none;
}
.call-to-action-row-mission a:hover {
	text-decoration: none;
}  /* On screens that are 991px or less....make boxes taller */ @media screen and (min-width: 991px) {
	.call-to-action-row-mission
    
    .zoom {
		min-height: 200px;
	}
	.border-lg.light {
		border-left: 1px solid #ffffff4a;
	}
	.border-lg {
		border-left: thin solid #ccc;
	}
} /******** Team page customizations*******************/ section.sub-page.team-page .feature-block .feature-names .feature-title h2 {
	font-size: 1em;
	font-weight: 700;
}
section.team-page .names h2 {
	font-size: 1.3em;
	text-transform: initial;
	letter-spacing: 0.025em;
	font-weight: 600;
}
.names .full-name, .feature-title .full-name {
	font-weight: 600;
}
.names .position, .feature-title .position {
	font-size: .9em;
}
.names .position {
	color: #9192A9;line-height:1em;
}
.feature-title .position {
	opacity: .75;
}
@media screen and (min-width: 991px) {
	section.sub-page.mission-page h2, section.sub-page.team-page .feature-block .lead {
		font-size: 1.75em;
	}
	section.sub-page.team-page .feature-block .intro p {
		font-size: 1.2em;
	}
	.feature-names .feature-title {
		border-left: 1px solid #6bb1ff91;
	}
}
@media screen and (max-width: 991px) {}
@media screen and (max-width: 575px) {
	.feature-names .feature-title {
		border-top: 1px solid #6bb1ff91;
	}
	.names .full-name, .feature-title .full-name {
		font-weight: 600;
		font-size: .9em;
	}
	.names .position, .feature-title .position {
		font-size: .8em;
	}
} /******** Gallery page customizations*******************/ /* ---- isotope ---- */ .filters-button-group .button.active {
	background-color: #d2e5f6;
	text-decoration: none;
}
@media screen and (max-width: 767px) {
	.filters-button-group {
		position: relative;
	}
	.filters-button-group div {
		position: absolute;
		bottom: 22px;
		right: 0;
	}
} /* clear fix */ .grid:after {
	content: '';
	display: block;
	clear: both;
} /* ---- .element-item ---- */ .element-item {
	position: relative;
	float: left;
	margin: 5px;
	padding: 10px;
	border-radius: .5em;
	transition: ease .2s;
}
/*
.element-item:hover {
	background-color: #EDEDF2;
}
*/
.element-item p { /*	line-height: 1.5em;*/
}
.element-item .title {
	font-size: 1.1em;
	font-weight: 600;
}
.element-item .description {
	font-size: .9em;
}
.element-item .credit {
	font-size: 14px;
	font-style: italic;
}
.element-item .thumbnail {
	border: 1px solid #d6d6e0;
	background: #fff;
}
.element-item .btn-download {
	font-size: .9em;
	border-radius: 8px;
	padding: 3px 8px 3px;
}
.element-item .btn:hover {
	color: #197FD3;
	border-color: #197FD3;
}
.thumbnail {
	height: 150px;
}
@media screen and (max-width: 1199px) and (min-width: 992px) {
	.thumbnail {
		height: 120px;
	}
}
@media screen and (max-width: 991px) and (min-width: 768px) {
	.thumbnail {
		height: 95px;
	}
}
@media screen and (max-width: 767px) {
	.thumbnail {
		height: 90px;
	}
}