/* CSS Document */
/*@font-face{*/
/*	font-family: 'B Nazanin';*/
/*	src:*/
/*		url("../fonts/B-nazanin.TTF") format('ttf'),*/
/*		url("../fonts/B-nazanin.woff") format('woff'),*/
/*		url("../fonts/B-nazanin.woff2") format('woff2');*/
/*}*/

/*@font-face{*/
/*	font-family: 'B Koodak';*/
/*	src:*/
/*		url("../fonts/B-koodak.ttf") format('ttf'),*/
/*		url("../fonts/B-koodak.woff") format('woff'),*/
/*		url("../fonts/B-koodak.woff2") format('woff2');*/
/*}*/

/*-------- Variables --------*/
:root{
	/*-------- Colors ---------*/
	--form-background-color: rgba(255, 255, 255, 0.75);
	/*--titles-font-colors:#007eff;*/
	/*--titles-font-colors:#23067b;*/
	--formsAndMenus-border-color:rgba(84, 241, 202, 0.6);
	--formsAndMenus-shadow-color:rgba(84, 241, 202, 0.6);
	--headerOfDataTable-background-color:#0080ff;
	--headerOfDataTable-font-color: #cce4ff;
	--oddRowsOfDataTable:#e6ebff;
	--evenRowsOfDataTable:#b3c2ff;
	--hoverOddRowsOfDataTable:#CCFF33;
	--hoverEvenRowsOfDataTable:#CCFF33;
	--fontColorOfDetailsRowsOfDataTable: #063b79;
	--data-table-header-font-color: #959393;
	--datatable-font-color: rgb(85, 81, 81);
	--common-input-font-color: #423f3f;
	--search-input-font-color: #635e5e;
	--forms-font-color: rgb(66, 62, 62);
	--disabled-text-font-color: #cacaca;
	--enabled-text-font-color:rgba(0, 0, 0, 0.7);
	--formBox-shadow-color:#cacaca;
	--formBox-border-color:rgba(169, 169, 169, 0.6);
	--searchInputs-border-color:rgba(84, 241, 202, 0.6);
	--searchInputs-shadow-color:rgba(84, 241, 202, 0.6);
	--commonInputs-border-color:rgba(32, 105, 253, 0.6);
	--commonInputs-shadow-color:#2069fd;
	--error-commonInputs-border-color: rgba(255, 46, 46, 0.6);
	--error-commonInputs-shadow-color: #ff0d0d;
	/*-------- sizes ---------*/
	--object-shadow-size:0 0 10px;
	/*--object-shadow-size:2px 2px;*/
	--object-border-size:1px;
	/*-------- fonts ---------*/
	--inputs-font-size:15px;
	--larg-inputs-font-size:16px;
	--small-inputs-font-size:14px;

	--table-font-size:15px;
	--detail-cell-font-size:13px; /*joziate jadval*/
	--table-header-font-size:16px;
	--detail-table-font-size:15px; /*jadval joziat*/

	--header-font-size:18px;

	--data-table-font:"B koodak";
	--form-table-font:"B koodak";
	--detail-table-font:"B koodak";
	--header-font-:"B koodak";
}

/*------------------------------------------------------------------
Data Table Style
------------------------------------------------------------------ */
table.data {
    color:var(--datatable-font-color);
    font-size:var(--table-font-size);
	margin: 5px auto 30px auto; /* top right bottom left*/
   	border-spacing: 0;
	box-shadow: var(--object-shadow-size) var(--formBox-shadow-color);
}

table.data thead {
	background-color:var(--headerOfDataTable-background-color);
	color: var(--headerOfDataTable-font-color);
}

table.data th{
	font-size: var(--table-header-font-size);
	padding:8px;
	white-space: nowrap;
	text-align: center;
}

table.data td:not(.detailsContainerCell,.SMSTextContainerCell) {
	padding:  5px 10px 5px 10px;
	text-align: center;
}

table.data img{
	height: 22px;
}

