body {
	margin: 0;
	padding: 0;
	direction: rtl;
	background: #f5f6f9;
	font: normal 12px/18px YekiFaNum, tahoma;
	color: #47485b
}

body * {
	box-sizing: border-box
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0;
	padding: 0
}

li,
ol,
ul {
	margin: 0;
	padding: 0;
	list-style: none
}

.dir-ltr {
	direction: ltr;
}
.dir-rtl {
	direction: rtl;
}


button {
	border: none;
	margin: 0;
	padding: 0;
	font: normal 12px/18px YekiFaNum, tahoma;
	border-radius: 3px
}

input[type=number] {
	margin: 0;
	-webkit-appearance: textfield;
	-moz-appearance: textfield;
	-ms-appearance: textfield;
	-o-appearance: textfield;
	appearance: textfield
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0
}

input[type=number]::-moz-inner-spin-button,
input[type=number]::-moz-outer-spin-button {
	-moz-appearance: none;
	margin: 0
}

input[type=number]::-ms-inner-spin-button,
input[type=number]::-ms-outer-spin-button {
	-ms-appearance: none;
	margin: 0
}

input[type=number]::-o-inner-spin-button,
input[type=number]::-o-outer-spin-button {
	-o-appearance: none;
	margin: 0
}

input[type=number]:focus {
	outline: 0
}

.app-container-float {
	position: relative;
	display: table;
	width: 100%;
	padding: 0 15px
}

#footer,
#header,
#main {
	position: fixed;
	width: 100%;
	left: 0;
	right: 0
}

#header {
	height: 50px;
	overflow: hidden;
	top: 0;
	z-index: 2;
	background: #e6ebf3
}

#header .app-container-float {
	padding-top: 5px;
	padding-bottom: 5px
}

#header .title {
	font-size: 20px;
	font-weight: 100;
	line-height: 42px
}

#header .title a {
	color: #47485b
}

#header .title a i {
	vertical-align: top;
	margin-left: 10px
}

#main {
	top: 50px;
	bottom: 65px;
	overflow: auto;
	z-index: 1
}

#main #section {
	position: relative;
	display: table;
	width: 100%;
	height: 100%
}

#main #section>div {
	opacity: 0;
	transform: scaleX(0);
	transition: all ease-out .3s
}

#main #section>div.active {
	transform: scaleX(1);
	opacity: 1
}

#main .section-home,
#main .section-code,
#main .section-final,
#main .section-history,
#main .section-phone-number {
	display: block;
	position: absolute;
	top: 50%;
	left: 50%;
	width: 380px;
	height: auto;
	margin-top: -100px;
	margin-left: -190px
}

#main .section-home.wait:after,
#main .section-code.wait:after,
#main .section-final.wait:after,
#main .section-history.wait:after,
#main .section-phone-number.wait:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 999;
	background: 0 0
}

#main .section-home .section-header,
#main .section-code .section-header,
#main .section-final .section-header,
#main .section-history .section-header,
#main .section-phone-number .section-header {
	display: table;
	width: 100%;
	text-align: center
}

#main .section-home .section-header .section-logo,
#main .section-code .section-header .section-logo,
#main .section-final .section-header .section-logo,
#main .section-history .section-header .section-logo,
#main .section-phone-number .section-header .section-logo {
	width: 74px;
	height: 74px;
	border-radius: 50%;
	background: #fff;
	overflow: hidden;
	border: 1px solid #fff;
	position: relative;
	margin: 0 auto
}

#main .section-home .section-header .section-logo .section-logo-inbox,
#main .section-code .section-header .section-logo .section-logo-inbox,
#main .section-final .section-header .section-logo .section-logo-inbox,
#main .section-history .section-header .section-logo .section-logo-inbox,
#main .section-phone-number .section-header .section-logo .section-logo-inbox {
	position: absolute;
	width: 58px;
	height: 58px;
	top: 50%;
	left: 50%;
	margin: -29px 0 0 -29px;
	border-radius: 50%;
	overflow: hidden;
	z-index: 2
}

