@font-face {
  font-family: 'Roboto Slab';
  src: url(/fonts/RobotoSlab-Regular.ttf);
}
@font-face {
  font-family: Gate-Street;
  src: url(/fonts/Gate-Street.ttf);
}
body {
  background-image: url('/observatory/observatory-graphics/nightsky.jpg');
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: center;
  background-size: cover;  
  color: white;
  font-family: 'Roboto Slab';
  line-height:1.2;
}
h3 {
  text-align:center;
  font-family: Gate-Street;
  font-size: 30px;
  margin-bottom:15px;
  margin-top:15px;
}
h2 {
  font-family: Gate-Street;
  margin-bottom:10px;
  font-size: 40px;
}
h1 {
  font-size: 100px;
  text-align: center;
  font-family: Gate-Street;
  margin-bottom: 10px;
  margin-top:35px;
}
p {
  margin-top:0;
}

.container {
  margin:10px;
  display:grid;
  grid-template-columns: 800px, 500px;
}  

.bodydiv {
  margin-top:0;
  margin-bottom:20px;
  width:765px;
  padding: 15px 15px 0 25px;
  font-size:15px;
}

.constellation {
  float:left;
  height:90px;
  margin-left:25px;
  margin-right:15px;
  transition:0.3s ease;
  }
.constellation:hover {
  transform:scale(1.1);
}
.tsukasa {
  width:340px;
  position: fixed;
  top:10px;
  left:860px;
}
.paper {
  width:370px;
  height:300px;
  position:fixed;
  left:880px;
  top:380px;
  background-image: url('/observatory/observatory-graphics/paper.png');
  background-size:420px 360px;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-position: 840px 360px;
}
.welcome {
  width:290px;
  height:250px;
  margin:40px;
  color:#00001f;
  font-size:15px;
  font-family: 'Roboto Slab';
  overflow:auto;
  line-height:1.3;
  }

.bar {
  height:20px;
  width:680px;
  margin:auto;
  line-height:20px;
  border-radius:0 0 3px 3px;
  font-size:12px;
  text-align:center;
  color:#fff;
  font-family: 'Roboto Slab';
}