tr.totalValueContainer{
	font-size: 18px;
	color: white;
	background-color: rgb(187, 187, 187);
}

#wrapper {
	margin: auto;
	background-color: gray;
	height: 320px;
	width:auto;
	overflow-x: scroll;
	overflow-y: scroll;
}

#dataTableContainer{
	text-align: center;
}

#dataTableMessage{
	text-align: center;
}

.actionIcon{
	margin: 0 8px 0 8px;
	cursor: pointer;
	height: 25px;
}

.disActiveActionIcon{
	margin: 0 8px 0 8px;
	height: 25px;
}

.detailsContainerRow{ /* for details (transaction) rows of payment table */
	font-size: var(--detail-cell-font-size);
	color: var(--fontColorOfDetailsRowsOfDataTable) ;
	/*display: none;*/
}

.detailsContainerCell{ /* for details (transaction) cell of payment table */
	text-align: right;
}

.SMSTextContainerCell{ /* for details (SMS text) cell of auto SMS table */
	padding: 7px;
	text-align: right;
	word-break: break-word;
	max-width: 300px;
}

.hiddenDetailsContainerRow{
	display: none;
}

.summationRow{
	font-size: 18px;
	background-color: rgba(17, 186, 147, 0.71);
	color: white;
}
/* --------------------------------------------------------- */
.tableAndFormTitle { /* this class is for the tables that contain titles of data tables */
	margin:60px auto 20px auto;
	text-align: center;
	color:var(--titles-font-colors);
	font-size:var(--header-font-size);
	font-weight: bold;
	/*font-family:B Nazanin;*/
	border-radius: 8px;
	background-color: var(--form-background-color);
	padding-top: 5px;
	padding-bottom: 5px;
	box-shadow: var(--object-shadow-size) var(--formBox-shadow-color);
	border:var(--object-border-size) var(--formBox-border-color);
	max-width: 62%;
}

.titleContainerTd{ /* the center Td of the table of form title */
	padding-right: 30px;
	padding-left: 30px;
	overflow-wrap: break-word;
	line-height:2
}

.leftSideOfTitleContainerTd{ /* the left side Td of the table of form title */
	padding-left: 32px;
}

.showAddFormIcon{ /* the image tag in the td at right side of the table of form title contains add icon*/
	cursor: pointer;
	vertical-align: 10px;
	width: 32px;
}
/*--- sub form title ---*/
td.subFormTitleContainer{
	font-size: var(--table-header-font-size);
	color: var(--data-table-header-font-color);
	/*font-family: "B Nazanin";*/
}

.subFormTitleContainer img{
	height: 24px;
	margin-left: 5px;
	vertical-align: 10px;
}

.subFormTitle {
	vertical-align: 13px;
}
/*-----------------------*/
.hideFormIcon{
	height: 22px;
	cursor: pointer;
	margin-left: 8px;
	/*position: relative;*/
	/*left: 180px;*/
	/*top: 3px;*/
}
/* --------------------- form ------------------------ */
.form{
	display: grid;
	grid-template-columns: repeat(4,auto);
	border-radius: 8px ;
	border: solid var(--object-border-size) var(--formBox-border-color);
	background-color: var(--form-background-color);
	box-shadow: var(--object-shadow-size) var(--formBox-shadow-color);
	margin: auto;
	padding: 20px;
	width: max-content;
}

.formTitle{
	grid-column: 1/-1;
	/*padding-bottom: 10px;*/
	padding-top: 15px;
}
/*--------------- form separator ---------------*/
.formSeparator{
	grid-column: 1/-1;
	padding: 10px 0 20px 0;
	color: var(--data-table-header-font-color);
	font-size: var(--table-header-font-size);
	display: flex;
	flex-direction: row;
}

.rightSeparator{
width: 5%;
}

.titleSeparator{
	width: 18%;
	padding-right:10px ;
}

.formSeparator hr{
	margin-top: 20px;
}

.formSeparator img{
	display: inline;
	height: 25px;
	margin-left: 6px;
}