#main .section-home .section-header .section-logo .section-logo-inbox:before,
#main .section-code .section-header .section-logo .section-logo-inbox:before,
#main .section-final .section-header .section-logo .section-logo-inbox:before,
#main .section-history .section-header .section-logo .section-logo-inbox:before,
#main .section-phone-number .section-header .section-logo .section-logo-inbox:before {
	content: "";
	position: absolute;
	width: inherit;
	height: inherit;
	top: 0;
	right: 5px;
	border-radius: 50%
}

#main .section-home .section-header .section-logo .section-logo-inbox.red-style,
#main .section-code .section-header .section-logo .section-logo-inbox.red-style,
#main .section-final .section-header .section-logo .section-logo-inbox.red-style,
#main .section-history .section-header .section-logo .section-logo-inbox.red-style,
#main .section-phone-number .section-header .section-logo .section-logo-inbox.red-style {
	background: #ab3e60
}

#main .section-home .section-header .section-logo .section-logo-inbox.red-style:before,
#main .section-code .section-header .section-logo .section-logo-inbox.red-style:before,
#main .section-final .section-header .section-logo .section-logo-inbox.red-style:before,
#main .section-history .section-header .section-logo .section-logo-inbox.red-style:before,
#main .section-phone-number .section-header .section-logo .section-logo-inbox.red-style:before {
	background: #c24468
}

#main .section-home .section-header .section-logo .section-logo-inbox img,
#main .section-code .section-header .section-logo .section-logo-inbox img,
#main .section-final .section-header .section-logo .section-logo-inbox img,
#main .section-history .section-header .section-logo .section-logo-inbox img,
#main .section-phone-number .section-header .section-logo .section-logo-inbox img {
	width: 34px;
	height: 34px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -17px 0 0 -17px
}

#main .section-home .section-header .section-logo .preloader-wrapper,
#main .section-code .section-header .section-logo .preloader-wrapper,
#main .section-final .section-header .section-logo .preloader-wrapper,
#main .section-history .section-header .section-logo .preloader-wrapper,
#main .section-phone-number .section-header .section-logo .preloader-wrapper {
	position: absolute;
	top: 5px;
	left: 4px;
	z-index: 0;
	-webkit-transition: opacity ease-out .3s;
	-moz-transition: opacity ease-out .3s;
	-ms-transition: opacity ease-out .3s;
	-o-transition: opacity ease-out .3s;
	transition: opacity ease-out .3s;
	-webkit-opacity: 0;
	-moz-opacity: 0;
	-ms-opacity: 0;
	-o-opacity: 0;
	opacity: 0;
	-webkit-filter: blur(3px);
	-moz-filter: blur(3px);
	-ms-filter: blur(3px);
	-o-filter: blur(3px);
	filter: blur(3px)
}

#main .section-home.wait .section-header .section-logo .preloader-wrapper,
#main .section-code.wait .section-header .section-logo .preloader-wrapper,
#main .section-final.wait .section-header .section-logo .preloader-wrapper,
#main .section-history.wait .section-header .section-logo .preloader-wrapper,
#main .section-phone-number.wait .section-header .section-logo .preloader-wrapper {
	-webkit-opacity: 1;
	-moz-opacity: 1;
	-ms-opacity: 1;
	-o-opacity: 1;
	opacity: 1
}

#main .section-home .section-header .section-subtitle,
#main .section-code .section-header .section-subtitle,
#main .section-final .section-header .section-subtitle,
#main .section-history .section-header .section-subtitle,
#main .section-phone-number .section-header .section-subtitle {
	font-size: 18px;
	display: table;
	width: 100%;
	padding: 5px 0
}

#main .section-code .section-header .section-subtitle,
#main .section-final .section-header .section-subtitle,
#main .section-phone-number .section-header .section-subtitle {
	padding: 10px 0 5px
}

#main .section-history .section-header .section-subtitle em {
	font-style: normal;
	color: #015eff
}

