
/*--------- DEFAULT ---------------------------------------------------------------------------------------------------------------------------------------*/
 
 html { height: 100%; }

 html * {max-height:1000000px;}

 body
	{
	position: relative;
	min-height: 100%;
	padding: 0;
	margin: 0;
	background-color: #c0c0c0;
	overflow-x: auto;
	overflow-y: scroll;
	font-family: Ubuntu, Arial;
	font-size: 12px;
	}

 a
	{
	color: #0077ff;
	text-decoration: none;
	}

 img
	{
	border: none;
	}

 .hidden
	{
	display: none;
	}

 #root
	{
	margin: 0px auto;
	padding-bottom: 395px;
	width: 1200px;
	background-color: #ffffff;
	}

 .wrapper
	{
	position: relative;
	margin: 0px auto;
	width: 960px;
	}

/*----------------- HEADER --------------------------------------------------------------------------------------------------------------------------------*/

 #header
	{
	display: block;
	position: relative;
	height: 100px;
	}

 #header .logo
	{
	position: absolute;
	top: 20px;
	left: 0px;
	width: 212px;
	}

 #languages
	{
	position: absolute;
	top: 0px;
	right: 10px;
	z-index: 10;
	}

 .lang img
	{
	display: block;
	margin: 10px 0;
	width: 28px;
	height: 28px;
	border: none;
	}

 .lang:hover img
	{
	opacity: 0.6;
	}


/*----------------- MENU ----------------------------------------------------------------------------------------------------------------------------------*/

 #menu
	{
	position: absolute;
	top: 35px;
	left: 220px;
	font-family: 'Segoe UI';
	font-size: 15px;
	}

 .cat-1
	{
	display: inline-block;
	margin: 0px;
	padding: 7px 14px;
	text-align: center;
	text-decotation: none;
	color: #6f6f6f;
	}

 .cat-1.active
	{
	color: #3498db;
	}

 .cat-1 .beak
	{
	display: inline-block;
	margin-left: 8px;
	width: 7px;
	height: 22px;
	background: url('images/beak-gray.png?v2') 0 8px no-repeat;
	}

 li:hover .cat-1
	{
	color: #ffffff;
	background: url('images/blink.png') 0 0 no-repeat;
	background-color: #34495e;
	border-radius: 5px;
	}

 li:hover .cat-1 .beak
	{
	background-image: url('images/beak-white.png');
	}

 .submenu
	{
	width: 180px;
	background-color: #34495e;
	padding-bottom: 8px !important;
	border-bottom: 3px solid #3484bc;
	}

 .cat-2
	{
	display: block;
	padding: 8px 20px;
	white-space: nowrap;
	background-color: #34495e;
	font-size: 15px;
	color: #ffffff;
	text-align: left;
	text-decoration: none;
	text-shadow: 1px 0 1px RGBA(0,0,0,0.4);
	}

 .cat-2:hover
	{
	margin: 0 -4px;
	padding-left: 24px;
	background: url('images/blink.png') 0 0 no-repeat;
	background-color: #7dbc00;
	}


/*----------------- USERPANEL -----------------------------------------------------------------------------------------------------------------------------*/

 #account
	{
	display: none;
	position: absolute;
	top: 32px;
	right: 0px;
	text-align: right;
	font-family: Ubuntu;
	font-size: 15px;
	color: #ffffff;
	}

 #account .account-btn
	{
	display: inline-block;
	width: 202px;
	height: 39px;
	line-height: 39px;
	*background: url('images/account-btn.png') 0 0 no-repeat;
	background: url('images/blink2.png') 0 0 no-repeat;
	background-color: #7dbc00;
	border-radius: 5px;
	text-align: center;
	font-weight: bold;
	font-size: 17px;
	color: #ffffff;
	text-shadow: 1px 1px 1px RGBA(0,0,0,0.3);
	cursor: pointer;
	}

 #account .account-btn:hover
	{
	background-color: #8dcc00;
	box-shadow: 1px 1px 4px RGBA(0,0,0,0.2);
	}

 #login-panel
	{
	position: relative;
	padding: 30px 40px;
	width: 200px;
	background-color: #34495e;
	text-align: left;
	z-index: 10;
	opacity: 0;
	max-height: 0;
	overflow: hidden;

	-webkit-transition: all 0.2s ease-in;
	-moz-transition: all 0.2s ease-in;
	-o-transition: all 0.2s ease-in;
	transition: all 0.2s ease-in;
	}

 #login-panel.active
	{
	margin-top: 10px;
	opacity: 1;
	max-height: 300px;
	}

 #login-panel form
	{
	margin: 0;
	padding: 0;
	}

 #login-panel p
	{
	margin: 0 0 16px 0;
	*border: 1px solid red;
	}

 #login-panel .label
	{
	display: block;
	margin-bottom: 4px;
	}

 #login-panel .field
	{
	box-sizing: border-box;
	width: 200px;
	padding: 8px 10px;
	font-size: 16px;
	color: #ffffff;
	background-color: inherit;
	border: 2px solid #ffffff;
	border-radius: 5px;
	outline: none;
	}

 #login-panel .field:focus
	{
	background-color: RGBA(255,255,255,0.2);
	}

 #login-panel .login-btn
	{
	display: inline-block;
	width: 200px;
	height: 40px;
	line-height: 39px;
	background: url('images/login-btn.png') 0 0 no-repeat;
	border: none;
	text-align: center;
	font-weight: bold;
	font-size: 17px;
	color: #ffffff;
	text-shadow: 1px 1px 1px RGBA(0,0,0,0.3);
	cursor: pointer;
	outline: none;
	}

 .checkbox:not(checked),
 .checkbox:checked
	{  
  	opacity: 0;  
	}

 .checkbox + label
	{
	cursor: pointer;
	}

 .checkbox + label:before
	{ 
	content: '';
	position: relative;
	top: 4px;
  	display: inline-block;
	margin: 0px 10px 0 -22px;
	width: 20px;
	height: 18px;
	line-height: 18px;
	background-repeat: no-repeat;
	background-size: 100% auto;
	cursor: pointer; 
	}

