:root {
	--color-primary: #0053ec;
	--color-primary-lighter: #196aff;
	--color-primary-variant: #0040b8;
	--color-secondary: #009485;
	--color-secondary-lighter: #00ad9c;
	--color-secondary-variant: #007468;
	--color-accent: #a300a8;
	--color-accent-variant: #9613b1;
	--color-headings: #18006e;
	--color-error: #b00020;
	--color-success: #00a055;
	--color-body: #a5a5a5;
	--color-body-darker: #757575;
	--color-border: #dadada;
	--color-white: #ffffff;
	--color-light: #fafafa;
	--color-bitlight: #faf9f2;
	--color-lighter: #fcfcfc;
	--color-dark: #161616;
	--color-shadow: #888;
	--color-link: rgb(2, 0, 116);
	--color-dark-green: #00703c;
	--color-dark-red: #880000;
	--border-radius: 16px;
	--color-light-green: #bcffbc;
	--color-light-red: #ffc8c8;
	--color-light-gray: #ebebeb;
	--color-light-blue: #9eeaff;
	--color-bright1: #cdffd8;
	--color-bright2: #abe7b8;
	--color-bright3: #8fc59b;
}

*,
*::after,
*::before {
	box-sizing: border-box;
}

::selection {
	background: var(--color-primary-variant);
	color: var(--color-light);
}

@font-face {
	font-family: IRANYekan;

	src: url("font/yekan100.woff") format("woff"),
		url("font/yekan100.eot") format("eot"),
		url("font/yekan100.ttf") format("truetype");
	font-style: normal;
	font-weight: 100;
}

@font-face {
	font-family: IRANYekan;
	src: url("font/yekan300.woff2") format("woff2"),
		url("font/yekan300.woff") format("woff"),
		url("font/yekan300.eot") format("eot"),
		url("font/yekan300.ttf") format("truetype");
	font-weight: 300;
	font-style: normal;
}

@font-face {
	font-family: IRANYekan;
	src: url("font/yekan400.woff2") format("woff2"),
		url("font/yekan400.woff") format("woff"),
		url("font/yekan400.eot") format("eot"),
		url("font/yekan400.ttf") format("truetype");
	font-weight: 400;
	font-style: normal;
}

@font-face {
	font-family: IRANYekan;

	src: url("font/yekan500.woff") format("woff"),
		url("font/yekan500.eot") format("eot"),
		url("font/yekan500.ttf") format("truetype");
	font-style: normal;
	font-weight: 500;
}

@font-face {
	font-family: IRANYekan;
	src: url("font/yekan700.woff2") format("woff2"),
		url("font/yekan700.woff") format("woff"),
		url("font/yekan700.eot") format("eot"),
		url("font/yekan700.ttf") format("truetype");
	font-weight: 700;
	font-style: normal;
}

@font-face {
	font-family: IRANYekan;
	src: url("font/yekan800.woff") format("woff"),
		url("font/yekan800.eot") format("eot"),
		url("font/yekan800.ttf") format("truetype");
	font-weight: 800;
	font-style: normal;
}

@font-face {
	font-family: IRANYekan;
	src: url("font/yekan900.woff") format("woff"),
		url("font/yekan900.eot") format("eot"),
		url("font/yekan900.ttf") format("truetype");
	font-style: normal;
	font-weight: 900;
}

@font-face {
	font-family: IRANYekan;
	src: url("font/yekan950.woff") format("woff"),
		url("font/yekan950.eot") format("eot"),
		url("font/yekan950.ttf") format("truetype");
	font-style: normal;
	font-weight: 950;
}

@font-face {
	font-family: IRANYekanDigits;
	src: url("font/yekandigits300.woff2") format("woff2"),
		url("font/yekandigits300.woff") format("woff"),
		url("font/yekandigits300.eot") format("eot"),
		url("font/yekandigits300.ttf") format("truetype");
	font-weight: 300;
	font-style: normal;
}

