/** Common Elements **/
body { background-color: #fff; font: 1em Helvetica, Arial, Verdana, sans-serif; text-align: center; }


/** Login Page **/
#login form div.field label { margin: 0; padding: 3px 0 0 0px; text-align: left; display: block; color: #555555; }
#login form div.field input { background: none repeat scroll 0 0 #FBFBFB; border: 1px solid #E5E5E5; box-shadow: 1px 1px 2px rgba(200, 200, 200, 0.2) inset; color: #555555; font-size: 24px; font-weight: 200; line-height: 1; margin-bottom: 16px; margin-right: 6px; margin-top: 2px; outline: 0 none; padding: 3px; width: 100%; }
#login form div.submit { clear: both; margin: 0; text-align: center; }
#login .error { text-align: center; color: red; font-weight: bold; margin: -5px 0 5px 0; padding: 0; }

#login form div.submit input {
	background: -webkit-gradient(linear, left top, left 25, from(#349d39), color-stop(4%, #2d8232), to(#349d39));
	background: -moz-linear-gradient(center top , #349d39 0px, #2d9232 48%, #349d31 49%, #2d8232 100%) repeat scroll 0 0;
	background-color: #349d39;
	border: 1px solid #697379; border-radius: 8px 8px 8px 8px; box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.25); color: #e2ecf2; font-size: 1.5em; margin: 12px auto 0px; padding: 10px 6px; text-align: center; text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.2); width: 101%; }
#login form div.submit input:focus, #login form div.submit input:hover { border: 1px solid #188a1d;
	background: -webkit-gradient(linear, left top, left 25, from(#22af29), color-stop(4%, #1d9e23), to(#22af29));
	background: -moz-linear-gradient(center top , #22af29 0px, #1d9e23 48%, #22af25 49%, #1d9e00 100%) repeat scroll 0 0;
	background-color: #22af29; }

#login h1 { display: none; }
#login p.error {  width: auto; background-color: #f00; padding: 12px; color: #fff; font-weight: bold; text-align: center; }

#document {
	padding: 0;
	margin: 0;
	max-width: 770px;
	font-size: 80%;
}
#document p { margin: 0 0 1em 0; padding: 0; clear: left; }
#document td, #document th, #document .result, #document div { line-height: 1.4em; }
#document tr.error td.checkbox { background-color: #f00; color: #fff; }
#document tr.error input { border: 2px solid #600; }
#document tr.error td, #document tr.error th { font-weight: bold; }
#document tr#agree td { padding-top: 24px; }
#document tr.error th label, #document tr.error#agree td strong { color: #c00; }
#document td.additional { font-size: 85%; background-color: #fafafa; border-bottom: 1px solid #ccc; padding: 5px; }
#document form#confirmation { margin: 1em 0 5em 0; width: 100%; border: 1px solid #690; background-color: #F0FFF1; text-align: center; }
#document div#agreement { margin: 1em 0 5em 0; width: 100%; text-align: left; }
#document form#confirmation { padding: 25px; width: 100%; }
#document form#confirmation #submit { font-size: 150%; padding: 10px; margin: 15px; }
#document p.error { width: 100%; background-color: #f00; margin-top: 12px; padding: 12px; color: #fff; font-weight: bold; text-align: center; }
#document .resultbox { margin: 1em 0 1em 0; width: 100%; padding: 12px; font-size: 150%; border: 1px solid #690; background-color: #F0FFF1; }
#document p.result { width: 100%; background-color: #690; margin-top: 12px; padding: 12px; color: #fff; font-weight: bold; text-align: center; }
#document form#changeAgreements { width: 100%; font-size: 150%; line-height: 1.4em; padding: 9px; border-top: 1px solid #690; border-bottom: 1px solid #690; background-color: #F0FFF1; }
#document form#changeAgreements label { padding-top: 3px; font-weight: bold; }
#document #agreementAlert { margin-bottom: 12px; font-size: 150%; width: 100%; line-height: 1.4em; padding: 9px; border-top: 1px solid #31708f; border-bottom: 1px solid #31708f; background-color: #d9edf7; color: #31708f; }

#document .clear { clear: both; }
#document p#agree { padding: 12px; background: #FBEED5; }
#document p#submit { padding-top: 12px; }


#document p#submit {
	text-align: center;
}

#document p#submit input {

}

#document p#submit input, #document a.big-button {
	background: -webkit-gradient(linear, left top, left 25, from(#349d39), color-stop(4%, #2d8232), to(#349d39));
	background: -moz-linear-gradient(center top , #349d39 0px, #2d9232 48%, #349d31 49%, #2d8232 100%) repeat scroll 0 0;
	background-color: #349d39;
	border: 1px solid #697379;
	border-radius: 8px 8px 8px 8px;
	box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.25);
	color: #e2ecf2; font-size: 1.5em; margin: 12px auto 0px; padding: 10px 6px;
	text-align: center; text-shadow: -1px -1px 0 rgba(0, 0, 0, 0.2); width: 50%;
	text-decoration: none;
}
#document p#submit input:focus, #document p#submit input:hover, #document a.big-button:hover { border: 1px solid #188a1d;
	background: -webkit-gradient(linear, left top, left 25, from(#22af29), color-stop(4%, #1d9e23), to(#22af29));
	background: -moz-linear-gradient(center top , #22af29 0px, #1d9e23 48%, #22af25 49%, #1d9e00 100%) repeat scroll 0 0;
	background-color: #22af29;
	text-decoration: none;
}


/** Signature Area **/
#document div.signature-box label { font-weight: bold; }
#document div.signature-box p { padding-top: 12px; }
#document div.signature-box p label { float: left; min-width:200px; vertical-align: top; display: block; }
#document div.signature-box p span.input { float: left; vertical-align: top; display: block; }
#document div.signature-box input { width: 100%; }
#document div.signature-box span#agent_signing_box input { width: auto; margin-left: 200px; }
#document div.signature-box span#agent_signing_box label { font-size: 10px; font-weight: normal; }
#document div#agent { padding-top: 12px; clear: both; }
#document #agent_name_box { padding-top: 12px; }

canvas {
	-webkit-box-shadow: 2px 2px 3px 0px rgba(50, 50, 50, 0.75);
	-moz-box-shadow:    2px 2px 3px 0px rgba(50, 50, 50, 0.75);
	box-shadow:         2px 2px 3px 0px rgba(50, 50, 50, 0.75);
	border: 1px solid #444;
	background: white;
}

.select-css {
	display: block;
	font-size: 16px;
	font-family: sans-serif;
	font-weight: 700;
	color: #444;
	line-height: 1.3;
	padding: .6em 1.4em .5em .8em;
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	margin: 0;
	border: 1px solid #aaa;
	box-shadow: 0 1px 0 1px rgba(0,0,0,.04);
	border-radius: .5em;
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	background-color: #fff;
	background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E'),
	  linear-gradient(to bottom, #ffffff 0%,#e5e5e5 100%);
	background-repeat: no-repeat, repeat;
	background-position: right .7em top 50%, 0 0;
	background-size: .65em auto, 100%;
}
.select-css::-ms-expand {
	display: none;
}
.select-css:hover {
	border-color: #888;
}
.select-css:focus {
	border-color: #aaa;
	box-shadow: 0 0 1px 3px rgba(59, 153, 252, .7);
	box-shadow: 0 0 0 3px -moz-mac-focusring;
	color: #222;
	outline: none;
}
.select-css option {
	font-weight:normal;
}

/** Big Screen Specific **/
@media (min-width: 480px) {
	#login form { background-color: #efefef; border: 1px solid #cccccc; box-shadow: 0 5px 5px #888888; color: #333333; margin: 150px auto; padding: 15px; text-align: center; width: 398px; overflow: hidden; }
	#login h1 { padding: 150px 0 0 0; text-align: center; margin: 0; font-size: 2em; font-weight: bold; color: #555555; }
}

/** Mobile Specific **/
@media (max-width: 770px) {
	#document { width: 90%; }
	#document form#changeAgreements { width: 100%; line-height: 1.4em; padding: 9px; border-top: 1px solid #690; border-bottom: 1px solid #690; background-color: #F0FFF1; overflow: hidden; }
	#document form#changeAgreements label { text-align: left; display: block; padding-top: 3px; font-weight: bold; }
	#document form#changeAgreements .select { text-align: left; display: block; width: 100%; float: none; }
	#document div.signature-box p label { float: none;  }
	#document div.signature-box p span.input { float: none; }
}
@media (max-width: 480px) {
	#login form { background-color: #efefef; color: #333333; padding: 15px; text-align: center; width: 90%; overflow: hidden; }
	#login h1 { padding: 6px; text-align: center; margin: 0; font-size: 2em; font-weight: bold; color: #555; }
	body #login { font-size: 80%; }
	#login form div.submit input { font-size: 1em; }
	#document form#changeAgreements .select { text-align: left; display: block; max-width: 200px; }
}