/* 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');*/
/*}*/
/*------------------------------------------------------------------
Table Style
------------------------------------------------------------------ */
.searchResultIconContainer{
	margin: 5px 120px 15px auto;
	font-family: "B Nazanin";
	font-size: 13px;
	font-weight: bold;
}

.searchResultIconContainer td{
	padding-right:5px;
}

table.data {
	/*font-family:tahoma ;*/
    color:var(--datatable-font-color);
    font-size:14px;
	font-weight: bold;
	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{
	padding:8px;
	white-space: nowrap;
	text-align: center;
}

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

.detailsContainerCell{
	text-align: right;
	max-width: 65px;
}

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: 14px;
	font-weight: normal;
	color: var(--fontColorOfDetailsRowsOfDataTable) ;
	/*display: none;*/
}

.detailsContainerCell{
	text-align: right;
}

.hiddenDetailsContainerRow{
	display: none;
}

.summationRow{
	font-size: 18px;
	background-color: rgba(17, 186, 147, 0.71);
	color: white;
}
/* --------------------------------------------------------- */
/*Cashes Table Style*/
/* --------------------------------------------------------- */
table.cashesData{
	text-align: center;
	width: 18%;  /* for 5 table in a line*/
	/*font-family:"B Nazanin" ;*/
	color:var(--datatable-font-color);
	font-size:16px;
	margin: 30px 0px 30px 0px;  /* left margin is for 5 table in a line*/
	display: inline-table;
	border: var(--object-border-size) solid var(--formsAndMenus-border-color);
	box-shadow: var(--object-shadow-size) var(--formsAndMenus-shadow-color);
	border-radius: 8px;
	border-spacing: 0;
}

table.accountsData{
	text-align: center;
	width: 70%;  /* for 5 table in a line*/
	/*font-family:B Nazanin ;*/
	color:var(--datatable-font-color);
	font-size:18px;
	margin: 30px auto 30px auto;  /* top right bottom left*/
	border: var(--object-border-size) solid var(--formsAndMenus-border-color);
	box-shadow: var(--object-shadow-size) var(--formsAndMenus-shadow-color);
	border-radius: 8px;
	border-spacing: 0;
}

tr.cashDetailsRow{
	cursor: pointer;
}

tr.cashDetailsRow:hover {
	background-color: #CCFF33;
}

table.cashesData th{
	padding: 8px 0px 0px 0px;
}

table.cashesData td.iconContainer{
	width: 40%;
	padding: 3px;
}

table.accountsData td.iconContainer{ /* top right bottom left*/
	font-size:14px ;
	padding-top: 5px;
	padding-bottom: 5px;
}

table.accountsData div.subtitle{
	padding-top: 5px;
	/*padding-bottom: 5px;*/
}

table.cashesData td.valueContainer{
	width: 40%;
	padding: 3px;
}

table.cashesData td.unitContainer{
	text-align: right;
	width: 20%;
	padding: 3px;
}

table.cashesData td.otherCashesContainer{
	width: 38%;
	padding: 0px;
}

hr.chasTable{
	width: 90%;
	height: 1px;
	background-color: rgba(84, 241, 202, 0.70);
	border: none;
	padding: 0px;
}

hr.accountsTable{
	width: 98%;
	height: 1px;
	background-color: rgba(84, 241, 202, 0.70);
	border: none;
	padding: 0px;  /* top right bottom left*/
	margin-bottom: 20px;
}

table.cashesData img{
	height: 25px;
	margin: 0px;
}

table.accountsData img{
	width: 30px;
	margin: 0px;
}

table.cashesData td.sumContainer{  /* top right bottom left*/
	padding: 0px 0px 12px 0px;
	color: rgb(0,255,100);
	text-shadow: #c6c6c6 1px 1px ;
	font-size: 18px;
}

div.subtitle{
	font-size:12px;
	padding: 0;
}

div.cashReportSeparatorContainer {
	padding-right:1% ;
	text-align: right;
}

.cashReportSeparatorText {
	vertical-align: top;
	width: 15%;
	font-size: 13px;
	color: #9e9c9c;
	margin-left: 7px;
}

