
html, body {
	height:100%;
	margin:0; padding:0;
}
h1,h2,h3,h4,p,ul,li {margin:0; padding:0;}
body {
background-color:#9b8675; /*#505050 - öâåò ìîêðîãî àñôàëüòà */
font-size: 16px;
font-family: Verdana,Arial,Helvetica,sans-serif;
/*	background: url(images/bg.jpg);*/
}

 a {text-decoration:none; /* color:#414046; */ }

table {
  border-collapse: collapse; /* баБаИбаАаЕаМ баАаМаКаИ аДаВаОаЙаНаОаЙ баОаЛбаИаНб */
  border-spacing: 0; /* баБаИбаАаЕаМ баАбббаОбаНаИаЕ аМаЕаЖаДб ббаЕаЙаКаАаМаИ */
  width:100%;
  margin-bottom:25px;
  font-size: 12px;
  line-height:14px;
  color:#417487;
}
table td {
  padding-top:4px;
  padding-bottom:5px;
  padding-left:10px;
  padding-right:10px;
  border-bottom:#417487 1px solid;
  border-right:#417487 1px solid;
  border-left:#417487 1px solid;
  vertical-align:middle;
 border: 1px solid #417487;
}

table th {
  padding-top:8px;
  padding-bottom:8px;
  border-right:#417487 1px solid;
  border-left:#417487 1px solid;
  border-bottom:#417487 1px solid;
  font-size: 13px;
  line-height:17px;
  color:#FFF;
  font-weight:normal;
  text-align:center;
  background:#417487;
}
.tdc {text-align:center;}
.tdr {text-align:right;}
.gry td {color:#ddd;}

#main {	width:900px;	margin:0px auto;	background:white;}

.err {color:red; }
#head {
	width:100%;
	height:337px;
	background: #aaa;
	background: #D8D8D8 url(images/head.png) no-repeat bottom;
}



#top_menu {height: 50px;background-color: #414046;border-bottom: 4px solid #303030;position: fixed;z-index: 100;
width: 900px;margin-left: 50%;left: -450px;}
#top_menu ul {padding: 0px; margin: 0px 0px 0px 50%;width: 1120px;display: inline-block;background: url("images/bgf.jpg") repeat scroll 0% 0% transparent;
left: -450px; position: relative;}
#top_menu ul li {display:inline-block;  padding:0 24px; height:50px; line-height:50px; transition: 0.2s;vertical-align: middle;}
#top_menu ul li:hover {background:#417487; transition: 0.4s;}
#top_menu ul li a {color:white; text-decoration:none; font-size:22px; transition: 0.2s;}
#top_menu ul li a:hover {color:#FFF; transition: 0.2s;}
#top_menu a img:hover {color:#FFF; transition: 0.2s;}
#logo {width:180px;}
#reg:hover {background:0;}

