/*
	jsTIfied CSS. No thievery without asking, please.
	   _     __________  __ _          _ 
	  (_)___/__   \_   \/ _(_) ___  __| |
	  | / __| / /\// /\/ |_| |/ _ \/ _` |
	  | \__ \/ //\/ /_ |  _| |  __/ (_| |
	 _/ |___/\/ \____/ |_| |_|\___|\__,_|
	|__/                                 
*/
tt, code, .fixed {
	font-family: Courier, 'Courier New', sans-serif;
}
/* mac hide */
html,body{height:100%;width:100%;}
/* end hide */
html  {
	font-size: 100%;
	overflow-wrap: break-word;
}
body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.75rem;
	line-height: initial;
	text-align: left;

	background-color: #1E2022;
	margin: 0rem;
	padding: 0rem;

	width: 100%;
	vertical-align: middle;
	margin-top: 0rem;
}

embed, object, iframe {
	max-width: 100%;
}

img {
	max-width: 100%;
	height: auto;
}

a {
	color: #a00;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
a.maintitle,
a.largetext,
a.sideheadtop,
a.mainheadmiddle,
a.sideheadmiddle {
	color: #fff;
	text-decoration: none;
	font-size: 1rem;
}

a.sideheadmiddle {
	font-size: 0.875rem;
}

table {
	margin-left: 0rem;
	margin-right: 0rem;
	border: 0rem;
	padding: 0rem;
	vertical-align: top;
}
td {
	vertical-align: top;
}

#screen {
	width: 100vw;
	height: 67vw;
	float:left;
	position: absolute;
	clear: both;
	image-rendering: -webkit-optimize-contrast;
}

.screen_unskinned {
	border: 8px solid #8ebebe;
	margin-right: 32px;
	left: 0px;
	top: 0px;
	z-index: 6;
	width: 192px;
	height: 128px;
}
.screen_skinned {
	border: 0px;
	left: 10px;
	top: 10px;
	right: 10px;
	z-index: 6;
	width: 100vw;
	height: 67vw;
 }
.screen_skinned_c {
	border: 0px;
	left: 15px;
	top: 71px;
	z-index: 6;
	width: 320px;
	height: 240px;
}
.screen_skinned_parcus {
	border: 0px;
	left: 80px;
	top: 78px;
	z-index: 6;
	width: 192px;
	height: 128px;
}

.calckeys {
	float:left;
	position: absolute;
	clear: both;
	left: 0px;
	top: 0px;
	display: block;
	width: 100%;
	height: 100%;
	z-index: 7;
	pointer-events: none;
}

polygon.calckey {
    fill: transparent;
    stroke: none;
    stroke-width: 0;
    cursor: pointer;
	pointer-events: all;
}

polygon.clicked {
	fill-opacity: 0.4;
	fill: #ff0000;
}

#dropoverlay_rom, #dropoverlay_ram, #romoverlay  {
	/*width: 192px;
	height: 128px;*/
	float:left;
	position: absolute;
	clear: both;
	opacity:0.4;
	filter:alpha(opacity=40); /* For IE8 and earlier */
	text-align: center;
	z-index: 8;
	display: none;
}
#dropoverlay_ram {
	background-color: #8f8;
}
#dropoverlay_rom {
	background-color: #f88;
}
.drop_unskinned, .drop_unskinned_left, .drop_unskinned_right {
	position: relative;
	border: 8px solid #f00;
	margin-right: 32px;
	left: 0px;
	top: 0px;
	width: 192px;
	height: 128px;
}