.cashReportSeparatorImg { /* the img tag contains drop icon that hide or show table reports tables */
	height: 18px;
	vertical-align: bottom;
	cursor: pointer;
}

#cashReportContainer{ /* the dive contains cashes table reports in cash report part of reports page */
	text-align: center;
	margin: auto;
}

#accountReportContainer{ /* the dive contains accounts table reports in cash report part of reports page */
	text-align: center;
	margin: auto;
}

.chasTablesSeparator{ /* hr that separate between cashes tables and accounts table*/
	width: 100%;
	height: 1px;
	background-color: rgba(84, 241, 202, 0.70);
	border: none;
	padding: 0px;
}

.totalCashesSums{ /* the div that contains total sum of all cashes tables*/
	margin:  5px auto 20px auto;
	color: rgb(0,255,100);
	text-shadow: #c6c6c6 1px 1px ;
	font-size: 20px;
	/*font-family: B Nazanin;*/
}
/*.cashDetailsRow{display: none}*/
/*-------------------------------*/
table.reportData{
	text-align: center;
	/*font-family:B Nazanin ;*/
	color:var(--datatable-font-color);
	font-size:18px;
	margin: 30px 0px 30px 0px;  /* left margin is for 5 table in a line*/
	display: inline-table;/* top right bottom left*/
	box-shadow: var(--object-shadow-size) var(--formsAndMenus-shadow-color);
	border-radius: 8px;
	border-spacing: 0;
}

.datePeriod{
	font-size: 16px;
	margin-left: 5px;
	margin-right: 5px;
}

.reportData th{
	padding: 15px;
}

.reportData td{
	padding: 15px;
	color: rgb(88, 179, 63);
}

.reportData img{
	height: 35px;
	margin-left: 6px;
	vertical-align: bottom;
}
/* --------------------------------------------------------- */
th.inputHeader{
	background-color: rgba(142, 142, 142, 0.34);
	padding-top:3px ;
	padding-bottom:3px ;
	text-align: center;
	font-size:14px;
	/*font-family:B Nazanin;*/
}

td.totalValues {
	color: rgb(135, 134, 134);
	padding-top:3px ;
	padding-bottom:3px ;
	text-align: center;
	font-size:14px;
	/*font-family:B Nazanin;*/
}

td.textOfTotalValues {
	color: rgb(135, 134, 134);
	padding-top:3px ;
	padding-bottom:3px ;
	text-align: right;
	font-size:14px;
	/*font-family:B Nazanin;*/
}
td.taxTitleCell{
	color: rgb(135, 134, 134);
	padding-top:3px ;
	padding-bottom:3px ;
	text-align: right;
	font-size:14px;
	/*font-family:B Nazanin;*/
}

th.totalValues {
	color: rgb(17, 186, 41);
	padding-top:3px ;
	padding-bottom:3px ;
	text-align: right;
	font-size:15px;
	/*font-family:B Nazanin;*/
}

.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:18px;
	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: 77%;
	line-height: 40px;
}

.titleContainerTd{ /* the center Td of the table of form title */
	padding-right: 50px;
	padding-left: 50px;
}

.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: 15px;
	color: darkgray;
	/*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;*/
}
/* --------------------------------------------------------- */
.innerFormTable {
	/*font-family: "B Nazanin";*/
	font-size: 14px;
	color: var(--forms-font-color);
	padding: 7px;
	margin: 30px auto 15px auto; /* top right bottom left*/
}

.formTable {
	border-spacing: 5px;
	font-size: 14px;
	font-weight: bold;
	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){
	text-align: right;
	padding: 7px 2px 7px 2px;
}

