#codepredev {user-select: text;direction: ltr;border-radius: 10px;overflow: hidden;position: relative;width: 100%;margin: 1rem 0;padding: 0;top: 0;right: 0;left: 0;}#codepredev .code-section{z-index: 100;width: 100%;height: auto;position: absolute;background: #353541;direction: rtl;display: flex;flex-direction: row;align-content: flex-start;align-items: center;margin: 0;padding: 0.5rem 0.7rem;bottom: 0;right: 0;}#codepredev .code-section h2{text-align: right;color: #D9D9E3;font-size: 14px;font-weight: 400;}#codepredev pre {direction: ltr;width: 100%;text-align: left;overflow: auto;margin: 0;top: 0;right: 0;left: 0;}#codepredev .hedercode{z-index: 100;width: 100%;height: auto;position: absolute;background: #353541;display: flex;flex-direction: row;align-content: flex-start;align-items: center;margin: 0;padding: 0.2rem 0.3rem;top: 0;right: 0;left: 0;}#codepredev .hedercode div:nth-child(2){position: relative;width: 100%;text-align: right;color: #D9D9E3;font-size: 14px;font-weight: 400;}#codepredev .hedercode span:nth-child(1){top: 50%;transform: translateY(-50%);bottom: 0;right: 60px;position: absolute;width: 11px;height: 11px;border-radius: 50px;content: "‌";padding: 1px;background: #0CA07C;}#codepredev .hedercode span:nth-child(2){top: 50%;transform: translateY(-50%);bottom: 0;position: absolute;right: 48px;width: 11px;height: 11px;border-radius: 50px;content: "‌";padding: 1px;background: #E33242;}#codepredev .hedercode span:nth-child(3){top: 50%;transform: translateY(-50%);right: 36px;bottom: 0;position: absolute;width: 11px;height: 11px;border-radius: 50px;content: "‌";padding: 1px;background: #e90;}#codepredev .hedercode .icon {width: 30px;height: 30px;background-image: url("data:image/svg+xml, %3Csvg version='1.0' xmlns='http://www.w3.org/2000/svg' width='900.000000pt' height='900.000000pt' viewBox='0 0 900.000000 900.000000' preserveAspectRatio='xMidYMid meet'%3E%3Cg transform='translate(0.000000,900.000000) scale(0.100000,-0.100000)' fill='%23D9D9E3' stroke='none'%3E%3Cpath d='M6285 8750 c-38 -5 -106 -19 -150 -33 -44 -14 -93 -28 -110 -32 -32 -7 -135 -46 -200 -75 -129 -58 -170 -79 -265 -136 -58 -34 -125 -77 -149 -96 -25 -18 -63 -46 -85 -62 -127 -90 -321 -293 -434 -455 -203 -290 -348 -637 -380 -911 -21 -178 -23 -223 -16 -322 6 -85 10 -104 31 -129 25 -29 26 -29 131 -29 99 0 247 21 362 50 188 49 506 211 651 332 146 122 235 207 308 294 199 236 356 523 443 809 68 220 80 305 82 550 l1 207 -28 24 c-31 26 -59 28 -192 14z'/%3E%3Cpath d='M3695 7766 c-11 -8 -40 -20 -65 -27 -25 -7 -54 -18 -65 -25 -11 -7 -63 -27 -115 -44 -205 -69 -556 -261 -770 -422 -199 -151 -241 -187 -405 -352 -145 -145 -252 -269 -344 -396 -151 -211 -330 -518 -407 -699 -20 -48 -45 -100 -55 -118 -19 -31 -39 -85 -85 -233 -12 -41 -34 -106 -48 -145 -14 -38 -26 -80 -26 -92 0 -13 -13 -76 -29 -140 -34 -134 -54 -251 -76 -435 -21 -176 -21 -716 0 -882 36 -292 91 -552 154 -731 6 -16 29 -85 50 -151 22 -67 51 -143 64 -170 14 -27 40 -85 58 -129 17 -44 35 -84 39 -90 4 -5 41 -73 82 -150 109 -205 350 -563 515 -765 145 -176 395 -421 542 -530 26 -19 81 -60 122 -91 87 -66 250 -169 334 -214 33 -17 76 -40 95 -51 57 -34 411 -184 432 -184 11 0 29 -5 41 -12 23 -12 178 -56 312 -88 86 -20 146 -30 355 -60 311 -45 859 -11 928 57 22 22 22 27 22 258 0 251 -6 286 -49 300 -11 3 -65 1 -121 -5 -185 -19 -344 -11 -565 26 -49 8 -117 19 -150 24 -152 22 -456 130 -685 245 -86 43 -266 158 -440 282 -145 103 -460 442 -568 611 -90 141 -142 226 -142 233 0 4 -18 38 -39 76 -40 68 -124 268 -141 333 -5 19 -20 67 -34 105 -43 124 -71 243 -86 375 -5 41 -15 93 -21 115 -8 27 -12 133 -12 325 -1 236 2 295 16 346 9 34 17 81 17 105 0 123 117 512 219 729 163 345 372 626 659 888 178 164 354 278 516 337 38 14 51 25 62 51 12 28 14 164 14 787 0 525 -3 764 -11 786 -17 48 -56 64 -94 37z'/%3E%3Cpath d='M5734 6496 c-18 -14 -19 -31 -22 -343 -2 -249 1 -334 10 -353 7 -13 47 -45 88 -70 202 -122 480 -373 613 -552 83 -111 194 -296 235 -391 55 -129 120 -333 139 -442 25 -139 25 -478 0 -620 -49 -271 -200 -605 -367 -810 -79 -97 -230 -265 -238 -265 -4 0 -28 -20 -53 -44 -83 -79 -272 -211 -388 -271 -95 -49 -116 -65 -127 -92 -19 -43 -21 -1252 -3 -1286 27 -51 54 -49 187 12 59 27 133 60 164 74 63 28 285 160 363 215 178 126 292 220 398 326 122 121 242 257 305 345 95 133 272 416 272 436 0 5 27 66 59 135 128 270 226 634 253 940 24 276 9 628 -36 855 -8 39 -19 97 -26 130 -19 100 -136 435 -195 559 -30 64 -55 120 -55 124 0 7 -89 159 -154 262 -179 284 -447 564 -766 801 -149 111 -418 263 -558 315 -74 28 -73 28 -98 10z'/%3E%3Cpath d='M4355 6056 c-5 -2 -50 -9 -100 -16 -49 -7 -119 -19 -155 -28 -154 -36 -415 -155 -582 -264 -115 -76 -308 -248 -379 -339 -21 -26 -43 -50 -49 -54 -19 -12 -181 -259 -206 -315 -6 -14 -27 -59 -47 -100 -99 -207 -113 -280 -58 -309 13 -7 182 -11 504 -11 548 0 514 -5 553 82 53 119 204 307 323 402 143 114 334 209 452 226 39 6 76 13 81 16 12 8 355 7 368 -1 6 -4 39 -11 74 -16 71 -10 258 -89 346 -147 226 -149 403 -376 488 -628 28 -81 72 -340 72 -419 0 -46 5 -69 18 -85 18 -22 25 -23 173 -23 257 1 256 1 279 25 24 26 26 82 5 152 -8 27 -15 70 -15 96 0 143 -93 436 -216 680 -99 197 -190 330 -323 471 -209 222 -423 363 -744 493 -121 49 -169 62 -342 96 -55 11 -497 24 -520 16z'/%3E%3Cpath d='M3767 2612 c-10 -10 -17 -27 -17 -38 0 -48 113 -184 234 -283 154 -126 311 -210 486 -262 111 -33 120 -34 290 -34 169 0 179 1 290 34 251 73 436 189 617 386 87 96 102 119 103 157 0 61 -64 76 -140 32 -272 -157 -435 -225 -673 -279 -95 -22 -216 -28 -317 -16 -203 24 -503 139 -726 277 -77 48 -121 55 -147 26z'/%3E%3C/g%3E%3C/svg%3E ");background-repeat: no-repeat;background-size: contain;background-position: center center;}#codepredev .code-section .iconcopy{width: 20px;height: 20px;background-image: url("data:image/svg+xml;charset=UTF-8, %3csvg version='1.0' xmlns='http://www.w3.org/2000/svg' width='900.000000pt' height='900.000000pt' viewBox='0 0 900.000000 900.000000' preserveAspectRatio='xMidYMid meet'%3e%3cg transform='translate(0.000000,900.000000) scale(0.100000,-0.100000)' fill='%23D9D9E3' stroke='none'%3e%3cpath d='M2965 8695 c-146 -31 -275 -123 -357 -255 -47 -77 -59 -105 -74 -185 -21 -104 -21 -6016 0 -6120 23 -121 79 -223 165 -303 47 -44 135 -102 155 -102 8 0 17 -4 20 -9 3 -5 41 -17 83 -27 75 -18 162 -19 2233 -19 2373 0 2218 -4 2359 63 174 84 286 245 310 444 16 142 16 4299 -1 4316 -9 9 -213 12 -858 12 -887 0 -962 3 -1080 45 -147 53 -272 144 -367 268 -51 66 -132 221 -133 252 0 11 -7 42 -15 69 -13 42 -15 163 -15 792 0 408 -3 749 -6 758 -6 14 -118 16 -1183 15 -902 -1 -1190 -4 -1236 -14z'/%3e%3cpath d='M5920 8692 c-19 -9 -45 -32 -57 -51 l-23 -34 0 -678 c0 -663 0 -679 21 -731 33 -85 88 -149 160 -188 l64 -35 862 0 862 0 23 23 c21 21 23 31 22 115 -1 75 -6 102 -27 147 -50 110 -94 155 -366 379 -57 46 -108 89 -114 95 -7 6 -47 40 -91 76 -145 120 -255 211 -270 225 -10 9 -45 38 -145 120 -14 11 -41 34 -60 51 -20 16 -49 40 -66 53 -16 12 -46 37 -65 54 -19 18 -70 61 -114 97 -43 36 -102 84 -130 108 -123 104 -218 152 -351 178 -87 17 -92 17 -135 -4z'/%3e%3cpath d='M1509 7557 c-168 -58 -303 -187 -361 -347 -10 -25 -22 -90 -28 -145 -16 -146 -9 -6291 8 -6357 42 -173 181 -334 342 -396 112 -43 54 -42 2460 -42 2504 0 2364 -3 2496 61 92 44 206 158 250 249 59 122 65 162 62 395 l-3 210 -2135 5 c-1725 4 -2142 8 -2170 18 -98 37 -168 81 -235 147 -73 73 -110 136 -145 247 -19 62 -20 109 -20 3021 l0 2957 -227 0 c-210 -1 -233 -3 -294 -23z'/%3e%3c/g%3e%3c/svg%3e ");background-repeat: no-repeat;background-size: contain;background-position: center center;}#codepredev .code-section span{color: #d0d0e3;margin-right: 10px;font-size: 14px;font-weight: 400;}#codepredev code[class*="language-"]{width: 100%;display: inline-block;font-size: 1em;line-height: 1.6;}#codepredev code[class*=language-],pre[class*=language-]{width: 100%;font-family: IRANYekanX;,monospace;font-size:1em;text-align:left;white-space:pre;word-spacing:normal;word-break:normal;word-wrap:normal;line-height:1.5;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-hyphens:none;-moz-hyphens:none;-ms-hyphens:none;hyphens:none;font-size: 14px;font-weight: 500;}code[class*=language-] ::-moz-selection,code[class*=language-]::-moz-selection,pre[class*=language-] ::-moz-selection,pre[class*=language-]::-moz-selection{text-shadow:none;background:blue}#codepredev code[class*=language-] ::selection,#codepredev code[class*=language-]::selection,#codepredev pre[class*=language-] ::selection,pre[class*=language-]::selection{text-shadow:none;background:#000000}@media print{code[class*=language-],#codepredev pre[class*=language-]{text-shadow:none}}pre[class*=language-]{padding-top: 2rem;padding-left: .6rem;padding-right: 0.5rem;padding-bottom: 4rem;margin: 0; 0;overflow:auto}:not(pre)>code[class*=language-],pre[class*=language-]{color: #FFFFFF;width: 100%;background:#000000;}:not(pre)>code[class*=language-]{padding:.0em;border-radius:.3em;white-space:normal}#codepredev .token.cdata,.token.comment,.token.doctype,.token.prolog{color:#7A7A7A}#codepredev .token.punctuation{color:#FFFFFF}#codepredev .token.namespace{opacity:.7}#codepredev .token.boolean,#codepredev .token.constant,#codepredev .token.deleted,#codepredev .token.number,#codepredev .token.property,#codepredev .token.symbol,#codepredev .token.tag{color: #C34076}#codepredev .token.attr-name,#codepredev .token.builtin,.token.char,.token.inserted,.token.selector,.token.string{color: #0CA07C}#codepredev .language-css .token.string,#codepredev .style .token.string,#codepredev .token.entity,#codepredev .token.operator,#codepredev .token.url{color:#D29837;}#codepredev .token.atrule,#codepredev .token.attr-value,#codepredev .token.keyword{color:#3792C7}#codepredev .token.atrule,#codepredev .token.attr-value,#codepredev .token.keyworp{color:#3792C7}#codepredev .token.class-name,#codepredev .token.function{color:#E33242}#codepredev .token.important,#codepredev .token.regex,#codepredev .token.variable{color:#e90}#codepredev .token.bold,#codepredev .token.important{font-weight:700}#codepredev .token.italic{font-style:italic}

