/* Content of docs, blog and pages. The callout boxes are the Joomla template's
   (ja_purity_iv/local/css/custom.css), so imported articles look as before. */
.page-body img { max-width: 100%; height: auto; }
.page-body iframe { max-width: 100%; }
.page-body table { border-collapse: collapse; max-width: 100%; }
.page-body table td, .page-body table th { vertical-align: top; }
.page-body pre { background: #f6f8fa; border: 1px solid #d8dde3; border-radius: 6px; padding: 10px; overflow-x: auto; }
.page-body details { border: 1px solid #d8dde3; border-radius: 6px; padding: 8px 12px; margin: 12px 0; }
.page-body details summary { cursor: pointer; font-weight: 600; }
.page-body .table-wrap { overflow-x: auto; }

.box-hint { background: #fffae6 url("icons/favs2_32.f1a82cdac0d6.gif") 0 0 no-repeat; border-top: 1px solid #fae6be; border-bottom: 1px solid #fae6be; padding: 10px 10px 10px 40px; margin: 40px 0; text-align: justify; }
.box-note { background-color: #fafafa; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; padding: 10px; margin: 40px 0; text-align: justify; }
.box-warning { background: #fff0eb url("icons/warning-36.e0a9eb64bdbf.png") 0 0 no-repeat; border-top: 1px solid #ffd7cd; border-bottom: 1px solid #ffd7cd; padding: 10px 10px 10px 40px; margin: 40px 0; text-align: justify; }
.box-info { background: #f0f8ff url("icons/about_32.8f54b3e1aeca.gif") 0 0 no-repeat; border-top: 1px solid #d0e0ff; border-bottom: 1px solid #d0e0ff; padding: 10px 10px 10px 40px; margin: 40px 0; text-align: justify; }
.announce2 { border: 1px solid #e698a6; margin-left: 2rem; margin-right: 2rem; background-color: #fbe8eb; }
.fth4-ul, .fth-ol { display: grid; gap: 12px; }
.fth4-hint { background: #dbf8da; border-left: 12px solid #84d980; padding: 10px 10px 10px 40px; margin: 40px 0; text-align: justify; }
.fth4-info { background: #f0f8ff; border-top: 1px solid #d9eaff; border-bottom: 1px solid #d9eaff; border-left: 12px solid #c5d6e5; margin: 40px 0; padding: 10px 10px 10px 40px; text-align: justify; }
.fth4-note { background: #ededed; border-top: 1px solid #ddd; border-bottom: 1px solid #ddd; border-left: 12px solid #c5c5c5; margin: 40px 0; padding: 10px 10px 10px 40px; text-align: justify; }
.fth4-warning { background: #fff0eb; border-left: 12px solid #ff7b5e; padding: 10px 10px 10px 40px; margin: 40px 0; text-align: justify; }
.upto4 { background: #fffae6 url("icons/3to4_64.a11a6d8737e2.png") 0 0/55px 55px no-repeat; border-top: 4px solid #f2df74; border-bottom: 4px solid #f2df74; padding: 10px 10px 10px 65px; margin: 40px 0; text-align: justify; }
@media (max-width: 640px) {
    .box-hint, .box-warning, .box-info, .fth4-hint, .fth4-info, .fth4-note, .fth4-warning, .upto4 { text-align: left; padding-left: 16px; }
    .box-hint, .box-warning, .box-info, .upto4 { background-image: none; }
}