/*
	 CSS-Tricks Example
	 by Chris Coyier
	 http://css-tricks.com
	 
	 styled by Andru Stoicescu
	 http://betterhtml.com/
*/

* {
	margin: 0;
	padding: 0;
	-moz-box-sizing:    border-box;
	-webkit-box-sizing: border-box;
	box-sizing:         border-box;
}

body {
	font: 12px "Lucida Grande", serif;
	background: #fff;
}

.stripe {
	background: #e5e5e5;
	background: rgba(217, 217, 217, 0.4);
	margin: 100px 0 30px;
	box-shadow: 0px 0px 30px 0px rgba(255, 255, 255, 0.9);
}
.stripe .inner {
	width: 600px;
	margin: 0 auto;
	padding: 20px 0;
}

h1 {
	font: bold 60px Sans-Serif;
	letter-spacing: -1px;
	margin: 0 0 5px 0;
	text-shadow: 0 0 10px rgba(255, 255, 255, 0.9);
}

#page-wrap {
	width: 600px;
	margin: 0 auto;
}

.fancy-form {
	//background: #f7f7f7;
	//border-radius: 6px;
	padding: 20px;
	//box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.2), inset 0px 0px 0px 1px rgba(255, 255, 255, 1);
	//border: 1px solid #B2B2B2;
}

.fancy-form input {
	-webkit-transition: all 0.3s ease-out;
	-moz-transition:    all 0.3s ease-out;
	-o-transition:      all 0.3s ease-out;
	transition:         all 0.3s ease-out;
}

.fancy-form input[type="text"] {
	outline: none;
	border: 1px solid #cccccc;
	box-shadow: 0px 0px 0px 4px rgba(0, 0, 0, 0.1), inset 0px 1px 0px 0px rgba(255, 255, 255, 1), inset 0px 1px 6px 0px rgba(0, 0, 0, 0.05);
	border-radius: 3px;
	padding: 7px 10px;
	background: #f1f1f1;
	color: #b5b5b5;
	margin-bottom: 4px;
}

.fancy-form input[type="text"]:hover {
	background:#f7f7f7;
}

.fancy-form input[type="text"]:focus {
	box-shadow: 0px 0px 0px 5px rgba(0, 0, 0, 0.1), 0px 1px 5px 0px rgba(0, 0, 0, 0.2), inset 0px 1px 6px 0px rgba(0, 0, 0, 0.1);
	background: #fff;
	border-color: transparent;
	color: #565656;
}

.fancy-form fieldset {
	border: none;
	padding: 25px 10px 10px 10px;
}

.fancy-form legend {
	font: 26px "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	text-transform :uppercase;
	text-shadow: 0 1px 1px #fff;
	color: #1b6d8e;
	padding: 0 5px;
}

.fancy-form label {
	display: block;
	font: 14px Arial, Helvetica, sans-serif;
	padding-left: 10px;
	letter-spacing: 1px;
	padding-left: 10px;
	color: #003366;
	opacity: 0.8;
}
.fancy-form input:focus + label {
	opacity: 1.0;
}

.fancy-form input:not([type=submit]) {
	width: 100%;
	display: block;
}

.submit-wrap {
	display: none;
}

.fancy-form input[type="submit"] {
	padding: 10px 40px;
	border: 1px solid #a9d9fa;
	background: url(../images/submit_btn_gradient.png) repeat-x #69c4e7;
	border: 1px solid #5cb0d2;
	box-shadow: 0px 0px 0px 4px rgba(210, 210, 210, 1), inset 0px 1px 1px 0px rgba(255, 255, 255, 0.6), inset 0px 1px 20px 0px rgba(255, 255, 255, 0.2), inset 0px -1px 0px 0px rgba(0, 0, 0, 0.4);
	font: bold 16px Arial, Helvetica, sans-serif;
	border-radius: 40px;
	color:#2190bd;
	text-shadow:0 1px 0 rgba(255,255,255,0.5);
	cursor:pointer;
	outline:none;
}

.fancy-form input[type="submit"]:hover {
	background-color: #88daf6;
	color: #1b6d8e;
}

.fancy-form input[type="submit"]:active {
	background-color: #69c4e7;
	box-shadow: 0px 0px 0px 4px rgba(0, 0, 0, 0.1), inset 0px -1px 1px 0px rgba(255, 255, 255, 0.6), inset 0px 5px 20px 0px rgba(0, 0, 0, 0.1), inset 0px 1px 0px 0px rgba(0, 0, 0, 0.2);
	color: #2190bd;
	-webkit-transition: all 0.1s ease-out;
	-moz-transition:    all 0.1s ease-out;
	-o-transition:      all 0.3s ease-out;
	-ms-transition:     all 0.1s ease-out;
}

.fancy-form div {
	margin: 0 0 6px 0;
	clear: both;
}

.fancy-form div > div {
	padding: 4px;
}

.fancy-form .city-wrap {
	width: 69%;
	margin-right: 1%;
}

.fancy-form .state-wrap {
	width: 20%;
	margin-right: 1%;
}

.fancy-form .zip-wrap {
	width: 20%;
	display: block !important;
}

.zip-error {
	color: #d70000;
	font: 12px "Lucida Sans Unicode", "Lucida Grande", sans-serif;
	border-top: 2px dotted #ec9696;
	border-bottom: 2px dotted #ec9696;
	text-align: center;
	padding: 5px 10px;
	margin-top: 10px;
	display: none;
}

#ancestrylink {
	padding-top: 30px;
	font: 12px Arial, Helvetica, sans-serif;
}

#ancestrylink a {
	color: #003568;
}

.instructions {
	font: 12px Arial, Helvetica, sans-serif;
}