.DBG,
.DBG0,
.DEBUG,
.DEBUG0,
.DEBUG_RED
{
	border: solid RED 1px;
}
.DBG1,
.DEBUG1,
.DEBUG_GREEN
{
	border: solid LIME 1px;
}
.DBG2,
.DEBUG2,
.DEBUG_BLUE
{
	border: solid BLUE 1px;
}
.DBG3,
.DEBUG3,
.DEBUG_ORANGE
{
	border: solid ORANGE 1px;
}

html
{
	font-family: Arial,Sans-serif;
	font-size: 12px;
}

html,
.z-north-header,
.z-south-header,
.z-west-header,
.z-center-header,
.z-east-header,
.z-tab-selected .z-tab-text
{
	cursor: url('/images/amiga.cur'),auto;
}

.rotate
{
  -webkit-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  transform: rotate(-90deg);
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}

/* ZK fix */
.z-anchorchildren
{
	padding-right: 6px;
	padding-bottom: 4px;
}

.z-listitem .z-listcell,
.z-row>.z-row-inner
{
	vertical-align: top;
}

.breeze .z-toolbar
{
	border-style: none;
}

.iceblue_c .z-toolbarbutton
{
	padding: 0px 2px 0px 0px;
}

pre
{
	line-height: 1.2;
}

.z-toolbarbutton[disabled],
.z-button[disabled]
{
	cursor: url('/images/amiga.cur'),auto;
	opacity: 0.4;
}
.z-listitem.z-listitem-disabled *
{
	cursor: url('/images/amiga.cur'),auto!important;
}

.z-menu .z-icon,
.z-menuitem .z-icon,
.z-treerow .z-icon
{
	padding-right: 4px;
	width: 18px;
}
.z-comboitem-disabled .z-comboitem-text
{
	color: #636363;
	text-decoration: line-through;
}

.z-comboitem.with-image .z-comboitem-image
{
	min-width: 16px;
	min-height: 16px;
	margin-right: 3px;
}

/* COLOR codes */
.z-toolbarbutton.red .z-icon,
.z-menuitem.red .z-icon,
.z-menu.red .z-icon,
.z-treerow.red .z-icon
{
	color: #D04040;
}

.z-toolbarbutton.green .z-icon,
.z-menuitem.green .z-icon,
.z-menu.green .z-icon,
.z-treerow.green .z-icon
{
	color: #50D050;
}

.z-toolbarbutton.blue .z-icon,
.z-menuitem.blue .z-icon,
.z-menu.blue .z-icon,
.z-treerow.blue .z-icon
{
	color: #A0A0FF;
}

.z-toolbarbutton.orange .z-icon,
.z-menuitem.orange .z-icon,
.z-menu.orange .z-icon,
.z-treerow.orange .z-icon
{
	color: #FFE080;
}

.y-itemtext
{
	margin: 8px;
}
.y-itemtext .red,
.y-itemtext .RED
{
	color: #D04040;
}
.y-itemtext .green,
.y-itemtext .GREEN
{
	color: #50D050;
}
.y-itemtext .blue,
.y-itemtext .BLUE
{
	color: #A0A0FF;
}
.y-itemtext .orange,
.y-itemtext .ORANGE
{
	color: #FFB000;
}
.y-itemtext .gray,
.y-itemtext .GRAY
{
	color: #AAAAAA;
}

/*
.z-menuitem.red .z-icon,
.z-menu.red .z-icon,
.z-treerow.red .z-icon,
.z-menuitem.green .z-icon,
.z-menu.green .z-icon,
.z-treerow.green .z-icon,
.z-menuitem.blue .z-icon,
.z-menu.blue .z-icon,
.z-treerow.blue .z-icon,
*/
.z-menuitem.orange .z-icon,
.z-menu.orange .z-icon,
.z-treerow.orange .z-icon
{
	text-shadow:
		-0.4px -0.4px 0   #000,
		0     -0.4px 0   #000,	/* top */
		0.4px -0.4px 0   #000,
		0.4px  0     1.5px #000, /* right */
		0.4px  0.4px 0.7px #000,
		0      0.4px 0.7px #000, /* bottom */
		-0.4px  0.4px 0   #000,
		-0.4px  0     0   #000 /* left*/
		;
}

/* grid, listbox odd lines
.z-listbox-odd.z-listitem,
.z-grid-odd>.z-row-inner,
.z-grid-odd>.z-cell
{
	background: #FBFBFB;
}
*/

.z-treecell-content
{
	padding: 3px 0px;
}

.z-tabpanel
{
	padding: 0px;
}
.z-tabpanel-content
{
	padding: 0px;
}
.z-tab-text
{
	padding: 0 10px 0;
}
.z-tab-button .z-icon-times
{
	color: #D04040;
}

.z-ckeditor .cke .cke_top
{
	padding: 2px 3px 0;
}
.z-ckeditor .cke .cke_toolgroup
{
	margin: 1px 2px 3px 0;
}

/* item active */
.active_false.z-label,
.active_false .z-listcell,
.active_false .z-listcell-content
{
	color: silver;
}

.active_true .z-listcell,
.active_true .z-listcell-content
{
}

/* item statuses */
.z-listitem .status_Prepared
{
	background-color: #EEEEFF;
}
.z-listbox-odd .status_Prepared
{
	background-color: #E4E4FF;
}

