/*
BOMRANI STORE
Version 1.0
by Hamid Shavarean Studio
License: MIT License http://hamidshavarean.mit-license.org/
*/

@import 'reset.css';
@import 'responsive.gs.24col.css';
@import 'font-awesome.min.css';
@import 'flipclock.css?2506112205';

@font-face {
	font-family: 'Dana';
	src: url('../fonts/dana-regular.woff2') format('woff2'),
		 url('../fonts/dana-regular.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Dana';
	src: url('../fonts/dana-bold.woff2') format('woff2'),
		 url('../fonts/dana-bold.woff') format('woff');
	font-weight: bold;
	font-style: normal;
}

@font-face {
	font-family: Anjoman-FaNum;
	font-style: normal;
	font-weight: normal;
	src: url('../fonts/Anjoman-FaNum-Regular.eot');
	src: url('../fonts/Anjoman-FaNum-Regular?#iefix') format('embedded-opentype'),  /* IE6-8 */
		 url('../fonts/Anjoman-FaNum-Regular.woff2') format('woff2'),  /* FF39+,Chrome36+, Opera24+*/
		 url('../fonts/Anjoman-FaNum-Regular.woff') format('woff');  /* FF3.6+, IE9, Chrome6+, Saf5.1+*/
}

body {
	margin:0;
	padding:0;
	height:100vh;
	overflow-x:hidden;
	-webkit-tap-highlight-color:rgba(0,0,0,0);
	cursor:default;
	background:#e5e4d1;
	color:#000000;
	font-family: Dana;
}

b, strong {font-weight:bold;}

button, img, span, h1, div {
	user-select: none;
	-webkit-user-select: none;
}

.container {
	max-width:1024px;
	margin:0 auto;
	padding:2rem 1rem;
/* 	border:1px solid #0b46b2; */
	direction:rtl;
	text-align:right;
	display:flex;
	flex-direction: column;
	height: 100%;
	justify-content: space-between;
}


.badge {
	width:150px;
	height:80px;
	margin:0 auto 1rem auto;
	z-index:1000;
}

.badge svg {
	width:100%;
	height:5rem;
	fill:#000000;
}
/*
.col {
	float:right;
}
*/


h1 {text-align:center; font-size:1em; margin-top:.5em; line-height:1.4em; font-weight:bold;}
h2 {text-align:center; font-size:2em;}

.wrapper {
	padding:0 .9em;
}

/* Change Autocomplete styles in Chrome*/
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0px 1000px #fffefa inset;
}

textarea,
input,
select,
option,
input[type="button"],
input[type="submit"] {
	 -webkit-appearance: none;
	 border-radius: 0;
}


input, select {
	font-family: Dana;
	width:100%;
	padding: 9px 12px;
	border-radius: .75rem;
	background-color: #fffefa;
	border: 1px solid #e0e0e2;
	font-size: 14px;
	font-size: 1rem;
	line-height: 24px;
	color: #231f20;
	outline: none;
	text-align:center;
	margin-bottom: .4em;
}
input:focus {
	border:1px solid #0b46b2;
}

select {
	text-align-last:center;
	text-align:center;
	margin:1em 0;
	color:#0b46b2;
	font-weight:bold;
	background: url(../img/select.svg) no-repeat 1em #fffefa;
}

option {
	text-align:center;
}

button, .button {
	font-family: Dana;
	font-weight:bold;
	width:100%;
	cursor:pointer;
	padding: 9px 12px;
	border-radius: .75rem;
	background-color: #898989;
	border: 1px solid #898989;
	font-size: 14px;
	font-size: 1rem;
	line-height: 24px;
	color: #fffefa;
	outline: none;
	text-align:center;
	margin: .4em 0;
	display:block;
 
}

.pay {
	background-color:#0b46b2;
	border:1px solid #0b46b2;
}

.continue {
	background-color:#0b46b2;
	border:1px solid #0b46b2;
}

