@import '../default.less';
@import '../mixins.less';
//DON'T ADD IMPORTS, ABOVE ARE TO MAKE INTELLISENSE WORK

.contact-form
{
	text-align: center;
	padding: 20px 0 40px 0;
	margin-bottom: 40px;

	h2
	{
		font: 1.4em @title-font;
		text-align: center;
		margin: 10px 0 30px 0;
	}

	input
	{
		width: 230px;
		font-size: 0.9em;
		.margin-left-right(0, 10px);
		border: 1px solid #99d1e9;
		vertical-align: top;

		&.error
		{
			border: 1px solid #e42b2b;
		}

		html[dir='rtl'] &
		{
			.margin-left-right(10px, 0);
		}

		&[type="text"], &[type="email"], &[type="number"]
		{
			padding: 10px;
		}

		&[type="submit"]
		{
			display: inline-block;
			width: auto;
			padding: 8px 35px;
			background-color: #5DA90B;
			border: 0;
			color: white;
			border-radius: 3px;
			text-decoration: none;
			font: bold 1.01em @title-font;

			&:hover
			{
				background-color: #6db421;
			}
		}
	}

	&.short
	{
		background-color: #f0f9fe;
		
		input[type="email"]
		{
			padding: 9px;
		}

	}

	&.long
	{
		.properties
		{
			margin: auto;
			width: 350px;
			background-color: #f0f9fe;
			padding: 40px;
			border-radius: 5px;
		}

		input
		{
			display: block;
			width: 330px;
			margin-bottom: 20px;

			&[type="submit"]
			{
				width: auto;
				margin: auto;
			}
		}
	}

	&.done
	{
		background-color: #f0f9fe;

		.check-ico
		{
			.hires('/img/business/ico-check-green2');
			background-position: center center;
			width: 80px;
			height: 80px;
			margin: auto;
		}
	}

	#captcha-placeholder
	{
		width: 310px;
		margin: auto;
		margin-top: 10px;
	}
}