.drop_unskinned_c, .drop_unskinned_left_c, .drop_unskinned_right_c {
	position: relative;
	border: 8px solid #f00;
	margin-right: 32px;
	left: 0px;
	top: 0px;
	width: 320px;
	height: 240px;
}
.drop_skinned, .drop_skinned_left, .drop_skinned_right {
	position: relative;
	border: 0px;
	left: 80px;
	top: 92px;
	width: 192px;
	height: 128px;
}	
.drop_skinned_c, .drop_skinned_left_c, .drop_skinned_right_c {
	position: relative;
	border: 0px;
	left: 15px;
	top: 71px;
	width: 320px;
	height: 240px;
}	
.drop_unskinned_left, .drop_skinned_left,
.drop_unskinned_right, .drop_skinned_right {
	width: 96px;
	display: inline-block;
}
.drop_unskinned_left_c, .drop_skinned_left_c,
.drop_unskinned_right_c, .drop_skinned_right_c {
	width: 160px;
	display: inline-block;
}

.drop_unskinned_right {
	left: 96px;
	top: 0px;
}
 .drop_skinned_right, .drop_unskinned_right_c {
	left: 176px;
	top: 92px;
}
.drop_skinned_right_c {
	left: 175px;
	top: 71px;
}

.menu_unskinned {
	margin-left: 0px;
	margin-bottom: 0px;
}
.menu_skinned {
	margin-left: 102px;
	margin-bottom: 0px;
}

#sc2menu {
	clear: left;
	margin: 0;
	margin-top: 64px;
	padding: 0;
	width: 32px;
	min-height: 160;
	list-style-type: none;
}

#sc2menu li {
	margin: 0px;
	margin-bottom: 32px;
	z-index: 5;
}
#sc2menu li a {
	display: block;
	text-indent: -5000px;
	width: 32px;
	height: 32px;
	outline: none;
	z-index: 5;
}

#sc2menu li#menu_mvright a {
	background: url('pti_icons/32x32_btn.png') -32px 0;
}

#sc2menu li#menu_mvleft a {
	background: url('pti_icons/32x32_btn.png') 0 0;
}

#sc2menu li#menu_toggle a {
	background: url('pti_icons/32x32_btn.png') -64px 0;
}
.big_screen {
	display: none;
	position: absolute;
	top: 8px;
	left: 8px;
	width: 90%;
    background-color: #fff;
    background-color: rgba(255,255,255,0.8);
	text-align: right;
	font-weight: bold;
	padding: 8px;
	z-index: 999;
}
.fullScreenDiv {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #000;
	text: #555;
}
.big_screen_canvas {
	width: 100%;
}
.fullScreenCanvas {
	width: auto;
	height: 100%;
	margin: 0;
	padding: 0;
}
.big_screen_holder {
	text-align: center;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
}

#menu {
	clear: left;
	margin: 0;
	padding: 0;
	width: 224px;
	height: 32px;
	background-color: #1E2022;
	list-style-type: none;
	z-index: 4;
	border: 1px solid #CCCCCC;
	border-radius: 4px;
	  
}
#menu li {
	float: left;
	margin: 0px;
	z-index: 5;
	text-align: center;
}
#menu li a {
	display: block;
	text-indent: -5000px;
	width: 32px;
	height: 32px;
	outline: none;
	z-index: 5;
	text-align: center;
}
#menu.stopped li#menu_run a {
	background: url('pti_icons/32x32_btn.png') -320px 0;
	width: 32px;
	height: 32px;
}
#menu.running li#menu_run a {
	background: url('pti_icons/32x32_btn.png') -288px 0;
	width: 32px;
	height: 32px;
}
#menu.running li#menu_stop a {
	background: url('pti_icons/32x32_btn.png') -384px 0;
	width: 32px;
	height: 32px;
}
#menu.stopped li#menu_stop a {
	background: url('pti_icons/32x32_btn.png') -352px 0;
	width: 32px;
	height: 32px;
}
#menu li#menu_reset a {
	background: url('pti_icons/32x32_btn.png') -256px 0;
	width: 32px;
	height: 32px;
}

