@charset "UTF-8";
/* CSS Document */



html, body {
  font-family: 'Lato', arial, sans-serif;
  font-weight: normal;
  background: #000;
}

h1,h2,h3,h4, blockquote { 
	font-family: 'Roboto', Arial, sans-serif;
	font-weight: 300; 
}

.container-fluid {
	max-width: 1366px;
	padding-left: 15px;
	padding-right: 15px;
	
}

.row {
	
	margin-left: 0;
	margin-right: 0;
}


#content {
	outline: none;
}


/*div {
	border: 1px solid red;	
}*/

a {
	color: #2E6CA3;
}

/*


**********************************************************/

.navbar {
	margin-bottom: 0;	
}

.header {
	background: #000 url(../../images/header_bg.jpg) no-repeat;
	border-bottom: 1px solid #C00;
}



.header a.nasa_logo {
	display: inline-block;
	background: url(../../images/nasa.png) no-repeat top left;
	width: 71px;
	height: 85px;
}

.header h1.sts_logo {
	margin: 0;
	display: inline-block;
	background: url(../../images/spot_the_station_browser.png) no-repeat top right;
	width: 342px;
	height: 85px;
	margin-right: -15px;
	background-size: contain;
}

.navbar{
	border-left: none;
	border-right: none;
	border-bottom: none;
}

.header .nav {
	/*padding-top: 20px;*/	
	/*font-size: 20px;*/
	font-size: 1.4vw;
	margin-bottom: 15px;
	display: inline-block;
}

@media (min-width: 1366px) {
	.header .nav {
	font-size: 20px;
	}
}

.header .nav li {
	border-right: 2px solid #555;
}
.header .nav li:last-child {
	border-right: none;
	
}

.header .nav a { 
	color: #CCC;
	font-family: 'Roboto', Arial, sans-serif;
	font-weight: 300; 
	background: #000;
}

.nav-pills>li>a:hover,
.nav-pills>li>a:focus,
.nav-pills>li>a.active
{
	border-radius: 0;	
	background-color: #13438f;
	color: #FFF;
}


.nav .popover a {
	background: #FFF;	
	color: #337ab7;
}

.social {
	color: #CCC;
	padding-top: 10px;	
}

.social div {
	padding: 5px 0;	
}


.banner {
	/*background: url(../../images/banner1.jpg) no-repeat;*/
	width: 100%;
	height: 213px;
	/*margin-bottom: 10px;*/
	background-position: right top;
}

.landing_page .banner {
	margin-bottom: 0;
	height: 254px;
}


.bannerLogo {
	display:none;	
}

/*

Homepage Alert styling

**********************************************************/


.homeAlert {
	background: #FF0;
	min-height: 4px;
	color: #666;
}

button.showAlert {
	position: absolute;
	right: 0;
	width: 33px;
	height: 24px;
	margin-top: -20px;
	margin-right: 15px;
	background: #FF0 url(../../images/showAlert.jpg) no-repeat;
	border: none;
}
.home_alert {
	padding-bottom: 10px;	
}

.homeAlert h2,
.homeAlert h3 {
	color: #333;
}

button.showAlert i { display:none;}

button.close {
	background: #cccc33;
	padding: 10px;
	margin-right: -15px;
	margin-top: -20px;
	opacity: .4;
    filter: alpha(opacity=40);
	font-size: 1.8em;
}

button.close:hover, button.close:focus {
    opacity: .7;
    filter: alpha(opacity=70);
}
/*


**********************************************************/

.breadcrumb {
	background: #555;
	font-size: 13px;
	height: 39px;
	margin-top: 10px;
	margin-bottom: 0;
	border-radius: 0px;
	padding: 0;
	
}

.breadcrumb>li+li:before {
	content: none;	
}

.breadcrumb li a {
	color: #CCC;	
}



.breadcrumb li a,
.breadcrumb li.active
{
	padding: 10px 40px;	
	border: none;
}

