@charset "utf-8";

/* Google fonts */
@import url('//fonts.googleapis.com/css?family=PT+Serif&subset=cyrillic,latin,cyrillic-ext,latin-ext');

/* CSS Document */

/* General settings */

*{
	text-decoration:none;
}

*:focus{
	outline:none;
}

html, body, div, ul, li, dl, dt, dd, h1, h2, h3, a, p, span, img{
	margin:0;
	padding:0;
}

html, body, div, ul, dl, h1, h2, h3, a, p, span, textarea{
	font-family: 'PT Serif', Tahoma, Geneva, sans-serif;
	font-size: 14px;
	line-height: 1.1em;
	letter-spacing: 0ex;
}

ul, img{
	display:block;
}

img{
	border:none;
}


html, body{
	height: 100%;
	/*overflow: auto;	/* ч/б body однозначно растягивался и под плавающие элементы - в нашем случае под wrapper +
					   благодаря этому трюку полоса прокрутки теперь принадлежит body, а не html, что при наложении поверх страницы
					   полупрозрачной подложки приводит к перекрытию этой подложкой полосы прокрутки */
	/*position: relative;		/* ч/б расчет относительных значений в дочерних absolute-блоках велся от body */
	/*width: 100%;
	width:1000px;
	margin:0 auto;*/
}

html{
	background-color:white;
}

/* reset all to left */
input, div, label, img, input[type="password"], input[type="text"], #recaptcha, .captcha, p{
	float:left;
}

/* reset input fields */
input[type="password"], input[type="text"] {
	width:280px;
	height:23px;
	margin-left:15px;
	margin-right: 26px;
	margin-top:8px;
	background:none;
	border:none;
	font-size:18px;
	color: #cfcfcf;
	text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.7);
	box-sizing: content-box;
	-moz-box-sizing: content-box;
}

/* Opera fix */
select > option {
	background-color: white;
	/* IE counter-fix */
	background-color: transparent\9;
}

#wrapper { 
	width: 100%;
	min-height: 100%;
	height: auto !important;
	height: 100%;
	position: relative;
}

#content{
	height: 100%;
	position: relative;
	left: 50%;
	display:block;
	/*float:left;*/
	clear: both;
}

#wrapper > #content:first-child {
	margin-top: 10px;
}

/* === splash layer === */

/* splash backend */

._splash-backend {
	position: absolute;
	display: block;
	left: 0px; top: 0px; right: 0px; bottom: 0px;
	z-index: 1100; zoom: 1;
	background: none;
}

._splash-backend:before {
	position: absolute;
	left: 0; top: 0; right: 0; bottom: 0;
	z-index: -1;
	background-color: #7f7f7f;
	opacity: 0.5; 
	filter:alpha(opacity=50);
	content: '';
}

/* splash layer */

._splash-layer {
	position: fixed;
	float: none;
	/*display: table !important;
	display: block;	/* IE vertical-align fix */
	text-align: center;
	display: block;
	width: 100%;
	height: 100%;
}

/* http://css-tricks.com/centering-in-the-unknown/ */
._splash-layer:before {
	content: '';
	height: 100%;
	display: inline-block;
	width: 0;
	margin-right: -0.25em;
	vertical-align: middle;
}

/*._splash-layer > div {
	float: none;
	display: table-cell !important;
	display: block; /* IE vertical-align fix * /
	height: 100%;
	vertical-align: middle;
	text-align: center;
}*/

._splash-layer /*> div*/ > span {
	float: none;
	display: inline-block;
	vertical-align: middle;
	max-height: 98%;
	max-width: 98%;
	overflow: auto;

	padding: 3px;
}

/* splash-wnd */

._splash-wnd {
	display: block;
	background: none;
	float: none;
}

._splash-wnd > h1:first-child {
	display: block;
	float: none;
	height: 21px;
	padding: 10px 20px;
	background-color: #003ed9;
	background: url(/public/assets/images/f_hdr_bgsm.png) repeat-x left top #1e44d3;
	border: 2px solid #fff;
	border-radius: 28px 28px 0px 0px;
	box-shadow: 0px -1px 2px #666;
	-webkit-box-shadow: none !important;
	font-size: 1.3em;
	font-weight: normal;
	color:#fff;
	text-shadow:1px 1px 1px rgba(0,0,0,.45);
	position: relative;
}

._splash-wnd > div {
	display: block;
	float: none;
	padding: 10px 15px 15px;
	background-color: #fff;
	border-top: 1px solid #999;
	border-left: 2px solid #fff;
	border-right: 2px solid #fff;
	border-bottom: 2px solid #fff;
	border-radius: 0px 0px 28px 28px;
	box-shadow: 0px 2px 2px #666;
	overflow: auto;
}

/* === === === */

#contacts-panel {
	display: block;
	float: none;
	margin-bottom: 35px;
}