.continue:hover {
	background-color:#2c58a8;
	border-color:#2c58a8;
}

.continue.website {
	background-color:#fffee9;
	border:1px solid #fffee9;
	color:#0b46b2 !important;
}

.continue.website svg {
	fill:#0b46b2;	
}

.continue.website:hover {
	background-color:#F5F4DF;
	border:1px solid #F5F4DF;
}

.continue.disabled {
	background-color: #898989;
	border: 1px solid #898989;
}

.continue.disabled.soon {
	background-color:#c85a4b;
	border: 1px solid #c85a4b;
	opacity:1;
	animation: blinker 1s infinite;
 }
   
 @keyframes blinker {
	 from { opacity: 1.0; }
	 50% { opacity: 0.5; }
	 to { opacity: 1.0; }
 }

button:active {
	background-color: #231f20;
	border: 1px solid #231f20;
	transition:background-color .3s ease-in-out;
}

button i, .button i {
	margin:0 .3em;
}

.button {
	display:block;
	text-decoration:none;
}

.cancel {
	background-color:#898989;
	border:1px solid #898989;
}

.half {
	width:48.1%;
	margin-left:1.85%;
	display:inline-block;
}

.half:last-child {
	margin-left:0;
}

h3 {
	font-weight:bold;
	text-align:right;
	font-size:.8em;
}
.notice {
	margin-top:1em;
	display: block;
	text-align: center;
	margin-bottom: 1rem;
}
.notice i {
	color: #0b46b2;
	margin-left:.3em;
}
ul {
	direction:rtl;
	margin:.5em 0;
	font-size:.85em;
	list-style: initial;
	list-style-position: inherit;
	list-style-image: url('../img/bullet.svg');
	padding-right:1.21em;
}

ul li {
	text-align:right;
	margin-bottom:.5em;
}

h4 {
	font-weight: bold;
	color: #0b46b2;
	text-align: right;
	font-size: .75em;
	margin: .5em 0;
	background: #fffefa;
	padding: 1em;
	border: 1px solid #e0e0e2;
	border-radius: .75rem;
}

.error-c {
	text-align:center;
}

.mmbdhp {
	display:flex;
	justify-content: center;
	padding: 0 1rem 1rem 1rem;
}

.footer {
	padding-top:2em;
	padding-bottom:1rem;
	display:flex;
	flex-direction: row-reverse;
}

a, .footer a {
	color: #0b46b2;
}

a:hover, .footer a:hover {
	color:#231f20;
}

.support {
	direction:rtl;
	font-size:.8em;
}

.support-wrapper a {
}

.support img {
	display: block;
	float: right;
	max-width: 3.7em;
	border-left: 1px solid #0b46b2;
	padding-left: .8em;
	margin-left: 1em;
}

.support span {
	display:block;
	text-align:right;
}

.copyright span {
	display:block;
	font-size:.7em;
	line-height: 1.5em;
	color: #231f20;
	direction:ltr;
	text-transform:uppercase;
}

.copyright img {
	max-width:2em;
	float:left;
	margin-right:1em;
}

.copyright a {
	color:#231f20;
}

@media ( max-width : 768px ) {
	
	.footer {
		flex-direction:column-reverse;
	}
	
	.copyright {
		margin-top:2em;
	}
	
	.support-wrapper {
		max-width: 23em;
		margin:0 auto;
	}
	
	.copyright-wrapper {
		max-width: 19em;
		margin:0 auto;
	}
}

.form {
	max-width: 400px;
	margin:0 auto;
}

.form form {
	text-align:center;
}

.form span, .checkout span {
	display:block;
	text-align:center;
	font-size:.95em;
}

.form .email {
	margin:.5em 0;
	color:#0b46b2;
}

.verification {
	letter-spacing: 10px;
	margin-top:1em;
}

.amount, .amount-a, .amount-b {
	display:inline-block !important;
	font-size:1.1em !important;
}

.amount {
	font-weight:bold;
	color:#0b46b2;
}