.breadcrumb li.active {
	background: url(../../images/breadcrumb_arrow.png) no-repeat top left;
	margin-left: -3px;
	color: #d4d4d4;
}

.breadcrumb li.active.view a {
	padding: 10px 5px 10px 0;	
	border: none;
}

.breadcrumb li:first-child a {
	display:inline-block;
	height: 39px;
	background: #FF0 url(../../images/breadcrumb_iss.jpg) 15px 10px no-repeat;
	color: #404000;
	padding-left: 60px;
}

/*


**********************************************************/

div.contentRow {
	/*background: #252931;*/
}

#content.content {
	min-height: 450px;
}

.content {
	background: #e9e8e9 url(../../images/content_bg.png) repeat-x;	
	/*margin-top: 10px;*/
	color: #333;
	font-size: 18px;
	/*border-left: 1px solid #e9e8e9;
	border-right: 1px solid #e9e8e9;*/
	border-left: 10px solid #000;
	border-top: 10px solid #000;
	outline: none;
}

.content hr {
	border-top: 1px solid #CCC;
}

.content p {
	padding-bottom: 0.75em;	
}

.content h2 {
	padding-top: 50px;
	margin-left: -30px;
	font-size: 36px;
	padding-bottom: 6px;
	border-bottom: 1px solid #e1dfdf;
	margin-bottom: 40px;
}

.content blockquote {
	font-size: 1.7em;
	border-left: 5px solid #e1dfdf;
	margin-left: 30px;
	margin-top: 20px;
	margin-bottom: 20px;
}


.lastUpdated {
	font-size: 14px;
	font-style:italic;
	border-top: 1px solid #e1dfdf;
	color: #666666;
	padding-top: 15px;
	padding-bottom: 15px;
	margin-top: 20px;
	font-weight: 300;
	
}


.warningBox {
	font-size: 2.5em;
}


/*.signUp.cardContent {
	overflow:auto;	
}
*/
.card.whiteCard .signUp.cardContent h2 {
 	margin-left: -30px;
}



/*


**********************************************************/

.support_material {
	height: 100%;
	background-color: #252931;
	border-top: 1px solid #333;
	color: #999;
	padding: 00;
	/*font-size: 16px;*/
	height: 100%;
}

.support_material .card:first-child {
	border-top: 0;
}

.support_material .card {
	border-right: 0;	
	border-bottom: 10px solid #000;	
	min-height: 300px;
}

.support_material .blueCardButton{
	position:relative;
}

.support_material div.spacer {
	display: block;
	width: 100%;
	height: 10px;
	background: #000;
	
}

.support_material .greyCard {
	border-bottom: 10px solid #000;	
}

.support_material h3 {
	font-family: 'Roboto', Arial, sans-serif;
	font-size: 24px;
}



.greyCard {
	padding: 0 0 20px 0;
	background-color: #252931;
	color: #FFF;
	font-size: 16px;
}

.greyCard h3 {
	color: #FFF;
	background: #303540;
	padding-top: 18px;
	padding-bottom: 18px;
	padding-left: 15px;
	margin-top: 0;
}

.greyCard li {
	padding-left: 30px;	
}

.greyCard a {
		color: #FFF;
}

.greyCard a i {
		color: #999;
}



.greyCard .nav-pills a:hover {
		background: none;
		color: #999;
}


/*


**********************************************************/

.blueCard.relatedLinks {
	
}

.blueCard :focus {
	outline-color: #FF0;
	outline-style: double;
    outline-width: 7px;
	display: block;
}

.blueCard.relatedLinks h3 {
	color: #FFF;
	/*background: #303540;*/
	padding-top: 18px;
	padding-bottom: 18px;
	padding-left: 15px;
	margin-top: 0;
}


.blueCard .nav-pills li {
	padding-left: 30px;	
}

.blueCard .nav-pills li.disabled a {
	color: #CCC;	
}

.blueCard .nav-pills a:hover {
		background: none;
		color: #999;
}

.blueCard.faq .nav-pills li {
	padding-left: 0;	
}

