/*
	css файл модуля Контакты
	© 2013 AVE CMS
	manufactured by Chikk
	website:	http://chikk.ru/
	
	основан на стилях SLICK AND CLEAN CSS3 QUESTIONNAIRE FORM
	author:		Capelle
	website:	http://codecanyon.net/user/Capelle
	
	файл стилей предназначен для оформления базового шаблона
	при изменении шаблона не забывайте удалить/изменить файл
	
	не забывайте, что данная форма была сделана и протестирована
	в неком сферическом вакууме. на рабочем сайте могут иметь место
	быть перекрытия стилей и несовместимость скриптов.
*/

/* импорт шрифта для иконок */

@import url(http://weloveiconfonts.com/api/?family=fontawesome);

#form-main:hover,
#form-main:hover+label,
#form-main input:hover,
#form-main a:hover,
label:hover {
	-moz-transition: all .1s ease-in-out;
	-ms-transition: all .1s ease-in-out;
	-o-transition: all .1s ease-in-out;
	transition: all .1s ease-in-out;
	-webkit-transition: all .1s ease-in-out;
}
#form-main {
	color: #505050;
	font-family: Arial, Helvetica, Verdana, Lucida, Geneva, sans-serif;
	position: relative;
	width: 630px;
	margin: 0 auto;
}
#form-main b {
	color: #A08040;
	font-weight: normal;
}
.questionnaire-form {
	height: auto;
	padding: 0 20px;
	z-index: 1;
}
[class^="icon-"],[class*=" icon-"] {
	font-family: "FontAwesome", sans-serif;
}
#form-main .questionnaire-form h5 {
	color: #4f4e4c;
	display: inline-block;
	font-size: 12px;
	font-weight: normal;
	line-height: normal;
	text-transform: uppercase;
}
#form-main p.intro,
#form-main .special-window p {
	display: inline-block;
	font-family: Arial, Helvetica, sans-serif;
	line-height: 16px;
	-webkit-backface-visibility: hidden;
}
.special-window p {
	margin: 0 0 10px 0;
}
#form-main p.intro {
	font-size: 15px;
	color: #999;
	margin: 20px 0;
	width: 100%;
}
::-webkit-input-placeholder {
	color: #4f4e4c;
}
:focus::-webkit-input-placeholder {
	color: transparent;
}
:-moz-placeholder {
	color: #4f4e4c;
	opacity: 1;
}
:focus:-moz-placeholder {
	color: transparent;
}
::-moz-placeholder {
	color: #4f4e4c;
	opacity: 1;
}
:focus::-moz-placeholder {
	color: transparent;
}
:-ms-input-placeholder {
	color: #4f4e4c;
}
:focus:-ms-input-placeholder {
	color: transparent;
}
.ie9-placeholder {
	color: #4f4e4c!important;
}
.ie9-placeholder:focus {
	color: transparent;
}
.field input:required,.field textarea:required,.field select:required {
	background: #dadada url(../images/required.png) no-repeat 396px 13px;
	outline: 0;
}
.field input:hover:invalid,.field textarea:hover:invalid,.field select:hover:invalid {
	background: #dadada url(../images/hovered.png) no-repeat 396px 13px;
	box-shadow: none;
	outline: 0;
}
.field input:required:valid,.field textarea:required:valid,.field select:required:valid {
	background: #dadada url(../images/valid.png) no-repeat 396px 13px;
	outline: 0;
}
.field input:focus:invalid,.field textarea:focus:invalid,.field select:focus:invalid {
	background: #dadada url(../images/invalid.png) no-repeat 396px 13px;
	box-shadow: none;
	outline: 0;
	z-index: 10;
}
.left-block,
.right-block {
	display: block;
	/*float: left;*/
	position: relative;
	width: 420px;
}
.left-block {
	/*margin-right: 60px;*/
}
.fields {
	width: 100%;
}
.field {
	clear: both;
	float: left;
	position: relative;
	width: 100%;
}
.field input,
.field textarea,
.field select {
	border: solid 1px #333;
	clear: both;
	color: #4f4e4c;
	font-family: Arial,Helvetica,sans-serif;
	font-size: 13px;
	margin: 10px 0;
	padding: 10px 38px 10px 30px;
	position: relative;
	width: 350px;
	z-index: 1;
	border-radius: 5px;
}
.field select {
	appearance: none;
	background: #dadada;
	height: 38px;
	-moz-appearance: none;
	padding: 9px 10px 9px 30px;
	-webkit-appearance: none;
	width: 440px;
	z-index: 2;
}
.disabled {
	display: none;
}
.field option:hover {
	background: #4f4e4c;
}
.field textarea {
	height: 140px;
	max-height: 140px;
	max-width: 350px;
	overflow: auto;
	resize: none;
	
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
.field textarea:focus {
	height: 200px;
	max-height: 200px;
}
.field textarea.message:focus {
	height: 140px;
	max-height: 140px;
}
.field input:hover ~ p,.field input:focus ~ p,.field textarea:hover ~ p,.field textarea:focus ~ p,.field select:hover ~ p,.field select:focus ~ p {
	color: #4f4e4c;
	outline: 0;
}
.field>input:hover,.field>input:focus,.field>textarea:hover,.field>textarea:focus,.field>select:hover,.field>select:focus {
	/*
	border: solid 1px #4f4e4c;
	*/
	outline: 0;
}
#arrow-select,
#arrow-select-svg {
	background: #dadada url(../images/arrow-down.png) no-repeat right;
	border: 0;
	height: 36px;
	outline: 0;
	pointer-events: none;
	position: absolute;
	right: 1px;
	top: 11px;
	vertical-align: middle;
	width: 44px;
	z-index: 3;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
	#arrow-select-svg {
		display: none;
	}
}
x:-o-prefocus,#arrow-select {
	display: none;
}
.upload {
	background: #ccc;
	color: #fff;
	cursor: pointer;
	float: left;
	font-size: 11px;
	height: auto;
	margin: 20px 0 0 0;
	overflow: hidden;
	padding: 6px 14px;
	position: relative;
	width: auto;
}
.upload span {
	font-family: "FontAwesome";
	font-size: 14px;
	padding-right: 10px;
	vertical-align: middle;
}
.upload:hover {
	background: #A08040;
	cursor: pointer;
}
.upload input {
	cursor: pointer;
	display: block;
	filter: alpha(opacity:0);
	height: 100%;
	left: 0;
	-moz-opacity: 0;
	opacity: 0;
	position: absolute;
	top: 0;
	width: 100%;
	z-index: 2;
}
.upload:hover input {
	display: block;
}
p.subject,p.name,p.company,p.web,p.email,p.phone,p.service,p.timeframe,p.budget,p.timeframe,p.overview {
	color: #ccc;
	left: 10px;
	position: absolute;
	top: 20px;
	z-index: 10;
}
p.email,p.timeframe {
	font-size: 14px;
	padding-top: 2px;
}
p.company,p.phone {
	font-size: 18px;
}
p.service,p.subject {
	top: 21px;
}
input.send {
	background: #4f4e4c;
	border: 0;
	clear: none;
	color: #fff;
	display: inline-block;
	float: right;
	font-size: 13px;
	margin: 20px 0 0 5px;
	outline: 0;
	padding: 6px 28px;
	width: auto;
	border-radius: 5px;
}
input.send:hover {
	background: #6e6e6e;
	border: 0;
	cursor: pointer;
	outline: 0;
}
input.send:focus {
	border: 0;
	outline: 0;
}





