* {box-sizing:border-box; margin:0 auto; padding:0; outline:0; border:0 none; -webkit-overflow-scrolling:touch; -webkit-font-smoothing:none; font-smooth:never; font-style:normal; max-width:100%; font-family:'Assistant', sans-serif;}
html {font-size:20px; min-height:100vh; direction:rtl; scroll-behavior:smooth;}
body {text-align:center; font-family:'Assistant', sans-serif; color:#000; position:relative; min-height:100vh; line-height:1; font-size:0;}
*::-webkit-input-placeholder {color:#000;}
*::-moz-placeholder {color:#000;}
*:-ms-input-placeholder {color:#000;}
*::-moz-placeholder {color:#000;}
*:-moz-placeholder {color:#000;}
::-webkit-scrollbar {width:6px; height:6px;}
::-webkit-scrollbar-track {background:rgba(123,78,159,0.06);}
::-webkit-scrollbar-thumb {background:rgba(123,78,159,0.3);}
::-webkit-scrollbar-thumb:hover {background:rgba(123,78,159,0.6);}
.purple {color:#7b4e9f;}
.flex {display:flex; justify-content:space-between; align-items:center;}
.bg {display:table; position:relative; width:auto; margin:5vh auto 0;}
.btn {display:inline-block; cursor:pointer; position:absolute; right:7.77%; bottom:46.5%;}
.credit {display:inline-block; position:absolute; right:2.22%; bottom:12%; width:6%; height:12%;}
.form .purple {text-align:right;}
.msg h5 {font-size:1.5rem; color:#5f397c; padding:45px 0 15px;}
.msg h6 {font-size:1rem; padding:0 0 15px;}
.msg p {padding:0.6vh 0; font-size:1rem; white-space:nowrap;}
.msg label {margin:0;}
.msg .bus {margin:60px auto 30px; max-height:7.5vh;}
.fld input {font-size:inherit; padding:6px 9px; background:none; border:1px solid #7b4e9f; font-family:inherit; width:100%;}
.fld input#qty {max-width:calc(100% - 21vh); margin:0;}
.sbm {display:inline-block; background-color:#5f397c; color:#fff; font-size:1rem; cursor:pointer; padding:1.23vh 3.9vh; border-radius:1rem; margin:15px 0 0; width:100%; font-weight:bold;}
.close {font-size:1.5rem; display:inline-block; position:absolute; top:0; left:0; color:#c292c2; padding:6px 9px; cursor:pointer;}

@-moz-document url-prefix(){ /* firefox */
* {scrollbar-color:rgba(123,78,159,0.15) rgba(0,0,0,0.9); scrollbar-width:thin;}
}

@media (min-width:600px){
html {font-size:2.7vh;}
article.msg p {padding:0 0 24px;}
.mbl, .trigger:not(:checked) + .overlay, .hide {display:none !important;}
.bg img {max-height:90vh;}
.btn {display:inline-block; background-color:#fff; color:#5f397c; font-size:1rem; cursor:pointer; position:absolute; right:7.77%; bottom:51%; border:3px solid #7b4e9f; padding:1.23vh 3.9vh; border-radius:1rem;}
.btn:hover {background-color:#7b4e9f; color:#fff; border-color:#fff;}
.overlay {background:rgba(0,0,0,0.6); width:100%; height:100%; max-width:95.4%; position:absolute; top:0; left:2.22%; bottom:0; border-radius:15%;}
.overlay:before {content:' '; display:inline-block; background:inherit; position:absolute; top:30.66%; right:100%; width:2.65vh; height:8.13vh;}
.modal {display:block; position:absolute; top:0; left:0; bottom:0; width:100%; height:100vh;}
.msg {display:block; background:rgba(255,255,255,0.96); position:absolute; top:50%; left:50%; transform:translateX(-50%) translateY(-50%); padding:3vh; width:100%; max-width:48%; border:1px solid #c292c2;}
.msg.form {max-width:42%;}
}

@media (max-width:600px){
html {font-size:17px;}
.dsk, .hide {display:none !important;}
.msg {padding:30px;}
.msg h5 {padding:0;}
.msg p {padding:6px 0;}
.msg .bus {margin:30px 0 15px; max-height:60px;}
.btn {display:inline-block; width:100%; height:60px; position:absolute; top:54vw; right:0;}
}