:root{
	--price:#00a754;
	--button:#01875e;
	--etebar:#f5222d;
	--green:#00a754
}
body,html{
	font-size:15px
}
a{
	text-decoration:none!important
}
a.psnd-item.comments {
    color: inherit;
}
.offer-item{
	border:1px solid #eee;
	border-radius:8px;
		margin-bottom:1em;
		padding:1em;
	box-shadow: rgba(99, 99, 99, 0.1) 0px 2px 8px 0px;
	background:#F5F5F5;
}
.offer-item .off-header{
	display:flex;
	width:100%;
	justify-content:space-between;

}
.site-img{
	width:80px;
	height:80px!important;
	margin-left:10px;
	object-fit:cover;
	border-radius:10px!important;
}
.offer-item .off-header .right{
	display:flex;
	align-items:flex-start;
}
.offer-item .off-header p,.offer-item .off-header h2{
	margin:0
}
.off-percent{
	color:var(--price);
	font-size:18px;
	font-weight:700;
}
.off-title{
	margin:10px 0 0 0!important;
	margin-top:10px;
	color:#EF394E
}
.btn-show-code{
    font-weight: 500;
    color: #FFFFFF;
    background-color: #EF394EAB;
    border-radius: 0px 8px 8px 0px;
    padding: 26px 15px 26px 15px;
	width:70%;
	font-weight:600;
}
.btn-show-code:hover{
	color:#FFF;
}
.btn-link-code{
    font-size: 17px;
    font-weight: 400;
    fill: #FFFFFF;
    color: #FFFFFF;
    background-color: #EF394E;
    border-radius: 8px 8px 8px 8px;
    padding: 11px 55px 11px 55px;
}
.offer-item .off-header .left{
	display:flex;
	flex-direction:column;
	gap:5px;
	   width: 30%;
    max-width: 30%;
}
.offer-item .off-header .left *{
	text-align:center;
}
.off-etebar{
	color:var(--etebar);
	font-weight:700;
	text-align:center
}
.offer-item .roles{
	display:flex;
	align-items:center;
	margin:1em auto;
	display:none;
}
.offer-item .roles-list{
	display:none;
}
.offer-item .roles span{
	min-width:100px;
	color:#000;
}
.offer-item .roles:after{
	content:"";
	display:block;
	width:100%;
	border-bottom:1px solid #CCC;
	margin-right:10px
}
.bl-point{
	    background-image: url(/wp-content/plugins/offcodes/assets/img/check_circle_outline_white_24dp.svg);
    width: 14px;
    height: 14px;
    background-size: cover;
    margin-left: 5px;
	display:block;
}
.roles-list{
	list-style:none;
	padding:0!important;
	margin:0!important;
	width:100%;
}
.roles-list li{
	display:flex;
	align-items:center;
	margin-bottom:10px;
	font-size:.8em;
	text-align:justify;
	color:#666
}
.offer-popup{
	position:fixed;
	top:0;
	right:0;
	background-color:#ffffffb8;
	width:100vw;
	height:100vh;
	z-index:9999999;
	max-width:100%!important;
	display:none;
	align-items:center;
	justify-content:center;
	overflow:auto;
}
.offer-popup .inner{
	width:100%;
	max-width:400px;
	background:#f7f7f7;
	border-radius:8px;
	display:flex;
	flex-direction:column;
	border:1px solid #ccc;
	max-height:90%;
	overflow:auto;
}
.offer-popup .inner .close-offer-pop{
	margin-top:10px;
	cursor:pointer;
}
.offer-popup .inner .close-offer-pop img{
	width:20px
}
.offer-popup .inner .top,.offer-popup .inner  .bottom{
		display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	gap:1em;
	background:#FFF;
	border-radius:8px;
	box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
	padding:10px 2em;
	border:1px solid #ccc;
	margin:2px 1em
}
.copycode-div{
	text-align:center;
	display:flex;
	flex-direction:column;
	align-items:center;
	position:relative;
}
.copycode-div label{
	font-size:11px;
	font-weight:300
}
#offcode-input,.offcode-input{
    background-color: #ff000000;
    box-shadow: 0px 0px 0px 20px #ff000000;
    border: 2px dashed #EF394E;
    border-radius: 4px;
    color: #EF394E;
    height: 50px;
    cursor: copy;
    width: 100%;
    max-width: 100%;
    float: left;
    font-size: 18px;
    font-weight: bold;
}