#contacts-panel > div {
	border: 1px solid #E8E8E8;
	border-radius: 12px;
	background: white;
	float: right;
	position: relative;
	overflow: hidden;
	padding-right: 10px;
	height: 26px;

	width: 220px;

	background: #ffffff; /* Old browsers */
	background: -moz-linear-gradient(top,  #ffffff 0%, #fefefe 6%, #fcfcfc 12%, #fbfbfb 18%, #fafafa 24%, #f9f9f9 30%, #f8f8f8 36%, #f7f7f7 42%, #f6f6f6 48%, #f5f5f5 54%, #f4f4f4 60%, #f3f3f3 66%, #f2f2f2 72%, #f1f1f1 78%, #f0f0f0 84%, #f3f3f3 90%, #f9f9f9 100%, #f9f9f9 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(6%,#fefefe), color-stop(12%,#fcfcfc), color-stop(18%,#fbfbfb), color-stop(24%,#fafafa), color-stop(30%,#f9f9f9), color-stop(36%,#f8f8f8), color-stop(42%,#f7f7f7), color-stop(48%,#f6f6f6), color-stop(54%,#f5f5f5), color-stop(60%,#f4f4f4), color-stop(66%,#f3f3f3), color-stop(72%,#f2f2f2), color-stop(78%,#f1f1f1), color-stop(84%,#f0f0f0), color-stop(90%,#f3f3f3), color-stop(100%,#f9f9f9), color-stop(100%,#f9f9f9)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #ffffff 0%,#fefefe 6%,#fcfcfc 12%,#fbfbfb 18%,#fafafa 24%,#f9f9f9 30%,#f8f8f8 36%,#f7f7f7 42%,#f6f6f6 48%,#f5f5f5 54%,#f4f4f4 60%,#f3f3f3 66%,#f2f2f2 72%,#f1f1f1 78%,#f0f0f0 84%,#f3f3f3 90%,#f9f9f9 100%,#f9f9f9 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #ffffff 0%,#fefefe 6%,#fcfcfc 12%,#fbfbfb 18%,#fafafa 24%,#f9f9f9 30%,#f8f8f8 36%,#f7f7f7 42%,#f6f6f6 48%,#f5f5f5 54%,#f4f4f4 60%,#f3f3f3 66%,#f2f2f2 72%,#f1f1f1 78%,#f0f0f0 84%,#f3f3f3 90%,#f9f9f9 100%,#f9f9f9 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #ffffff 0%,#fefefe 6%,#fcfcfc 12%,#fbfbfb 18%,#fafafa 24%,#f9f9f9 30%,#f8f8f8 36%,#f7f7f7 42%,#f6f6f6 48%,#f5f5f5 54%,#f4f4f4 60%,#f3f3f3 66%,#f2f2f2 72%,#f1f1f1 78%,#f0f0f0 84%,#f3f3f3 90%,#f9f9f9 100%,#f9f9f9 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #ffffff 0%,#fefefe 6%,#fcfcfc 12%,#fbfbfb 18%,#fafafa 24%,#f9f9f9 30%,#f8f8f8 36%,#f7f7f7 42%,#f6f6f6 48%,#f5f5f5 54%,#f4f4f4 60%,#f3f3f3 66%,#f2f2f2 72%,#f1f1f1 78%,#f0f0f0 84%,#f3f3f3 90%,#f9f9f9 100%,#f9f9f9 100%); /* W3C */
	/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f9f9f9',GradientType=0 ); /* IE6-9 */
}

/*#contacts-panel > div:before {
	display: inline-block;
	content: 'Контактные телефоны';
}*/

#contacts-panel > div > select {
	background: none;
	background: transparent;
	background: rgba(0,0,0,0);	/* Opera */
	padding: 0;
	margin: 0;
	height: 26px;
	border: none;
	font-size: 16px;
	width: 270px;
	position: relative;
	z-index: 10;
	padding-top: 3px;
	padding-left: 8px;
}

#contacts-panel > div:after {
	width: 26px;
	height: 26px;
	border-left: 1px solid #E8E8E8;
	position: absolute;
	right: 0px;
	text-align: center;
	content: '\25bc';
	line-height: 26px;
	font-size: 12px;
	top: 0px;
	color: #BBBBBB;
}

/* === [===] === */

/* elements */

a, a:visited, a:active {
	color: #03F;
	text-decoration: none;
}
		
a:hover {
	text-decoration: underline;
}


/*input[type="button"] {
	font-family: Tahoma;
}*/

.apply, .append, .remove {
	width: 90px;
	height: 38px;
	background-position: left top;
	background-repeat: no-repeat;
	background-color: transparent;
	border: none;
	color: #F2F2F2;
	text-shadow: 1px rgba(0,0,0,.65);
	font-size: 11px;
	font-weight: normal;
	padding-top: 3px;
	padding-bottom: 5px;
}

.apply {
	background-image: url(/public/assets/images/button_apply.png);
}

.append {
	background-image: url(/public/assets/images/button_green.png);
}

.remove {
	background-image: url(/public/assets/images/button_red.png);
}

.apply:hover, .append:hover, .remove:hover  {
	background-position: left bottom;
}

.apply[disabled], .append[disabled], .remove[disabled]{
	background-position: left center;
}

.choice-panel {
	position: relative;
	padding-bottom: 1px;
	float: left;
}

.choice-panel[data-title]:before {
	content: attr(data-title) ':';
	float: left;
	margin-right: 10px;
	padding: 9px 0;
}

.choice-panel > input[type='radio'] {
	/*visibility: hidden;*/			/* not applicable due to stupid IE */
	position: absolute;
	z-index: -1;
	width: 0;
	height: 0;
	/*opacity: 0;*/
	left: -9999px;
}

