html{width:100%; height:100%;margin:0;padding:0;overflow-y:scroll;-webkit-user-select:none}
::-webkit-scrollbar-track {background: none;}
::-webkit-scrollbar-thumb {background: #bbb; }
::-webkit-scrollbar {width: 8px; height: 8px; background-color:#EEEEEE;}
::-webkit-scrollbar-thumb:hover {background: #444; }

body{width:100%; height:100%;margin:0;padding:0;}

form, p {margin:0px;padding:0px;-webkit-user-select:none}

input, select, textarea{outline: none;margin:0px; color:#555}

form{}
form input:not([type]), form input[type="password"], textarea{border:1px #ccc solid;width:200px;padding:5px; font:13px "Segoe UI",Verdana}


form input[readonly] {border:none;margin:1px;cursor:default}

form input[disabled]{border:none;margin:1px;background-color:#fff;}
form hr.line{border:1px #eee solid;border-width:0px 0px 1px 0px;margin:2px 0px 12px 0px;overflow:hidden}
form hr.break{height:1px;overflow:hidden;border:none}

label{white-space:nowrap;display:inline-block;padding-bottom:10px;font:13px "Segoe UI";line-height:30px;}
label span.label{display:inline-block;width:120px;vertical-align:top;text-align:right;padding-right:20px;}
label span.err-msg{display:none;color:#f66;text-align:left;padding-left:10px}
input:invalid{border-color:#666 ! important}
input:invalid ~ .err-msg{display:inline-block}


.eos-header-wrap{position:fixed;background-color:#3C454F;z-index:100;left:50%;width:1160px;margin-left:-580px;height:50px;}
.eos-header{color:#fff;}

.eos-footer-wrap{position:fixed;background:#313842;z-index:100;left:50%;bottom:0px;width:1160px;margin-left:-580px;height:60px;overflow:hidden}
.eos-footer{color:#fff;}

.eos-menu-wrap{position:fixed;left:50%;width:200px;margin-left:-580px;top:50px;bottom:59px;background-color:#71B1D1;z-index:99;overflow:hidden}
.eos-menu{padding-top:20px;}

.eos-submenu-wrap{position:fixed;left:-webkit-calc(50% + 50px);width:150px;margin-left:-580px;top:50px;bottom:59px;background-color:#caebfc;z-index:99;overflow:hidden;padding-top:30px;-webkit-user-select:none}
.eos-submenu{font-size:12px;;cursor:pointer;color:#7f7f7f;padding:10px;margin-left:5px;border-radius:15px 0px 0px 15px}
.eos-submenu.selected{color:#5191b1;background-color:#fff}


.eos-submenu .icon16{background-color:#7F7F7F;margin-right:5px;}
.eos-submenu.selected .icon16{background-color:#5191b1;margin-right:5px;}


.eos-background{position:fixed;left:50%;width:1160px;margin-left:-580px;min-height:100%;background-color:#eee;box-shadow:0px 0px 85px rgba(0,0,0,0.3);background-color:#fff}

.eos-main-wrap{position:absolute;left:50%;width:1160px;margin-left:-580px;padding-top:50px;padding-bottom:59px;height:100%;box-sizing:border-box;}
.eos-main{position:relative;padding: 110px 20px 50px 220px;height:100%;box-sizing:border-box;}
.eos-main.expand{padding-left:70px}

.eos-head-wrap{position:fixed;left:50%;width:1160px;margin-left:-580px;top:50px;background-color:#fff;z-index:98;}
.eos-head{padding:20px 20px 0px 220px;color:#444;}
.eos-head.expand{padding-left:70px}

.eos-title{font-size:28px;font-family:"Segoe UI Light";margin-bottom:10px}


.eos-foot-wrap{position:fixed;left:50%;width:1160px;margin-left:-580px;bottom:59px;height:35px;background-color:#fff;z-index:98;background-color:#fff;border-top:1px #eee solid}
.eos-foot{padding:10px 20px 0px 220px;color:#444;}
.eos-foot.expand{padding-left:70px}


.eos-menu-list{padding:0;margin:0;}
.eos-menu-item{position:relative; list-style-type:none;}
.eos-menu-item a{display:block;height:50px;text-decoration:none;font-weight:bold}
.eos-menu-item a:hover{background-color:#7CC1DE}

.eos-menu-item .eos-menu-image{margin-top:8px;margin-left:12px;background-color:#fff}
.eos-menu-item .eos-menu-title{position:absolute; left: 55px; top:10px; color: white}


.eos-contents{position:relative;width:100%;height:100%;}

.selected.eos-menu-item { }
.selected.eos-menu-item a{ background-color:#caebfc ;border-radius:20px 0px 0px 20px}
.selected.eos-menu-item a:hover{ }
.selected.eos-menu-item .eos-menu-image{background-color:#777 ! important;}
.selected.eos-menu-item .eos-menu-title{color: #3C444F;}

.selected.eos-menu-item[menu-id="home"] a{background-color:#fff}

.eos-search-wrap{position:absolute;right:0;margin-right:20px;margin-top:15px;}
.eos-search{padding-left:30px;background:url('../img/search_icon.gif') 0% -2px no-repeat #fff;border:1px #ccc solid;border-radius:5px}

.eos-dialog-bg{position:fixed;left:0;top:0;width:100%;height:100%;z-index:9995;background-color:#000;display:none}
.eos-dialog-frame{position:fixed;background-color:#fff;overflow:hidden;z-index:9999;left:50%;top:50%;box-shadow:0px 0px 32px rgba(255,255,255,0.5);display:none;min-width:400px;min-height:100px;border-top-right-radius:20px}

.eos-dialog-close{float:right; background:url('../img/icon_close.png') 50% 50% no-repeat; width:30px; height:30px; cursor:pointer; -webkit-filter:grayscale(1);margin:-15px -15px 0px 0px;}
.eos-dialog-close:hover{-webkit-filter:grayscale(0) drop-shadow(0px 0px 5px #CC3A3A); }

.eos-dialog-subtitle{color:#a5a5a5;font-size:12px;font-family:"Segoe UI Semibold";text-transform:uppercase;white-space:nowrap}
.eos-dialog-title{color:#505050;font-size:28px;font-family:"Segoe UI Light";line-height:40px;margin:5px 0px 20px 0px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.eos-dialog-contents{padding:20px;}


.eos-dialog-button-wrap{position:absolute;width:-webkit-calc(100% - 30px);height:40px;text-align:right;bottom:0px;}
	.eos-dialog-button-prev{background:url('../img/icon_wiz_prev.png') 50% 50% no-repeat;display:inline-block;width:30px;height:30px;margin-left:5px;cursor:pointer}
	.eos-dialog-button-next{background:url('../img/icon_wiz_next.png') 50% 50% no-repeat;display:inline-block;width:30px;height:30px;margin-left:5px;cursor:pointer}


	.eos-dialog-button-ok{background:url('../img/icon_ok.png') 50% 50% no-repeat;display:inline-block;width:30px;height:30px; margin-left:20px;cursor:pointer}

	.eos-dialog-button-prev[disable=true], .eos-dialog-button-next[disable=true], .eos-dialog-button-ok[disable=true] {opacity:0.4;cursor:default}

	.eos-dialog-button-prev:hover{-webkit-filter:grayscale(0) }


.eos-header-wrap select::-webkit-scrollbar {width: 0px;}


.eos-dialog-wizback{position:fixed;z-index:9999;left:50%;top:50%;border-top-right-radius:20px;;display:none;cursor:pointer;}
.eos-dialog-wizback:hover{-webkit-filter:brightness(0.1)}
.eos-dialog-wizback.wizback-1{background-color:#53B8E1}
.eos-dialog-wizback.wizback-2{background-color:#41A6D0}
.eos-dialog-wizback.wizback-3{background-color:#3095BF}
.eos-dialog-wizback.wizback-4{background-color:#1E83AE}

.eos-dialog-wizback .wizback-title-right{position:absolute; bottom:0; right:0; -webkit-writing-mode:vertical-rl;color:#fff;vertical-align:bottom;font-weight:bold;
		padding:10px 0px 10px 10px;font-size:14px;-webkit-transform:rotate(180deg);line-height:30px;}

.eos-dialog-wizback .wizback-title-left{position:absolute; left:0; bottom:0; -webkit-writing-mode:vertical-rl;color:#fff;vertical-align:bottom;font-weight:bold;
		padding:10px 0px 10px 0px;font-size:14px;-webkit-transform:rotate(180deg);line-height:30px;}








.fxs-command-center{
	text-align:center;
}

.fxs-command-right{float:right;text-align:right}
.fxs-command-left{float:left;}

div.fxs-command {
	border: 0px currentColor; width: 85px; height: 60px; color: rgb(255, 255, 255); font-size: 9px; cursor: pointer; background-color: transparent; display:inline-block; text-align:left
}
.fxs-command:hover {
	background-color: rgb(80, 88, 97);
}
div[disable=true].fxs-command {
	cursor: inherit;
	-webkit-filter: grayscale(1); opacity: 0.4; 
}

[disable=true].fxs-command:hover {
	background-color: inherit;
}
.fxs-command .fxs-command-text {
	padding: 0px 2px; text-align: center; text-transform: uppercase; line-height: 1em; word-wrap: break-word;margin-top:5px
}
.fxs-command .fxs-command-iconwrapper {
	padding-top: 2px;
}
.fxs-command .fxs-command-icon {
	margin: 0px auto; padding: 4px 0px 0px; width: 32px; height: 32px; overflow: hidden; position: relative;
}
.fxs-command .fxs-command-icon img {
	position: absolute;
}
.fxs-command .fxs-command-flyout {
	list-style: none; margin: 0px; padding: 0px; border-top-color: rgb(39, 170, 225); border-top-width: 3px; border-top-style: solid; display: none; position: absolute; background-color: rgb(73, 84, 97);
}
.fxs-command .fxs-command-flyout li {
	text-align: left;
}
.fxs-command-subcommandsvisible.fxs-command .fxs-command-flyout {
	display: block;
}
.fxs-command .fxs-command-flyout a {
	padding: 8px 12px; color: rgb(255, 255, 255); font-size: 10px; text-decoration: none; display: block;
}
.fxs-command .fxs-command-flyout a {
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=40); cursor: default; opacity: 0.4;
}
.fxs-command .fxs-command-flyout a[href] {
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); opacity: 1;
}
.fxs-command .fxs-command-flyout a[href]:hover {
	cursor: pointer; background-color: rgb(60, 69, 79);
}
.fxs-command-action-add.fxs-command .fxs-command-icon img {
	left: -257px; top: -3px;
}
.fxs-command-action-previous.fxs-command .fxs-command-icon img {
	left: -257px; top: -66px;
}
.fxs-command-action-close.fxs-command .fxs-command-icon img {
	left: -257px; top: -129px;
}
.fxs-command-action-blank.fxs-command .fxs-command-icon img {
	left: -257px; top: -192px;
}
.fxs-command-action-clock.fxs-command .fxs-command-icon img {
	left: -257px; top: -258px;
}
.fxs-command-action-copy.fxs-command .fxs-command-icon img {
	left: -257px; top: -322px;
}
.fxs-command-action-forward.fxs-command .fxs-command-icon img {
	left: -257px; top: -386px;
}
.fxs-command-action-download.fxs-command .fxs-command-icon img {
	left: -257px; top: -450px;
}
.fxs-command-action-edit.fxs-command .fxs-command-icon img {
	left: -257px; top: -514px;
}
.fxs-command-action-help.fxs-command .fxs-command-icon img {
	left: -257px; top: -579px;
}
.fxs-command-action-info.fxs-command .fxs-command-icon img {
	left: -257px; top: -642px;
}
.fxs-command-action-link.fxs-command .fxs-command-icon img {
	left: -257px; top: -706px;
}
.fxs-command-action-next.fxs-command .fxs-command-icon img {
	left: -257px; top: -770px;
}
.fxs-command-action-power.fxs-command .fxs-command-icon img {
	left: -257px; top: -834px;
}
.fxs-command-action-redo.fxs-command .fxs-command-icon img {
	left: -257px; top: -898px;
}
.fxs-command-action-reimage.fxs-command .fxs-command-icon img {
	left: -257px; top: -962px;
}
.fxs-command-action-connect.fxs-command .fxs-command-icon img {
	left: -257px; top: -1026px;
}
.fxs-command-action-repair.fxs-command .fxs-command-icon img {
	left: -257px; top: -1090px;
}
.fxs-command-action-undo.fxs-command .fxs-command-icon img {
	left: -257px; top: -1154px;
}
.fxs-command-action-save.fxs-command .fxs-command-icon img {
	left: -257px; top: -1219px;
}
.fxs-command-action-message.fxs-command .fxs-command-icon img {
	left: -257px; top: -1282px;
}
.fxs-command-action-play.fxs-command .fxs-command-icon img {
	left: -257px; top: -1346px;
}
.fxs-command-action-stop.fxs-command .fxs-command-icon img {
	left: -257px; top: -1410px;
}
.fxs-command-action-confirm.fxs-command .fxs-command-icon img {
	left: -257px; top: -1474px;
}
.fxs-command-action-sync.fxs-command .fxs-command-icon img {
	left: -257px; top: -1538px;
}
.fxs-command-action-delete.fxs-command .fxs-command-icon img {
	left: -255px; top: -1602px;
}
.fxs-command-action-unlink.fxs-command .fxs-command-icon img {
	left: -257px; top: -1666px;
}
.fxs-command-action-upload.fxs-command .fxs-command-icon img {
	left: -257px; top: -1729px;
}
.fxs-command-action-tools.fxs-command .fxs-command-icon img {
	left: -257px; top: -1793px;
}
.fxs-command-action-downloadpackage.fxs-command .fxs-command-icon img {
	left: -257px; top: -1857px;
}
.fxs-command-action-capture.fxs-command .fxs-command-icon img {
	left: -257px; top: -1922px;
}
.fxs-command-action-key.fxs-command .fxs-command-icon img {
	left: -257px; top: -1988px;
}
.fxs-command-action-metric.fxs-command .fxs-command-icon img {
	left: -257px; top: -2050px;
}
.fxs-command-action-offline.fxs-command .fxs-command-icon img {
	left: -257px; top: -2113px;
}
.fxs-command-action-online.fxs-command .fxs-command-icon img {
	left: -257px; top: -2177px;
}
.fxs-command-action-orderedlist.fxs-command .fxs-command-icon img {
	left: -257px; top: -2240px;
}
.fxs-command-action-group.fxs-command .fxs-command-icon img {
	left: -257px; top: -2303px;
}
.fxs-command-action-webmatrix.fxs-command .fxs-command-icon img {
	left: -257px; top: -2370px;
}
.fxs-command-action-visualstudio.fxs-command .fxs-command-icon img {
	left: -257px; top: -2434px;
}
.fxs-command-action-remoteconfig.fxs-command .fxs-command-icon img {
	left: -257px; top: -2497px;
}
.fxs-command-action-pause.fxs-command .fxs-command-icon img {
	left: -257px; top: -2562px;
}
.fxs-command-action-domains.fxs-command .fxs-command-icon img {
	left: -257px; top: -2624px;
}
.fxs-command-action-manageexternal.fxs-command .fxs-command-icon img {
	left: -257px; top: -2689px;
}
.fxs-command-action-connectioninfo.fxs-command .fxs-command-icon img {
	left: -257px; top: -2753px;
}
.fxs-command-action-dashboard.fxs-command .fxs-command-icon img {
	left: -257px; top: -2687px;
}
.fxs-command-action-additem.fxs-command .fxs-command-icon img {
	left: -257px; top: -2816px;
}
.fxs-command-action-publish.fxs-command .fxs-command-icon img {
	left: -257px; top: -2880px;
}
.fxs-command-action-unpublish.fxs-command .fxs-command-icon img {
	left: -257px; top: -2944px;
}
.fxs-command-action-encode.fxs-command .fxs-command-icon img {
	left: -257px; top: -3008px;
}
.fxs-command-action-upgrade.fxs-command .fxs-command-icon img {
	left: -257px; top: -3070px;
}
.fxs-command-action-contactsettings.fxs-command .fxs-command-icon img {
	left: -257px; top: -3135px;
}



.fxs-command-help{text-align:center;margin-top:13px;margin-bottom:9px;}




@-webkit-keyframes extras_pulse {
  0% { -webkit-transform:scale(1); }
  50% { -webkit-transform:scale(1.2); }
  100% { -webkit-transform:scale(1); }
}
@-webkit-keyframes extras_drive {
  0% { -webkit-transform:translate(0, 0); }
  49% { -webkit-transform:translate(300px, 0) rotateY(0deg); }
  50% { -webkit-transform:translate(300px, 0) rotateY(180deg); }
  99% { -webkit-transform:translate(0px, 0) rotateY(180deg); }
  100% { -webkit-transform:translate(0px, 0) rotateY(0deg); }
}
@-webkit-keyframes extras_load {
  0% { -webkit-transform:rotate(0deg); }
  100% { -webkit-transform:rotate(360deg); }
}
@-webkit-keyframes extras_antiload {
  0% { -webkit-transform:rotate(0deg); }
  100% { -webkit-transform:rotate(-360deg); }
}
.extras_drive {-webkit-animation:extras_drive 5s ease 5;}
.extras_pulse {-webkit-animation:extras_pulse 1.5s ease-out 10;}
.extras_load {-webkit-animation:extras_load 2s linear 10;}
.extras_anti-load {-webkit-animation:extras_antiload 4s linear 5;}
.extras_slow-load {-webkit-animation:extras_load 4s linear 5;}

#extras_loading-boggle {width:100px; height:100px; position:absolute;left:300px;top:300px;; z-index:10000;}
#extras_loading-boggle img {position:absolute; top:0; left:0;}






/* control list */

.list-column-wrap{border-bottom:2px #eee solid;margin-bottom:5px;cursor:pointer;}
.list-column{color:#111;background-color:#fff;border-right:1px #ccc solid;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding:0px 5px;display:inline-block;line-height:25px}
.list-column:hover, .list-icon:active{background-color:#eee}
.list-column.list-sort-asc:after{font:10px dotum;content:" ▲"}
.list-column.list-sort-desc:after{font:10px dotum;content:" ▼"}

.list-column.selected{background-color:#f7f7f7}

.list-item-wrap{line-height:30px;margin-bottom:1px;color:#323232;}
.list-item-wrap:hover{background-color:#f7f7f7}

.list-item{cursor:default;margin-right:1px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding:0px 5px;display:inline-block;line-height:40px;}
.list-icon{vertical-align: middle; opacity:0.4}
.list-icon:hover{opacity:1}

.list-item-wrap.ui-selected{color:#3A90aC;background-color:#E1F3FB}
.list-item-wrap.ui-selecting{color:#3A90aC;background-color:#E1F3FB}

.list-item-wrap .ui-icon{display:none;position:relative;top:5px;opacity:0.4}
.list-item-wrap:hover .ui-icon{display:inline-block;}
.list-item-wrap .ui-icon:hover{display:inline-block;opacity:0.8}


.list-sort-icon{float:right;margin-right:10px;font:10px dotum;margin-top:10px;}

.icon-admin{display:inline-block;background:url(img/icons.png) -976px -160px no-repeat;width:16px;height:16px;vertical-align:middle}
.icon-teacher{display:inline-block;background:url(img/icons.png) -944px -160px no-repeat;width:16px;height:16px;vertical-align:middle}
.icon-student{display:inline-block;background:url(img/icons.png) -864px -160px no-repeat;width:16px;height:16px;vertical-align:middle}












/* F12 개발자 도구로 작성. 원본 파일을 정확하게 표현한 것이 아닐 수도 있습니다. */
.context-menu-list {
	background: rgb(238, 238, 238); margin: 0px; padding: 0px; border: 1px solid rgb(221, 221, 221); font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; display: inline-block; list-style-type: none; position: absolute; min-width: 120px; max-width: 250px; box-shadow: 0px 2px 5px rgba(0,0,0,0.5); -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5); -webkit-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5); -o-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5); -ms-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
}
.context-menu-item {
	padding: 5px 2px 5px 24px; position: relative; background-color: rgb(238, 238, 238); -moz-user-select: -moz-none; -webkit-user-select: none; user-select: none; -ms-user-select: none;
}
.context-menu-separator {
	padding-bottom: 0px; border-bottom-color: rgb(221, 221, 221); border-bottom-width: 1px; border-bottom-style: solid; margin-bottom:5px;
}
.context-menu-item > label > input {
	-moz-user-select: text; -webkit-user-select: text; user-select: text; -ms-user-select: text;
}
.context-menu-item > label > textarea {
	-moz-user-select: text; -webkit-user-select: text; user-select: text; -ms-user-select: text;
}
.hover.context-menu-item {
	cursor: pointer; background-color: rgb(51, 153, 255);
}
.disabled.context-menu-item {
	color: rgb(102, 102, 102);
}
.hover.context-menu-input {
	cursor: default; background-color: rgb(238, 238, 238);
}
.hover.disabled.context-menu-item {
	cursor: default; background-color: rgb(238, 238, 238);
}
.context-menu-submenu::after {
	top: 0px; right: 3px; color: rgb(102, 102, 102); position: absolute; z-index: 1; content: ">";
}
.icon.context-menu-item {
	background-position: 4px 2px; min-height: 18px; background-repeat: no-repeat;
}
.icon-edit.context-menu-item {
	background-image: url("images/page_white_edit.png");
}
.icon-cut.context-menu-item {
	background-image: url("images/cut.png");
}
.icon-copy.context-menu-item {
	background-image: url("images/page_white_copy.png");
}
.icon-paste.context-menu-item {
	background-image: url("images/page_white_paste.png");
}
.icon-delete.context-menu-item {
	background-image: url("images/page_white_delete.png");
}
.icon-add.context-menu-item {
	background-image: url("images/page_white_add.png");
}
.icon-quit.context-menu-item {
	background-image: url("images/door.png");
}
.context-menu-input > label > * {
	vertical-align: top;
}
.context-menu-input > label > input[type='checkbox'] {
	margin-left: -17px;
}
.context-menu-input > label > input[type='radio'] {
	margin-left: -17px;
}
.context-menu-input > label > span {
	margin-left: 5px;
}
.context-menu-input > label {
	width: 100%; display: block; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box;
}
.context-menu-input > label > input[type='text'] {
	width: 100%; display: block; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box;
}
.context-menu-input > label > textarea {
	width: 100%; display: block; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box;
}
.context-menu-input > label > select {
	width: 100%; display: block; box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box;
}
.context-menu-input > label > textarea {
	height: 100px;
}
.context-menu-item > .context-menu-list {
	top: 5px; right: -5px; display: none;
}
.hover.context-menu-item > .context-menu-list {
	display: block;
}
.context-menu-accesskey {
	text-decoration: underline;
}


.ui-selectable-helper{border:2px #00f solid ! important;background-color:#39f;opacity:0.5;}

div.inline{display:inline-block}






.popup-wrap{position:absolute;background-color:#fff;border-radius:7px;padding:8px;-webkit-filter: drop-shadow(0px 0px 10px rgba(0,0,0,0.5));color:#fff;color:black;z-index:10001;min-width:100px;min-height:30px;-webkit-user-select: none}
.popup-arrow{position:absolute;background-color:#39f;bottom:0px;left:0px;top:0px;}
.popup-arrow:after{content: "";position:absolute;width:10px;height:10px;background-color:inherit;-webkit-transform: rotate(45deg);;overflow:hiiden;margin-left:5px;margin-top:-5px}

.popup-close{position:absolute; background:url('../img/icon_close.png') 50% 50% no-repeat; width:30px; height:30px; cursor:pointer; -webkit-filter:grayscale(1);right:-5px;top:-5px;}
.popup-close:hover{-webkit-filter:grayscale(0) drop-shadow(0px 0px 5px #CC3A3A); }

.popup-buttons {padding:5px;padding-bottom:0px;}
.popup-buttons button{font-size:12px;width:70px;}

.popup-wrap.above{margin-top:15px;}
.popup-wrap.above .popup-arrow{top:0px;bottom:inherit;}
.popup-wrap.above .popup-arrow:after{}

.pop-bg{position:fixed;left:0;top:0;width:100%;height:100%;z-index:10000;background-color:#000;display:none;opacity:0}


.path-ellipsis-left{overflow:hidden;text-overflow:ellipsis;display:inline-block;white-space:nowrap}
.path-ellipsis-right{overflow:hidden;text-overflow:ellipsis;display:inline-block;white-space:nowrap;-webkit-align-items:flex-end}


.popup-contents-item{display:block ! important; position:relative ! important;}

.inline{display:inline-block;}
.full{width:100%;height:100%;}
.absolute{position:absolute}





.autoscrool::-webkit-scrollbar-track {background: transparent;}
.autoscrool::-webkit-scrollbar-thumb {background: transparent; }
.autoscrool::-webkit-scrollbar {width: 8px; height: 8px; background-color:transparent;}


.autoscrool:hover::-webkit-scrollbar-track {background: transparent;}
.autoscrool:hover::-webkit-scrollbar-thumb {background: #bbb; }
.autoscrool:hover::-webkit-scrollbar {width: 8px; height: 8px; background-color:transparent;}
.autoscrool:hover::-webkit-scrollbar-thumb:hover {background: #444; }





input[data-type="icon"]{display:none;}
.icon-picker-bg{position:fixed;left:0;top:0;width:100%;height:100%;z-index:20000;background-color:#000;display:none}
.icon-picker{border:1px #ccc solid;width:27px;height:27px;line-height:27px;overflow:hidden;display:inline-block;position:relative;text-align:center;cursor:pointer;}
.icon-picker:hover{border-color:#999}

.icon-picker .icon-picker-arrow{border:5px #555 solid;width:0px;height:0px;border-color:#555 transparent transparent transparent;overflow:hidden;position:absolute;margin-left:15px;margin-top:18px;z-index:1;opacity:0.2}
.icon-picker:hover .icon-picker-arrow{;opacity:1;}
.icon-picker:active .icon-picker-arrow{border-top-color:#39f}

.icon-picker-menu{position:absolute;width:500px;height:367px;overflow:hidden;white-space:normal;display:none;z-index:20003;margin-top:20px;}
.icon-picker-menu.show{display:inline-block;}

.icon-picker-menu .icon-wrap{display:inline-block;overflow:hidden;vertical-align:middle;padding:5px;margin:5px;border:1px #ccc solid;line-height:0;cursor:pointer;resize:none}
.icon-picker-menu .icon32{}
.icon-picker-menu .icon-name{width:60px;overflow:hidden;text-overflow:ellipsis;line-height:100%;margin-left:10px;height:30px;display:none}

.icon-picker-menu.show-name .icon-wrap{line-height:30px;}
.icon-picker-menu.show-name .icon-name{display:inline-block;}

.icon-picker-menu .icon-finder{position:absolute;width:163px;margin-top:5px;padding-left:30px;background:url('../img/search_icon.gif') 0% -2px no-repeat;border:1px #ccc solid;border-radius:5px;height:9px;overflow:hidden;right:0px;height:15px;}
.icon-picker-menu .icon-area{padding:10px;height:200px;border:1px #ccc solid; overflow-y:auto ! important}

.icon-wrap:hover{background-color:#eee;}
.icon-wrap:active{background-color:#000}
.icon-wrap[show=on]{}
.icon-wrap[show=off]{display:none}

.icon-button-ok{border:1px #ccc solid;width:50px;display:inline-block;padding:3px;line-height:20px;border-radius:5px;background-color:#efefef;}
.icon-button-ok:hover{background-color:#aaa;color:#fff;cursor:pointer}

.icon-preview{float:left;width:130px;height:100px;margin-right:10px;line-height:50px;text-align:center}
.icon-preview .icon48{position:relative;top:20px;}

.fav-color{height:50px;line-height:0px;padding-left:147px;cursor:default;position:relative;margin-top:5px}
.fav-color div{display:inline-block;width:16px;height:16px;margin-right:6px;}
.fav-color div:hover{width:14px;height:14px;border:1px #fff solid;box-shadow:0px 0px 10px rgb(0,0,0);}
.colorselector{position:relative;display:inline-block;width:360px;height:50px ! important;margin-bottom:10px;}

.date-picker{border:1px #ccc solid ! important;cursor:pointer ! important;padding-left:25px ! important;}
.date-picker-icon{position:absolute;display:inline-block;width:25px;height:25px;background:url(viki://icons/black/calendar_1_icon&16.png) 5px 50% no-repeat;-webkit-filter: brightness(0.3); margin-top:3px;margin-left:2px}









.color-selector{position:relative;height:50px;}
.color-selector input[type=range]{-webkit-appearance:none;position:absolute;width:100%;margin:0;padding:0;cursor:ew-resize;z-index:100;background-color:transparent;height:33.3%}
.color-selector input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;border:1px #fff solid; width:10px;height:10px;border-radius:10px;}
.color-selector input[type=range]::-webkit-slider-thumb:after{content:"";position:absolute;margin-left:-2px;margin-top:-2px;border:1px #000 solid;width:10px;height:10px; border-radius:10px;overflow:hidden}
.color-selector input[type=range] ~ div{width:100%;padding:0px 5px;box-sizing:border-box;font:7pt verdana;left:0px;right:0px;;height:33.3%;}

.color-selector .hue-bar{height:100%;background:-webkit-linear-gradient(left, #ff0000 0%, #ffff00 17%, #00ff00 33%, #00ffff 50%, #0000ff 67%, #ff00ff 83%, #ff0000 100%);}
.color-selector .sat-bar{height:100%;background:-webkit-linear-gradient(left, hsl(0, 0%, 50%) 0%, hsl(0, 100%, 50%) 100%);}
.color-selector .lig-bar{height:100%;background:-webkit-linear-gradient(left, hsl(0, 100%, 0%) 0%, hsl(0, 100%, 50%) 50%, hsl(0, 100%, 100%) 100%);}





.menu-list{position:relative;border:1px #ccc solid;display:inline-block;vertical-align:middle;padding:0px 5px;box-sizing: border-box;-webkit-user-select:none;cursor:default;background-color:#fff}
.menu-list-arrow{position:absolute;top:50%;right:3px;margin-top:-3px;border:5px #555 solid;border-color:#555 transparent transparent transparent;}
.menu-list:hover {background-color:#f7f7f7}
.menu-list:hover .menu-list-arrow{border-top-color:#aaa}

.menu-list.active {background-color:#eee}
.menu-list.active .menu-list-arrow{border-top-color:#39f}










.tree-item{position:relative;line-height:30px;margin-top:1px;white-space:nowrap;padding:0px 5px;border-radius: 0px 5px 0px 5px;}
.tree-head{display:inline-block;background-color:#999;margin-right:5px}
.tree-head-counter{position:absolute;width:16px;text-align:right;background-color:transparent;z-index:1;font:bold 7pt verdana;color:#000;cursor:default;}
.tree-icon{display:inline-block;background-color:#999;margin-right:5px}
.tree-text{display:inline-block;position:relative;top:1px;border-top-right-radius:5px;cursor:default;}
.tree-item:hover{color:#4F7C93}

.tree-item.ui-selected, .tree-item.ui-selecting{background-color:#39f;color:#fff;}
.tree-item.ui-selected .tree-icon, .tree-item.ui-selecting .tree-icon,
.tree-item.ui-selected .tree-head, .tree-item.ui-selecting .tree-head {background-color:#fff}



.tree-childs{display:none;position:relative}

.tree-childs-guide{position:absolute;border:#ccc solid;border-width:0px 0px 1px 1px; width:13px; top:0px; bottom:12px; margin-left:-5px;border-bottom-left-radius:10px}


.range {position:relative}
.range .range-cs{position:absolute;border-radius:10px;border:1px #555 solid;width:9px;height:9px;margin-left:-5px;background-color:#39f;cursor:ew-resize;opacity:0.3;margin-top:3px}
.range-cs-max{background-color:#f93 ! important}
.range:hover .range-cs, .range.dragging .range-cs{opacity:1}

.range-gauge{position:absolute;background-color:#39f;height:15px;cursor:ew-resize;opacity:0.5;}
.range-gauge:hover{opacity:0.8}

.range .tip-wrap{position:absolute; margin-top:-25px;width:200px;margin-left:-95px;text-align:center}
.range .tip-wrap{}

.range-tooltip{position:absolute;border:1px #555 solid;background-color:#fff;height:20px;padding:5px;border-radius:5px;line-height:20px;display:none;z-index:5;}
.range:hover .range-tooltip, .range.dragging .range-tooltip{display:none}






.month-selector{position:relative;border:1px #ccc solid; border-radius:10px; width:100px; text-align:center; height:20px; background-color:#fff; padding-top:4px; cursor:default}
.month-selector .prev{position:absolute;-webkit-mask-image:url(viki://icons/black/rnd_br_prev_icon&16.png);left:2px;width:16px;height:16px;background-color:#aaa;top:4px;cursor:pointer}
.month-selector .prev:hover{background-color:#39f}
.month-selector .prev:active{background-color:#369}

.month-selector .next{position:absolute;-webkit-mask-image:url(viki://icons/black/rnd_br_next_icon&16.png);right:2px;width:16px;height:16px;background-color:#aaa;top:4px;cursor:pointer}
.month-selector .next:hover{background-color:#39f}
.month-selector .next:active{background-color:#369}