/*@ body */

html, body {
  margin: 0;
  padding: 0;
}
body { 
  font: 62.5% Arial, Verdana, sans-serif; 
} 
#container {
  font-size: 1.2em;
  margin: 10px 2em;
}

/*@ header(s0 */

h1 { 
  font-size: 2.5em; 
  margin-bottom: 0; 
} 
h2 { 
  font-size: 1.3em; 
  margin-bottom: .5em; 
} 
h3 { 
  font-size: 1.1em; 
  margin-bottom: 0; 
} 

/*@ class */

.poem {
  margin: 0 5em;
}
.chapter {
  margin: 1em;
}

/*@ switcher */

#switcher {
  float: right;
  background-color: #ddd;
  border: 1px solid #000;
  margin: 10px;
  padding: 10px;
  font-size: .9em;
}
#switcher h3 {
  margin: 0;
}
#switcher .button {
  width: 100px;
  float: left;
  text-align: center;
  margin: 10px;
  padding: 10px;
  background-color: #fff;
  border-top: 3px solid #888;
  border-left: 3px solid #888;
  border-bottom: 3px solid #444;
  border-right: 3px solid #444;
}

/*@ header */

#header {
  clear: both;
}

/*@ widen & narrow */

body.large .chapter {
  font-size: 1.5em;
}

body.narrow .chapter {
  width: 400px;
}

/*@ select &switch */

.selected {
  font-weight: bold;
}

.hidden {
  display: none;
}

#switcher .hover {
  cursor: pointer;
  background-color: #afa;
}