#main .section-home .section-header .section-title,
#main .section-history .section-header .section-title {
	font-size: 20px;
	display: table;
	width: 100%;
	padding: 5px 0;
	font-weight: 700
}

#main .section-home .section-main .section-title {
	font-size: 20px;
	display: table;
	width: 100%;
	padding: 25px 0 5px 0;
	font-weight: 700
}

#main .section-code .section-main #main .section-final .section-main,
#main .section-history .section-main,
#main .section-phone-number .section-main {
	display: table;
	width: 100%;
	padding: 10px 0 5px;
	-webkit-transition: -webkit-filter ease-out .1s;
	-moz-transition: -moz-filter ease-out .1s;
	-ms-transition: -ms-filter ease-out .1s;
	-o-transition: -o-filter ease-out .1s;
	transition: filter ease-out .1s
}

#main .section-code.wait .section-main,
#main .section-final.wait .section-main,
#main .section-history.wait .section-main,
#main .section-phone-number.wait .section-main {
	-webkit-filter: blur(5px);
	-moz-filter: blur(5px);
	-ms-filter: blur(5px);
	-o-filter: blur(5px);
	filter: blur(5px)
}

#main .section-history .section-main ul {
	display: table;
	width: 100%
}

#main .section-history .section-main ul li {
	display: table;
	width: 100%;
	height: 80px;
	margin-bottom: 10px
}

#main .section-history .section-main ul li button {
	position: relative;
	width: inherit;
	height: inherit;
	border-radius: 10px;
	background: #fff;
	border: 1px solid #fff;
	box-shadow: 3px 3px 5px rgba(0, 0, 0, .1);
	text-align: right;
	padding: 0 86px 0 50px
}

#main .section-history .section-main ul li button:hover {
	background: #edf4ff;
	border: 1px solid #6379c7
}

#main .section-history .section-main ul li button img {
	position: absolute;
	top: 50%;
	right: 20px;
	margin-top: -25px;
	width: 46px;
	height: 50px;
	border-radius: 5px
}

#main .section-history .section-main ul li button .add-account-icon {
	position: absolute;
	top: 50%;
	right: 20px;
	margin-top: -25px;
	width: 46px;
	height: 50px;
	border-radius: 5px;
	background: #015eff;
	color: #fff;
	line-height: 50px;
	font-size: 20px;
	text-align: center
}

#main .section-history .section-main ul li button .account-name {
	font-size: 16px;
	font-weight: 700;
	display: block;
	width: 100%;
	height: 20px;
	line-height: 20px;
	margin-top: -5px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis
}

#main .section-history .section-main ul li button .add-account-title {
	font-size: 16px;
	font-weight: 700;
	display: block;
	width: 100%;
	height: 20px;
	line-height: 20px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis
}

#main .section-history .section-main ul li button .account-number {
	font-size: 14px;
	font-weight: 100;
	display: block;
	width: 100%;
	height: 20px;
	line-height: 20px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis
}

#main .section-history .section-main ul li button .account-arrow {
	position: absolute;
	top: 50%;
	left: 20px;
	font-size: 20px;
	height: 20px;
	margin-top: -10px;
	overflow: hidden;
	color: #015eff;
	-webkit-opacity: 0;
	-moz-opacity: 0;
	-ms-opacity: 0;
	-o-opacity: 0;
	opacity: 0;
	-webkit-transition: opacity ease-out .3s;
	-moz-transition: opacity ease-out .3s;
	-ms-transition: opacity ease-out .3s;
	-o-transition: opacity ease-out .3s;
	transition: opacity ease-out .3s
}

#main .section-history .section-main ul li button:hover .account-arrow {
	-webkit-opacity: 1;
	-moz-opacity: 1;
	-ms-opacity: 1;
	-o-opacity: 1;
	opacity: 1
}

#main .section-phone-number .section-main .section-number-stage {
	display: table;
	width: 100%;
	padding-top: 50px
}

