
/* =========================================================
   MOILIILI JAPANESE CEMETERY
   Stylesheet: style_mjc.css
   Layout: centered, maximum 800px
   Records per page: 10 (controlled by mjc.asp)
   ========================================================= */

/* ---------- Page foundation ---------- */

* {
    box-sizing: border-box;
}

body {
    margin: 0;
    padding: 0;
    border: 0;
    background-color: #FFFFFF;
    background-image: url('images/bg.png');
    background-repeat: repeat-x;
    font-family: Verdana, Geneva, sans-serif;
    color: #333333;
}

hr {
    width: 100%;
    margin: 20px 0;
    border: 0;
    border-top: 1px solid #D9D9D9;
}

/* ---------- Shared legacy text classes ---------- */

.Sidebar_Intro {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 17px;
    color: #917A64;
    font-weight: normal;
    text-decoration: none;
    line-height: 20px;
}

.Spreadsheet_Ref {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 14px;
    color: #009966;
    font-weight: bold;
    text-decoration: none;
    line-height: 18px;
    background-color: #EAFDED;
}

.General_Body_Green {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 14px;
    color: #009966;
    font-weight: normal;
    text-decoration: none;
    line-height: 18px;
}

.reserve_status {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 12px;
    color: #0066FF;
    font-weight: normal;
    font-style: normal;
}

.reserve_status_no_italic {
    font-family: "Times New Roman", Times, serif;
    font-size: 12px;
    color: #0066FF;
    font-weight: normal;
    font-style: normal;
}

/* ---------- Shared page width ---------- */

.mjc-page-header,
.mjc-search-form,
.mjc-section-title,
.mjc-record-count,
.mjc-listing,
.mjc-navigation,
.mjc-person,
.mjc-no-results {
    width: 800px;
    max-width: 95%;
    margin-left: auto;
    margin-right: auto;
}

/* ---------- Page title ---------- */

.mjc-page-header {
    margin-top: 15px;
    margin-bottom: 20px;
    text-align: center;
}

/* ---------- Search form ---------- */

.mjc-search-form {
    margin-top: 0;
    margin-bottom: 18px;
    border: 0;
    border-collapse: separate;
    border-spacing: 5px;
    table-layout: auto;
}

.mjc-search-form td {
    padding: 5px;
    vertical-align: bottom;
}

.mjc-search-form label {
    display: block;
    float: none;
    width: auto;
    margin: 0 0 8px;
    color: #009966;
    font-family: Verdana, Geneva, sans-serif;
    font-size: 14px;
    font-weight: normal;
}

.mjc-search-form input[type="text"] {
    display: block;
    width: 100%;
    height: 40px;
    margin: 0;
    padding: 8px;
    border: 2px solid #D9DEC8;
    border-radius: 8px;
    background-color: #FFFFFF;
    color: #000000;
    font-family: Verdana, Geneva, sans-serif;
    font-size: 15px;
}

.mjc-search-form input[type="text"]:focus {
    outline: 1px solid #849159;
    border-color: #849159;
}

.mjc-search-form input[type="submit"] {
    margin: 0;
    padding: 9px 16px;
    border: 0;
    border-radius: 8px;
    background-color: #849159;
    color: #FFFFFF;
    font-family: Verdana, Geneva, sans-serif;
    font-size: 14px;
    cursor: pointer;
}

.mjc-search-form input[type="submit"]:hover {
    background-color: #6E7948;
}

/* ---------- Section headings ---------- */

.mjc-section-title {
    margin-top: 24px;
    margin-bottom: 12px;
    color: #009966;
    font-family: Verdana, Geneva, sans-serif;
    font-size: 16px;
    font-weight: bold;
    text-align: center;
}

/* ---------- Record count ---------- */

.mjc-record-count {
    margin-top: 12px;
    margin-bottom: 18px;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 13px;
    color: #000000;
    text-align: center;
}

/* ---------- Cemetery listing ---------- */

.mjc-listing {
    margin-top: 20px;
    margin-bottom: 20px;
    border: 0;
    border-collapse: collapse;
    table-layout: fixed;
    background-color: #FFFFFF;
    font-family: Verdana, Geneva, sans-serif;
    font-size: 12px;
    color: #333333;
}

.mjc-listing th,
.mjc-listing td {
    box-sizing: border-box;
    padding: 8px 6px;
    border: 1px solid #D9DEC8;
    text-align: left;
    vertical-align: top;
    overflow-wrap: break-word;
    word-wrap: break-word;
}

.mjc-listing th {
    background-color: #EAFDED;
    color: #009966;
    font-weight: bold;
}

.mjc-listing tr:nth-child(even) {
    background-color: #F8FBEF;
}

.mjc-listing tr:hover {
    background-color: #EAFDED;
}

/* ---------- Pagination ---------- */

.mjc-navigation {
    margin-top: 18px;
    margin-bottom: 28px;
    font-family: Verdana, Geneva, sans-serif;
    font-size: 12px;
    text-align: center;
}

.mjc-navigation a,
.mjc-navigation strong {
    display: inline-block;
    margin: 3px;
    padding: 7px 10px;
    border: 1px solid #D9DEC8;
    border-radius: 4px;
    text-decoration: none;
}

.mjc-navigation a {
    background-color: #FFFFFF;
    color: #009966;
}

.mjc-navigation a:hover {
    background-color: #EAFDED;
    color: #006644;
}

.mjc-navigation strong {
    border-color: #849159;
    background-color: #849159;
    color: #FFFFFF;
}

/* ---------- Full cemetery record ---------- */

.mjc-person {
    margin-top: 24px;
    margin-bottom: 24px;
    border: 1px solid #D9DEC8;
    border-collapse: collapse;
    background-color: #FFFFFF;
    font-family: Verdana, Geneva, sans-serif;
    font-size: 13px;
    color: #333333;
}

.mjc-person th,
.mjc-person td {
    padding: 9px;
    border: 1px solid #D9DEC8;
    text-align: left;
    vertical-align: top;
    overflow-wrap: anywhere;
}

.mjc-person th {
    width: 190px;
    background-color: #EAFDED;
    color: #006644;
    font-weight: bold;
}

/* ---------- Headstone photographs ---------- */

.mjc-photo {
    display: block;
    max-width: 100%;
    max-height: 600px;
    width: auto;
    height: auto;
    padding: 4px;
    border: 1px solid #D9DEC8;
    background-color: #FFFFFF;
}

/* ---------- Search messages ---------- */

.mjc-no-results {
    margin-top: 28px;
    margin-bottom: 28px;
    color: #000000;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 14px;
    font-weight: bold;
    text-align: center;
}

/* ---------- Smaller screens ---------- */

@media screen and (max-width: 700px) {
    .mjc-page-header,
    .mjc-search-form,
    .mjc-section-title,
    .mjc-record-count,
    .mjc-listing,
    .mjc-navigation,
    .mjc-person,
    .mjc-no-results {
        width: 95%;
        max-width: 95%;
    }

    .mjc-listing {
        font-size: 11px;
    }

    .mjc-listing th,
    .mjc-listing td {
        padding: 5px 4px;
    }

    .mjc-search-form input[type="text"] {
        font-size: 14px;
    }

    .mjc-person th {
        width: 35%;
    }
}