.amount.warning {
	color:#af0c0c !important;
	border: 1px solid #af0c0c;
}
.amount-a {
	margin-right:.3em;
	margin-bottom:1em;
}
.amount-b {
	margin-top:.5em;
	margin-left:.5em;
}

.checkout .col {
	float:right;
}


.details {
	margin-top:1.5em;
	padding-left:1em;
}
.details:last-child {
	padding-left:0;
}

.details span {
	text-align:right !important;
	display:block;
}

.details .states {
	margin:.2em 0;
}
.details .city {
	margin:.2em 0 .4em 0;
}

.details img {
	max-width:1.8em;
	float: right;
	margin-left: 1em;
}

@media ( max-width : 768px ) {
	.details {
		padding-left:0;
	}
}

.shopper {
	margin-top:1em;
}
.shopper, .shopper-email {
	margin-bottom:1em;
}

.details .bold {
	font-size:1.2em;
	color: #0b46b2;
}

.details .details-address {
	margin-bottom:.5em;
	color: #0b46b2;
}

.details .total {
	margin-bottom:1em;
}

.details .details-notice {
	font-size:.8em;
}

.details .shetab {
	margin-top:.5em;
	margin-bottom:2em;
}

h5 {
	color: #0b46b2;
	font-size:1.2em;
	text-align:center;
}

h6 {
	text-align:center;
	font-size:.9em;
	margin-bottom: 1em
}
.barcode {
	display:block;
	margin:0 auto;
}
h7 {
	display:block;
	text-align:center;
	font-weight: bold;
}

.counter, .counter:focus {
	background:transparent;
	border:none;
	width:auto;
	padding:0;
	cursor:default;
}

.cancel-wrap i, div.notice.successful i {
	color: #0b46b2;
	display:block;
	font-size:3em;
	text-align:center;
}

.cancel-wrap a {
	font-weight:bold;
	color: #0b46b2;
}
.cancel-wrap a:hover {
	color:#231f20;
}

.mockup {
	width:100% !important;
	/* max-width:380px !important; */
	height:auto;
	border-radius:.75rem;
	margin-top:1rem;
}

.quant {
	max-width:250px !important;
	margin:1rem 0;
}
@media ( max-width : 768px ) {
}
.stats h7 {
	text-align:center;
	font-size:.8em;
	margin-top:.8em;
}

.stats .ranking {
	color:#0b46b2;
	font-size:1em;
}

.stats h8 {
	text-align:center;
	color:#0b46b2;
	font-weight:bold;
	font-size:1.3em;
	display:block;
	padding-bottom:.3em;
	margin-bottom:.3em;
	border-bottom:1px solid #d1d1d1;
}

.stats h8:last-child {
	border-bottom:0;
	padding:0;
}

.stats table {
	width:100%;
	border-collapse:collapse;
	margin:1em 0;
}

.stats table td {
	padding:.5em;
	text-align:center;
	border:1px solid #f2f2f2;
}

.stats table td:last-child {
	color:#0b46b2;
	font-size:1em;
	font-weight:bold;
}

.stats table tr:nth-child(odd) td:first-child,
.stats table tr:nth-child(odd) td:nth-child(2) {
	border-left:1px solid #eaeaea;
}
.stats table tr:nth-child(even){
	background-color: #eaeaea;
}
.mapael .map {
	position: relative;
	max-width:500px;
	margin:1em auto;
}
.mapael .mapTooltip {
	position: absolute;
	background-color: #231f20;
	font-size:.9em;
	padding:.5em;
	z-index: 1000;
	max-width: 200px;
	display: none;
	color: #0b46b2;
	text-align:center;
	font-weight:bold;
}
.mapael .mapTooltip span {
	font-weight:normal;
	display:block;
	color:#fffefa !important;
}
[data-id^="gulfofoman"],
[data-id^="straitofhormuz"],
[data-id^="persiangulf"],
[data-id^="caspiansea"],
[data-id^="lakeurmia"] {
	fill:#eaeaea;
	stroke:none;
}
		