.word-login{
display: flex;
justify-content: center;
align-items: center;
width: 80rem;
max-width: 600px;
min-height: 100vh;
width: 100%;
padding: 1rem;
margin: 0 auto;
}
.word-login .logo{
width: auto;
height: 50px;
display: flex;
justify-content: center;
align-items: center;
margin: 0 auto;
}
.word-login .form-sib{
width: 100%;
}
.word-login #registration-form{
width: 100%;
}
.word-login .form-sib .form-sibjo{
border-radius: 10px;
box-shadow: 0px 0px 10px var(--bg-shadow-login);
border:  1px solid var(--bg-border-login);
margin-top: 2rem;
background: var(--bg-body-login);
padding: 1rem;
}
.word-login .form-sib .form-sibjo label{
font-size: 12px;
font-weight: bold;
color: var(--bg-label-login);
}
.word-login .form-sib .form-sibjo .sib-login{
margin-bottom: 0.5rem;
}
.word-login .form-sib .form-sibjo .sib-login .passwords{
display: flex;
}
.word-login .form-sib .form-sibjo .sib-login .passwords #pwd1{
margin-left: 5px;
}
.word-login .form-sib .form-sibjo .sib-login .passwords #pwd2{
margin-right: 5px;
}
.word-login .form-sib .form-sibjo .sib_password{
margin-top: 1rem;
margin-bottom: 1rem;
}
.word-login .form-sib .form-sibjo input[type="text"],.form-sib .form-sibjo input[type="password"],.form-sib .form-sibjo input[type="email"]{
text-align: start !important;
unicode-bidi: plaintext !important;
background: var(--bg-input);
padding: 1.2rem 0.4rem;
border-radius: 10px;
border: none;
font-size: 12px;
font-weight: bold;
color: var(--bg-label-login);
}
.word-login .form-sib .form-sibjo input{
margin-top: 0.7rem;
margin-bottom: 0.5rem;
}
.word-login .form-sib .form-sibjo input::placeholder {
color: var(--bg-label-login);
}
.word-login .OtpLoginForm{
float: left;
padding: 10px 0;
text-align: left;
color: #007aff;
font-size: 12px;
font-weight: 400;
}
.word-login .OtpLoginForm:hover{
color: #333;
}
.word-login .login_submit{
margin-top: 1.5rem;
}
.word-login .loginshow{
border-top: 1px solid var(--loginshow-login);
margin-top: 10px;
text-align: center;
padding-top: 10px;
font-size: 12px;
font-weight: bold;
}
.word-login .loginshow span{
text-align: center;
padding-right: 5px;
font-size: 12px;
font-weight: 500;
color: #007aff;
}
.word-login .form-sib .form-sibjo [type="submit"]{
position: relative;
top: 0;
left: 0;
background: #007aff;
font-family: IRANYekanX;
width: 100%;
height: 50px;
border: none;
color: #fff;
font-size: 14px;
font-weight: bold;
border-radius: 50px;
margin-top: 1rem;
margin-bottom: 0.2rem;
}
.word-login .form-sib label{
padding-top: 1rem;
margin-bottom: 0rem;
}
.word-login .loadingLogin{
display: none;
}
#loading{
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
background: rgba(0, 0, 0, 0.5);
z-index: 2000000008;
}
#loading svg {
-webkit-animation: loading-mini-rotate 2s linear infinite;
-moz-animation: loading-mini-rotate 2s linear infinite;
-o-animation: loading-mini-rotate 2s linear infinite;
animation: loading-mini-rotate 2s linear infinite;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
width: 50px;
height: 50px;
}
#loading .path {
stroke-dasharray: 90, 150;
stroke-dashoffset: 0;
stroke-width: 4;
stroke: #8B9096;
stroke-linecap: round;
-webkit-animation: loading-mini-dash 1.5s ease-in-out infinite;
-moz-animation: loading-mini-dash 1.5s ease-in-out infinite;
-o-animation: loading-mini-dash 1.5s ease-in-out infinite;
animation: loading-mini-dash 1.5s ease-in-out infinite;
}
#loading:before{
background: var(--loading);
left: 50%;
top: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
border-radius: 20px;
width: 90px;
height: 90px;
content: "";
position: fixed;
}
.loading-mini svg {
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
-webkit-animation: loading-mini-rotate 2s linear infinite;
-moz-animation: loading-mini-rotate 2s linear infinite;
-o-animation: loading-mini-rotate 2s linear infinite;
animation: loading-mini-rotate 2s linear infinite;
width: 25px;
height: 25px;
}
.loading-mini .path {
stroke-dasharray: 90, 150;
stroke-dashoffset: 0;
stroke-width: 5;
stroke: #fff;
stroke-linecap: round;
-webkit-animation: loading-mini-dash 1.5s ease-in-out infinite;
-moz-animation: loading-mini-dash 1.5s ease-in-out infinite;
-o-animation: loading-mini-dash 1.5s ease-in-out infinite;
animation: loading-mini-dash 1.5s ease-in-out infinite;
}
.logout .loading-logout svg {
-webkit-animation: loading-mini-rotate 2s linear infinite;
-moz-animation: loading-mini-rotate 2s linear infinite;
-o-animation: loading-mini-rotate 2s linear infinite;
animation: loading-mini-rotate 2s linear infinite;
position: relative;
width: 22px;
height: 22px;
}
.logout .loading-logout .path {
stroke-dasharray: 90, 150;
stroke-dashoffset: 0;
stroke-width: 4;
stroke: #8B9096;
stroke-linecap: round;
-webkit-animation: loading-mini-dash 1.5s ease-in-out infinite;
-moz-animation: loading-mini-dash 1.5s ease-in-out infinite;
-o-animation: loading-mini-dash 1.5s ease-in-out infinite;
animation: loading-mini-dash 1.5s ease-in-out infinite;
}
@-webkit-keyframes loading-mini-rotate {
to {
-webkit-transform: rotate(1turn);
transform: rotate(1turn);
}
}
@-moz-keyframes loading-mini-rotate {
to {
-moz-transform: rotate(1turn);
transform: rotate(1turn);
}
}
@-o-keyframes loading-mini-rotate {
to {
-o-transform: rotate(1turn);
transform: rotate(1turn);
}
}
@keyframes loading-mini-rotate {
to {
-webkit-transform: rotate(1turn);
-moz-transform: rotate(1turn);
-o-transform: rotate(1turn);
transform: rotate(1turn);
}
}
@-webkit-keyframes loading-mini-dash {
0% {
stroke-dasharray: 1, 200;
stroke-dashoffset: 0;
}
50% {
stroke-dasharray: 90, 150;
stroke-dashoffset: -40px;
}
to {
stroke-dasharray: 90, 150;
stroke-dashoffset: -120px;
}
}
@-moz-keyframes loading-mini-dash {
0% {
stroke-dasharray: 1, 200;
stroke-dashoffset: 0;
}
50% {
stroke-dasharray: 90, 150;
stroke-dashoffset: -40px;
}
to {
stroke-dasharray: 90, 150;
stroke-dashoffset: -120px;
}
}
@-o-keyframes loading-mini-dash {
0% {
stroke-dasharray: 1, 200;
stroke-dashoffset: 0;
}
50% {
stroke-dasharray: 90, 150;
stroke-dashoffset: -40px;
}
to {
stroke-dasharray: 90, 150;
stroke-dashoffset: -120px;
}
}
@keyframes loading-mini-dash {
0% {
stroke-dasharray: 1, 200;
stroke-dashoffset: 0;
}
50% {
stroke-dasharray: 90, 150;
stroke-dashoffset: -40px;
}
to {
stroke-dasharray: 90, 150;
stroke-dashoffset: -120px;
}
}
.word-login #errorregistermessage,#registersuccess{
margin-top: 10px;
}
.word-login #errorregistermessage .errorregister-message{
opacity: 0;
border-right: 2px solid #D8000C;
animation: anslogins 1s forwards;
padding: 10px 5px;
border-radius: 5px;
color: #D8000C;
font-size: 12px;
font-weight: 500;
text-align: right;
justify-content: center;
background: #FF4342;
color: white;
}
.word-login #registersuccess .success-register{
opacity: 0;
border-right: 2px solid #270;
animation: anslogins 1s forwards;
padding: 10px 5px;
border-radius: 5px;
color: #D8000C;
font-size: 12px;
font-weight: 500;
text-align: right;
background: #00B96D;
color: white;
}
.word-login .hidden {
display: none;
}
.word-login .fade-in {
opacity: 0;
animation: anslogins 1s forwards;
}
@keyframes anslogins {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
.word-login #message-login-error,#successlogin{
margin-bottom: 10px;
}
.word-login #message-login-error #erroelogins{
border-right: 2px solid #D8000C;
opacity: 0;
animation: anslogins 1s forwards;
padding: 10px 5px;
border-radius: 5px;
color: #D8000C;
font-size: 12px;
font-weight: 500;
text-align: right;
justify-content: center;
background: #FF4342;
color: white;
}
.word-login #message-login-error strong{
font-size: 14px;
font-weight: bold
color: #fff;
}
.word-login #successlogin #successlogins{
opacity: 0;
animation: anslogins 1s forwards;
border-right: 2px solid #270;
padding: 10px 5px;
border-radius: 5px;
color: #D8000C;
font-size: 12px;
font-weight: 500;
text-align: right;
background: #00B96D;
color: white;
}
.home-login-sibjo a{
top: 20px;
right: 20px;
width: auto;
position: absolute;
z-index: 10;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
text-decoration: none;
}
.home-login-sibjo a svg{
fill:var(--lg-color);
padding: 2px;
margin-left: 5px;
width: 35px;
}
.home-login-sibjo a:hover svg{
background: var(--bg-input);
border-radius: 50%;
}
.home-login-sibjo a span{
text-decoration: none;
color: var(--lg-color);
font-size: 14px;
font-weight: 500;
}
.otp-login h3{
display: block;
font-size: 14px;
font-weight: bold;
text-align: center;
}
.otp-login p{
font-size: 12px;
font-weight: 500;
text-align: center;
padding-bottom: 15px;
padding-top: 8px;
}
#custom-login-form #username_or_email{
text-align: start !important;
unicode-bidi: plaintext !important;
background: var(--bg-input);
padding: 1.2rem 0.4rem;
border-radius: 10px;
border: none;
font-size: 12px;
font-weight: bold;
color: var(--bg-label-login);
}
#custom-login-form #username_or_email::placeholder {
direction: rtl;
text-align: right;
}
.otp-login #username_otp_email{
text-align: start !important;
unicode-bidi: plaintext !important;
background: var(--bg-input);
padding: 1.2rem 0.4rem;
border-radius: 10px;
border: none;
font-size: 12px;
font-weight: bold;
color: var(--bg-label-login);
}
.otp-login .verification #otp{
background: var(--bg-input);
padding: 0.6rem 0.4rem;
border: none;
letter-spacing: 10px;
width: 100%;
font-size: 25px;
font-weight: 400;
color: var(--bg-label-login);
border-radius: 10px;
text-align: center;
margin-top: 0.8rem;
margin-bottom: 0.5rem;
}
.otp-login .verification #verify-otp{
position: relative;
top: 0;
left: 0;
background: #007aff;
font-family: IRANYekanX;
width: 100%;
height: 50px;
border: none;
color: #fff;
font-size: 14px;
font-weight: bold;
border-radius: 50px;
margin-top: 1rem;
margin-bottom: 0.2rem;
}
.otp-login .otp_submit{
margin-top: 1rem;;
text-align: center;
padding-top: 10px;
}
.otp-login .verification .otp-email-login{
margin-top: 5px;
display: flex;
}
.otp-login .verification .otp-email-login #timerotp{
font-family: IRANYekanX;
font-size: 11px;
font-weight: 500;
text-align: left;
color: #00B96D;
}
.otp-login .verification .otp-email-login #go-back{
font-family: IRANYekanX;
font-size: 11px;
font-weight: 500;
width: 100%;
text-align: left;
color: var(--bg-label-login);
}
.otp-login #otp-message #erroe{
opacity: 0;
border-right: 2px solid #D8000C;
animation: anslogins 1s forwards;
padding: 10px 5px;
border-radius: 5px;
color: #D8000C;
font-size: 12px;
font-weight: 500;
text-align: right;
justify-content: center;
background: #FF4342;
color: white;
}
.otp-login #otp-message #success{
opacity: 0;
border-right: 2px solid #270;
animation: anslogins 1s forwards;
padding: 10px 5px;
border-radius: 5px;
color: #D8000C;
font-size: 12px;
font-weight: 500;
text-align: right;
background: #00B96D;
color: white;
}

