/* page styles */

.error {
  color:#ff9999;
}

body { 
  padding: 0px;
  margin: 0px;
  border:none; 
  background: url("https://disc.gsfc.nasa.gov/images/gesdisc_marble.jpg") no-repeat fixed center -143px #0A121B;
}

label {
  font-weight:normal;
}

fieldset {
  padding: 2px;
  padding-left: 5px;
  padding-right: 25px;
  border:none;
}

legend { 
  font: 14px/1.531 arial,helvetica,clean,sans-serif; 
  border: none; background:transparent; 
}

input[type=checkbox] {
  transform: scale(1.2);
}
input[type=checkbox]:hover {
  cursor:pointer;
}
input:focus {
  background-color:#efefef;
}

a:focus, button:focus, input[type="radio"]:focus {
  outline:1px dotted green;
  outline-offset: 1px;
  background-color:transparent;
}

.opsMessages {
  background: pink;
  border: 1px solid black;
  width: 100%;
}
.opsBanner {
  background: black;
  width: 100%;
  border: 1px solid black;
}
.opsBannerLabel {
  font-size: 1.1em;
  font-weight: bold;
  color: pink;
  font-style: italic;
  margin-left: 10px;
  margin-right: 10px;
}

a.btn {						
  padding:0px 3px;
  margin:2px 3px;
  white-space:nowrap;
  border:1px #000 solid;
  color:white;
  background-color:#006699;
  text-decoration:none;
  cursor:pointer;
}

a:hover.btn {				
  background-color:#004080;
  text-decoration:none;
}

.resultsLabel {
  font: italic bold 1.7em sans-serif;
  color: #003366;
  padding-left: 20px;
  padding-top: 10px;
}

.profiles {
  padding: 5px;
  margin: 5px;
}
.noDecoration {
  margin: 0px;
  padding: 0px;
  border: none;
}

#pageHeader {
  position:fixed;
  top:30px;
  left:0px;
  right:0px;
  z-index:10;
  font: bold 1.6em serif;
  color: white;
  padding: 0px;
  width:100%;
  background: url("https://disc.gsfc.nasa.gov/images/gesdisc_marble.jpg") no-repeat scroll center -175px #0A121B;
}
.pageDesc {
  padding: 5px;
  margin: 20px;
  margin-top: 0px;
  margin-bottom: 0px;
  color: white; 
  background: black;
  font: bold 12pt serif;
  opacity: 0.65;
  filter:alpha(opacity=65);
}
.pageCell {
  vertical-align: top;
  font-family: sans-serif;
}
.pickerCell {
  vertical-align: top;
  padding-right: 10px;
}
.hint
{
  font-style: italic;
  font-size: 0.9em;
  color: gray;
  white-space: nowrap;
  /* padding-top:5px; */
}
.validDateRange {
  color:#888;
  font-size:1.0em;
  padding-right: 5px;
  margin-left:2px;
}
#bannerHeader {
  display:inline-block;
  font-family:sans-serif;
  margin: 0px;
  font-size: 1.8em; 
  letter-spacing: -1px;
  padding: 5px 10px 2px 17px;
  font-variant:small-caps;
  font-style:italic;
}
#bannerSlogan {
  display:inline-block;
  font: normal 0.8em sans-serif;
  color:#ccc;
}
#bannerLinks {
  display:inline-block;
  font: italic 0.8em sans-serif;
  float:right;
  margin-top:1.4em;
  margin-right:20px;
}
.bannerText {
  font: italic 0.8em sans-serif;
  margin-left:3px;
  margin-right:3px;
}
.bannerLink {
  color: #eee;
  margin-left:3px;
  margin-right:3px;
  white-space:nowrap;
  text-decoration:none;
  font-style:italic;
} 
.bannerLink:visited {
  color: #ddd;
}
.bannerLink:hover {
  color:white;
  text-decoration:underline;
  cursor:pointer;
}
.bannerHelpLink {
  font: bold 0.8em sans-serif;
  vertical-align: middle;
  color: white;
  margin-left: 3px;
  margin-right: 3px;
  padding: 2px;
  padding-left: 6px;
  padding-right: 6px;
  border: solid 1px white;
} 
.bannerHelpLink:visited {
  color: white;
}
.bannerHelpLink:hover {
  color: #ffeb80;
}
.bannerElement {
  float:left;
  margin-left:10px;
}

.inlineFeedbackLink {
  color:blue;
  font-weight:bold;
  font-style:italic;
}
.inlineFeedbackLink:hover {
  cursor:pointer;
  text-decoration:underline;
}

