#station-panel{
  top: 0;
  right: 0;
  width: 330px;
}

html[lang="fr"] #station-panel{
  width: 360px;
}

#station-panel .footer-sticky{
  padding: 0;
}

#scroll-top{
  right: 0;
  position: absolute;
}

#station-panel .footer-sticky span{
  padding: 15px;
}

#station-panel .footer-sticky span:hover,
#station-panel .footer-sticky span:focus{
  cursor: pointer;
  color: #2E5274;
}

#station-panel-header .badge{
  margin: 15px;
}

#station-panel-body{
  font-size: 87%;
  padding: 10px 10px 10px 5px;
}

#station-panel-body .section[data-state="hide"]{
  display: none;
}

#station-panel-body .section[data-state="show"]{
  display: auto;
}

#station-panel-body .station-name{
  background-color: #2E5274;
  padding: 10px 40px 10px 10px;
  color: #FFF;
  position: relative;
}

#station-panel-body .station-name:hover,
#station-panel-body .station-name:focus{
  cursor: pointer;
  color: #CCC;
}

#station-panel-body .station-name span{
  position: absolute;
  top: 0;
  right: 0;
  padding: 10px;
}

#station-panel-body .station-name h3{
  margin: 0;
}

#station-panel-body .station-metadata{
  font-size: 75%;
  margin-top: 10px;
}

#station-panel-body .station-metadata[data-state="hide"]{
  display: none;
}

#station-panel-body .station-metadata[data-state="show"]{
  display: block;
}

#station-panel-body .station-metadata dl{
  display: flex;
  flex-flow: row;
  flex-wrap: wrap;
  width: 100%;
  overflow: visible;
  margin-bottom: 0;
}

#station-panel-body .station-metadata dt, #station-panel-body .station-metadata dd{
  margin-bottom: 0;
}

#station-panel-body .station-metadata dt{
  flex: 0 0 45%;
  text-overflow: ellipsis;
  overflow: hidden;
}

#station-panel-body .station-metadata dd{
  flex: 0 0 55%;
  margin-left: auto;
  text-align: right;
  text-overflow: ellipsis;
  overflow: hidden;
}

#station-panel-body .station-metadata *:last-child{
  margin-bottom: 0;
}

#station-panel-body .proximity{
  font-size: 75%;
  margin-top: 5px;
  margin-bottom: -5px;
  border-radius: 15px;
  border: 1px solid #26374A;
  color: #26374A;
  padding: 2.5px 10px;
}

#station-panel-body .proximity dl{
  display: flex;
  flex-flow: row;
  flex-wrap: wrap;
  width: 100%;
  overflow: visible;
  margin-bottom: 0;
}

#station-panel-body .proximity dt, #station-panel-body .proximity dd{
  margin-bottom: 0;
}

#station-panel-body .proximity dt{
  flex: 0 0 75%;
  text-overflow: ellipsis;
  overflow: hidden;
  text-decoration: underline dotted;
}

#station-panel-body .proximity dd{
  flex: 0 0 25%;
  margin-left: auto;
  text-align: right;
  text-overflow: ellipsis;
  overflow: hidden;
}

#station-panel-body .links{
  padding: 10px 0;
}

.station-panel-table{
  font-size: 87%;
}

.station-panel-table tr[data-type="heading"]:hover,
.station-panel-table tr[data-type="heading"]:focus{
  cursor: pointer;
}

.station-panel-table tr[data-type="heading"]:hover span,
.station-panel-table tr[data-type="heading"]:focus span{
  color: #666;
}

.station-panel-table tr[data-type="details"][data-state="closed"]{
  display: none;
}

.station-panel-table tr[data-type="details"][data-state="open"]{
  display: auto;
}

.report-link.btn-block{
  white-space: nowrap;
}

/* help section */
.station-name-help{
  background-color: #2E5274;
  padding: 10px 40px 10px 10px;
  color: #FFF;
  position: relative;
}

.station-name-help:hover,
.station-name-help:focus{
  cursor: pointer;
  color: #CCC;
}

.station-name-help span{
  position: absolute;
  top: 0;
  right: 0;
  padding: 10px;
}

.station-name-help .h5{
  margin: 0;
}

.station-metadata-help{
  font-size: 75%;
  margin-top: 10px;
}

.station-metadata-help dl{
  display: flex;
  flex-flow: row;
  flex-wrap: wrap;
  width: 100%;
  overflow: visible;
  margin-bottom: 0;
}

.station-metadata-help dt, .station-metadata-help dd{
  margin-bottom: 0;
}

.station-metadata-help dt{
  flex: 0 0 45%;
  text-overflow: ellipsis;
  overflow: hidden;
}

.station-metadata-help dd{
  flex: 0 0 55%;
  margin-left: auto;
  text-align: right;
  text-overflow: ellipsis;
  overflow: hidden;
}

.station-metadata-help *:last-child{
  margin-bottom: 0;
}
