/**** NEW STYLES FOR OPEN ACCT PAGE ****/


/* Left Box with form */

.eply-form  .formOuter {
	background: #C0E3FF;
	padding: 30px 0;
	text-align: center;
	width: 61.8%;
	margin:0;
}

.formInner {
display: inline-block;
}


.eply-form label {
	display:inline-block;
	text-align: right;
	margin-right: 15px;
	font-size: 18px;
	color: #336699;
	width:100px;
}

.formField {
	display:table-cell;
	vertical-align: middle;
	position:relative;
	display:block;
	padding: 20px 0;
}

.formField input, .formField select {
	line-height: 40px;
	width: 390px;
}

.eply-form input, .eply-form textarea, .eply-form select {
	border: 1px solid #444;
  	font-size: 20px;
	color: #666666;
	vertical-align: middle;
}

.eply-form input[type=text], .eply-form textarea, .eply-form select {
  -webkit-transition: all 0.30s ease-in-out;
  -moz-transition: all 0.30s ease-in-out;
  -ms-transition: all 0.30s ease-in-out;
  -o-transition: all 0.30s ease-in-out;
  outline: none;
  padding: 3px 0px 3px 10px;
  border: 1px solid #DDDDDD;

}
 
.eply-form input[type=text]:focus, .eply-form textarea:focus {
  box-shadow: 0 0 5px rgba(81, 203, 238, 1);
  padding: 3px 0px 3px 10px;
  border: 1px solid rgba(81, 203, 238, 1);
}

.eply-form textarea {
	height: 350px;
}

.formField.submit {
		margin-top:20px;
}

.formField.submit input {
		font-family: 'Lato', sans-serif;
		border: none;
		color: #FFF;
		font-weight: 600;
		-webkit-transition: all 0.30s ease-in-out;
		-moz-transition: all 0.30s ease-in-out;
		-ms-transition: all 0.30s ease-in-out;
		-o-transition: all 0.30s ease-in-out;
}

.formField.submit input:hover {
	background-color: #00ADEF;
	
}
.formField i {
	vertical-align:middle;
	margin-left:20px;
}

.req:before{
     content:"*" ;
     color:red   
     }

/* Right Box */

.eply-form  .formRight {
	position:relative;
	width: 38.2%;
	margin-left: 0 !important;
	border-width:1px;
	border-image:url(https://www.eply.com/library/eplyimages/dashes.png) 1 repeat;
    border-image-width: 1px 1px 1px 0;
	border-right: 2px dashed #C0E3FF;
	border-bottom: 2px dashed #C0E3FF;
	border-top: 2px dashed #C0E3FF;
	text-align: center;
	height: 628px;
	margin: 0;
}

.taglines {
	margin-top: 40px;
	text-align:center;
	clear:both;
}

.taglines h3 {
	font-size: 1.4em;
	color: #666666;
	margin: 0 0 30px !important;
}

.writing {
	margin-top: 80px;
}

.writing p {
	font-family: 'Neucha', cursive;
	color: #F79B2F;
	font-size:2.2em;
}

.arrow {
	float:left;
	margin-left:35px;
	margin-bottom: 40px;
}

.convinced {
	position: absolute;
	width:100%;
	bottom: 0;
}

.convinced h3 {
	position:relative;
	font-weight: 300;
	margin-bottom: 10px !important;
}

.convinced i {
	color: #F79B2F;
	font-size: 2.5em;
	margin-bottom: 10px;
}

/*** Quotes ***/

.quote-wrap {
	position:relative;
	margin-top:25px;
}

.quote:before {
	content: url('/library/eplyimages/quotes.png');
	position:absolute;
	left: 0;
	top: 0;
}

.quote {
	padding: 30px 0 15px 105px;
}

.quote p {
	font-size: 1.4em;
	color: #666666;
}

.attrib:before {
	content: url('/library/eplyimages/person.png');
	position:absolute;
	left:-50px;
}

.attrib-wrap {
	position:relative;
	margin-top: 15px;
	float:right;
}

.attrib {
	padding-right:20px;
}

.attrib p {
	font-size: .9em;
}

/*** Dashed Line  bottom ***/

.dashes {
	border-width:1px;
	border-image:url(/library/eplyimages/dashes.png) 1 repeat;
    border-image-width: 0 0 1px 0;
	border-bottom: 2px dashed #C0E3FF;
}

/*** Brands ***/

.eply-form .brands {
	padding: 30px 0 40px;
}

/*** why eply ***/

.whyEplyIcon {
	float: left;
	width: 40px;
	margin-right: 20px;
}

.whyEplyContent {
	float: left;
	width: 80%;
	margin-bottom: 30px;
}

.whyEplyContent h4 {
	margin-bottom: 10px;
}

div.whyEplySmall {
	margin-top: 40px;
}

/*** validation ***/

.form-error {
	position:absolute;
	right:0;
	display:block;
	text-align:right;
	color:red;
}

@media screen and (max-width: 1023px) {
	.eply-form  .formRight {
		display:block;
		width:100%;
		height: auto;
		border-width:1px;
		border-image:url(https://www.eply.com/library/eplyimages/dashes.png) 1 repeat;
		border-image-width: 0 1px 1px 1px;
		border-right: 2px dashed #C0E3FF;
		border-bottom: 2px dashed #C0E3FF;
		border-top: 2px dashed #C0E3FF;
		margin-top: 0 !important;
	}
	.quote-form .formRight {
		height: auto !important;
	}
	.eply-form  .formOuter {
			display:block;
			width: 100%;
			margin-bottom: 0 !important;
	}
	.arrow {
		display:none;
	}
	.convinced {
		position:relative;
	}	
	.writing {
		margin-top: 45px;
	}
}

/* QUOTE FORM */

.quote-form label {
	vertical-align: middle;
	width: 130px;
}

.quote-form .quote-text-area label {
	vertical-align: top;
}

.request_content {
	float:none;
}

.quote-form .submit {
	text-align:right;
}

.quote-form .submit input {
	width:50%;
}

.quote-form .formRight {
	padding: 30px 50px;
	height: 907px;
}

.quote-form .formOuter {
	padding: 0 0 20px 0;
}

.quote-form .formField {
	padding: 10px 0;	
}

.sideFormItem {
	margin-bottom:40px;
}

@media screen and (max-width: 700px) {
	.formField input {
	width: 300px;
	}
	.formWrap {
		width: 100%;
	}
}

@media screen and (max-width: 520px) {
	.formField input {
	width: 200px;
	}
	.formField label {
		text-align:center;
		width: 100%;
	}
	.quote-form .submit input {
	width:100%;
	}
}

/*** END REGISTER FORM ***/