[data-id^="lakeurmia"] {
	stroke:#fffefa;
}
[data-id^="lakeurmia"]:hover {
	stroke-width:0.5;
}
.pulse {
	display:inline-block;
	width:10px;
	height:10px;
	background:#0b46b2;
	border-radius:1em;
	margin-left:.4em;
	transform: scale(1);
	animation: pulse 1.5s infinite;
}
@keyframes pulse {
	0% {
		transform: scale(0.8);
		box-shadow: 0 0 0 0 rgba(177, 118, 88, 0.7);
	}

	70% {
		transform: scale(1);
		box-shadow: 0 0 0 10px rgba(255, 103, 167, 0);
	}

	100% {
		transform: scale(0.8);
		box-shadow: 0 0 0 0 rgba(255, 103, 167, 0);
	}
}
.live span {
	display:inline-block;
	font-size:.9em;
	margin-left:.5em;
	color:#231f20;
}
.live-count {
	color:#0b46b2 !important;
	display:inline-block;
}

.stats .half {
	border-bottom: 1px solid #d1d1d1;
}
.stats .signed {
	margin-left:0;
}
.half h8 {
	margin-bottom:.3em;
}

.ptr--box {
	padding:0 !important;
}

.ptr--text {
	margin-top: 0 !important;
	text-align: center;
}
.ptr--ptr {
	box-shadow:none !important;
}
.ptr--icon {
	text-align:center;
}

@keyframes ldio-au9qxmypov {
  0% { opacity: 1 }
  100% { opacity: 0 }
}
.ldio-au9qxmypov div {
  left: 48px;
  top: 24px;
  position: absolute;
  animation: ldio-au9qxmypov linear 0.7407407407407407s infinite;
  background: #231f20;
  width: 4px;
  height: 12px;
  border-radius: 0px / 0px;
  transform-origin: 2px 26px;
}.ldio-au9qxmypov div:nth-child(1) {
  transform: rotate(0deg);
  animation-delay: -0.6790123456790123s;
  background: #231f20;
}.ldio-au9qxmypov div:nth-child(2) {
  transform: rotate(30deg);
  animation-delay: -0.6172839506172838s;
  background: #231f20;
}.ldio-au9qxmypov div:nth-child(3) {
  transform: rotate(60deg);
  animation-delay: -0.5555555555555555s;
  background: #231f20;
}.ldio-au9qxmypov div:nth-child(4) {
  transform: rotate(90deg);
  animation-delay: -0.4938271604938271s;
  background: #231f20;
}.ldio-au9qxmypov div:nth-child(5) {
  transform: rotate(120deg);
  animation-delay: -0.4320987654320987s;
  background: #231f20;
}.ldio-au9qxmypov div:nth-child(6) {
  transform: rotate(150deg);
  animation-delay: -0.3703703703703703s;
  background: #231f20;
}.ldio-au9qxmypov div:nth-child(7) {
  transform: rotate(180deg);
  animation-delay: -0.3086419753086419s;
  background: #231f20;
}.ldio-au9qxmypov div:nth-child(8) {
  transform: rotate(210deg);
  animation-delay: -0.24691358024691354s;
  background: #231f20;
}.ldio-au9qxmypov div:nth-child(9) {
  transform: rotate(240deg);
  animation-delay: -0.18518518518518515s;
  background: #231f20;
}.ldio-au9qxmypov div:nth-child(10) {
  transform: rotate(270deg);
  animation-delay: -0.12345679012345677s;
  background: #231f20;
}.ldio-au9qxmypov div:nth-child(11) {
  transform: rotate(300deg);
  animation-delay: -0.061728395061728385s;
  background: #231f20;
}.ldio-au9qxmypov div:nth-child(12) {
  transform: rotate(330deg);
  animation-delay: 0s;
  background: #231f20;
}
.loadingio-spinner-spinner-h3ady7ev956 {
  width: 64px;
  height: 64px;
  display: inline-block;
  overflow: hidden;
  background: rgba(NaN, NaN, NaN, 0);
  transform: scale(.8) translateY(19px);
}
.ldio-au9qxmypov {
  width: 100%;
  height: 100%;
  position: relative;
  transform: translateZ(0) scale(0.64);
  backface-visibility: hidden;
  transform-origin: 0 0; /* see note above */
}
.ldio-au9qxmypov div { box-sizing: content-box; }

