body { margin: 0; padding: 0.25em 0.5em; font: 14px Helvetica Neue, Helvetica, sans-serif; color: #333; } h2, h3 { margin: 1em 0; font-family: inherit; } h2 { font-size: 18px; } h3 { font-size: 16px; } a { text-decoration: none; } button { padding: 7px; font: inherit; margin: 0; background: dimgray; color: #eee; border-radius: 5px; border: 1px solid dimgray; cursor: pointer; -webkit-transition: 0.2s background, 0.2s border, 0.2s box-shadow; transition: 0.2s background, 0.2s border, 0.2s box-shadow; } button:hover { border-color: dodgerblue; background: dodgerblue; box-shadow: 0 0 15px rgba(0,0,0,0.4); border-radius: 0; color: white; } label { cursor: pointer; } div > p:first-child { margin-top: 0; } div > p:last-child { margin-bottom: 0; } .para { width: 40em; } button.whatisthis { margin: 0 0 0 8px; border: 0; padding: 0 0 4px 0; width: 16px; height: 16px; background: url('../img/help16.png') no-repeat; cursor: pointer; opacity: 0.5; vertical-align: middle; -webkit-transition: 0.2s background, 0.2s border-color, 0.2s box-shadow, 0.2s opacity; transition: 0.2s background, 0.2s border-color, 0.2s box-shadow, 0.2s opacity; } button.whatisthis:hover { opacity: 1.0; } .whatisthis-expandable { margin: 0.5em 0 1em 1.25em; padding: 0.5em; display: none; border: 1px dotted black; background-color: #F8F8F8; font-size: 13px; } .whatisthis-expandable > p { margin-top: 1em; margin-bottom: 0; } .whatisthis-expandable > p:first-child { margin-top: 0; } .whatisthis-expandable.whatisthis-expanded { display: block; } .warn { margin: 0; padding: 5px; background-color: #FEDAE0; }