.z-listitem .status_OK,
.z-listitem .status_Green
{
	background-color: #EEFFEE;
}
.z-listbox-odd .status_OK,
.z-listbox-odd .status_Green
{
	background-color: #E4FFE4;
}

.z-listitem .status_Failed,
.z-listitem .status_FAIL
{
	background-color: #FFDDDD;
}
.z-listbox-odd .status_Failed,
.z-listbox-odd .status_FAIL
{
	background-color: #FFD5D5;
}

.z-listitem .status_Interrupted,
.z-listitem .status_Red
{
	background-color: #FFEEEE;
}
.z-listbox-odd .status_Interrupted,
.z-listbox-odd .status_Red
{
	background-color: #FFE6E6;
}

.z-listitem .status_Running,
.z-listitem .status_Yellow
{
	background-color: #FDFDC5;
}
.z-listbox-odd .status_Running,
.z-listbox-odd .status_Yellow
{
	background-color: #FAFAC0;
}

.z-listitem .status_Orange
{
	background-color: #FDE4C5;
}
.z-listbox-odd .status_Orange
{
	background-color: #FAE0C0;
}

.priority0.z-listcell .z-listcell-content,
.priority1.z-listcell .z-listcell-content,
.priority2.z-listcell .z-listcell-content,
.priority3.z-listcell .z-listcell-content,
.priority4.z-listcell .z-listcell-content,
.priority5.z-listcell .z-listcell-content,
.priority6.z-listcell .z-listcell-content,
.priority7.z-listcell .z-listcell-content,
.priority99.z-listcell .z-listcell-content
{
	color: inherit;
	font-weight: inherit;
}

.priority0.z-row-inner,
.priority0.z-listcell,
.priority1.z-row-inner,
.priority1.z-listcell,
.priority2.z-row-inner,
.priority2.z-listcell,
.priority3.z-row-inner,
.priority3.z-listcell,
.priority4.z-row-inner,
.priority4.z-listcell
{
	background: #FBFBFF;
}

.z-grid-odd>.priority0.z-row-inner,
.z-listbox-odd>.priority0.z-listcell,
.z-grid-odd>.priority1.z-row-inner,
.z-listbox-odd>.priority1.z-listcell,
.z-grid-odd>.priority2.z-row-inner,
.z-listbox-odd>.priority2.z-listcell,
.z-grid-odd>.priority3.z-row-inner,
.z-listbox-odd>.priority3.z-listcell,
.z-grid-odd>.priority4.z-row-inner,
.z-listbox-odd>.priority4.z-listcell
{
	background: #F6F6FD;
}

.z-label.ROLE_SUPERVISOR /* supervisor */
{
	color: #CC1111;
	font-weight: bold;
}
.z-label.ROLE_GHOST /* ghost */
{
	color: #BBBBBB;
	font-weight: bold;
}
.z-label.ROLE_MODERATOR,
.z-label.ROLE_ADMIN /* admin/modeator */
{
	color: #88DD88;
	font-weight: bold;
}
.z-label.ROLE_RECRUITER /* recruiter */
{
	color: #DDDDFF;
}
.z-label.ROLE_VISITOR /* visitor */
{
	color: #6666BB;
}
.z-label.ROLE_PARTICIPANT /* participant */
{
}
.z-label.ROLE_USER /* user */
{
	color: #BBBBBB;
}
.z-label.ROLE_ANONYMOUS /* anonymous */
{
	color: #CCCCCC;
	background-color: #FFFAFA;
}

.grp_priority0,
.grp_priority0 .z-combobox-input,
.priority0.z-listcell /* supervisor */
{
	color: #CC1111;
	font-weight: bold;
}
.grp_priority1,
.grp_priority1 .z-combobox-input,
.priority1.z-listcell /* ghost */
{
	color: #BBBBBB;
	font-weight: bold;
}
.grp_priority2,
.grp_priority2 .z-combobox-input,
.priority2.z-listcell /* admin/modeator */
{
	color: #88DD88;
	font-weight: bold;
}
.grp_priority3,
.grp_priority3 .z-combobox-input,
.priority3.z-listcell /* recruiter */
{
	color: #DDDDFF;
}
.grp_priority4,
.grp_priority4 .z-combobox-input,
.priority4.z-listcell /* visitor */
{
	color: #6666BB;
}
.grp_priority5,
.grp_priority5 .z-combobox-inputinput,
.priority5.z-listcell /* participant */
{
}
.grp_priority6,
.grp_priority6 .z-combobox-input,
.priority6.z-listcell /* user */
{
	color: #BBBBBB;
}
.grp_priority99,
.grp_priority99 .z-combobox-input,
.priority99.z-listcell /* anonymous */
{
	color: #CCCCCC;
	background-color: #FFFAFA;
}

/* module_log */
.module_WrapMultipleModule
{
	border-bottom: solid;
	border-bottom-color: BLACK;
}

.y-small-tool-btn
{
	width: 26px;
	text-align: center;
}
.y-tool-btn
{
	min-width: 60px;
	text-align: center;
}
.y-tool-btn .z-icon
{
	font-size: 2.5ex;
	padding-top: 3px;
}
.breeze .y-tool-btn .z-icon
{
	font-size: 2.5ex;
}
.iceblue_c .y-tool-btn .z-icon
{
	font-size: 2.5ex;
}
.y-tool-btn:hover .z-icon
{
	color: #777777;
}
.y-buttonbar .y-tool-btn
{
	margin-left: 4px;
}


.badge
{
	float: right;
}