.offer-popup .inner  .bottom li{
	font-size:12px;
	margin-bottom:0;
	font-weight:300;
}
.offer-popup .inner .buttom-title:after,.offer-popup .inner .buttom-title:before{
	content:"";
	display:block;
	width:100%;
	border-bottom:1px solid #CCC;
}
.offer-popup .inner .buttom-title{
	display:flex;
	align-items:center;
	justify-content:center;
	width:100%;
}
.offer-popup .inner .buttom-title span{
	min-width:90px;
	font-size:14px;
	margin:0 10px;
}
#offcode-input,.offcode-input{
	text-align:center
}
.report-btns{
	display:flex;
	align-items:center;
	justify-content:center;
	gap:10px;
	margin:10px auto
}
.report-btns .btn{
	width:170px;
	font-size:14px;
	background:#fafafa;
	color:#000;
	font-weight:300;
	text-decoration:none!important;
	text-align:center;
	border:1px solid #ccc;
	height:35px;
	align-items:center;
	display:flex;
	justify-content:center;
	gap:5px;
	white-space:nowrap;
}

.passands{
	display:flex;
	align-items:center;
	gap:10px;
	justify-content:space-between;
	width:100%;
	margin-top:10px
}
.psnd-item{
	display:flex;
	align-items:center;
	justify-content:center;
	gap:5px;
	font-size:12px;
	flex-direction:column;
	font-weight:600;
	cursor:pointer;
}
.psnd-item.liked{
	pointer-events:none;
}
#Filled:not(.liked #Filled){
	display:none;
}
.liked .jss58{
	display:none
}
#off-er-report{
	cursor:pointer;
}
#off-er-report.reported{
	pointer-events:none;
	color:var(--green);
	font-weight:500
}
#off-er-report.reporting{
	pointer-events:none;
}

.single-offcode{
	width:100%;
}
.s-f-h{
	display:flex;
	width:100%;
	margin:1em auto;
	border-bottom:1px dashed #ccc;
	padding-bottom:1em
}
.single-code-site-img{
	width:80px;
	height:80px;
	min-width:80px;
}
.single-offcode .s-f-body{
	width:100%;
	display:flex;
	padding:1em;
	padding:10px 2em;
}
.s-f-body .right,.single-offcode .s-f-body .left{
	width:50%
}
.s-f-body .right{
	display:flex;
	flex-direction:column;
	gap:12px
}
.single-offcode .s-f-body .right label{
	display:block;
	text-align:center;
}
.s-f-body .passands{
width: 400px;
    background: #FFF;
    padding: 10px;
    border-radius: 10px;
    box-shadow: rgba(99, 99, 99, 0.1) 0px 2px 8px 0px;
}
.s-f-body .passands .psnd-item{
	border-left:1px solid;
	text-align:center;
	width:100px
}
.s-f-body .passands .psnd-item:last-child{
	border:0
}
.s-f-body .right p{
	margin:0;
	text-align:right;
	width:100%;
	max-width:400px;
}
.buttom-title{
	font-weight:700;
	margin-bottom:1em;
}
.roles-list li{
	font-size:15px;
	font-weight:300;
}
#comments{
		background:#FFF;
	border-radius:8px;
		box-shadow: rgba(99, 99, 99, 0.1) 0px 2px 8px 0px;
	border:1px solid #f6f6f6;
}

.s-bread{
	list-style:none;
	padding:0!important;
	display:flex;
	gap:10px;
	align-items:center;
	margin:0;
}
.s-bread li a{
	color:#484848;
	font-weight:300
}

.sim-codes{
	display:grid;
	grid-template-columns:1fr 1fr 1fr 1fr;
	gap:10px;
	margin:1em auto;
}
.sim-codes .sim-item{
	background:#FFF;
	text-align:center;
	border-radius:10px;
	overflow:hidden;
			box-shadow: rgba(99, 99, 99, 0.1) 0px 2px 8px 0px;
	border:1px solid #f6f6f6;
}
.sim-head{
	display:flex;
	align-items:center;
	justify-content:space-evenly;
	margin-bottom:12px;
		padding:10px;

}
.sim-site-img{
	border-radius:100%;
}
.sim-title{
	font-weight:700;
	font-size:18px;
	margin:10px auto;
	padding:10px;
}
.sim-footer{
	background:#fafafa;
	border-top:1px solid #e0e0e0;
	padding:10px;
}
.single-sec-title{
	margin-top:1em;
	font-size:18px
}

