@import url('../Font/Fonts.css');

*
{
	font-family: IRANSans;
	font-size: 12pt;
	font-style: normal;
	font-weight: normal;
  scroll-behavior: smooth;
}
body 
{
	margin: 0;
	padding: 0;
	overflow: inherit;
	background-color: #dddddd;
}
.ttl
{
	color: Silver;
}
.Shadow1
{
	filter: drop-shadow(0 0 7px rgba(0 ,0 ,0 , 1));
}
.Err
{
	color: Red;
	font-size: 10pt;
}
.FR
{
	float: right;
	vertical-align: middle;
}
.FL
{
	float: left;
	vertical-align: middle;
}
.PnlCls
{
	border: 1px solid #888888;
	border-radius: 20px;
	display: inline-table;
	padding: 20px;
}
.Cls1
{
	width: calc(100% - 12px);
	text-align: center;
	background-color: White;
	padding: 5px;
	color: Black;
	border: 1px solid #C0C0C0;
	border-radius: 5px;
}
.Cls2
{
	background-color: White;
	width: 200px;
	padding: 5px;
	color: Black;
	border: 1px solid #C0C0C0;
	border-radius: 5px;
}
.Btn1
{
	width: 100%;
	text-align: center;
	background-color: #336699;
	color: White;
	padding: 5px;
	border-radius: 5px;
	cursor: pointer;
	border: none;
}
.Vasat
{
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	position: absolute;
}
#BusyPnl
{
	left: 0;
	right: 0;
	bottom: 0;
	top: 0;
	position: fixed;
	background-color: White;
	opacity: 0.8;
}
#back-top
{
  position: fixed;
  left: 10px;
  bottom: 40px;
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	transition: opacity .3s;
}
#back-top.show{
	opacity: 1;
	visibility: visible;
}
.LTR
{
	direction: ltr;
}
.RTL
{
	direction: rtl;
}
.khat
{
	border-bottom: 1px solid silver;
}
.aCls1
{
	color: Blue;
	text-decoration: none;
	text-align: center;
	border: none;
	cursor: pointer;
	background-color: transparent;
}
.aCls1:hover
{
	color: Red;
}
.aImg
{
	border: none;
	text-decoration: none;
	text-align: center;
	vertical-align: middle;
	cursor: pointer;
}
.Limg
{
	cursor: pointer;
}
.VI
{
	vertical-align: middle;
}
.Lin50, .Lin50x
{
	height: 45px;
	overflow: hidden;
}
.Box1, .Box2, .Box4
{
	cursor: pointer;
	display: inline-table;
	background-color: #fff;
	border-radius: 15px;
	padding: 10px;
	margin: 10px;
	width: 170px;
}
.Box2
{
	width: 360px;
}
.Box1:hover, .Box2:hover, .Box4:hover, .Limg:hover
{
	transition: 0.7s;
	filter: drop-shadow(0 0 7px rgba(0 ,0 ,0 , 1));
}
.Box1 table, .Box2 table, .Box4 table
{
	width: 100%;
}
.Box1 img, .Box4 img
{
	width: 100%;
	max-width: 150px;
}
.Box3
{
	border: 1px solid Silver;
	background-color: #f2f2ff;
	border-radius: 10px;
	padding: 10px;
}
.Top
{
	min-width: 260px;
	top: 0;
	width: 100%;
	position: fixed;
	background-color: White;
	filter: drop-shadow(0 3px 3px rgba(0 ,0 ,0 , 0.5));
}
.Bl
{
	color: Blue;
}
.Sl
{
	color: Silver;
}
.Slx
{
	color: Silver;
	font-size: 10pt;
}
.bImg
{
	height: 120px;
}
.Pnl1
{
	min-width: 260px;
	padding: 80px 10px 10px 10px;
}
.Pnl2
{
	min-width: 260px;
	padding: 100px 30px 100px 30px;
	width: calc(100% - 60px);
}
.Pnl3
{
	width: calc(100% - 320px);
	left: 0;
	top: 60px;
	bottom: 0;
	position: fixed;
	padding: 10px;
	overflow: auto;
}
.Pnl4
{
	width: 300px;
	right: 0;
	top: 60px;
	bottom: 0;
	position: fixed;
	background-color: White;
	border: 1px solid #C0C0C0;
}
.Pnl5
{
	min-width: 240px;
	padding: 20px 0 20px 0;
	width: 100%;
}
.GV
{
	min-width: 320px;
	background-color: White;
}
.GVH, .GVHx
{
	vertical-align: middle;
	text-align: center;
	color: White;
	height: 40px;
	background-color: #575AC8;
}
.GVHx
{
	background-color: #9EA3FF;
}

@media screen and (max-width: 1000px)
{
	.Pnl3 { width: calc(100% - 220px); }
	.Pnl4 { width: 200px; }
}

@media screen and (max-width: 620px)
{
	.Pnl3 { width: calc(100% - 20px); top: 180px; }
	.Pnl4 { width: 100%; bottom: auto; height: 106px; }
}

@media screen and (max-width: 440px)
{
	.Box1 { width: 120px; }
	.Box1 * { font-size: 10pt; }
	.Lin50 { height: 40px; }
}

@media screen and (max-width: 420px)
{
	.Pnl3 { width: 100%; padding: 0; }
	.Box2 { border-radius: 0; margin: 0; width: 100%; border-top: 1px solid Silver; }
}

@media screen and (max-width: 340px)
{
	.Box1 { width: 170px; }
	.Box1 * { font-size: 12pt; }
	.Lin50 { height: 50px; }
}