.z-window-icon.z-window-close:focus
{
	outline: auto;
}

.z-window-content
{
	padding: 0px;
}

.kiemelt
{
	font-weight: bold;
}

.validation_error
{
	color: #D04040;
	font-weight: bold;
}
.validation_warning
{
	color: #ff8000;
	font-weight: bold;
}

.z-textbox:focus,
.z-spinner-input:focus,
.z-spinner-input:focus+.z-spinner-button,
.z-checkbox>input:focus,
.z-combobox-input:focus,
.z-combobox-input:focus+.z-combobox-button,
.z-datebox-input:focus,
.z-timebox-input:focus,
.z-paging-input:focus
{
	border-color: #00b9ff !important;
	box-shadow: inset 0 0 2px #0cbcff !important;
}

.iceblue_c .z-textbox:focus,
.iceblue_c .z-spinner-input:focus,
.iceblue_c .z-spinner-input:focus+.z-spinner-button,
.iceblue_c .z-checkbox>input:focus,
.iceblue_c .z-combobox-input:focus,
.iceblue_c .z-combobox-input:focus+.z-combobox-button,
.iceblue_c .z-datebox-input:focus,
.iceblue_c .z-timebox-input:focus,
.iceblue_c .z-paging-input:focus
{
	border-color: #ffa516 !important;
	box-shadow: inset 0 0 2px #ffb020 !important;
}

.breeze .z-combobox-input:focus+*,
.breeze .z-bandbox-input:focus+*,
.breeze .z-datebox-input:focus+*,
.breeze .z-timebox-input:focus+*,
.breeze .z-spinner-input:focus+*,
.breeze .z-doublespinner-input:focus+*
{
	border-left: solid 1px #00b9ff;
}

.iceblue_c .z-combobox-input:focus+*,
.iceblue_c .z-bandbox-input:focus+*,
.iceblue_c .z-datebox-input:focus+*,
.iceblue_c .z-timebox-input:focus+*,
.iceblue_c .z-spinner-input:focus+*,
.iceblue_c .z-doublespinner-input:focus+*
{
	border-left: solid 1px #ffa516;
}

/* ymenutree */

.ymenutree img
{
	height: 16px;
}

/* flipchart */
.y-flipchart
{
}

.y-flipchart .y-flipchart-area
{
	background-color: #F8F8F8;
	padding: 4px;
}

.y-flipchart .z-anchorchildren
{
	padding: 3px;
}

.y-flipchart .z-anchorchildren span
{
	border-radius: 3px;
	white-space: nowrap;
}

.y-flipchart .z-anchorchildren.selected span
{
	background-color: #FFFF40;
	border: solid 2px BLUE;
}

.y-flipchart .z-anchorchildren .z-label
{
	border: solid 1px #444444;
	background-color: #DDDDF0;
	padding: 0 4px;
}
.y-flipchart .z-icon
{
	font-size: 2.5ex;
}

.y-flipchart-area input.z-textbox
{

}

/* guide list */
.y-guidetree .z-icon
{
	zoom: 1.4;
}

.y-guidetree .z-treecell
{
	white-space: nowrap;
}

.y-guidetree .z-treerow.section .z-treecell,
.y-guidetree .z-listitem.section .z-listcell-content
{
	background-color: #FFEEEE;
}

.y-guidetree .z-treerow.highlighted .z-treecell,
.y-guidetree .z-listitem.highlighted .z-listcell-content
{
	background-color: #EEEEEE;
}
.y-guidetree .z-treerow.highlighted .z-treecell-content,
.y-guidetree .z-listitem.highlighted .z-listcell-content
{
	color: SILVER;
}
.y-guidetree .z-treerow.highlighted .z-html.MULTI_TEXT
{
	color: #636363;
}

/* transcript */
.y-transcript .z-html
{
	color: #222222;
}

.y-transcript .top
{
	vertical-align: top;
}

/*
.y-transcript.align_right .log-ROLE_PARTICIPANT
{
	float: right;
}
*/
.y-transcript .log-ROLE_SUPERVISOR
{
	color: #000000;
	font-weight: bold;
}
.y-transcript .log-ROLE_SUPERVISOR strong,
.y-transcript .log-ROLE_SUPERVISOR b,
.y-transcript .log-ROLE_MODERATOR strong,
.y-transcript .log-ROLE_MODERATOR b
{
	color: white;
	text-shadow: -0.5px -0.5px 0 #000, 0 -0.5px 0 #000, 0.5px -0.5px 0 #000, 0.5px 0 0.5px #000, 0.5px 0.5px 0.5px #000, 0 0.5px 0.5px #000, -0.5px 0.5px 0 #000, -0.5px 0 0 #000;
}
.y-transcript .nick
{
	padding: 2px 1px;
	background-color: lightcyan;
	font-weight: bold;
}
.y-transcript .log-ROLE_SUPERVISOR .nick
{
	color: #CC2222;
	text-shadow: unset;
}

.y-transcript .log-ROLE_MODERATOR
{
	font-weight: bold;
}

.y-transcript .log-ROLE_GHOST
{
	color: #6666AA;
	background-color: #EEEEEE;
}

.y-transcript .log-ROLE_VISITOR
{
	color: #6666AA;
	background-color: #EEEEEE;
}

.y-transcript .log-SERVICE
{
	color: #999999;
}

.y-transcript .service .nick
{
	color: #CC9999;
}