@font-face {
	font-family: IRANSans;
	src: url(font/iransans.ttf) format("truetype");
	font-weight: 300;
	font-style: normal;
}

html {
	font-size: 20px;
	line-height: 1.8;
	-webkit-text-size-adjust: 100%;
}

main {
	display: block;
}

h1 {
	font-size: 2rem;
	margin: 1rem 0;
}

h2 {
	font-size: 1.8rem;
	margin: 1rem 0;
}

h3 {
	font-size: 1.6rem;
	margin: 1rem 0;
}

h4 {
	font-size: 1.5rem;
	margin: 1rem 0;
}

h5 {
	font-size: 1.4rem;
	margin: 1rem 0;
}

h6 {
	font-size: 1.3rem;
	margin: 1rem 0;
}

.h7 {
	font-size: 1.1rem;
	margin: 0.8rem 0;
}

p {
	font-size: 1rem;
	/* margin: 1rem 0; */
	margin-left: auto !important;
	margin-right: auto !important;
}

hr {
	box-sizing: content-box;
	height: 0;
	overflow: visible;
}

pre {
	font-family: monospace, monospace;
	font-size: 1rem;
}

a {
	background-color: transparent;
}

abbr[title] {
	border-bottom: none;
	text-decoration: underline;
	text-decoration: underline dotted;
}

b,
strong {
	font-weight: bolder;
}

code,
kbd,
samp {
	font-family: monospace, monospace;
	font-size: 1rem;
}

small {
	font-size: 80%;
}

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sub {
	bottom: -0.25rem;
}

sup {
	top: -0.5rem;
}

img {
	border-style: none;
}

button,
input,
optgroup,
select,
textarea {
	font-family: inherit;
	font-size: 100%;
	line-height: 1.15;
	margin: 0;
}

button,
input {
	overflow: visible;
}

button,
select {
	text-transform: none;
}

button,
[type="button"],
[type="reset"],
[type="submit"] {
	-webkit-appearance: button;
}

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
	border-style: none;
	padding: 0;
}

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
	outline: 1px dotted ButtonText;
}

fieldset {
	padding: 0.35rem 0.75rem 0.625rem;
}

legend {
	box-sizing: border-box;
	color: inherit;
	display: table;
	max-width: 100%;
	padding: 0;
	white-space: normal;
}

progress {
	vertical-align: baseline;
}

textarea {
	overflow: auto;
}

[type="checkbox"],
[type="radio"] {
	box-sizing: border-box;
	padding: 0;
}

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

[type="search"] {
	-webkit-appearance: textfield;
	outline-offset: -2px;
}

