body.spkDebugger{ padding-bottom:380px;}
body.spkDebugger.maximized{ padding:0; overflow: hidden;}
.spkDebugInfoNode{ position: fixed; bottom:0; left: 0; width: 100%; display:table; background:#000; color:#fff; font-family: monospace; overflow:hidden; display:none;}

#spkDebugger{position:fixed; bottom:0; left: 0; width:100%; display:block; background:#1e1e1e;color:#fff; font-family: monospace;  z-index:9000;}

#spkDebugger .close{position:absolute; top:0; right: 0; cursor:pointer; width: 40px; height: 40px;
    background:url('../img/x.png') no-repeat center;}
#spkDebugger .maximize{position:absolute; top:0; right: 50px; cursor:pointer; width: 40px; height: 40px;
    background:url('../img/max.png') no-repeat center;}
#spkDebugger .restore{position:absolute; top:0; right: 50px; cursor:pointer; width: 40px; height: 40px;
    background:url('../img/restore.png') no-repeat center;}
#spkDebugger .open{position:absolute; top:0; right: 100px; cursor:pointer; width: 40px; height: 40px;
    background:url('../img/open.png') no-repeat center;}
#spkDebugger .minimize{position:absolute; top:0; right: 100px; cursor:pointer; width: 40px; height: 40px;
    background:url('../img/hide.png') no-repeat center;}
#spkDebugger.open .open, #spkDebugger .restore{display:none;}
#spkDebugger.closed .minimize,#spkDebugger .restore{display:none;}
#spkDebugger.maximized{ height: 100%;}
#spkDebugger.maximized .maximize{display:none;}
#spkDebugger.maximized .restore{display:block;}
#spkDebugger.spkHidden > h2.spkTitle, #spkDebugger.spkHidden > div{display:none; }
#spkDebugger.spkHidden{ width:auto; background: transparent;}
#spkDebugger .spkBtnDisplay{ display:none;}
#spkDebugger.spkHidden > .spkBtnDisplay{ display:block; background:url("../img/bug.png") no-repeat scroll 10px top #252526; height: 40px; line-height: 40px; width: 60px; cursor:pointer; }
#spkDebugger h2.spkTitle{ background: url("../img/bug.png") no-repeat scroll 10px top #252526;
    color:#ccc;font-size: 26px;font-weight: normal;line-height: 40px;margin: 0; display:table;width: 100%;}
#spkDebugger h2.spkTitle .spkTitleTxt{float:left; margin-right: 10px; margin-left:60px;}
#spkDebugger .spkDebuggTabs{ display:table; width:100%; height: 32px; line-height: 30px; border-bottom:2px solid #000; background-color:#37373d; color:#ccc;}
#spkDebugger #spkAsyncConsole .spkDebuggTabs { height: 26px; line-height: 24px; border-bottom:1px solid #ccc;}
#spkDebugger #spkAsyncConsole .spkConsoleInfo{ height: 264px; width:100%; display:block;}
#spkDebugger .spkDebuggTabs .spkTab{ float:left; padding:0 20px; height: 30px;
    line-height: 30px; border-right: 1px solid #000; cursor:pointer;}
#spkDebugger #spkAsyncConsole .spkDebuggTabs .spkTab{height: 24px; line-height: 24px;}
#spkDebugger .spkDebuggTabs .spkTab.spkTabConsole{height: 24px; line-height: 24px;}
#spkDebugger .spkDebuggTabs .spkTab.selected{ background:#2196F3; color:#fff;}

#spkDebugger .spkPanel{display:none; /*overflow-y: auto; overflow-x:hidden; height: 290px; scrollbar-color: #2196F3 #37373d;*/ }
#spkDebugger .spkPanel:hover{ overflow-x: auto; }
#spkDebugger .spkPanel.active{ display:block; }
#spkDebugger .spkPanel .debugLine pre{ background:none!important;color:#f5f5f5!important; border-color: #000;}
#spkDebugger .spkConsolePanel{display:none; }
#spkDebugger .spkConsolePanel.active{ display:block; }
#spkDebugger .spkDebugInfo{ display:block; height: 320px; overflow:hidden; position:relative; }
#spkDebugger .spkDebugInfo .spkBtnClear{ display:none; height: 28px; width:28px; position:absolute;
    bottom:0; right: 0; background:url('../img/clear.png') no-repeat center; cursor:pointer;}