body.premium{background:#fff;padding: 1rem;top:0;opacity:1;visibility:visible}
.premium.add{background:#eee;padding: 1rem;top:0;opacity:1;visibility:visible;display: flex;
flex-direction: column;
min-height: 100dvh;
width: 100%;
position: relative;
z-index: 10;}
.premium.no{
padding: 0rem;top:0;opacity:1;
}
#field_27_18{
width: 100%;
color: #000;
}
#field_27_18 .gfield_radio{
width: 100%;
display: flex; justify-content: center;
}
#field_27_18 .gfsp_choice_ornament label {
padding: 0;
margin: 1.5rem 0;
width: 100%;
display: block;
text-align: center;
}
#field_27_18 .gfield_radio input[type="radio"] {
display: none;
width: 100%;
}
#field_27_18 .gfield_radio input[type="radio"]:checked + label#label_27_18_0 .o_label{
width: 100%;
transition: .1s ease;
background: rgba(58, 58, 228,0.1);
box-shadow: 0px 0px 15px rgba(58, 58, 228,0.2);
}
#field_27_18 .gfield_radio input[type="radio"]:checked + label#label_27_18_1 .o_label{
width: 100%;
transition: .1s ease;
background: #FDF0CD;
box-shadow: 0px 0px 15px #FDF0CD;
}
#field_27_18 .gfield_radio div{
width: 100%;
text-align: center;
}
#field_27_18 .o_label{
border-radius: 20px;
text-align: center;
width: 100%;
padding: 12px 5px;
margin: 0;
}
#field_27_18 .o_label .o_img_wr{
margin: 0;
text-align: center;
padding: 0;
width: 100%;
height: auto;
}
#field_27_18 .o_text{
margin-top: 10px;
width: 100%;
display: block;
text-align: center;
font-size: .9rem;
font-weight: bold;
color: #4D4D4D;
padding: 2px 5px;
}
#field_27_18 .gfsp_label_img{
width: 50px;
height: auto;
border-radius: 10px;
}
.premium #input_27_1 div{
margin: 0.4rem 0;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
}
.gform_title{
display: none;
}
.premium #field_27_1 legend.gform-field-label{
display: none;
}
.premium #field_27_1 .o_text:before{
background: transparent;
color: #000;
width: auto;
height: 100%;
border-radius: 0;
font-size: 12px;
font-weight: 400;
position: absolute;
top: 0px;
z-index: 9;
right: 0;
margin-right: 85px;
content: "";
border-right: 2px dashed #eee;
}
.premium #field_27_1 .o_img_wr:after{
background: linear-gradient(to top, #eee 50%, transparent 50%);
color: #fff;
width: 30px;
height: 30px;
border-radius: 50%;
margin-right: 70px;
font-size: 12px;
font-weight: 400;
position: absolute;
top: -20px;
z-index: 10;
right: 0;
content: "";
}
.premium #field_27_1 .o_img_wr:before{
background: linear-gradient(to bottom, #eee 50%, transparent 50%);
color: #fff;
width: 30px;
height: 30px;
border-radius: 50%;
margin-right: 70px;
font-size: 12px;
font-weight: 400;
position: absolute;
bottom: -20px;
z-index: 10;
right: 0;
content: "";
}
.premium #field_27_1 .o_text{
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
position: absolute;
height: 100%;
width: 100%;
padding-right: 100px;
font-weight: bold;
font-size: 13px;
}
.premium #field_27_1 #label_27_1_0 .o_text:after{
background: none;
border: 1px solid #007aff;
color: #007aff;
width: auto;
padding: .5rem 0.5rem;
border-radius: 5px;
margin-left: 10px;
font-size: 12px;
font-weight: 400;
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 0;
font-family: IRANYekanX;
content: "300,000 ریال";
}
.premium #field_27_1 #label_27_1_1 .o_text:after{
background: none;
border: 1px solid #007aff;
color: #007aff;
width: auto;
padding: .5rem 0.5rem;
border-radius: 5px;
margin-left: 10px;
font-size: 12px;
font-weight: 400;
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 0;
content: "800,000 ریال";
}
.premium #field_27_1 #label_27_1_2 .o_text:after{
background: none;
border: 1px solid #007aff;
color: #007aff;
width: auto;
padding: .5rem 0.5rem;
border-radius: 5px;
margin-left: 10px;
font-size: 12px;
font-weight: 400;
position: absolute;
top: 50%;
transform: translateY(-50%);
left: 0;
content: "1,400,000 ریال";
}
.premium #field_27_1 input[type="radio"] {
display: none;
}
.premium .ginput_container_singleproduct{
display: none;
}
.premium #field_27_1 .gfsp_choice_ornament .gform-field-label {
display: block;
position: relative;
top: 0;
left: 0;
width: 100%;
border-radius: 10px;
border: 1px solid rgba(229.0, 229.0, 234.0, 1.0);
box-shadow: 2px 4px 12px #eee;
background: #fff;
border-radius: 15px;
padding: 0.7rem 0;
margin-top: 1rem;
}
.premium #field_27_1 .gfsp_label_img {
margin-right: 5px;
height: 30px;
width: auto;
}
.premium #field_27_1 :checked + .gform-field-label{
border: 1px solid #007aff;
position: relative;
backface-visibility: visible;
animation: navbar 1.5s ease-in 1;
background: rgba(0, 122, 255 ,0.1);
}
.premium #field_27_1 :checked + label .o_text:before{
border-right: 2px dashed #007aff;
}
.premium #field_27_1 :checked +  #label_27_1_0 .o_text:after{
background: #007aff;
color: #fff;
}
.premium #field_27_1 :checked +  #label_27_1_1 .o_text:after{
background: #007aff;
color: #fff;
}
.premium #field_27_1 :checked +  #label_27_1_2 .o_text:after{
background: #007aff;
color: #fff;
}
.premium #field_27_1 :checked +  #label_27_1_91 .o_text:after{
background: #007aff;
color: #fff;
}