[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

::-webkit-file-upload-button {
	-webkit-appearance: button;
	font: inherit;
}

details {
	display: block;
}

summary {
	display: list-itrem;
}

tremplate {
	display: none;
}

[hidden] {
	display: none;
}

input[type="file"]::file-selector-button {
	border: 0;
	cursor: pointer;
	background-color: var(--color-body);
	font-size: 1.2rem;
	margin: 0 0 0 1rem;
	outline: 0;
	padding: 0;
	text-align: center;
	transition: 0.4s;
	vertical-align: middle;
	white-space: nowrap;
	min-height: 3.5rem;
	min-width: 10rem;
}

input[type="file"]::file-selector-button:hover {
	background-color: var(--color-light-green);
}

input[type="file"]::file-selector-button:active {
	background-color: var(--color-secondary);
}

/* ---------------------------------------------- */

body {
	direction: rtl;
	text-align: right;
	margin: 0;
	background-color: var(--color-white);
	color: var(--color-dark);
	font-family: IRANYekan, Tahoma, "Segoe UI";
	font-style: normal;
	font-weight: 500;
}

a:link {
	color: var(--color-link);
	text-decoration: none;
	cursor: pointer;
}

a:visited {
	color: var(--color-link);
}

a:hover {
	color: var(--color-body-darker);
}

a.under:hover {
	text-decoration: underline;
}

a:active {
	color: var(--color-primary);
}

.a_underline {
	text-decoration: underline !important;
	text-underline-position: under !important;
}

.h_half {
	font-size: 1.5rem;
}

.container {
	margin: 2rem auto;
	border-radius: var(--border-radius);
	border: 2px solid var(--color-border);
	overflow: hidden;
}

.container-snow {
	background-color: var(--color-lighter);
}

.container-yellow {
	background-color: yellow;
}

.container-blue {
	background-color: lightcyan;
	background-image: linear-gradient(
		90deg,
		lightcyan 0%,
		rgb(98, 255, 255) 100%
	);
}

.container-cyan {
	background-color: lightcyan;
	background-image: linear-gradient(
		90deg,
		rgb(98, 255, 255) 0%,
		lightcyan 60%,
		rgb(8, 177, 255) 100%
	);
}

.container-green {
	background-color: greenyellow;
}

.container-green-0 {
	background-color: rgb(215, 255, 150);
	background-image: linear-gradient(
		90deg,
		rgb(231, 255, 193) 0%,
		rgb(215, 255, 150) 100%
	);
}

.container-green-1 {
	background-color: rgb(215, 255, 150);
	background-image: linear-gradient(
		90deg,
		rgb(231, 255, 193) 0%,
		rgb(215, 255, 150) 79%,
		rgb(125, 205, 0) 81%,
		rgb(133, 216, 0) 100%
	);
}

.container-green-2 {
	background-color: rgb(215, 255, 150);
	background-image: linear-gradient(
		90deg,
		rgb(231, 255, 193) 0%,
		rgb(215, 255, 150) 59%,
		rgb(125, 205, 0) 61%,
		rgb(133, 216, 0) 100%
	);
}

.container-green-3 {
	background-color: rgb(215, 255, 150);
	background-image: linear-gradient(
		90deg,
		rgb(231, 255, 193) 0%,
		rgb(215, 255, 150) 39%,
		rgb(125, 205, 0) 41%,
		rgb(133, 216, 0) 100%
	);
}

.container-green-4 {
	background-color: rgb(215, 255, 150);
	background-image: linear-gradient(
		90deg,
		rgb(231, 255, 193) 0%,
		rgb(215, 255, 150) 19%,
		rgb(125, 205, 0) 21%,
		rgb(133, 216, 0) 100%
	);
}

.container-green-5 {
	background-color: rgb(125, 205, 0);
	background-image: linear-gradient(
		90deg,
		rgb(125, 205, 0) 0%,
		rgb(133, 216, 0) 100%
	);
}

.container-red {
	background-color: rgb(255, 180, 180);
	background-image: linear-gradient(
		90deg,
		rgb(255, 180, 180) 0%,
		rgb(255, 95, 95) 100%
	);
}

.container-dark {
	background-color: rgb(32, 32, 32);
	background-image: linear-gradient(
		90deg,
		var(--color-shadow) 0%,
		var(--color-dark) 50%,
		var(--color-body-darker) 100%
	);
}

.text {
	margin: 1rem;
	padding: 1rem;
}

.text_no_margin {
	margin: 0rem;
	padding: 1rem;
}

.text_justify {
	text-align: justify;
}

.text_right {
	text-align: right;
}

.text_center {
	text-align: center;
}

.text_gray {
	color: gray;
}

.text_brown {
	color: brown;
}

.text_blue {
	color: dodgerblue;
}

.text_green {
	color: green;
}

.text_red {
	color: red;
}

.p_half {
	font-size: 0.5rem;
}

.p_75 {
	font-size: 0.75rem;
}

.text_light {
	color: var(--color-light);
}

.no_top_pad {
	padding: 0 !important;
	margin: 0 1rem 1rem !important;
}

.no_v_pad {
	padding: 0 !important;
	margin: 0 1rem 0rem !important;
}

.no_v_margin {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}

.no_top_margin {
	margin-top: 0 !important;
}

.no_bottom_margin {
	margin-bottom: 0 !important;
}

.no_bottom_pad {
	padding-bottom: 0 !important;
	margin-bottom: 0 !important;
}

.no_bottom_margin {
	margin-bottom: 0 !important;
}

.no_pad_margin {
	padding: 0 !important;
	margin: 0 !important;
}

.font-yekan {
	font-family: IRANYekan, Tahoma, "Segoe UI";
}

.font-100 {
	font-weight: 100;
}
.font-300 {
	font-weight: 300;
}
.font-400 {
	font-weight: 400;
}
.font-500 {
	font-weight: 500;
}
.font-700 {
	font-weight: 700;
}
.font-800 {
	font-weight: 800;
}
.font-900 {
	font-weight: 900;
}
.font-950 {
	font-weight: 950;
}

.digits {
	font-family: IRANYekan, Tahoma, "Segoe UI";
	font-weight: 300;
}

.sans {
	font-family: IRANSans, Tahoma, "Segoe UI";
	font-weight: 300;
}

.grid-container {
	display: grid;
	justify-content: center;
	grid-template-columns: auto;
	grid-gap: 0.1rem;
	overflow: hidden;
}

.grid-head {
	grid-row-start: 1;
	grid-row-end: 2;
	grid-column-start: 1;
	grid-column-end: 2;
}

.grid-item {
	/*background-color: rgb(224, 224, 224) !important;*/
	padding: 1rem;
	border-radius: var(--border-radius);
	transition: 0.5s;
	overflow: hidden;
	min-width: 200px;
}

.peydashod {
	/*background-color: rgb(224, 224, 224) !important;*/
	background: linear-gradient(
			rgba(255, 250, 240, 0.9),
			rgba(255, 255, 255, 0.9)
		),
		url("img/grid_peydashod.png");
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

.peydashod:hover {
	background: linear-gradient(
			rgba(255, 250, 200, 0.8),
			rgba(255, 255, 255, 0.8)
		),
		url("img/grid_peydashod.png");
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
}

@media screen and (min-width: 540px) {
	.container {
		max-width: 520px;
	}

	.grid-container {
		grid-template-columns: auto;
	}

	.grid-head {
		grid-column-start: 1;
		grid-column-end: 3;
	}

	.grid-item {
		min-width: 470px;
	}
}

@media screen and (min-width: 720px) {
	.container {
		max-width: 680px;
	}

	/* .grid-container {
    grid-template-columns: auto auto;
  }

  .grid-head {
    grid-column-start: 1;
    grid-column-end: 3;
  } */
}

@media screen and (min-width: 1024px) {
	.container {
		max-width: 980px;
	}

	.grid-container {
		grid-template-columns: auto auto;
	}

	.grid-head {
		grid-column-start: 1;
		grid-column-end: 5;
	}
}

@media screen and (min-width: 1200px) {
	.container {
		max-width: 1140px;
	}

	p {
		max-width: 1100px;
	}

	/* .grid-container {
    grid-template-columns: auto auto auto auto;
  }

  .grid-head {
    grid-column-start: 1;
    grid-column-end: 6;
  } */
}

@media screen and (min-width: 1600px) {
	.container {
		max-width: 1520px;
	}

	p {
		max-width: 1200px;
	}

	.grid-container {
		grid-template-columns: auto auto auto;
	}

	.grid-head {
		grid-column-start: 1;
		grid-column-end: 7;
	}
}

@media screen and (min-width: 2000px) {
	.container {
		max-width: 1900px;
	}

	p {
		max-width: 1300px;
	}

	.grid-container {
		grid-template-columns: auto auto auto auto;
	}

	.grid-head {
		grid-column-start: 1;
		grid-column-end: 8;
	}
}

@media screen and (min-width: 2500px) {
	.container {
		max-width: 2375px;
	}

	p {
		max-width: 1500px;
	}

	.grid-container {
		grid-template-columns: auto auto auto auto auto;
	}

	.grid-head {
		grid-column-start: 1;
		grid-column-end: 9;
	}
}

@media screen and (min-width: 3300px) {
	.container {
		max-width: 3000px;
	}

	p {
		max-width: 1800px;
	}

	.grid-container {
		grid-template-columns: auto auto auto auto auto auto;
	}

	.grid-head {
		grid-column-start: 1;
		grid-column-end: 9;
	}
}

.item_image {
	width: 100%;
	max-width: 12rem;
	border: 1px solid var(--color-shadow);
	border-radius: var(--border-radius);
}

div.grid-item:hover {
	background-color: var(--color-light-gray);
	/* cursor: pointer; */
}

/* div.grid-item:active {
	background-color: rgb(85, 255, 200);
	cursor: pointer;
} */

.btn {
	border-radius: var(--border-radius);
	border: 0;
	box-shadow: 2px 3px 6px var(--color-shadow);
	cursor: pointer;
	font-size: 1.2rem;
	margin: 1.5rem 1rem 2rem;
	outline: 0;
	padding: 1rem 2rem;
	text-align: center;
	transition: background-color 0.4s;
	vertical-align: middle;
	white-space: nowrap;
	min-width: 11rem;
}

.btn-small {
	font-size: 0.8rem;
	padding: 0.8rem 1rem;
	margin: 1rem 0.7rem 1.2rem;
	min-width: 9rem;
}

.btn .icon {
	width: 2rem;
	height: 2rem;
	margin-right: 1rem;
	vertical-align: middle;
}

.btn--primary {
	background-color: var(--color-primary);
	color: var(--color-white);
	text-shadow: 2px 2px 4px var(--color-dark);
}

.btn--primary:hover {
	background-color: var(--color-primary-lighter);
}

.btn--primary:active {
	background-color: var(--color-primary-variant);
}

.btn--primary-light {
	background-color: var(--color-light);
	color: var(--color-primary);
	text-shadow: 2px 2px 4px var(--color-lighter);
}

.btn--primary-light:hover {
	background-color: var(--color-border);
}

.btn--primary-light:active {
	background-color: var(--color-shadow);
}

.btn--bright {
	background-color: var(--color-bright1);
	color: var(--color-headings);
	text-shadow: 2px 2px 4px var(--color-lighter);
}

.btn--bright:hover {
	background-color: var(--color-bright2);
}

.btn--bright:active {
	background-color: var(--color-bright3);
}

.btn--secondary {
	background-color: var(--color-bitlight);
	color: var(--color-secondary);
	text-shadow: 2px 2px 4px var(--color-border);
}

.btn--secondary:hover {
	background-color: var(--color-border);
}

.btn--secondary:active {
	background-color: var(--color-body);
}

.btn--primary-2 {
	background-color: var(--color-success);
	color: var(--color-white);
	text-shadow: 2px 2px 4px var(--color-dark);
}

.btn--primary-2:hover {
	background-color: var(--color-secondary-variant);
}

.btn--primary-2:active {
	background-color: var(--color-secondary-lighter);
}

.btn--green {
	background-color: rgb(0, 160, 25);
	color: rgb(252, 252, 252);
	text-shadow: 2px 2px 4px var(--color-dark);
}

.btn--green:hover {
	background-color: rgb(50, 190, 70);
}

.btn--green:active {
	background-color: rgb(0, 120, 20);
}

.btn--red {
	background-color: rgb(200, 20, 20);
	color: rgb(252, 252, 252);
	text-shadow: 2px 2px 4px var(--color-dark);
}

.btn--red:hover {
	background-color: rgb(240, 90, 90);
}

.btn--red:active {
	background-color: rgb(150, 10, 10);
}

.agent_item {
	width: 16rem;
	height: 12rem;
	border-radius: var(--border-radius);
	border: 1px solid var(--color-border);
	margin: 0.5rem;
	padding: 0;
	overflow: hidden;
	display: inline;
}

.agent_item_small {
	width: 8rem;
	height: 5rem;
	border-radius: var(--border-radius);
	border: 1px solid var(--color-border);
	margin: 0.5rem;
	padding: 0;
	overflow: hidden;
	display: inline;
}

.input {
	max-width: 600px;
	border-radius: var(--border-radius);
	border: 1px solid var(--color-border);
	color: var(--color-headings);
	font-size: 1.2rem;
	outline: 0;
	padding: 1rem 1rem;
	display: block;
	width: 100%;
	text-align: center;
	margin: auto auto 1rem auto;
	overflow: hidden;
}

.input_box {
	padding: 0.62rem 1rem !important;
	margin-bottom: 0 !important;
}

.input_file_box {
	text-align: right;
	padding: 0 !important;
	margin-bottom: 0 !important;
}

.m-b-0 {
	margin-bottom: 0px !important;
}

.m-b-1 {
	margin-bottom: 1rem !important;
}

.dark-text {
	color: var(--color-body-darker);
}

.green-dark-text {
	color: var(--color-dark-green);
}

.red-dark-text {
	color: var(--color-dark-red);
}

.error-text {
	color: var(--color-error);
}

::placeholder {
	color: #cdcbd7;
}

.div-form {
	width: 98%;
	margin: auto;
}

.fa_icon_blue {
	font-size: 1.5rem;
	color: Dodgerblue;
	vertical-align: middle;
	padding: 0.1rem 0.2rem;
	transition: 0.3s;
}

.fa_icon_green {
	font-size: 1.5rem;
	color: green;
	vertical-align: middle;
	padding: 0.1rem 0.2rem;
	transition: 0.3s;
}

.fa_icon_red {
	font-size: 1.5rem;
	color: red;
	vertical-align: middle;
	padding: 0.1rem 0.2rem;
	transition: 0.3s;
}

.fa_icon_green:hover,
.fa_icon_blue:hover {
	background-color: rgb(201, 171, 0);
}

.fa_icon_green:active,
.fa_icon_blue:active {
	background-color: rgb(197, 111, 13);
}

.fa_icon_gray {
	font-size: 1.5rem;
	color: gray;
	vertical-align: middle;
	padding: 0.1rem 0.2rem;
}

label {
	color: var(--color-dark);
}

.label-Preview {
	font-size: 0.8rem;
}
em {
	color: var(--color-error);
	text-decoration: none;
	font-style: normal;
	font-size: larger;
}

table,
th,
td {
	border: 1px solid var(--color-shadow);
	padding: 0.5rem;
	transition: 0.4s;
}

tr {
	transition: 0.4s;
}

td:hover {
	background-color: #d7ffbc;
}

tr:nth-child(even) {
	background-color: var(--color-white);
}

tr:nth-child(odd) {
	background-color: var(--color-light-gray);
}

tr:nth-child(odd):hover {
	background-color: rgb(222, 224, 83);
}

tr:nth-child(even):hover {
	background-color: rgb(252, 255, 102);
}

table {
	border-collapse: collapse;
	margin: auto;
	margin-bottom: 2rem;
}

.table_div {
	overflow-x: auto;
}

th {
	background-color: var(--color-light-blue);
	font-weight: 700;
	font-size: 0.9rem;
}

td {
	font-weight: 400;
	font-size: 0.85rem;
}

.p_small_size {
	font-size: 1rem;
}

.bg-green {
	background-color: #aaff99;
}

.bg-red {
	background-color: #ffb0b0;
}

.bg-yellow {
	background-color: #fffeda;
}

.bg-bitlight {
	background-color: var(--color-bitlight);
}