.popupMenu {
  position:absolute;
  padding:10px;
  background-color:#135094;
  z-index:5;
  border:1px solid #999;
  list-style-type: none;
  box-shadow: 5px 2px 5px #0d1d2f;
}
.helpMenu {
  top:25px;
  right:20px;
  width:12em;
  line-height: 1.5;
}
.poweredByMenu {
  bottom:4.5em;
  left:23.1em;
  width:12em;
  line-height:3;
}
.bannerLogin {
  margin-left:20px;
  text-align:right;
  font: normal 1.0em sans-serif;
  display:none;
}
/*20,60,164*/
/*60,110,204*/
.headerToolbar {
  width: 100%;
  background: rgb(20,60,164);
  color: black;
  font: 1.0em sans-serif;
  margin: 0px;
  padding: 0px;
  padding-top: 5px;
  padding-bottom: 5px;
  padding-left: 0px;
  border: none;
  border-bottom: 1px solid rgb(150,150,150);
}

.resultsToolbar {
  background: transparent;
}

.agNewsFeed {
  margin: 5px;
}

.headerLink {
  font: italic 10pt sans-serif;
  vertical-align: middle;
  color: white;
}
.headerLink:visited {
  color: white;
}

.helpButton {
  font: bold 1.0em sans-serif;
  color: rgb(35,80,170);
  background: white;
  cursor: default;
  border: 3px outset white;
  padding: 5px;
  margin: 0px;
  margin-right: 5px;
}
.helpButton:hover {
  color: white;
  background: rgb(35,80,170);
  border: 3px outset rgb(125,170,250);
  cursor: pointer;
}

.plotContainer {
  padding-left: 0px;
}
.plot {
  padding: 5px;
}
.plotTable {
  width: 400px;
  border: 1px solid rgb(210,210,210);
  margin-right: 5px;
}
.plotImageCell {
  background: white;
  border: none;
}
.plotCaptionCell {
  background: white;
  border: none;
  text-align: center;
  font-size: 1.3em;
}

.caption {
  margin-left: 10px;
  margin-right: 10px;
  margin-top: 0px;
  font: 1.3em sans-serif;
}

.floatLeft {
  float: left;
}

.clearIt {
  clear: left;
}

.componentsContainer {
  padding: 5px;
}
.picker {
  padding: 2px;
}
.pickerStatus {
  padding-top: 5px;
  max-width:40em;
  margin-left:9px;
  font-size:1.1em;
}

#sessionDataSelBbPkstatusDiv {
  max-width:32em;
}

#nasaFooter {
  padding:5px;
  padding-top:0px;
  margin-top:5px;
  margin-left:5px;
  position:fixed;
  bottom:0px;
  width:30%;
  z-index:2;
}
.nasaFooterCell {
  width: 5%;
  text-align: left;
  vertical-align: middle;
  white-space: nowrap;
  color: white;
  padding: 3px;
}
#nasaFooterContact {
  width: 5%; 
  text-align: right; 
  vertical-align: top;
  white-space: nowrap;
  color: white;
  padding: 5px;
}
.footerLink {
  color: white;
}
.poweredBy {
  white-space: nowrap;
  padding: 5px;
  margin: 5px;
  text-decoration: none;
  font-weight: bold;
  border: none;
  color: white;
}
.poweredBy:hover {
  border-bottom: 2px solid blue;
}
.poweredByIcon {
  margin-bottom: -8px;
  margin-right: 3px; 
  border: none;
}


/* YUI component styles */