/* Особая кнопка - perform - с 2 состояниями */
.perform,
.choice-panel > input[type='radio'] + label {
	padding:10px 20px;
	min-width:60px;
	width:auto;
	height:40px;

	border:1px solid #cecece;
	border-radius:20px;

	font-size: 11px;
	color:#666;

	background: -moz-linear-gradient(top,  #f8f8f8 3%, #e8e8e8 22%, #f2f2f2 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(3%,#f8f8f8), color-stop(22%,#e8e8e8), color-stop(100%,#f2f2f2)); /* Chrome, Safari4+ */
	background: -webkit-linear-gradient(top,  #f8f8f8 3%,#e8e8e8 22%,#f2f2f2 100%); /* Chrome10+, Safari5.1+ */
	background: -o-linear-gradient(top,  #f8f8f8 3%,#e8e8e8 22%,#f2f2f2 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #f8f8f8 3%,#e8e8e8 22%,#f2f2f2 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #f8f8f8 3%,#e8e8e8 22%,#f2f2f2 100%); /* W3C */
	/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f8f8f8', endColorstr='#f2f2f2',GradientType=0 ); NO! /* IE6-9 */
	background-color: #f8f8f8; /* Old browsers */
}

.choice-panel > input[type='radio'] + label {
	height: auto;
	margin-right: 10px;
	float: left;
	cursor: pointer;
	font-size: 14px;
}

.perform.granted,
.choice-panel > input[type='radio'].checked + label {	/* due to stupid IE */

	border:1px solid #390;

	color:#FFF;
	text-shadow:1px 1px 1px #666;

	background: -moz-linear-gradient(top,  #e6ede5 0%, #01781c 45%, #0ba53e 85%, #01c720 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e6ede5), color-stop(45%,#01781c), color-stop(85%,#0ba53e), color-stop(100%,#01c720)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #e6ede5 0%,#01781c 45%,#0ba53e 85%,#01c720 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #e6ede5 0%,#01781c 45%,#0ba53e 85%,#01c720 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #e6ede5 0%,#01781c 45%,#0ba53e 85%,#01c720 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #e6ede5 0%,#01781c 45%,#0ba53e 85%,#01c720 100%); /* W3C */
	/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6ede5', endColorstr='#01c720',GradientType=0 ); NO! /* IE6-9 */
	background-color: #0ba53e; /* Old browsers */
}

/* CSS3: w/o stupid IE */
.choice-panel > input[type='radio']:checked + label {

	border:1px solid #390;

	color:#FFF;
	text-shadow:1px 1px 1px #666;

	background: -moz-linear-gradient(top,  #e6ede5 0%, #01781c 45%, #0ba53e 85%, #01c720 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e6ede5), color-stop(45%,#01781c), color-stop(85%,#0ba53e), color-stop(100%,#01c720)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #e6ede5 0%,#01781c 45%,#0ba53e 85%,#01c720 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #e6ede5 0%,#01781c 45%,#0ba53e 85%,#01c720 100%); /* Opera 11.10+ */
	background: linear-gradient(to bottom,  #e6ede5 0%,#01781c 45%,#0ba53e 85%,#01c720 100%); /* W3C */
	/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6ede5', endColorstr='#01c720',GradientType=0 ); NO! /* IE6-9 */
}

.perform.granted:hover,
.choice-panel > input[type='radio'] + label:hover {

	border:1px solid #390;

	color:#FFF;
	text-shadow:1px 1px 1px #666;

	background: -moz-linear-gradient(top,  #fef7ef 0%, #ff9616 45%, #ffba75 85%, #ffd392 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fef7ef), color-stop(45%,#ff9616), color-stop(85%,#ffba75), color-stop(100%,#ffd392)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #fef7ef 0%,#ff9616 45%,#ffba75 85%,#ffd392 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #fef7ef 0%,#ff9616 45%,#ffba75 85%,#ffd392 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #fef7ef 0%,#ff9616 45%,#ffba75 85%,#ffd392 100%); /* IE10+ */
	background: linear-gradient(to bottom,  #fef7ef 0%,#ff9616 45%,#ffba75 85%,#ffd392 100%); /* W3C */
	/* filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fef7ef', endColorstr='#ffd392',GradientType=0 ); /* IE6-9 */
	background-color: #ffba75; /* Old browsers */
}

.perform.granted[disabled] {
	opacity: 0.5;
}

input.right {
	float: right !important;
	clear: both;
	margin-top: 10px;
	margin-bottom: 10px;
}

/*label{
	color:#444;
	font-size:1.1em;
}*/

#recaptcha{
	width:220px;
	margin-top:10px;
	background:url(/public/assets/images/reload.png) right center no-repeat;
}

/* vertical distribution */
input[type="button"], #recaptcha, .captcha{
	clear:left;
}

.chained-left, input.chained-left[type="button"] {
	clear: none;
	float: left;
}

/* Registration button submit */
.form .submit{
	width:259px;
	height:57px;
	margin-top:20px;
	margin-bottom:20px;
	background:url(/public/assets/images/button_submit.png) left top no-repeat;
	border:none;
	color:#f2f2f2;
	text-shadow:rgba(0, 0, 0, .65) 1px 1px 1px;
	font-size:18px;
	display:block;
	float:left;
	clear:both;
}

.form .submit:hover{
	background-position:left bottom;
}

.form {
	width:100%;
	/*padding-left:100px;*/
}

.form .formHead{
	width: 100%;
	height:53px;
	/*margin-left: -100px;*/
	padding-bottom:35px;
	background:url(/public/assets/images/reg_middle.png) left top repeat-x;
	display: block;
	clear:both;
	position: relative;
	/*float:none;*/
}

.form .formHead h1{
	/*width:736px;*/
	/*height:65px;*/
	padding-top:15px;
	font-size:1.3em;
	font-weight:normal;
	color:#fff;
	text-shadow:1px 1px 1px rgba(0,0,0,.45);
	display:inline;
	float:left;
}


.form .formHead div.left {
	width:53px;
	height:53px;
	background:url(/public/assets/images/reg_left.jpg) left top no-repeat;
	display:inline;
	float:left;
}

.sysmenu-quit {
	font-size: 20px;
	/*line-height: none;*/
	color: #ccc;
	padding: 0 5px;
	border: 2px solid rgba(255,255,255,0.5);
	box-shadow: 0px 0px 5px #FFF;
	font-weight: 900;
	border-radius: 20px;
	font-family: sans-serif;
	cursor: pointer;
	position: absolute;
	top: 8px;
	/*left: 92%;*/
	right: 15px;
}

.sysmenu-quit:visited, .sysmenu-quit:active {
	color: #ccc;
}

.sysmenu-quit:hover {
	color: #FFF;
	border: 2px solid rgba(255,255,255,0.7);
	text-decoration: none;
}

.form .formHead .sysmenu-quit {
	top: 14px;
	right: 35px;
}

.form .formHead div.right{
	width:53px;
	height:53px;
	background:url(/public/assets/images/reg_right.jpg) right top no-repeat;
	display:inline;
	float:right;
}

.form .formBody {
	/*width: 100%;*/
	margin-left: 45px;
	margin-right: 45px;
	float: none;
	display: block;
	clear: both;
	/*height: 100%;*/
	/*padding-left:100px;* /
	/*padding-bottom:35px;*/
}

/*
.form .formBody div.left {
	width: 58px;
	height: 81%;
	position: absolute;
	margin-left: -100px;
	background:url(/public/assets/images/left_cont.jpg) left top repeat-y;
	/*display:inline;* /
	float: left;
}

.form .formBody div.right {
	width: 58px;
	height: 100%;
	position: absolute;
	/*margin-left:62px;* /
	background:url(/public/assets/images/right_cont.jpg) left top repeat-y;
	display:inline;
	float: right;
}

.form .formBody div.center {
	/*padding-left: 100px;* /
	padding-top: 30px;
	/*float: left;* /
}

/*
.form .formBody div.center > div,
.form .formBody div.center p, 
.form .formBody div.center > label, 
.form .formBody div.center hr
{
	margin-left: 100px;
}*/

.form .formBody > * {
	float: left;
	clear: left;
}

.form .formFoot{
	/*width:852px;*/
	width: 100%;
	height:53px;
	background:#fff url(/public/assets/images/center_dw.png) left top repeat-x;
	/*margin-left:-100px;*/
	padding-bottom:30px;
	/*display:block;*/
	float:left;
	/*clear:both;*/
}

.form .formFoot div.left {
	width:53px;
	height:53px;
	background:url(/public/assets/images/left_dw.jpg) left top no-repeat;
	display:inline;
	float:left;
}


.form .formFoot div.right{
	width:53px;
	height:53px;
	background:url(/public/assets/images/right_dw.jpg) right top no-repeat;
	display:inline;
	float:right;
}

/* first & last hr styling */
.form hr{
	width:100%;
	border-color:#fff;
	/*margin:30px 0 5px -74px;*/
	display: block;
	clear:both;
}

.form p {
	/*padding-right: 160px;*/
	margin-bottom: 20px;
	text-align: justify;
}

/*#content span {
	display: block;
}*/

#content div.failed, #content div.okey{
	margin-top:10px;
	padding-top:5px;
	padding-left:20px;
	background:url(/public/assets/images/result_okey.png) left bottom no-repeat;
	color:#333;
	float: left;
}

#content div.failed {
	background:url(/public/assets/images/result_fail.png) left bottom no-repeat;
}

#content div.prepared {
	display: none;
}

.helper{
    font-weight:bold;
	margin-top: 15px;
	margin-right: -40px;
	float: right;
	width: 125px;
	cursor: pointer;
}

.helper > span {
	color:#fff;
	background:url(/public/assets/images/help.png) no-repeat top right;
	display: inline-block;
	padding-right:34px;
	padding-top:5px;
	text-shadow:1px 1px 1px rgba(0,0,0,.45);
	font-size: 12px;
	padding-bottom: 5px;
	font-family: Tahoma;
}

/*--- ВЫПАДАЮЩИЕ ПУНКТЫ ---*/

.helper > ul{
	list-style:none;
	display: none; /* Скрываем за экраном, когда не нужно (данный метод лучше, чем display:none;) */
	margin-top: 12px;
	position: relative;
	z-index: 100;
}

.helper:hover > ul { /* Выводим выпадающий пункт при наведении курсора */
    display: block; /* Приносим его обратно на экран, когда нужно */
}

.helper > ul > li > a{
	display:block;
	padding:10px;
	color:#666;
	background:url(/public/assets/images/helper_operations.png) no-repeat left top;
	height: 20px;
	font-size: 12px;
	width:106px;
	text-decoration:none;
}

.helper > ul > li > a:hover{ /* Устанавливаем стили для выпадающих пунктов, когда курсор наводится на конкретный пункт */
	background-position: left -40px;
	text-decoration:none;
}

.helper > ul > li > a.end {
	background-position: left -80px;
}

.helper > ul > li > a.end:hover{
	background-position: left bottom;
}

.helper > ul > li{
	padding-top:0px; /* Вводим отступ между li чтобы создать иллюзию разделенных пунктов меню */
	float:none;
}

.helper > ul > li > a{
	white-space:nowrap; /* Останавливаем перенос текста и создаем многострочный выпадающий пункт */
	display:block;
	text-decoration:none;
}

/* стандартный стилизированный список */
ul.gen-styled {
	list-style-image: url("/public/assets/images/reg_ul.png");
	margin-bottom: 10px;
	list-style-position: inside;
}

ul.gen-styled li {
	margin-bottom: 8px;
	color: #333333;
	text-align: left;
}

/* -------------------------------------------------------------------------------- */

/* inputs - field, noted-field, complete-field, complete-field.marked, date-layer, captcha-layer, captcha-layer.compact */

/* ATN!!! Без refneed */

.complete-field,
.date-layer,
.captcha-layer,
.textarea-field {
	display: block;
	margin-top: 3px;
}

.complete-field > *,
.date-layer > *,
.captcha-layer > *,
.textarea-field > * {
	float: left;
}

.captcha-layer > * {
	clear: left;
}

.captcha-layer > a,
.captcha-layer > div {
	clear: none;
}

.captcha-layer > a:hover {
	text-decoration: none;
}

.captcha-layer.compact > div {
	clear: left;
}

.complete-field > label,
.date-layer > label,
.captcha-layer > label,
.textarea-field > label {
	font-size: 14px;
	color: #333;
	margin-top: 4px;
}

.complete-field > label:first-child,
.date-layer > label:first-child,
.captcha-layer > label:first-child,
.textarea-field > label:first-child {
	width: 145px;
	text-align: right;
	padding-right: 8px;
	margin-top: 12px;
}

.textarea-field > label:first-child {
	margin-top: 8px;
	color: #666;
	font-weight: bold;
}

/* .captcha-layer :: details */

.captcha-layer > label:first-child {
	margin-top: 17px;
}

.captcha-layer.compact > label:first-child {
	width: auto;
	text-align: left;
	margin-bottom: 5px;
	margin-top: 0;
}

.captcha-layer > div > input {
	width: 80px;
}

.captcha-layer > a {
	width: 220px;
	background: url("/public/assets/images/reload.png") right center no-repeat;
}

.complete-field > span,
.date-layer > span,
.captcha-layer > span {
	margin-top: 4px;
	width: auto;
	margin-left: 155px;
	font-size: 12px;
	font-style: italic;
	text-indent: 0;
	float: left;
	clear: left;
}

.complete-field > input[type="checkbox"] {
	margin-left: 165px;
	margin-right: 6px;
	margin-top: 6px;
	clear: left;
}

.captcha-layer.compact > span {
	margin-left: 5px;
}

/* .date-layer :: details */

.date-layer > div {
	margin-left:0px;
	float: left;
}

.date-layer > div.day,
.date-layer > div.month,
.date-layer > div.year {
	height:40px;
	overflow:hidden;
}

.date-layer > div.day {
	width: 75px;
	margin-right:27px;
	background:url('/public/assets/images/year.png') left top no-repeat;
}

.date-layer > div.month {
	width: 113px;
	margin-right:22px;
	background:url("/public/assets/images/steps_dropdown.png") left top no-repeat;
}

.date-layer > div.year {
	width: 75px;
	margin-right:9px;
	background:url('/public/assets/images/input_small.png') left top no-repeat;

}

.date-layer.range > div.year {
	background:url("/public/assets/images/year.png") left top no-repeat;
}

.date-layer > div > select,
.date-layer > div > input {
	height:18px;
	background:none;
	background-color: rgba(0,0,0,0);	/* Opera мать ее так! */
	border:none;
	font-size:12px;
	margin-top:12px;
	margin-left:10px;
	float:left;
	color:#666;
	text-shadow: none;

	-moz-appearance:none;
	-webkit-appearance:none;
}

.date-layer > div.day > select {
	width: 90px;
}

.date-layer > div.month > select {
	width: 130px;
}

.date-layer > div.year > * {
	width: 90px;
}

.date-layer > div.valid,
.date-layer > div.invalid {
	margin-top:15px;
	padding-left:20px;
	background:url("/public/assets/images/result_okey.png") left bottom no-repeat;
	color:#333;
	display: none;
	float: left;
}

.date-layer > div.invalid {
	background:url("/public/assets/images/result_fail.png") left bottom no-repeat;
}

.textarea-field > div {
	background: #F2F2F2;
	padding: 8px 10px;
	border-radius: 10px;
	border: 1px solid #CFCFCF;
	/*box-shadow: inset 0px 2px 3px 0px #AAA;*/
}

.textarea-field > div > textarea {
	background:none;
	border:none;
	font-size:16px;
	/*color: #CFCFCF;
	text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.7);*/
	overflow: auto;
	resize: none;
	display: block;
}

.complete-field > div > input,
.captcha-layer > div > input,
div.noted-field > input,
div.field > input {
	background: url("/public/assets/images/reg_inputs.png") repeat-x left top;
	border-radius: 20px;
	height: 25px;
	width: 280px;
	margin: 0 12px 0 0;
	padding: 5px 15px 5px 15px;
	margin-top: 3px;
}

.captcha-layer > div > input {
	width: 85px;
	margin-top: 15px;
}

/*div.noted-field {
	clear: left;
}*/

.complete-field > div > *,
div.noted-field > * {
	float: left;
	clear: none;
}

.complete-field > div > span,
div.noted-field > span {
	margin-top: 12px;
	display: none;
	margin-left: 0px;
}

div.noted-field > span > span {

}

/* -------------------------------------------------------------------------------- */

/* inputs - noted-field, complete-field - info state */

/* ATTENTION! Строго заданный порядок классов оценки правильности ввода для правильного вывода! */

/* -------------------------------------------------------------------------------- */

.complete-field > div.valid > input ,
.captcha-layer > div.valid > input ,
div.noted-field.valid > input ,
div.field.valid > input {
	background-position: left -72px;
}

.complete-field > div.valid > span.valid,
.date-layer.valid > div.valid,
div.noted-field.valid > span.valid {
	display: block;
	color: #333;
	background: url("/public/assets/images/result_okey.png") no-repeat;
	padding-left: 20px;
}

.complete-field > div.empty > input {
	background-position:left -180px;
}

.complete-field > div.invalid > input, .complete-field > div.required > input, .complete-field > div.specific > input,
.captcha-layer > div.invalid > input, .captcha-layer > div.required > input,
div.noted-field.invalid > input, div.noted-field.required > input, div.noted-field.specific > input,
div.field.invalid > input, div.field.required > input {
	background-position: left -108px;
}

.complete-field > div.invalid > span.invalid, .complete-field > div.required > span.required,
.complete-field > div.specific > span.specific, .complete-field > div.empty > span.empty,
.date-layer.invalid > div.invalid,
div.noted-field.invalid > span.invalid, div.noted-field.required > span.required, div.noted-field.specific > span.specific {
	display: block;
	color: red;
	background: url("/public/assets/images/result_fail.png") no-repeat;
	padding-left: 20px;
}

/* inputs - noted field - focus state */
.complete-field > div.initial > input,
.captcha-layer > div.initial > input,
div.noted-field.initial > input,
div.field.initial > input {
	background-position: left -36px;
}

.textarea-field > div.initial {
	background-color: #007ACD;
}

.complete-field > div.initial > span.initial,
div.noted-field.initial > span.initial {
	display: block;
	color: #333;
}

.complete-field > div.initial > span.initial > span,
div.noted-field.initial > span.initial > span {
	color: #223dd4;
}

.complete-field > div.initial span.valid, .complete-field > div.initial span.invalid, 
.complete-field > div.initial span.required, .complete-field > div.initial span.specific,
.complete-field > div.initial span.empty,
div.noted-field.initial span.valid, div.noted-field.initial span.invalid, 
div.noted-field.initial span.required, div.noted-field.initial span.specific {
	display: none;
}

.complete-field > div.disabled > input,
div.noted-field.disabled > input {
	background-position:left -324px;
}


/* ^^^ ^^^ ^^^ ^^^ ^^^ */

#content span.info,
#content table.info {
	border: 1px solid #C0C0C0;
	/*font-family: Tahoma;*/
	clear:both;
}

#content span.info {
	background: #FAFAFA;
	border-radius: 15px;
	padding: 10px 25px;
	margin-bottom: 20px;
	text-align: justify;
	display: block;
	overflow: visible;
	line-height: 1.5;
}

/* genius after float clear block */
#content span.info:after {
	display: block;
	clear: both;
	content: '';
	height: 0;
	visibility: hidden;
}