.blueCard.faq {
	padding-bottom: 75px;	
}


.blueCard.faq .nav-pills>li>a {
	padding: 0;
}


.blueCard .cardContent.panel-group {
	padding-left: 0;
	padding-right: 0;
	margin-bottom: 0;
}

.blueCard .cardContent.panel-group .panel-primary>.panel-heading {
	background: #5581ba url(../../images/blueCard_bg.png) repeat-x bottom;
}

.blueCard .cardContent.panel-group .panel-primary>.panel-heading+.panel-collapse>.panel-body {
	border-color: #5581ba;
}

.blueCard .cardContent.panel-group .panel {
	border-radius: 0;
	border: 0;
	background: transparent;	
}

.blueCard .cardContent.panel-group .collapse.in {
	background: transparent;
}

/*

Landing Page with Cards

**********************************************************/

.landing_page .header h1.sts_logo {
	position: absolute;
	left: -90000px;
}

.landing_page.sub .header h1.sts_logo {
	position: relative;
	left: auto;
}


.landing_page .header .nav {
	padding-left: 342px;	
}

.landing_page.sub .header .nav {
	padding-left: 0;	
}


.landing_page .bannerLogo {
	display:block;
	position:absolute;
	width: 556px;
	height: 135px;
	background: url(../../images/bannerLogo.png) no-repeat;
}

.landing_page.sub .bannerLogo {
	display:none;
}




.card {
	min-height: 400px;
	border-top: 10px solid #000;
	border-right: 10px solid #000;	
	color: #666;
	font-size: 18px;
	
	padding-left: 0;
	padding-right: 0;
}

.card.noMinHeight {
	min-height: 0;
}

.tall .card {
	min-height: 450px;	
}

.XLtall .card {
	min-height: 800px;	
}

.card .cardContent {
	padding-left: 15px;
	padding-right: 15px;
}

.card:last-child {
	border-right: none;
}

.landing_page.sub .card:last-child {
	border-right: 10px solid #000;
}

.landing_page.sub .card.noBorder {
	border-right: none;
}

.card.greyCard {
	padding: 20px 0 0;
	font-size: 16px;
	color: #FFF;
}

.card.greyCard a {
	color: #999;
	
}

.card.greyCard a:hover {
	text-decoration: underline;
}


.card.greyCard hr {
	border-top-color: #cbcaca;
}

.card.greyCard .popover {
	background: #FFF;
	color: #333;
	font-size: 0.9em;
	text-align: center;
}

.card .smallTxt {
	font-size: 14px;	
}

.card.whiteCard {
	background: #dedede url(../../images/card_white_bg.jpg) repeat-x;	
}

.whiteCard.padBottom {
	padding-bottom: 75px;	
}

.card.whiteCard h2 {
	margin-left:-50px;
	font-size: 30px;
}

.card.whiteCard h3 {
	font-size: 24px;
}

.card.whiteCard .cardContent.indent {
	padding-left: 45px;
}

.yellowCardButton {
	background: #ffff7f ;
	border-radius: 0;
	border: none;
	/*border-top: 1px solid #88a3c7 ;*/
	border-bottom: 4px solid #cccc4c;
	border-right: 2px solid #cccc4c;
	padding-left: 0;
	padding-right: 0;
	
}
.yellowCardButton:hover,
.yellowCardButton:active {
	background:#cccc4c ;
	border-bottom: 4px solid #ffff7f;
}

.yellowCardButton a {
	display:block;
	color: #333;
	width: 100%;
	padding-top: 19px;
	padding-bottom: 16px;
	font-size: 16px;
}

.yellowCardButton:last-child {
	border-right: none;
}


.whiteCard .btn.btn-xl {
	padding: 15px 50px;
    font-size: 24px;
    line-height: 1.3333333;
    border-radius: 6px;
	background-color: #5581ba;
	border-color: #5581ba;
}