/* avatar selector */
.y-avatars
{
	padding: 16px 16px 0px 16px;
}
.y-avatars .bordered
{
	border: inset 1px;
}
.y-avatars .avatarbox
{
	overflow: auto;
	height: 0px;
}
.y-avatars .avatar
{
	width: 66px;
	height: 66px;
	display: inline-block;
	padding: 5px;
	text-align: center;
}

.y-avatars .avatar.selected
{
	background: #CCCCFF;
	border-radius: 5px;
}

.y-avatars .avatar img
{
	max-width:56px;
	height:56px;
}


/* user list */
.y-users
{
}
.y-users .avatar,
.y-users .z-comboitem-image img
{
	height: 38px;
	margin: 1px;
}

.y-users .z-hlayout.userinfo .z-hlayout-inner
{
	vertical-align: middle;
}

.y-users .z-listcell-content,
.y-users .z-comboitem-text,
.y-users .z-comboitem-content,
.y-users .z-comboitem-inner
{
	padding: 0;
	line-height: 19px;
}
.y-users.z-comboitem
{
	border-radius: 4px;
}

.y-users .z-comboitem-image
{
	margin-top: -1px;
	min-width: 38px;
	max-width: none;
	max-height: none;
}

.y-users .statusline.z-hlayout
{
	padding: 0;
	background-color: #EEEEEE;
	line-height: 16px;
	font-size: 10px;
}
.y-users .statusline .z-label,
.y-users .statusline .z-typingstate
{
	font-size: 11px;
	white-space: nowrap;
}

.y-sendbuttons .z-toolbarbutton
{
	text-align: center;
}

.y-sendbuttons .z-toolbarbutton i
{
	vertical-align: text-top;
}

/* file_browser */
.file_browser
{
}

.file_browser .bad,
.file_browser .bad>.z-row-inner,
.file_browser .bad>.z-listcell
{
	background-color: #FFEEEE;
}

.file_browser .bad.z-grid-odd>.z-row-inner,
.file_browser .bad.z-listbox-odd>.z-listcell
{
	background-color: #FFE8E8;
}

.file_browser .good,
.file_browser .good>.z-row-inner,
.file_browser .good>.z-listcell
{
	background-color: #EEFFEE;
}

.file_browser .good.z-grid-odd>.z-row-inner,
.file_browser .good.z-listbox-odd>.z-listcell
{
	background-color: #E8FFE8;
}

.file_browser .z-icon
{
	font-size: 2.5ex;
}

.file_browser .path
{
	padding: 4px;
}

.file_browser .path .z-label
{
	position: relative;
	top: 5px;
	padding: 6px;
}

/* button icon colors */
.btn-new .z-icon:before,
.btn-plus .z-icon:before,
.btn-ok .z-icon:before
{
	color: #40D040;
	text-shadow:
		0px  0px 0.3px #40D040;
	font-size: 1.3em;
}
.btn-edit .z-icon:before
{
	color: #F0D000;
	text-shadow:
		0px  0px 0.3px #000,
		0px  0px 0.3px #000,
		0px  0px 0.3px #000,
		0px  0px 0.3px #000
		;
	font-size: 1.3em;
}
.btn-refresh .z-icon:before
{
	text-shadow:
		.3px  .3px 0px rgba(255,255,255,1),
		-.3px -.3px 0px rgba(128,128,128,1)
		;
	font-size: 1.3em;
}
.y-open-rooms-tree .btn-delete .z-icon:before,
.btn-delete .z-icon:before,
.btn-cancel .z-icon:before,
.btn-minus .z-icon:before,
.btn-close .z-icon:before
{
	color: #D04040;
	text-shadow: 0px  0px 0.3px #D04040;
	font-size: 1.3em;
}
.y-open-rooms-tree .z-treecell
{
	white-space: nowrap;
}
.y-open-rooms-tree .project.z-treecell,
.y-open-rooms-tree .project .z-treecell
{
	border-top: SOLID 1px #F0F0F0;
	border-bottom: SOLID 1px #EEEEEE;
	background: #F4F4F4;
}

.z-grid .z-toolbarbutton.btn-new,
.z-grid .z-toolbarbutton.btn-ok,
.z-grid .z-toolbarbutton.btn-edit,
.z-grid .z-toolbarbutton.btn-delete,
.z-grid .z-toolbarbutton.btn-refresh,
.z-grid .z-toolbarbutton.btn-cancel,
.z-grid .z-toolbarbutton.btn-close,
.z-grid .z-toolbarbutton.btn-plus,
.z-grid .z-toolbarbutton.btn-minus,
.z-listbox .z-toolbarbutton.btn-new,
.z-listbox .z-toolbarbutton.btn-ok,
.z-listbox .z-toolbarbutton.btn-edit,
.z-listbox .z-toolbarbutton.btn-delete,
.z-listbox .z-toolbarbutton.btn-refresh,
.z-listbox .z-toolbarbutton.btn-cancel,
.z-listbox .z-toolbarbutton.btn-close,
.z-listbox .z-toolbarbutton.btn-plus,
.z-listbox .z-toolbarbutton.btn-minus
{
	width: 26px;
	text-align: center;
}

