@charset "utf-8";
/* CSS Document */
@font-face {
font-family: IRANYekanWeb;
	src: url('fonts/iranyekanwebregular.ttf'),
	url('fonts/iranyekanwebregular.woff'),
     url('fonts/IRANYekanWebn.eot');
	 }
@font-face {
	font-family: Shabnam-Light;
	src: url('fonts/shabnam/Shabnam-Light.ttf'),
	url('fonts/shabnam/Shabnam-Light.woff'),
     url('fonts/shabnam/Shabnam.eot');
	 }
	 
body {
  font-family: Shabnam-Light, Segoe UI;
  margin: 0;
  padding: 0;
}

.all{
	background: #F2F5FC;
	padding: 0px;
	margin: 0px;
	border:0px;
	width:auto;
	height:auto;
	text-decoration:none;
}

.containervasat {
  display: flex;
  direction: rtl; /* راست چین کردن متن‌ها */
  height:100%;
  margin-top: 1.5%;
}

.toggle-btn {
  font-size: 24px;
  background: none;
  border: none;
  cursor: pointer;
}

.menu {
  width: 25%;
  transition: width 0.4s ease-in-out;
  overflow: hidden;
  direction: ltr; /* راست به چپ بودن منو */
  padding: 10px 0; /* افزودن فضای داخلی به منو */
  display: flex;
  flex-direction: column; /* تغییر جهت نمایش آیتم‌های منو */
  align-items: center; /* وسط‌چین کردن آیتم‌ها */
}

.menu button {
  	margin-right: 15%;

}

.menu ul {
  list-style: none;
  padding: 0;
  margin: 0;
  width: 100%; /* تعیین عرض 100% برای آیتم‌های منو */
}

.menu ul li {
  padding: 10px;
  border-bottom: 1px solid #555;
  width: 100%; /* تعیین عرض 100% برای آیتم‌های منو */
  text-align: right; /* راست چین کردن متن آیتم‌ها */
}

.menu ul li a {
  color: black;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: space-between; /* فضای مساوی بین متن و آیکون */
  width: 100%; /* تعیین عرض 100% برای آیتم‌های منو */
}

.menu ul li a i {
  margin-left: 10px; /* تنظیم حاشیه چپ برای آیکون‌ها */
  flex-shrink: 0; /* جلوگیری از انقباض آیکون‌ها */
  width: 35%; /* تعیین عرض بزرگتر برای آیکون‌ها */
  text-align: center; /* راست چین کردن متن آیکون‌ها */
}

/* تعریف رفتار رسپانسیو برای منو */
@media screen and (max-width: 1200px) {
  .menu {
    width: auto; /* عرض منو به صورت خودکار */
  }

  .menu ul {
    display: none; /* مخفی کردن لیست منو */
  }

  .menu.active ul {
    display: block; /* نمایش لیست آیکون‌ها */
    position: absolute; /* موقعیت مطلق */
    top: 50px; /* فاصله بالایی */
    left: 0; /* چسباندن به چپ */
    background-color: #333; /* رنگ پس‌زمینه */
    width: 100%; /* عرض کامل */
    padding: 10px 0; /* افزودن فضای داخلی */
    box-sizing: border-box; /* محاسبه حجم با در نظر گرفتن حاشیه و حدود */
  }

  .menu.active ul li {
    padding: 10px;
    border-bottom: 1px solid #555;
    width: 100%; /* عرض کامل آیتم‌ها */
    text-align: center; /* وسط‌چین کردن آیتم‌ها */
  }
}

.menu .toggle-btn {
  color: black;
}

.menu .icon-menu {
  display: none;
}

.show-menu {
  width: 50px; /* اندازه کوچک شده برای نمایش فقط آیکون‌ها */
}

.show-menu .text-menu {
  display: none;
}

.show-menu .icon-menu {
  display: block;
}

.logo {
  float: right; /* راست چین کردن لوگو */
}

.navright {
  float: left; /* چپ چین کردن منو */
}

.menu-toggle {
  display: none; /* عدم نمایش دکمه منو در حالت بزرگ */
}

.content {
  flex-grow: 1; /* انعطاف پذیری برای اشغال فضا وسط صفحه */
  justify-content: center; /* وسط‌چین کردن افقی */
  align-items: center; /* وسط‌چین کردن عمودی */
  margin-right: 10%;
}

