/* Copyright 2002-2012, University of Colorado */

/* Overlay behind dialogs that covers the entire document area. */
.dialog-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.33); /* makes everything behind the dialog look dimmed */
    z-index: 99; /* Make sure the dialog is in front of everything */
}

/* Prototype dialog -----------------------------------------------------------*/

/* the dialog */
.prototype-dialog {
    font-family: Arial;
    background: white;
    border: 2px solid #445;
    border-radius: 1em;
    margin: 6% 12%;
    max-height: 75%;
    /*box-shadow: 0 1em 2em rgba(0, 0, 0, 0.5);*/   /* breaks dialog on Nexus 7 */
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

/* title */
.prototype-dialog h3 {
    margin: 0 0 0.5em 0;
    padding: 0.4em 0.6em;
    text-align: center;
    background: #eee;
    border-bottom: 1px solid #444;
    border-top-left-radius: 1em;   /* Chrome doesn't round header edges without this */
    border-top-right-radius: 1em;
}

/* the body is everything except the title */
.prototype-dialog .body {
    margin: 1ex 1.6em;
    padding-bottom: 1ex;
}

.prototype-dialog .body .logo {
    float: left;
    margin-right: 1em;
}

.prototype-dialog .body p {
    overflow: hidden; /* prevents float at left from creating ragged edge */
}

/* row of buttons at the bottom */
.prototype-dialog .buttons {
    margin-top: 10px;
    text-align: center;
}

.prototype-dialog .buttons button {
    font-size: 125%;
    margin: 1em;
}