/* icon sclass colors */
a.z-a>i[class^="z-icon"]:before,
a.z-a>i[class*=" z-icon"]:before,
span.z-span[class^="z-icon"]:before,
span.z-span[class*=" z-icon"]:before
{
	color: #808080;
}
a.z-a.red>i[class^="z-icon"]:before,
a.z-a.red>i[class*=" z-icon"]:before,
span.z-span.red[class^="z-icon"]:before,
span.z-span.red[class*=" z-icon"]:before
{
	color: #D04040;
}
a.z-a.green>i[class^="z-icon"]:before,
a.z-a.green>i[class*=" z-icon"]:before,
span.z-span.green[class^="z-icon"]:before,
span.z-span.green[class*=" z-icon"]:before
{
	color: #50D050;
}
a.z-a.blue>i[class^="z-icon"]:before,
a.z-a.blue>i[class*=" z-icon"]:before,
span.z-span.blue[class^="z-icon"]:before,
span.z-span.blue[class*=" z-icon"]:before
{
	color: #A0A0FF;
}
a.z-a.orange>i[class^="z-icon"]:before,
a.z-a.orange>i[class*=" z-icon"]:before,
span.z-span.orange[class^="z-icon"]:before,
span.z-span.orange[class*=" z-icon"]:before
{
	color: #F0B060;
}

.z-west .z-toolbar .z-a
{
	float: right;
}

.y-buttonbar .z-toolbar-start
{
	float: right;
}

.outline
{
	text-shadow:
		-1px -1px 0 #000,
		0   -1px 0 #000,
		1px -1px 0 #000,
		1px  0   6px #000,
		1px  1px 4px #000,
		0    1px 4px #000,
		-1px  1px 0 #000,
		-1px  0   0 #000;
}

/* misc util classes */
.nowrap
{
	white-space: nowrap;
}

.noselect
{
	cursor: url('/images/amiga.cur'),auto;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.narancs,
.narancs .z-listcell-content
{
	color: #FFB000;
}

.szurke,
.szurke .z-listcell-content
{
	color: #E4E4E4;
}

.szurke2,
.szurke2 .z-listcell-content
{
	color: #C0C0C0;
}

.icon-info i:before
{
	color: YELLOW;
	font-size: 8em;
	width: 40px;
	height: 40px;
}

/* admin: section edit button */
.admin .section .z-button
{
	display: none;
}
.admin .section:hover .z-button
{
	display: inline-block;
}
.admin .first_cell
{
	border-left: none;
}
.admin .z-listheader
{
	border-left: none;
}
.admin .z-auxheader
{
	border-right: none;
}

.required:after
{
	vertical-align: super;
  font-size: 0.9em;
	color: RED;
	content: '*';
}

/*-------------------------------------
-- DnD target decorations and bugfix --
-------------------------------------*/
.z-drop-text
{
	white-space: nowrap;
}

/* guide_details */
/* orange for dragged item */
.z-listitem.z-dragged *,
.z-hlayout.z-dragged
{
	background-color: #FFE0C0;
}
/* RED for dragged item hover */
.z-listitem.z-dragged:hover *,
.z-hlayout.z-dragged:hover
{
	background-color: #FFC0C0;
}

/* bugfix for dragged section height */
.guide_details .section
{
	height: 20pt;
}
/* highlight section/item insert target */
.guide_details .dnd_target_insert.z-drag-over .z-listcell
{
	border-top: solid 1px RED;
	cursor: w-resize !important;
}
.guide_details .dnd_target_insert.z-drag-over .z-row-inner .section
{
	border-top: solid 1px RED;
	background-color: #C0FFC0;
	cursor: w-resize !important;
}
.guide_details .dnd_target_insert.z-drag-over .z-row-inner .section.z-dragged
{
	border-top: none;
	background-color: #FFC0C0;
	/* dont works! */
	cursor: not-allowed !important;
}
/* no highlight embedded subtargets */
.guide_details .dnd_target_insert.z-drag-over .dnd_target_insert .z-listcell
{
	border-top: none;
}
.guide_details .dnd_target_append.z-drag-over
{
	cursor: s-resize !important;
}
/* highlight append target */
.guide_details .dnd_target_append.z-drag-over .z-listbox-body:before,
.guide_details .dnd_target_append.z-drag-over.z-toolbar:before
{
	border-top: solid 1px RED;
	content: '--- append ---';
	font-family: monospace;
	color: #888;
	background-color: #C0FFC0;
	display: block;
	text-align: center;
	cursor: not-allowed !important;
}
.guide_details .dnd_target_append.z-drag-over .z-listbox-body:hover:before,
.guide_details .dnd_target_append.z-drag-over.z-toolbar:hover:before
{
	background-color: #FFC0C0;
}
/* no highlight embedded subtargets */
.guide_details .dnd_target_append.z-drag-over .dnd_target_append .z-listbox-body:after
{
	border-top: none;
	content: '';
	display: none;
}
.z-drag-over .z-button,
.z-drag-over .z-toolbarbutton
{
	display: none;
}

/* game item target insert area */
.gm_items .dnd_target_insert.z-drag-over
{
	border-top: solid 1px RED;
	cursor: w-resize !important;
}

/* game item target append area */
.gm_items .dnd_target_append.z-drag-over:before
{
	cursor: s-resize !important;
	border-top: solid 1px RED;
	content: '--- append ---';
	background: #C0F0FF;
	font-family: monospace;
	color: #888;
	display: block;
	text-align: center;
}

#zk_ddghost .z-button
{
	display: none;
}

#zk_ddghost.z-drag-ghost
{
	background: #FFe8d0;
	border: solid 1px #e0e0e0;
	padding: 4px 0px 2px 0;
}
/* ZK DnD
#zk_ddghost.z-drag-ghost:before
{
	font-family: FontAwesome;
	content: '\0f0dc';
	padding: 4px;
}

* dragged object
.z-dragged

* drop target area:
.z-drag-over

* shadow structure (dropped visual object):

div#zk_ddghost.z-{drop|drag}-ghost.z-drop-allow
 div.z-drop-content
  span#zk_ddghost-img.z-drop-icon.z-icon-plus-circle.z-icon-check
	 :before
  span.z-drop-text

div#zk_ddghost.z-drop-ghost.z-drop-disallow
 div.z-drop-content
  span#zk_ddghost-img.z-drop-icon.z-icon-ban.z-icon-times
	 :before
  span.z-drop-text

*/
/************
** END DnD **
************/

.z-icon-pencil:before
{
	color: #F0D000;
	text-shadow:
		0px  0px 0.3px #000,
		0px  0px 0.3px #000,
		0px  0px 0.3px #000,
		0px  0px 0.3px #000
		;
}
.z-icon-trash:before
{
	color: #D04040;
}

.y-input-button input
{
	border: solid 1px #CFCFCF;
	border-radius: 4px 0px 0px 4px;
	border-right: none;
}

.y-input-button button
{
	border: solid 1px #CFCFCF;
	border-radius: 0px 4px 4px 0px;
}

.admin .y-admin-icon
{
	font-size: 20px;
	text-align: center;
	padding-top: 9px;
	width: 32px;
	height: 32px;
}

.y-gameadmin
{
	overflow: auto;
}

.y-gameadmin .editable
{
	background-color: #EEFFEE;
	border: solid 1px #444444;
	border-radius: 6px;
	padding: 8px;
}
.y-gameadmin .not_editable
{
	background-color: #FFEEEE;
	border: solid 1px #AA4444;
	border-radius: 6px;
	padding: 8px;
}
/******************
* BEGIN imageitem *
******************/
.y-gamewindow
{
	background-color: #CCFFCC;
}
.y-gamewindow.red
{
	background-color: #FFCCCC;
}
/******************
* END imageitem *
******************/
/******************
* BEGIN imageitem *
******************/
.y-imageitem
{
	display: inline-block;
	position: relative;
	text-align: center;
	width: calc(var(--picSize) * 1px);
	height: calc(var(--picSize) * 1px);
	border: solid 2px rgba(0,0,0,0.1);
}
.y-imageitem.y-zoomable:hover
{
	border: solid 2px ORANGE;
}
.y-imageitem.y-zoomable.red:hover
{
	border: solid 2px RED;
}
.y-imageitem img
{
	position: absolute;
}
.y-imageitem .z-label
{
	color: BLACK;
	font-size: calc(var(--picSize) * 0.09px);
	background: rgba(208,208,208,0.7);
	overflow-wrap: break-word;
	white-space: normal;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	padding: 4px;
}
.y-imageitem .z-label.y-textitem
{
	position: absolute;
	top: auto;
	bottom: auto;
	transform: translateY(-50%);
	top: 50%;
	width: calc(var(--picSize) * 1px - 4px);
	max-height: calc(var(--picSize) * 1px - 4px);
	margin: auto;
}
.y-imageitem .z-toolbarbutton
{
	background: rgba(208,208,208,0.7);
	position: relative;
	float: right;
	border-radius: 28px;
	top: calc(var(--picSize) * 1px - 33px);
	width: 28px;
	margin: 0 2px;
	z-index: 1;
}
.y-imageitem .z-textbox
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 2;
	max-width: calc(var(--picSize) * 1px);
	max-height: calc(var(--picSize) * 1px);
}
.y-imageitem.z-dragged
{
	border-color: RED;
}