.block_title {color: #dadada; padding: 2px 0px 4px 12px;font-size: 18px;width: 100%;background: none repeat scroll 0% 0% rgb(65, 116, 135);font-weight: bold;}
.block_body {margin:0px 0 10px 10px;}

#left_block { width: 200px; min-height:600px; padding-right:12px; float:left; /*margin-top:50px;*/ border-right: 1px solid #C9C9C9; }
#left_block ul {font-family:akashi,Tahoma; /*margin:5px 0 20px 20px; */ }
#left_block li {cursor: pointer;list-style: none;  padding: 0.7em 1.2em; width: 86%;}   /*color: #B2B2B2; cursor:pointer; list-style: square; color:#B2B2B2;*/
#left_block li:hover {background-color: rgba(100, 131, 170, 0.4); transition: 0.4s;}
#left_block ul a { color:#383838; text-decoration:none; font-size:16px; }
#left_block ul a:hover { }
.next {margin-bottom:35px; margin-top:15px; border-top:1px solid #B0B0B0;border-bottom:1px solid #FFF; border-left:0; border-right:0;}


@media only screen and (max-width: 480px), only screen and (max-device-width: 480px) {

		#top_menu {left: -513px;}
 		h1{font-size:4em;}
 		h2{font-size:3em; padding: 2em 0 1em 0;}
 		body{font-size:0.9em;}

}

#footer {background: #417487;height: 180px;text-align: center;clear: both;
vertical-align: top;width: 900px;margin-left: 50%;position: relative;left: -450px;}
#footer_col{display: inline-block;margin-left: 60px;width: 180px; padding-top: 18px;}
.sub_footer {color: #DADADA;font-size: 16px;padding: 0px 0px 0px 5px;text-align: left;margin: 0px auto;width: 1060px;display: inline-flex; }
.sub_footer a {color: #080808;position: relative;padding: 2px 6px;display: inline-block; }

#footer_col a:hover {color: #417487;
border-radius: 5px;
background-color: #FFF;}

h1,h2,h3,h4 {font-weight:normal; font-family: Verdana,Arial,Helvetica,sans-serif;}
h1 { font-size:26px; margin:0pt; padding:12px 5px 12px 5px; text-align:center; }

h2 {
    font-size: 24px;
    margin: 0 0 0 30px;
    padding: 21px 0 6px 0;
}

h2 {font-size:20px; font-weight:normal; font-family:Verdana,Arial,Helvetica,sans-serif; margin:0 0 0 30px; padding:12px 0 5px 0; }
h3 {padding:12px 0 12px 0; }
h4 {margin: 0px 0px 0px 6px;padding: 0px 0px 12px;font-weight: bold;font-size: 17px;}

p {text-indent: 30px; padding:5px 0; line-height:22px; text-align: justify;}
#info_block { padding:4px 8px; margin-bottom:20px; border:1px solid #DADADA;}

#info_block p {margin:0; padding:0; text-indent:20px; line-height:18px;}

#right_block {
	padding:0px 10px 100px 10px;
    margin-top: 60px;
    min-height:500px;
}
#right_block ul {margin-left:40px;}

#page     {padding: 0em 3em 0em 3em;}

#tbl_2{width:100%; border:0px; border-top-left-radius: 5px;border-top-right-radius: 5px; border-collapse: collapse;}

#tbl_2 th {padding: 8px 14px;
text-transform: uppercase;
color: #444;
font-weight: bold;
border-bottom: 5px solid #444;
background-color: #7FD2FF;}
#tbl_2 td {
border-right: 1px dotted #999;
border-left: 1px dotted #999;
border-bottom:1px solid #999;
color: #333;
padding: 6px;}

#tbl_2 td1 {background-color:#FFF; border:0; padding:4px;}
#tbl_2 .tr2 {background-color: #DBDBDB; border:0; padding:4px;}

input {border:1px solid #aaa;  padding:1px; margin:1px;}

#ta1 {width:100%; height:700px;  }
#ta2 {width:100%; height:100px;  border:1px solid #aaa; background:#FFF;}
.memo1 { border:1px solid gray; border-radius:3px; width:330px; height:120px;}
.memo2 { border:1px solid gray; border-radius:3px; width:500px; height:120px;}
.long_input {width:400px; border-radius:0; }
.button_add {width:160px; height:40px; margin-top:20px; margin: 20px auto; display:block;}
.button { margin-top:20px; margin: 20px auto; padding:10px 20px;}

 /*------------------Ýëåìåíòû ãëàâíîé ñòðàíèöû----------------------------*/
 #video{display:inline-block; position:relative; width:475px; height:280px; border:1px dotted red; vertical-align:middle; text-align:center;float:left; margin-right:15px}
 #btn_pos{width: 500px;display: inline-block;margin-left: 50%;left: -180px;position: relative;Padding: 12px 0px 18px 0px;}
 #btn_gr {text-align: center;display: table;width: 169px; height: 45px;font: bold 20px "Arial"; float:left;margin-right: 40px;
         background: url("images/btn_gr.png") 100% 100% no-repeat; background-size: cover; z-index: 9;}
 #btn_bl {text-align: center;display: table;width: 169px; height: 45px;font: bold 20px "Arial";margin-left: 40px;
         background: url("images/btn_bl.png") 100% 100% no-repeat; background-size: cover; z-index: 9;}