/* buttons in general */
.yui-skin-sam .yui-button button {
  font-size: 1.1em !important;
  border: 1px solid transparent;
}
.yui-skin-sam .yui-button:hover button {
  border: 1px solid magenta;
}
/* plot button */
.yui-skin-sam .yui-button#sessionDataSelToolbarplotBTN button {
  background: url(../img/giovanni_icons.png);
  background-position: -5px -333px;
  width: 250px;
  font-weight:bold;
}
.yui-skin-sam .yui-button#sessionDataSelToolbarplotBTN:hover button {
  background-position: -5px -370px;
}
.yui-skin-sam .yui-button.loadButton button {
  padding-left: 5px;
}
.yui-skin-sam .yui-button.toolbarButton button {
  font-size: 1.0em;
}
.yui-skin-sam .yui-button.rssBannerButton button {
  font-weight: bold;
  font-size: 1.0em;
  padding: 0px;
  color: pink;
  background: black;
  border: 0px solid black;
  max-height: 15px;
  line-height: 1;
  padding: 1px;
  margin: 0px;
  vertical-align: middle;
  min-height: 10px;
}
/* 
.yui-skin-sam .yui-button.appPlotButton button {
background: url(../img/greenButton_BG.png) repeat-x left center;
font-weight: bold;
width: 300px;
border: none;
font-size: 1.0em;
}
.yui-skin-sam .yui-button.appPlotButton:hover button {
background: url(../img/greenButton_BG_hover.png) repeat-x left center;
}
*/
/* YUI TabView styles */
.yui-skin-sam .yui-navset {
  margin: 0px 20px 10px 20px;
}
.yui-skin-sam .yui-navset .yui-nav a {
  background: rgb(90,90,90);
  border: 1px solid rgb(120,120,120);
  color: rgb(230,230,230);
  border-bottom: none;
  font-weight: bold;
}
.yui-skin-sam .yui-navset .yui-nav {
  padding-left: 10px;
}
.yui-skin-sam .yui-navset .yui-nav a:hover {
  font-weight: bold;
  color: rgb(20,60,164);
  background: rgb(140,140,140);
}
.yui-skin-sam .yui-navset .yui-content  {
  padding: 0px;
  background: rgb(245,245,245);
  border: 8px solid rgb(20,60,164);
  border-top: none;
}

/********************************** for faceted picker UI ******************************/

/* base-min.css Overrides */

th, td {padding:0; border:none; }

.panel {
  padding-bottom:10px;
}

/* giovanni.css Overrides */