.ldio-fix div {animation:inherit !important;}
.countdown {text-align:center; color:#231f20; font-size:.8em; margin-bottom:1em; font-weight:bold;}

img.digital-cover {
	max-width:240px !important;
	border-radius:.75rem;
}

div.digital-form {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row-reverse;
	gap:.5rem;
}

div.digital-form div {
	flex:calc(50% - .5rem);
}

@media ( max-width : 768px ) {
div.digital-form div {
	flex:calc(100%);
}
}

form {
	max-width: 1024px;
	width: 100%;
	display: block;
	margin: 0 auto;
}

form label {
	display:block;
	margin-bottom:.25rem;
}

form label.required:after {
content: '*';
color:#0b46b2;
padding-right: 0.25em;
}

.shetab {
	display: flex;
	flex-direction: row-reverse;
	justify-content: center;
	align-items: center;
	height: 6.5rem;
}

.shetab span {
	direction: rtl;
	font-size: .75rem;
	margin-left: 0.5rem;
}

.shetab svg {
height: 1.5rem;
fill: #339AFE;
}

.digital-pay, .policy {
	width:100%;
}

.policy {
	margin-top:1rem;	
}

.policy span.farsi {
	direction:rtl;
}

.policy span {
	display:block;
	font-size:.8rem;
	direction:ltr;
	text-align:center;
}

.digital-form #amount {
	color:#0b46b2;
	direction:ltr;
	font-weight:bold;
}

.digital-form span.ntl {
	font-weight:bold;
	font-size:.9rem;
	display:block;
}

.digital-form span.errorMsg {
	display:block;
	font-size:.8rem;
	color:#af0c0c;
}
.digital-pay button {
	background-color:#0b46b2;
	border-color:#0b46b2;
	margin-top:1.5rem;
	cursor:pointer;
}

.digital-pay button:hover {
	background-color:#2c58a8;
	border-color:#2c58a8;
}

.digital-form span.donate {
	font-size:.8rem;
	display:block;
}

button.submit:disabled, button.submit:disabled:hover {
cursor: not-allowed;
background-color:#d1d1d1;
border-color:#d1d1d1;
}

div.notice.successful span {
	font-weight:bold;
	display:block;
	margin:0 auto;
	text-align:center;
}

div.barcode-digital {
	text-align:center;
	margin-top:1rem;
}

div.barcode-digital span {
	display: block;
	text-align: center;
}

div.barcode-digital h2 {
	font-size: 1rem;
	margin-top: 1rem;
}

div.landing button {
	display:flex;
	justify-content: center;
	align-items: center;
}

div.landing button svg {
	fill:#ffffff;
	margin-left:.5rem;
}

div.digital-stores {
	width:100%;
	grid-template-columns: repeat(4, 1fr);
	display: grid;
	align-items: center;
	/* grid-gap: 1rem; */
	direction:ltr;
	margin:1rem 0;
}

div.digital-stores div {
	margin:0 .9rem;
}

div.digital-stores div:first-child {
	margin-left:0;
}

div.digital-stores div:last-child {
	margin-right:0;
}

@media ( max-width : 768px ) {
div.digital-stores div {
	margin:0 .5rem;
}	
}

@media ( max-width : 460px ) {
div.digital-stores {
	grid-template-columns: repeat(2, 1fr);
	grid-gap: .75rem;
}

div.digital-stores div {
	margin:0;
}
}

div.digital-stores div a {
	background-color: #0b46b2;
	border-radius: .75rem;
	display: flex;
	height: 2.75rem;
	align-items: center;
	padding: 1rem;
}