.premium #field_27_8{
position: relative;
left: 0;
right: 0;
top: 0;
bottom: 0;
border-radius: 10px;
border: 1px solid rgba(229.0, 229.0, 234.0, 1.0);
box-shadow: 2px 4px 12px #eee;
padding: 1rem ;
background: white;
}

@keyframes navbar { 0% {transform: scale(1, 1)}10% {transform: scale(1.1, 0.9)}30% {transform: scale(0.9, 1.1)}50% {transform: scale(1.05, 0.95)}57% {transform: scale(1, 1)}64% {transform: scale(1, 1)}100% {transform: scale(1, 1)}} 

.premium #gf_coupon_spinner{
position: absolute;
top: 37%;
transform: translateY(-37%);
left: 0;
width: 20px;
height: 20px;
margin-left: 20px;
}
.premium #gf_coupon_spinner img{
width: 20px;
}
.premium #field_27_8 .gfield_label{
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
position: relative;
padding-right: 20px;
top: 0;
right: 0;
}
.premium #field_27_8 .gfield_label:after{
background: url("https://cdn.sibjo.ir/assets/img/premium/gift-code.svg") no-repeat center center;
background-size: cover;
color: #fff;
width: 25px;
height: 25px;
border-radius: 50%;
margin-right: -10px;
font-size: 12px;
font-weight: 400;
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 0;
content: "";
}
.premium #gf_coupon_code_27{
margin-top: 1.5rem;
background: #eee;
width: 100%;
}
.premium #field_27_8 #gf_coupon_button{
background: #007aff;
color: #fff;
width: 100%;
padding: .5rem 0.5rem;
border-radius: 5px;
margin-top: 15px;
font-size: 13px;
font-weight: 600;
left: 0;
}
.premium #gf_coupon_info{
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
border-bottom: none;
}
.premium #gf_coupon_info .gfield_validation_message {position: absolute;
padding: 5px 15px;
border-radius: 3px;
color: #fff;
margin: 0;
bottom: 10px;
right: 10px;
width: auto;
border: none;
font-size: 12px;
font-weight: 500;
border-right: 2px solid #D8000C;
animation: anslogins 1s forwards;
background: #FF4342;}