#content span.info > p {
	line-height: 1.5;
	text-indent: 1.5em;
	color: #666;
	clear: left;
	margin-top: 10px;
}

#content span.info > p[plane] {
	text-indent: 0;
}

#content span.info > p:first-child {
	margin-top: 0px;
}

#content table.info {
	width: 100%;
	margin-bottom: 10px;
	border-collapse: collapse;
}


/* Left-Placed List Selector */

div.listselector {
	width: 100%;
	/*min-height: 300px;*/
	overflow: hidden;
	border-top: 1px solid #cfcfcf;
}

div.listselector > ul.list {
	background: #D5D5D5;
	width: 250px;
	float: left;
	padding-bottom: 200000px;
	margin-bottom: -200000px;
	list-style-type: none;
}

div.listselector > ul.list li {
	background: url("/public/assets/images/listselector.png") no-repeat left top;
	padding-left: 3px;
	padding-top: 8px;
	padding-bottom: 7px;
	height: 39px;
	cursor: pointer;

/*	inline text vertical center distributing - короче вертикальное центрирование текста блока - ONE text-line ONLY 
	line-height: 44px; */
}

div.listselector > ul.list li:first-child {
	margin-top: 5px;
}

div.listselector > ul.list li.active {
	background-position: left bottom;
}