#main .section-phone-number .section-main .section-number-stage label {
	display: table;
	width: 100%;
	text-align: center;
	font-size: 16px;
	line-height: 25px;
	color: #47485b;
	cursor: pointer;
	padding-bottom: 20px
}

#main .section-phone-number .section-main .section-number-stage .input-wrapper {
	display: block;
	width: 100%;
	height: 64px;
	background: #fff;
	border-radius: 3px;
	overflow: hidden;
	position: relative
}

#main .section-phone-number .section-main .section-number-stage .input-wrapper .section-number-input {
	display: inline;
	float: right;
	width: calc(100% - 167px);
	height: 64px;
	border: none;
	background: 0 0;
	box-shadow: none;
	padding: 0 20px;
	letter-spacing: 10px;
	font: bold 24px/34px YekiFaNum, tahoma;
	direction: ltr;
	position: relative;
	z-index: 5
}

#main .section-phone-number .section-main .section-number-stage .input-wrapper:before {
	content: "09";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 105px;
	letter-spacing: 10px;
	font: bold 24px/64px YekiFaNum, tahoma;
	color: #47485b
}

#main .section-phone-number .section-main .section-number-stage .section-number-icon {
	position: absolute;
	top: 0;
	left: 0;
	width: 64px;
	bottom: 0;
	text-align: center;
	font-size: 30px;
	line-height: 64px
}

#main .section-home .section-main .section-logout,
#main .section-home .section-main .section-logout-ask,
#main .section-phone-number .section-main .section-number-stage-btn {
	display: table;
	width: 100%;
	padding: 10px 0 30px
}

#main .section-home .section-main .section-logout button,
#main .section-phone-number .section-main .section-number-stage-btn button {
	width: 100%;
	height: 64px;
	background: #015eff;
	color: #fff;
	font-size: 20px;
	font-weight: 700
}

#main .section-home .section-main .section-logout-ask .section-logout-btn,
#main .section-home .section-main .section-logout-ask .section-back-btn {
	width: 41%;
	height: 45px;
	margin-right: 6%;
	background: #015eff;
	color: #fff;
	font-size: 16px;
	line-height: 50px;
	font-weight: 700;
	border: none;
	border-radius: 3px;
	text-align: center;
}
#main .section-home .section-main .section-logout-ask .section-back-btn {
	background: gray;
}

#main .section-phone-number .section-main .section-number-stage-btn button[disabled] {
	background: #e2e2e6;
	color: #9d9d9d;
	cursor: default
}

#main .section-code .section-main .section-code-stage {
	display: table;
	width: 100%;
	padding-top: 50px
}

#main .section-code .section-main .section-code-stage .section-code-init,
#main .section-code .section-main .section-code-stage .section-code-number-currection {
	display: none
}

#main .section-code .section-main .section-code-stage .section-code-init.active,
#main .section-code .section-main .section-code-stage .section-code-number-currection.active {
	display: block
}

#main .section-code .section-main .section-code-stage .section-code-counter {
	font-size: 32px;
	line-height: 52px;
	font-weight: 700;
	text-align: center;
	display: table;
	width: 100%
}

#main .section-code .section-main .section-code-stage label {
	display: table;
	width: 100%;
	text-align: center;
	font-size: 16px;
	line-height: 25px;
	color: #47485b;
	cursor: pointer;
	padding-bottom: 20px
}

#main .section-code .section-main .section-code-stage label em {
	font-style: normal;
	margin: 0 5px;
	font-weight: 700
}

#main .section-code .section-main .section-code-stage .input-wrapper {
	display: block;
	width: 100%;
	height: 64px;
	background: #fff;
	border-radius: 3px;
	overflow: hidden;
	position: relative
}

#main .section-code .section-main .section-code-stage .input-wrapper .section-code-input {
	display: block;
	width: calc(100% - 200px);
	height: 64px;
	margin: 0 auto;
	border: none;
	background: 0 0;
	box-shadow: none;
	padding: 0 20px;
	letter-spacing: 10px;
	font: bold 24px/34px YekiFaNum, tahoma;
	direction: ltr;
	text-align: center;
	position: relative;
	z-index: 5
}

