* {
    margin: 0;
    padding: 0;
}

body {
    margin: 20px;
    background-color: black;
}

#batimahq-wrapper {
    /* images are 1054x1600 px
     * Double width to fit two pages in an open magazine,
     * and scale down to 62% of the original size.
     */
    height: 992px;
    width: 1307px;
    position: relative;
    margin: auto auto;
}

#batimahq {
    height: 100%;
    width: 100%;
    background-color: #575454;
}

#greeter-wrapper {
    background-color: #575454;
}

#greeter {
    padding: 15px;
    margin: 30px;
    height: 870px;
    font-family: "Mate SC", serif;
    border: 2px solid black;
    background-color: white;
    position: absolute /* don't collapse margin */
}

#greeter h2 {
    margin: 0.8em 0;
}

#greeter p {
    text-align: justify;
}

#instructions {
    display: none;
}

#bookmark {
    height: 130px;
    width: 43px;
    z-index: 99;
    position: absolute;
    left: -10px;
    top: -7px;
    display: none;
}

#bookmark.on-bookmarked-page {
    -moz-transition: height 200ms;
    -o-transition: height 200ms;
    -webkit-transition: height 200ms;
    -ms-transition: height 200ms;
    height: 160px;
    width: 43px;
}

#bookmark.on-regular-page {
    -moz-transition: height 200ms;
    -o-transition: height 200ms;
    -webkit-transition: height 200ms;
    -ms-transition: height 200ms;
    height: 130px;
    width: 43px;
}

#batimahq img {
    background: url('bat.png') 50% 50% no-repeat, #6e6767;
}