.header{
	background:#fff;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 10px;
}
.khat1{
	background-color: #4efeb1;
	width: auto;
	height: 3px;
}
.khatup{
	background-color: #222222;
	width: auto;
	height: auto;
	text-align: left;
	color: #c6c6c6;
	padding: 1px;
	padding: 4px 0px 5px 3%;
}
.linktop{
	text-decoration:none;
	color:#bfbfbf;
	padding-left: 7px;
	padding-right: 7px;
	font-family: Shabnam-Light,Segoe UI;
	font-size:13px;
}
.linktop:hover{
	background-color:#393939;
	padding: 7px 7px 5px 7px;
}
.khatup_date{
	font-family: Shabnam-Light,Segoe UI;
	font-size:15px;
	padding: 1px;
	padding: 4px 3% 5px 0px;
	margin: 1%;
	float:left;
}
.logo-box {
	text-align:left;
	margin: 0.1%;
}
.imgslider {
	display: block;
	width: 30px;
	height: 30px;
	cursor: pointer;
	float: left;
}
.ulslider{
	margin-left:500px;
}
.top{
background: #f9f9f9;
padding: 8px;
color: #000;
font-family: IRANYekanWeb,Segoe UI;
font-size: 13px;
border: 2px solid #000;
border-radius: 30px;
text-align:center;
font-weight: 500;
line-height: 25px;
margin: 1px;
}
.top:hover{
		background: #f3f3f3;
		color: #000;
		transition: 0.4s;
}
.nav-tabs{
            display: flex;
            justify-content: center;
}

.nav-tabs .nav-item{
            margin-right: 10px;
        }
.nav-link{
            padding: .5rem 1rem;
}
@media (min-width: 992px) {
  .nav-item:hover .dropdown-menu {
    display: block !important;
  }
}

@media (max-width: 991px) {
  .dropdown-toggle::after {
    display: none !important;
  }
  .dropdown-menu {
    display: none !important;
  }
  .nav-item:hover .dropdown-menu {
    display: block !important;
  }
}
.pro{
	border-style:solid;
	border-width: 1px;
	border-color: #B4B4B4;
	vertical-align: top;
	width: 100%;
	border-radius: 10px;
	text-align: left;
}
.pro:hover{
	 box-shadow: 0 3px 10px 2px rgba(0,0,0,.15);
}
.clear{
    clear:both;
    float:none;
}
.footer0{
	background: #6d717a;
	width: auto;
	font-family: IRANYekanWebn;
	padding: 8px;
	font-size: 16px;
	color: #E7E7E7;
	margin-top:20px;
	
}
.footer{
	background-color: #2C3A47;
	width: auto;
	height: fixed;
	max-height:550px;
	min-height: 300px;
		text-align: center;
	font-family: IRANYekanWeb;
	font-size: 18px;
	color: #E7E7E7;
}
.pasafhe1{
	float: right;
	margin-bottom: 1px;
	text-align: right;
	margin-left: 5%;
	margin-right: 3%;
	clear: both;
}
.pa a{
	color: #b9b9b9;
	text-decoration: none;
}
.footer_link{
		color: #920202;

}
.footer_link:hover{
		color:#fff;
}
.pasafhe11{
	float: right;
	margin-bottom: 1px;
	text-align: right;
	margin-left: 5%;
	margin-right: 2%;
}
.footer_down{
	background-color: #eeeff1;
	color: #2B2B2B;
	font-family: IRANYekanWeb;
	font-size: 12px;
	padding: 10px;
	text-align: right;
	margin-right: 2%;
	float: right;
}
.last_post_titr{
	background-color: #222;
	padding: 3px;
	margin-left: 10px;
	width: auto;
	border-top-right-radius: 15px;
	border-top-left-radius: 15px;
	color:#fff;
}
.last_post{
background-color: #fff;
margin-left: 10px;
font-size: 14.5px;
text-align: right;
padding:12px;
line-height: 2;
border-bottom-left-radius: 8px;
border-bottom-right-radius: 8px;
}
.emkanat2 {
	font-family:IRANYekanWeb,Segoe UI;
   font-size:18px;
	text-align: center;
	margin-right: 15%;
}
.action {
  position: relative;
  overflow: hidden;  
  font-size: 11px;
  color: #fff;
  text-align: center;
  cursor: pointer;
  display: inline-block;
  vertical-align: middle;
  user-select: none;
}