.premium  #gf_coupon_info .gf_coupon_item{
z-index: 1000;
border-bottom: none;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
position: fixed;
padding: 5px 20px;
opacity: 0;
width: auto;
height: 40px;
animation: anslogins 1s forwards;
padding: 10px 5px;
border-radius: 50px;
color: #D8000C;
font-size: 12px;
font-weight: 500;
text-align: right;
background: #00B96D;
color: white;
margin: 0;
top: 10px;
right: 10px;
}
.premium #field_27_6 {
position: relative;
top: 0;
left: 0;
background: #1CB561;
border-radius: 5px 0px 0px 5px;
border-right:  3px solid #26e574;
color: white;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
padding: 1rem 0.5rem;
margin: 0.5rem 0;
}
.premium #field_27_6 .gfield_label{
padding: 0;
margin: 0;
font-size: 12px;
color: white;
}
.premium #field_27_6 #input_27_6{
font-weight: bolder;
color: white;
font-size: 12px;
display: inline-block;
width: auto;
text-align: left;
position: absolute;
left: 0.5rem;
top: 50%;
transform: translateY(-50%);
background: transparent;
border: none;
padding: 0;
margin: 0;
}

.info_premium{
padding: 0 1rem;
}
.info_premium h3{
color: #000;
font-size: 15px;
font-weight: bold;
padding: 5px 0;
}
.info_premium span{
color: #666666;
font-size: 12px;
font-weight: 400;
padding: 0.4rem 11px;
display:  flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
}
.info_premium span b{
margin-left: 5px;
color: #FF4342;
}
.info_premium .ui-icon-check{
margin-left: 5px;
width: 15px;
height: auto;
fill: #007aff;
}
.info_premium section{
color: #000;
font-size: 14px;
font-weight: 500;
padding: 5px 0;
text-align: center;
}
.info_premium section strong{
color: #007aff;
font-size: 16px;
font-weight: bold;
padding: 5px 0;
}
.premium .premium-success{
margin: 1rem 0;
position: relative;
top: 0;
right: 0;
border-radius: 10px;
border: 1px solid rgba(229.0, 229.0, 234.0, 1.0);
box-shadow: 2px 4px 12px #eee;
background: white;
padding: 1rem;
text-align: center;
}
.premium-success .imgsnes{
text-align: center;
height: 100px;
margin-bottom: 1rem;
}
.premium .premium-success .o_img_wr:before{
background: white;
}
.premium .premium-success .o_img_wr:after{
background: white;
}
.premium .premium-success .usertxet{
padding-top: 10px;
font-size: 13px;
line-height: 1.8;
font-weight: 500;
color: #000;
}
.premium .premium-success .usertxet .username{
font-weight: bold;
color: #E5AB3E;
}
.premium .premium-success .ply-success{
margin: 0.4rem 0;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
width: 100%;
}
.premium .premium-success .ply-success .list{
color: #2C3436;
font-size: 14px;
font-weight: 400;
}
.premium .premium-success .ply-success .success{
border: solid 1px #32BCA2;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
border-radius: 5px;
padding: 5px 10px;
margin-right: auto;
background: #D9F4EF;
color: #32BCA2;
font-size: 12px;
font-weight: 400;
}
.premium .premium-success .ply-success .success .ui-icon-check{
width: 15px;
height: auto;
fill: #32BCA2;
margin-left: 5px;
}