div.listselector > ul.list li span {
	margin: 3px 15px 0 10px;
	width: 30px;
	height: 30px;
	float: left;
	color: #666;
}

div.listselector > div {
	display: none;
	padding: 10px 10px 1000px 10px;
	margin-bottom: -1000px;
	background: #FFF;
	float: left;
	width: 626px;
	line-height: 1.3;
}

/*div.listselector > div > * {
	max-width: 605px;
}*/

div.listselector > div > h1,
div.listselector > div > h2 {
	/*padding: 0 10px 5px;*/
	margin-bottom: 5px;
	text-align: center;
	display: block;
	font-weight: normal !important;
	font-size: 18px !important;
	clear: both;
}

div.listselector > div > h1,
div.listselector > div > h2 > span {
	color: #09F;
	font-size: 18px;
}

div.listselector > div div.field {
	float:left;
	clear:left;
	margin-bottom: 10px;
}

div.listselector > div label {
	font-size: 14px;
	color: #333;
}

div.listselector > div > span.info,
div.listselector > div > table.info {

}

div.listselector > div > span.info {

}

div.listselector > div > table.info {

}

div.listselector > div > table.info tr {
	height: 40px;
}

div.listselector > div > table.info tr:first-child {
	background: #b6b6b6;
}

div.listselector > div > table.info tr.dark {
	background: #d9d9d9;
}

