/* Default
=============================== */
.j-forms {
	background-color:#f7fcfb;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	-o-border-radius:3px;
	border-radius:3px;
	border: 2px solid #009688;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	color:rgba(0,0,0,.54);
	font:16px 'Open Sans',Helvetica,Arial,sans-serif;
	line-height:1;
	position:relative;
	margin-top: 40px;
}
.j-forms .checklist-header {
	color: rgba(0,0,0,.87);
	font-size: 28px;
	text-align: center;
}
.j-forms .checklist-text {
	color: rgba(0,0,0,.7);
	font-size: 18px;
	line-height: 1.4;
	text-align: center;
}
.j-forms .input { position:relative; }

.j-forms .unit { position:relative; margin-bottom:25px; }

/* Reset for -webkit / -moz browser
=============================== */
.j-forms input[type="search"]::-webkit-search-decoration,
.j-forms input[type="search"]::-webkit-search-cancel-button,
.j-forms input[type="search"]::-webkit-search-results-button,
.j-forms input[type="search"]::-webkit-search-results-decoration { display:none; }

.j-forms select,
.j-forms input[type="button"],
.j-forms input[type="submit"],
.j-forms input[type="search"] {
	-webkit-tap-highlight-color:transparent;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
	-webkit-appearance:none;
	-moz-appearance:none;
	appearance:none;
	-webkit-border-radius:0px;
	border-radius:0px;
}

/* Content
=============================== */
.j-forms .content { padding:25px 25px 0; }

.j-forms .content:after {
	clear:both;
	content:".";
	display:block;
	height:0;
	visibility:hidden;
}

/* Widget
=============================== */
.j-forms .widget { position: relative; }

