/* ++ general */
body {
    font-size: 12pt;
    font-family: sans-serif;
    color:#404040;
}

.brand, a.back {
    font-family: "Cinzel", "Georgia", "Liberation Serif", "Times New Roman", serif;
}

a.back:hover {
    background-color: #c0c0c0;
    text-decoration: none;
    color:#333;
}

/* Keep inputs contained within container */
input {
    box-sizing:border-box;
}

a {
    color: #404040;
}

body {
    margin:0;
}

h1 {
    font-size: 13pt;
    color: #006989;
}

div.bodyText h1.closed {
    font-size: 18pt;
    color: #ff8000;
}

div.bodyText h3.closed {
    font-size: 12pt;
    color: #ff8000;
}

h2 {
    font-size: 13pt;
    color: #006989;
}

h3 {
    font-size: 12pt;
}

div.outer {
    max-width: 1110px;
    margin: 0 auto;
    position: relative;

}

div.header {
    position: relative;
}


div.header:after {
    content: '';
    display: block;
    clear: both;
}


div.burger {
    margin:4pt;
    position: absolute;
    display:none;
}

div.logo {
    margin: 0 auto;
    text-align: center;
    width:43%; /* natural image width = 43% of (max-width)1300 = 559px */
}

div.logo:after {
    content: '';
    display: block;
    clear: both;
}

div.logo img {
    width:100%;
}

div.social {
}

div.social img {
    display:inline-block;
    margin:7px;
}

div.h-contact {
    position: absolute;
    right: 6pt;
    top: 6pt;
}

div.menu {
    text-align: center;
    margin: 6pt 0;
}

div.menu:after {
    content: '';
    display: block;
    clear: both;
}
.nav ul {
    list-style-type: none;
    /*margin-top: -17px;*/
    color: #ffffff;
    font-size:15px;
    margin:0;
    padding:0;
}


.nav ul li {
    list-style-type: none;
    display: inline;
    margin:0;
}

.nav ul li a {
    margin: 0px 0px 0px 2px;
    padding: 5px 7px 4px 7px;
    text-decoration: none;
    color:#303030;
    font-size: 12pt;
}

.nav li a.current {
    text-decoration: underline;
}

.nav li a.current:hover {
    /*background-color: #C43614;*/
}

.nav ul li a:hover {
    background-color: #c0c0c0;
    text-decoration: none;
    color:#333;
}

.sub-nav ul li a:hover {
    background-color: #c9fff9;
}

.nav ul.footer li a:hover {
    background-color: #ffffff;
    text-decoration: none;
    color: #202020;
}

div.pageStats {
    width: 80%;
    padding:5px;
    margin:5px auto;
    border:1px solid #c0c0c0;
}
div.pageBanner {
    padding: 0;
    background: url('/image/banner/P1060650.jpg') no-repeat;
    background-size: 100%;
    position: relative;
}

div.pageBanner img {
    width: 100%;
}

div.pageBanner:after {
    content: '';
    display: block;
    clear: both;
}

div.bannerCaption {
    text-align: right;
    margin-right:6pt;
    font-size:8pt;
    color: #505050;
}

div.bannerOverlay {
    position: absolute;
    text-align: center;
    width:100%;
    color: #ffffff;
}

div.bannerOverlay h2 {
    margin-top:2%;
    font-size:2rem;
    margin-bottom:7%;
    color: #816F5B;
}

div.bannerOverlay a {
    color: #ffffff;
}

div.bannerOverlay h3 {
    display:inline;
    font-size:1.5rem;
    border:2px solid #ffffff;
    padding: 6pt;
}

div.bannerOverlay a:hover {
    color: #ffffff;
}

div.bannerOverlay a:hover h3 {
    border:2px solid #816F5B;
}

div.pageBody:after {
    content: '';
    display: block;
    clear: both;
}

div.bodyText {
    margin: 6pt 0;
    padding: 6pt;
}

div.bodyText h1 {
    color: #006989;
}