div.listselector > div > table.info tr th {
	padding: 3px 7px;
	font-size: 12px;
}

div.listselector > div > table.info tr td:first-child {
	text-align: left;
	padding-left: 10px;
}

div.listselector > div > table.info.centered tr > td:first-child {
	text-align: center;
}

div.listselector > div > table.info tr td {
	text-align: center;
	font-size: 13px;
}

div.listselector > div > table.info tr td.hidden {
	position: relative;
	overflow: hidden;
	/*color: rgba(0,0,0,0);*/
	color: transparent;
	background: url(/public/assets/images/magnifier-min.png) center center no-repeat;
	cursor: pointer;
}

/*div.listselector > div > table.info tr td.hidden:before {
	position: absolute;
	content: 'наведите';
	display: inline-block;
	background: white;
	color: blue;
}*/

div.listselector > div > table.info tr td.hidden:hover {
	color: #666;
	background: none;
}

/*div.listselector > div > table.info tr td.hidden:hover:before {
	display: none;
}*/

div.listselector > div > table.info tr td span {
	display: block;
}

div.listselector > div > table.info tr td span._ok,
div.listselector > div > table.info tr td span._err,
div.listselector > div > table.info tr td span._atn,
div.listselector > div > table.info tr td span._inf {
	color: #00cc33;
	background: url('/public/assets/images/info-tip.png') no-repeat left top;
	width: 115px;
	height: 16px;
	margin-left: 25px;
}

