body{overvlow:hidden;margin:0;background:url('background.jpg');background-size:cover;background-repeat:no-repeat;background-position:center;}
#blank{background:rgba(51, 51, 51, 0.75);display:none;position:fixed;top:0;left:0;height:100%;width:100%;z-index:50;overflow:hidden;margin:0;}
#proses{position:fixed;background:rgba(128, 128, 128, 0.25);top:0;bottom:0;left:0;right:0;z-index:52;overflow:hidden;margin:0;}
.whole{width:100%;clear:both;margin:0px auto;}
.textarea{width:100%;min-height:6em;padding:0.75em;background-color:#fff;color:#333;border:0px solid transparent;}
.klik{padding:0.5em;min-width:7.5em;letter-spacing:1.5px;cursor:pointer;display:inline-block;text-align:center;border:1px solid transparent;margin:1em auto;background:#333;color:#fff;float:right;}
.klik:hover, .hover:hover, .hapus:hover{cursor:pointer;opacity:0.45;}
#showour{font-weight:bold;background:transparent;color:#aaa;font-size:22pt;margin:1.5em auto;clear:both;float:none;}
.popup{width:640px;background:#fff;padding:1em;z-index:51;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);}
.bayang, .klik:hover{box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);}
input,select,.input{padding:0.75em;border:1px solid #aaa;width:64px;float:left;display:inline-block;margin-left:0.5em;background:transparent;}
.input{width:100%;clear:both;margin-bottom:1em;font-size:12pt;}
#alert{font-size:16pt;color:#fff;position:fixed;z-index:52;top:50%;left:50%;transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);text-align:center;}
#darkrad{height:100vh;width:100%;overflow:hidden;margin:0;}
#ourcatatan{min-height:50%;overflow:auto;}
.note{display:block;position:relative;height:auto;max-height:420px;padding:0.5em;margin:1em 1.5em;display:inline-block;float:left;}
.paper{box-shadow:0 14px 28px 8 rgba(0, 0, 0, 0.45), 0 6px 20px 0 rgba(0, 0, 0, 0.55);width:100%;height:auto;position:relative;font-family: "Lucida Console", "Courier New", monospace;}
.label{font-weight:bold;text-align:right;height:35px;width:100%;left:0;border-radius:9px 9px 0 0;z-index:5;padding:0.25em 1em;}
.paper p{word-wrap: break-word;width:100%;padding:1em;font-size:13pt;}
.paper i{margin:0.75em;font-size:9pt;float:right;color:#333;}
.paper sub{padding:0.5em;}
.white{background:#fff;color:#555;}
.pale{background:#b6fcb6;color:#333;}
.pink{background:#ffccff;color:#444;}
.blue{background:#cce5ff;color:#444;}
.violet{background:#b366ff;color:#fff;}
.orange{background:#ffd480;color:#222;}
.cycle{position:fixed;cursor:pointer;text-align:center;z-index:5;width:42px;height:42px;line-height:42px;font-size:32pt;vertical-align:middle;}
.hapus{font-size:11pt;color:#f30;text-align:right;padding:0.5em;}