.leftSeparator{
	width: 77%;
}
/*-----------------------------------------*/
.inputComponentsContainer{
	display: grid;
	grid-template-columns: max-content max-content;
	grid-template-rows: auto max-content;
	/*border:solid 1px black;*/
}

.bigInputComponentsContainer{
	grid-column: span 2;
}

.inputTitleContainer{
	padding-left: 8px;
	padding-right: 20px;
}

.inputMessageContainer{
	grid-column: span 2;
	font-size: 0.7rem;
	color: red;
	grid-column: 3/2;
	padding: 5px 0 15px 0;
}





.formTable {
	border-spacing: 5px;
	/*font-family: "B Nazanin";*/
	font-size: var(--table-font-size);
	color: var(--forms-font-color);
	background-color: var(--form-background-color);
	box-shadow: var(--object-shadow-size) var(--formBox-shadow-color);
	padding: 7px;
	margin: 20px auto 15px auto; /* top right bottom left*/
	border-radius: 8px ;
	border: solid var(--object-border-size) var(--formBox-border-color);
}

.formTable td:not(.formTitle,.errorRow td){
	text-align: right;
	padding: 0px 2px 0px 2px;
}

.formTitle{
	text-align: center;
	font-size: var(--header-font-size);
	color: var(--data-table-header-font-color);
	/*font-family: "B Nazanin";*/
}

.formTitle span{
	vertical-align: 5px;
}

.formTable td.SubmitTd{
	text-align: center;
	padding: 0px;
}

.formTable th{
	outline: var(--object-border-size) solid var(--commonInputs-border-color);
	box-shadow: var(--object-shadow-size) var(--commonInputs-shadow-color);
	border-radius: 8px;
	/*background-color: var(--commonInputs-shadow-color);*/
	padding-top: 7px;
	padding-bottom: 7px;
	font-size: 15px;
	font-weight: bold;
}

.searchIcon{
	content:url("../images/small_search_icon.png");
	margin-left: 10px;
}

.formTitle hr{
	width: 98%;
}

td.formTitle label{
	margin-right: 38px;
	vertical-align:bottom;
}

.elementsAndUnits{
	margin-right: 8px;
}

.rightInputLabel{
	margin-right:2px;
	margin-left:14px ;
	vertical-align: 5px;
}

.leftInputLabel{
	margin-right:2px ;
	margin-left:0px ;
	vertical-align: 5px;
}

.inputLabel{
	margin-right:0px ;
	margin-left:7px ;
	vertical-align: -1px;
}

.disabledRightInputLabel{
	color: #9e9c9c;
	margin-right:2px;
	margin-left:14px ;
	vertical-align: 5px;
}

#sampleTextContainer{
	max-width: 150px;
	height: 50px;
	max-height: 100px;
	color: #09f509;
	overflow-wrap: break-word;
	outline: var(--object-border-size) solid var(--commonInputs-border-color);
	box-shadow: var(--object-shadow-size) var(--commonInputs-shadow-color);
	border-radius: 8px;
}

#SMSCounterContainer{
	color: #848282;
	font-size: 14px;
	padding: 0 10px 0 0;
}

#SMSCounterContainer div{
	margin-top: 3px;
	margin-bottom: 3px;
}

/* for necessary inputs*/
.necessaryInput{
	content:url(../images/necessary_icon.png);
	height: 7px;
	margin: 0px 2px 0px 0px;
}
/*------------ the style for user profile data --------------*/
.userProfileData{
	text-align: right;
	/*font-family:B Nazanin ;*/
	color:var(--datatable-font-color);
	font-size:var(--header-font-size);
	padding: 10px;
	margin: 30px 0px 30px 0px;
	display: inline-table;
	box-shadow: var(--object-shadow-size) var(--formsAndMenus-shadow-color);
	border-radius: 8px;
	border-spacing: 0;
}

