/* Utilites
------------------------------ */

* { margin: 0; padding: 0; }

*:focus { outline: none; }
.hidden { display: none; }
.show { display: block!important; }
.no-margin { margin: 0!important; }
.no-padding { padding: 0!important; }
.no-bg { background: none!important; }
.no-border{ border: none!important; }

table.no-border td{
	border: none!important;
}

.container { overflow: hidden; }
.img-repl { text-indent: -9999px; overflow: hidden; display: block; }
.clear{clear: both;}
.clear-left{clear: left;}
.clear-right{clear: right;}

.w-100{
	width: 99%;
}
.w-50{
	width: 49%;
}
.a-center{
	text-align: center;
}
.a-left{
	text-align: left;
}
.a-right{
	text-align: right;
}

.f-left{
	float: left;
}
.f-right{
	float: right;
}


/* Main custom rules
------------------------------ */

html {
	background: #5d86bd url(../_img/bg.png) repeat-x top;
	font: .75em/1.5 Verdana, Arial, Helvetica, sans-serif;
}
body {
	color: #28567c;
	background-color: #5d86bd;
	background-image: url(../_img/bg.png);
	background-position: top;
	background-repeat: repeat-x;
	font-size: 0.9em;
}


a { }
a:visited {  }
a:hover {  }
a:active {  }


/** Verstka
*******************************************/

#top{
	background: transparent url(../_img/bg-2.png) no-repeat left top;
	overflow: hidden;
}

#top-contaner{
	width: 1000px;
	margin: 20px auto;
}


/** Top-menu
****************************/
#top-menu-contaner{
	position: relative;
	height: 30px;	
	}
	#top-menu{
		overflow: hidden;
		position: absolute;
		right: 0;
		bottom: -1px;
		}
		#top-menu li{
			list-style: none;
			float: left;
			background-color: #a7c3e5;
			border: 1px solid #5f83b1;
			padding: 5px 10px;
			margin: 0 0 0 2px;
			font-size: 11px;
			color: #6D92C2;
			}
		#top-menu li:hover{
			background-color: #b9d1ee;
			}
		#top-menu li.disabled:hover{
			background-color: #a7c3e5;
			}
		#top-menu li.selected{
			background-color: #d0e1f7;
			border-bottom-color: #d0e1f7;
			}
			#top-menu li a{
				text-decoration: none;
				color: #28567c;
				}



#top-body-contaner{
	background: #e6f0fc url(../_img/body-bg.png) repeat-x top;
	border: 1px solid #6184ac;
	padding: 20px 0 10px 0;
	overflow: hidden;
}

#left-col{
	width: 220px;
	vertical-align: top;
	padding-bottom: 20px;
	}
#logo{
	width: 120px;
	height: 53px;
	margin: 0 auto;
	background: transparent url(../_img/logo.png);
}

#left-menu{
	margin: 15px 0;
}

#left-menu ul{
	list-style: none;
	border-bottom: 1px solid #b6d1ea;
}

#left-menu li{
	background-color: transparent;
	border-top: 1px solid #b6d1ea;
}
#left-menu li:hover{
	background-color: #f0f6fd;
}


#left-menu li a{
	text-decoration: none;
	background-color: transparent;
	display: block;
	color: #4a6b92;
	padding: 8px 10px;
}
#left-menu li.selected{
	background-color: White;
	border-top: 1px solid #9dbede;
	border-bottom: 1px solid #9dbede;
	position: relative;
}
#left-menu li.selected a{
	background-color: White;
	position: relative;
	left: 1px;
	color: #9b5b6f;
	font-weight: bold;
}

#right-col{
	width: 770px;
	min-height: 500px;
	background-color: White;
	border: 1px solid #9bbddd;
	vertical-align: top;
}
#full-col{
	width: 979px;
	min-height: 500px;
	background-color: White;
	border: 1px solid #9bbddd;
	margin: 0 auto;	
	position: relative;
	z-index: 1;
}
.menager-top-toolbar{
	width: 981px;
	margin: 0 auto 1.5em auto;
	overflow: hidden;
}
.menager-top-toolbar .meneger-list{
	float: left;
}
.menager-top-toolbar .exit-link{
	float: right;
}
.menager-top-menu{
	width: 981px;
	margin: 0 auto;
	position: relative;
	z-index: 2;
	overflow: hidden;
	border: none;
	top: 1px;
}

