.help-title, .help-text
{
  margin:0;
  padding:0;
}
.help-title
{
  font-weight:bold;
  padding-bottom:1rem;
}
.help-title p, .help-text p
{
  margin:0;
  padding:0;
}
.help-title i
{
  font-weight:bold;
  vertical-align:middle;
  font-size:1.5rem;
  color:black;
  margin-bottom:.3rem;
  padding-left:.2rem;
}
.help-text
{
  display:none;
  background-color:#c0c0c0;
  padding:1rem;
  border-radius:8px;
  font-size:1.5rem;
}
#popup-overlay
{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #000;
  filter:alpha(opacity=70);
  opacity: 0.7;
  z-index: 10000;
/*  display: none; */
  display: block;
}
#popup .a
{
  text-decoration: none;
}
#popup 
{
  width: 90%;
  margin:0 auto;
  top:0;left:0;left:0;right:0; /* need this to position auto for fixed element! */
  display: none;
  position: absolute;
  font-size:1.5rem;
  z-index: 10001;
}
#popup-content
{
  margin: 2rem auto;
  background: #f3f3f3;
  position: relative;
  z-index: 10002;
  padding: 1rem;
  border-radius: 5px;
  box-shadow: 0 2px 5px #000;
}
#popup-content p
{
  clear: both;
  color: #000;
  text-align: justify;
}
#popup-content #x
{
  float: right;
  width: 50px;
  top: -25px;
  left: 22px;
  position: relative;
}
#popup-content #x:hover,
#popup-close:hover,
#popup-click:hover
{
  cursor: pointer;
}
#popup-close
{
  font-size:1.5rem;
}
@media only screen and (max-width: 850px) 
{
  #popup, #popup-close
  {
    font-size:1.2rem;
  }
  .help-text, .help-title
  {
    font-size:1.2rem;
  }
}