.whiteCard .btn.btn-xl:hover,
.whiteCard .btn.btn-xl:focus,
.whiteCard .btn.btn-xl:active {
	background: #385479;
}

.whiteCardButton {
	background: #e5e4e4 ;
	border-radius: 0;
	border: none;
	border-top: 1px solid #bac5d3 ;
	border-bottom: 4px solid #bac5d3;
	padding-left: 0;
	padding-right: 0;
	
}
.whiteCardButton:hover,
.whiteCardButton:active {
	border-bottom: 4px solid #bac5d3f;
}

.whiteCardButton a {
	display:block;
	color: #5581ba;
	width: 100%;
	padding-top: 5px;
	padding-bottom: 5px;
	font-size: 14px;
	text-align: left;
	padding-left: 30px;
}

div.blueCard {
	background: #4A78B5 url(../../images/blueCard_bg.png) repeat-x bottom;
	color: #FFF;
	border-bottom: none;
}

div.blueCard ul li {
	padding: 5px 0;	
}

div.blueCard a {
	color: #FFF;
	font-size: 16px;
}

.blueCardButton {
	background: #7B95C1 ;
	border-radius: 0;
	border: none;
	border-top: 1px solid #7B95C1 ;
	border-bottom: 4px solid #486188;
	
}
.blueCardButton:hover,
.blueCardButton:active {
	background:#486188 ;
	border-bottom: 4px solid #7B95C1;
}

.blueCardButton a {
	display:block;
	color: #FFF;
	width: 100%;
	padding-top: 19px;
	padding-bottom: 16px;
	font-size: 16px;
}

.card .buttonBottom {
	position: absolute;
	bottom:0;
	width: 100%;
	
}

.card.liteGreyCard {
	background: #7e7e7e;
	color: #FFF;
}

.card.liteGreyCard a {
	color: #CCC;
}


.liteGreyCardButton {
	background: #CCC ;
	border-radius: 0;
	border: none;
	color: #FFF;
	border-top: 1px solid #CCC;
	border-right: 2px solid #999;
	border-bottom: 4px solid #999;
	
}
.liteGreyCardButton:hover,
.liteGreyCardButton:active {
	background:#999 ;
	border-top: 1px solid #CCC;
	border-bottom: 4px solid #CCC;
}

.liteGreyCardButton:last-child {
	border-right: none;
}

.card.liteGreyCard .liteGreyCardButton a {
	display:block;
	color: #FFF;
	width: 100%;
	padding-top: 19px;
	padding-bottom: 16px;
	font-size: 16px;
}

.landing_page .card.liteGreyCard .liteGreyCardButton a {
	color: #565656;
}

.card.liteGreyCard .popover {
	color: #666;
}

.card.liteGreyCard .well {
	color: #666;	
	padding-left: 0;
	padding-right: 0;
	border-radius: 0;
}

.landing_page .card.liteGreyCard .well img {
	padding: 0 15px;
}

.card .cardContent.galleryCard {
	height: 250px;	
}

.card .cardContent.galleryCardSighting {
	/*height: auto;	*/
	border-top: 10px solid #000;
}

.card .buttonBottom.buttonGallery {
	position: absolute;
	bottom:87px;
	width: 100%;
}

.card .buttonBottom.buttonGallerySighting {
	position: relative;
}

.card .buttonBottom.buttonWidget,
.card .buttonBottom.buttonTD {
	position: relative;
	width: 100%;
	border-top: 10px solid #000;
	overflow: auto;
}

.card .buttonBottom.buttonWidget .liteGreyCardButton a,
.card .buttonBottom.buttonTD .liteGreyCardButton a{
	display: inline-block;
	height: 60px;
	padding: 20px 10px;
	white-space: normal;
	color: #666;
}

.card .buttonBottom.buttonWidget .liteGreyCardButton a:hover,
.card .buttonBottom.TD .liteGreyCardButton a:hover{
	color: #FFF;
}


/*
				Trajectory Data (OEM)
***********************************************************/

p.dataDownload {
	text-align: center;
}