.btntxt {margin-top: 10px; color: #FFF;}
#btn_gr:hover, #btn_bl:hover  { opacity: 0.7;}
#job_pos{width: 496px;height: 60px;position: relative;}

#pasngr_pos{position: relative;width: 500px;margin-left: 30px;height: 60px;padding: 6px;text-align: left;border: 1px dotted gray;}
.pasngrDate {position: absolute;margin-top: 5px;left: 70%;color: #414046;font: 12px "Arial";top: 11%;}
#passenger{    padding-bottom: 6px;}



.name_auto_block {
    position: absolute;
    height:21px;
    top: 167px;
    right: 0px;
    padding: 6px 12px;
    opacity:0.8;
/*    background: none repeat scroll 0% 0% rgba(255, 121, 0, 0.8);*/
    z-index: 4;
}
.price_block{
	position: absolute;
    height:21px;
    top: 10px;
    padding: 6px 10px;
    background-color: #6483AA;
    border-bottom: 3px solid #2F4561;
}

pp{
    font-weight: bold;
    margin-right:4px;
    padding: 4pt;
    vertical-align: middle;
	display: table-cell;
}

#auto_block {
    position: relative;
    display: table-cell;
}

.auto_pos{width: 700px;
height: 100px;
margin-left: 50%;
left: -350px;
position: relative;
margin-top:5px;}

#blk_auto_pos{
position: relative;
display: flow-root;
float:left;
}

#auto_color{width: 25px;
height: 15px;
display: inline-block;
border: 2px solid #808080;
vertical-align: middle;}
#addauto{
    width: 53%;
    position: relative;
    margin-top: 5px;
    margin-left: 50%;
    left: -206px;
    display: block;
    border: 1px solid #D0D0D0;
    border-radius: 4px;
    padding: 1em;
    background-color: aliceblue;
}

#top_avatar{width: 45px;float: left;height: 60px;padding: 6px 10px 0px 6px; overflow: hidden;}

#current_job{width: 320px;  display: table-cell;padding: 4px;overflow: hidden;position: relative;/*border: 1px solid gray;*/}

#job_pos:hover, #auto_pos:hover, #avatar:hover, a #current_job:hover, a #temp_blck:hover
{ background-color:rgba(100, 131, 170, 0.4);} /* Ïîçæå ñäåëàòü êàðòèíêó äëÿ ôîíà ñ çàòåìíåíèåì è óáðàòü ïðîçðà÷íîñòü */

#job_pos .time{position:relative;display:table-cell; vertical-align:middle;width: 70px;height: 33px;
padding: 17px 10px 10px 10px;text-align: center;border-left: 1px solid #D8D8D8;border-right: 1px solid #D8D8D8;}

a .time:hover{ text-decoration:none; color:black;}
.curJobTitle{
	color: #529CBB;
    font: bold 18px "Arial";
	Padding-left:5px;
}

#curJobPrice p{
		text-indent:0px;
		text-align:left;
		margin-top:5px;
	    font-size: 14px;
	    line-height: 18px;
}

.curJobDesc{
	color: black;
	Padding-left:6px;
}
#curJobPrice{
	position:relative;
	display:table-cell;
    vertical-align:middle;
}


/*ñòèëè äëÿ âêëàäîê*/
.korpus{width: 800px;padding: 10px 20px 0px 15px;margin-left: 50%;left: -400px;position: relative;margin-bottom:12px;}
.korpus > a {
	background: none repeat scroll 0% 0% #FFF;
	padding: 5px 10px;
	border: 1px solid #E1E1E1;
	line-height: 34px;
	color: black;
	font-size: 18px;
}

.korpus > a:first-child { border-bottom: 1px solid #fff; }

.korpus > a:hover { text-decoration: none; }

.korpus div {
  border: 1px solid #e1e1e1;
  padding: 10px;
  width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
  background: #FFF;
}

.korpus .vid { display: block; }
.korpus .skryt { display: none; }

#content { display: block; }
#auto_pos {
    float: left;
}

 /*------------------ñòèëè äëÿ îòîáðàæåíèÿ òåìïåðàòóð----------------------------*/

center{text-align:center;}
.gray{color:gray; border: 1px solid gray;background: none repeat scroll 0% 0% gray;}

#temp_blck { width: 120px; position:relative; display: inline-block;
			border: 1px solid rgb(47, 69, 97);
			border-radius: 2px 2px 2px 2px; margin: 8pt 16pt;}