.userProfileData td{
	padding: 5px;
	text-align: right;
}
/*---------- the styles for common class inputs ----------*/
textarea{
	font-size:var(--small-inputs-font-size) ;
	font-weight: 100 ;
	/*font-family: "B Nazanin";*/
	color: var(--search-input-font-color);
	text-align: right;
	/*width: 430px;*/
	/*height: 25px;*/
	border: 0px;
	border-radius: 5px ;
	cursor:auto ;
	box-shadow: var(--object-shadow-size) var(--formBox-shadow-color);
	font-family: "B Koodak";
	resize: none;
}
textarea:focus{
	outline: var(--object-border-size) solid var(--commonInputs-border-color);
	box-shadow: var(--object-shadow-size) var(--commonInputs-shadow-color);
}

input[type='number']{
	width: 40px;
}

select{
	font-size: var(--small-inputs-font-size) ;
	font-weight: 100 ;
	font-family: "B Koodak";
	color: var(--search-input-font-color);
	text-align: right;
	border: 0px;
	border-radius: 5px ;
	cursor:auto ;
	box-shadow: var(--object-shadow-size) #cacaca;
}

select:focus{
	outline: var(--object-border-size) solid var(--commonInputs-border-color);
	box-shadow: var(--object-shadow-size) var(--commonInputs-shadow-color);
}

input.common {
	height: 30px;
	font-size: var(--inputs-font-size) ;
	font-weight: 100 ;
	font-family: "B Koodak";
	color: var(--common-input-font-color);
	border: 0px;
	border-radius: 15px ;
	padding-left: 5px ;
	padding-right: 5px ;
	cursor:auto ;
	outline: var(--object-border-size) var(--formBox-border-color);
	box-shadow: var(--object-shadow-size)  var(--formBox-shadow-color);
}

input.common:focus{
	outline: var(--object-border-size) solid var(--commonInputs-border-color);
	box-shadow: var(--object-shadow-size) var(--commonInputs-shadow-color);
}

input.common.invalid:focus{
	outline: var(--object-border-size) solid var(--error-commonInputs-border-color);
	box-shadow: var(--object-shadow-size) var(--error-commonInputs-shadow-color);
}

input.common.invalid{
	outline: var(--object-border-size) solid var(--error-commonInputs-border-color);
	box-shadow: var(--object-shadow-size) var(--error-commonInputs-shadow-color);
}
textarea.invalid{
	outline: var(--object-border-size) solid var(--error-commonInputs-border-color);
	box-shadow: var(--object-shadow-size) var(--error-commonInputs-shadow-color);
}

input.common::-webkit-input-placeholder {
	font-size: var(--small-inputs-font-size);
	/*font-family: "B Nazanin";*/
	color: #c3c3c3;
}

input[type=checkbox].common{
	outline: 0px;
}

/*---------- the styles for radio buttons for common class ----------*/
input.radioCommon{
	-webkit-appearance:none;
	width:20px;
	height:20px;
	border:var(--object-border-size) solid --formBox-border-color;
	border-radius:50%;
	outline:none;
	box-shadow:var(--object-shadow-size) var(--formBox-shadow-color);
	/*margin-top: 10px;*/
}

.radioLabel{
	vertical-align:5px ;
}

input.radioCommon:hover {
	border: var(--commonInputs-border-color) solid var(--object-border-size);
	box-shadow:var(--object-shadow-size) var(--commonInputs-shadow-color) ;
}

input.radioCommon:before {
	content:'';
	display:block;
	width:60%;
	height:60%;
	margin: 20% auto;
	border-radius:50%;
}

input.radioCommon:checked:before {
	background: var(--commonInputs-border-color);
	box-shadow:var(--object-shadow-size) var(--commonInputs-shadow-color) ;
}

/*---------- the styles for inputs of search class ----------*/
input.search {
	height: 30px;
	font-size: var(--inputs-font-size) ;
	font-weight: 100 ;
	font-family: "B koodak";
	color: var(--search-input-font-color);
	background-color: rgba(255, 255, 255, 0);
	border: 0px;
	border-radius: 20px ;
	padding: 3px 5px 3px 5px;
	cursor: auto ;
	box-shadow: var(--object-shadow-size) #d7d7d7;
	margin-bottom: 4px;
}