.j-forms .widget .addon,
.j-forms .widget .addon-btn {
	background:#00796b;
	border:none;
	color:#fff;
	display:block;
	font:16px 'Open Sans',Helvetica,Arial,sans-serif;
	height:48px;
	line-height:48px;
	padding:0;
	position:absolute;
	outline:none;
	overflow:hidden;
	text-align:center;
	top:0;
	z-index:5;
}
.j-forms .widget .addon-btn,
.j-forms .widget .addon-btn i {
	cursor:pointer;
	-webkit-transition:all.2s;
	-moz-transition:all.2s;
	-ms-transition:all.2s;
	-o-transition:all.2s;
	transition:all.2s;
}
.j-forms .widget .addon-btn:hover,
.j-forms .widget .addon-btn:focus { background-color:#009688; }

.j-forms .widget .addon-btn:hover i,
.j-forms .widget .addon-btn:focus i { color:rgba(0,0,0,.61); }

.j-forms .widget .adn-left { left:0; }

.j-forms .widget .adn-right { right:0; }

.j-forms .widget .addon i,
.j-forms .widget .addon-btn i { color:rgba(0,0,0,.34); font-size:17px; z-index:2; }

.j-forms .widget .adn-50 { width:50px; }

.j-forms .widget .adn-130 { width:130px; }

.j-forms .widget.right-50 .input { padding-right:50px; }

.j-forms .widget.left-50 .input { padding-left:50px; }

.j-forms .widget.right-130 .input { padding-right:130px; }

.j-forms .widget.left-130 .input { padding-left:130px; }

.j-forms .widget .adn-left,
.j-forms .widget.right-50 .input input,
.j-forms .widget.right-130 .input input {
	-webkit-border-radius:3px 0 0 3px;
	-moz-border-radius:3px 0 0 3px;
	-o-border-radius:3px 0 0 3px;
	border-radius:3px 0 0 3px;
}
.j-forms .widget .adn-right,
.j-forms .widget.left-50 .input input,
.j-forms .widget.left-130 .input input {
	-webkit-border-radius:0 3px 3px 0;
	-moz-border-radius:0 3px 3px 0;
	-o-border-radius:0 3px 3px 0;
	border-radius:0 3px 3px 0;
}
.j-forms .widget.left-50.right-50 .input input,
.j-forms .widget.left-50.right-130 .input input,
.j-forms .widget.left-130.right-50 .input input,
.j-forms .widget.left-130.right-130 .input input {
	-webkit-border-radius:0;
	-moz-border-radius:0;
	-o-border-radius:0;
	border-radius:0;
}

/* Inputs
=============================== */
.j-forms input[type="text"],
.j-forms input[type="password"],
.j-forms input[type="email"],
.j-forms input[type="search"],
.j-forms input[type="url"],
.j-forms textarea,
.j-forms select {
	background:#fff;
	border:2px solid rgba(0,0,0,.12);
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	-o-border-radius:3px;
	border-radius:3px;
	color:rgba(0,0,0,.87);
	display:block;
	font-family:inherit;
	font-size:16px;
	height:48px;
	padding:10px 15px;
	width:100%;
	outline:none;
	-webkit-appearance:none;
	-moz-appearance:none;
	appearance:none;
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	-webkit-transition:all.4s;
	-moz-transition:all.4s;
	-ms-transition:all.4s;
	-o-transition:all.4s;
	transition:all.4s;
}
.j-forms input[type="text"]:hover,
.j-forms input[type="password"]:hover,
.j-forms input[type="email"]:hover,
.j-forms input[type="search"]:hover,
.j-forms input[type="url"]:hover,
.j-forms textarea:hover,
.j-forms select:hover { border:2px solid rgba(0,121,107,.6); }

.j-forms input[type="text"]:focus,
.j-forms input[type="password"]:focus,
.j-forms input[type="email"]:focus,
.j-forms input[type="search"]:focus,
.j-forms input[type="url"]:focus,
.j-forms textarea:focus,
.j-forms select:focus { border:2px solid rgba(0,121,107,.9); }

.j-forms .input textarea {
	height:112px;
	overflow:auto;
	min-height:52px;
	resize:vertical;
}

.j-forms .input textarea:focus { height:128px; }

/* Placeholders
=============================== */
.j-forms input::-webkit-input-placeholder,
.j-forms textarea::-webkit-input-placeholder { color:rgba(0,0,0,.54); }

.j-forms input::-moz-placeholder,
.j-forms textarea::-moz-placeholder { color:rgba(0,0,0,.54); }

.j-forms input:-moz-placeholder,
.j-forms textarea:-moz-placeholder { color:rgba(0,0,0,.54); }

.j-forms input:-ms-input-placeholder,
.j-forms textarea:-ms-input-placeholder { color:rgba(0,0,0,.54); }

.j-forms input:focus::-webkit-input-placeholder,
.j-forms textarea:focus::-webkit-input-placeholder { color:rgba(0,0,0,.36); }

.j-forms input:focus::-moz-placeholder,
.j-forms textarea:focus::-moz-placeholder { color:rgba(0,0,0,.36); }

.j-forms input:focus:-moz-placeholder,
.j-forms textarea:focus:-moz-placeholder { color:rgba(0,0,0,.36); }

.j-forms input:focus:-ms-input-placeholder,
.j-forms textarea:focus:-ms-input-placeholder { color:rgba(0,0,0,.36); }

/* Buttons
=============================== */
.j-forms .primary-btn,
.j-forms .secondary-btn {
	border:none;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	-o-border-radius:3px;
	border-radius:3px;
	color:#fff;
	display:block;
	cursor:pointer;
	float:right;
	font:16px 'Open Sans',Helvetica,Arial,sans-serif;
	height:48px;
	margin:10px 0 10px 20px;
	outline:none;
	padding:0 25px;
	white-space:nowrap;
}
.j-forms .primary-btn { position:relative; }

.j-forms .content .primary-btn,
.j-forms .content .secondary-btn { margin:0 0 20px 20px; }

.j-forms .file-button {
	color:#fff;
	display:block;
	font-family:'Open Sans',Helvetica,Arial,sans-serif;
	font-size:14px;
	height:40px;
	line-height:40px;
	outline:none;
	overflow:hidden;
	position:absolute;
	text-align:center;
	top:4px;
	z-index:1;
}
.j-forms .primary-btn,
.j-forms .file-button,
.j-forms .secondary-btn {
	background:#00796b;
	-webkit-transition:background.2s;
	-moz-transition:background.2s;
	-ms-transition:background.2s;
	-o-transition:background.2s;
	transition:background.2s;
}
.j-forms .primary-btn:hover,
.j-forms .file-button:hover,
.j-forms .secondary-btn:hover { background:#009688; }

.j-forms .primary-btn:hover.processing { background:#303f9f; cursor:wait; }

.j-forms .file-button:hover + input { border:2px solid rgba(48,63,159,.6); }

.j-forms .secondary-btn,
.j-forms .secondary-btn:hover,
.j-forms .secondary-btn:active { opacity:.5; }

.j-forms .primary-btn.processing:before {
	background:rgba(255,255,255,.4);
	content:'';
	height:100%;
	position:absolute;
	top:0;
	left:0;
	width:100%;
	-webkit-animation:processing 3s ease-in-out infinite;
	-moz-animation:processing 3s ease-in-out infinite;;
	-ms-animation:processing 3s ease-in-out infinite;
	-o-animation:processing 3s ease-in-out infinite;
	animation:processing 3s ease-in-out infinite;
}
@-webkit-keyframes processing {
	0% { width:0; }
	100% { width:100%; }
}
@-moz-keyframes processing {
	0% { width:0; }
	100% { width:100%; }
}
@-ms-keyframes processing {
	0% { width:0; }
	100% { width:100%; }
}
@-o-keyframes processing {
	0% { width:0; }
	100% { width:100%; }
}
@keyframes processing {
	0% { width:0; }
	100% { width:100%; }
}

/* Status message
=============================== */
.j-forms .error-message,
.j-forms .success-message,
.j-forms .info-message,
.j-forms .warning-message {
	border:2px solid;
	-webkit-border-radius:3px;
	-moz-border-radius:3px;
	-o-border-radius:3px;
	border-radius:3px;
	display:block;
	font:16px/24px 'Open Sans',Helvetica,Arial,sans-serif;
	padding:15px;
}
.j-forms .error-message i,
.j-forms .success-message i,
.j-forms .info-message i,
.j-forms .warning-message i {
	font-size:18px;
	float:left;
	height:24px;
	line-height:24px;
	padding-right:10px;
}
.j-forms .error-message ul,
.j-forms .success-message ul,
.j-forms .info-message ul,
.j-forms .warning-message ul { margin:0; }

.j-forms span.error-view,
.j-forms span.success-view,
.j-forms span.warning-view,
.j-forms span.info-view {
	display:block;
	font-size:14px;
	height:14px;
	line-height:14px;
	margin-top:5px;
	padding:0 2px;
}
.j-forms span.hint {
	display:block;
	font-size:13px;
	color:inherit;
	height:13px;
	line-height:13px;
	margin-top:5px;
	padding:0 2px;
}

/* Error state
=============================== */
.j-forms .error-view .checkbox i,
.j-forms .error-view .radio i,
.j-forms .error-view .checkbox-toggle i,
.j-forms .error-view .radio-toggle i,
.j-forms .error-view input,
.j-forms .error-view select,
.j-forms .error-view textarea { background:#ffebee !important; }

.j-forms .select.error-view i {
	background-color:#ffebee;
	-webkit-box-shadow:0 0 0 12px #ffebee;
	-moz-box-shadow:0 0 0 12px #ffebee;
	-o-box-shadow:0 0 0 12px #ffebee;
	box-shadow:0 0 0 12px #ffebee;
}
.j-forms .error-view .icon-left,
.j-forms .error-view .icon-right { border-color:#e57373; }

.j-forms .error-view .icon-left,
.j-forms .error-view .icon-right,
.j-forms span.error-view,
.j-forms .error-message i { color:#b71c1c; }

.j-forms .error-message { background:#ffebee; border-color:#b71c1c; color:#b71c1c; }

/* Success state
=============================== */
.j-forms .success-view .checkbox i,
.j-forms .success-view .radio i,
.j-forms .success-view .checkbox-toggle i,
.j-forms .success-view .radio-toggle i,
.j-forms .success-view input,
.j-forms .success-view select,
.j-forms .success-view textarea { background:#e8f5e9 !important; }

.j-forms .select.success-view i {
	background-color:#e8f5e9;
	-webkit-box-shadow:0 0 0 12px #e8f5e9;
	-moz-box-shadow:0 0 0 12px #e8f5e9;
	-o-box-shadow:0 0 0 12px #e8f5e9;
	box-shadow:0 0 0 12px #e8f5e9;
}
.j-forms .success-view .icon-left,
.j-forms .success-view .icon-right { border-color:#81c784; }

.j-forms .success-view .icon-left,
.j-forms .success-view .icon-right,
.j-forms span.success-view,
.j-forms .success-message i { color:#1b5e20; }

.j-forms .success-message { background:#e8f5e9; border-color:#1b5e20; color:#1b5e20; }

/* Bootstrap compatibility
=============================== */
.j-forms .radio,
.j-forms .checkbox,
.j-forms .radio-toggle,
.j-forms .checkbox-toggle { margin-top:0; }

.j-forms .label {
	padding:0;
	-webkit-border-radius:0;
	-moz-border-radius:0;
	-o-border-radius:0;
	border-radius:0;
}
.j-forms .radio,
.j-forms .checkbox,
.j-forms .radio-toggle,
.j-forms .checkbox-toggle,
.j-forms .radio *,
.j-forms .checkbox *,
.j-forms .radio-toggle *,
.j-forms .checkbox-toggle *,
.j-forms .radio i:after,
.j-forms .checkbox i:after,
.j-forms .radio-toggle i:after,
.j-forms .checkbox-toggle i:after,
.j-forms .radio i:before,
.j-forms .checkbox i:before,
.j-forms .radio-toggle i:before,
.j-forms .checkbox-toggle i:before {
	-webkit-box-sizing:content-box;
	-moz-box-sizing:content-box;
	box-sizing:content-box;
}