legend {color:#003366; font-weight:bold; }

/* New CSS Rules */

.facetGroup {
  width:18em;
  min-height:30px;
  margin:0em 0.1em 0em 0.1em;
  vertical-align:top;
}

.facetTitle {
  font-weight:bold;
  display:block;
  padding:2px 5px 2px 5px;
}
.collapsible {
  border-radius:2px !important;
}
.collapsible:hover {
  cursor:pointer !important;
}
.facetInputs {
  white-space:nowrap;
  margin:0.2em 0em 0.4em 0.4em;
}
.facetCheckbox {
  margin-right:0.4em;
}
.facetCheckboxLabel {
  color:#555;
}
.facetCheckboxLabel:hover {
  cursor:pointer;
  background-color:#ccc;
  color:black;
}
.tally {
  background-color: #ddd;
  padding:5px 4px 5px 15px;
  border-top:1px #bbb solid;
  border-bottom:1px #bbb solid;
}
.facetPanel {
  width: 10%;
  padding-right: 10px;
  overflow-y:scroll;
}
.facetResultsPanel {
  display:inline-block;
  /*border: 2px inset rgb(245,245,245);*/
  padding: 0px;
}

.facet-header-button {
  /*background-color:inherit !important;*/
  background-color:transparent;
  border:none;
  margin:0;
  padding:0;
  color:inherit;
  font-weight:inherit;
  vertical-align:middle;
}
.facet-header-button:hover {
  cursor:pointer;
}
.facet-header-button:focus {
  outline-offset:4px;
}
.zeroFacets {
  display:none;
  font-size:larger;
  width:12em;
  padding-left:1px;
  white-space:normal;
  color:red;
  text-align:center;
  margin:1em 2em 0em 1em;
}
.collapsible {
  font-size:initial !important;
  padding:0.2em;
  background-color:transparent !important;
}

.highlight {
  color:#F40006;
  padding:0px 3px;
  margin:0px 5px;
  background-color:#FFFFFF;
  border:1px solid #666666;
}

.scrollPanel {
  /* border:1px #000000 solid; */
  /* height:auto; */
  /* width:950px; */
  /* max-height:230px; */
  /* overflow:auto; */
  /*overflow-y:scroll;*/
  margin-bottom:10px;
  border: 2px inset rgb(245,245,245);
}

/* .scrollPanel div {white-space:nowrap;} */

.scrollPanel button{
  width:auto;
  overflow:visible;
  padding:4px 10px 3px 7px; /* IE6 */
}
.scrollPanel button[type]{
  padding:0px 2px; /* Firefox */
  line-height:17px; /* Safari */
  margin: 3px 5px;
  background-color:#F5F5F5;
  border:1px solid #bbb;
  color:#555;
  cursor:pointer;
}

.scrollPanel button:hover {
  background-color:#e6efe2;
}

.scrollPanel *:first-child+html button[type]{
  padding:0px 2px; /* IE7 */
}

.scrollPanel button img{
  margin:0 3px -3px 0 !important;
  padding:0;
  border:none;
  width:16px;
  height:16px;
}

.yui-skin-sam .yui-dt-liner {
  white-space: normal;
}

.yui-skin-sam .yui-dt td.align-center { 
  text-align:center;
}

.yui-skin-sam .yui-dt td.tempResStyle { 
  font-weight: bold;
  font-size: 14px;
}

/* table striping */ 
.yui-skin-sam tr.yui-dt-even { background-color:#FFF; } /* white */ 
/* .yui-skin-sam tr.yui-dt-odd { background-color:#EDF5FF; } */ /* light blue */  
.yui-skin-sam tr.yui-dt-odd { background-color:#E0EAF2; }  /* light blue */  
/* .yui-skin-sam tr.yui-dt-odd { background-color:#DCE5EE; } */ /* light blue */  
.yui-skin-sam tr.yui-dt-even td.yui-dt-asc, 
/* .yui-skin-sam tr.yui-dt-even td.yui-dt-desc { background-color:#EDF5FF; } */ /* light blue sorted */ 
.yui-skin-sam tr.yui-dt-even td.yui-dt-desc { background-color:#EDF5FF; } /* light blue sorted */ 
.yui-skin-sam tr.yui-dt-odd td.yui-dt-asc, 
/* .yui-skin-sam tr.yui-dt-odd td.yui-dt-desc { background-color:#DBEAFF; } */ /* dark blue sorted */
.yui-skin-sam tr.yui-dt-odd td.yui-dt-desc { background-color:#D0DAE2; } /* dark blue sorted */

/* This is from skin.css line 14. This is being redeclared here since by CSS order of precedence,
between all equivalent styles for an element, the latest declaration wins. If this is not done, 
the asc/desc styles for odd/even rows declared above will override this  
'white text on dark blue background' style for 'selected' rows */
.yui-skin-sam tr.yui-dt-selected a,
.yui-skin-sam tr.yui-dt-selected td,
.yui-skin-sam tr.yui-dt-selected td.yui-dt-asc,
.yui-skin-sam tr.yui-dt-selected td.yui-dt-desc {
  background-color: #426FD9;   /* dark blue */
  color: #FFFFFF;           /* white */
  font-weight: bold;
}

.services {
}
.status {
  padding-top: 5px;
  color: #555;
  margin-left:0.2em;
}
.statusError {
  padding-top: 5px;
  color: red;
}
.statusWarning {
  color:darkorange;
}

.popup {
  /* min-width:300px; */
  box-shadow: 5px 5px 5px #666;
  display:none;
  cursor:pointer;
  background-color:transparent;
  padding:0px;
  padding-top:2px;
  border:none;
  border:1px solid #ccc;
}
.popupVisible {
  display:block;
  z-index:10000;
  position:absolute;
  x:200;
  y:200;
}
.popupHeader {
  color:white;
  font-weight:bold;
  font-size:0.9em;
  text-align:left;
  margin:0px;
  padding:5px;
  background-color:#777;
}
.popupLabel {
  display:inline-block;
}
.popupContent {
  padding:5px;
  background-color:white;
}
.popupCloseBtn {
  padding:0px 3px 0px 3px;
  margin:1px 1px 3px 5px;
  border:1px solid white;
  color:white;
  background:transparent;
  vertical-align:top;
  display:inline-block;
}
.popupCloseBtn:hover {
  margin:0px 0px 2px 4px;
  border:2px solid yellow;
}
.column {
  display:inline-block;
}
.listContainer {
  display:none;
  margin:3px;
  padding:3px;
}
.listContainerVisible {
  display:inline-block;
}
.yui-skin-sam .yui-panel .hd {
  background:linear-gradient(#778,#aab) !important;
  color:white !important;
}
.yui.skin-sam .yui-panel .bd {
  background:linear-gradient(#dde,#eef) !important;
}
.yui-skin-sam .yui-panel-container.shadow .underlay {
  top: 2px;
  left: 0px !important;
  right: 0px !important;
  bottom: 0px !important;
  opacity: .2 !important;
  filter: alpha(opacity=2) !important;
}
.yui-skin-sam .yui-panel-container {
  box-shadow: 5px 5px 10px rgba(0,0,0,0.7);
}
.dropDownMenu {
  position:fixed;
  z-index:1000000000;
}
.dropDownMenuContent {
  background:linear-gradient(to bottom right, #ddd, #fff); 
}
.dropDownMenuItem {
  text-align:left;
}
.dropDownMenuItem:hover {
  color:white;
  background:#666;
}
.disabledSelect {
  color:#ddd;
  border:1px solid #aaa;
  background-color: #aaa;
}

/* additional styles for font-awesome icons */
i.mapIcon {
  padding:5px;
}
.iconButton {
  font-size:1.2em;
  color:#555;
  float:right;
  text-decoration:none;
}
.iconButton:hover {
  color:black;
  cursor:pointer;
}
.iconButtonDisabled {
  font-size:1.2em;
  color:#aaa;
  float:right;
} 
.iconText {
  margin-right:10px;
  cursor:pointer;
}
.animationIconButton {
  border:none;
  background-color:transparent;
  cursor:default;
}

#testButton {
  background-color:orange;
  color:black;
  font-size:1.2em;
  margin:5px 5px 5px 20px;
  padding:5px;
  position:fixed;
  bottom:5px;
  z-index:99999;
  cursor:pointer;
  font-weight:bold;
  width:10em;
  border-radius:15px;
}

#testButton:hover {
  background-color:darkorange;
  color:blue;
}

a.facetedResultLink {
  padding:2px;
}
a.facetedResultLink:hover {
  color:#ff0 !important;
  background:#426fd9;
}
.yui-dt-rec .yui-dt-even .yui-dt-selected {
  background:red !important;
}
.yui-dt-rec .yui-dt-even .yui-dt-selected:hover {
  background:yellow !important;
}
.yui-skin-sam .yui-dt-list tr.yui-dt-selected td:hover {
  background:#326ed9;
}
.yui-overlay-hidden [id^="OpenLayers_Layer_Vector"] {
  display: none !important;
}

.progress-cursor * {
  cursor: progress !important;
}

div#earthdata-tophat2 {
  position:fixed !important;
  top:0 !important;
  width:100% !important;
}
#earthdata-tophat2#top-level-menu {
  position:relative !important;
  top:2px !important;
  left:150px !important;
  z-index:10012 !important;
}
#earthdat-tophat2 .tophat-submenu {
  position:relative !important;
  top:25px !important;
  z-index:5 !important;
}

#serviceSelect-button {
  border-radius:5px;
  background-color:white;
}

#serviceSelect-menu {
  column-count:3;
  padding:0.5em;
}

/* select with custom icons */
.ui-selectmenu-menu {
  box-shadow:5px 5px 5px rgba(0,0,0,0.3);
}
.ui-selectmenu-menu .ui-menu.customicons .ui-menu-item-wrapper {
  padding: 0.5em 0 0.5em 3em;
}
li.ui-menu-item {
  padding-bottom:0.2em;
}

.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover {
  border: 1px solid white !important;
  border-radius:3px;
  /*background: #007fff;*/
  background-color:#426fd9 !important;
  font-weight: normal;
  color: #ffffff;
}

.ui-selectmenu-menu .ui-menu.customicons .ui-menu-item .ui-icon .ui-select-note {
  height: 24px;
  width: 24px;
  top: 0.1em;
}

.ui-widget {
  font-size:1.1em !important;
}

.ui-icon {
  margin-top:0 !important;
  position:relative !important;
}
.ui-icon:before {
  content: "\25AE" !important;
  font-family: FontAwesome !important;
  left: -5px !important;
  position:absolute !important;
  top:0 !important;
}
/*
.ui-icon.video {
background: url("images/24-video-square.png") 0 0 no-repeat;
}
.ui-icon.podcast {
background: url("images/24-podcast-square.png") 0 0 no-repeat;
}
.ui-icon.rss {
background: url("images/24-rss-square.png") 0 0 no-repeat;
}
*/
.ui-service-note {
  color:darkorange;
  font-size:smaller;
}
.ui-service-note-active {
  color:orange;
}

.info-icon {
  font-size:2em !important;
  color:#5275ad !important;
  /* font-style: italic !important; */
  cursor:pointer;
  vertical-align:middle;
}
.info-icon:hover {
  color:#003366 !important;
}

.small-info-icon {
  color:#5275ad !important;
  vertical-align:middle;
}
.small-info-icon:hover {
  color:#003366 !important;
}

#serviceLink:focus {
  outline:1px solid lightgreen;
  outline-offset:8px;
}

/* select with CSS avatar icons */
/*
option.avatar {
background-repeat: no-repeat !important;
padding-left: 20px;
}
.avatar .ui-icon {
background-position: left top;
}
*/

.collapse-open {
  background-color:#003366 !important;
  color:#ddd !important;
}
.collapse-close:hover {
  background-color:#ccc !important;
}

.modal {
  display:none;
  position:fixed;
  z-index:1;
  left:0;
  top:0;
  width:100%;
  height:100%;
  overflow:auto;
  background-color:rgb(0,0,0); /* fallback in case of no alpha support */
  background-color:rgb(0,0,0,0.4);
}