.dnd_target_insert_imageitem.y-imageitem.z-drag-over
{
	border-left-color: LIME;
}
.y-imageitem.z-drag-ghost
{
	--picSize: 140;
}
.z-anchorlayout.dnd_target_append_imageitem.z-drag-over,
.z-grid .dnd_target_append_imageitem.z-drag-over
{
	background: unset;
}
.z-anchorlayout.dnd_target_append_imageitem.z-drag-over>:last-child>.y-imageitem,
.z-grid .dnd_target_append_imageitem.z-drag-over td:last-child>*>.y-imageitem
{
	border-right: solid 2px LIME;
}
.z-anchorlayout.dnd_target_append_imageitem.z-drag-over,
.z-grid.dnd_target_append_imageitem.z-drag-over .z-row > .z-row-inner > .z-row-content
{
	background-color: #C0F0FF;
}
.z-grid.dnd_target_append_imageitem.z-drag-over:before
{
	content: '+';
	font-family: monospace;
	font-size: calc(var(--picSize) * 1px);
	padding-top: calc(var(--picSize) * 0.4px);
	text-align: center;
	float: right;
	display: block;
	width: calc(var(--picSize) * 1px);
	height: calc(var(--picSize) * 1px);
	border: dashed 2px ORANGE;
	margin: 4px;
}
.z-anchorlayout.dnd_target_append_imageitem.z-drag-over:after
{
	content: '+';
	font-family: monospace;
	font-size: calc(var(--picSize) * 1px);
	padding-top: calc(var(--picSize) * 0.4px);
	text-align: center;
	display: inline-block;
	width: calc(var(--picSize) * 1px);
	height: calc(var(--picSize) * 1px);
	border: dashed 2px ORANGE;
}
.dnd_target_area.z-drag-over
{
	background-color: rgba(0,128,0,0.3);
}
.y-imageitem.dnd_target_area.z-drag-over
{
	border-color: LIME;
}
.y-imageitem.z-drag-ghost .z-toolbarbutton,
.y-imageitem.z-drag-ghost .z-textbox
{
	display: none;
}
/****************
* END imageitem *
****************/