p.website {
    /*color: #006989;*/
}

.center {
    text-align: center;
}

div.footer {
    background-color: #e0e0e0;
    margin-top:40pt;
    padding: 6pt;
}

div.footer-logo {
    margin: 0 auto;
    text-align: center;
    width:23%; /* natural image width = 23% of (max-width)1300 = 299px */
}

div.footer-logo:after {
    content: '';
    display: block;
    clear: both;
}

div.footer-logo img {
    width:100%;
}

div.f-contact {
    text-align: center;
}

div.f-contact p {
    margin: 0;
    padding: 0;
}


div.indent {
    margin-left:3rem;
}

div.blockInn {
    width: 50%;
    float: left;
    text-align: center;
    font-size:20pt;
    font-weight: bold;
    padding-top:30pt;
    padding-bottom:30pt;
}

div.blockInn:hover {
    background-color: #C43614;
    color:#ffffff;
}

div.innerOne {
    background-color: #006989;
    color: #ffffff;
}

div.innerTwo {
    background-color: #FFD96C;
}

div.innerThree {
    background-color: #FFD96C;
}

div.innerFour {
    background-color: #006989;
    color: #ffffff;
}

div.isbn a {
    padding: 3pt;
}

div.isbn a:hover {
    background-color: #ffbf00;
}

a.button {
    padding:2pt 0;
    text-align: center;
    text-decoration: none;
}

a.top-link {
    padding:2pt 0;
    text-align: center;
    text-decoration: underline;
}

/* ++ contact */
p.addr {
    margin:0 0 2pt 0;
}

div.addr {
    margin:3rem;
}
/* -- contact */

table.font td {
    border: 1px solid #006989;
    padding: 3pt;
}

.para li {
    margin-bottom: 6pt;
}

div.look-inside {
    border: 1px solid #c0c0c0;
    width: 214px;
    height: 214px;
    text-align: center;
    box-sizing:border-box;
    background: url('/project/bp10101/look-inside.png') no-repeat;
    background-size: 212px;
}

div.look-inside:hover {
    background: url('/project/bp10101/look-inside-hover.png') no-repeat;
}

div.preview {
    border: 1px solid #c0c0c0;
    margin: 20px auto;
    width: 1000px;
    box-sizing:border-box;
}

div.preview img {
    width:100%;
    display:block;
}

@media only screen and (max-width: 1010px) {
    /* Previews are 1000 wide, below, that, scale */
    div.preview {
        width: auto;
        margin: 20px 5px;
    }
}

@media only screen and (max-width: 800px) {
    /* @800, keep the footer bear the same size */
    div.footer-logo {
        margin: 0 auto;
        text-align: center;
        width:184px; /* = 23% of 800 */
    }
}

@media only screen and (max-width: 600px) {
    div.logo {
        width:244px;
    }

    div.h-contact {
        position: relative;
        text-align: center;
        right: auto;
        top: 0;
    }

    div.burger {
        display:block;
    }

    .nav ul {
        padding:0;
        width:100%;
    }

    .accOpen {
        display:block;
    }

    .accClosed {
        display:none;
    }

    .nav ul li {
        width:100%;
        display: block;
        padding: 2px 0px 2px 0px;
    }

    .nav ul li a {
        float:none;
        display:block;
        margin: 0;
    }

    div.bannerOverlay h2 {
        margin-top: 5%;
        font-size:1.5rem;
        margin-bottom:5%;
    }

    div.bannerOverlay h3 {
        font-size:1rem;
    }

    div.blockInn {
        width: 100%;
    }

    div.innerThree {
        background-color: #006989;
        color: #ffffff;
    }

    div.innerFour {
        background-color: #FFD96C;
        color: inherit;
    }

}

@media only screen and (max-width: 400px) {
    div.bannerOverlay h2 {
        margin-top: 4%;
        margin-bottom:4%;
    }

    img.illus {
        margin:5px 0;
        width:100%;
    }

}