input.search:focus{
	outline: var(--object-border-size) solid var(--searchInputs-border-color);
	box-shadow: var(--object-shadow-size) var(--searchInputs-shadow-color);
}

input.search::-webkit-input-placeholder {
	font-size: var(--small-inputs-font-size);
	font-family: "B koodak";
	color: #c3c3c3;
}
/*------------ style of range input ------------*/
.slider {
	width: 175px;
	cursor: pointer;
}
/*--------------------- date input (search forms) ----------------- */
.dateInputContainer{
	width: 50px;
	background-color: rgba(255, 255, 255, 0);
	outline: 0px solid;
	border-radius: 50px;
	padding: 3px 5px 3px 5px;
	cursor: auto ;
	box-shadow: var(--object-shadow-size) var(--formBox-shadow-color);
	margin-top: 10px;
}

.dateInputContainer img {
	display: inline;
	margin-left: 0px;
	margin-right: 0px;
	width: 3px;
	vertical-align: bottom;
	cursor: pointer;
}

.dateInput {
	font-size: var(--inputs-font-size) ;
	font-weight: 100 ;
	font-family: "B Koodak";
	color: var(--search-input-font-color);
	height: 20px;
	width: 80px;
	background-color: rgba(255, 255, 255, 0);
	border: 0px;
}

.dateInput:focus{
	outline: 0px solid rgba(255, 255, 255, 0);
}

input.dateInput::-webkit-input-placeholder {
	font-size: var(--small-inputs-font-size);
	color: #c3c3c3;
}
/*---------- the styles for radio buttons for search class ----------*/
input.radioSearch{
	-webkit-appearance:none;
	width:20px;
	height:20px;
	border:var(--object-border-size) solid var(--formBox-border-color);
	border-radius:50%;
	outline:none;
	box-shadow:var(--object-shadow-size) var(--formBox-shadow-color);
	margin-top: 10px;
}

input.radioSearch:hover {
	box-shadow:var(--object-shadow-size) var(--searchInputs-shadow-color) ;
	border: var(--searchInputs-border-color) solid var(--object-border-size);
}

input.radioSearch:before {
	content:'';
	display:block;
	width:60%;
	height:60%;
	margin: 20% auto;
	border-radius:50%;
}

input.radioSearch:checked:before {
	background: var(--searchInputs-border-color);
	box-shadow:var(--object-shadow-size) var(--searchInputs-shadow-color) ;
}
/*---------- the styles for search and common check box class ----------*/
input[type="checkbox"].search,input[type="checkbox"].common {
	position: absolute;
	visibility: hidden;
}

label.searchCheck,label.commonCheck {
	display: inline-block;
	width: 20px;
	height: 20px;
	border-radius: 4px;
	margin: 0 auto;
	background-color: #fff;
	cursor: pointer;
	border: var(--formBox-border-color) solid var(--object-border-size);
	box-shadow:var(--formBox-shadow-color) var(--object-shadow-size);
}

.disableText{
	color: var(--disabled-text-font-color);
}

.enabledText{
	color: var(--enabled-text-font-color);
}
/*------ search ------*/
input:checked + label.searchCheck {
	background:  url(../images/searchCheckmark.png) no-repeat;
	background-size: 20px 20px;
}

input:hover + label.searchCheck {
	border: var(--searchInputs-border-color) solid var(--object-border-size);
	box-shadow:var(--searchInputs-shadow-color) var(--object-shadow-size);
}
/*------ common ------*/
input:checked + label.commonCheck {
	background:  url(../images/commonCheckMark.png) no-repeat;
	background-size: 20px 20px;
}

input:hover + label.commonCheck {
	border: var(--commonInputs-border-color) solid var(--object-border-size);
	box-shadow:var(--commonInputs-shadow-color) var(--object-shadow-size);
}