.formTitle{
	text-align: center;
	font-size: 18px;
	color: darkgray;
	/*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;
}

#registerTransactionForm{
	font-size: 14px;
	font-weight: bold;
}

#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;
}

/*------------ the style for user profile data  --------------*/
.userProfileData{
	text-align: right;
	/*font-family:B Nazanin ;*/
	color:var(--datatable-font-color);
	font-size:18px;
	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: 14px ;
	font-family: "B Nazanin";
	font-weight: bold;
	color: var(--search-input-font-color);
	text-align: right;
	border: 0px;
	border-radius: 5px ;
	cursor:auto ;
	box-shadow: var(--object-shadow-size) var(--formBox-shadow-color);
}
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: 14px ;
	font-weight: bold ;
	font-family: "B Nazanin";
	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 {
	font-size: 15px ;
	font-weight: bold ;
	font-family: "B Nazanin";
	color: var(--search-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.warning:focus{
	outline: var(--object-border-size) solid var(--warning-commonInputs-border-color);
	box-shadow: var(--object-shadow-size) var(--warning-commonInputs-shadow-color);
}

input.common::-webkit-input-placeholder {
	font-size: 13px;
	/*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 {
	font-size: 15px ;
	font-weight: bold ;
	font-family: "B Nazanin";
	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: 13px;
	/*font-family: "B Nazanin";*/
	color: #c3c3c3;
}


/*--------------------- 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) #d7d7d7;
	margin-top: 10px;
}

.dateInputContainer img {
	margin-left: 5px;
	width: 23px;
	vertical-align: bottom;
	cursor: pointer;
}

.dateInput {
	font-size: 15px ;
	font-weight: bold ;
	font-family: "B Nazanin";
	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: 13px;
	/*font-family: "B Nazanin";*/
	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: 14px ;
	font-weight: bold ;
	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 Nazanin";
	font-size: 14px;
	font-weight: bold;
	padding-bottom: 12px;
}

.disabledSubmission{
	font-family: "B Nazanin";
	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: 15px;
	padding-bottom: 15px;
}

.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: 15px;
}
.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: 14px;
	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*/
	font-size: 15px;
	margin:  auto auto 50px auto;
	font-weight: bold;
}

.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;
}
/*---------------------------------------*/
.mainTabTable{ /* the table contain tabs*/
	margin:  5px auto 50px auto;
	font-weight: bold;
}

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

.mainTabSubTitleTd{
	text-align: center;
}

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

.mainTabImage{ /* the image tag that it's src=tab icon */
	margin-top: 34px;
	width: 75px;
}

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



/*------------------ detail and Properties of insurance container ------------------*/
.details{ /* is a div */
	display:inline-block;
	text-align: center;
	font-size: 15px;
	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;
	font-weight: bold;
}

.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);
}

/* ----------------------------------- جدولی که منو ها را در بر می گیرد---------------------------------- */
.menuTable{
	margin: auto;
}
.menuTable td{
	padding: 10px;
}
/*------- for massages -------*/
.error {
	/*font-family: B Nazanin;*/
	font-size:14px;
	font-weight: bold;
	text-align : center;
	margin-left:auto;
	margin-right: auto;
	padding: 0px;
	color:red;
}

.successful {
	/*font-family: B Nazanin;*/
	font-size:15px;margin:auto; color:green;
}

.errorFlag{
	margin-right: 15px;
	margin-left: 8px;
	height: 19px;
}
/*---------------------------*/
.clickableObj {cursor: pointer;}

.clickableIcon{
	padding-right: 5px;
	vertical-align:bottom;
	height:25px;
	cursor: pointer;
}

hr.separatorLine{
	text-align : center;
	width: 30%;
}

div.topOfPage{  /*for top of page div */
	padding-top: 40px;
}
/*------------------------------*/
.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);
}

/*#dataTableContainer{*/
/*	text-align: center;*/
/*}*/

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


#pageToPageBtnContainer td{
	text-align: center;
}
/*---------------- the style for by id service register form in work panel page------------------*/
#ghabzIDMsg,#paymentIDMsg{
	color: red;
	/*font-family: 'B Nazanin';*/
	font-size: 13px;
}

#paymentIDTd,#ghabzIDTd{
	width: 28%;
	padding: 8px;
}

#ghabzTypeTd,#ghabzPriceTd{
	width: 20%;
	color: #09f509;
	/*font-family: 'B Nazanin';*/
	font-size: 15px;
 }

#relatedServiceTd{
	height: 25px;
	text-align: right;
	/*font-family: 'B Nazanin';*/
	font-size: 13px;
	color: darkgray;
}
/*------------ load data msg ------------*/
table.loadDataMsg{
	margin: 30px auto 30px auto;
}

.loadDataMsg img{
	height: 70px;
}

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