div.listselector > div > table.info tr td span._err {
	color: #FF0000;
	background-position: left -16px;
}

div.listselector > div > table.info tr td span._atn {
	color: #FF9900;
	background-position: left -32px;
}

div.listselector > div > table.info tr td span._inf {
	color: #0033FF;
	background-position: left -48px;
}

div.listselector > div > table.info tr td span.cost {
	padding-top: 6px;
	padding-bottom: 2px;
	height: 20px;
	width: 40px;
	padding-right: 34px;
	margin-right: 15px;
	text-align: right;
	background: url('/public/assets/images/main_unit.png') no-repeat right top;
	font-weight: bold;
}

div.listselector > div > div.result {
	background: url('/public/assets/images/main_unit.png') no-repeat right top;
	font-weight: bold;
	padding-top: 6px;
	padding-bottom: 2px;
	padding-right: 34px;
	height: 20px;
	float: right;
	margin: 0 17px 15px 0;
}

div.listselector > div input.right {
	float: right;
	margin: 0 15px 15px 0;
	clear: both;
}

/*div.listselector > div input[disabled] {
	opacity: 0.5;	
}*/

div.listselector > div span.error {
	font-style: italic;
	font-weight: bold;
	color: #F00;
	/*float: left;*/
	display: block;
	clear: left;
	display: none;
	/*margin-bottom: 10px;*/
}

div.listselector > div > div.panel {
	width: 100%;
	display: block;
	clear: both;
	margin-bottom: 10px;
}

div.listselector > div span.ucost {
	background: url("/public/assets/images/main_unit.png") no-repeat top right;
	font-weight: bold;
	margin-right: 5px;
	padding-right: 34px;
	display: inline-block;
	/*width: 26px;*/
	padding-top: 6px;
	padding-bottom: 2px;
	height: 20px;
	text-align:	right;
	margin-top: -5px;
}

div.listselector > div > .captcha-layer.compact {
	clear: left;
}

/* ^^^ ^^^ ^^^ ^^^ ^^^ */

div.info-table {
	margin: 0 5px;
	margin-bottom:25px;
	width: 310px;
}

div.info-table > h5 {
	margin:5px 0;
	padding:0;
	text-align:center;
	color:#666;
	font-family: Tahoma, Geneva, sans-serif;
	font-size:11px;
}

div.info-table > ul li {
	list-style-type: none;
	background-color: #F2F2F2;
}

div.info-table > ul li.darker {
	background-color: #E6E6E6;
}

div.info-table > ul li span {
	border:#C0C0C0 solid 1px;
	height:25px;
	padding:5px 5px 0 5px;
	text-align: right;
	/*background: inherit;*/
}

div.info-table > ul li span:first-child {
	text-align: left;
	float:left;
	width: 148px;
}

/* ^^^ ^^^ ^^^ ^^^ ^^^ */