#menu li#menu_open a {
	background: url('pti_icons/32x32_btn.png') -160px 0;
	width: 32px;
	height: 32px;
}
#menu li#menu_fullscreen a {
	background: url('pti_icons/32x32_btn.png') -448px 0;
	width: 32px;
	height: 32px;
}
#menu li#menu_romload a {
	background: url('pti_icons/32x32_btn.png') -224px 0;
	width: 32px;
	height: 32px;
}
#menu li#menu_skin a {
	background: url('pti_icons/32x32_btn.png') -128px 0;
	width: 32px;
	height: 32px;
}
#menu li#menu_trash a {
	background: url('pti_icons/32x32_btn.png') -96px 0;
	width: 32px;
	height: 32px;
}
#menu.fast li#menu_fast a {
	background: url('pti_icons/32x32_btn.png') -480px 0;
	width: 32px;
	height: 32px;
}
#menu.slow li#menu_fast a {
	background: url('pti_icons/32x32_btn.png') -512px 0;
	width: 32px;
	height: 32px;
}
#calculator_main {
	position: relative;
	left: 0px;
	top: 0px;
}

#calculator_body {
	position: relative;
	z-index: 3;
}

#jstified_tabs {
	position: relative;
	clear: left;
	margin: 0px;
	padding: 0px;
	border: 2px solid #aaa;
	width: 100%;
	height: 32px;
	list-style-type: none;
}

#jstified_tabs li {
	float: left;
	margin: 0px;
	margin-left: 6px;
}
#jstified_tabs li a {
	display: block;
	/* text-indent: -5000px; */
	border: 0px;
	border-right: 2px solid #aaa;
	border-left: 2px solid #aaa;
	height: 32px;
}

#jstified_tools, #jstified_scxfer, #jstified_tos, #jstified_cpu, #jstified_cam, #jstified_help {
	width: 100%;
	position: relative;
	min-width: 171px;
	background-repeat: no-repeat;
	/* background-position: 32px 32px; */
	background-position: top right;
	z-index: 6;
}

/*
#jstified_cpu {
	white-space: nowrap;
}
*/

#jstified_scxfer { display: none; }

#calculator_main_keypad {
	position: relative;
	display: block;
	left: 0px;
	top: 0px;
	z-index: 4;
}
#calculator_main_keypad_pti {
	position: relative;
	display: none;
	width: 208px;
	height: 144px;
}

#about {
	position: absolute;
	left: 64px;
	top: 32px;
	width: 512px;
	background-color: white;
	height: 420px;
	padding: 4px;
	text-align: center;
	overflow: auto;
}

#clientfilepusher {
	display: none;
	width: 0px;
	height: 0px;
}

a.close_button {
	display: block;
	border: 1px solid black;
	background-color: #ccc;
	margin: auto;
	padding: 4px;
	width: 200px;
	margin-bottom: 8px;
	margin-top: 8px;
	color: black;
	text-decoration: none;
	text-align: center;
	clear: both;
}

.toperr, .topwarn, .topinfo {
	border: 1px solid #999;
	color: #000;
	width: 100%;
	padding: 5px;
	margin-bottom: 8px;
	display: none;
}

.toperr {
	background: rgb(255, 204, 204);	/* fallback */
	background: rgba(255, 204, 204, 0.8);
}
.topwarn {
	background: rgb(204, 204, 255);	/* fallback */
	background: rgba(204, 204, 255, 0.8);
}
.topinfo {
	background: rgb(204, 255, 204);	/* fallback */
	background: rgba(204, 255, 204, 0.8);
}
.topinvis {
	width: 100%;
	display: none;
}

.jsti_toolbox {
	border: 1px solid #999;
	color: #000;
	width: 100%;
	padding: 5px;
	background: rgb(250, 250, 250);	/* fallback */
	background: rgba(250, 250, 250, 0.8);
	margin-bottom: 8px;
	display: none;
	/*max-height: 500px; */
	overflow: auto;
}

.jsti_toolbox>h1 {
	font-weight: bold;
	font-size: 1.0em;
	color: maroon;
	padding: 0px;
	margin: 0px;
}

.progress_outer {
	border: 2px solid #ddd;
	padding: 3px;
	background-color: #eee;
	font-size: 0.8em;
}