#main .section-code .section-main .section-code-stage .input-wrapper.error {
	border: 1px solid red
}

#main .section-code .section-main .section-code-stage .input-wrapper.success {
	border: 1px solid #00d269
}

#main .section-code .section-main .section-code-stage .section-code-number-currection-title {
	display: table;
	width: 100%;
	text-align: center;
	font-size: 16px;
	line-height: 25px;
	color: #47485b;
	padding-bottom: 10px
}

#main .section-code .section-main .section-code-stage .section-code-number-currection-title em {
	font-style: normal;
	margin: 0 5px;
	font-weight: 700
}

#main .section-code .section-main .section-code-stage .section-code-number-currection-btn {
	display: table;
	width: 100%;
	position: relative;
	padding-bottom: 10px
}

#main .section-code .section-main .section-code-stage .section-code-number-currection-btn button {
	display: inline;
	float: right;
	width: 47%;
	height: 46px;
	background: #eaf0fb;
	color: #015eff;
	cursor: pointer;
	font-size: 16px
}

#main .section-code .section-main .section-code-stage .section-code-number-currection-btn button i {
	margin-left: 8px;
	padding-top: 4px;
	font-size: 18px;
	vertical-align: middle
}

#main .section-code .section-main .section-code-stage .section-code-number-currection-btn button:last-child {
	float: left
}

#main .section-code .section-main .section-code-stage .message-response {
	display: table;
	width: 100%;
	height: auto;
	line-height: 30px;
	text-align: center;
	font-size: 14px;
	color: transparent
}

#main .section-code .section-main .section-code-stage .message-response.error {
	color: red
}

#main .section-code .section-main .section-code-stage .message-response.success {
	color: #00d269
}

#main .section-code .section-main .section-code-stage-btn {
	display: table;
	width: 100%;
	padding: 10px 0 30px
}

#main .section-code .section-main .section-code-stage-btn button {
	width: 100%;
	height: 64px;
	background: #015eff;
	color: #fff;
	font-size: 20px;
	font-weight: 700
}

#main .section-code .section-main .section-code-stage-btn button[disabled] {
	background: #e2e2e6;
	color: #9d9d9d;
	cursor: default
}

#main .section-final .section-main .section-final-stage {
	display: table;
	font-size: 20px;
	font-weight: 700;
	width: 100%;
	height: 30px;
	line-height: 30px;
	padding: 80px 0;
	text-align: center
}

#main .section-final .section-main .section-final-stage i {
	vertical-align: sub;
	font-size: 25px
}

#main .section-code .section-footer,
#main .section-final .section-footer,
#main .section-history .section-footer,
#main .section-phone-number .section-footer {
	font-size: 16px;
	text-align: justify;
	line-height: 24px;
	-webkit-transition: -webkit-filter ease-out .1s;
	-moz-transition: -moz-filter ease-out .1s;
	-ms-transition: -ms-filter ease-out .1s;
	-o-transition: -o-filter ease-out .1s;
	transition: filter ease-out .1s
}

#main .section-code.wait .section-footer,
#main .section-final.wait .section-footer,
#main .section-history.wait .section-footer,
#main .section-phone-number.wait .section-footer {
	-webkit-filter: blur(5px);
	-moz-filter: blur(5px);
	-ms-filter: blur(5px);
	-o-filter: blur(5px);
	filter: blur(5px)
}

#main .section-code .section-footer a,
#main .section-final .section-footer a,
#main .section-history .section-footer a,
#main .section-phone-number .section-footer a {
	color: #0682ff
}

#main .section-code .section-footer a:hover,
#main .section-final .section-footer a:hover,
#main .section-history .section-footer a:hover,
#main .section-phone-number .section-footer a:hover {
	text-decoration: underline
}

#main .section-code .section-footer .section-faq,
#main .section-final .section-footer .section-faq,
#main .section-phone-number .section-footer .section-faq {
	display: table;
	width: 100%;
	padding-top: 15px;
	font-size: 14px;
	color: #4b4b4b
}

