/* Chrome, Safari, Opera */ 
@-webkit-keyframes slideUp {
	from {
		opacity: 1;
		-webkit-transform: translate3d(0,0,0);
	}
	to {
		opacity: 0;
		-webkit-transform: translate3d(0,-10px,0);
	}
} 
@keyframes slideUp {
	from {
		opacity: 1;
		-webkit-transform: translate3d(0,0,0);
		transform: translate3d(0,0,0);
	}
	to {
		opacity: 0;
		-webkit-transform: translate3d(0,-10px,0);
		transform: translate3d(0,-10px,0);
	}
}

@-webkit-keyframes fadeOut {
	0% {
		opacity: 1;
		-webkit-transform: translate3d(0,0,0) scale(1);
	}
	100% {
		opacity: 0;
		-webkit-transform: translate3d(50px,0,0) scale(.98);
	}
} 
@keyframes fadeOut {
	0% {
		opacity: 1;
		-webkit-transform: translate3d(0,0,0) scale(1);
	}
	100% {
		opacity: 0;
		-webkit-transform: translate3d(50px,0,0) scale(.98);
	}
}


body.folded.wp-admin .fcbmodal-backdrop,
body.folded.wp-admin .fcbmodal
{
	left: 36px;
}
body.wp-admin .fcbmodal-backdrop,
body.wp-admin .fcbmodal
{
	left: 160px;
}
.ui-datepicker
{
	display: none;
}
.ie9 .formcraftbasic-css .fcb_form
{
	border: 1px solid #ccc;
	border-top-color: #ddd;
	border-bottom: #bbb;
}
#upgrade_modal
{
	ol li h2
	{
		margin: 0;
		font-size: 15px;
		position: relative;
		z-index: 101;
		font-weight: bold;
		color: #666;
	}
	ol {
		counter-reset: my-badass-counter;
		margin-left: 42px;
		color: #666;
	}
	ol li
	{
		position: relative;
		list-style: none;
		margin-bottom: 28px;
	}
	ol li:last-child
	{
		margin-bottom: 0;
	}
	ol li a
	{
		color: lighten(#48e, 2%);
		text-transform: uppercase;
		text-decoration: none;
		font-weight: 600;
		letter-spacing: .4px;
		font-size: 11px;
	}
	ol li a:hover
	{
		color: darken(#48e, 5%);
	}
	ol li p
	{
		margin-top: 5px;
		margin-bottom: 5px;
		position: relative;
		z-index: 101;
	}
	ol li:before {
		position: absolute;
		z-index: 100;
		font-size: 15px;
		text-align: center;
		left: -40px;
		top: 0;
		border-radius: 100px;
		background-color: #639EF6;
		color: white;
		font-weight: bold;
		width: 30px;
		height: 30px;
		line-height: 29px;
		padding-bottom: 1px;
		content: counter(my-badass-counter);
		counter-increment: my-badass-counter;
	}
}

.formcraftbasic-css
{
	position: relative;
	.fcb-locked {
		&::before {
			position: absolute;
			content: '';
			display: block;
			left: 0;
			right: 0;
			top: 0;
			bottom: 60px;
			opacity: .4;
			z-index: 100;
			background-color: white;
		}
		.fcb-lockribbon {
			position: absolute;
			top: 50%;
			margin-top: -4px;
			left: -4px;
			right: -4px;
			content: '';
			display: block;
			height: 8px;
			background-color: #69ab69;
			z-index: 101;		
			&::before {
				width: 0;
		    height: 0;
		    top: 7px;
		    left: 0;
		    border-style: solid;
		    border-width: 0 4px 5px 0;
		    content: '';
		    position: absolute;
		    border-color: transparent #549654 transparent transparent;		
			}
			&::after {
				width: 0;
		    height: 0;
		    top: 7px;
		    right: 0;
		    border-style: solid;
		    border-width: 5px 4px 0 0;
		    content: '';
		    position: absolute;
		    border-color: #549654 transparent transparent transparent;			
			}
		}
		.fcb-lock {
			text-decoration: none;
			cursor: pointer;
	    position: absolute;
	    text-align: center;
	    top: 50%;
	    transform: translateY(-50%) scale(1);
	    left: 50%;
	    width: 230px;
	    margin-left: -115px;
	    background-color: #62a762;
	    border: 1px solid #549654;
	    box-shadow: 0 2px 8px rgba(0,0,0,.12);
	    padding: .82em 0 .81em 0;
	    border-radius: 3px;
	    transition: box-shadow .2s,transform .2s;
	    color: #fff;
	    z-index: 999;
	    font-size: .92em;
	    text-transform: uppercase;
	    letter-spacing: .3px;
	    padding-left: .3em;
	    font-weight: 600;
	    &:hover {
				box-shadow: 0 2px 12px rgba(0,0,0,.2);
		    background-color: #589d58;
		    border-color: #4d894d;
	    }
	    .fcb-icon {
	    	color: white;
	    	font-size: 145%;
	    	margin: 0 6px 0px -6px;
	    }
		}
		.fcb-lock-footer {
			z-index: 999;
			position: absolute;
			left: 50%;
			width: 210px;
			margin-left: -105px;
			top: 50%;
			margin-top: 20px;
			font-size: 110%;
			padding: 6px 0;
			text-align: center;
			text-decoration: none;
		}		
	}
	.options-head-button {
		font-size: 110%;
	}
	.options-head {
		position: fixed;
		z-index: 9999;
		top: 40px;
		margin-left: -10px;
		height: 38px;
		letter-spacing: -4px;
		box-shadow: 0 0 0 0.5px rgba(0,0,40,.18), 0 2px 6px 1px rgba(20,40,80,.14);
		> div, > a {
			display: inline-block;
			letter-spacing: 0;
			vertical-align: top;
			> button,
			.add_fields > button,
			&.button {
				margin: 0;
				border-radius: 0px;
				border: 0px;
				border-left: 1px solid #3c69ab;
			}
			&.button {
				border-left: 0px;
			}
		}
		#form_save_button {
			.fcb-spinner {
				display: none;
				padding: 1px;
				margin: 13px auto;
				> div {
					background-color: white;
				}
			}
			&.saving {
				.fcb-spinner {
					display: block;
				}
				.one {
					display: none;
				}
			}
		}
	}
	.add_fields {
		width: 125px;
		display: inline-block;
		> div
		{
			-webkit-animation: slideDown .2s;
			animation: slideDown .2s;
		}
		> div.ng-hide
		{
			-webkit-animation: slideUp .2s;
			animation: slideUp .2s;
		}
		.premium-fields {
			> .button .fcb-icon {
				position: absolute;
		    right: 5px;
		    top: 16px;
		    font-size: 130%;
			}
			.premium-fields-list {
				display: none;
				position: absolute;
				left: 100%;
				margin-left: -1px;
				bottom: 0;
			}
			&:hover {
				> .button {
					background-color: #eee;
				}
				.premium-fields-list {
					display: block;
				}
			}
		}
		> div
		{
			margin-top: 14px;
			position: relative;
			&:before
			{
				content: '';
				width: 0; 
				height: 0; 
				border-left: 6px solid transparent;
				border-right: 6px solid transparent; 
				border-bottom:6px solid #bbb;
				position: absolute;
				left: 50%;
				margin-left: -3px;
				margin-top: 1px;
				top: -6px;
				z-index: 101;
			}
			&:after
			{
				content: '';
				width: 0; 
				height: 0; 
				border-left: 6px solid transparent;
				border-right: 6px solid transparent; 
				border-bottom:6px solid #f6f6f6;
				position: absolute;
				left: 50%;
				margin-left: -3px;
				top: -6px;
				margin-top: 2px;
				z-index: 102;
			}
			.button
			{
				border-radius: 0px;
				margin-top: -1px;
				text-align: center;
			}
			.button:first-child
			{
				border-radius: 2px 2px 0px 0px;
			}
			.button:last-child
			{
				border-radius: 0 0 2px 2px;
			}
		}
		.icon-angle-up
		{
			display: none;
		}
		.icon-true .icon-angle-up
		{
			display: inline-block;
		}
		.icon-true .icon-angle-down
		{
			display: none;
		}
		> div .button
		{
			font-size: 11px;
		}
		> div.state-true
		{
			display: block;
			> .button
			{
				cursor: move;
			}
		}
		.button
		{
			display: block;
			width: 100%;
			margin-bottom: 0px;
		}
	}	
	.side-panel
	{
		.side-panel-one.form-logic {
			.side-panel-header-title {
				padding: 22px 0 22px 18px;
			}
			.side-panel-content {
				padding: 0;
			}
		}
		.side-panel-one {
			margin-left: -10px;
			width: 540px;
			box-shadow: 0 0 0 0.5px rgba(0,0,40,.18), 0 2px 6px 1px rgba(20,40,80,.14);			
			position: fixed;
			top: 98px;
			bottom: 10px;
			z-index: 999;
			background-color: white;
			transform-origin: 0;
			-webkit-animation: slideFromLeft .3s;
			animation: slideFromLeft .3s;
			&.ng-hide.ng-hide-animate
			{
				display: block;
				-webkit-animation: slideToLeft .3s;
				animation: slideToLeft .3s;
			}			
		}
		.side-panel-header {
			background: #f8fafc;
			color: #888;
			border-bottom: 1px solid #ddd;
			.side-panel-header-title {
				font-size: 125%;
				font-weight: 600;
				padding: 22px 0 8px 18px;
			}
		}		
		.side-panel-content {
			padding: 2px 20px;
			position: relative;
			> div > div > div {
				margin: 18px 0;
				min-height: 38px;
				span.option-label
				{
					display: inline-block;
					width: 140px;
					line-height: 38px;
				}
			}
			input[type='text']
			{
				padding: 7px 11px;
				margin-right: 6px;
			}
			input[type='radio'],
			input[type='checkbox']
			{
				position: relative;
				top: 1px;
			}
			.wp-picker-container .wp-picker-input-wrap input
			{
				height: 22px;
				width: 75px;
				padding: 0px 8px;
				line-height: 22px;
			}
			.group-title
			{
				color: #48e;
				font-size: 105%;
				font-weight: 600;
				margin: 0;
				left: 20px;
				top: -11px;
				position: absolute;
				background-color: white;
			}
			.button
			{
				vertical-align: middle;
			}
			.group
			{
				position: relative;
				padding: 20px;
				padding-bottom: 10px;
				margin-top: 30px;
				border: 1px solid #ddd;
				border-radius: 2px;
				> div
				{
					margin-bottom: 10px;
				}
				span.option-label
				{
					width: 120px;
				}
				p
				{
					margin: 0;
					color: #777;
					vertical-align: top;
					max-width: 60%;
					margin-left: 8px;
					display: inline-block;
					font-size: 13px;
				}
			}
			.tooltip-cover
			{
				display: inline-block;
				text-align: center;
				font-size: 16px;
				border-radius: 100px;
				.tooltip-icon
				{
					display: block;
					color: #659def;
					text-align: center;
				}
				.tooltip
				{
					min-width: 200px;
					text-align: left;
				}
			}
		}
		.nav-tabs {
			font-size: 13px;
			color: #999;
			letter-spacing: -4px;
			position: relative;
			padding-top: 12px;
			> span {
				cursor: pointer;
				display: inline-block;
				letter-spacing: 0;
				font-weight: 600;
				padding: 10px 20px;
				position: relative;
				border-radius: 2px 2px 0 0;
				bottom: -1px;
				border: 1px solid transparent;
				border-bottom: 0px;
			}
			> span:hover {
				color: #888;
			}
			> span.active {
				color: #666;
				border-color: #ddd;
				background: white;
			}
			> span:first-child {
				border-left-color: transparent !important;
			}			
		}
	}	
	.form-preview
	{
		position: fixed;
		top: 10px;
		left: 10px;
		padding: 9px 14px 8px 14px;
		color: #555;
		border-radius: 2px;
		background-color: #fff;
		box-shadow: 0px 1px 2px #aaa;
	}
	&.align-left .fcb_form
	{
		margin-left: 0;
	}
	&.align-right .fcb_form
	{
		margin-right: 0;
	}
	.wp-picker-container
	{
		position: relative;
		.wp-color-picker
		{
			padding: 2px;
		}
		.wp-picker-holder
		{
			position: absolute;
			top: 23px;
			z-index: 101;
		}
		.wp-picker-holder .iris-picker
		{
			-webkit-animation: slideDown .3s ease-out;
			animation: slideDown .3s ease-out;
		}
		.wp-picker-input-wrap input
		{
			-webkit-animation: slideFromRight .3s ease-out;
			animation: slideFromRight .3s ease-out;			
		}
		.wp-color-result
		{
			margin-bottom: 0;
		}
		.wp-color-result:after
		{
			box-shadow: none;
			height: 20px;
			line-height: 20px;
		}
		.wp-picker-clear
		{
			height: 22px;
			line-height: 20px;
		}
	}
	.promo-head
	{
		position: fixed;
		top: 40px;
		right: 8px;
		.button
		{
			border-radius: 0px;
		}
	}
	.form-cover-builder {
		padding-top: 120px;
		padding-bottom: 120px;
		min-height: 610px;
		.fcb_form {
			box-shadow: 0 0 0 0.5px rgba(0,20,40,.1), 0 2px 8px 0 rgba(50,55,90,.2);
			.form-element {
				opacity: .65;
				transition: none;
				-webkit-transition: none;
				cursor: pointer;
			}
			.form-element .options-panel {
				display: none;
				cursor: move;
				cursor: -webkit-grab;
			}
			.form-element:hover .options-panel {
				display: block;
			}
			.form-element:hover {
				//box-shadow: 0px 0px 100px rgba(0,0,0,.05) inset;
				border: 1px dashed #aaa;
				border-radius: 2px;
				opacity: 1;
			}
			.form-element.options-true {
				opacity: 1;
			}
		}
		.required_field {
			display: none;
		}
		.fcb-spinner-form {
			display: none;
		}
		.form_width_change {
			border: 1px solid #bbb;
			border-bottom: 0px;
			height: 18px;
			text-align: center;
			margin: 0 auto 10px auto;
			position: relative;
			.fcb-icon {
				z-index: 102;
				position: absolute;
				left: 50%;
				margin-left: 32px;
				color: #666;
				top: -9px;
				border-radius: 100px;
				font-size: 14px;
			}
			input {
				padding: 4px 6px;
				box-shadow: none;
				border: 1px solid #bbb;
				width: 100px;
				position: absolute;
				top: -14px;
				left: 50%;
				text-align: center;
				margin-left: -50px;
				text-transform: uppercase;
				letter-spacing: .6px;
				font-size: 11px;
				color: #666;
				font-weight: bold;
			}
			span
			{
				position: absolute;
				z-index: 101;
				top: -30px;
				font-size: 11px;
				letter-spacing: .6px;
				color: #666;
				text-transform: uppercase;
				font-weight: bold;
				width: 100px;
				left: 50%;
				margin-left: -50px;
			}
		}
		&.hide-form
		{
			.form_width_change
			{
				display: none;
			}
			.fcb_form
			{
				display: none;
			}
			.fcb-spinner-form
			{
				display: block;
				margin: 0px auto;
				padding: 0;
				white-space: nowrap;
				position: absolute;
				top: 50%;
				margin-top: -10px;
				left: 0; right: 0;
				width: auto;
				> div
				{
					width: 15px;
					height: 15px;
					background-color: #999;
					margin: 0 1px;
				}
			}
		}
	}
	#form-cover-html
	{
		text-align: center;
		position: relative;
		min-width: 100%;
		> form
		{
			margin: 0 auto;
		}
		.no-fields
		{
			display: none;
		}
		&.nos-0
		{
			.no-fields
			{
				display: block;
				position: absolute;
				cursor: pointer;
				right: 0;
				z-index: 1;
				font-size: 1.5em;
				top: 28px;
				line-height: 150px;
				width: 420px;
				left: 50%;
				margin-left: -210px;
				color: #999;
			}
			.no-fields:hover
			{
				color: #777;
			}
			.fcb_form
			{
				min-height: 150px;
			}
		}
	}
	.fcb_form
	{
		background: white;
		box-shadow: 0px 1px 2px #cacaca;
		-moz-box-shadow: 0px 1px 2px #cacaca;
		border-radius: 2px;
		transition: width .2s;
		-webkit-transition: width .2s;
		letter-spacing: -4px;
		padding: 10px;
		text-align: left;
		margin: 0 auto;
		min-width: 140px;
		box-sizing: border-box;
		-moz-box-sizing: border-box;
		position: relative;
		h1 {
			font-size: 2em;
			margin: .5em 0;
			color: inherit;
		}
		h2
		{
			font-size: 1.6em;
		}
		h3
		{
			font-size: 1.5em;
		}
		h2, h3
		{
			margin: .4em 0;
		}
		h1,h2,h3,h4,h5,h6
		{
			font-weight: bold;
			display: inline-block;
			color: inherit;
			line-height: normal;
			margin-top: 0;
			margin-bottom: .2em;
		}
		&.frame-hidden
		{
			box-shadow: none;
			-moz-box-shadow: none;
			padding: 0;
			.form-element .form-element-html
			{
				padding-left: 0;
			}
		}
		&.align-left
		{
			margin-left: 0;
			margin-right: auto;
		}
		&.align-center
		{
			margin-left: auto;
			margin-right: auto;
		}
		&.align-right
		{
			margin-left: auto;
			margin-right: 0;
		}
		.field-cover
		{
			letter-spacing: -4px;
			> span, > div
			{
				letter-spacing: 0;
				display: inline-block;
				box-sizing: border-box;
				-moz-box-sizing: border-box;
			}
			> span
			{
				width: 30%;
				text-align: right;
				line-height: normal;
				padding-right: 9px;
				vertical-align: top;
				display: inline-block;
				position: relative;
				top: .7em;
			}
			> div
			{
				width: 70%;
				display: inline-block;
				text-align: left;
				input[type="text"],
				textarea,
				select
				{
					width: 100%;
					margin: 0;
				}
			}
			> div.full
			{
				width: auto;
				display: block;
				hr
				{
					margin: 0 -20px;
				}
			}
		}
		.form-element.hide-it
		{
			display: none;
		}
		.dndDragging
		{
			opacity: .75;
		}
		.dndPlaceholder
		{
			list-style: none;
			padding: 0;
			margin: 0;
			min-height: 58px;
			position: relative;
		}
		.dndPlaceholder:before
		{
			content: '';
			border: 1px dashed #aaa;
			border-radius: 2px;
			position: absolute;
			left: 0px;
			right: 0px;
			bottom: 0px;
			top: 0px;
		}
		.final-success
		{
			letter-spacing: 0;
			display: block;
			text-align: center;
			padding: 40px 30px;
			font-size: 1.2em;
			position: absolute;
			left: 0;
			right: 0;
			top: auto;
			bottom: 0;
			.icon-ok-circle
			{
				display: block;
				-webkit-animation: successIn .6s linear;
				animation: successIn .6s linear;
				color: rgb(35, 179, 35);
				font-size: 1.6em;
				margin-bottom: .3em;
			}
			span
			{
				display: block;
				-webkit-animation: successIn .6s linear;
				animation: successIn .6s linear;
				color: #18A118;
			}
		}
		&.submitted .form-element
		{
			opacity: 0;
			transform: scale(.7) translate3d(0,-150px,0);
			-webkit-transform: scale(.7) translate3d(0,-150px,0);
		}
		&.submitted
		{
			overflow: hidden;
			min-height: 150px;
		}
		.form-element
		{
			position: relative;
			display: inline-block;
			letter-spacing: 0;
			vertical-align: top;
			transform: scale(1) translate3d(0,0,0);
			-webkit-transform: scale(1) translate3d(0,0,0);
			transition: opacity .4s, transform .7s;
			-webkit-transition: opacity .4s, -webkit-transform .7s;
			opacity: 1;
			border: 1px dashed transparent;
			border-radius: 2px;
			&.error-field
			{
				.error
				{
					display: block;
				}
				.checkbox-cover > div
				{
					border-color: #F69A9A;
					padding-left: 8px;
				}
				input[type='text'],
				textarea,
				select
				{
					border-color: #F69A9A;
				}
			}
			input[type="text"],
			input[type="password"],
			input[type="color"],
			input[type="date"],
			input[type="datetime"],
			input[type="datetime-local"],
			input[type="email"],
			input[type="month"],
			input[type="number"],
			input[type="password"],
			input[type="search"],
			input[type="tel"],
			input[type="text"],
			input[type="time"],
			input[type="url"],
			input[type="week"],
			select,
			textarea
			{
				background-color: #fafafa;
			}
			.error
			{
				display: none;
				position: absolute;
				top: 10px;
				z-index: 101;
				font-size: .85em;
				line-height: .4em;
				margin-top: -.2em;
				background: white;
				right: 30px;
				color: rgb(241, 16, 16);
				-webkit-animation: fadeInRight .3s ease-out;
				animation: fadeInRight .3s ease-out;
			}
			.form-element-html
			{
				padding: 10px;
			}
			.field-cover
			{
				position: relative;
			}
			&.index-true
			{
				z-index: 103;
			}
			.customText-cover
			{
				white-space: pre-wrap;
			}
			.textarea-cover
			{
				line-height: 0;
			}
			.email-cover input
			{
				background-repeat: no-repeat;
				background-position: 96% 50%;
				background-size: 15px;
				background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHAAAABeCAMAAADMmGA/AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDE0IDc5LjE1Njc5NywgMjAxNC8wOC8yMC0wOTo1MzowMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTQgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6NTdDMDAxMDdCNzVEMTFFNDlEQTVGRkQ0QUREOUY5MzEiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NTdDMDAxMDhCNzVEMTFFNDlEQTVGRkQ0QUREOUY5MzEiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo1N0MwMDEwNUI3NUQxMUU0OURBNUZGRDRBREQ5RjkzMSIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo1N0MwMDEwNkI3NUQxMUU0OURBNUZGRDRBREQ5RjkzMSIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pj8QyGEAAAAYUExURfT09JCQkLa2ttTU1HJycsHBwWZmZv////VzLawAAAAIdFJOU/////////8A3oO9WQAAAh9JREFUeNrsWtlywyAMlISA///jOslM68ocAiO1k8BM3hKvda82QM4ZiI+TjD+MBA+wnAMnp8PhAeiHd5yQAdARLzEAJddDvgamhMC+gAnS5wAiRSKrDxYAYzY84T8A0ltZGL0tdAekAiCDISCXCj/Y4UGx06AdIJZbm5lPzzP+DMgOBv5u3tG66iUgB+OMuYwnNAij4BRiHqJtAAsDmOx6TGXiE1jaV6IYKxELnBDKhHwRHutIFEeD+muzthXlUeH0kIwQa5T+NA+XBjKKx5U4Da7LVmkelUmUcDqGVdlJNdYWcIlbwzU6NV4qEKdyR2bnkytVean89jgiFFOhQYTDvWyt/LzFvOUrxhuz4dtBzd1i3q1QrazObiH8oq0PqEejt8yIV9V181DITvX2NO7W9i8U+6FMtw5iaPtEsx/CSNvpRV21kIK6m/cDoNyA5XuDrhri/I6v6uaa3qTe8YWzmFrbdMMNA6JC53mgmy8jKga0PKadoEM6jZzfPzl/MS+s0Wnkc/lVIBce2GBBo8JQlBQakS40MK5UokJXOG73vnGtrSdVd7r7jNZGbe3cQNyr/8HRJz5zaiIgT5l3Qy8tGaniddN66aX2WLeC3BBo4VyATEp+dU8Rhkh4VD5FPUl+f837MwF3DHcMt0t3DDfgjuEGfFyNMDz4SbdNnC/wsPcVJfa/hOXrUwbInmlzrHZ/cFXwuYE5YPJrlfwSYAAR6AOebgAp6QAAAABJRU5ErkJggg==);
			}
			.datepicker-cover input
			{
				background-repeat: no-repeat;
				background-position: 96% 50%;
				background-size: 16px;
				background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFAAAABQCAMAAAC5zwKfAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMDE0IDc5LjE1Njc5NywgMjAxNC8wOC8yMC0wOTo1MzowMiAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTQgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MkY4MEZGNzlCOTIxMTFFNEIyNTlEMzlCQjFEN0U5QTciIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MkY4MEZGN0FCOTIxMTFFNEIyNTlEMzlCQjFEN0U5QTciPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDoyRjgwRkY3N0I5MjExMUU0QjI1OUQzOUJCMUQ3RTlBNyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDoyRjgwRkY3OEI5MjExMUU0QjI1OUQzOUJCMUQ3RTlBNyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PnCtMZEAAAAYUExURcjIyFVVVbS0tPLy8oqKiqOjo2tra////z0ayEAAAAAIdFJOU/////////8A3oO9WQAAAZFJREFUeNrsmYuugjAMhnvn/d/4TDagLRPigaiJGzGx7fr1F5ayTJhuHjCATGaIaMrOBzL7BLyz+YiPgAWHy5BlJjgfrLjVZxEZgdu0x8waI+9DyjUeZZ4CY27VGHNrFRbsVNkDOebWiSl3lpMKo3EfCC2FSCvaSpHsw5Lcokok9Sv0gbIFm1huYnSOa4uzkwUu3geKV7sA60/idh/Yq7InQGaotz8ACarqyQEFyAOlPipgDsBt/YlPXkbPx2mlGTmg7hYVnAJht3R1BcJ+lb6usNWA7LygcM6d3XiTQjwA/kshDoXPFfIFhfYi0M6AtVum1ji32tRWa7chPAWWF4/krtr1YfGlltwHXhgDiOauaJ3ZfWB4R2s0IZs07d+XGUgHQMoE6u0QhsKh8BcUCrghqNEMUc3me7qNkG5XkeQskpPoeMpD4VD4PQpNzNZP2Q8EG6ONZt5+U7cZT3koHAo/olAPtiKazY9sRe4D2k086x0EXRnrQRDfBOT1MI1v4y3HfSxX76O1Y+of/C/gT4ABAF8NZoZQo1V4AAAAAElFTkSuQmCC);
			}
			.submit-response
			{
				display: block;
				text-align: center;
				> span
				{
					padding-top: 15px;
					display: inline-block;
				}
				> span.has-error
				{
					color: rgb(241, 16, 16);
				}
			}
			.submit-cover
			{
				&.enabled
				{
					opacity: 1;
					.text
					{
						display: block;
						-webkit-transition: opacity .25s ease-out;
						transition: opacity .25s ease-out;
					}
				}
				.spin-cover,
				.spin-cover:after {
				  border-radius: 100%;
				  width: 1.2em;
				  height: 1.2em;
				  display: inline-block;
				}
				.spin-cover {
					opacity: 0;
				  margin: 0;
				  font-size: 12px;
				  position: absolute;
				  left: 50%;
				  margin-left: -3px;
				  top: 50%;
				  margin-top: -0.55em;
				  text-indent: -9999em;
				  border-top: 2px solid #000;
				  border-right: 2px solid #000;
				  border-bottom: 2px solid #000;
				  border-left: 2px solid transparent;
				  border-left-color: transparent !important;
				  -webkit-transform: translateZ(0);
				  -ms-transform: translateZ(0);
				  transform: translateZ(0);
				  -webkit-animation: loadAnimate 1.1s infinite linear;
				  animation: loadAnimate 1.1s infinite linear;
				  display: none;
				}
				&.disabled
				{
					.submit-button:hover
					{
						box-shadow: none;
					}
					.submit-button
					{
						opacity: .65;
					}
					.spin-cover
					{
						opacity: 1;
						display: block;
					}
					.text
					{
						opacity: 0;
						-webkit-transition: opacity .1s ease-out;
						transition: opacity .1s ease-out;
					}
				}
				.submit-button
				{
					box-shadow: none;
					height: auto;
					font-size: 1em;
					line-height: normal;
					position: relative;
					text-transform: none;
					margin-top: 0;
					margin-bottom: 0;
					font-weight: normal;
					padding: 9px 16px;
					border: 1px solid rgba(0,0,0,.1);
					border-radius: 2px;
					width: auto;
					&:hover {
						box-shadow: 0px 0px 100px rgba(0,0,0,.03) inset;
					}
				}
			}
			.checkbox-cover
			{
				> div
				{
					padding-bottom: 4px;
					padding-top: 5px;
					border-radius: 2px;
					border: 1px solid transparent;
					transition: padding .15s linear;
					-webkit-transition: padding .15s linear;
				}
				> div label
				{
					padding: 3px 10px 3px 0;
					display: inline-block;
					cursor: pointer;
					input
					{
						position: relative;
						top: 1px;
					}
					> span
					{
						vertical-align: middle;
					}
				}
			}
			.submit-cover
			{
				&.wide-true
				{
					.submit-button
					{
						width: 100%;
					}
				}
			}

		}
		.form-element.even
		{
			.form-options:before
			{
				content: '';
				width: 0; 
				height: 0; 
				border-top: 7px solid transparent;
				border-bottom: 7px solid transparent; 
				border-right:7px solid #d3d3d3;
				position: absolute;
				left: 0;
				margin-left: -7px;
				top: 53px;
				z-index: 101;
			}
			.form-options:after
			{
				content: '';
				width: 0; 
				height: 0; 
				border-top: 6px solid transparent;
				border-bottom: 6px solid transparent; 
				border-right:6px solid #f8fafc;
				position: absolute;
				left: 0;
				margin-left: -5px;
				top: 54px;
				z-index: 102;
			}
		}
		.form-element.odd
		{
			.form-options:before
			{
				content: '';
				width: 0; 
				height: 0; 
				border-top: 7px solid transparent;
				border-bottom: 7px solid transparent; 
				border-left: 7px solid #d3d3d3;
				position: absolute;
				right: 0;
				margin-right: -7px;
				top: 53px;
				z-index: 101;
			}
			.form-options:after
			{
				content: '';
				width: 0; 
				height: 0; 
				border-top: 6px solid transparent;
				border-bottom: 6px solid transparent; 
				border-left:6px solid #f8fafc;
				position: absolute;
				right: 0;
				margin-right: -5px;
				top: 54px;
				z-index: 102;
			}
		}
		.form-options
		{
			display: block;
			font-size: 13px;
			letter-spacing: -4px;
			position: absolute;
			width: 330px;
			box-shadow: 0 0 0 0.5px rgba(0,10,20,.12), 0 2px 12px 0 rgba(0,10,20,.18);
			top: -30px;
			background: white;
			border-radius: 2px;
			input[type="text"],
			input[type="password"],
			input[type="checkbox"],
			input[type="color"],
			input[type="email"],
			input[type="number"],
			input[type="password"],
			input[type="radio"],
			input[type="tel"],
			input[type="text"],
			input[type="time"],
			input[type="url"],
			input[type="week"],
			select,
			textarea
			{
				background-color: white;
			}			
			.align-icons > label
			{
				font-size: 1.56em;
				color: #aaa;
				&.active
				{
					color: #555;
				}
			}
			> div
			{
				letter-spacing: 0;
			}
			.options-main
			{
				background-color: #f8fafc;
				padding: 10px 0 2px 15px;
				text-align: left;
				border-radius: 0 0 2px 2px;
			}
			.sub-options
			{
				border-radius: 2px 2px 0 0;
				border-bottom: 1px solid #ddd;
				border-radius: 2px 2px 0 0;
				background-color: white;
				text-align: left;
				padding: 10px 10px;
				font-size: 15px;
				> div
				{
					display: inline;
					cursor: auto;
					text-transform: uppercase;
					letter-spacing: .5px;
					font-size: 90%;
					padding: 0px 3px;
					font-weight: 500;
				}
				.delete {
					transform: rotate(45deg);
					color: #e86464;
				}
				.duplicate {
					color: #47b181;
				}
				> span
				{
					font-size: 105%;
					float: right;
					cursor: pointer;
					font-weight: bold;
					opacity: .6;
					display: inline-block;
					padding: 2px;
					margin: -2px 0;
				}
				> span:hover
				{
					opacity: 1;
				}
			}
			.w-1,.w-2,.w-3,.w2-1,.w2-2
			{
				letter-spacing: 0;
				padding-right: 15px;
				font-size: 90%;
				white-space: nowrap;
				margin-bottom: 12px;
				input[type="text"], textarea, select
				{
					width: 100%;
					margin: 0;
					margin-top: 8px;
				}
				p
				{
					margin: 0;
					width: 100px;
					padding-right: 8px;
					display: inline-block;
					font-weight: bold;
					font-size: 11px;
					color: #777;
				}
				.tooltip
				{
					white-space: normal;
					width: 220px;
					max-width: 220px;
				}
				.tooltip-icon
				{
					position: absolute;
					right: 25px;
					font-size: 18px;
					text-align: center;
					top: 0;
				}
			}
			.wp-picker-holder
			{
				z-index: 101;
			}
			.wp-picker-input-wrap input[type="text"]
			{
				max-width: 67px;
				margin: 0;
			}
			.w2-1
			{
				display: inline-block;
				width: 50%;
			}
			.w-3,.w2-3
			{
				display: block;
				width: 100%;
			}
			.w-2
			{
				display: inline-block;
				width: 66.6%;
			}
			.w-1
			{
				display: inline-block;
				width: 33.3%;
				&.last
				{
					width: 33.4%;
				}
			}
			label, div.label
			{
				position: relative;
				display: inline-block;
				> span
				{
					position: absolute;
					font-size: 12px;
					line-height: 10px;
					left: 10px;
					top: 2px;
					font-weight: 600;
					background: white;
				}
			}
		}
		.form-options.ng-hide
		{
			display: none;
		}
		.even .form-options
		{
			right: 0;
			margin-right: -352px;
		}
		.odd .form-options
		{
			left: 0;
			margin-left: -352px;
		}
		.odd .form-options
		{
			transform-origin: 0;
			-webkit-animation: fadeInLeft .25s;
			animation: fadeInLeft .25s;
		}
		.odd .form-options.ng-hide.ng-hide-animate
		{
			display: block;
			-webkit-animation: fadeOutLeft .25s;
			animation: fadeOutLeft .25s;
		}
		.even .form-options
		{
			transform-origin: 0;
			-webkit-animation: fadeInRight .25s;
			animation: fadeInRight .25s;
		}
		.even .form-options.ng-hide.ng-hide-animate
		{
			display: block;
			-webkit-animation: fadeOutRight .25s;
			animation: fadeOutRight .25s;
		}
		.options-panel
		{
			position: absolute;
			left: -10px;
			top: 50%;
			font-size: 13px;
			padding: 1px 1px;
			margin-top: -10px;
			z-index: 101;
		}
		.drag-icon {
			font-weight: bold;
			color: #999;
			font-size: 17px;
			background-color: white;
			border: 2px solid #999;
			border-radius: 100%;
		}
		.icon-move
		{

		}
	}
}

#form-cover
{
	.form-spinner
	{
		margin-top: 50px;
	}
	.form-spinner > div
	{
		background-color: #999;
		width: 15px;
		margin: 0 1px;
		height: 15px;
	}
	.fcb_form
	{
		max-width: 100%;
		.options-panel,
		.form-options
		{
			display: none;
		}
	}
}