.dataDownload a.btn {
	margin: 1rem;
	padding: 1rem 2rem;
}


/*
				ESA LIVE TRACKING MAP
***********************************************************/

iframe#iss-pos {
    width: 625px;
    height: 380px;
    overflow: hidden;
	padding-bottom: 30px;
}


/*
						MAPS
***********************************************************/

#content.card.whiteCard h2 {
	margin-left: 20px;
}

#content #map {
	/*top: 60px; */	
	/*position: absolute;
    top: 60px;
    bottom: 70px;
    right: 0;
    left: 0;*/
}

#content.mapSighting .cardContent {
	padding-left: 0;
	padding-right: 0;	
}

#content.mapSighting #map {
	/*top: 60px; */	
	/*position: absolute;
    top: 60px;
    bottom: 70px;
    right: 0;
    margin-left: -75px;*/
	position:relative;
	height: 750px;
}


#content.mapHome #map {
	/*top: 60px; */	
	position: absolute;
    top: 60px;
    bottom: 70px;
    right: 0;
    left: 0;
}

#map div.leaflet-top {
	top: 35px;	
}

#map_dropdown {
	position:relative;
	/*float: left;*/
	z-index: 5000;	
	top: 10px;
}

#map_menu_button {
	margin-left: 9px;
	/*box-shadow: 0 1px 5px rgba(0,0,0,0.65);*/
	height: 26px;
	width: 28px;
	color: #333;
	background-position: right center;
	padding: 6px 7px;
	line-height: 1.2;
	border: 1px solid #999;
}

#map_menu_close_button {
 	position: absolute;
 	/*margin-left: 88%;*/
	right: -31px;
	margin-top: -15px;
	background: #FFF;
	height: 40px;
	padding-top: 10px;
	border-radius: 0;
}

.card .buttonBottom {
	z-index: 6000;	
}

#hidden_dropdown {
	position: absolute;
	/*float: left;*/
	z-index: 5000;	
	/*top: 10px;
	left: 10px;*/
	background: #dedede url(../../images/card_white_bg.jpg) bottom repeat-x ;
	padding: 15px 15px 15px 30px;
	width: 70%;
	/*border-radius: 10px;*/
}

/*.leaflet-container .leaflet-control-attribution.leaflet-control { display: none;}*/


#content.mapSignup #map {
	height: 450px;
	margin-bottom: 20px;
	margin-left: -15px;
}

#content.mapSignup button.myMapLocation {
	padding: 0;
	font-size: 12px;
}


#content.mapSignup #map #hidden_dropdown {
	/*float: left;*/
	z-index: 5000;	
	/*top: 10px;
	left: 10px;*/
	background: #dedede url(../../images/card_white_bg.jpg) bottom repeat-x ;
	padding: 15px 30px 15px 30px;
	width: 70%;
	/*border-radius: 10px;*/
}

#locationMap {
	float:left; 
	width: 200px; 
	height: 250px;	
	/*margin-top: -100px;
	border-left: 10px solid #FFF;*/
	padding-right: 20px;
}

#locationMap #map {
	position: relative;
	height: 200px;
	top: 0;
	bottom:0;	
}

#mapButton {
	margin-top: 5px;
}

#locationMap.mapLarge {
	display: block;
	float: none; 
	/*width: 100%; 
	height: 400px;	*/
	margin-top: 0;
	border-left: none;
	overflow:hidden;
}

#locationMap.mapLarge #map {
	position: relative;
	width: 100%; 
	height: 400px;
}

#locationMap button.close {
	position:absolute;
	top:20px;
	right:15px;
	z-index: 9000;	
	background-color: #FFF;
	opacity: .7;
}

#locationMap button.close:hover {
	opacity: 1.0;
}

#locationMap #map div.leaflet-top,
#locationMap #map div.leaflet-bar {
	display: none;
}


#locationMap #map div.leaflet-top.showControls,
#locationMap #map div.leaflet-bar.showControls {
	display: block;
}