.action > span {
   height: 32px;
   display: inline-block;
   vertical-align: middle;
    position: relative;
    border: 1px solid;
    border-radius: 4px;
    box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.19); 
	border-color: #000 #000 #000 #000;
	background: linear-gradient(#EFFC86, #95FEB5);
   
 }
 .action:hover > span {
  border-color: #000 #000 #000 #000;
  text-decoration: none;
  background: linear-gradient(#F7FFB6, #96F2B2);
  box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.24), 0 1px 2px 0 rgba(0, 0, 0, 0.11);
  }
  .action:active > span {
    box-shadow: inset 0 2px 3px 0 rgba(0, 0, 0, 0.12), inset 0 -1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 2px 0 rgba(0, 0, 0, 0.11);
    background: linear-gradient(#EFFC86, #95FEB5);
  }
  
    .action b {
      padding: 0 12px;
      display: inline-block;
      vertical-align: middle;
      font-size: 13px;
      font-weight: bold;
	  text-shadow: 0 1px 0 rgba(255, 255, 255, 0);
      color: #000;
      line-height: 34px;
    }
    .action:active b { 
      color: #222;
      text-shadow: 0 1px 0 rgba(0, 0, 0, 0.35); 
    }

.action .act-indicator  {
  position: absolute;
  width: 16px;
  height: 12px;
  top: 50%;
  left: 50%;
  z-index: 1;
  margin: -8px 0 0 -6px;
}

.act-indicator.i-M-loader { 
  width: 20px; 
  height: 20px; 
  margin: -12px 0 0 -10px; 
}

.action b { transition: opacity .2s ease-out; }

.act-success b { transition-delay: 2.2s; }

/* default state of icons */
.action .act-indicator { top: -100%; }

/* Move the spinner (slide in) and fade out the text */
.act-loading b { opacity: .12; }
.act-loading .act-indicator.i-M-loader {
  top: 50%;
  animation: loader .7s steps(8) infinite, slideInDown .4s both;
}

/* Move the feedback (success or error) */
.act-success .i-accept {
  top: 50%;
  animation: slideInDown .78s forwards, slideOutDown .4s 2s forwards;
}

/* Move the spinner  (slide out) */
.act-success .act-indicator.i-M-loader {
  top: -100%;
  animation: loader .7s steps(8) infinite, slideOutDown .45s .45s both;
}

/* Icons */
[class*=i-] {
  display: inline-block;
  vertical-align: middle;
  background: url(https://cl.ly/I3jr/sprite.png) no-repeat left top;
  font: 0/0 a;
  color: transparent;
  width: 16px;
  height: 16px;
}

[class*=i-M] { width: 20px; height: 20px; }

.i-M-loader {
  background: url(https://cl.ly/I3jr/sprite.png) no-repeat;
  animation: loader .8s steps(2) infinite;
}
.i-accept { background-position: -77px -149px; }


/* Keyframes declarations */
@keyframes slideInDown {
  0%   { top: -100%; }
  60%  { top: -50%; }
  80%  { top: 65%; }
  100% { top: 50%; }
} 

 @keyframes slideInUp {
  0%   { top: 250%; }
  60%  { top: 150%; }
  80%  { top: 35%; }
  100% { top: 50%; }
}

@keyframes slideOutDown {
  0%   { top: 50%; }
  100% { top: 150%; }
}

@keyframes slideOutUp {
  0%   { top: 50%; }
  100% { top: -150%; }
}

@keyframes loader { 
  from { background-position: 0px -408px; } 
  to { background-position: -192px -408px; }
}
.frm_type{
	width: 30%;
	background: none;
	border: none;
	border-bottom: solid;
	border-color: #485460;
		font-family:IRANYekanWeb,Segoe UI;
	font-size: 16px;
		margin-left: auto;
	margin-right: auto;
		margin: 8px;
		outline:none;
}
.khata{
	background-color: #E03134;
	padding: 4px;
	border-radius: 4px;
	color: #fff;
	font-size: 18px;
	margin-bottom: 10px;
}
	.movafagh{
background: #4efeb1;
padding: 18px;
color: #000;
font-family: IRANYekanWeb,Segoe UI;
font-size: 18px;
border: 2px solid #000;
border-radius: 50px;
}
	.maahsool{
background-color: #1E1E1E;
padding: 12px;
border-radius: 50px;
color: #fff;
font-size: 24px;
font-family: Segoe UI;
text-align: center;
}
.dokmekharid{
		background-color: #e8e8e8;
		padding: 2px;
		color: #484848;
		text-decoration: none;
		font-family: IranYekanWeb,Segoe UI;

}
.dokmekharid:hover{
	background-color: #484848;
	padding: 2px;
	color: #e8e8e8;
	text-decoration: none;

	transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

        .radio-container-index input[type="radio"] {
            display: none;
        }

        .radio-container-index label {
            position: relative;
            padding-left: 30px;
            cursor: pointer;
            font-size: 18px;
            color: #333;
            transition: color 0.3s ease;
        }

        .radio-container-index label:before {
            content: '';
            position: absolute;
            top: 50%;
            left: 0;
            transform: translateY(-50%);
            width: 16px;
            height: 16px;
            border-radius: 50%;
            border: 2px solid #999;
            background-color: #fff;
            transition: all 0.3s ease;
        }

        .radio-container-index label:after {
            content: '\f00c';
            position: absolute;
            top: 45%;
            left: 3px;
            transform: translateY(-50%);
            font-family: "Font Awesome 5 Free";
            font-weight: 900;
            font-size: 20px;
            color: #000;
            opacity: 0;
            transition: all 0.5s ease;
        }

        .radio-container-index input[type="radio"]:checked + label {
            color: #00a000;
			
        }

        .radio-container-index input[type="radio"]:checked + label:before {
			border-color:#000;
            background-color: #fff;
			transition: all 0.2s ease;
        }

        .radio-container-index input[type="radio"]:checked + label:after {
            opacity: 1;
		    animation: tick-anim-selected 0s ease-in-out;
        }
		@keyframes tick-anim-selected {
    0% {
        transform: scale(0);
    }
    50% {
        transform: scale(0);
    }
    100% {
        transform: scale(0);
    }
}
.frm_label{
	   width:120px;
    color: #1A1A1A;
    display:inline-block;

}
.frm_type_select{
	column-count: auto;
	width: 30%;
	background: none;
	border: none;
	border-bottom: solid;
	border-color: #485460;
	font-family: IRANYekanWeb,Segoe UI;
	font-size: 16px;
	margin-left: auto;
	margin-right: auto;
	margin: 8px;
}
.frm_type_select:focus{
		border-color: #1e272e;
}
.frmm{
	width: 85%;
	height: auto;
	text-align: right;
	background-color:#fff;
}
	.admin_pro{
		background-color:#fff;
		text-align:center;
		font-family:IRANYekanWeb,Segoe UI;
		  border-color:#000;
		  border-style:solid;
	}
	.frm_btn2{
	padding: 5px;
	background: #C7292C;
	color:#E7E7E7;
	border: none;
	font-family:IRANYekanWeb,Segoe UI;
	font-size: 15px;

}
.frm_btn2:hover{
	background: #A61013;
}

.frm_btn{
	padding: 5px;
	background: #C7292C;
	color:#E7E7E7;
	border: none;
	font-family:IRANYekanWeb,Segoe UI;
	font-size: 15px;
	margin-right: 30%;
}
.frm_btn:hover{
	background: #A61013;
}
.dastebandi4{
	background-color:#2c3e50;
	color:#ecf0f1;
	font-family: IRANYekanWeb,Segoe UI;
}
	.status{
		background-color:#fff;
		text-align:center;
		font-family:IRANYekanWeb,Segoe UI;
		  border-color:#000;
		  border-style:solid;
	}
	.table0{
		background-color: #2c3338;
		color: #C0C0C0;
		width: 100%;
		  
	}

	.table00{
		background-color: #000;
		  
	}
	.table1{
		background-color: #f6f7f7;
		color: #50575e;
	}
		.table2{
	background-color: #333131;
			color: #C0C0C0;
	}
	.menu_right{
	width: 370px;
	height: auto;
	background-color: #50FEB9;
	border-radius: 45px;
	border-style: solid;
		margin-right: 10px;
	margin-left: 10px;
	width: auto;
}
	.online:after {
 content:"";
 width:8px;
 height:8px;
 background:#000;
 display:inline-flex;
 margin:5px;
 animation:charging-animation 1s ease-in-out infinite;
 box-shadow:0 0 0 0 #b3fe4e01;
 border-radius:50%
}
@keyframes charging-animation {
 0% {
  box-shadow:0 0 0 0 rgba(0,0,0,.5)
 }
 100% {
  box-shadow:0 0 0 10px transparent
 }
}
.container-bot {
  max-width: 60%;
  margin: 0 auto;
  padding: 20px;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 5px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
.container-wrapper {
  display: flex;
  justify-content: space-between;
  max-width: 600px;
  margin: 0 auto;
  padding: 20px;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 5px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
.form-group{
	margin-bottom: 1rem;
}
.form_request {
  width: 300px;
  margin: 20px auto;
  border: 1px solid #ccc;
  padding: 20px;
  border-radius: 5px;
  background-color: #fff;
  box-shadow: 0px 2px 2px #ccc;
  
}
		.radio-container {
    display: flex;
    align-items: center;
}

.radio-input-black {
    display: none;
}

.radio-label-black {
    position: relative;
    width: 18px;
    height: 18px;
    margin-right: 5px;
    cursor: pointer;
}

.radio-label-black:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 8px;
    height: 8px;
    background: #000;
    display: inline-flex;
    margin: 5px;
    animation: charging-animation-black 1s ease-in-out infinite;
    box-shadow: 0 0 0 0 rgba(179, 254, 78, 0.01);
    border-radius: 40%;
    transition: background-color 0.3s ease, box-shadow 0.3s ease;
}

.radio-input-black:checked + .radio-label-black:before {
    background: #ccc;
    box-shadow: 0 0 0 50px transparent;
}

@keyframes charging-animation-black {
    0% {
        box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.5);
    }
    100% {
        box-shadow: 0 0 0 10px transparent;
    }
}

.radio-input-green {
    display: none;
}

.radio-label-green {
    position: relative;
    width: 18px;
    height: 18px;
    margin-right: 5px;
    cursor: pointer;
}
.radio-label-green:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 8px;
    height: 8px;
    background: #77e6b2;
    display: inline-flex;
    margin: 5px;
    animation: charging-animation-green 1s ease-in-out infinite;
    box-shadow: 0 0 0 0 rgba(179, 254, 78, 0.01);
    border-radius: 50%;
    transition: background-color 0.3s ease, box-shadow 0.3s ease;
}

.radio-input-green:checked + .radio-label-green:before {
    background: #000;
    box-shadow: 0 0 0 10px transparent;
	animation: charging-animation-green-checked 1s ease-in-out infinite;
}
@keyframes charging-animation-green {
    0% {
        box-shadow: 0 0 0 0 rgba(97, 228, 166, 0.5);
    }
    100% {
        box-shadow: 0 0 0 10px transparent;
    }
}
@keyframes charging-animation-green-checked {
    0% {
        box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.5);
    }
    100% {
        box-shadow: 0 0 0 10px transparent;
    }
}

.radio-input-red {
    display: none;
}

.radio-label-red {
    position: relative;
    width: 18px;
    height: 18px;
    margin-right: 5px;
    cursor: pointer;
}
.radio-label-red:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 8px;
    height: 8px;
    background: #ff6767;
    display: inline-flex;
    margin: 5px;
    animation: charging-animation-red 1s ease-in-out infinite;
    box-shadow: 0 0 0 0 rgba(179, 254, 78, 0.01);
    border-radius: 50%;
    transition: background-color 0.3s ease, box-shadow 0.3s ease;
}

.radio-input-red:checked + .radio-label-red:before {
    background: #000;
    box-shadow: 0 0 0 10px transparent;
	animation: charging-animation-red-checked 1s ease-in-out infinite;
}
@keyframes charging-animation-red {
    0% {
        box-shadow: 0 0 0 0 rgba(255, 160, 160, 0.5);
    }
    100% {
        box-shadow: 0 0 0 10px transparent;
    }
}
@keyframes charging-animation-red-checked {
    0% {
        box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.5);
    }
    100% {
        box-shadow: 0 0 0 10px transparent;
    }
}
.online-green:before {
 content:"";
 width:8px;
 height:8px;
 background:#77e6b2;
 display:inline-flex;
 margin:5px;
 animation:charging-animation-online-green 1s ease-in-out infinite;
 box-shadow:0 0 0 0 #b3fe4e01;
 border-radius:50%
}
@keyframes charging-animation-online-green {
 0% {
  box-shadow: 0 0 0 0 rgba(97, 228, 166, 0.5);
 }
 100% {
  box-shadow:0 0 0 10px transparent
 }
}
.online-red:before {
 content:"";
 width:8px;
 height:8px;
 background:#ff6767;
 display:inline-flex;
 margin:5px;
 animation:charging-animation-online-red 1s ease-in-out infinite;
 box-shadow:0 0 0 0 #b3fe4e01;
 border-radius:50%
}
@keyframes charging-animation-online-red {
 0% {
  box-shadow: 0 0 0 0 rgba(255, 160, 160, 0.5);
 }
 100% {
  box-shadow:0 0 0 10px transparent
 }
}