.temp_title {padding: 3px 0px 3px;font-size: 18px; width: 100%; color: white; border-radius: 2px 2px 0px 0px;border-bottom:1px solid #2f4561;
			background: none repeat scroll 0% 0% rgb(100, 131, 170); font-weight: bold; text-align: center;}
.temp_body {margin: 10px 10px 10px 4px; font-size: 24pt; font-weight: bold; color: green;}
.c{position: absolute; left:100px; top:34px; font-size: 12pt;}
.uc{position: absolute; left:64px; top:34px; font-size: 12pt; font-weight: bold; color: green;}

.z_utin{            color: #2f4561;
				    font-size: 14px;
				    width: 26px;
				    left: 60px;
				    position: absolute;
				    top: 68px;
				    font-weight: bold;}

#zstwork {
    color: #2f4561;
    font-size: 14px;
    /* width: 26px; */
    left: 60px;
    /* position: absolute; */
    top: 68px;
    font-weight: bold;
}

 /*------------------Íàãðåâ----------------------------*/
#ten_blck{position:relative; display: table;
			margin-bottom:4pt;	margin-left: 31%;}
#ten_rct_clr{	border-radius: 4px;
				border: 1px solid rgb(47, 69, 97);
				display: table-cell;
				position: relative;
				margin: 4px;
				padding:2px;}
#ten_rct_fill{width: 24px; height: 24px; border-radius: 4px;border: 1px solid rgb(47, 69, 97);background: #73f870;}
.ten_rct_txt{color: white;
			    vertical-align: middle;
			    font-weight: bold;
			    display: table-cell;
			    padding: 0pt 3pt;}
.rct_clr {width: 26px; height: 26px;}

 /*------------------Ôîðìû ðåãèñòðàöèè----------------------------*/
.registration-form .left {
	width: 60%;
	padding: 10px 20px 0px 15px;
	border-right: 1px solid #E5E5E5;
	border-left: 1px solid #E5E5E5;
	float: left;
	margin-left: 50%;
	left: -35%;
	position: relative;
}

.registration-form .field {
    margin: 0.5em 0.0em;
}

.registration-form span.name {
/*	display: inline-block;*/
	margin-bottom: 0.3em;
	font-size: 90%;
	color: #444;
/*	width: 45%;*/
	text-align: right;
}

.registration-form .help {
	font-size: 10pt;
	color: #AAA;
	padding: 0px;
	line-height: 12px;
	display: inline-block;
	margin-left: 4px;
}

.createjob-form .left {
	width: 540px;
	padding: 10px 20px 0px 15px;
	border-right: 1px solid #E5E5E5;
	border-left: 1px solid #E5E5E5;
	float: left;
	margin-left: 50%;
	left: -290px;
	position: relative;
    margin-bottom: 40px;
}

.createjob-form .field {
    margin-bottom: 0.5em;
}

.createjob-form span.name {
	display: inline-block;
	margin-bottom: 0.3em;
	font-size: 90%;
	color: #444;
	width: 190px;
	text-align: right;
}
.createjob-form .inp {
    width: 60%;
    padding: 0.5em 5px;
}
.createjob-form .help {
	font-size: 10pt;
color: #AAA;
padding: 3px;
width: 60%;
min-height: 40px;
line-height: 16px;
display: inline-block;
margin-left: 4px;
margin-bottom: 10px;
border: 1px dotted #AAA;
}

ul.errorlist {
    color: #F00;
    margin: 0px;
    padding: 0px;
}

#show-password-container {
    margin-top: 0.5em;
}

.clear {
    clear: both;
}

.inp {
    border: 1px solid #D0D0D0;
    border-radius: 4px;
    box-shadow: 0px 5px 6px -6px rgba(0, 0, 0, 0.5) inset;
    width: 88%;
    padding: 0.7em 12px;
}

.butGreenGrad{
    display: block;
    padding: 0.7em 0px;
    text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.5);
    text-decoration: none;
    text-align: center;
    border: 1px solid #B1E757;
    background: linear-gradient(to bottom, #CAF34C 0px, #95C83D 100%) repeat scroll 0% 0% transparent;
    box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.3);
}

/*Ñòèëè äëÿ ëè÷íîãî êàáèíåòà*/
#userpicture{width: 100px;
height: 100px;
text-align: center;
border: 1px solid black;
position: relative;
margin-left: 50%;
left: -75px;
overflow: hidden;}