/************************
* BEGIN game FaceSelect *
************************/
.gmFaceSelect .scrollpanel .scrollitems .scrollitem img,
.gmFaceSelect .scrollpanel .scrollitems .scrollitem .z-label
{
	cursor: pointer;
	border: none;
	background-color: #F2F8FF;
	border: solid 3px WHITE;
	width: calc(var(--picSize) * 1px);
}
.gmFaceSelect .scrollpanel .scrollitems .scrollitem.selected img,
.gmFaceSelect .scrollpanel .scrollitems .scrollitem.selected .z-label
{
	border: solid 3px LIME;
}
.gmFaceSelect .scrollpanel .scrollitems .scrollitem:hover img,
.gmFaceSelect .scrollpanel .scrollitems .scrollitem:hover .z-label
{
	border: solid 3px ORANGE;
}
/* h/v layout manager */
.gmFaceSelect .vlayout .viewpanel
{
	position: absolute;
	top: 0;
	bottom: 0;
	left: calc(var(--picSize) * 1px);
	right: 0;
}
.gmFaceSelect .hlayout .viewpanel
{
	position: absolute;
	top: 0;
	bottom: calc(var(--picSize) * 0.7px);
	left: 0;
	right: 0;
}
/**********************
* END game FaceSelect *
**********************/

/******************
* BEGIN game Pair *
******************/
/* h/v layout manager */
.gmPair .vlayout anchorlayout
{
}
.gmPair .vlayout .viewpanel
{
	position: absolute;
	top: 0;
	bottom: 0;
	left: calc(var(--picSize) * 2px + 28px);
	right: 0;
}
.gmPair .hlayout .viewpanel
{
	position: absolute;
	top: 0;
	bottom: calc(var(--picSize) * 1px);
	left: 0;
	right: 0;
}
/****************
* END game Pair *
****************/

/*******************
* BEGIN game Order *
*******************/
/* h/v layout manager */
.gmOrder .vlayout anchorlayout
{
}
.gmOrder .vlayout .viewpanel
{
	position: absolute;
	top: 0;
	bottom: 0;
	left: calc(var(--picSize) * 2px + 28px);
	right: 0;
}
.gmOrder .hlayout .viewpanel
{
	position: absolute;
	top: 0;
	bottom: calc(var(--picSize) * 1px);
	left: 0;
	right: 0;
}
/*****************
* END game Order *
*****************/

/**********************
* BEGIN game BrandMap *
**********************/
/* h/v layout manager */
.gmBrandMap anchorlayout.vlayout
{
}
/********************
* END game BrandMap *
********************/

/****************
* BEGIN game SD *
****************/
/* h/v layout manager */
.gmSD .noUi-vertical
{
	margin-right: 4px;
	align-self: center;
}
.gmSD .noUi-pips-vertical
{
	width: 25px;
}
.y-sd-diagram
{
	border: solid 1px SILVER;
	padding: 4px;
	width: calc((var(--picSize) - 8) * 1px);
}
.y-sd-diagram-x2
{
	border: solid 1px SILVER;
	padding: 4px;
	width: calc((var(--picSize) - 0)* 2px);
}
.y-sd-diagram .legend
{
	width: calc(var(--picSize) * 1px);
	height: calc(var(--picSize) * 0.25px);
}
.y-sd-diagram .legend .rotate
{
	width: calc(var(--picSize) * 0.25px);
	height: calc((var(--picSize) - 2) * 1px);

	text-align: right;
	position: absolute;
	left: calc(((var(--picSize)/2) * 1px) - (var(--picSize) * 0.125px));
	bottom: calc(2px + ((var(--picSize)/2) * -1px) + (var(--picSize) * 0.125px));
	padding-top: 2px;
	padding-bottom: 2px;
}
.y-sd-diagram .bars
{
	background-color: LIGHTBLUE;
	border-bottom: solid 1px LIGHTBLUE;
}
.y-sd-diagram .slider,
.y-sd-diagram-x2 .slider
{
	background-color: LIGHTBLUE;
	width: 100%;
	height: 12px;
}
.y-sd-diagram .slider .bar,
.y-sd-diagram-x2 .slider .bar
{
	background: GREEN;
	height: 12px;
	border-left: solid 1px BLACK;
	width: calc();
}
.y-sd-diagram .slider .bar.negative,
.y-sd-diagram-x2 .slider .bar.negative
{
	background: RED;
	border-right: solid 1px BLACK;
	border-left: unset;
}
.y-sd-diagram .z-label
{
	display: block;
	font-size: calc(var(--picSize) * 0.09px);
}
/**************
* END game SD *
**************/

/********************
* BEGIN scrollpanel *
********************/
.vlayout
{
	height: 100%;
}
.hlayout
{
	width: 100%;
}
.vlayout .scrollpanel
{
	width: calc(var(--picSize) * 1px);
	height: 100%;
}
.hlayout .scrollpanel
{
	width: 100%;
	height: 100%;
	position: absolute;
	bottom: 0;
}