#main .section-container {
	display: table;
	position: relative;
	width: 100%
}

#footer {
	height: 65px;
	bottom: 0;
	overflow: visible;
	z-index: 2;
	background: #e6ebf3
}

#footer .app-container-float {
	padding-top: 5px;
	padding-bottom: 5px
}

#footer .translate-btn {
	display: inline;
	float: right
}

#footer .translate-btn button {
	padding: 0 25px 0 10px;
	margin: 5px 0;
	background: 0 0;
	height: 45px;
	font-size: 16px;
	font-weight: 100;
	position: relative;
	color: #47485b
}

#footer .translate-btn button:hover {
	background: #d5e1f3
}

#footer .translate-btn button:before {
	content: '';
	position: absolute;
	top: 50%;
	right: 10px;
	border-top: 5px solid #47485b;
	border-right: 4px solid transparent;
	border-bottom: 4px solid transparent;
	border-left: 4px solid transparent
}

#footer .translate-btn button i {
	margin-left: 10px;
	vertical-align: bottom;
	height: 20px;
	display: inline-block
}

#footer .law-btn {
	display: inline;
	float: left
}

#footer .law-btn ul {
	margin: 5px 0;
	height: 45px;
	font-size: 16px;
	font-weight: 100;
	position: relative
}

#footer .law-btn ul li {
	display: inline;
	float: right;
	padding: 0;
	height: inherit;
	margin-left: 10px
}

#footer .law-btn ul li:last-child {
	margin-left: 0
}

#footer .law-btn ul li a {
	display: block;
	color: #47485b;
	height: inherit;
	padding: 0 10px;
	border-radius: 3px;
	line-height: 45px
}

#footer .law-btn ul li a:hover {
	background: #d5e1f3
}






#main .section-home .section-main .section-account {
	position: relative;
	width: 100%;
	height: 80px;
	margin-top: 30px;
	margin-bottom: 10px;
	border-radius: 10px;
	background: #fff;
	border: 1px solid #fff;
	box-shadow: 3px 3px 5px rgba(0, 0, 0, .1);
	text-align: right;
	padding: 0 86px 0 50px
}

#main .section-home .section-main .section-account img {
	position: absolute;
	top: 50%;
	right: 20px;
	margin-top: -25px;
	width: 46px;
	height: 50px;
	border-radius: 5px
}

#main .section-home .section-main .section-account .account-name {
	font-size: 16px;
	font-weight: 700;
	display: block;
	width: 100%;
	height: 20px;
	line-height: 20px;
	margin-top: 20px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis
}


#main .section-home .section-main .section-account .account-number {
	font-size: 14px;
	font-weight: 100;
	display: block;
	width: 100%;
	height: 20px;
	line-height: 20px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis
}

#main .section-home .section-main.error {
	font-family: Consolas, Calibri, monospace;
	font-size: 14px;
	direction: ltr;
	color: #000;
}

#main .section-home .section-main.error .error-box {
	background-color: cornsilk;
	padding: 15px;
	border-radius: 5px;
	direction: ltr;
	margin-bottom: 10px;
}
#main .section-home .section-main.error .request-id {
	background-color: #40C4FF;
}
#main .section-home .section-main.error .message {
	background-color: #FF5252;
}
#main .section-home .section-main.error .description {
	background-color: #FDD835;
}

@media only screen and (max-width:400px) {

	#main .section-home,
	#main .section-code,
	#main .section-final,
	#main .section-history,
	#main .section-phone-number {
		width: 300px;
		margin-left: -150px
	}

	#main .section-phone-number .section-main .section-number-stage .input-wrapper .section-number-input {
		width: calc(100% - 120px);
		padding: 0 10px;
		letter-spacing: 5px
	}

	#main .section-phone-number .section-main .section-number-stage .input-wrapper:before {
		left: 76px;
		letter-spacing: 5px
	}
}