input[type="checkbox"].check {
	display: none;
}
input[type="checkbox"].check+label {
	color: #bbb;
	display: inline-block;
	font-size: 11px;
	line-height: 20px;
	margin: 26px 0 0 0;
	padding: 11px 0;
}
input[type="checkbox"].check+label span {
	font-size: 18px;
}
input[type="checkbox"].check+label span:before {
	content: "\f096";
	cursor: pointer;
	display: inline-block;
	float: left;
	font-family: 'FontAwesome',sans-serif;
	margin: 0 8px 0 0;
}
input[type="checkbox"].check:checked+label span:before {
	color: #4f4e4c;
	content: "\f046";
	font-family: 'FontAwesome',sans-serif;
}
.field-check-red-title {
	color: #4f4e4c;
	font-family: Arial,Helvetica,sans-serif;
	font-size: 13px;
	margin: 20px 0;
}
input.field-check-red[type="checkbox"]+label {
	margin: 8px 26px 0 0;
}
input[type="checkbox"].field-check-red:checked+label span:before {
	color: #A08040;
}
.field-check {
	border: 0;
	outline: 0;
	z-index: 5;
}
.field-check input[type="radio"] {
	display: none;
}
.field-check label {
	background: #ccc;
	color: #fff;
	cursor: pointer;
	display: inline-block;
	font-size: 11px;
	font-weight: bold;
	padding: 6px 14px;
}
.field-check label:hover {
	background: #A08040;
}
.field-check input[type="radio"]:checked+label {
	background: #A08040;
}
.terms {
	color: #bbb;
	float: left;
	font-size: 10px;
	margin: 27px 0 18px 0;
	position: relative;
}
.terms a {
	color: #4f4e4c;
}
.terms-window {
	background: rgba(0,0,0,0.8);
	bottom: 0;
	left: 0;
	moz-transition: opacity 200ms ease-in;
	opacity: 0;
	pointer-events: none;
	position: fixed;
	right: 0;
	top: 0;
	transition: opacity 200ms ease-in;
	visibility: hidden;
	webkit-transition: opacity 200ms ease-in;
	z-index: 9999;
}
.terms-window:target {
	opacity: 1;
	pointer-events: auto;
	visibility: visible;
}
.terms-window>div {
	background: #fff;
	height: auto;
	margin: 10% auto;
	overflow: auto;
	padding: 40px;
	position: relative;
	width: 440px;
}
.terms-window p span,
.special-window p span {
	color: #4f4e4c;
	display: inline-block;
	font-size: 14px;
	font-weight: bold;
	padding: 20px 0 8px 0;
	width: 100%;
}