.menager-top-menu ul{
	margin: 0;
	list-style: none;
}

.menager-top-menu ul li{
	float: left;
	list-style: none;
	border: 1px solid #9ebfde;
	font-weight: bold;
	border-bottom: none;
	
}
.menager-top-menu ul li a{
	display: block;
	width: 325px;
	padding: 5px 0;
	background: #ddeafa url(images/ui-bg_glass_75_d1e1f7_1x400.png) repeat-x 50% 50%;
	color: #627b9a;
	text-align: center;
	text-decoration: none;
	border-bottom: 1px solid #9ebfde;	
}
.menager-top-menu ul li a:hover{
	background: #fff url(images/ui-bg_glass_55_fffae1_1x400.png) repeat-x 50% 50%;
}
.menager-top-menu ul li.selected a{
	background: #fff;
	background: #fff url(images/ui-bg_flat_75_ffffff_40x100.png) repeat-x 50% 50%;
	border-bottom: 1px solid #fff;
}

#body-contaner{
	padding: 10px;
}

#body-contaner h1, h1{
	border: 1px solid #9ebfde;
	background: #ddeafa url(images/ui-bg_glass_75_d1e1f7_1x400.png) repeat-x 50% 50%;
	color: #627b9a;
	font-weight: bold;
	font-size: 14px;
	padding: 3px 8px;
	margin-bottom: 1em;
}
#body-contaner p{
	margin: 1em 0;
}

#body-contaner h2{
	font-weight: bold;
	font-size: 14px;
	margin-bottom: 1em;
	text-align: center;
}

.filters{
	border: 1px solid #9bbdde;
	background-color: #ebf2fb;
	padding: 10px;
	margin: 1em 0;
}

.filters table{
	width: 100%;
}

.filters table td{
	padding: 4px;
	vertical-align: middle;
}

.filters table td.label{
	text-align: right;
}

.filters table td.buttons{
	padding-top: 15px;
}

.grid_contaner{
	margin: 1em 0;
}

.pagenator{
	margin: 1em 0;
	overflow: hidden;
}
.pagenator  .pages{
	float: left;
	text-align: left;
}

.pagenator  .total{
	float: right;
	text-align: right;
}

table.grid{
	width: 100%;
	layout-grid: fixed;
	border: 1px solid #6083ac;
	border-collapse: collapse;
}

table.grid thead th{
	background-color: #88a5c7;
	color: #fff;
	text-align: left;
	font-weight: normal;
	padding: 3px 5px;
	border: 1px solid #6083ac;
	
}

table.grid tbody tr td{
	background-color: #ffffff;
	text-align: left;
	padding: 3px 5px;
	border: 1px solid #6083ac;
	cursor: default;
}
table.grid tbody tr:hover td{
	background-color: #e8f1fc;	
}
table.grid tbody tr.selected td{
	background-color: #fff8d4;	
}

table.grid tbody tr.disabled td{
	background-color: #ebebeb;	
	color: #878787;
}



table.properties{
	width: 100%;
	border: 1px solid #BED4	E9;
	background-color: #ebf2fb;
	border-collapse: collapse; 
}

table.properties td{
	padding: 4px;
	vertical-align: middle;
	border: 1px solid #BED4E9;
}

table.properties td.label{
	text-align: right;
	font-weight: bold;
}
table.properties thead th{
	background: #ddeafa url(images/ui-bg_glass_75_d1e1f7_1x400.png) repeat-x 50% 50%;
	font-weight: bold;
	text-transform: uppercase;
	text-align: center;
	padding: 5px 0 5px 0;
}

.buttons-bar{
	margin: 1em 0;
	text-align: right;
}

.notes{
	font-size: 0.9em;
	font-weight: normal;
	font-style: italic;
}

/** Interface
**********************************************/

div.ui-state-error{
	padding: 1em;
	margin: 1em 0;
}

div.ui-state-highlight{
	padding: 1em;
	margin: 1em 0;
}

div.ui-state-error ul, div.ui-state-error ol, div.ui-state-highlight ul, div.ui-state-highlight ol{
	margin: 1em 0 1em 2em;
	padding-left: 2em;
}

div.ui-state-error .ui-icon, div.ui-state-highlight .ui-icon{
	display: inline-block;
	vertical-align: middle;
	margin-right: .3em;
}


