@font-face {
    font-family: IranianSans;
    src: url(IranianSans.ttf);
}
@font-face {
    font-family: Vazir;
    src: url('vazir/Vazir-Black.eot');
    src: url('vazir/Vazir-Black.eot?#iefix') format('embedded-opentype'),
            url('vazir/Vazir-Black.woff2') format('woff2'),
            url('vazir/Vazir-Black.woff') format('woff'),
            url('vazir/Vazir-Black.ttf') format('truetype');
    font-weight: 500;
}

:root
{
	/*
	STEEL BLUE
	#348CA4
	MIDDLE BLUE
	#84D4E4
	VAMPIRE BLACK
	#0C040C
	BLUE YONDER
	#547C9C
	DARK VANILLA
	#D8B4A4
	CHARCOAL
	#30404F
	*/
    --background-color1:#FFFFFF; 
    --background-color2:#30404F;
    --background-color3:#348CA4;
    --background-color4:rgba(253,209,16,0.6); /*#FDD110;*/
    
    --text-color1: #0C040C;
    --text-color2: #D8B4A4;
    --text-color3: #0C040C;
    --text-color4: #000000;
    
    --border-color1: #FFFFFF;
    --border-color2: #49274A;
}

body
{
	direction:rtl;
	margin: 0;
    font-family: Vazir;
    font-size: 12px;
	background-color:var(--background-color1);
}
table {
	border-collapse: collapse;
	border-spacing: 0;
	font-size: 12px;
}	
.content
{
	font-family:Vazir;
	font-size:12px;
	direction:rtl;
}
.content a
{
	text-decoration:none;
	color:black;
}
.menu
{
    background: black;  
    font-family: Vazir;
    color:white;
}

.menu_links_tr
{
    text-align:center;
    background:var(--background-color2);
    border:1px solid var(--border-color2);
}
.menu_links
{
    font-family: Vazir;
    font-size: 12px;
    font-weight:bold;
    text-align:center;
    color:var(--text-color2);
}
.menu_links a
{
    font-family: Vazir;
    color:var(--text-color2);
}
.menu_links a:hover
{
    font-family: Vazir;
    color:var(--text-color2);
}

.tables
{
	font-family:"Vazir",Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	border-collapse: collapse;
	direction:rtl;
    text-align: right;
}
.tables#selected
{
    background-color: gray;
}
#nowrap
{
	white-space: nowrap;
}
#rotate2
{
	display:inline-block;
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
	-webkit-transform: rotate(270deg);
	-ms-transform: rotate(270deg);
	transform: rotate(270deg);
}
#rotate
{
	-moz-transform: rotate(7.5deg);  /* FF3.5+ */
	-o-transform: rotate(7.5deg);  /* Opera 10.5 */
	-webkit-transform: rotate(7.5deg);  /* Saf3.1+, Chrome */
	filter:  progid:DXImageTransform.Microsoft.BasicImage(rotation=1);  /* IE6,IE7 allows only 1, 2, 3 */
	-ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)"; /* IE8 allows only 1 2 or 3*/
}
.tablessum
{
	font-family:"Vazir",Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	background-color:#00a651;
	color:#000000;
	text-align:center;
	font-weight:bold;
    height: 30;
}
.tablesheader
{
	font-family:"Vazir",Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	background-color:var(--background-color3);
	color:var(--text-color3);
	text-align:center;
	font-weight:bold;
    height: 30;
}
.tablesheader_print
{
	font-family:"Vazir";
	font-size:12px;
	text-align:center;
	font-weight:bold;
    height: 30;
}

.tableslist
{
    font-family:"Vazir";
	font-size:12px;
    border-collapse: collapse;
    direction:ltr;
    text-align:center;
}
.tableslist#selected
{
    background-color: gray;
}

.tableslistr
{
    font-family:"Vazir";
	font-size:12px;
    border-collapse: collapse;
    direction:rtl;
    text-align:center;
}
.tableslistr#selected
{
    background-color: gray;
}

.warning
{
	font-weight:bold;
	
}

input
{
	font-family: Vazir;
	border-radius: 5px;
	padding: 10px;
	border: 1px solid var(--border-color2);
	background-color: var(--background-color1);
	width: 95%;
}
textarea
{
	font-family: Vazir;
	border-radius: 5px;	
	padding: 1px;
	border: 1px solid var(--border-color2);
	background-color: var(--background-color1);
	width: 95%;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
}
input[type="radio"] {
	width:20%;
	border: 3px solid var(--border-color1);
	background-color: var(--background-color1);
}
input[type="checkbox"] {
	width:20px;
	border: 3px solid var(--border-color1);
	background-color: var(--background-color1);
}
select {
    font-family: Vazir;
	border-radius: 5px;	
	padding: 1px;
	border: 1px solid var(--border-color2);
	background-color: var(--background-color1);
	width: 95%;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius: 10px;
}
button
{
	font-family: Vazir;
    font-weight:bold;
    width:auto;
    cursor: pointer; 
	border-radius: 5px;	
    padding: 10px; 
	border: 1px solid var(--border-color2);
	background-color: var(--background-color1);
	color: #040301;
}

.taskbar
{
	background-color:var(--background-color2);
    direction:rtl;
    font-size: 12px;
    color:var(--text-color2);
}
.taskbar a
{
	color:var(--text-color2);
}
.taskbar a:hover
{
    color:var(--text-color2);
}

.footer
{
    background-color:var(--background-color2);
    color:var(--text-color2);
    text-align: center;
    width: 100%;
}

/*auto complete */
/* highlight results */
.ui-autocomplete span.hl_results {
    background-color: #ffff66;
}
 
/* loading - the AJAX indicator */
.ui-autocomplete-loading {
    background: white url('../img/ui-anim_basic_16x16.gif') right center no-repeat;
}
 
/* scroll results */
.ui-autocomplete {
    max-height: 250px;
    overflow-y: auto;
    /* prevent horizontal scrollbar */
    overflow-x: hidden;
    /* add padding for vertical scrollbar */
    padding-right: 5px;
}
 
.ui-autocomplete li {
    font-size: 16px;
}
 
/* IE 6 doesn't support max-height
* we use height instead, but this forces the menu to always be this tall
*/
* html .ui-autocomplete {
    height: 250px;
}