#spkDebugger .spkDebugInfo:hover  .spkBtnClear{display:block; }
#spkDebugger.maximized .spkDebugInfo{ height: calc(100% - 40px); }
#spkDebugger.maximized .spkPanel{ height: calc(100% - 70px); }

#spkDebugger h3.errorSubLinea{ font-size:18px;; font-weight: lighter; text-indent: 10px; margin:0;
    background: #ffc; line-height: 30px; color:#666; border-left:4px solid #ffa500;}
#spkDebugger h3.exceptionSubLinea{ font-size:18px;; font-weight: lighter; text-indent: 10px; margin:0;
    background: #fce9e9; line-height: 30px; color:#666; border-left:4px solid #ff0066;}
#spkDebugger .spkVarName { font-size:18px;; font-weight: lighter; text-indent: 10px; margin:0;
    background: #fff; line-height: 30px; color:#666; border-left:4px solid #2196f3;}
#spkDebugger .spkVarName b{font-size:16px;font-weight: bold;line-height: 40px;margin: 0; font-style: normal; color:#2196f3;}
#spkDebugger .spkVarName b i{font-weight: normal;font-style: italic;}
#spkDebugger .spkVarName span{font-size:16px;font-weight: normal;line-height: 40px;margin: 0; font-style: italic;}
#spkDebugger .spkDebuggPanel{ max-height: calc(100% - 60px); overflow:auto;scrollbar-color: #2196F3 #37373d;}

#spkDebugger .debugLine{ margin-bottom:4px;}
#spkDebugger .exLinea{ background:#fcc;}
#spkDebugger .errorHandleTracking h4{ margin:0;text-indent: 10px; line-height: 30px;}
#spkDebugger .errorHandleTracking .traceLine{ border-bottom: 1px solid #e5e5e5; text-indent: 10px; padding:4px 0;}
#spkDebugger .errorHandleTracking .traceLine .funct{ color:#0000ff;}
#spkDebugger .errorHandleTracking .traceLine .line{ color:#FF0000;}

#spkDebugger .spkDInfo{display:none; border-left:4px solid #2196f3; }
#spkDebugger .spkHInfo{cursor:pointer; position:relative; }


#spkDebugger .removeBtn{position:absolute; right: 10px; top:10px; width:20px; height: 20px;
    cursor:pointer; display:none; background:url('../img/x2.png') no-repeat center;}
#spkDebugger .spkBtnOpenNB{position:absolute; right: 40px; top:10px; width:20px; height: 20px;
    cursor:pointer; display:none; background:url('../img/nb.png') no-repeat center;}
#spkDebugger .errorSubLinea .spkActionBtns, #spkDebugger .exceptionSubLinea .spkActionBtns{ top:5px;}
#spkDebugger .spkHInfo:hover .spkActionBtns{display:block;}

#spkDebugger #spkErrorPanel .spkDInfo{border-color:#ffa500;}
#spkDebugger #spkExceptionPanel .spkDInfo{border-color:#ff0066;}
#spkDebugger #spkExceptionPanel .ajaxData{padding:10px 20px;border-bottom: 2px dashed #999;
    display: block;unicode-bidi: embed;white-space: pre;}