.checkbox:not(checked) + label:before
	{ 
	background-image: url(images/checkbox.png);
	}

.checkbox:checked + label:before
	{ 
	background-image: url(images/checked.png);
	}


/*----------------- CENTER --------------------------------------------------------------------------------------------------------------------------------*/

 #main
	{
	display: block;
	margin: 20px 0px;
	padding: 20px 40px;
	min-height: 400px;
	}

 #main h1
	{
	margin: 0 0 15px 0;
	font-size: 26px;
	color: #3498db;
	}

/*----------------- FOOTER --------------------------------------------------------------------------------------------------------------------------------*/

 #footer
	{
	position: absolute;
	left:0; bottom:0;
	box-sizing: border-box;
	width: 100%;
	height: 383px;
	background: url('images/footer.png') center 0 no-repeat;
	}

 #footer .wrapper
	{
	*height: 383px;
	}

 #footer .table
	{
	margin-top: 180px;
	display: table;
	width: 100%;
	font-family: 'Segoe UI Light';
	font-size: 20px;
	color: #dfe3e5;
	}

 #footer .table > div
	{
	display: table-cell;
	vertical-align: top;
	width: 33%;
	}

 #footer .table .col-left { text-align: left; }

 #footer .table .col-center { text-align: center; }

 #footer .table .col-right { text-align: right; }


 #footer .help
	{
	display: inline-block;
	margin-bottom: 2px;
	font-family: 'Ubuntu Light';
	font-size: 20px;
	line-height: 22px;
	color: #ffffff;
	padding-right: 50px;
	background: url('images/help.png?v2') right center no-repeat;
	cursor: pointer;
	}

 #footer .phone
	{
	font-size: 18px;
	color: #ffffff;
	}

 #footer .worktime
	{
	margin-top: 10px;
	font-size: 16px;
	}

 #footer .copyright
	{
	font-size: 16px;
	color: #f5f7f8;
	}

 .social
	{
	margin-bottom: 15px;
	}

 .social a
	{
	display: inline-block;
	width: 55px;
	height: 55px;
	background: url('images/social.png') 0 0 no-repeat;
	}

 .social a:hover
	{
	opacity: 0.8;
	}

 .social .vk 		{ background-position: 5px 0px; }
 .social .facebook 	{ background-position: -55px 0px; }
 .social .odn 		{ background-position: -116px 0px; }
 .social .twitter 	{ background-position: -176px 0px; }
 
 #RL
	{
	margin-top: 46px;
	text-align: left;
	}
 #RL a
	{
	display: inline-block;
	padding-left: 27px;
	line-height: 20px;
	background: url('images/radolaukar.png') left center no-repeat;
	text-decoration: none;
	font-size: 8px;
	color: #ffffff;
	}
 #RL a:hover
	{
	text-decoration: underline;
	}


