
/*** Mobile (Default) CSS ***/

/* Basic HTML Tags
======================= */

body {
	background: #000 url('../img/star_bkgd.jpg') repeat left top;
	color: #fff;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 16px;
	line-height: 1.4em;
}

p, ul, ol, dl, blockquote, fieldset {
	margin: 1em 0 0 0;
}

p {
	text-align: justify;
}

ul {
	list-style: disc;
}

ul ul {
	list-style: circle;
}

ul ul ul {
	list-style: square;
}

ol {
	list-style: decimal;
}

ol ol {
	list-style: upper-alpha;
}

ol ol ol {
	list-style: lower-roman;
}

ol ol ol ol {
	list-style: lower-alpha;
}

li, dd {
	margin: 0 0 0 1.5em;
	text-align: left;
}

li:last-child {
	margin-bottom: 1em; /* Needed in nested lists and collapses otherwise. */
}

blockquote {
	display: block;
	margin: 1em 1.5em 0 1.5em;
	text-align: justify;
}

h1 {
	color: #000;
	font-size: 2em;
	font-weight: bold;
	line-height: 1;
	margin: 0.5em 0 0 0;
	text-align: center;
	text-decoration: none;
}

h2 {
	color: #526;
	font-size: 1.5em;
	font-weight: bold;
	line-height: 1;
	padding: 0 0 0.125em 0;
	margin: 0.67em 0 0 0;
	text-align: left;
}

h3 {
	color: #444;
	font-size: 1.25em;
	font-weight: bold;
	line-height: 1;
	margin: 0.8em 0 0 0;
	text-align: left;
}

h4 {
	color: #fff;
	font-size: 1.125em;
	font-weight: bold;
	margin: 0.89em 0 0 0;
	text-align: left;
	text-decoration: underline;
}

h5, h6 {
	color: #fff;
	font-size: 1em;
	font-weight: bold;
	margin: 1em 0 0 0;
	text-align: left;
}

h6 {
	font-style: italic;
}

th, b, strong {
	font-weight: bold;
}

i, em {
	font-style: italic;
}

kbd {
	font-family: monospace;
}

pre {
	display: block;
	font-family: monospace;
	margin: 1em 0;
	white-space: pre;
}

code {
	background: #ccc;
	display: block;
	font-family: monospace;
	margin: 1em 0;
	padding: 0 1em 1em 1em;
	white-space: pre;
}

sup {
	font-size: 0.8em;
	line-height: 1;
	vertical-align: super;
}

sub {
	font-size: 0.8em;
	line-height: 1;
	vertical-align: sub;
}

a {
	color: #06a;
	text-decoration: none;
}

a:hover,
a:focus {
	color: #526;
	text-decoration: underline;
}

hr {
	background: #526;
	border: 0;
	clear: both;
	height: 1px;
	margin: 1em auto;
	padding: 0px;
	text-align: center;
	width: 75%;
}

table {
	border-collapse: collapse;
	color: #000;
	margin: 1em 0 0 0;
	width: 100%;
}

table, th, td {
	border: 1px solid #000;
}

tr {

}

th, td {
	padding: 0.5em;
	vertical-align: middle;
}

table.no-border,
table.no-border th,
table.no-border td {
	border: none;
}

/* General Classes
======================= */

.center {
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

.red {
	color: #b00;
}

.clear {
	clear: both;
}

.video-container {
	clear: both;
}

.video {
	height: 0;
	margin: 1em auto;
	overflow: hidden;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 25px;
	position: relative;
	text-align: center;
}

.video iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.video video {
	height: auto;
	width: 100%;
}

.video-caption {
	font-size: 0.75em;
	line-height: 1.5em;
	margin: 0 auto;
	text-align: center;
	width: 75%;
}

audio {
	margin: 1em 0 0 0;
}

/* Skip Navigation
----------------------- */
#skip {
	left: -999px;
	position: absolute;
	width: 990px;
}

/* Structure
================= */

/* Header Styles
--------------------- */

header {
	background: #2a2a2a;
	position: fixed;
	width: 100%;
	z-index: 20;
}

/* shorter clearfix http://nicolasgallagher.com/micro-clearfix-hack/ */
header:before,
header:after {
	content: "";
	display: table;
}

header:after {
	clear: both;
}

header .nasa-insignia {
	float: left;
	margin: 8px;
	text-decoration: none;
	width: 55px;
}

header .nasa-insignia img {
	display: block;
	height: auto;
	max-width: 100%;
	width: auto\9; /* ie8 */
}

header #nasa-affiliation {
	display: none;
}

header #header-links {
	display: none;
}

header #mobile-nav-icon {
	float: right;
	font-weight: bold;
	line-height: 1;
	margin: 11px;
	text-decoration: none;
	vertical-align: middle;
	width: 40px;
}

header #mobile-nav-icon img {
	display: block;
	height: auto;
	max-width: 100%;
	width: auto\9; /* ie8 */
}

header #mobile-nav-icon label {
	cursor: pointer;
}

header #mobile-nav-icon #menu-toggle {
	display: none; /* hide the checkbox */
}

header #mobile-nav-icon nav {
	display: none;
}

header #mobile-nav-icon #menu-toggle:checked + nav {
	background: #324;
	display: block;
	max-height: calc(100vh - 62px);
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch;
	position: absolute;
	right: 0px;
	top: 62px;
	z-index: 5;
	user-select: none;
	-webkit-user-select: none;
	width: 75%;
}

@media only screen and (min-width: 400px) { /* Adjusting the width of the menu for slightly larger screens */
	header #mobile-nav-icon #menu-toggle:checked + nav {
	width: 50%;
	}
}