button.ui-button {
	padding: 3px;
	vertical-align: middle;	
	cursor: pointer;
	overflow: visible;
}
button.ui-button table{
	border: none!important;
	margin: 0;
	padding: 0;
	border-collapse: collapse;
}
button.ui-button table td{
	/*border: 1px solid #fff!important;*/
	border: none!important;/**/
	padding: 0px;
	margin: 0;
	font-size: 1em;
	line-height: 1em;
	vertical-align: middle;
}
button.ui-button td.icon{
	padding: 0px;
	cursor: pointer;
	vertical-align: middle;
}
button.ui-button .label{	
	padding: 0px 4px;
	padding-top: 1px;
	cursor: pointer;
	white-space: nowrap;
	vertical-align: middle;
}



input.text, #body-contaner select, input.date, input.datetime, input.time{
	background-color: #fff;
	border: 1px solid #50729d;
	color: Black;
	padding: 1px;
	vertical-align: middle;
	font-size: 1.1em;
}
input.date{
	width: 80px;
	border-right: none!important;
}


.input-icons{
	/*display: inline-block; vertical-align: middle; padding: 1px; border-left: none!important;*/
}
button.ui-datepicker-trigger{
	vertical-align: middle;
	padding: 0px 0px;
	line-height: 1em;
	height: 20px;
}

input.checkbox{
	vertical-align: middle;
}

textarea{
	background-color: #fff;
	border: 1px solid #50729d;
	color: #28567c;
}

input.readonly{
	color: #FF1493;
}

/** departments
****************************************/
img.departments{
	width: 18px;
	height: 8px;
	background-color: transparent;
	border: 1px solid #6083ac!important;
}
img.iqschool{
	background-color: #08c104;
}
img.abroad{
	background-color: #ff8400;
}
img.edustaff{
	background-color: #b4d7ff;
}

.legends{
	margin: 1em 0;
	padding: 1em 0;
	border-top: 1px solid #bacadb;
}

/** magic_rows
****************************************/
.magic_rows .row{
	margin: 2px 0;
}
.magic_rows .row button.add, .magic_rows .row button.delete{
	margin-left: 3px;
}


/** COMMENTS
*********************************************/

.commentsContaner .item{
		margin: 0.5em 0 1.5em 0;
		padding: 0;
		border-top: 1px dashed #BED4E9;
	}
.commentsContaner .item:hover{
	background-color: #FFFFF0;
}
.commentsContaner .item .properties{
	margin-bottom: 0.3em;
	overflow: hidden;
	background-color: #ebf2fb;
	padding: 2px 5px;
}

.commentsContaner .item .properties .date{
	display: block;
	float: right;
	font-style: italic;
}
.commentsContaner .item .properties .commentator{
	display: block;
	float: left;
	font-size: 1.2em;
	font-weight: bold;
}


.commentsContaner .item .comment{
	padding: 0.5em 1em;
}



/** .confirmActionDialog
***************************************************************************************/

.confirmActionDialog{
	border: 1px solid #6184ac;
	background-color: #FFF;
	padding: 0;
	outline: 8px solid #afc9eb!important;/**/
}
.confirmActionDialog .ui-dialog-titlebar{
	background: #678ab1!important;
	color: #fff;
	padding: 5px 10px;
	font-size: 1.1em;
	font-weight: bold;
	border: none;
}

.confirmActionDialog .ui-dialog-content{
	padding: 10px 10px 10px 10px;
}

.confirmActionDialog .ui-dialog-buttonpane{
	padding: 5px 10px;
	background-color: #e8ebf0;
	border-top: 1px solid #c2cfe0;
	text-align: right;
}
.confirmActionDialog .ui-dialog-content .mesage{
	margin-bottom: 0.5em;
}

.confirmActionDialog .ui-dialog-content input{
	width: 260px;
	background-color: #e8ebf0;
	border: 1px solid #6184ac;
	padding: 2px;
}

.confirmActionDialog .ui-dialog-content textarea{
	background-color: #e8ebf0;
	border: 1px solid #6184ac;
	padding: 2px;
	width: 100%;
}


/** Statuses
************************************************/
	.status_0{color: black;}
	.status_1{color: blue;}
	.status_a1{
	color: Black;
}
	.status_2{color: green;}
	.status_a2{color: blue;}
	.status_3{color: red;}
	.status_a3{color: green;}
	.status_a4{color: red;}