a,a:hover,h1 a,h1 a:hover{text-decoration:none}body{color:#306;background:#fafafc;font-family:Verdana,Arial}@font-face{font-family:DroidKufi-bold;font-style:normal;font-weight:700;src:url(//themes.googleusercontent.com/static/fonts/earlyaccess/droidarabickufi/v3/DroidKufi-Bold.eot);src:url(//themes.googleusercontent.com/static/fonts/earlyaccess/droidarabickufi/v3/DroidKufi-Bold.eot?#iefix) format('embedded-opentype'),url(//themes.googleusercontent.com/static/fonts/earlyaccess/droidarabickufi/v3/DroidKufi-Bold.woff2) format('x-woff2'),url(//themes.googleusercontent.com/static/fonts/earlyaccess/droidarabickufi/v3/DroidKufi-Bold.woff) format('woff'),url(//themes.googleusercontent.com/static/fonts/earlyaccess/droidarabickufi/v3/DroidKufi-Bold.ttf) format('truetype')}header{position:fixed;top:0;left:0;display:flex;width:100%;height:60px;padding:0 30px 0 25px;background-color:#fff;color:#161616;z-index:50;box-shadow:0 2px 10px 0 rgb(0 0 0 / 7%);-webkit-transition:all .1s ease;transition:all .1s ease}header h1{background:url(https://tutorial.kangis.my.id/arabickeyboard/img/arabic-keyboard-logo.png) left center no-repeat;padding-left:40px;font:18px DroidKufi-bold,Arial,Tahoma,Helvetica,FreeSans,sans-serif;color:#222}.center{text-align:center}.right{text-align:right}#keyboard,footer{text-align:center}a{color:#0b82b4}a:hover{color:#3b3b3b}p{margin:.6em 0}#kb-container{width:90%;margin:0 auto}#keyboard{font:16px Arial,Helvetica,sans-serif;color:#111;max-width:1280px;display:inline-block;margin-top:40px}.keyboard2,.keyboard3,.keyboard4{max-width:1280;display:inline-block}.key,.max,.maxx{position:relative;display:inline-block;margin-right:5px;margin-bottom:30px;border-radius:3px}.key:hover{background-color:#e4e4e4;border-radius:3px}.key:last-child,.key:last-of-type{margin-right:0}.key:before,.max:before,.maxx:before{display:block;margin:5px 0 0;font-size:15px;line-height:20px;content:'' attr(data-text);position:absolute;top:-30px;text-align:center;color:#222}.bsm,.bsm:hover,.bsm:visited,.bsv,.bsv:hover,.bsv:visited{cursor:pointer;font-size:9pt;color:#666;margin-right:.9em;top:260px}.max:before{left:8px}.maxx:before{left:4px}.key:before{left:15px}#convert{position:relative}.bsm,.bsm:hover,.bsm:visited{position:absolute;margin-left:.9em}.bsv,.bsv:hover,.bsv:visited{position:absolute;margin-left:60px}.btkey,.m,.n,.o,.p,.q,.r,.s,.t,.u,.v,.w{text-decoration:none;cursor:pointer;font-size:1.7em;color:#C03;font-family:Times New Roman}.bcl{background:url(https://https://tutorial.kangis.my.id/arabickeyboard/img/close-x-gray.png) center right no-repeat;padding-right:10px;cursor:pointer;width:20px;height:20px;border-width:0;position:absolute;margin-left:5px;margin-top:85px}.right30{margin-right:30px}.mw{min-width:50px}.m,.n,.o,.p,.q,.r,.s,.t,.u,.v,.w{border:1px solid #b3b3b3;border-radius:3px;padding:.1em 0;min-width:39px;min-height:40px;box-shadow:0 3px 5px 0 rgb(30 30 30 / 11%)}.btkey:hover,.m:hover,.n:hover,.o:hover,.p:hover,.q:hover,.r:hover,.s:hover,.t:hover,.u:hover,.v:hover,.w:hover{background-color:#f6f6f6}.btk:focus,.btkey:focus,.bts:focus,.m:focus,.n:focus,.o:focus,.p:focus,.q:focus,.r:focus,.s:focus,.t:focus,.u:focus,.v:focus,.w:focus{outline:0!important;border:1px solid #111}.btk,.btkey{border:1px solid #b3b3b3}.m{background:url(https://tutorial.kangis.my.id/arabickeyboard/img/tasydid.png) center center no-repeat #fff}.n{background:url(https://tutorial.kangis.my.id/arabickeyboard/img/sukun-2.png) center center no-repeat #fff}.o{background:url(https://tutorial.kangis.my.id/arabickeyboard/img/dhommatain.png) center center no-repeat #fff}.p{background:url(https://tutorial.kangis.my.id/arabickeyboard/img/kasrotain.png) center center no-repeat #fff}.q{background:url(https://tutorial.kangis.my.id/arabickeyboard/img/fathatain2.png) center center no-repeat #fff}.r{background:url(https://tutorial.kangis.my.id/arabickeyboard/img/dhommah.png) center center no-repeat #fff}.s{background:url(https://tutorial.kangis.my.id/arabickeyboard/img/kasrah.png) center center no-repeat #fff}.t{background:url(https://tutorial.kangis.my.id/arabickeyboard/img/fathah.png) center center no-repeat #fff}.u{background:url(https://tutorial.kangis.my.id/arabickeyboard/img/fathah-berdiri.png) center center no-repeat #fff}.v{background:url(https://tutorial.kangis.my.id/arabickeyboard/img/fathah-berdiri2.png) center center no-repeat #fff}.w{background:url(https://tutorial.kangis.my.id/arabickeyboard/img/dhommah-berdiri.png) center center no-repeat #fff}.btkey{background:#fff;border-radius:3px;padding:.1em .25em;min-width:1.4em;box-shadow:0 3px 5px 0 rgb(30 30 30 / 11%)}.btk,.bts{box-shadow:0 3px 5px 0 rgb(30 30 30 / 11%);font-size:18px;font-family:arial;color:#888;text-decoration:none;cursor:pointer}.btk{background:#f7f7f7;border-radius:3px;padding:8px 12px}.btk:hover,.bts:hover{background:#fff}.bts{background:#f7f7f7;border:1px solid #b3b3b3;border-radius:3px;padding:8px 50px}.btb,.btb:hover,.btb:visited{text-decoration:none;cursor:pointer;padding:.1em 0;min-width:39px;font-size:1.7em;color:#C03;font-family:Times New Roman}.iblock{margin-top:80px;width:85%;border:1px solid #666;font-size:1.8em;color:#00F;font-family:Simplified Arabic,Times New Roman;direction:rtl;padding:.3em}.iblock:focus{outline:0!important;border:1px solid #393939}footer{margin:40px 18%;width:64%}footer a.cr{color:#00638d;font-size:75%;text-decoration:none}footer a.cr:hover{color:#888}body.dark-mode{background:#111;color:#efefef}.dark-mode header{background:#2d2d30;color:#fff}.dark-mode header h1{color:#d3d3d3}.dark-mode .iblock{background:#222;color:#a9eef2;border:1px solid #333}.dark-mode .btk,.dark-mode .btkey,.dark-mode .bts{background:#2d2d30;border-radius:3px;color:#f8f8ff;border:1px solid #444}.dark-mode .bsm,.dark-mode .bsv{background:#111;border-radius:3px;color:#ccc;border:1px solid #333}.dark-mode .btk:hover,.dark-mode .btkey:hover,.dark-mode .bts:hover,.dark-mode .m:hover,.dark-mode .n:hover,.dark-mode .p:hover,.dark-mode .q:hover,.dark-mode .r:hover,.dark-mode .s:hover,.dark-mode .t:hover,.dark-mode .u:hover,.dark-mode .v:hover,.dark-mode .w:hover{background-color:#212124;border-radius:3px;border:1px solid #222}.dark-mode .key:hover{border-radius:3px}.dark-mode textarea.iblock:focus{outline:0!important;border:1px solid #444}.dark-mode .key:before,.dark-mode .max:before,.dark-mode .maxx:before{color:#606062}.dark-mode .m,.dark-mode .n,.dark-mode .o,.dark-mode .p,.dark-mode .q,.dark-mode .r,.dark-mode .s,.dark-mode .t,.dark-mode .u,.dark-mode .v,.dark-mode .w{border:1px solid #444}.dark-mode .m{background:url(https://tutorial.kangis.my.id/arabickeyboard/img/tasydid-putih.png) center center no-repeat #2d2d30}.dark-mode .n{background:url(https://tutorial.kangis.my.id/arabickeyboard/img/sukun-putih.png) center center no-repeat #2d2d30}.dark-mode .o{background:url(https://tutorial.kangis.my.id/arabickeyboard/img/dhommatain-putih.png) center center no-repeat #2d2d30}.dark-mode .p{background:url(https://tutorial.kangis.my.id/arabickeyboard/img/kasrotain-putih.png) center center no-repeat #2d2d30}.dark-mode .q{background:url(https://tutorial.kangis.my.id/arabickeyboard/img/fathatain-putih.png) center center no-repeat #2d2d30}.dark-mode .r{background:url(https://tutorial.kangis.my.id/arabickeyboard/img/dhommah-putih.png) center center no-repeat #2d2d30}.dark-mode .s{background:url(https://tutorial.kangis.my.id/arabickeyboard/img/kasrah-putih.png) center center no-repeat #2d2d30}.dark-mode .t{background:url(https://tutorial.kangis.my.id/arabickeyboard/img/fathah-putih.png) center center no-repeat #2d2d30}.dark-mode .u{background:url(https://tutorial.kangis.my.id/arabickeyboard/img/fathah-berdiri-putih.png) center center no-repeat #2d2d30}.dark-mode .v{background:url(https://tutorial.kangis.my.id/arabickeyboard/img/fathah-berdiri-putih2.png) center center no-repeat #2d2d30}.dark-mode .w{background:url(https://tutorial.kangis.my.id/arabickeyboard/img/dhommah-berdiri-putih.png) center center no-repeat #2d2d30}.dark-mode footer a.cr:hover{color:#f5ff59}.dark-link,.dark-switch{position:fixed;top:20px;right:25px;width:20px;height:20px;z-index:99;cursor:pointer}.dark,.light{position:fixed;top:23px;right:55px;font-size:11px;font-family:Arial}.dark-link .svg-2,.dark-mode .dark-link .svg-1,.light{display:none}.dark-mode .dark-link .svg-2,.dark-mode .light{display:block}.dark-mode .dark-link svg.line{fill:none;stroke:#eaff00}.dark{color:#333}.light{color:#ccc}#alert{position:absolute;left:100px;top:195px;display:none}#alert-succes{padding:15px;border:1px solid #d6e9c6;border-radius:4px;color:#3c763d;background-color:#dff0d8;font-family:Arial;font-weight:700;font-size:14px;display:flex}#close-alert{margin-left:15px;cursor:pointer}.rtl{
direction: rtl;}