body {
  background: url("https://sadhost.neocities.org/images/tiles/graybrickwall.gif");
  font-family: 'ProggyCleanTTSZBP', sans-serif;
  font-size:18px;
  color: black;
  }
  
a {
    color: #b829ff;
  }
  
h1 {
    color: white;
  text-shadow: 1px 1px 2px black, 0 0 25px pink, 0 0 5px darkblue;
}
  
  .float-right {
 float: right;
 width: 300px;
 height: 200px;
 background-color: red;
 margin: 0 0 0.5rem 0.5rem}
 
  .clearfix {
 overflow: auto;}
 
.tiny {
  font-size: 9px;
  margin: 0 auto;
  text-align: center;
  }
  

.wrapper {
  width: 750px;
  border: 4px inset darkblue;
  margin: 0 auto;
  top: 0px;
  }
  

.main {
  padding: 15px;
  margin: 0 auto;
  background: url("https://sadhost.neocities.org/images/tiles/page_background_animated_04.gif");
  }
  

img {
  max-width: 50%;
  height: auto;

  }
  
.sanae {
float:right;
}

  
/*For narrow screens*/
@media(max-width: 790px) {
  .wrapper {
    width: 95%;
    }
  .header h1, .header h2, .header h3 { /*Vertical centering gets wonky when the box is variable width*/
    margin: 20% 5% auto;
    }
  }  

/*Mobile compatibility*/
@media(orientation: portrait) {
  .wrapper {
    width: 95%;}
  .header {
    height:230px;
    }
  .header h1, .header h2, .header h3 {
    margin: 20% 3% auto;
    }
  }