#spkDebugger #spkExceptionPanel .ajaxDataResume{padding:10px 20px;font-weight: bold; cursor:pointer;}
#spkDebugger #spkExceptionPanel .exHandleTracking{padding:10px 20px;unicode-bidi: embed;white-space: pre-wrap; }
#spkDebugger #spkAsyncConsole .spkTabConsoleBtn{float:right; width:30px; height: 24px; cursor:pointer;}
#spkDebugger #spkAsyncConsole .spkTabConsoleBtn.spkRunBtn{ background: url('../img/run.png') no-repeat center;}
#spkDebugger #spkAsyncConsole .spkConsoleInput{padding:0;background:#333; color:#fff; height: 100%; width: 100%;}
#spkDebugger #spkAsyncConsole .spkConsoleInput #spkInputTxt{padding:4px;background:#333; border:0;color:#fff; height: 240px;resize:none; width: 100%;}
#spkDebugger #spkAsyncConsole #spkConsoleOutputHtml{height: 240px; width: 100%;}
#spkDebugger .spkConsoleStatus{position:fixed; bottom:0; height: 24px; line-height: 24px; color:#fff; width: 100%; text-indent: 20px;;}
#spkDebugger .spkVarInfo {padding:20px 0 20px 20px;}
#spkDebugger .spkNot {float:left; padding:0 10px; height: 20px; margin-top: 12px;  font-weight: bold; border-right: 1px solid #999;
    font-size: 16px; line-height: 20px;}
#spkDebugger .spkNot.notApp {color:#2196f3;}
#spkDebugger .spkNot.notAppErr {color:#ffa500;}
#spkDebugger .spkNot.notAsync {color:#ffa500; display:none;}
#spkDebugger .spkNot.notAsyncErr {color:#ff0066; display:none;}
#spkDebugger .spkNot.notAsyncDebug {color:#21f32a; display:none;}
#spkInfo > .debugLine{ display:block; width:100%; border-bottom:1px solid #000; }
#spkInfo > .debugLine:before{clear:both; width:100%;display:block; content:'';}
#spkInfo > .debugLine > b{ float:left; width:130px; line-height: 24px; padding-left:10px;}
#spkInfo > .debugLine > span{ float:left;line-height: 24px; max-width: 80%; max-width: calc(100% - 132px); }

#spkDebugger #spkAsyncDegugPanel .debugNetLine{ padding:4px;border-bottom:1px solid #000;  }
#spkDebugger #spkAsyncDegugPanel .debugNetLine .dgPanel {display:none;}
#spkDebugger #spkAsyncDegugPanel .debugNetLine .dgPanel.active {display:block;}
#spkDebugger #spkAsyncDegugPanel .debugNetLine .tabsPanel {display:block; width:100%; overflow:hidden; }
#spkDebugger #spkAsyncDegugPanel .debugNetLine .tabsPanel > .tab {float:left; padding:4px 10px;cursor:pointer; }
#spkDebugger #spkAsyncDegugPanel .debugNetLine .tabsPanel > .tab.active { background:#2196F3; color:#fff; }

