<div class="dot"></div>
<h1>

</h1>
<h2>
  PIP Network
</h2>

@import "compass/css3";


$lightgrey: rgba(100,100,105,1);
$darkgrey: rgba(0,0,10,1);
$limit: 98%;
$shape: ellipse;

html {
  min-height: 100%;
  background: $lightgrey;
  background: -moz-radial-gradient(center, $shape cover, $lightgrey 0%, $darkgrey $limit);
  background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,$lightgrey), color-stop($limit,$darkgrey));
  background: -webkit-radial-gradient(center, $shape cover, $lightgrey 0%,$darkgrey $limit);
  background: -o-radial-gradient(center, $shape cover, $lightgrey 0%,$darkgrey $limit);
  background: -ms-radial-gradient(center, $shape cover, $lightgrey 0%,$darkgrey $limit);
  background: radial-gradient($shape at center, $lightgrey 0%,$darkgrey $limit);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='$lightgrey', endColorstr='$darkgrey',GradientType=1 );
  background-size: cover;
}

.dot {
  z-index:-99;
  position:fixed;
  left:0;
  top:0;
  bottom:0;
  right:0;
  background-image: -webkit-repeating-linear-gradient(135deg, rgba(0,0,0,.7), rgba(0,0,0,.7) 2px, transparent 2px, transparent 2px, rgba(0,0,0,.3) 3px);
  background-image: -moz-repeating-linear-gradient(135deg, rgba(0,0,0,.3), rgba(0,0,0,.3) 1px, transparent 2px, transparent 2px, rgba(0,0,0,.3) 3px);
  background-image: -o-repeating-linear-gradient(135deg, rgba(0,0,0,.3), rgba(0,0,0,.3) 1px, transparent 2px, transparent 2px, rgba(0,0,0,.3) 3px);
  background-image: repeating-linear-gradient(135deg, rgba(0,0,0,.3), rgba(0,0,0,.3) 1px, transparent 2px, transparent 2px, rgba(0,0,0,.3) 3px);
  -webkit-background-size: 4px 4px;
  -moz-background-size: 4px 4px;
  background-size: 4px 4px;
  }

h2 {
  background:rgba(50,50,50,.5);
  padding:20px;
  color:#fff;
  font-size:2em;
  margin:0 auto;
  margin-top:90px;
  width:800px;
  text-align:center;
  box-shadow:inset 0px 0px 5px black;
  border-radius:10px;

  
}