.premium .premium-success #ply-success{
margin-top: 3rem;
position: relative;
top: 0;
left: 0;
width: 100%;
}

.premium .premium-success .ply-success .shanase{
color: #2F3437;
padding-left: 5px;
position: relative;
top: 0;
right: 0;
z-index: 1000;
background: white;
font-size: 13px;
font-weight: 500;
}
.premium .premium-success #ply-success:after{
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 0;
width: calc(100% - 20px);
text-align: center;
border-bottom: 1.5px solid #ddd;
content: "";
}
.premium .premium-success .ply-success .pay-username{
background: white;
padding-right: 5px;
z-index: 2;
margin-right: auto;
width: auto;
text-align: left;
color: #2C3436;
letter-spacing: 1px;
font-size: 13px;
font-weight: bold;
}
.premium .premium-success .ui-icon-checkns{
position: absolute;
left: 50%;
top: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
fill: #32BCA2;
opacity: 0.3;
width: calc(100% - 40%);
max-width: 300px;
}
.premium .addhome{
display: inline-block;
}
.premium .addhome div{
text-align: right;
width: auto;
margin: 0.9rem;
padding: 10px;
background: white;
border-radius: 5px;
border: 1px solid rgba(229.0, 229.0, 234.0, 1.0);
color: #2C3436;
font-size: 12px;
font-weight: bold;
box-shadow: 2px 4px 12px var(--by-eee);
}
.premium .ply-sjnew{
padding-top: 1rem;
margin-top: 3rem;
border-top: solid 1.5px var(--by-eee);
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
position: relative;
z-index: 100;
}
.premium .ply-sjnew div{
width: 50%;
}
.premium .ply-sjnew .pay-sj-m1{
color: #2D3335;
font-size: 15px;
font-weight: bold;
}
.premium .ply-sjnew .pay-sj-m1 .new{
padding: 5px 0;
font-size: 13px;
color: #6F787B;
font-weight: 500;
}
.premium .ply-sjnew .pay-sj-m1:nth-child(1){
border-left: 1.5px solid var(--by-eee);
}
.gform-loader{
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
background: rgba(0, 0, 0, 0.5);
z-index: 2000000008;
}
.gform-loader:after{
content: "";
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
margin: auto;
width: 35px;
height: 35px;
border: 3px solid transparent;
border-radius: 50%;
border-right-color: #8B9096;
animation: loadings-sibjo 0.8s linear infinite;
}
@keyframes loadings-sibjo {
from { transform: rotate(0); }
to { transform: rotate(360deg); } }
.gform-loader:before{
background: #E4E4ED;
left: 50%;
top: 50%;
border: 1px solid #ddd; box-shadow: 0px 0px 5px rgb(0 0 0 / 8%);
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
border-radius: 20px;
width: 90px;
height: 90px;
content: "";
position: fixed;
}

