/* Stylesheet for CSS for photo album lists */

.entryLabel {
    background-color: #3388DD; border: solid thin black;
    border-bottom-width: 0;
    vertical-align: top; padding: .4em 10px;
    font-size: 10pt; text-align: left; width: 10em;
    margin: 0 0 0 0;
    width: 10em;
    flex: 0 0 10em;
}

.instructions {
    background-color: #3388DD; border: solid thin black;
    vertical-align: top; padding: .4em 12px;
    font-size: 10pt; text-align: left; width: 12em;
    margin: 0 0 0 0;
    align-self: flex-end;
    width: auto;
}

.moreData {
    background-color: #3388DD; border: solid thin black;
    border-bottom-width: 0;
    border-left-width: 0;
    vertical-align: top; padding: .4em 10px;
    font-size: 10pt; text-align: left; width: 10em;
    margin: 0 0 0 0;
    align-self: flex-end;
    width: auto;
}

.entryLink:hover {
    background-color: #EEDD22
}

.pagLink {
    text-decoration-line: none !important;
    font-weight: bold;
    color: #4444F0;
}

.pagLink:hover {
    background-color: #EEDD22;
}

.centerbox a:hover {
    /* color: #44CCCC;*/
    background-color: #EEDD22;
}

summary {
    cursor: pointer;
    padding: 5px;
}

summary:hover {
    /* color: #44CCCC;*/
    background-color: #EEDD22;
}

.entryBody {
    background-color: #67BEFB; border: solid thin black;
    font-size: 10pt; text-align: left; 
    padding: .4em 10px;
    margin: 0 0 .8em 0;
    list-style-type: none;
}

.flexcontainer {
    display: flex;
}

/* needed so .box can be centered with magin: 0 auto */
body { width: 100%; }

.box {
    max-width: 700px; border: solid black;
    padding: 0.5em;  
    background-color: #379ADB; overflow: hidden; 
    text-align: left;
    margin: 0 auto;
}

.centerbox {
    display: grid;
    justify-content: center;
}

.text-center {
    text-align: center;
}

.paginate {
    background-color: #ffb3de;
    text-align: center;
    border: solid thin black;
    padding: 5px;
    font-size: 10pt;
}

.spec {
    background-color: #379ADB;
    border: solid thin black;
    padding: 5px;
}

.invisible {
    display: none;
}