header #mobile-nav-icon nav ul {
	background: #324;
	list-style: none;
	margin: 0;
	padding: 0;
}

header #mobile-nav-icon nav ul li {
	border-bottom: 1px solid #4b385e;
	margin: 0;
	padding: 0;
}

header #mobile-nav-icon nav ul li:last-child {
	border: 0;
}

header #mobile-nav-icon nav ul li li {
	border: 0;
}

header #mobile-nav-icon nav ul li a {
	color: #fff;
	display: block;
	padding: 1em;
}

header #mobile-nav-icon nav ul li a:hover,
header #mobile-nav-iconv nav ul li a:focus {
	background: #4b385e;
	text-decoration: none;
}

header #mobile-nav-icon nav ul li ul {
	border-top: 1px dotted #4b385e;
}

header #mobile-nav-icon nav ul li ul li a {
	color: #fff;
	display: block;
	padding-left: 2em;
}

header a {
	color: #fff;
}

header a:hover,
header a:focus {
	color: #ddd;
	text-decoration: none;
}

/* Top Nav
--------------- */

#topnav {
	display: none;
}

/* Background Container
----------------------- */

#bkgd-container {
	padding-top: 62px;
}

/* Site Container
---------------------- */

#site-container {
	margin: 0 auto;
	text-align: center;
}

/* Site Banner
------------------- */

#site-banner {
	line-height: 1;
}

#site-banner img {
	display: block;
	height: auto;
	max-width: 100%;
	width: auto\9; /* ie8 */
}

/* Page Wrapper
-------------------- */

#page-wrapper {
	background: #fff;
	color: #000;
	margin: 0;
	padding: 0;
}

/* shorter clearfix http://nicolasgallagher.com/micro-clearfix-hack/ */
#page-wrapper:before,
#page-wrapper:after {
	content: "";
	display: table;
}

#page-wrapper:after {
	clear: both;
}

/* Content Wrapper
----------------------- */

/* Content
--------------- */

#content {
	background: #fff;
	color: #000;
	padding: 1em;
	text-align: left;
}

#content p:first-child {
	margin: 0;
}

#content h1:first-child {
	margin: 0;
}

/* Main Content Images
--------------------------- */

#content img {
	max-width: 100%;
	width: auto\9; /* ie8 */
}

#content .img-full {
	margin: 1em auto;
}

#content .img-left {
	float: left;
	margin: 1em 1em 1em 0;
	width: 100px;
}

#content .img-right {
	float: right;
	margin: 1em 0 1em 1em;
	width: 100px;
}

#content .img-full img,
#content .img-left img,
#content .img-right img {
	display: table;
	margin: 0 auto;
}

#content .caption {
	font-size: 0.75em;
	line-height: 1.5em;
	margin: 0.5em auto 0;
	text-align: center;
}

#content .img-grid {
	align-content: flex-start;
	align-items: flex-start;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-evenly;
	margin: 1em auto;
	text-align: center;
}

#content .img-grid .img-grid-grp
{
	margin: 0.5em auto;
	width: auto;
}

#content .footnote {
	font-size: 0.75em;
	line-height: 1.5em;
	margin: 0.5em 0 0 0;
}

/* Footer Styles
--------------------- */

footer {
	align-content: flex-start;
	align-items: flex-start;
	background: #2e2e2e;
	color: #a3a3a3;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	font-size: 0.75em;
	justify-content: space-evenly;
	line-height: 1.25;
}

footer a {
	color: #a3a3a3;
}

footer a:hover,
footer a:focus {
	color: #a3a3a3;
	text-decoration: underline;
}

footer .nasa-insignia {
	display: none;
}

footer #goddard-signature {
	display: none;
}

footer #contacts {
	border-bottom: 1px solid #a3a3a3;
	padding: 0.5em;
	width: 100%;
}

footer #notices {
	padding: 0.5em;
	width: 100%;
}

footer #contacts ul,
footer #notices ul {
	margin: 0;
	padding: 0;
}

footer #contacts li,
footer #notices li {
	list-style: none;
	margin: 0;
	padding: 0.25em 0;
}

footer #notices li:before {
	content: "\203A\020";
}

/* Specialized
=================== */

/* Gallery Styles
---------------------- */

.gallery-item {
	margin: 1em 0;
}

/* shorter clearfix http://nicolasgallagher.com/micro-clearfix-hack/ */
.gallery-item:before,
.gallery-item:after {
	content: "";
	display: table;
}

.gallery-item:after {
	clear: both;
}

#content .gallery-item img {
	border: none;
	float: left;
	height: auto;
	line-height: 0;
	max-width: 100px;
}

.gallery-item h2 {
	margin: 0 0 0 116px;
}

.gallery-item h3 {
	margin: 0 0 0 116px;
}

.gallery-item h4 {
	margin: 0 0 0 116px;
}

.gallery-item h5 {
	margin: 0 0 0 116px;
}

.gallery-item h6 {
	margin: 0 0 0 116px;
}

.gallery-item p {
	margin-left: 116px;
}

/* Archive Styles
---------------------- */

.archive_grid {
	align-content: flex-start;
	align-items: flex-start;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-evenly;
	margin-top: 1em;
}

.archive_item {
	width: 100%;
}

.archive_item hr {
	width: 50%;
}

.archive_image {
	margin: 0 auto;
	text-align: center;
}

.archive_title {
	font-weight: bold;
	margin: 0.5em auto;
	text-align: center;
}

.archive_desc {
	text-align: justify;
}
