.header {
            text-align: center;
        }
        .header h1 {
            font-size: 200%;
            margin-top: 30px;
       }
        .header p {
            font-size: 14px;
       }
        canvas {
        vertical-align:top;
        }

        .login 
{
  box-shadow: -15px 15px 15px rgba(6, 17, 47, 0.5);
  opacity: 1;

  -webkit-transition-timing-function: cubic-bezier(0.68, -0.25, 0.265, 0.85);
  -webkit-transition-property: -webkit-transform,opacity,box-shadow,top,left;
          transition-property: transform,opacity,box-shadow,top,left;
  -webkit-transition-duration: .5s;
          transition-duration: .5s;
  -webkit-transform-origin: 161px 100%;
      -ms-transform-origin: 161px 100%;
          transform-origin: 161px 100%;
  -webkit-transform: rotateX(0deg);
          transform: rotateX(0deg);
  position: relative;


  background-color: rgba(160,160,160,0.3);

 padding:50px;

  /*background: #35394a;*/
  /* Old browsers */
  /* FF3.6+ */
  /*background: -webkit-gradient(linear, left bottom, right top, color-stop(0%, #35394a), color-stop(100%, rgb(0, 0, 0)));*/
  /* Chrome,Safari4+ */
  /*background: -webkit-linear-gradient(230deg, rgba(53, 57, 74, 0) 0%, rgb(0, 0, 0) 100%);*/
  /* Chrome10+,Safari5.1+ */
  /* Opera 11.10+ */
  /* IE10+ */
  /*background: linear-gradient(230deg, rgba(53, 57, 74, 0) 0%, rgb(0, 0, 0) 100%);*/
  /* W3C */
  /*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='rgba(53, 57, 74, 0)', endColorstr='rgb(0, 0, 0)',GradientType=1 );*/
  /* IE6-9 fallback on horizontal gradient */
}









#starsBox {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  /*background: rgba(0, 0, 0, 0.75);
  opacity: .85;*/
}
#starsBox span {
  display: inline-block;
  width: auto;
  position: absolute;
  border-radius: 100%;
  transition: 300s linear;
}

#starsBox p {
  position: fixed;
  top: 50%;
  left: 0;
  right: 0;
  text-align: center;
  transform: translateY(-50%);
  font-size: 40px;
  font-weight: 900;
  color: white;
  text-shadow: 0 0 50px black;
  text-transform: uppercase;
  font-family: 'Roboto','Helvetica','Arial',sans-serif;
  letter-spacing: 5px;
}
#starsBox p > span {
  display: block;
  font-size: 12px;
  color: #bdc3c7;
  margin-top: 30px;
  font-weight: 100;
  text-shadow: 0 0 50px black;
  letter-spacing: 3px;
}
#starsBox p > span > a {
  font-weight: 700;
  text-decoration: none;
  color: #d64541;
  padding-bottom: 2px;
  border-bottom: 0px solid #d64541;
  transition: 0.5s;
}
#starsBox p > span > a:hover {
  padding-bottom: 5px;
  border-bottom: 2px solid #d64541;
}


@media screen and (max-width: 750px) {
    hr {
        margin-bottom:0px;
        
    }
    .header {
        background-color: rgba(160,160,160,0.3);
    }
}