#locationMap #map #map_menu_button {
	position: absolute;
	left: -90000px;
}

#locationMap #map #map_menu_button.showControls {
	left: auto;
}


#map .leaflet-popup-content-wrapper {
	border-radius: 2px;	
}

#map a.leaflet-popup-close-button {
	width: inherit;
	height: inherit;
	color: #666;
	padding: 4px;
	background: #CCC;
    opacity: 0.4;
}

#map .leaflet-popup-content {
	padding-top: 3px;	
}


div.mapSighting #yesMap h2 span {
	font-size: 0.8em;	
}

div.mapSighting #yesMap div.popover {
	z-index: 2000;	
}

h3.SightingOp {
	display: none;	
}

.btn-pull-right-padding {
	margin-top: 10px;
	margin-right: 20px;	
	background: #ffff7f;
	border: none;
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc ;
	border-bottom: 2px solid #cccc4c;
	border-right: 1px solid #cccc4c;
	color: #333;
}

.btn-pull-right-padding:hover,
.btn-pull-right-padding:active,
.btn-pull-right-padding:focus {
	border: none;
	background:#cccc4c ;
	border-bottom: 2px solid #ffff7f;
	border-right: 1px solid #ffff7f;
}

/*


**********************************************************/

#thisform .col-xs-12, 
#thisform .col-sm-12,
#thisform .col-xs-8, 
#thisform .col-sm-8
{
	padding-left: 0;
}

#thisform.sighingLocationForm .col-xs-12, 
#thisform.sighingLocationForm .col-sm-12,
#thisform.sighingLocationForm .col-xs-8, 
#thisform.sighingLocationForm .col-sm-8 
{
	padding-left: 15px;
}



#renewform .form-group, 
#cancelform .form-group, 
.sighingLocationForm .form-group 
{
	margin-right: 0;
}


/*

Widget instruction page styling

**********************************************************/

#myTabs.nav-tabs>li {
	padding-left: 0;
}


.tab-content .tab-pane {
	border: 1px solid #CCC;
	border-top: none;
	background-color: #FFF;
	padding: 15px;
	overflow: auto;	
}

.tab-content h4 {
	display: block;	
}

.clipboard {
	padding-left: 0;
	padding-right: 0;	
}

.btn-clipboard {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 10;
    display: block;
    padding: 5px 8px;
    font-size: 12px;
    color: #767676;
    cursor: pointer;
    background-color: #fff;
    border: 1px solid #e1e1e8;
    border-radius: 0 4px 0 4px;
}

figure.highlight {
	display: block;
    margin: 0;
    padding: 9px 14px;
    margin-bottom: 14px;
    background-color: #f7f7f9;
    border: 1px solid #e1e1e8;
    border-radius: 4px;
}

figure.highlight pre {
	border: none;	
	padding-top: 25px;
	white-space:pre-wrap ;
	word-wrap:break-word ;
}

#widget1 img,
#widget2 img {
	padding: 0 30px 10px 30px;	
}

.termsOfService {
	padding-top: 20px;	
}

.termsOfService p {
	font-size: 11px;
	font-style: italic;
}


/*


**********************************************************/

.sharebuttons {
	padding-bottom: 20px;	
}


.table-hover tbody tr:hover td, .table-hover tbody tr:hover th {
  background-color: #d2d2d2;
}

.table-striped > tbody > tr:nth-of-type(even) {
  background-color: #FFF;
}

.table-striped > tbody > tr:nth-of-type(odd) {
  background-color: transparent;
}



/*


**********************************************************/


.footer {
color: #CCC;	
font-size: 14px;
padding-top: 10px;
padding-bottom: 10px;
}


.footer a.nasa_logo {
	display: inline-block;
	background: url(../../images/nasa.png) no-repeat top left;
	width: 71px;
	height: 85px;
}

div.editor_official {
	display: inline-block;
	padding-top: 10px;
}

div.editor_official span {
	display: block;	
}

.footer ul {
	padding-top: 30px;	
	
}