.commentBlock{
  width:500px;
  margin: 10px auto;
  border-bottom:1px solid #999;
}
.name{
  font-weight:700;
}

.rub{
width: 90px;
position: relative;
display: inline-block;
font-size: 12px;
}


#load{
  width:160px;
  height:30px;
  text-align:center;
  margin: 10px auto;
}
#load div, #mybtn, .mybtn{
   max-width:150px;
   margin: 5px;
   cursor:pointer;
   background: #6483aa;
   color:#fff;
   padding: 4px 10px 4px 10px;
   border:1px solid #2f4561;
   -webkit-border-radius: 2px;
   -moz-border-radius: 2px;
   border-radius: 2px;
}

#add div{
   height: 21px;
   width:25px;
   left: 87px;
   margin: 0px;
   cursor:pointer;
   background: #6483aa;
   color:#fff;
   padding: 4px;

   position: absolute;
   -webkit-border-radius: 0px;
   -moz-border-radius: 0px;
   border-radius: 0px;
}

#avatar{
cursor:pointer;
}

#hotlog_counter{position: absolute;top: 125px;right: 20px;}

.modal_div {
	width: 800px;
/*	height: 580px;  Ðaçìåðû äoëæíû áûòü ôèêñèðoâaíû */
	border-radius: 5px;
	border: 3px #000 solid;
	background: #fff;
	position: fixed; /* ÷òoáû oêío áûëo â âèäèìoé çoíå â ëþáoì ìåñòå */
	top: 45%; /* oòñòóïaåì ñâåðõó 45%, oñòaëüíûå 5% ïoäâèíåò ñêðèïò */
	left: 50%; /* ïoëoâèía ýêðaía ñëåâa */
	margin-top: -290px;
	margin-left: -400px; /* òóò âñÿ ìaãèÿ öåíòðoâêè css, oòñòóïaåì âëåâo è ââåðõ ìèíóñ ïoëoâèíó øèðèíû è âûñoòû ñooòâåòñòâåíío =) */
	display: none; /* â oáû÷íoì ñoñòoÿíèè oêía íå äoëæío áûòü */
	opacity: 0; /* ïoëíoñòüþ ïðoçða÷ío äëÿ aíèìèðoâaíèÿ */
	z-index: 5; /* oêío äoëæío áûòü íaèáoëåå áoëüøåì ñëoå */
	padding: 20px 10px;
}
/* Êíoïêa çaêðûòü äëÿ òåõ êòo â òaíêå) */
.modal_div .modal_close {
	width: 21px;
	height: 21px;
	position: absolute;
	top: 10px;
	right: 10px;
	cursor: pointer;
	display: block;
}
/* Ïoäëoæêa */
#overlay {
	z-index:3; /* ïoäëoæêa äoëæía áûòü âûøå ñëoåâ ýëåìåíòoâ ñaéòa, ío íèæå ñëoÿ ìoäaëüíoão oêía */
	position:fixed; /* âñåãäa ïåðåêðûâaåò âåñü ñaéò */
	background-color:#000; /* ÷åðíaÿ */
	opacity:0.8; /* ío íåìíoão ïðoçða÷ía */
	-moz-opacity:0.8; /* ôèêñ ïðîçðà÷íîñòè äëÿ ñòàðûõ áðàóçåðîâ */
	filter:alpha(opacity=80);
	width:100%;
	height:100%; /* ðaçìåðoì âo âåñü ýêðaí */
	top:0; /* ñâåðõó è ñëåâa 0, oáÿçaòåëüíûå ñâoéñòâa! */
	left:0;
	cursor:pointer;
	display:none; /* â oáû÷íoì ñoñòoÿíèè å¸ íåò) */
}

/*-----------------Âñïëûâàþùèå ïîäñêàçêè-------------------*/