.checkBoxLabel{
	vertical-align: 6px;
	margin-right: 3px;
	margin-left: 12px;
}
/*---------- the styles for dropDown menu for search class ----------*/
select.optionSearch{
	background-color: rgba(255, 255, 255, 0);
	font-size: var(--small-inputs-font-size);
	font-weight: 100 ;
	/*font-family: "B Nazanin";*/
	color: #c3c3c3;
	text-align: right;
	border: 0px;
	border-radius: 5px ;
	cursor:auto ;
	box-shadow: var(--object-shadow-size) #cacaca;
	padding: 2px;
	margin-top: -3px;
}

select.optionSearch:focus{
	outline: 1px solid var(--searchInputs-border-color);
	box-shadow: var(--object-shadow-size) var(--searchInputs-shadow-color);
}
/*-------------------the styles for inputs of submission class----------------------*/
.submission {
	width:114px;
	height:49px;
	margin-top: 7px;
	margin-bottom: 2px;
	background:url(../images/submission_blue.png) no-repeat;
	border:none;
	cursor:pointer;
	color: white;
	font-family: "B Koodak";
	font-size: var(--larg-inputs-font-size);
	padding-bottom: 10px;
}

.disabledSubmission{
	width:114px;
	height:49px;
	margin-bottom: 10px;
	background:url(../images/submission_gray.png) no-repeat;
	border:none;
	color: white;
	/*font-family: "B Nazanin";*/
	font-size: var(--larg-inputs-font-size);
	padding-bottom: 10px;
}

.submission:hover{
	background:url(../images/submission_yellow.png) no-repeat;
}

.searchSubmission {
	width:100px;
	height:38px;
	margin-top: 5px;
	margin-bottom: 5px;
	background-color: rgba(255, 255, 255, 0);
	border: solid var(--object-border-size) var(--formBox-border-color);
	border-radius: 50px;
	box-shadow: var(--object-shadow-size) var(--formBox-shadow-color);
	cursor:pointer;
	color: var(--search-input-font-color);
	/*font-family: "B Nazanin";*/
	font-size: var(--inputs-font-size);
}
.searchSubmission:hover{
	border: solid 1px #cacaca;
	box-shadow: var(--object-shadow-size) var(--searchInputs-shadow-color);
	border: solid var(--object-border-size) var(--searchInputs-border-color);
}
/*------------------ for brows file input button ------------------*/
.custom-file-input {
	display: inline-block;
	position: relative;
}
.custom-file-input input {
	visibility: hidden;
	width: 0px;
}
.custom-file-input:before {
	height: 30px;
	content: 'انتخاب کنید';
	background:url(../images/submission_blue.png) no-repeat 50% 25%;
	color: white;
	/*font-family: "B Nazanin";*/
	font-size: var(--small-inputs-font-size);
	border:none;
	border-radius: 50px;
	padding:5px 17px 5px 17px;  /* top right bottom left*/
	outline: none;
	cursor: pointer;
	text-align: center;
	vertical-align:center;
	position: marker;
	left: 0;
	right: 0;
}

.custom-file-input:after {
	width: 0px;
	height: 0px;
}
.fileUploadInfo {
	height: 20px;
	vertical-align:bottom;
	text-align:left;
	direction: ltr;
	color: darkgrey;
	padding-left: 30px;
}

#loadingGif{
	vertical-align: bottom;
}
/*---------------------- for tabs of management page --------------------*/
.tabTable{ /* the table contain tabs*/
	margin:  auto auto 50px auto;
	font-size: var(--table-font-size);
}

.tabTd{ /* the td that contain circle spans of tabs */
	padding: 20px 8px 0px 8px;/* top right bottom left*/
	text-align: center;
}

.tabSubTitleTd{
	text-align: center;
	color: darkgray;
}

.tabImageBackground { /* the circle span that contains tab icon*/
	height: 75px;
	width: 96px;
	border-radius: 50%;
	display: inline-block;
	cursor: pointer;
	background-image: url("../images/tab_off.png") ;
	background-size: 96px 96px;
	background-repeat: no-repeat;
	text-align: center;
	padding-top: 20px;
	margin-bottom: 0px;
	/*padding-bottom: 28px;*/
}

