/* 
 * Brianna Williams
 * Web Server Scripting
 * Program 3
 */


/*******************************************************************************
 * SITE STRUCTURE 
 ******************************************************************************/

/* BODY */
body {
    font-family:    sans-serif;
    background:     #eee;
}

#wrapper {
    width:          80%;
    margin:         2em auto;
    background:     white;
    border-radius:  10px; 
    -moz-border-radius:     10px; 
    -webkit-border-radius:  10px; 
    border:         3px double #777777;
    box-shadow:     0px 0px 5px #564E80;
    padding:        .5em;
}

/* HEADER */
header {
    border-radius:  10px; 
    -moz-border-radius:     10px; 
    -webkit-border-radius:  10px; 
    padding:        .5em;
    background-image: -ms-linear-gradient(top, #95CFFF 0%, #5C809E 100%);
    background-image: -moz-linear-gradient(top, #95CFFF 0%, #5C809E 100%);
    background-image: -o-linear-gradient(top, #95CFFF 0%, #5C809E 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #95CFFF), color-stop(100, #5C809E));
    background-image: -webkit-linear-gradient(top, #95CFFF 0%, #5C809E 100%);
    color:          white;
    text-align:     center;
    padding-bottom: 2em;
    margin-bottom:  0;
}
header h1 {
    font-size:      2.8em;
    margin-bottom:  0;
}
header h2 {
    font-weight:    normal;
    font-size:      1.2em;
}

/* NAV BARS */
aside.normal {
    float:          right;
    width:          20%;
    background:     #f7f7f7;
    font-size:      .85em;
    padding:        1em;
    margin:         .5em 0;
    border-radius:          5px; 
    -moz-border-radius:     5px; 
    -webkit-border-radius:  5px;
}
aside.admin {
    display:        none;
}
aside h4 {
    margin-bottom:  0;
}
aside ul {
    margin-top:     0;
    line-height:    1.5em;
}
aside li {
    list-style-type: none;
    text-indent:    -2em;
}

nav#admin {
    background:     #5C809E;
    background-image: -ms-linear-gradient(top, #5C809E 0%, #557691 100%);
    background-image: -moz-linear-gradient(top, #5C809E 0%, #557691 100%);
    background-image: -o-linear-gradient(top, #5C809E 0%, #557691 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #5C809E), color-stop(100, #557691));
    background-image: -webkit-linear-gradient(top, #5C809E 0%, #557691 100%);
    color:          white;
    width:          100%;
    margin:         0 auto;
    border-radius:          5px; 
    -moz-border-radius:     5px; 
    -webkit-border-radius:  5px; 
}
nav#admin ul {
    list-style-type: none;
    margin:         0 auto;
    padding:        .5em 0;
    text-align:     center;
}
nav#admin li {
    display:        inline;
    padding:        1em;
}
nav#admin li a {
    color:          white;
    text-decoration: none;
}
nav#admin li a:hover {
    text-decoration: underline;
}

/* ADMIN BUTTON DIVS */
.button {
    display:        inline-block;
    width:          12em;
    height:         4em;
    padding:        2.5em 1em 0 1em;
    color:          white;
    text-align:     center;
    margin:         1em;
    font-weight:    bold;
    
    border-radius:          10px; 
    -moz-border-radius:     10px; 
    -webkit-border-radius:  10px; 
    background-image: -ms-linear-gradient(top, #95CFFF 0%, #5C809E 100%);
    background-image: -moz-linear-gradient(top, #95CFFF 0%, #5C809E 100%);
    background-image: -o-linear-gradient(top, #95CFFF 0%, #5C809E 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #95CFFF), color-stop(100, #5C809E));
    background-image: -webkit-linear-gradient(top, #95CFFF 0%, #5C809E 100%);
}
a .button {
    color:          white;
    text-decoration: none;
}
a:hover .button {   /* #95CFFF */
    text-decoration: underline;
    background-image: -ms-linear-gradient(top, #5C809E 0%, #95CFFF 100%);
    background-image: -moz-linear-gradient(top, #5C809E 0%, #95CFFF 100%);
    background-image: -o-linear-gradient(top, #5C809E 0%, #95CFFF 100%);
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #5C809E), color-stop(100, #95CFFF));
    background-image: -webkit-linear-gradient(top, #5C809E 0%, #95CFFF 100%);
}

/* MAIN CONTENT */
main {
    padding:        .5em 2em;
    border-bottom:  1px dotted gray;
}
main.normal {
    padding-right:   27%;
}

.pageTitle {
    text-align:     center;
    color:          #2f4150;
}
.messageText {
    text-align:     center;
    color:          darkred;
    font-weight:    bold;
    font-size:      1em;
}

.rightLink {
    text-align:     right;
}

.floatLeft {
    float:          left;
    display:        block;
}
.floatRight {
    float:          right;
    display:        block;
}

/* FOOTER */
#mainClear {
    clear:          both;
}

footer {
    font-size:      .5em;
    text-align:     center;
    width:          70%;
    margin:         2em auto 0 auto;
}


/*******************************************************************************
 * FORMS
 ******************************************************************************/

label {
    float:          left;
    text-align:     right;
    padding-right:  1em;
}
label, input, #postDate, textarea, select, .block {
    min-width:      6em;
    margin-top:     .5em;
}
.block {
    display:        inline-block;
}
label {
    min-width:      11em;
}
input, textarea, .block {
    width:          65%;
}
form br {
    clear:          left;
}
#loginForm {
    width:          60%;
    margin:         0 auto;
}
#loginForm input {
    width:          12em;
}

#subBtn {
    width:          auto;
    height:         2.5em;
    display:        block;
    margin:         1em auto;
}
.antispam {
    display:        none;
}
.nameClick:hover { 
    text-decoration: underline;
    cursor:         pointer; 
    cursor:         hand;
}
.helpQ {
    background:     #eee;
    border:         1px solid black;
    border-radius:          15px;
    -moz-border-radius:     15px;
    -webkit-border-radius:  15px;
    font-family:    serif;
    font-weight:    bold;
    font-size:      1.15em;
    padding:        0 0.4em;
    cursor:         pointer;
}