@font-face {
    font-family: 'Sans';
    src: url('../fonts/AIranianSans.woff2') format('woff2'),
        url('../fonts/AIranianSans.woff') format('woff'),
        url('../fonts/AIranianSans.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

body{
//	background-image: url('../images/bg-wlp.jpg');
//	background-repeat: no-repeat;
//	background-attachment: fixed;
//	background-size:     cover;  
	font-family: 'Sans';
}

.op-logo{
	cursor: pointer;
}
	#overlay {
		position: fixed;
		display: none; 
		width: 20%;
		height: 10%;
		top: 40%;
		left: 40%;
		background-color: white;
		z-index: 999999;
		cursor: pointer;
	}
#update_alert {
		position: fixed;
		display: none; 
		width: 95%;
		height: 95%;
		top: 2%;
		left: 2%;
		background-color: white;
		z-index: 999999;
		cursor: pointer;
	}
#upnews_alert {
		position: fixed;
		display: none; 
		width: 95%;
		height: 95%;
		top: 2%;
		left: 2%;
		background-color: white;
		z-index: 999999;
		cursor: pointer;
	}
#pin_alert {
		position: fixed;
		display: none; 
		width: 100%;
		height: 100%;
		top: 0%;
		left: 0%;
		background-color: #1E1E1E;
		z-index: 999999;
		cursor: pointer;
	}
.nav-itm:hover{
	background-color: white;
	border-radius: 5px;
}	
.nav-itm:hover span{
	color: black !important;
}

.gs-image{
	 filter: grayscale(1000%);
}


.sc::-webkit-scrollbar {
  width: 2px;
  height: 2px;
}
.sc::-webkit-scrollbar-button {
  width: 0px;
  height: 0px;
}
.sc::-webkit-scrollbar-thumb {
  background: #e1e1e1;
  border: 0px none #ffffff;
  border-radius: 50px;
}
.sc::-webkit-scrollbar-thumb:hover {
  background: #ffffff;
}
.sc::-webkit-scrollbar-thumb:active {
  background: #000000;
}
.sc::-webkit-scrollbar-track {
  background: #666666;
  border: 0px none #ffffff;
  border-radius: 50px;
}
.sc::-webkit-scrollbar-track:hover {
  background: #666666;
}
.sc::-webkit-scrollbar-track:active {
  background: #333333;
}
.sc::-webkit-scrollbar-corner {
  background: transparent;
}
a{
	text-decoration: none;
}
.rtl-bg{
	background-color: #941063;
}
.mci-bg{
	background-color: #54C5D0;
}
.mtn-bg{
	background-color: #FEBE10;
}
.sht-bg{
	background-color: #2000FF;
}
.mci-btn , .mci-btn:hover, .mci-btn:active, .mci-btn:visited{
	background-color: #EB7400 !important;
	color: black !important;
	border: none !important;
}
.mtn-btn , .mtn-btn:hover, .mtn-btn:active, .mtn-btn:visited{
	background-color: #00688F !important;
	color: white !important;
	border: none !important;
}
.rtl-btn, .rtl-btn:hover, .rtl-btn:active, .rtl-btn:visited{
	background-color: #C4D94B !important;
	color: white !important;
	border: none !important;
}
.sht-btn, .sht-btn:hover, .sht-btn:active, .sht-btn:visited{
	background-color: #C4D94B !important;
	color: white !important;
	border: none !important;
}

.charge_top{
	background-image: url('/asset/images/charge.svg')!important;
}

.service-item:hover{
	background-color: var(--bs-primary);
	color: var(--bs-white);
	border-radius: 10px;
}

 .gg-list {
 box-sizing: border-box;
 position: relative;
 display: block;
 transform: scale(var(--ggs,1));
 width: 22px;
 height: 20px;
 border: 2px solid;
 border-radius: 3px
}

.gg-list::after,
.gg-list::before {
 content: "";
 display: block;
 box-sizing: border-box;
 position: absolute;
 width: 2px;
 height: 2px;
 background: currentColor;
 top: 3px;
 left: 3px;
 box-shadow:
 0 4px 0,
 0 8px 0
}

.gg-list::after {
 border-radius: 3px;
 width: 8px;
 left: 7px
} 

 .gg-edit-unmask,
.gg-edit-unmask::after {
 display: block;
 box-sizing: border-box;
 border-radius: 22px
}

.gg-edit-unmask {
 position: relative;
 transform: scale(var(--ggs,1));
 width: 20px;
 height: 20px;
 border: 2px solid transparent
}

.gg-edit-unmask::after {
 content: "";
 position: absolute;
 width: 4px;
 height: 4px;
 background: currentColor;
 top: 6px;
 left: 6px;
 box-shadow:
 0 7px 0 1px,
 0 -7px 0 1px,
 -7px 0 0 1px,
 7px 0 0 1px
} 

 .gg-modem {
 position: relative;
 display: block;
 box-sizing: border-box;
 transform: scale(var(--ggs,1));
 width: 20px;
 height: 20px;
 border-radius: 4px;
 border-top: 12px solid transparent;
 box-shadow: inset 0 0 0 2px
}

.gg-modem::after,
.gg-modem::before {
 content: "";
 display: block;
 box-sizing: border-box;
 position: absolute;
 background: currentColor;
 right: 4px;
 bottom: 3px;
 width: 2px;
 height: 2px;
 border-radius: 22px
}

.gg-modem::after {
 right: -1px;
 bottom: 11px;
 width: 20px;
 transform: rotate(30deg)
} 

 .gg-add {
 box-sizing: border-box;
 position: relative;
 display: block;
 width: 22px;
 height: 22px;
 border: 2px solid;
 transform: scale(var(--ggs,1));
 border-radius: 22px
}

.gg-add::after,
.gg-add::before {
 content: "";
 display: block;
 box-sizing: border-box;
 position: absolute;
 width: 10px;
 height: 2px;
 background: currentColor;
 border-radius: 5px;
 top: 8px;
 left: 4px
}

.gg-add::after {
 width: 2px;
 height: 10px;
 top: 4px;
 left: 8px
}