.tabImageBackground:hover{ /* the circle span that contains tab icon in hover mode*/
	background-image: url("../images/tab_on.png") ;
	background-size: 96px 96px;
	background-repeat: no-repeat;
}

.tabImageBackground:hover ~ .tabSubTitleTd { /* dont work :( */
	color: blue;
}

.tabImage{ /* the image tag that it's src=tab icon */
	width: 48px;
}
/*---------------------------------------*/

/*------------------ detail and Properties of insurance container ------------------*/
.details{ /* is a div */
	/*width: 50%;*/
	display:inline-block;
	text-align: center;
	/*font-family: "B Nazanin";*/
	font-size: var(--detail-table-font-size);
	color: var(--forms-font-color);
	background-color: var(--form-background-color);
	box-shadow: var(--object-shadow-size) var(--formBox-shadow-color);
	padding: 15px;
	margin: 30px auto 15px auto; /* top right bottom left*/
	border-radius: 8px ;
	border: solid var(--object-border-size) var(--formBox-border-color);
}

.detailsTable{
	margin: auto;
	text-align: right;
}

.details td{
	padding-top:2px;
	padding-bottom:8px;
}
/* ------- determine the color of data table rows in usually mode on in hover mode ------- */
#odd {
	background-color:var(--oddRowsOfDataTable);
}
#even {
	background-color: var(--evenRowsOfDataTable);
}
#odd:hover {
    background-color: var(--hoverOddRowsOfDataTable);
}
#even:hover {
	background-color: var(--hoverOddRowsOfDataTable);
}

/*------- for massages -------*/
.error {
	/*font-family: B Nazanin;*/
	font-size:14px;
	text-align : center;
	margin-left:auto;
	margin-right: auto;
	padding: 0px;
	color:red;
}

.successful {
	/*font-family: B Nazanin;*/
	font-size:16px;margin:auto; color: #52ff52;
}

.errorFlag{
	margin-right: 15px;
	margin-left: 8px;
	height: 19px;
}

.errorRow{
	margin: 0;
	font-size: 10px;
}

.errorRow td{
	color: var(--error-commonInputs-shadow-color);
	font-size: 12px;
	padding-right: 0px;
	padding-bottom: 5px;
}

.rightEC{
	text-align: right;
}

.leftEC{
	text-align: left;
}
/*---------------------------*/
hr.separatorLine{
	text-align : center;
	width: 30%;
}

/*------------------------------*/
.helpIcon{
	padding-right: 5px;
	cursor: pointer;
	vertical-align: bottom;
}
/*--------------------------------*/
.passwordInputImg{
	height: 15px;
	vertical-align: -35%;
	margin-right:5px;
	cursor: pointer;
}
/*------------------- for pagination styles --------------------*/
.pageBtn {
	height: 5px;
	outline: var(--object-border-size) solid var(--formsAndMenus-border-color);
	padding-left: 6px;
	padding-right: 6px;
	margin: 3px;
	cursor: pointer;
	border-radius: 3px;
}

.pageBtn:hover{
	background-color: rgba(98, 145, 246, 0.3);
}

.beforeBtn{
	height: 22px;
	margin-right: 7px;
	margin-left: 7px;
	cursor: pointer;
	vertical-align: bottom;
}

.beforeBtn :hover{
	outline: var(--object-border-size) solid var(--formsAndMenus-border-color);
}

#pageToPageBtnContainer{
	background-color: white;
	padding-right: 200px;
	font-size: 13px;
	/*font-family: "B Nazanin";*/
	/*text-align: center;*/
}


#pageToPageBtnContainer td{
	text-align: center;
}
/*------------ load data msg ------------*/
table.loadDataMsg{
	margin: 30px auto 30px auto;
}

.loadDataMsg img{
	height: 70px;
}

.loadDataMsg td{
	padding-bottom: 15px;
}