.special-window p span {
	padding: 0 0 8px 0;
}
.special {
	bottom: 0;
	display: block;
	float: left;
	left: 0;
	margin-top: 14px;
	position: relative;
}
a.special,a.special:hover {
	color: #A08040;
	font-size: 18px;
	text-decoration: none;
}
.special-window {
	background: #fff;
	bottom: auto;
	box-shadow: 0 0 6px 0 rgba(0,0,0,0.5);
	height: auto;
	left: auto;
	-moz-transition: opacity 200ms ease-in;
	opacity: 0;
	pointer-events: none;
	position: absolute;
	right: -246px;
	top: -240px;
	transition: opacity 200ms ease-in;
	visibility: hidden;
	-webkit-transition: opacity 200ms ease-in;
	width: 320px;
	z-index: 9999;
}
.special-window:target {
	opacity: 1;
	pointer-events: auto;
	visibility: visible;
}
.special-window>div {
	margin: 0;
	padding: 22px;
	position: relative;
	width: auto;
}
.special-window:before,.special-window:after {
	border-left: 10px solid transparent;
	border-right: 10px solid transparent;
	border-top: 9px solid rgba(187,187,187,0.6);
	bottom: -10px;
	content: '';
	height: 0;
	left: 66px;
	margin-left: -10px;
	position: absolute;
	width: 0;
}
.special-window:after {
	border-top: 8px solid #fff;
	bottom: -8px;
	margin-left: -10px;
}
.special-wrap {
	border-bottom: solid 6px #f0f0f0;
	display: block;
	float: left;
	margin: 10px 0;
	padding: 6px 0 14px 0;
	width: 100%;
}
.special-price {
	color: #A08040;
	float: right;
	font-family: "Arial",cursive;
	font-size: 60px;
	font-weight: normal;
}
.special-price span {
	display: inline-block;
	font-size: 24px;
	margin-top: 20px;
	padding: 0 0 0 4px;
	vertical-align: top;
}
.special-product {
	color: #A08040;
	float: left;
	font-size: 14px;
	font-weight: bold;
	text-transform: uppercase;
}
.special-product span {
	border-top: solid 1px #ccc;
	color: #bbb;
	display: block;
	font-size: 10px;
	font-weight: normal;
	margin-top: 4px;
	padding-top: 4px;
	text-transform: none;
}
.special-go {
	color: #bbb;
	display: inline-block;
	font-size: 11px;
	margin-top: 8px;
	width: 100%;
}
.special-go a {
	background: #4f4e4c;
	color: #fff;
	font-size: 10px;
	font-weight: bold;
	margin-right: 30px;
	padding: 4px 8px;
	text-decoration: none;
}
.special-go a:hover {
	background: #A08040;
	color: #fff;
}
a.close2 {
	background: 0;
	bottom: auto;
	color: #bbb;
	font-size: 14px;
	font-weight: normal;
	left: auto;
	line-height: 25px;
	margin: 0;
	position: absolute;
	right: 8px;
	text-align: center;
	text-decoration: none;
	top: 14px;
	width: 24px;
}
a.close2:hover {
	background: 0;
	color: #4f4e4c;
}
.field p:hover {
	color: #4f4e4c;
	outline: none;
}


/* информационные сообщения */

#form-main .message-info {
	color: #A08040;
	font-size: 14px;
	text-align: center;
	text-transform: uppercase;
	padding: 10px 5px;
	margin: 10px 0;
	background: rgba(255,255,255,0.5);
}
#form-main .star {
	color: #A08040;
	font-family: "Times New Roman", Georgia, Times, serif;
	font-size: 14px;
}

/* капча */

.field .securecode-image {
	float: right;
	height: 55px;
}
.field .securecode-image img {
	background: #dadada;
	border: solid 1px #333 !important;
	border-radius: 5px !important;
}

/* самый важный элемент сайта */

.clear {
	clear: both;
}