.tooltip { /* ñòèëü òåêñòà, íàâåäÿ èëè íàæàâ íà êîòîðûé ïîÿâèòñÿ ïîÿñíåíèå */
  display: inline-block;
  position: relative;
  /*background: #E6E6E6;  öâåò ôîíà */
  text-indent: 0px;
  cursor: help; /* âèä êóðñîðà */
}
.tooltip > span { /* ñòèëü ïîÿâëÿþùåéñÿ ïîäñêàçêè */
  position: absolute;
  bottom: 100%;
  left: -20em; /* = max-width */
  right: -20em; /* = max-width */
  width: -moz-max-content;
  width: -webkit-max-content;
  width: max-content;  /* øèðèíà ïîäñêàçêè ìîæåò áûòü íå áîëåå ñîäåðæèìîãî */
  max-width: 20em;  /* øèðèíà ïîäñêàçêè ìîæåò áûòü íå áîëåå 20em */
  max-height: 80vh; /* íåîáÿçàòåëüíîå îãðàíè÷åíèå ïî âûñîòå ïîäñêàçêè, 1vh — ýòî 1% îò øèðèíû îêíà */
  overflow: auto;
  visibility: hidden;
  margin: 0 auto .6em; /* ïîäíÿòà íà .4em íàä òåêñòîì, íàâåäÿ èëè íàæàâ íà êîòîðûé ïîÿâèòñÿ ïîÿñíåíèå */
  padding: .3em;
  border: solid rgb(200,200,200);
  font-size: 80%;
  background: #fff;
  color:black;
  line-height: normal;
  cursor: auto;
  z-index: 100;
}
.tooltip.left > span { /* íà÷èíàåòñÿ îò ëåâîãî êðàÿ */
  left: 0;
  right: -20em;
  margin: 0 0 .4em;
}
.tooltip.right > span { /* íà÷èíàåòñÿ îò ïðàâîãî êðàÿ */
  left: -20em;
  right: 0;
  margin: 0 0 .4em auto;
}
.tooltip:after { /* òðåóãîëüíè÷åê ïîä ïîäñêàçêîé; òóò òîæå âåçäå .4em */
  content: "";
  position: absolute;
  top: -.6em;
  left: 50%;
  visibility: hidden;
  margin: 0 0 0 -.6em;
  border: .6em solid;
  border-color: rgb(200,200,200) transparent transparent transparent;
  cursor: auto;
}
.tooltip.left:after {
  left: 1em;
}
.tooltip.right:after {
  left: auto;
  right: .6em; /* 1em - .4em */
}
.tooltip:before { /* ïîëå ìåæäó òåêñòîì, íàâåäÿ èëè íàæàâ íà êîòîðûé ïîÿâèòñÿ ïîÿñíåíèå, è ïîäñêàçêîé íóæíî ÷òîáû, åñëè ïåðåâåñòè êóðñîð ìûøêè íà ïîäñêàçêó, òà íå èñ÷åçëà; òóò òîæå âåçäå .4em */
  content: "";
  position: absolute;
  top: -.4em;
  left: 0;
  right: 0;
  height: .4em;
  visibility: hidden;
}
.tooltip:hover > span,
.tooltip:hover:before,
.tooltip:hover:after,
.tooltip:focus > span,
.tooltip:focus:before,
.tooltip:focus:after {
  visibility: visible;
  transition: 0s .4s;
}
.tooltip:focus { /* óáðàòü ðàìêó â Õðîìå */
  outline: none;
}
.tooltip.anim > span,
.tooltip.anim:after { /* àíèìàöèÿ */
  opacity: 0;
  transform: translateY(1.5em) scale(.3);
  transform-origin: center bottom;
}
.tooltip.anim:after {
  transform: translateY(.7em) scale(.3); /* 1.7 = 1.5 / (1.4*2) */
}
.tooltip.anim:hover > span,
.tooltip.anim:hover:after,
.tooltip.anim:focus > span,
.tooltip.anim:focus:after {
  opacity: 1;
  transition: .6s .4s;
  transform: translateY(0);
}
@media (max-width: 20em) { /* øèðèíà ïîäñêàçêè ìîæåò áûòü íå áîëåå øèðèíû îêíà áðàóçåðà */
  .tooltip > span {
    max-width: 100vw; /* â 100vw âõîäèò ïîëîñà ïðîêðóòêè, íî íà ìîáèëüíûõ îíà ÷àñòî îòñóòñòâóåò */
    box-sizing: border-box;
  }

}
#chartd2{
    width: 50em;
    height: 300px;
    overflow: hidden;
    text-align: left;
    position: relative;
    left: -25%;}

</style>




