/* Conservative CSS for older Kindle browsers: no grid, variables or animations. */
* { box-sizing: border-box; }
html { background: #f1eee8; }
body { margin: 0; background: #f1eee8; color: #29252e; font-family: Georgia, "Times New Roman", serif; }
.page-wrap { max-width: 760px; margin: 0 auto; padding: 0 22px; }
.header { height: 58px; border-bottom: 1px solid #d8d2c9; display: block; line-height: 58px; font-family: Arial, sans-serif; }
.brand { color: #45366c; font-size: 12px; letter-spacing: 2px; text-decoration: none; font-weight: bold; }
.tag { float: right; color: #7b7480; font-size: 9px; letter-spacing: 1px; }
.intro { padding: 35px 0 23px; }
.kicker, .panel-kicker { color: #7258a6; font-family: Arial, sans-serif; font-size: 9px; letter-spacing: 1.5px; }
.intro h1 { margin: 13px 0; font-size: 34px; line-height: 1.2; font-weight: normal; }
.intro h1 span { color: #69528f; }
.intro > p:last-child { max-width: 570px; color: #625c65; font-size: 14px; line-height: 1.8; }
.panel { margin: 14px 0; padding: 20px; border: 1px solid #d9d2c9; border-radius: 8px; background: #faf8f3; }
.panel-heading { overflow: hidden; margin-bottom: 14px; }
.panel-heading h2, .next-steps h2 { margin: 5px 0 0; font-size: 19px; font-weight: normal; }
.panel-kicker { margin: 0; }
.page-count { float: right; margin-top: -25px; color: #6d6572; font-family: Arial, sans-serif; font-size: 11px; }
.sample-page { min-height: 185px; padding: 18px 19px; border: 1px solid #e5dfd5; background: #fffefa; line-height: 1.9; }
.sample-page h3 { margin: 3px 0 12px; font-size: 21px; font-weight: normal; }
.sample-page p { font-size: 15px; }
.sample-page .chapter-label { color: #887d8c; font-family: Arial, sans-serif; font-size: 9px; letter-spacing: 1px; }
.reader-controls { margin-top: 14px; overflow: hidden; }
button { min-height: 40px; padding: 0 15px; border: 1px solid #8b7a9e; border-radius: 5px; color: #4a3b5d; background: #f7f3fb; font-family: Arial, sans-serif; font-size: 12px; }
button:active { background: #e8e0f1; }
#prev-page { float: left; }
#next-page { float: right; }
.next-button { color: #fff; border-color: #69528f; background: #69528f; }
.save-status { margin: 12px 0 0; color: #6e6672; font-family: Arial, sans-serif; font-size: 10px; }
.small-button { float: right; min-height: 32px; margin-top: -4px; padding: 0 10px; }
.test-results { border-top: 1px solid #e3ddd4; }
.test-row { padding: 9px 2px; border-bottom: 1px solid #e9e4dc; overflow: hidden; font-family: Arial, sans-serif; font-size: 11px; }
.test-name { float: left; max-width: 72%; color: #514b55; }
.test-value { float: right; font-weight: bold; }
.pass { color: #32734d; }
.warn { color: #98702b; }
.fail { color: #a13d3d; }
.environment { margin-top: 16px; padding-top: 12px; border-top: 1px solid #e3ddd4; }
.environment-label { margin-top: 10px; color: #7b7281; font-family: Arial, sans-serif; font-size: 9px; letter-spacing: 1px; }
.environment p { overflow-wrap: anywhere; color: #58515d; font-family: Arial, sans-serif; font-size: 10px; line-height: 1.6; }
.next-steps p:last-child { color: #625c65; font-size: 13px; line-height: 1.8; }
.footer { margin-top: 25px; padding: 15px 0 22px; border-top: 1px solid #d8d2c9; color: #89818d; font-family: Arial, sans-serif; font-size: 9px; letter-spacing: 1px; overflow: hidden; }
.footer a { color: #69528f; text-decoration: none; }
.footer span { float: right; }
@media (max-width: 500px) {
  .page-wrap { padding: 0 13px; }
  .panel { padding: 15px; }
  .intro h1 { font-size: 30px; }
  .sample-page { padding: 14px; }
  .footer span { float: none; display: block; margin-top: 7px; }
}