.loading-code {
    position: absolute;
    bottom: 12px;
	color:var( --e-global-color-primary );
	display:none;
	font-size:16px;
}
.offcode-tax{
	width:100%;
}
.o-c-tax-h{
	background:linear-gradient(135deg, rgb(22, 147, 192), rgb(43, 171, 196));
	width:100%;
	height:200px;
	display:flex;
	align-items:center;
	justify-content:center;
	border-radius:8px;
	margin:1em auto;
	
}
.o-c-tax-h *{
	color:#FFF;
}

.share-items {
    min-height: 45px;
    display: none;
    width: 100%;
    justify-content: center;
    gap: 7px;
}
.share-items img {
    border-radius: 7px;
	    min-height: 30px;
    min-width: 30px;
}
.share-copy-btn {
    background: #e9e9e9;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 30px;
    width: 90px;
}
.off-header .imgs{
	    background-color: #FFFFFF;
    border-radius: 10px 10px 10px 10px;
    box-shadow: 0px 5px 25px 0px rgba(0, 0, 0, 0.1);
	width:80px;
	height:80px;
	min-width:80px;
	margin-left:15px;
	display:flex;
	align-items:center;
	justify-content:center
}
.btn-flex{
	display:flex;
	align-items:center;
	justify-content:center;
}
.f-i{
	height:100%;
	display:flex;
	align-items:center;
	justify-content:center;
	width:25%;
	background:#EF394E;
	color:#FFF;
	font-size:30px;
	border-radius:8px 0 0 8px;
}
.offer-item .right{
	position:relative;
	max-width:65%;
	width:65%;
	border-left:5px dotted #ccc;
	padding-left:5px
}
.offer-item .right:before,.offer-item .right:after{
	    position: absolute;
    content: "";
    width: 60px;
    height: 28px;
    background: #fff;
    top: -20px;
    left: -31px;
	border-radius:0 0 50px 50px;
}
.offer-item .right:after{
	top:100%;
	border-radius:50px 50px 0 0 
}

.off-created-date{
	    text-align: left;
    color: #6469EA;
    font-family: "Iran-Yekan-bild", Sans-serif;
    font-weight: 600;
    width: auto;
	display:inline-block;
	margin-top:1em;
}
.off-content{
	margin-top:1em;
}
.off-termname{
	text-align:left!important;
	width:100%;
	margin-bottom:2em
}
.single-offcode h2{
	margin:0
}
.single-offcode h1{
	font-size:18px;
}
.s-c-item{
	background:#F5F5F5;
	padding:12px;
	border-radius:8px;
	box-shadow:rgba(99, 99, 99, 0.1) 0px 2px 8px 0px;
	position:relative
}
.s-f-body .left{
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	gap:12px
}
.single-code-term{
	position:absolute;
	top:10px;
	left:10px
}
.monghazi{
/* 	background:#ffffffc7;
width:100%;
	height:calc(100% + 24px)
		!important;
	position:absolute;
	top:-12px;
	left:0;
	z-index:9; */
	display:none;
}








@media (max-width:576px){
	.single-offcode .s-f-body{
		display:block;
		padding:10px
	}
	.s-f-body .right,.s-f-body .left{
		width:100%
	}
	.single-offcode .s-f-body .left{
		margin-top:1em;
		border-top:1px solid #ccc;
		width:100%;
		padding-top:1em;
		
	}
	.s-bread{
		flex-wrap: wrap;
	}
	.single-code-site-img{
		width:60px;
		min-width:60px;
		height:60px;
	}
	.sim-codes{
		display:block
	}
	.offer-item .off-header{
		display:block;
	}
	.offer-item .off-header .right{
		text-align:center
	}
	.btn-show-code{
		margin-top:1em
	}
	.report-btns .btn{
		width:50%;
		font-size:13px
	}
	.report-btns .btn svg{
		display:none;
	}
	.roles-list{
		width:100%;
	}
	.offer-popup .inner .top, .offer-popup .inner .bottom{
		padding:12px
	}
	.buttom-title{
		margin-bottom:0
	}
	.off-title{
		text-align:center
	}


}