.progress_frame {
	display: inline-block;
	border: 1px solid #000;
	padding: 1px;
	margin: 1px;
	width: 100px;
	height: 12px;
	background-color: #fff;
	text-align: left;
}

.progress_bar {
	display: block;
	border: 0px;
	background-color: #88f;
	height: 12px;
	width: 1px;
	text-align: center;
	font-size: 0.6em;
}

.progress_text_success {
	font-weight: bold;
	color: #2f2;
	font-size: 0.8em;
}

.progress_text_fail {
	font-weight: bold;
	color: #d00;
	font-size: 0.8em;
}

.interface_button {
	display: inline-block;
	border: 2px solid #333;
	background-color: #f2f2f2;
	border-radius: 5px;
	padding: 3px;
	white-space: nowrap;
	height: 1.35em;
}

.dbg_button, .dbg_button_disabled, .dbg_button_valid {
	width: 40px;
	font-family: "Courier New", monospace;
	border: 1px solid #888;
	text-align: center;
}

.dbg_button {
	background-color: #f2f2f2;
	color: #000;
}

.dbg_button_disabled {
	background-color: #ddd;
	color: #444;
}

.dbg_button_valid {
	background-color: #8f8;
	color: #000;
}

.cpu_button {
	border: 1px solid #222;
	background-color: #f0f0f0;
	padding-left: 2px;
	padding-right: 2px;
}

#mem_popup {
	position: absolute;
	left: 0px;
	top: 0px;
	display: none;
	width: 160px;
	height: 80px;
	border: 2px solid #888;
	padding: 2px;
	background-color: #eee;
	z-index: 10;
}

#mem_popup_close {
	position: absolute;
	width: 160px;
	text-align: right;
	top: 1px;
	border: 0px;
}

#mem_popup_ptr {
	position: absolute;
	left: 164px;
	top: 31px;
	padding: 0px;
	margin: 0px;
	background-image: url(pti_icons/12x21_cpu_ptr.png);
	border: 0px;
	z-index: 11;
	width: 12px;
	height: 21px;
}

#mem_all, #cpu_dis {
	min-width: 200px;
	max-height: 400px;
	background-color: #fff;
	border: 1px solid #aaa;
	margin: 5px;
	padding: 4px;
	overflow: auto;
	font-family: "Courier New", monospace;
	font-size: 1.0em;
}

.cpu_dis_break { background-color: #fdd; }
.cpu_dis_pc { background-color: #ddf; }
.cpu_dis_breakpc { background-color: #fdf; }

.mem_byte, .mem_addr, .mem_chars, .mem_byte_selected, .mem_byte_r, .mem_byte_w, .mem_byte_rw {
	display: inline-block;
	padding: 1px;
	margin: 0px;
	cursor: default;
}

.mem_byte_r { background-color: #f33; }
.mem_byte_w { background-color: #ff3; }
.mem_byte_rw { background-color: #f93; }

.mem_byte_selected {
	padding: 0px;
	border: 1px dotted #000;
	background-color: #ddf;
}

.mem_row {
	white-space: nowrap;
	cursor: default;
}

.dbg_container {
	vertical-align: top;
	display: inline-block;
	margin: 5px 2px 2px 2px;
	padding: 2px;
	border: 1px solid #aaa;
	background-color: #e8e8e8;
	white-space: nowrap;
}

.social_container {
	border: 2px solid #444;
	background: rgb(204, 204, 255);	/* fallback */
	background: rgba(204, 204, 255, 0.8);
	color: #000;
	width: 150px;
	height: 20px;
	padding: 2px;
	margin-bottom: 8px;
	display: inline-block;
	vertical-align: text-bottom;
}
.twitter-share-button { vertical-align: text-bottom; }
#___plusone_0 { vertical-align: text-bottom; }

area {
	cursor: pointer;
}

.debugger_flex {
	-webkit-flex-direction: column;
	flex-direction: column;
}
.debugger_flex>div {
	-webkit-flex: 1 1 auto;
	flex: 1 1 auto;
}