/*-------- APPLY WINDOW --------*/

 body.locked
	{
	overflow: hidden;
	padding-right: 17px;
	}
 body.locked footer
	{
	border-right: 17px solid transparent;
	}

 #apply-window-bg
	{
	display: none;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0px; 
	left: 0px;
	background-color: RGBA(0,0,0,0.6);
	z-index: 500;

	opacity: 0;
	-webkit-transition: opacity 0.3s ease-in;
	-moz-transition: opacity 0.3s ease-in;
	-o-transition: opacity 0.3s ease-in;
	transition: opacity 0.3s ease-in;
	}

 #apply-window
	{
	display: none;
	position: fixed;
	top:0; left:0; right:0; bottom:0;
	margin: auto;
	padding: 25px 30px;
	box-sizing: border-box;
	width: 620px;
	height: 540px;
	background-color: #ffffff;
	*font-family: 'Open Sans';
	z-index: 600;

	-webkit-transition: all 0.3s ease-in;
	-moz-transition: all 0.3s ease-in;
	-o-transition: all 0.3s ease-in;
	transition: all 0.3s ease-in;

	opacity: 0;
	-webkit-transform: translate(0, -800px);
	-moz-transform: translate(0, -800px);
	-o-transform: translate(0, -800px);
	transform: translate(0, -800px);
	}

 #apply-window.hide
	{
	opacity: 0.5;
	-webkit-transform: translate(0, 800px);
	-moz-transform: translate(0, 800px);
	-o-transform: translate(0, 800px);
	transform: translate(0, 800px);
	}

 #apply-window.show
	{
	opacity: 1;
	-webkit-transform: translate(0, 0px);
	-moz-transform: translate(0, 0px);
	-o-transform: translate(0, 0px);
	transform: translate(0, 0px);
	}

 #apply-window .close-btn
	{
	position: absolute;
	top: 10px;
	right: 10px;
	width: 26px;
	height: 26px;
	background: url('images/close.png') center center no-repeat;
	background-size: 100% 100%;
	cursor: pointer;
	z-index: 600;
	}
 #apply-window .close-btn:hover
	{
	opacity: 0.7;
	}

 #apply-window h3
	{
	margin: 0 0 20px 0;
	font-size: 22px;
	font-weight: normal;
	color: #24404c;
	padding-bottom: 8px;
	border-bottom: 1px solid #dddddd;
	}

 #apply-form
	{
	text-align: left;
	font-size: 15px;
	color: #777777;
	}

 #apply-form label
	{
	display: inline-block;
	width: 120px;
	}

 #apply-form .label2
	{
	vertical-align: top;
	padding-top: 5px;
	}

 #apply-form .field
	{
	width: 200px;
	padding: 5px 10px;
	font-family: inherit;
	border: 1px solid #e0e0e0;
	background-color: #fcfcfc;
	*border: 2px solid #b5c5c6;
	*background-color: #fafafa;
	border-radius: 4px;
	box-shadow: 1px 1px 3px #eeeeee inset;
	outline: none;
	}

 #apply-form .field:focus
	{
	border: 1px solid #d0d0d0;
	background-color: #fafafa;
	*background-color: #ffffff;
	box-shadow: 1px 1px 5px #dddddd inset;
	}

 #apply-form textarea.field
	{
	width: 300px;
	resize: none;
	}

 #apply-form input[type=radio]
	{
	margin: 5px 8px 5px 0;
	}

 #apply-form mark
	{
	margin-left: 3px;
	background: none;
	font-family: Tahoma;
	font-size: 12px;
	color: red;
	}

 #apply-form .error
	{
	margin-left: 8px;
	font-size: 13px;
	color: red;
	}
 #apply-form .error.block
	{
	display: block;
	margin: 3px 0 0 0;
	}
 #apply-form .error.inline
	{
	display: inline-block;
	margin: 0 0 0 10px;
	}

 #apply-form .field.not-valid
	{
	border: 1px solid #ff9999;
	background-color: #fff9f9;
	}

 #apply-form .submit-btn
	{
	margin: 5px 0 0 123px;
	display: inline-block;
	width: 162px;
	height: 40px;
	line-height: 40px;
	color: #ffffff;
	font-family: 'Ubuntu Medium';
	font-size: 16px;
	text-align: center;
	background: url('images/connect-btn.png?v1') 0 0 no-repeat;
	background-size: 100% 100%;
	text-shadow: 0 1px 1px RGBA(0,0,0,0.3);
	box-shadow: 2px 2px 7px RGBA(0,0,0,0.2);
	cursor: pointer;
	}

 #apply-msg
	{
	display: none;
	padding: 10px 20px;
	font-size: 16px;
	background-color: #f2f2f2;
	color: #333333;
	opacity: 0;

	-webkit-transition: all 0.2s ease-in;
	-moz-transition: all 0.2s ease-in;
	-o-transition: all 0.2s ease-in;
	transition: all 0.2s ease-in;

	-webkit-transform: translate(0, -50px);
	-moz-transform: translate(0, -50px);
	-o-transform: translate(0, -50px);
	transform: translate(0, -50px);
	}

  #apply-msg.show
	{
	opacity: 1;
	-webkit-transform: translate(0, 0px);
	-moz-transform: translate(0, 0px);
	-o-transform: translate(0, 0px);
	transform: translate(0, 0px);
	}