div.digital-stores div a.apple-music {
	padding-bottom: 1.2rem;
}

div.digital-stores div a img {
	width:100%;
	height:auto;
	max-height: 1.3rem;
}

div.location-alert {
	width:100%;
	display:flex;
	justify-content: center;
	align-items: center;
	z-index:9999;
	background-color:rgba(255,255,255,.5);
	border-radius:.75rem;
	padding:1rem;
	margin-top:1rem;
}

div.location-alert .location-body {
	/* max-width:560px; */
}

div.location-alert .location-body svg {
	display:block;
	margin:0 auto .5rem auto;
	width:1.5rem;
	height:auto;
	fill:#0b46b2;
}

div.location-alert .location-body span {
	display:block;
	text-align:center;
	direction:rtl;
	text-transform:uppercase;
	font-size:.8rem;
}

div.location-alert .location-body span.country {
	font-size:1rem !important;
	margin-bottom:0rem;
}

div.location-alert .location-body span img {
	width:1.1rem;
	height:auto;
	margin:0 .25rem;
}

div.location-alert .location-body .location-button {
	max-width:150px;
	background-color:#0b46b2;
	color:#fffefa;
	margin:1rem auto 0 auto;
	display:flex;
	justify-content: center;
	align-items: center;
}

div.location-alert .location-body .location-button i {
	margin-left:0;
}

div.location-alert .location-body .location-button:hover {
	background-color:#fffefa;
	color:#0b46b2;
}

button.disabled {
	cursor:not-allowed !important;
	opacity:.5;
}

a.alopeyk {
	display:flex;
	align-items: center;
	gap: .25rem;
	width:max-content;
	margin:1rem auto;
	text-decoration:none;
	color:#0b46b2;
}

a.alopeyk span {
	font-weight:bold;
	font-size:.8rem;
	padding-top:.25rem;
}

a.alopeyk svg {
	width:5rem;
	height:auto;
	fill:#0b46b2;
}

a.alopeyk:hover svg {
	fill:#000000;
}

a.alopeyk:hover span {
	color:#000000;
}

.swpp {
	padding:0 1rem;
}

.status-wrapper {
	display:block;
	width:100%;
	max-width:350px;
	background-color:#fffee9;
	padding:1rem;
	border-radius:.75rem;
	margin:1rem auto 0 auto;
}

.status {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	width:100%;
	height:.75rem;
	background-color:#e5e4d1;
	border-radius:3px;
	direction:ltr;
	margin:0 auto;
}

.status .sold {
	width:0;
	height:.75rem;
	background: #0b46b2;
	border-radius:3px;
	transition:width 1s ease-in-out;
}

span.sold-count {
	display:block;
	direction:rtl;
	text-align:center;
	color:#000000;
	font-size:.8rem;
	margin-top: 1rem;
	line-height: .5rem;
}

span.sold-count b {
	position:relative;
	padding:0 .5rem;
	color:#fffee9;
	background-color:#0b46b2;
	border-radius:6px;
	padding-top:2px;
	margin-left:.2rem;
}

span.sold-count b:before {
	content:'';
	position:absolute;
	width: 8px;
	height: 8px;
	top: 0.04rem;
	left: 50%;
	transform: rotate(45deg) translateX(-50%);
	z-index: 0;
	border-left: 5px solid #0b46b2;
	border-top: 5px solid #0b46b2;
}

.status-wrapper.last .status .sold {
	background: #c85a4b;
}

.status-wrapper.last span.sold-count b {
	background-color:#c85a4b;
}

.status-wrapper.last span.sold-count b:before {
	content:'';
	position:absolute;
	width: 8px;
	height: 8px;
	top: 0.04rem;
	left: 50%;
	transform: rotate(45deg) translateX(-50%);
	z-index: 0;
	border-left: 5px solid #c85a4b;
	border-top: 5px solid #c85a4b;
}