/**
 * Simplist CSS for server views
 */


/* DEFAULTS */

/* server-generated views (default) */
div#ServerView:empty {
    display: none;
}

    /* server-generated views with content (always prioritizes over front-end content) */
    div#ServerView:not(:empty) {
        position: fixed;
        z-index: 30;
        left: 0px;
        top: 0px;
        width: 100%;
        height: 100%;
		padding-bottom: 25px;
		overflow-y: auto;

        text-align: center;
        font-family: Roboto, Droid Sans, Calibri, Arial;

        background: rgb(235,235,235);
    }

        /* header */
        div#ServerView:not(:empty) > h1 {
            display: block;
			position: fixed;
			left: 0px;
			top: 0px;
			width: calc( 100% - 20px );
            margin: 0px 0px 15px 0px;
            padding: 10px;

            text-align: center;
            font-size: 16px;
            font-weight: bold;

            color: rgba(255,255,255,.75);
            text-shadow: 1px 1px 0px rgba(0,0,0,.5);
            background: rgb(0,137,176);
        }

        /* links */
        div#ServerView:not(:empty) a {
            text-decoration: none;
            color: #3a589e;
        }

		/* view content container */
		div#ServerView:not(:empty) > div#content {
			margin: 55px 0px 85px 0px;
		}

	        /* server view form */
	        div#ServerView:not(:empty) > div#content > form {
	            display: block;
                margin: auto;
	        }

	            /* error message container */
	            div#ServerView:not(:empty) > div#content > form > div#error:empty {
	                display: none;
	            }

	                /* error message container when error present */
	                div#ServerView:not(:empty) > div#content > form > div#error {
	                    display: block;
	                    margin: 0px auto 15px auto;

	                    text-align: center;
	                    font-size: 13px;
	                    font-weight: bold;
	                    color: red;
	                }

	            /* form input */
	            div#ServerView:not(:empty) > div#content > form > input {
	                display: block;
	                width: 80%;
	                margin: 5px auto 5px auto;
	                border: 0px;
	                padding: 5px;

	                text-align: center;
	                font-size: 15px;

	                background: rgba(255,255,255,.5);
	                border-bottom: 1px solid rgba(0,0,0,.35);
	            }

	                /* form input focused */
	                div#ServerView:not(:empty) > div#content > form > input:focus {
	                    background: white;
	                    border-bottom: 1px solid rgba(0,0,0,.75);
	                }

	            /* form input label */
	            div#ServerView:not(:empty) > div#content > form > label {
	                display: block;
	                text-align: center;
	                font-size: 12px;
	                font-weight: bold;
	                color: rgba(0,0,0,.65);

	                margin-bottom: 15px;
	            }

	                /* label for checkbox */
	                div#ServerView:not(:empty) > div#content > form > label.check {
	                    display: inline-block;
	                    background-color: rgba(0,0,0,.05);
	                    padding: 7px 10px 5px 10px;
	                    text-align: center;
	                    border: 1px solid rgba(0,0,0,.15);
	                }

	                    /* checkbox inside label */
	                    div#ServerView:not(:empty) > div#content > form > label.check > input[type="checkbox"],
	                    div#ServerView:not(:empty) > div#content > form > label.check > input[type="radio"] {
	                        margin: 0px 3px 2px 0px;
	                        vertical-align: middle;
	                    }

	                /* login button */
	                div#ServerView:not(:empty) > div#content > form > img[role="submit"] {
	                    display: block;
	                    width: 50px;
	                    height: auto;
	                    margin: 15px auto 25px auto;

	                    cursor: pointer;
	                }

    /* paragraphs */
    div#ServerView > div#content > p {
        margin: 20px;
        text-align: center;
        line-height: 1.25;

    }

	/* hide recaptcha by default */
	div#g-recaptcha {
		display: none;
	}

		/* hide recaptcha by default */
		div#g-recaptcha.show {
			display: block;
		}

		/* recaptcha container */
		div#g-recaptcha.show > div {
			margin: 0px auto auto auto;
			padding: 25px 0px 20px 0px;
		}

	/* share icons */
	div#ServerView a.fa.share {
		display: inline-block;
		margin: 10px;
		font-size: 40px;
		vertical-align: middle;
	}

		/* facebook */
		div#ServerView a.fa.share.fb {
			color: rgb(60,90,150);
		}

		/* twitter */
		div#ServerView a.fa.share.tw {
			color: rgb(30,160,240);
			font-size: 44px;
		}

		/* email */
		div#ServerView a.fa.share.email {
			color: rgb(111,200,255);
			font-size: 34px;
		}

/* adjust z-index for footer */
div#ServerView > footer {
	z-index: 30;
}

	/* user nav container */
	/* div#ServerView > nav#user {
		position: fixed;
		bottom: 0px;
		left: 0px;
		display: block;
		width: 100%;
		padding: 10px 0px 10px 0px;
		text-align: center;
		color: rgba(255,255,255,.5);

		background-color: rgb(0,175,225);
	} */
		/* user nav container links */
		/* div#ServerView > nav#user > a {
			color: rgba(255,255,255,.75);
			text-shadow: 1px 1px 0px rgba(0,0,0,.5);
		} */