#spkDebugger #spkAsyncDegugPanel .debugNetLine pre {padding: 5px; margin: 5px; border-radius: 0; color:#f5f5f5; border:0; background:none;}
#spkDebugger #spkAsyncDegugPanel .debugNetLine .string { color: #5e9949; }
#spkDebugger #spkAsyncDegugPanel .debugNetLine .number { color: #ce3b50; }
#spkDebugger #spkAsyncDegugPanel .debugNetLine .boolean { color: #4fb8fe; }
#spkDebugger #spkAsyncDegugPanel .debugNetLine .null { color: #7c477a; }
#spkDebugger #spkAsyncDegugPanel .debugNetLine .key { color: #ce723b; }
#spkDebugger #spkAsyncDegugPanel .debugNetLine .dgHeader{ display: block; width: 100%; overflow:hidden; clear: both;padding:2px;cursor:pointer; }
#spkDebugger #spkAsyncDegugPanel .debugNetLine .dgCol{ float:left; padding:4px 10px; }
#spkDebugger #spkAsyncDegugPanel .debugNetLine .dgCol.dgStatus { background:#37373d; color:#fff;}
#spkDebugger #spkAsyncDegugPanel .debugNetLine .dgCol.dgStatus.status200 { background: #21f32a;}
#spkDebugger #spkAsyncDegugPanel .runtimeCode { font-size:20px; background:rgba(0,0,0,0.2); padding:2px 0; position:relative;}
#spkDebugger #spkAsyncDegugPanel .runtimeCode.first{ border-top: 1px solid #000; margin-top:10px; padding-top:10px;}
#spkDebugger #spkAsyncDegugPanel .runtimeCode.first > .firstItem{ position:relative; padding-top:40px;}
#spkDebugger #spkAsyncDegugPanel .runtimeCode.first > .firstItem > .controls{ z-index: 2; position:absolute; top:0; right: 10px; display: block;}
#spkDebugger #spkAsyncDegugPanel .runtimeCode.first > .firstItem > .controls > .rBtn{ float:left; margin-left: 10px; padding:4px; }
#spkDebugger #spkAsyncDegugPanel .runtimeCode.first > .firstItem > .controls > .cntChsm{ color:#666; padding:4px; cursor:pointer;}
#spkDebugger #spkAsyncDegugPanel .runtimeCode.first > .firstItem > .controls > .cntBtn{ background:#2196F3; padding:4px; cursor:pointer;}
#spkDebugger #spkAsyncDegugPanel .runtimeCode.last{ border-bottom: 1px solid #000; margin-bottom:10px; padding-bottom:10px;}
#spkDebugger #spkAsyncDegugPanel .runtimeCode > div .stack{ position:absolute; right:0; top:0; height: 100%; width: 4px; background:#ffd486; cursor:pointer;border:1px solid #ffa500;}
#spkDebugger #spkAsyncDegugPanel .runtimeCode.active > div .stack, #spkDebugger #spkAsyncDegugPanel .runtimeCode > div .stack:hover{background:#ffa500;}
#spkDebugger #spkAsyncDegugPanel .runtimeCode.inactive > div .stack { opacity:0.2; }
#spkDebugger #spkAsyncDegugPanel .runtimeCode > div .stack:hover::before{ content: '<'; right: 8px; color:#fff; position:absolute; font-size: 10px; line-height: 20px; font-weight: bold;}
#spkDebugger #spkAsyncDegugPanel .debugPoint{ z-index:2; border-radius: 4px; position:absolute; left:10px; cursor:pointer; top:4px; color:#000; background-color:#000; display: block; min-height: 18px; min-width: 18px; font-size:12px;}
#spkDebugger #spkAsyncDegugPanel .debugPoint.type_boolean{ background-color:#9b3458; }
#spkDebugger #spkAsyncDegugPanel .debugPoint.type_string{ background-color:#349b47; }
#spkDebugger #spkAsyncDegugPanel .debugPoint.type_integer{ background-color:#5b349b; }
#spkDebugger #spkAsyncDegugPanel .debugPoint.type_object{ background-color:#34779b; }
#spkDebugger #spkAsyncDegugPanel .debugPoint.type_exception{ background-color:#f00; }
#spkDebugger #spkAsyncDegugPanel .debugPoint.type_error{ background-color:#ff6200; }
#spkDebugger #spkAsyncDegugPanel .debugPoint > .debugInfo{ display:none; padding:0 4px;}
#spkDebugger #spkAsyncDegugPanel .debugPoint > .debugContent{ display:none;padding:4px;  }
#spkDebugger #spkAsyncDegugPanel .debugPoint > .debugContent .dbClose{ position:absolute; top:2px; right: 2px; line-height: normal; display: block; cursor:pointer; color:#000; font-weight: bold; }
#spkDebugger #spkAsyncDegugPanel .debugPoint.active{border:1px solid #000; padding:8px;z-index: 10;}
#spkDebugger #spkAsyncDegugPanel .debugPoint:hover > .debugInfo{ display:block; }
#spkDebugger #spkAsyncDegugPanel .debugPoint.active > .debugContent{ display:block; }
#spkDebugger #spkAsyncDegugPanel .debugPoint.active:hover > .debugInfo{display:none;}