.vlayout .scrollpanel .scrollitems
{
	width: 100%;
	height: 100%;

	overflow-y: scroll;
	scroll-snap-type: y mandatory;
}
.hlayout .scrollpanel .scrollitems
{
	position: absolute;
	width: 100%;
	height: calc(var(--picSize) * 0.7px);
	bottom: 0;

	overflow-x: scroll;
  scroll-snap-type: x mandatory;

  display: flex;
  flex-wrap: nowrap;
}

.vlayout .scrollpanel .scrollitems .scrollitem,
.vlayout .scrollpanel .scrollitems .y-imageitem
{
	width: 100%;
}
.vlayout .scrollpanel .scrollitems .scrollitem:first-of-type
{
	margin-top: 38px;
}
.vlayout .scrollpanel .scrollitems .scrollitem:last-of-type
{
	margin-bottom: 40px;
}
.hlayout .scrollpanel .scrollitems .scrollitem:first-of-type :first-child
{
	margin-left: 38px;
}
.hlayout .scrollpanel .scrollitems .scrollitem:last-of-type :first-child
{
	margin-right: 40px;
}
.hlayout .scrollpanel .scrollitems .scrollitem,
.hlayout .scrollpanel .scrollitems .y-imageitem
{
	flex: 0 0 auto;
	height: 100%;
	display: contents;
}

.vlayout .scrollpanel .scrollitems img,
.vlayout .scrollpanel .scrollitems .z-label
{
	max-width: 100%;
	border: solid 3px WHITE;
}
.hlayout .scrollpanel .scrollitems img
{
	max-height: 100%;
	border: solid 3px WHITE;
}

.scrollpanel .scrollitems img[width]
{
	width: auto; /* Defer to max-width */
}
.scrollpanel .scrollitems img[width][height]
{
	height: auto; /* Preserve aspect ratio */
}
.scrollpanel .scrollitems img.center
{
	scroll-snap-align: center;
	max-height: 100%;
	max-width: 100%;
	width: auto;
	height: auto;
	position: relative;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.scrollpanel .scrollitems .z-label
{
	display: block;
	text-align: center;
	padding: 4px;
	overflow: clip;
}
.vlayout .scrollpanel .scrollitems .z-label
{
	width: 100%;
	height: calc(var(--picSize) * 0.8px - 20px);
}
.hlayout .scrollpanel .scrollitems .z-label
{
	min-width: calc(var(--picSize) * 0.8px);
	height: 100%;
	border: solid 3px WHITE;
}

.scrollpanel .arrow
{
	cursor: pointer;
	font: normal normal normal 14px/1 FontAwesome;
	position: absolute;
	color: rgba(32, 32, 32, 0.4);
	font-size: 2em;
	text-align: center;
	padding: 0.3em;
}
.scrollpanel .arrow:hover
{
	background-color: rgba(128, 128, 128, 0.7);
	color: rgba(128, 128, 255, 0.7);
}

.vlayout .scrollpanel .arrow
{
	width: calc(var(--picSize) * 1px - 14px);
	height: 1.6em;
	left: 0;
}
.vlayout .scrollpanel .arrow-prev
{
	top: 0;
	background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.vlayout .scrollpanel .arrow-next
{
	bottom: 0;
	background: -moz-linear-gradient(bottom, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(bottom, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to top, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.vlayout .scrollpanel .arrow-prev:hover
{
	top: 0;
	background: -moz-linear-gradient(top, rgba(171,221,240,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top, rgba(171,221,240,1) 0%, rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, rgba(171,221,240,1) 0%, rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.vlayout .scrollpanel .arrow-next:hover
{
	bottom: 0;
	background: -moz-linear-gradient(bottom, rgba(171,221,240,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(bottom, rgba(171,221,240,1) 0%, rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to top, rgba(171,221,240,1) 0%, rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.vlayout .scrollpanel .arrow-prev:before
{
	content: "\f077";
}
.vlayout .scrollpanel .arrow-next:before
{
	content: "\f078";
}

.hlayout .scrollpanel .arrow
{
	width: 1.6em;
	height: calc(var(--picSize) * 0.7px - 20px);
	bottom: 13px;
	padding: calc(var(--picSize) * 0.2px) 0;
}
.hlayout .scrollpanel .arrow-prev
{
	left: 0;
	background: -moz-linear-gradient(left, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.hlayout .scrollpanel .arrow-next
{
	right: 0;
	background: -moz-linear-gradient(right, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(right, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to left, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.hlayout .scrollpanel .arrow-prev:hover
{
	left: 0;
	background: -moz-linear-gradient(left, rgba(171,221,240,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, rgba(171,221,240,1) 0%, rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, rgba(171,221,240,1) 0%, rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}
.hlayout .scrollpanel .arrow-next:hover
{
	right: 0;
	background: -moz-linear-gradient(right, rgba(171,221,240,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(right, rgba(171,221,240,1) 0%, rgba(255,255,255,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to left, rgba(171,221,240,1) 0%, rgba(255,255,255,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
}

.hlayout .scrollpanel .arrow-prev:before
{
	content: "\f053";
}
.hlayout .scrollpanel .arrow-next:before
{
	content: "\f054";
}
/******************
* END scrollpanel *
******************/

/******************
* BEGIN ZoomImage *
******************/
.z-zoomimage
{
	cursor: pointer ;
	cursor: move;
	cursor: all-scroll ;
	border: solid 3px transparent;
}
.z-zoomimage.selected
{
	border-color: LIME;
}
/****************
* END ZoomImage *
****************/