.list-pay-sibjo-premium{
padding: 1rem 0;
}
.list-pay-sibjo-premium .premium-show{
position: relative;
top: 0;
right: 0;
border-radius: 10px;
border: 1px solid var(--premium-br-bg);;
box-shadow: 2px 4px 12px var(--premium-sb-bg);
padding: 1rem;
background: var(--premium-by);
text-align: center;
}
.list-pay-sibjo-premium .premium-show .pay-premium-logo{
width: 200px;
height: auto;
}
.list-pay-sibjo-premium .premium-show .usertxet{
padding-top: 10px;
font-size: 13px;
line-height: 1.8;
font-weight: 500;
}
.list-pay-sibjo-premium .premium-show .usertxet .username{
font-weight: bold;
color: var(--premium-cdr);;
}
.list-pay-sibjo-premium h3{
font-size: 14px;
}
.list-pay-sibjo-premium .list-pay-premium{
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
margin-top: 1rem;
position: relative;
top: 0;
right: 0;
border-radius: 10px;
border: 1px solid rgba(0, 122, 255 ,0.9);
box-shadow: 2px 4px 12px rgba(0, 122, 255 ,0.1);
padding: 1rem;
background: rgba(0, 122, 255 ,0.3);
text-align: center;
}
.list-pay-sibjo-premium .list-pay-premium:after{
background: linear-gradient(to bottom, var(--premium-by) 50%, transparent 50%);
color: #fff;
width: 30px;
height: 30px;
border-radius: 50%;
margin-right: 80px;
font-size: 12px;
font-weight: 400;
position: absolute;
bottom: -20px;
z-index: 10;
right: 0;
content: "";
}
.list-pay-sibjo-premium .list-pay-premium:before{
background: linear-gradient(to top, var(--premium-by) 50%, transparent 50%);
color: #fff;
width: 30px;
height: 30px;
border-radius: 50%;
margin-right: 80px;
font-size: 12px;
font-weight: 400;
position: absolute;
top: -20px;
z-index: 10;
right: 0;
content: "";
}
.list-pay-sibjo-premium .list-pay-premium img{
width: auto;
height: 30px;
}
.list-pay-sibjo-premium .list-pay-premium .name{
font-size: 13px;
font-weight: bold;
color: #007aff;
margin-right: 35px;
}
.list-pay-sibjo-premium .list-pay-premium .name:before{
background: transparent;
color: #fff;
width: auto;
height: 100%;
border-radius: 0;
font-size: 12px;
font-weight: 400;
position: absolute;
top: 0px;
z-index: 9;
right: 0;
margin-right: 95px;
content: "";
border-right: 2px dashed #007aff;
}
.list-pay-sibjo-premium .list-pay-premium .namen{
background: #007aff;
color: #fff;
width: auto;
padding: .6rem 0.5rem;
border-radius: 5px;
font-size: 10px;
letter-spacing: 1px;
font-weight: bold;
margin-right: auto;
}
.pm-transaction{
margin: 1rem 0;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
width: 100%;
position: relative;
top: 0;
left: 0;
}
.pm-transaction:after{
background: #32BCA2;
position: absolute;
left: 50%;
top: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: calc(100% - 20px);
height: 2px;
content: "";
}
.pm-transaction #newtxet{
background: var(--background-body);
z-index: 1;
font-size: 16px;
padding-left: 4px;
}
.pm-transaction .left{
padding-right: 4px;
background: var(--background-body);
z-index: 1;
margin-right: auto;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
}
.pm-transaction .left div{
position: relative;
top: 0;
left: 0;
padding: 18px;
border-radius: 50%;
}
.pm-transaction .left span{
line-height: 1;
font-size: 13px;
font-weight: bold;
position: absolute;
left: 50%;
top: 50%;
-webkit-transform: translate(-50%, -50%);
-moz-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.pm-transaction .left .active{
position: relative;
top: 0;
left: 0;
background: #D9F4EF;
color: #32BCA2;
}
.pm-transaction .left .cancelled{
background: #F8E3E2;
color: #CB3536;
margin: 0 3px;
}
.pm-transaction .left .processing{
background: #FBEADA;
color: #D96C0D;
}
.list-pay-sibjo-premium .list-pay-new-premium{
position: relative;
top: 0;
right: 0;
}

.list-pay-sibjo-premium .list-pay-new-premium .list-pay-n-premium{
margin-top: 1rem;
position: relative;
top: 0;
right: 0;
border-radius: 10px;
border: 1px solid var(--premium-br-bg);;
box-shadow: 2px 4px 12px var(--premium-sb-bg);
padding: 1rem;
background: var(--premium-by);
text-align: center;
}
.list-pay-sibjo-premium .list-pay-new-premium .list-pay-n-premium .pay-news{
position: relative;
top: 0;
left: 0;
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
}
.list-pay-sibjo-premium .list-pay-new-premium .list-pay-n-premium .pay-news #pay{
color: var(--premium-cdr-new);
letter-spacing: 1px;
font-size: 14px;
font-weight: 400;
}
.list-pay-sibjo-premium .list-pay-new-premium .list-pay-n-premium .pay-news #pay span{
color: var(--premium-cdr-new);
padding: 2px 4px;
font-size: 9px;
margin-right: 5px;
border-radius: 5px;
letter-spacing: 0px;
top: 50%;
transform: translateY(-50%);
position: absolute;
background: var(--premium-sb-bg);
}
.list-pay-sibjo-premium .list-pay-new-premium .list-pay-n-premium .pay-news .success{
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
border-radius: 8px;
padding: 5px 10px;
margin-right: auto;
background: #D9F4EF;
color: #32BCA2;
font-size: 12.5px;
font-weight: 500;
}
.list-pay-sibjo-premium .list-pay-new-premium .list-pay-n-premium .pay-news .success .ui-icon-check{
width: 15px;
height: auto;
fill: #32BCA2;
margin-left: 5px;
}
.list-pay-sibjo-premium .list-pay-new-premium .list-pay-n-premium .pay-news .erre{
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
border-radius: 8px;
padding: 5px 10px;
margin-right: auto;
background: #F8E3E2;
color: #CB3536;
font-size: 12.5px;
font-weight: 500;
}
.list-pay-sibjo-premium .list-pay-new-premium .list-pay-n-premium .pay-news .erre .ui-icon-check{
width: 15px;
height: 15px;
fill: #CB3536;
margin-left: 5px;
}
.list-pay-sibjo-premium .list-pay-new-premium .list-pay-n-premium .pay-news .processing{
display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: center;
border-radius: 8px;
padding: 5px 10px;
margin-right: auto;
background: #FBEADA;
color: #D96C0D;
font-size: 12.5px;
font-weight: 500;
}
.list-pay-sibjo-premium .list-pay-new-premium .list-pay-n-premium .pay-news .processing .ui-icon-check{
width: 15px;
height: 15px;
fill: #D96C0D;
margin-left: 5px;
}
.list-pay-sibjo-premium .pay-news #right{
z-index: 2;
color: var(--premium-cdr);
padding-left: 5px;
position: relative;
top: 0;
right: 0;
z-index: 2;
background: var(--premium-by);
font-size: 13px;
font-weight: 500;
}
.list-pay-sibjo-premium .pay-news.r2ns:after{
position: absolute;
top: 50%;
transform: translateY(-50%);
right: 0;
width: calc(100% - 20px);
text-align: center;
border-bottom: 1.5px solid var(--by-eee);
content: "";
}
.list-pay-sibjo-premium .pay-news #left{
padding-right: 5px;
background: var(--premium-by);
z-index: 2;
margin-right: auto;
width: auto;
text-align: left;
color: var(--premium-erj);
letter-spacing: 1px;
font-size: 13px;
font-weight: bold;
}
.list-pay-sibjo-premium .pay-sj-list {
display: flex;
flex-direction: row;
justify-content: flex-start;
justify-content: center;
align-items: center;
margin-top: 2rem;
border-top: 1.5px solid var(--by-eee);
padding: 1rem;
}
.list-pay-sibjo-premium .pay-sj-list div{
width: 50%;
}
.list-pay-sibjo-premium .pay-sj-list #right .s1{
color: var(--premium-cdr-new);
font-size: 14px;
font-weight: bold;
direction:rtl;
}
.list-pay-sibjo-premium .pay-sj-list #right .s1 span{
color: var(--premium-cdr-new);
font-size: 12px;
font-weight: bold;
margin-right: 5px;
}
.list-pay-sibjo-premium .pay-sj-list #right .s2{
color: var(--premium-cdr-new);
font-size: 12px;
padding-top: 5px;
font-weight: 500;
}
.list-pay-sibjo-premium .pay-sj-list #right:nth-child(1){
border-left: 1.5px solid var(--premium-br-bg);
}
.list-pay-sibjo-premium .pay-sj-list #left .s1{
color: var(--premium-cdr-new);
font-size: 14px;
font-weight: bold;
}
.list-pay-sibjo-premium .pay-sj-list #left .s1 span{
color: var(--premium-cdr-new);
font-size: 10px;
font-weight: 500;
}
.list-pay-sibjo-premium .pay-sj-list #left .s2{
color: var(--premium-cdr-new);
font-size: 12px;
font-weight: 500;
padding-top: 5px;
}

@media only screen and (min-width: 600px) {
.premium .premium-tab{
width: 100%;
display: flex;
}
.premium .premium-tab .premium-success{
width: 80%;
margin-left: 0.5rem;
}
.premium .premium-tab .premium-success:nth-child(2){
width: 40%;
}
}

:root {
--lg-color: #333;
--bg-body: #fff;
--bg-input: #EEEEEE;
--bg-body-login: #fff;
--bg-label-login: #333;
--bg-shadow-login: #f4f4f4;
--bg-border-login: #EEEEEE;
--loginshow-login: #ddd;
--loading: #E4E4ED;
}