div.simple-table {
	margin-bottom: 25px;
	float: left;
	text-align: center;
	clear: both;
	width: 100%;
}

div.simple-table ul {
	list-style-type: none;
	display: block;
	text-align:center;
	background: none;
}

div.simple-table ul:first-child li {
	background: #b6b6b6;
}

div.simple-table ul li {
	border: 1px solid #959595;
	display: inline-block;
	width: 120px;
	height: 25px;
	padding: 5px 5px 0;
	background: #d9d9d9;
}

span[info-hint] {
	background: url('/public/assets/images/info-help.png') no-repeat right top;
	padding-right: 30px;
	display: inline-block;
	padding-top: 5px;
	padding-bottom: 5px;
	height: 16px;
	cursor: pointer;
	position: relative;
}

span[info-hint]:after {
	position: absolute;
	visibility: hidden;
	opacity: 0;

	-webkit-transition: 0.3s ease;
    -moz-transition: 0.3s ease;
    transition: 0.3s ease;

	top: 120%;
	/*left: -20%;*/
	right: -30px;
	z-index: 5555;
	display: block;
	background: white;
	border: 1px solid #888;
	content: attr(info-hint);
	width: 250px;
	display: inline-block;
	padding: 5px;
	border-radius: 10px;
	box-shadow: 0px 0px 5px -1px;

	font-weight: normal;
}

span[info-hint]:hover:after {
	visibility: visible;
	opacity: 1;
}

/* Select options */

span.selectLayer {
	display: inline-block;
	clear: left;
	text-align: left;
	vertical-align: middle;
}

span.selectLayer > label {
	display: block;
	height: 16px;
	float: none;
	clear: both;
	margin-bottom: 5px;
	padding-left: 8px;
}

span.selectLayer.linear > label {
	float: left;
	margin-top: 8px;
	margin-right: 3px;
}

span.selectLayer > span {
	width: 110px;
	height: 34px;
	overflow: hidden;
	margin-left: 4px;
	background: #f2f2f2;
	border: 1px solid #ccc;
	border-radius: 16px;
	display: inline-block;
	zoom: 1;	/* inline-block for IA IE */
	cursor: pointer;
	position: relative;
}

span.selectLayer.xsmall > span {
	width: 60px;
}

span.selectLayer.small > span {
	width: 80px;
}

span.selectLayer.large > span {
	width: 150px;
}

span.selectLayer.xlarge > span {
	width: 200px;
}

span.selectLayer.inverse > span {
	background-color: #fff;
}

span.selectLayer > span:after {
	content: '▼';
	font-size: 10px;
	position: absolute;
	z-index: 0;
	right: 10px;
	top: 11px;
	color: gray;
}

span.selectLayer > span > select {
	width: 120px;
	background: none;
	border: none;
	background-color: rgba(0,0,0,0);
	font-size: 12px;
	padding-top: 8px;
	padding-bottom: 6px;
	height: 34px;
	margin-left: 10px;
	color:black; /*#666;*/
	float:left;
	cursor:pointer;

	position: absolute;
	z-index: 200;

	-moz-appearance: none;
	-webkit-appearance: none;
}

span.selectLayer.xsmall > span > select {
	width: 70px;
}

span.selectLayer.small > span > select {
	width: 90px;
}

span.selectLayer.large > span > select {
	width: 160px;
}

span.selectLayer.xlarge > span > select {
	width: 210px;
}

span.selectLayer > span > select > option {
	height: 18px;
}

span.selectLayer.layered > span > select {
	opacity: 0;
	filter: alpha(opacity=0); 
}

span.selectLayer.layered > span > span {
	position: absolute;
	top: 10px;
	left: 14px;
	z-index: 100;
}

/* ^^^ ^^^ ^^^ ^^^ ^^^ */

/*
*
*/

.choice-tab {
	/*background: url("/public/assets/images/pocket_ulTabs_bg.png") left bottom repeat-x;*/
	background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAArCAYAAABxTggPAAAAOElEQVR42uzMsQ0AIAzEwBBRMAP77/lhBzcUtuT2OkmRu2ACAgICAgICAgI/Aosi+30ocAkwAgwAH/wwTtnWi7YAAAAASUVORK5CYII=) left bottom repeat-x;
	clear: both;
	display: block;
	width: 100%;
	position: relative;
	height: 43px;
	padding-bottom: 1px;
}

.choice-tab > input[type='radio'] {
	/*visibility: hidden;*/			/* not applicable due to stupid IE */
	position: absolute;
	z-index: -1;
	width: 0;
	height: 0;
	/*opacity: 0;*/
	left: -9999px;
}

.choice-tab > input[type='radio'] + label {
	background: #d8d8d8;
	border-radius: 22px 22px 0 0;
	cursor: pointer;
	float: left;
	width: 176px;
	margin-right: 1px;
	border: 1px solid #bbb;
	border-bottom: none;
	height: 43px;
	line-height: 45px;
	text-align: center;

	color: #fff;
	font-size: 1em;
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
}

.choice-tab > input[type='radio']:checked + label {
	background: #fff;

	color: #666;
	text-shadow: none;
}

.choice-tab > input[type='radio'].checked + label {	/* due to stupid IE */
	background: #fff;

	color: #666;
	text-shadow: none;
}

/* ^^^ ^^^ ^^^ ^^^ ^^^ */