div,
span,
input,
select,
li,
textarea,
label {
    font-family: "Open Sans", Arial, sans-serif;
}
div:focus {
    outline: none;
}

/*
input type number의 경우 spin 제거
input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button {-webkit-appearance:none;margin:0;}
*/
::-webkit-calendar-picker-indicator {
    color: transparent;
    background: url("../imgs/ui/icons/icon_datepicker.png") no-repeat center;
    background-size: contain;
}

/* element style */
button {
    font-size: 12px;
    line-height: 1.5;
    opacity: 0.8;
    text-align: center;
}
button:hover {
    opacity: 1;
}

input {
    font-size: 12px;
    border: none;
    outline: none;
    margin: 0px;
    padding: 0px;
    opacity: 0.6;
}
input:focus {
    opacity: 1;
}
input[type="text"] {
    appearance: none;
    -webkit-appearance: none;
}
input[type="number"] {
    appearance: none;
    -webkit-appearance: none;
}
input[type="radio"] {
    appearance: default;
    -webkit-appearance: default;
}
input[type="checkbox"] {
    appearance: none;
    -webkit-appearance: none;
    opacity: 1;
}

select {
    font-size: 13px;
}
select:focus {
    outline: solid 1px #7673ff;
}

ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

/* flex css */
.flx-container {
    display: -webkit-flex;
    display: flex;
    box-sizing: border-box;
}
.flx-center {
    -webkit-align-items: center;
    align-items: center;
    -webkit-justify-content: center;
    justify-content: center;
}
.flx-center select {
    margin-top: 0px;
    margin-bottom: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
}
.flx-center input {
    margin-top: 0px;
    margin-bottom: 0px;
    padding-top: 0px;
    padding-bottom: 0px;
}
.flex1 {
    -webkit-flex: 1;
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.flex2 {
    -webkit-flex: 2;
    flex: 2;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding-left: 10px;
}
.flx-none {
    -webkit-flex: none;
    flex: none;
}
.flx-wrap {
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
}

.popupOpacityBlockScreen {
    opacity: 0;
}

.googleBlockScreen {
    background-color: #ffffff;
    opacity: 0.5;
}

.progressGif {
    display: none;
    position: absolute;
    width: 163px;
    height: 162px;
    font-size: 20px;
    line-height: 20px;
}
.progressGif.saving {
    background: url("../imgs/ui/popup/pstd_loading.png") no-repeat center;
}
.progressGif.loading {
    background: url("../imgs/ui/popup/pstd_loading.png") no-repeat center;
}
.progressGif.publishing {
    background: url("../imgs/ui/popup/pstd_loading.png") no-repeat center;
}
.progressGif.importing {
    background: url("../imgs/ui/popup/pstd_loading.png") no-repeat center;
}
.progressGif.common {
    background: url("../imgs/ui/popup/pstd_loading_common.png") no-repeat center;
}

.vertical-text {
    transform: rotate(90deg);
    transform-origin: left top 0;
}
.txtOverflow {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* font list의 경우 select box를 사용하지 않고 만든 select box를 이용한다. */
.xSelectBox {
    float: left;
    width: 115px;
    margin-top: 4px;
    padding-left: 5px;
    padding-right: 13px;
    height: 20px;
    border: solid 1px #c5c5c5;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    line-height: 20px;
    background-image: url("../imgs/ui/widget/aspen_widget_bullet02_nor.png");
    background-repeat: no-repeat;
    background-position: right 0px top 50%;
}
.xSelectBox.relative {
    position: relative;
}
.xSelectBox.noPadding {
    padding: 0px;
}
.xSelectBox:active {
    background-image: url("../imgs/ui/widget/aspen_widget_bullet02_sel.png");
}

.xSelectBox[data-type="db_x_select_t1"] {
    background-image: url("../imgs/ui/icons/search.png");
    background-repeat: no-repeat;
    background-position: right 0px top 50%;
    background-size: contain;
}
.xSelectBox[data-type="db_x_select_t1"]:hover {
    background-color: #ffffff;
}
.xSelectBox[data-type="db_x_select_t1"]:active {
    background-image: url("../imgs/ui/icons/search.png");
}
.xSelectBox[data-type="db_x_select_t1"] input::-webkit-input-placeholder {
    color: #000000;
}

input[id^="wndPopupPublishEpub3_"]::-webkit-input-placeholder {
    color: lightgrey;
}

input:disabled {
    color: #b0b0b0;
}

.checkBox {
    float: left;
    width: 16px;
    height: 100%;
    background: url("../imgs/ui/buttons/checkbox_off.png") no-repeat center;
}
.checkBox.fix {
    width: 16px;
    height: 16px;
}
.checkBox:disabled {
    opacity: 0.5;
}
.checkBox:checked {
    background: url("../imgs/ui/buttons/checkbox_on.png") no-repeat center;
}

.transitionR {
    transition: right 0.3s ease-in-out;
    -webkit-transition: right 0.3s ease-in-out;
}
.transitionR.delay {
    transition-delay: 0.2s;
    -webkit-transition-delay: 0.2s;
}

.movingNode {
    display: none;
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    opacity: 0.5;
    background-color: rgb(0, 0, 0);
}

.btnDisabled {
    opacity: 0.35;
    background-color: transparent;
    cursor: default;
}

.beforeAspenLoad {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background-position: center;
    background-repeat: no-repeat;
    background-color: black;
    opacity: 0.8;
    transition: opacity 1s;
    -webkit-transition: opacity 1s;
}

.resizeWndOnTop {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 3px;
    cursor: row-resize;
}

/* wnd resize top, bottom, left, right*/
.resizeWndNode {
    position: absolute;
    background-color: transparent;
}
.resizeWndNode.v {
    width: 100%;
    height: 5px;
    left: 0px;
    cursor: n-resize;
}
.resizeWndNode.v.top {
    top: 0px;
}
.resizeWndNode.v.bottom {
    bottom: 0px;
}
.resizeWndNode.h {
    height: 100%;
    width: 5px;
    top: 0px;
    cursor: e-resize;
}
.resizeWndNode.h.left {
    left: 0px;
}
.resizeWndNode.h.right {
    right: 0px;
}

/* wnd frame class types for UI */
.wndFrameCssRoot {
    border: solid 1px #dfdfdf;
    background-repeat: no-repeat;
    background-position: center;
}
.wndFrameCssRoot.hide {
    background-color: #ffffff;
}

.wndFrameCssMainHeader {
    background-color: #ffffff;
    border-top: solid 3px #7673ff;
    border-bottom: solid 1px #c5c5c5;
    overflow: hidden;
}
.wndFrameCssMainBody {
    background-color: #ffffff;
}
.wndFrameCssMainBottom {
    background-color: #ffffff;
    border-top: solid 1px #c5c5c5;
    overflow-x: visible;
    overflow: visible;
}
.wndFrameCssMenu {
    border: solid 1px #c5c5c5;
    background-color: white;
}
.wndFrameCssLockMenu {
    min-width: 120px;
    border: solid 1px #c5c5c5;
    background-color: white;
}
.wndFrameCssAlignMenu {
    border: solid 1px #c5c5c5;
    background-color: white;
}

.wndFrameCssBottomTab {
    border-top: solid 1px #c5c5c5;
    overflow: hidden;
    background-color: #ffffff; /*transition:width 0.5s;-webkit-transition:width 0.5s;*/
}
.wndFrameCssBottomTab.hide {
    border-top: solid 1px transparent;
}
.wndFrameCssScrHeader {
    border-bottom: solid 1px #c5c5c5;
    padding-top: 6px;
    overflow: hidden;
}
.wndFrameCssScrBottom {
    overflow: visible;
}

.wndFrameCssCVLPage {
    background-color: #ffffff;
    border-right: solid 1px #dfdfdf;
}

.wndFrameCssProp {
    overflow: hidden;
    border-left: solid 1px #c5c5c5;
    background-color: #ffffff; /*transition:left 0.3s, opacity 0.3s;-webkit-transition:left 0.3s, opacity 0.3s;*/
}
.wndFrameCssProp span {
    display: table-cell;
    vertical-align: middle;
}
.wndFrameCssProp input {
    display: table-cell;
    vertical-align: middle;
    margin-top: 4px;
    padding-left: 5px;
    padding-right: 5px;
    height: 20px;
    border: solid 1px #c5c5c5;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    opacity: 1;
}
.wndFrameCssProp select {
    display: table-cell;
    vertical-align: middle;
    margin-top: 4px;
    padding-left: 5px;
    height: 22px;
    border: solid 1px #c5c5c5;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    opacity: 1;
}
.wndFrameCssProp input[type="checkbox"] {
    border: none;
}

.wndFrameCssNav {
    overflow: hidden;
    border-left: solid 1px #c5c5c5;
    background-color: #ffffff;
    color: #666666;
}
.wndFrameCssNav .title {
    height: 40px;
    font-size: 13px;
    line-height: 40px;
    background-color: #f5f4f4;
    border-bottom: solid 1px #c5c5c5;
    padding-left: 38px;
}
.wndFrameCssNav .tab {
    position: relative;
    width: 100%;
    height: 30px;
    border-bottom: solid 1px #c5c5c5;
    box-sizing: border-box;
}
.wndFrameCssNav .tabItem {
    position: absolute;
    top: 5px;
    width: 93px;
    height: 25px;
    text-align: center;
    font-size: 12px;
    line-height: 25px;
    cursor: pointer;
    background: url(../imgs/ui/popup/tap_off.png);
}
.wndFrameCssNav .tabItem:hover {
    color: #7673ff;
}
.wndFrameCssNav .tabItem.all {
    left: 5px;
}
.wndFrameCssNav .tabItem.label {
    left: 89px;
}
.wndFrameCssNav .tabItem.selected {
    cursor: auto;
    font-weight: bold;
    background: url(../imgs/ui/popup/tap_on.png);
    color: #666666;
}

.wndFrameCssNav .listOrder {
    position: absolute;
    top: 6px;
    right: 5px;
    width: 31px;
    height: 22px;
}
.wndFrameCssNav .listOrder[data-op="normal"] {
    background: url("../imgs/ui/icons/z_index_off_nor.png") no-repeat center;
}
.wndFrameCssNav .listOrder[data-op="normal"]:hover {
    background: url("../imgs/ui/icons/z_index_off_hover.png") no-repeat center;
}
.wndFrameCssNav .listOrder[data-op="normal"]:active {
    background: url("../imgs/ui/icons/z_index_off_press.png") no-repeat center;
}
.wndFrameCssNav .listOrder[data-op="zindex"] {
    background: url("../imgs/ui/icons/z_index_nor.png") no-repeat center;
}
.wndFrameCssNav .listOrder[data-op="zindex"]:hover {
    background: url("../imgs/ui/icons/z_index_hover.png") no-repeat center;
}
.wndFrameCssNav .listOrder[data-op="zindex"]:active {
    background: url("../imgs/ui/icons/z_index_press.png") no-repeat center;
}

.wndFrameCssNav .list .item {
    clear: both;
    position: relative;
    width: 100%;
    height: 25px;
    line-height: 25px;
    font-size: 12px;
    color: #464646;
}

.wndFrameCssNav .treeViewBtn {
    float: left;
    margin-top: 6px;
    margin-right: 5px;
    width: 13px;
    height: 13px;
    cursor: pointer;
}
.wndFrameCssNav .treeViewBtn.up {
    background: url("../imgs/ui/widget/aspen_widget_bullet01_nor.png") no-repeat
        center;
}
.wndFrameCssNav .treeViewBtn.up:hover {
    background: url("../imgs/ui/widget/aspen_widget_bullet01_over.png")
        no-repeat center;
}
.wndFrameCssNav .treeViewBtn.up:active {
    background: url("../imgs/ui/widget/aspen_widget_bullet01_sel.png") no-repeat
        center;
}
.wndFrameCssNav .treeViewBtn.down {
    background: url("../imgs/ui/widget/aspen_widget_bullet02_nor.png") no-repeat
        center;
}
.wndFrameCssNav .treeViewBtn.down:hover {
    background: url("../imgs/ui/widget/aspen_widget_bullet02_over.png")
        no-repeat center;
}
.wndFrameCssNav .treeViewBtn.down:active {
    background: url("../imgs/ui/widget/aspen_widget_bullet02_sel.png") no-repeat
        center;
}

.wndFrameCssNav .listTitle {
    float: left;
    width: 70%;
    margin-right: 5px;
}
.wndFrameCssNav .listTitle:not(.disabled):hover {
    color: #4000e3;
}
.wndFrameCssNav .listTitle.selected {
    color: #4000e3;
    font-weight: bold;
}
.wndFrameCssNav .listTitle.disabled {
    opacity: 0.5;
}

.wndFrameCssNav .editIcon {
    position: absolute;
    top: 0px;
    right: 5px;
    cursor: pointer;
    width: 26px;
    height: 26px;
    background: url("../imgs/ui/icons/widget_list_edit_nor.png") no-repeat
        center;
}
.wndFrameCssNav .editIcon:hover {
    background: url("../imgs/ui/icons/widget_list_edit_hover.png") no-repeat
        center;
}
.wndFrameCssNav .editIcon:active {
    background: url("../imgs/ui/icons/widget_list_edit_hover.png") no-repeat
        center;
}

.wndFrameCssT1 {
    border-bottom: solid 1px #dfdfdf;
}

/* Resoucre manager list wnd */
.wndFrameRscMgr {
    padding: 10px 0px 20px 10px;
    background-color: #ffffff;
    overflow-x: auto;
    border: none;
    box-sizing: border-box;
}

.listWndHeader {
    padding-left: 15px;
    height: 40px;
    line-height: 40px;
    font-size: 13px;
    color: #666666;
    border-bottom: solid 1px #c5c5c5;
    background-color: #f5f4f4;
}

.wndFrameCssScriptProp {
    background-color: #ffffff;
}
.wndFrameCssScriptProp [data-op] {
    cursor: pointer;
}

/* POPUP */
.wndFrameCssPopupT1 {
    padding-left: 30px;
    padding-right: 30px;
    border: none;
    box-shadow: 0px 0px 4px lightblue;
    background-color: white;
    color: #000000;
}
.wndFrameCssPopupT2 {
    padding: 10px;
    border: none;
}

.wndFrameCssPopupT3 {
    box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.4);
    background-color: #ffffff;
}
.wndFrameCssPopupT3 .listPropGroup {
    padding-left: 0px;
    padding-right: 0px;
}
.wndFrameCssPopupT3 .listPropGroup:not(:last-child) {
    padding-bottom: 8px;
    margin-bottom: 7px;
    border-bottom: solid 1px #f2f2f2;
}
.wndFrameCssPopupT3 .listPropItem {
    height: 40px;
    line-height: 40px;
}
.wndFrameCssPopupT3 .listPropItemIcon {
    margin-top: 4px;
    width: 28px;
    height: 30px;
}
.wndFrameCssPopupT3 .listPropItemImgIcon {
    margin-top: 4px;
    width: 28px;
    height: 30px;
}
.wndFrameCssPopupT3 .xSelectBox {
    margin-top: 8px;
    height: 24px;
    line-height: 26px;
}
.wndFrameCssPopupT3 input {
    margin-top: 8px;
    padding-left: 5px;
    padding-right: 5px;
    height: 24px;
    border: solid 1px #c5c5c5;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    opacity: 1;
}
.wndFrameCssPopupT3 select {
    margin-top: 8px;
    padding-left: 5px;
    height: 26px;
    border: solid 1px #c5c5c5;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    opacity: 1;
}
.wndFrameCssPopupT3 input[type="checkbox"] {
    border: none;
}

.wndFrameCssPopupT4 {
    box-shadow: 2px 2px 5px 1px rgba(0, 0, 0, 0.4);
    background-color: #ffffff;
}

.wndFrameCssFullScreen {
    border: none;
    background-color: rgba(0, 0, 0, 0.9);
    transition: all 0.3s;
    -webkit-transition: all 0.3s;
}

.popupNew {
    position: relative;
}
.popupNew.header {
    padding-left: 22px;
    padding-right: 0px;
    height: 44px;
    font-size: 18px;
    line-height: 44px;
    color: #ffffff;
    background-color: #5b46d9;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.popupNew.header.script {
    padding-left: 47px;
    background-image: url("../imgs/ui/script/script_logo.png");
    background-position: 16px center;
    background-repeat: no-repeat;
}
.popupNew.header.script.viewer {
    height: 25px;
    line-height: 25px;
    font-size: 14px;
}
.popupNew.body {
    height: auto;
    color: #000000;
}
.popupNew.footer {
    margin-left: auto;
    margin-right: auto;
    height: 54px;
}

/* popup dialog type*/
/* header가 있을 경우 header, 없을 경우 body */
.popupNew.header.info {
    background-color: #5bc0de;
}
.popupNew.header.error {
    background-color: #d9534f;
}
.popupNew.header.warning {
    background-color: #f0ad4e;
}
.popupNew.header.success {
    background-color: #5cb85c;
}
.popupNew.body.info {
    background-color: #5bc0de;
    color: #ffffff;
}
.popupNew.body.error {
    background-color: #d9534f;
    color: #ffffff;
}
.popupNew.body.warning {
    background-color: #f0ad4e;
    color: #ffffff;
}
.popupNew.body.success {
    background-color: #5cb85c;
    color: #ffffff;
}

.popupNewBtn {
    width: 117px;
    height: 37px;
    line-height: 35px;
    font-size: 13px;
    color: #464646;
    font-weight: bold;
    text-align: center;
    box-sizing: border-box;
    border: solid 1px #c5c5c5;
    border-radius: 4px;
    -webkit-border-rdaius: 4px;
    background: -webkit-linear-gradient(#ffffff, #e7e7e7);
    background: linear-gradient(#ffffff, #e7e7e7);
    cursor: pointer;
}
.popupNewBtn:hover {
    background: -webkit-linear-gradient(#f6f6f6, #dddcdc);
    background: linear-gradient(#f6f6f6, #dddcdc);
}
.popupNewBtn:active {
    border: solid 1px #7673ff;
}

.popup_header {
    position: absolute;
    bottom: 10px;
    font-size: 18px;
    color: #ffffff;
    left: 22px;
}
.popup_body {
    position: absolute;
    bottom: 0px;
    font-size: 14px;
}
.popup_btn1 {
    position: absolute;
    top: 22%;
    width: 80px;
    text-align: left;
}
.popup_btn2 {
    float: left;
    margin: 10px;
    padding: 10px;
    width: 120px;
    height: 130px;
    font-size: 13px;
}
.popup_project_input {
    width: 100%;
    border: none;
    border-bottom: solid 1px #bfbfbf;
    margin-top: 5px;
    text-align: center;
}

/* popup close button */
.popupCloseBtn {
    float: right;
    margin-top: 16px;
    margin-right: 18px;
    width: 17px;
    height: 17px;
    background-image: url("../imgs/ui/buttons/manager_btn_close_nor.png");
    cursor: pointer;
}
.popupCloseBtn:hover {
    background-image: url("../imgs/ui/buttons/manager_btn_close_over.png");
}
.popupCloseBtn:active {
    background-image: url("../imgs/ui/buttons/manager_btn_close_sel.png");
}
.popupCloseBtn.scriptViewer {
    margin-top: 5px;
    margin-right: 10px;
    width: 14px;
    height: 14px;
    background-size: contain;
}

/* popup opacity button */
.popupOpacityBtnWrapper {
    position: relative;
    float: right;
    margin-top: 9px;
    margin-right: 20px;
    width: 66px;
    height: 30px;
}
.popupOpacityBtn {
    float: right;
    margin-top: 16px;
    margin-right: 18px;
    width: 17px;
    height: 17px;
    cursor: pointer;
}
.popupOpacityBtn.on {
    background-image: url("../imgs/ui/icons/opacity_on_nor.png");
}
.popupOpacityBtn.on:hover {
    background-image: url("../imgs/ui/icons/opacity_on_hover.png");
}
.popupOpacityBtn.on:active {
    background-image: url("../imgs/ui/icons/opacity_on_press.png");
}
.popupOpacityBtn.off {
    background-image: url("../imgs/ui/icons/opacity_off_nor.png");
}
.popupOpacityBtn.off:hover {
    background-image: url("../imgs/ui/icons/opacity_off_hover.png");
}
.popupOpacityBtn.off:active {
    background-image: url("../imgs/ui/icons/opacity_off_press.png");
}
/* opcity type 2 use only css*/
.opcaity-wrapper {
    position: relative;
    float: right;
    margin-top: 9px;
    margin-right: 17px;
    width: 66px;
    height: 30px;
}
.opacity-bar {
    margin-top: 23px;
    width: 100%;
    height: 4px;
    border-radius: 2px;
    background-color: #cfcfcf;
}
.opacity-handle {
    position: absolute;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: solid 1px #464646;
    background-color: #ffffff;
    box-sizing: border-box;
    cursor: pointer;
}
.opacity-handle:active {
    background-color: #cfcfcf;
}

/* popup search */
.popupSearch {
    position: relative;
    float: right;
    margin-top: 9px;
    margin-right: 20px;
    width: 150px;
    height: 24px;
}
.popupSearchType {
    position: relative;
    float: right;
    margin-top: 9px;
    margin-right: 5px;
    width: auto;
    height: 24px;
}

/* Open in new window*/
.popupOpenInNew {
    position: absolute;
    bottom: 10px;
    left: 10px;
    height: 20px;
    font-size: 12px;
    line-height: 20px;
}
.popupOpenInNew {
    position: absolute;
    bottom: 10px;
    left: 10px;
    height: 20px;
    font-size: 12px;
    line-height: 20px;
}
.popupOpenInNew > input {
    float: left;
    margin: 0px;
    padding: 0px;
    margin-right: 5px;
    width: 20px;
    height: 20px;
}
.popupOpenInNew > label {
    float: left;
}

/* common text button */
.commonBtn {
    height: 26px;
    padding-left: 5px;
    padding-right: 5px;
    line-height: 23px;
    font-size: 12px;
    text-align: center;
    color: #666666;
    border: solid 1px #c5c5c5;
    background-color: #ffffff;
    box-sizing: border-box;
    border-radius: 2px;
    -webkit-border-radius: 2px;
}
.commonBtn.btnOver {
    border: solid 1px #a8a8a8;
}
.commonBtn.btnDown {
    border: solid 1px #7673ff;
    color: rgb(118, 115, 255);
}
.commonBtn.btnSelected {
    border: solid 1px #7673ff;
    color: rgb(118, 115, 255);
}

/* common image icon style*/
.commonIconBtn {
    width: 28px;
    height: 28px;
    background-position: center;
    background-repeat: no-repeat;
    border: solid 1px #ffffff;
}
.commonIconBtn.btnDown {
    outline: solid 1px rgb(118, 115, 255, 0.5);
    background-color: #ffffff;
}
.commonIconBtn.btnSelected {
    outline: solid 1px rgb(118, 115, 255, 1);
    background-color: #ffffff;
}

/* Page list style */
.pageBody {
    position: relative;
    width: 100%;
    overflow-x: hidden;
    overflow-y: auto;
}

/* normal page styles */
.pageThumbnail {
    position: relative;
    border: solid 1px #c5c5c5;
    padding: 3px;
    box-sizing: border-box;
    background-color: #ffffff;
    background-repeat: no-repeat;
    background-position: center top;
    overflow: hidden;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -webkit-user-select: auto;
    -moz-user-select: auto;
    user-select: auto;
}
.pageThumbnail.over {
    border: solid 1px #7673ff;
    background-color: #f5f4f4;
}
.pageThumbnail.down {
    border: solid 2px #7673ff;
}
.pageThumbnail.selected {
    outline: solid 1px #7673ff;
    border-radius: 0px;
    -webkit-border-radius: 0px;
}
.pageThumbnail.selected.over {
    outline: solid 2px #7673ff;
}
.pageThumbnail #pageNo {
    color: #ffffff;
    background-color: rgba(118, 115, 255, 0.6);
}

.pageThumbnail #bookSticker {
    color: #ffffff;
    background-color: rgba(65, 138, 226, 0.8);
}

/* during dragging thumbnail do nothing for select, pointer-event */
.pageBody[data-state="normal"] .pageThumbnail {
    -webkit-user-select: text;
    -moz-user-select: text;
    user-select: text;
}
.pageBody[data-state="dragging"] .pageThumbnail {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    pointer-events: none;
}

/* not completed page styles */
.ncPageThumbnail {
    position: relative;
    border: solid 1px #ff9090;
    padding: 3px;
    box-sizing: border-box;
    background-color: #ffffff;
    background-repeat: no-repeat;
    background-position: center top;
    overflow: hidden;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -webkit-user-select: auto;
    -moz-user-select: auto;
    user-select: auto;
}
.ncPageThumbnail.over {
    border: solid 1px #dc3f3f;
    background-color: #f5f4f4;
}
.ncPageThumbnail.down {
    border: solid 2px #dc3f3f;
}
.ncPageThumbnail.selected {
    outline: solid 1px #dc3f3f;
    border-radius: 0px;
    -webkit-border-radius: 0px;
}
.ncPageThumbnail.selected.over {
    outline: solid 2px #dc3f3f;
}
.ncPageThumbnail #pageNo {
    color: #ffffff;
    background-color: rgba(220, 63, 63, 0.6);
}
.ncPageThumbnail #bookSticker {
    color: #ffffff;
    background-color: rgba(65, 138, 226, 0.8);
}

/* during dragging thumbnail do nothing for select, pointer-event */
.pageBody[data-state="normal"] .ncPageThumbnail {
    -webkit-user-select: text;
    -moz-user-select: text;
    user-select: text;
}
.pageBody[data-state="dragging"] .ncPageThumbnail {
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    pointer-events: none;
}

.pageThumbnailTopCmd {
    position: absolute;
    margin: 0px;
    padding: 0px;
    top: -22px;
    width: 20px;
    height: 20px;
    outline: none;
    cursor: pointer;
    transition: top 0.2s;
    -webkit-transition: top 0.2s;
}
.pageThumbnailTopDrag {
    position: absolute;
    margin: 0px;
    padding: 0px;
    top: 2px;
    width: 20px;
    height: 20px;
    outline: none;
    opacity: 0;
    cursor: default;
}
#selectStyle.pageThumbnailTopCmd {
    background-image: url("/imgs/ui/pglist/style_nor.png");
}
#selectStyle.pageThumbnailTopCmd:hover {
    background-image: url("/imgs/ui/pglist/style_hover.png");
}

.pageStyleItem {
    border: solid 1px #c5c5c5;
}
.pageStyleItem:hover {
    border: solid 1px #7673ff;
    background-color: #f5f4f4;
}
.pageStyleItem.selected {
    outline: solid 1px #7673ff;
}

.pageThumbnailBottom {
    position: absolute;
    bottom: 0px;
    left: 0px;
    margin: 0px;
    padding-left: 5px;
    padding-right: 5px;
    width: 100%;
    height: 25px;
    line-height: 25px;
    font-size: 12px;
    text-align: center;
    color: white;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border: none;
    box-sizing: border-box;
    transition: background 0.3s;
    -webkit-transition: background 0.3s;
}
.pageThumbnailBottom.show {
    background-color: rgba(0, 0, 0, 0.6);
}
.pageThumbnailBottom.hide {
    background-color: transparent;
}
.pageThumbnailBottom:focus {
    background-color: rgba(0, 0, 0, 0.6);
}

/* overlay page styles */
.overlayPageThumbnail {
    position: relative;
    border: solid 1px #c5c5c5;
    padding: 3px;
    box-sizing: border-box;
    background-color: #ffffff;
    background-repeat: no-repeat;
    background-position: center top;
    overflow: hidden;
    border-radius: 2px;
    -webkit-border-radius: 2px;
}
.overlayPageThumbnail.over {
    border: solid 1px #a8a8a8;
    background-color: #f5f4f4;
}
.overlayPageThumbnail.down {
    border: solid 1px #7673ff;
}
.overlayPageThumbnail.selected {
    outline: solid 1px #7673ff;
    border-radius: 0px;
    -webkit-border-radius: 0px;
}
.overlayPageThumbnail.selected.over {
    outline: solid 2px #7673ff;
}

.overlayPageThumbnailBottom {
    position: absolute;
    bottom: 0px;
    left: 0px;
    margin: 0px;
    padding-left: 5px;
    padding-right: 5px;
    width: 100%;
    height: 25px;
    line-height: 25px;
    font-size: 12px;
    text-align: center;
    color: white;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border: none;
    box-sizing: border-box;
    transition: background 0.3s;
    -webkit-transition: background 0.3s;
}
.overlayPageThumbnailBottom.show {
    background-color: rgba(0, 0, 255, 0.6);
}
.overlayPageThumbnailBottom.hide {
    background-color: transparent;
}
.overlayPageThumbnailBottom:focus {
    background-color: rgba(0, 0, 255, 0.6);
}

/* popup page styles */
.popupPageThumbnail {
    position: relative;
    border: solid 1px #c5c5c5;
    background-color: #ffffff;
    background-repeat: no-repeat;
    background-position: center top;
    overflow: hidden;
    border-radius: 2px;
    -webkit-border-radius: 2px;
}
.popupPageThumbnail.over {
    border: solid 1px #a8a8a8;
    background-color: #f5f4f4;
}
.popupPageThumbnail.down {
    border: solid 1px #003cb1;
}
.popupPageThumbnail.selected {
    outline: solid 2px #ff0000;
    border-radius: 0px;
    -webkit-border-radius: 0px;
}
.popupPageThumbnail.selected.over {
    outline: solid 3px #ff0000;
}

.popupPageThumbnailBottom {
    position: absolute;
    bottom: 0px;
    left: 0px;
    margin: 0px;
    padding-left: 5px;
    padding-right: 5px;
    width: 100%;
    height: 25px;
    line-height: 25px;
    font-size: 12px;
    text-align: center;
    color: white;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    border: none;
    box-sizing: border-box;
    transition: background 0.3s;
    -webkit-transition: background 0.3s;
}
.popupPageThumbnailBottom.show {
    background-color: rgba(255, 0, 0, 0.6);
}
.popupPageThumbnailBottom.hide {
    background-color: transparent;
}
.popupPageThumbnailBottom:focus {
    background-color: rgba(255, 0, 0, 0.6);
}

.page-wrapper[data-mode="text"] > .pageThumbnail > canvas,
.page-wrapper[data-mode="text"] > .overlayPageThumbnail > canvas,
.page-wrapper[data-mode="text"] > .popupPageThumbnail > canvas {
    display: none;
}

.page-wrapper[data-mode="text"] > .pageThumbnail > input,
.page-wrapper[data-mode="text"] > .overlayPageThumbnail > input,
.page-wrapper[data-mode="text"] > .popupPageThumbnail > input {
    text-align: left;
}
.page-wrapper[data-mode="text"] > .pageThumbnail > input {
    color: #666666;
    background-color: #ffffff;
    opacity: 1;
}

/* ==== Main Header ==== */

/* main header logo */
.headerLogo {
    float: left;
    margin-left: 20px;
    vertical-align: middle;
}

/* main header menus */

.headerMenuList {
    position: absolute;
    left: 0px;
    width: 154px;
}
.headerMenuList.VT {
    top: 0px;
    height: 39px;
    background: url("../imgs/ui/top/aspen_menu_t.png") no-repeat center;
}
.headerMenuList.VM {
    top: 39px;
    background: url("../imgs/ui/top/aspen_menu_m.png") repeat center;
}
.headerMenuList.VB {
    bottom: 0px;
    height: 9px;
    background: url("../imgs/ui/top/aspen_menu_b.png") no-repeat center;
}
.headerMenuListText {
    margin-left: 24px;
    font-weight: bold;
    font-size: 13px;
    line-height: 39px;
    color: #000000;
    text-align: left;
}

/* menu */
.headerMenuItemSep {
    position: relative;
    margin-top: 2px;
    margin-bottom: 3px;
    margin-left: 10px;
    margin-right: 10px;
    height: 0px;
    border-top: dotted 1px rgba(50, 50, 50, 0.3);
}
.headerMenuItemSep.hide {
    display: none;
}
.headerMenuItemWrapper {
    position: relative;
    margin-top: 39px;
    margin-bottom: 9px;
    width: 100%;
    height: auto;
}
.headerMenuItemSubWrapper {
    position: relative;
    padding: 7px;
    padding-top: 3px;
    padding-bottom: 0px;
    width: 100%;
    height: auto;
    border: solid 1px #808080;
    background-color: #ffffff;
}
.headerMenuItem {
    position: relative;
    margin-bottom: 3px;
    padding-left: 34px;
    padding-right: 15px;
    min-width: 116px;
    max-width: 400px;
    height: 29px;
    font-size: 13px;
    line-height: 29px;
    text-align: left;
    color: #000000;
    box-sizing: border-box;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    border: solid 1px transparent;
    background-position: left;
    background-repeat: no-repeat;
}

.headerMenuItem.over {
    color: #4000e3;
    background-color: #ffffff;
    border: dotted 1px #7673ff;
    cursor: pointer;
}
.headerMenuItem.over > span {
    cursor: pointer;
}
.headerMenuItem.over > div {
    cursor: pointer;
}
.headerMenuItem.down {
    color: #ffffff;
    background-color: #7673ff;
    border: solid 1px #7673ff;
}
.headerMenuItem.hide {
    display: none;
}
.headerMenuItem.disable {
    opacity: 0.35;
    cursor: default;
}

.headerMenuWrapper {
    float: left;
    height: 100%;
}
.headerMenu {
    position: relative;
    float: left;
    margin-left: 20px;
    margin-top: 8px;
    padding-left: 15px;
    padding-right: 15px;
    height: 30px;
    line-height: 30px;
    font-size: 13px;
    color: #2c2c2c;
    text-align: left;
    cursor: pointer;
    border-radius: 4px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
}
.headerMenu:hover {
    color: #4000e3;
}
.headerMenu:first-child {
    margin-left: 80px;
}
.headerMenu.selected {
    background-color: rgba(0, 0, 0, 0.5);
    color: #ffffff;
}

/* header tabs */
.headerTabWrapper {
    position: relative;
    width: 318px;
    float: right;
    height: 100%;
}
.headerTab {
    position: absolute;
    width: 106px;
    height: 100%;
}
/* Screen tab */
.headerTab._S_ {
    background: url("../imgs/ui/top/aspen_top_tab01_off.png") no-repeat center;
}
.headerTab._S_.btnOver {
    background: url("../imgs/ui/top/aspen_top_tab01_hover.png") no-repeat center;
}
.headerTab._S_.btnDown {
    background: url("../imgs/ui/top/aspen_top_tab01_on.png") no-repeat center;
}
.headerTab._S_.btnSelected {
    background: url("../imgs/ui/top/aspen_top_tab01_on.png") no-repeat center;
}
/* Flow tab */
.headerTab._F_ {
    background: url("../imgs/ui/top/aspen_top_tab02_off.png") no-repeat center;
}
.headerTab._F_.btnOver {
    background: url("../imgs/ui/top/aspen_top_tab02_hover.png") no-repeat center;
}
.headerTab._F_.btnDown {
    background: url("../imgs/ui/top/aspen_top_tab02_on.png") no-repeat center;
}
.headerTab._F_.btnSelected {
    background: url("../imgs/ui/top/aspen_top_tab02_on.png") no-repeat center;
}
/* Run (Preview) tab */
.headerTab._P_ {
    background: url("../imgs/ui/top/aspen_top_tab03_off.png") no-repeat center;
}
.headerTab._P_.btnOver {
    background: url("../imgs/ui/top/aspen_top_tab03_hover.png") no-repeat center;
}
.headerTab._P_.btnDown {
    background: url("../imgs/ui/top/aspen_top_tab03_on.png") no-repeat center;
}
.headerTab._P_.btnSelected {
    background: url("../imgs/ui/top/aspen_top_tab03_on.png") no-repeat center;
}

/* header project title */
.headerPrjTitleImg {
    float: left;
    margin-top: 10px;
    height: 28px;
    width: 28px;
    background: url("../imgs/ui/icons/aspen_document_name.png") no-repeat center;
}
.headerPrjTitle {
    float: left;
    margin-left: -2px;
    margin-top: 13px;
    height: 23px;
    line-height: 23px;
    text-align: left;
    color: #4000e3;
    font-size: 13px;
    background-color: transparent;
    border: none;
    box-sizing: border-box;
    opacity: 0.9;
}
.headerPrjTitle.down {
    border-bottom: solid 1px #919191;
}
.headerPrjTitle:focus {
    text-align: left;
    opacity: 1;
}

/* header user */
.headerUser {
    float: right;
    margin-top: 12px;
    height: 23px;
    line-height: 23px;
    font-size: 13px;
    color: #666666;
}
.headerLogin {
    float: right;
    margin-top: 12px;
    margin-right: 15px;
    margin-left: 12px;
    height: 23px;
    line-height: 23px;
    font-size: 13px;
    color: #248600;
    cursor: pointer;
}
.headerLogin:hover {
    color: #7673ff;
}

.headerMyLibrary {
    float: right;
    margin-top: 12px;
    margin-right: 12px;
    width: 70px;
    height: 20px;
    line-height: 20px;
    font-size: 13px;
    color: #666666;
    cursor: pointer;
    border: 1px solid #7673ff;
    text-align: center;
}
.headerMyLibrary:hover {
    color: #7673ff;
    background-color: #f5f4f4;
}

.headerBarSep {
    float: left;
    margin-top: 20px;
    margin-left: 10px;
    margin-right: 10px;
    width: 1px;
    height: 13px;
    background-color: #c5c5c5;
}

.bottomTab {
    position: absolute;
    top: 0px;
    width: 100px;
    height: 34px;
    box-sizing: border-box;
    background: #ffffff url("../imgs/ui/bottom/aspen_bottom_tab_nor.png")
        no-repeat center;
    transition: background 0.3s;
    -webkit-transition: background 0.3s;
}
.bottomTab.btnOver {
    background: #ffffff url("../imgs/ui/bottom/aspen_bottom_tab_over.png")
        no-repeat center;
}
.bottomTab.btnDown {
    background: #ffffff url("../imgs/ui/bottom/aspen_bottom_tab_select.png")
        no-repeat center;
}
.bottomTab.btnSelected {
    font-weight: bold;
    background: #ffffff url("../imgs/ui/bottom/aspen_bottom_tab_selected.png")
        no-repeat center;
}

.bottomTabLayerWrapper {
    position: absolute;
    left: 0px;
    width: 100%;
}
.bottomTabContentWrapper {
    position: relative;
    float: left;
    width: 100%;
    height: auto;
}

.bottomTabTxt {
    float: left;
    padding-left: 5px;
    padding-right: 5px;
    width: 80px;
    color: #666666;
    font-size: 12px;
    line-height: 30px;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    box-sizing: border-box;
}
.bottomTabClose {
    width: 13px;
    height: 13px;
    background: url("../imgs/ui/bottom/aspen_bottom_close_nor.png") no-repeat
        center;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    border: solid 1px transparent;
}
.bottomTabClose:hover {
    border: solid 1px #e1e1e1;
    background-color: #f5f4f4;
}
.bottomTabClose:active {
    background-color: transparent;
    background-image: url("../imgs/ui/bottom/aspen_bottom_close_sel.png");
}

.bottomTabNaviBefBtn {
    float: left;
    margin-top: -1px;
    width: 22px;
    height: 34px;
    background: url("../imgs/ui/bottom/aspen_before_nor.png") no-repeat center;
}
.bottomTabNaviBefBtn.btnOver {
    background: url("../imgs/ui/bottom/aspen_before_over.png") no-repeat center;
}
.bottomTabNaviBefBtn.btnDown {
    background: url("../imgs/ui/bottom/aspen_before_sel.png") no-repeat center;
}

.bottomTabNaviAftBtn {
    float: left;
    margin-top: -1px;
    width: 22px;
    height: 34px;
    background: url("../imgs/ui/bottom/aspen_after_nor.png") no-repeat center;
}
.bottomTabNaviAftBtn.btnOver {
    background: url("../imgs/ui/bottom/aspen_after_over.png") no-repeat center;
}
.bottomTabNaviAftBtn.btnDown {
    background: url("../imgs/ui/bottom/aspen_after_sel.png") no-repeat center;
}

.bottomTabAddBtn {
    float: left;
    margin-top: 2px;
    margin-bottom: 2px;
    margin-left: 3px;
    box-sizing: border-box;
    border: solid 1px #c5c5c5;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    background: url("../imgs/ui/widget/aspen_interaction_add_nor.png") no-repeat
        center;
}
.bottomTabAddBtn.btnOver {
    border: solid 1px #a8a8a8;
    background-color: #f5f4f4;
}
.bottomTabAddBtn.btnDown {
    border: solid 1px #7673ff;
    background-color: #ffffff;
    background: url("../imgs/ui/widget/aspen_interaction_add_sel.png") no-repeat
        center;
}

.bottomSecneTab {
    position: relative;
    float: left;
    margin-left: 3px;
    padding-left: 10px;
    padding-right: 10px;
    width: 95px;
    height: 30px;
    font-size: 12px;
    color: #666666;
    line-height: 30px;
    box-sizing: border-box;
    border: solid 1px #c5c5c5;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    background-color: #ffffff;
}
.bottomSecneTab.btnOver {
    background-color: #f4f4f4;
}
.bottomSecneTab.btnDown {
    background-color: #e8e8e8;
}
.bottomSecneTab.btnSelected {
    font-weight: bold;
    color: #248600;
    border: solid 1px #7673ff;
}

.bottomLayerTab {
    position: relative;
    float: left;
    padding: 10px;
    padding-top: 0px;
    margin-top: 2px;
    margin-bottom: 2px;
    margin-left: 3px;
    width: 110px;
    height: 128px;
    font-size: 12px;
    color: #666666;
    box-sizing: border-box;
    border: solid 1px #c5c5c5;
    border-radius: 4px;
    -webkit-border-radius: 4px;
    background-color: #ffffff;
}
.bottomLayerTab.btnOver {
    background-color: #f4f4f4;
}
.bottomLayerTab.btnDown {
    background-color: #e8e8e8;
}
.bottomLayerTab.btnSelected {
    border: solid 1px #7673ff;
}

.bottomTabNaviWrapper {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 18px;
    color: #666666;
    border-right: solid 1px #c5c5c5;
    background-color: #dedede;
    box-sizing: border-box;
}
.bottomTabNaviBtn {
    width: 15px;
    height: 66px;
    line-height: 66px;
    border: solid 1px #ffffff;
    text-align: center;
}
.bottomTabNaviBtn:first-child {
    border-bottom: solid 1px #c5c5c5;
}
.bottomTabNaviBtn:hover {
    background-color: #d5d5d5;
}
/*.bottomTabLayerNaviBtn:hover {background:-webkit-linear-gradient(#f6f6f6, #dddcdc);background:linear-gradient(#f6f6f6, #dddcdc);}*/
.bottomTabNaviBtn:active {
    border: solid 1px #7673ff;
}

.bottomTabLayerNaviWrapper {
    position: absolute;
    left: 0px;
    bottom: 0px;
    width: 100%;
    color: #666666;
    box-sizing: border-box;
    font-size: 12px;
    background-color: #e2e2e2;
}
.bottomTabLayerNaviContent {
    position: absolute;
    left: 0px;
    top: 0px;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
}
.bottomTabLayerNavi {
    position: relative;
    float: left;
    height: 30px;
    margin-right: 15px;
}
.bottomTabLayerNavi .seperator {
    float: left;
    margin-top: 4px;
    margin-bottom: 4px;
    width: 0px;
    height: 22px;
    border-left: solid 1px #c5c5c5;
    border-right: solid 1px #f2f2f2;
}
.bottomTabLayerNavi .img {
    float: left;
    margin-left: 15px;
    margin-top: 6px;
    margin-bottom: 6px;
    width: 18px;
    height: 18px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
.bottomTabLayerNavi .txt {
    float: left;
    margin-left: 6px;
    line-height: 30px;
}
.bottomTabLayerNavi.normal .txt:hover {
    color: #424242;
    cursor: pointer;
}
.bottomTabLayerNavi.normal .img:hover {
    opacity: 0.8;
    cursor: pointer;
}
.bottomTabLayerNaviBack {
    float: left;
    padding-left: 15px;
    padding-right: 15px;
    width: 15px;
    height: 100%;
}
.bottomTabLayerNaviBack .img {
    width: 15px;
    height: 100%;
    background: url("../imgs/ui/icons/icon_back_nor.png") center no-repeat;
}
.bottomTabLayerNaviBack .img:hover {
    background: url("../imgs/ui/icons/icon_back_hover.png") center no-repeat;
}
.bottomTabLayerNavi:last-child {
    margin-right: 0px;
}
/*.bottomTabLayerNavi.normal {background-color:transparent;}*/
/*.bottomTabLayerNavi.selected {background-color: rgba(44,177,0,0.4);}*/
/*.bottomTabLayerNavi.page {background-image:url('../imgs/wgts/widgets/multi_layer_container.png');}*/
/*.bottomTabLayerNavi.layer {background-image:url('../imgs/wgts/widgets/multi_layer_container.png');}*/
/*.bottomTabLayerNavi.normal:hover {color:#248600;background-color:#f5f4f4;}*/
/*.bottomTabLayerNavi.normal:active {background-color:#ffffff;color:#248600;}*/

/* spin 제거 */
.bottomLayerTab input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.bottomLayerTabDel {
    position: absolute;
    top: 5px;
    right: 10px;
    width: 20px;
    height: 20px;
}
.bottomLayerTabDel.btnDown {
    position: absolute;
    top: 5px;
    right: 10px;
    width: 20px;
    height: 20px;
}

.bottomLayerTabTxt {
    float: left;
    margin-top: 6px;
    width: 70px;
    height: 20px;
    text-align: left;
}

.bottomLayerTabTxt:focus {
    border-bottom: solid 1px #666666;
}
.bottomLayerTabThumb {
    position: relative;
    margin-top: 5px;
    width: 100%;
    height: 88px;
    outline: solid 1px #c5c5c5;
}
.bottomLayerTabThumbDrag {
    display: none;
    position: absolute;
    left: 0px;
    bottom: 4px;
    width: 20px;
    height: 20px;
    outline: none;
    cursor: default;
    background: url("../imgs/ui/icons/screen_drag_horizontal.png") no-repeat
        center;
}

.propHeader {
    color: #000000;
    font-size: 13px;
}

.propGroup {
    position: relative;
    height: auto;
    border-bottom: solid 1px #c5c5c5;
}

.listWidgetGroupWrapper {
    width: 100%;
    height: auto;
}
.listWidgetGroupWrapper:last-child {
    border-bottom: solid 1px #c5c5c5;
}

/* (GNSHEET)
.listWidgetGroup {position:relative;clear:both;height:42px;font-size:13px;line-height:42px;color:#666666;background-color:#f5f4f4;background-repeat:no-repeat;box-sizing:border-box;border-top:solid 1px #c5c5c5;cursor:pointer;}
*/
.listWidgetGroup {
    position: relative;
    clear: both;
    height: 42px;
    font-size: 13px;
    line-height: 42px;
    color: #666666;
    background-color: #ffffff;
    background-repeat: no-repeat;
    box-sizing: border-box;
}
.listWidgetGroup.show {
    background-color: #ffffff;
    background-image: url("../imgs/ui/widget/aspen_widget_bullet01_nor.png");
    margin-bottom: 10px;
}
.listWidgetGroup.show.btnOver {
    background-color: #e9eaed;
}
.listWidgetGroup.show.btnDown {
    background-image: url("../imgs/ui/widget/aspen_widget_bullet01_sel.png");
}
.listWidgetGroup.hide {
    background-image: url("../imgs/ui/widget/aspen_widget_bullet02_nor.png");
}
.listWidgetGroup.hide.btnOver {
    background-color: #e9eaed;
}
.listWidgetGroup.hide.btnDown {
    background-image: url("../imgs/ui/widget/aspen_widget_bullet02_sel.png");
}

.listGroup {
    position: relative;
    clear: both;
    padding-left: 5px;
    padding-right: 5px;
    font-size: 13px;
    line-height: 1.8;
    color: #000000;
    background-repeat: no-repeat;
}
.listGroup.show {
    background-color: rgb(252, 205, 182);
    background-image: url("../imgs/ui/icons/arrow_down.png");
}
.listGroup.hide {
    background-color: #ffffff;
    background-image: url("../imgs/ui/icons/arrow_up.png");
}
.listGroup.hide.btnOver {
    background-color: rgb(252, 228, 220);
}
.listGroup.hide.btnDown {
    background-color: rgb(252, 205, 182);
}

/*.listPropGroup {position:relative;padding-left:15px;}*/
.listPropSize {
    float: left;
    margin-left: 2px;
    width: 31px;
    text-align: right;
}
.listPropSizeTxt {
    float: left;
    margin-left: 5px;
    margin-top: -2px;
    font-size: 10px;
    font-weight: bold;
}
.listPropSizeTxt:first-child {
    margin-left: 0px;
}

.listPropGroup {
    position: relative;
    padding-left: 10px;
    padding-right: 10px;
    height: auto;
}
.listPropGroup.scroll {
    padding-left: 10px;
    padding-right: 4px;
}
.listPropItem {
    display: table;
    position: relative;
    height: 30px;
    width: 100%;
    font-size: 13px;
    line-height: 30px;
    color: #000000;
}
.listPropItem.hide {
    display: none;
}

.listPropItemImgIcon {
    width: 26px;
    height: 28px;
    margin-right: 3px;
    margin-top: 2px;
    margin-bottom: 2px;
}
.listPropItemImgIcon.btnDown {
    outline: solid 1px rgb(118, 115, 255, 0.5);
}
.listPropItemImgIcon.btnSelected {
    outline: solid 1px rgb(118, 115, 255, 1);
}

.listPropItemIcon {
    width: 26px;
    height: 28px;
    background-repeat: no-repeat;
    background-position: center;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    opacity: 1;
}
/*
.listPropItemIcon.btnOver {box-shadow:inset 0px 0px 1px 1px #e1e1e1;background-color:#f5f4f4;}
.listPropItemIcon.btnDown {box-shadow:inset 0px 0px 1px 1px #c5c5c5;background-color:#eaeaea;}
.listPropItemIcon.btnSelected {box-shadow:inset 0px 0px 1px 1px #c5c5c5;background-color:#eaeaea;}
*/
.listPropItemIcon.btnDown {
    outline: solid 1px rgb(118, 115, 255, 0.5);
}
.listPropItemIcon.btnSelected {
    outline: solid 1px rgb(118, 115, 255, 1);
}
.listPropItemIcon.btnDisabled {
    background-color: transparent;
    opacity: 0.35;
}

.listPropTextButton {
    border: solid 1px #c5c5c5;
    background-color: #ffffff;
    padding: 0 15px;
    width: auto;
    line-height: 20px;
    height: 20px;
}
.listPropTextButton:hover {
    color: rgb(118, 115, 255, 1);
}
.listPropTextButton.btnDown {
    border: solid 1px rgb(118, 115, 255, 0.5);
}
.listPropItemIcon.btnSelected {
    border: solid 1px rgb(118, 115, 255, 1);
    color: rgb(118, 115, 255, 1);
}

.listPropItemRowSeperator {
    position: relative;
    clear: both;
    width: 100%;
    height: 0px;
    border-top: dotted 1px #dfdfdf;
    border-bottom: solid 1px #ffffff;
}
.listPropItemColSeperator {
    float: left;
    width: 0px;
    height: 17px;
    border-left: solid 1px #dfdfdf;
    border-right: solid 1px #ffffff;
}

.listItrAction {
    position: absolute;
    margin: 0px;
    top: 0px;
    left: -230px;
    width: 246px;
    background: #ffffff;
    box-sizing: border-box;
    border: 1px solid;
    border-color: #e5e6e9 #dfe0e4 #d0d1d5;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    font-size: 13px;
    color: #666666;
    text-align: left;
    line-height: 40px;
}
.listItrHeaderGroup {
    position: relative;
    height: auto;
    background-color: #ffffff;
}
.listItrHeaderItem {
    display: table;
    position: relative;
    padding-left: 20px;
    padding-right: 20px;
    height: 40px;
    font-size: 13px;
    line-height: 40px;
    color: #000000;
}
.listItrGroup {
    position: relative;
    padding-left: 8px;
    padding-right: 8px;
    height: auto;
    background-color: #ffffff;
}
.listItrItem {
    display: table;
    position: relative;
    width: 100%;
    height: 30px;
    font-size: 13px;
    line-height: 30px;
    color: #000000;
}

.listItrAddIcon {
    float: left;
    margin-top: 2px;
    width: 22px;
    height: 22px;
    margin-left: 8px;
    border: solid 1px #c5c5c5;
    border-radius: 4px;
    -webkit-border-radius: 4px;
}
.listItrAddIcon.itr {
    background: #ffffff url("../imgs/ui/widget/aspen_interaction_add_nor.png")
        no-repeat center;
}
.listItrAddIcon.itr.btnDown {
    border: solid 1px #7673ff;
    background: #ffffff url("../imgs/ui/widget/aspen_interaction_add_sel.png")
        no-repeat center;
}
.listItrAddIcon.itr.btnOver {
    background: #ffffff url("../imgs/ui/widget/aspen_interaction_add_sel.png")
        no-repeat center;
}
.listItrAddIcon.js {
    background: #ffffff url("../imgs/ui/icons/aspen_script_nor.png") no-repeat
        center;
}
.listItrAddIcon.js.btnDown {
    border: solid 1px #7673ff;
    background: #ffffff url("../imgs/ui/icons/aspen_script_sel.png") no-repeat
        center;
}
.listItrAddIcon.btnOver {
    border: solid 1px #a8a8a8;
    background-color: #f5f4f4;
}

.listItrStringGroup {
    position: relative;
    margin: 2px;
    height: auto;
    box-sizing: border-box;
    border: 1px solid #c5c5c5;
    background-color: #ffffff;
    overflow: hidden;
}
.listItrStringGroup:hover {
    outline: solid 2px #7673ff;
}
.listItrItemCategory {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 15px;
    height: 100%;
    background-color: #ffffff;
}
.listItrStringItem {
    position: relative;
    padding: 5px;
    padding-left: 18px;
    padding-right: 18px;
    font-size: 13px;
    color: #666666;
}
.listItrStringItem div {
    cursor: pointer;
}
.listItrStringItem span {
    display: inline;
    vertical-align: initial;
}

.listWidgetListSearch {
    margin-left: 10px;
    margin-top: 8px;
    width: 140px;
    height: 24px;
    padding-left: 5px;
    padding-right: 5px;
    font-size: 12px;
    color: rgba(102, 102, 102, 0.5);
    text-align: left;
    box-sizing: border-box;
    border: solid 1px #c5c5c5;
    border-radius: 2px;
    -webkit-border-radius: 2px;
}
.listWidgetListHeader {
    width: 100%;
    height: 30px;
    background-color: rgba(0, 0, 0, 0.2);
    line-height: 30px;
    padding-left: 5px;
    font-size: 14px;
    color: #ffffff;
}
.listWidgetListGroup {
    position: relative;
    padding-left: 5px;
    padding-right: 5px;
    height: auto;
}
.listWidgetListGroup span {
    display: inline;
    vertical-align: initial;
}
.listWidgetListItem {
    display: table;
    position: relative;
    height: 25px;
    width: 100%;
    font-size: 13px;
    line-height: 20px;
    color: rgba(0, 0, 0, 0.6);
}
.listWidgetListIcon {
    position: absolute;
    top: 2px;
    width: 26px;
    height: 26px;
    cursor: pointer;
}
.listWidgetListIcon.script {
    right: 0px;
    background: url("../imgs/ui/icons/script_exist.png") no-repeat center;
    cursor: default;
}
.listWidgetListIcon.edit {
    right: 52px;
    background: url("../imgs/ui/icons/widget_list_edit_nor.png") no-repeat
        center;
}
.listWidgetListIcon.edit:hover {
    background: url("../imgs/ui/icons/widget_list_edit_hover.png") no-repeat
        center;
}
.listWidgetListIcon.edit:active {
    background: url("../imgs/ui/icons/widget_list_edit_hover.png") no-repeat
        center;
}
.listWidgetListIcon.setup {
    right: 26px;
    background: url("../imgs/ui/icons/widget_list_setup_nor.png") no-repeat
        center;
}
.listWidgetListIcon.setup:hover {
    background: url("../imgs/ui/icons/widget_list_setup_hover.png") no-repeat
        center;
}
.listWidgetListIcon.setup:active {
    background: url("../imgs/ui/icons/widget_list_setup_hover.png") no-repeat
        center;
}
.listWidgetListIcon.show {
    right: 0px;
    background: url("../imgs/ui/icons/widget_list_unhide_nor.png") no-repeat
        center;
}
.listWidgetListIcon.show:hover {
    background: url("../imgs/ui/icons/widget_list_unhide_hover.png") no-repeat
        center;
}
.listWidgetListIcon.show:active {
    background: url("../imgs/ui/icons/widget_list_unhide_hover.png") no-repeat
        center;
}
.listWidgetListIcon.hide {
    right: 0px;
    background: url("../imgs/ui/icons/widget_list_hide_nor.png") no-repeat
        center;
}
.listWidgetListIcon.hide:hover {
    background: url("../imgs/ui/icons/widget_list_hide_hover.png") no-repeat
        center;
}
.listWidgetListIcon.hide:active {
    background: url("../imgs/ui/icons/widget_list_hide_hover.png") no-repeat
        center;
}
.listWidgetListIcon.setupRO {
    right: 26px;
    background: url("../imgs/ui/icons/widget_list_info_nor.png") no-repeat
        center;
}
.listWidgetListIcon.setupRO:hover {
    background: url("../imgs/ui/icons/widget_list_info_press.png") no-repeat
        center;
}
.listWidgetListIcon.setupRO:active {
    background: url("../imgs/ui/icons/widget_list_info_press.png") no-repeat
        center;
}
.listWidgetListIcon.delete {
    right: 52px;
    background: url("../imgs/ui/icons/icon_delete.png") no-repeat center;
}
.listWidgetListIcon.delete:hover {
    background: url("../imgs/ui/icons/icon_delete.png") no-repeat center;
}
.listWidgetListIcon.delete:active {
    background: url("../imgs/ui/icons/icon_delete.png") no-repeat center;
}

/*	%%SCHONG 2019/02 */
.listWidgetListIcon.import {
    right: 52px;
    background: url("../imgs/ui/icons/table_import_nor.png") no-repeat center;
}
.listWidgetListIcon.import:hover {
    background: url("../imgs/ui/icons/table_import_hover.png") no-repeat center;
}
.listWidgetListIcon.import:active {
    background: url("../imgs/ui/icons/table_import_hover.png") no-repeat center;
}
.listWidgetListIcon.export {
    right: 52px;
    background: url("../imgs/ui/icons/table_export_nor.png") no-repeat center;
}
.listWidgetListIcon.export:hover {
    background: url("../imgs/ui/icons/table_export_hover.png") no-repeat center;
}
.listWidgetListIcon.export:active {
    background: url("../imgs/ui/icons/table_export_hover.png") no-repeat center;
}

.dragListItrItem {
    position: absolute;
    left: 4px;
    width: 6px;
    height: 14px;
    background: url("../imgs/ui/icons/screen_drag_property.png") no-repeat
        center;
    opacity: 0;
    pointer-events: none;
}
/*.deleteListItrItem {position:absolute;right:0px;bottom:0px;width:20px;height:20px;background:url('../imgs/ui/icons/icon_delete.png') no-repeat center;transition:opacity 0.3s;-webkit-transition:opacity 0.3s;opacity:0;}*/
.listItrItemAction {
    position: absolute;
    bottom: 0px;
    width: 20px;
    height: 20px;
    cursor: pointer;
}
.listItrItemAction.delete {
    right: -25px;
    background: url("../imgs/ui/icons/icon_delete.png") no-repeat center center;
}
.listItrItemAction.duplicate {
    right: -25px;
    background: url("../imgs/ui/icons/icon_duplicate.png") no-repeat center
        center;
}

/*.deleteListItrItem {position:absolute;bottom:0px;width:62px;height:20px;line-height:20px;font-size:13px;text-align:center;color:#ffffff;background-color:rgba(102,102,102,0.6);transition:right 0.3s;-webkit-transition:right 0.3s;}*/
/*.deleteListItrItem.btnOver {background-color:rgba(102,102,102,0.8);}*/
/*.deleteListItrItem.btnDown {background-color:#7673ff;}*/

.scriptWidgetWrapper {
    padding-left: 10px;
    padding-right: 10px;
    overflow: hidden;
    height: auto;
}
.scriptWidgetWrapper > table {
    border-collapse: collapse;
    width: 100%;
}
.scriptWidgetWrapper > table > thead > tr {
    font-size: 13px;
    line-height: 25px;
    color: #000000;
    border-bottom: dotted 1px #656565;
}
.scriptWidgetWrapper > table > thead > tr > td {
    padding-left: 10px;
    padding-right: 5px;
    text-align: left;
    background-color: #f2f2f2;
    border-right: solid 1px #d4cccc;
}
.scriptWidgetWrapper > table > thead > tr > td:first-child {
    width: 130px;
    min-width: 130px;
    max-width: 130px;
}
.scriptWidgetWrapper > table > thead > tr > td:last-child {
    padding-left: 5px;
    border-right: none;
}
.scriptWidgetWrapper > table > tbody > tr {
    font-size: 13px;
    line-height: 25px;
    color: #000000;
    border-bottom: dotted 1px #656565;
}
.scriptWidgetWrapper > table > tbody > tr > td {
    padding-left: 10px;
    padding-right: 5px;
    text-align: left;
    background-color: #f2f2f2;
    border-right: solid 1px #d4cccc;
}
.scriptWidgetWrapper > table > tbody > tr:last-child {
    border-bottom: none;
}
.scriptWidgetWrapper > table > tbody > tr > td:first-child {
    width: 130px;
    min-width: 130px;
    max-width: 130px;
}
.scriptWidgetWrapper > table > tbody > tr > td:last-child {
    padding-left: 5px;
    border-right: none;
    background-color: #ffffff;
}
.scriptWidgetWrapper.scroll {
    padding-right: 0px;
}
#bubble_property_funcs
    .scriptWidgetWrapper
    > table
    > thead
    > tr
    > td:first-child {
    width: 40px;
    min-width: 40px;
    max-width: 40px;
}
#bubble_property_funcs
    .scriptWidgetWrapper
    > table
    > tbody
    > tr
    > td:first-child {
    width: 40px;
    min-width: 40px;
    max-width: 40px;
}

.scriptPropGroup {
    position: relative;
    height: auto;
}
.listScriptPropGroupWrapper {
    width: 100%;
    height: auto;
    border-top: solid 1px #656565;
}
.listScriptPropGroupWrapper:first-child {
    border-top: none;
}
.listScriptPropGroupWrapper:last-child {
    border-bottom: solid 1px #656565;
}
.listScriptPropGroup {
    clear: both;
    position: relative;
    padding-left: 10px;
    padding-right: 10px;
    height: 42px;
    font-size: 13px;
    line-height: 42px;
    color: #666666;
    background-color: #f5f4f4;
    background-repeat: no-repeat;
    box-sizing: border-box;
    border-bottom: solid 1px #c5c5c5;
    cursor: pointer;
}
.listScriptPropGroup.normal {
    background-color: #ffffff;
}
.listScriptPropGroup.show {
    border-bottom: dotted 1px #656565;
    background-color: #ffffff;
    background-image: url("../imgs/ui/widget/aspen_widget_bullet01_nor.png");
}
.listScriptPropGroup.show:hover {
    background-color: #e9eaed;
}
.listScriptPropGroup.show:active {
    background-image: url("../imgs/ui/widget/aspen_widget_bullet01_sel.png");
}
.listScriptPropGroup.hide {
    background-image: url("../imgs/ui/widget/aspen_widget_bullet02_nor.png");
}
.listScriptPropGroup.hide:hover {
    background-color: #e9eaed;
}
.listScriptPropGroup.hide:active {
    background-image: url("../imgs/ui/widget/aspen_widget_bullet02_sel.png");
}

.listScriptPropItem {
    display: table;
    position: relative;
    height: 25px;
    width: 100%;
    font-size: 13px;
    line-height: 25px;
    color: #000000;
    border-bottom: dotted 1px #c5c5c5;
}
.listScriptPropItem:last-child {
    border-bottom: none;
}
.listScriptPropItem span {
    display: table-cell;
    vertical-align: middle;
}
.listScriptPropItem div span {
    display: table-cell;
    vertical-align: middle;
}

.listScriptPropItemT1 {
    position: relative;
    height: auto;
    width: 100%;
    font-size: 13px;
    line-height: 25px;
    color: #000000;
    border-bottom: dotted 1px #c5c5c5;
}
.listScriptPropItemT1:last-child {
    border-bottom: none;
}
.listScriptPropItemT1 span.help {
    display: block;
    line-height: 1.4em;
    font-style: italic;
    color: #666666;
}

.listScriptPropKey {
    float: left;
    padding-left: 5px;
    width: 70px;
    text-align: left;
    color: #8e8e8e;
    background-color: #f2f2f2;
    border-right: solid 1px #d4cccc;
}

.relCoordGroup {
    position: relative;
    height: auto;
    border-bottom: solid 1px #c5c5c5;
}
.relCoordGroup .btnOver {
    background-color: rgba(102, 102, 102, 0.8);
}
.relCoordGroup .btnDown {
    background-color: #7673ff;
}
.relCoordGroup .btnSelected {
    border: solid 1px #7673ff;
    background-color: #f5f4f4;
    color: #248600;
}

.relCoordType {
    float: left;
    margin-right: 5px;
    margin-top: 8px;
    width: 40px;
    line-height: 24px;
    text-align: center;
    border: solid 1px #afafaf;
    box-sizing: border-box;
    cursor: pointer;
}

.relCoordInput {
    float: left;
    width: 45px;
    height: 20px;
    padding-left: 5px;
    border: solid 1px #afafaf;
}
.relCoordInputChk {
    float: left;
    margin-top: 8px;
    width: 24px;
    height: 24px;
    line-height: 24px;
    text-align: center;
    border: solid 1px transparent;
}
.relCoordInputChk.btnOver {
    background-color: rgba(102, 102, 102, 0.8);
}
.relCoordInputChk.btnDown {
    background-color: #7673ff;
}
.relCoordInputChk.btnSelected {
    border: solid 1px #7673ff;
    background-color: #f5f4f4;
    color: #248600;
}

.scrHeaderIcon {
    width: 28px;
    height: 28px;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    border: solid 1px transparent;
}
.scrHeaderIcon.btnOver {
    background-color: transparent;
}
.scrHeaderIcon.btnDown {
    outline: solid 1px rgb(118, 115, 255, 0.5);
    background-color: transparent;
}
.scrHeaderIcon.btnSelected {
    outline: solid 1px rgb(118, 115, 255, 0.5);
    background-color: transparent;
}

/*.headerIcon.over {background-color:rgb(252,228,220);}*/
/*.headerIcon.down {background-color:rgb(245,186,157);}*/

/* Zoom */
.toolZoom {
    width: 205px;
    height: 34px;
}

.toolZoomBtn {
    position: absolute;
    top: 8px;
    width: 18px;
    height: 18px;
    border: solid 1px #c5c5c5;
    background-position: center;
    background-repeat: no-repeat;
    background-color: #ffffff;
    border-radius: 2px;
    -webkit-border-radius: 2px;
}
.toolZoomBtn.in {
    right: 0px;
    background-image: url("../imgs/ui/bottom/aspen_bottom_zoomin_nor.png");
}
.toolZoomBtn.in.btnOver {
    background-image: url("../imgs/ui/bottom/aspen_bottom_zoomin_sel.png");
    border: solid 1px #a8a8a8;
    background-color: #f5f4f4;
}
.toolZoomBtn.in.btnDown {
    background-image: url("../imgs/ui/bottom/aspen_bottom_zoomin_sel.png");
    border: solid 1px #7673ff;
    background-color: #ffffff;
}
.toolZoomBtn.out {
    right: 142px;
    background-image: url("../imgs/ui/bottom/aspen_bottom_zoomout_nor.png");
}
.toolZoomBtn.out.btnOver {
    background-image: url("../imgs/ui/bottom/aspen_bottom_zoomout_sel.png");
    border: solid 1px #a8a8a8;
    background-color: #f5f4f4;
}
.toolZoomBtn.out.btnDown {
    background-image: url("../imgs/ui/bottom/aspen_bottom_zoomout_sel.png");
    border: solid 1px #7673ff;
    background-color: #ffffff;
}

.toolZoomSlide {
    position: absolute;
    right: 26px;
    width: 108px;
    height: 34px;
}
.toolZoomSlideLine {
    position: absolute;
    left: 0px;
    top: 16px;
    width: 100%;
    height: 2px;
    background-color: #787878;
    border-radius: 2px;
    -webkit-border-radius: 2px;
}
.toolZoomSlidebar {
    position: absolute;
    width: 9px;
    height: 34px;
    background: url("../imgs/ui/bottom/aspen_bottom_scroll.png") no-repeat
        center;
}
.toolZoomSlidebar.btnOver {
    background: url("../imgs/ui/bottom/aspen_bottom_scroll.png") no-repeat
        center;
}
.toolZoomSlidebar.btnDown {
    background: url("../imgs/ui/bottom/aspen_bottom_scroll.png") no-repeat
        center;
}

.toolZoomtxt {
    position: absolute;
    left: 0px;
    top: 0px;
    width: 40px;
    height: 34px;
    padding-left: 4px;
    padding-right: 4px;
    line-height: 34px;
    font-size: 12px;
    color: #666666;
    text-align: left;
}

/* menu */
.menuImgItem {
    position: relative;
    width: auto;
    font-size: 13px;
    line-height: 1.4;
    color: #000000;
    border: solid 1px transparent;
    padding: 5px;
    cursor: pointer;
}
.menuImgItem.over {
    border: solid 1px rgb(118, 115, 255, 0.5);
}
.menuImgItem.down {
    border: solid 1px rgb(118, 115, 255, 0.8);
}
.menuImgItem.selected {
    border: solid 1px #7673ff;
}
.menuImgItem.disable {
    cursor: default;
    opacity: 0.5;
}

.menuItem {
    position: relative;
    width: 110px;
    font-size: 13px;
    line-height: 1.5;
    color: #000000;
    border-bottom: solid 1px #c5c5c5;
    padding: 5px;
    cursor: pointer;
}
/*
.menuItem.over {background-color:#c5c5c5;color:#248600;}
.menuItem.down {background-color:#666666;color:#248600;}
.menuItem.selected {background-color:rgba(44,177,0,0.4);}
*/
.menuItem.over {
    background-color: rgb(118, 115, 255, 0.2);
}
.menuItem.down {
    background-color: rgb(118, 115, 255, 0.7);
}
.menuItem.selected {
    background-color: rgb(118, 115, 255, 0.5);
}
.menuItem:last-child {
    border-bottom: none;
}
.menuItem.disable {
    cursor: default;
    opacity: 0.5;
}

/* resource image css */
.rscPreviewContainer {
    position: relative;
    float: right;
    width: 344px;
    height: 444px;
    box-sizing: border-box;
    border-bottom: solid 1px #c5c5c5;
    color: #b7b7b7;
    font-size: 18px;
}
.rscPreviewContainer.dragOver {
    border: solid 1px transparent;
    outline: #c5c5c5 dotted thick;
}

.rscPreviewBg {
    position: relative;
    float: right;
    width: 100%;
    height: 415px;
    padding: 10px;
    box-sizing: border-box;
    background-image: url("../imgs/ui/popup/pallet_bg_pattern.png");
    background-size: 0px;
}

.rscPreview {
    position: absolute;
    width: 324px;
    height: 395px;
    box-sizing: border-box;
    text-align: center;
    color: #b7b7b7;
    font-size: 18px;
}
.pdfPreview {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    text-align: center;
    color: #b7b7b7;
    font-size: 18px;
}
.tmpPreview {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    text-align: center;
    color: #b7b7b7;
    font-size: 18px;
}

#wndPopupImgMgr___filename {
    max-width: 60%;
    text-overflow: ellipsis;
    overflow: hidden;
}
.rscPreviewInfo {
    position: relative;
    float: right;
    width: 100%;
    height: 28px;
    border-top: solid 1px #c5c5c5;
    box-sizing: border-box;
    background-color: #ffffff;
}
.rscPreviewInfoText {
    height: 29px;
    color: #666666;
    font-size: 13px;
    line-height: 29px;
    text-overflow: ellipsis;
    overflow: hidden;
}
.rscPreviewInfoDiv {
    width: 1px;
    height: 11px;
    margin-top: 8px;
    background-image: url("../imgs/ui/popup/manager_divider.png");
}

.rscListWrapper {
    position: relative;
    float: left;
    width: 598px;
    height: 444px;
    border-right: solid 1px #c5c5c5;
    border-bottom: solid 1px #c5c5c5;
    box-sizing: border-box;
}
.rscListWrapper.dragOver {
    width: 597px;
    border: solid 1px transparent;
    outline: #c5c5c5 dotted thick;
}

.rscImgBtn {
    position: relative;
    float: left;
    margin-left: 10px;
    margin-top: 10px;
    padding: 4px;
    width: 80px;
    height: 80px;
    color: #666666;
    text-align: center;
    border: solid 1px #c5c5c5;
    background-color: #ffffff;
    box-sizing: border-box;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    background-image: url("../imgs/ui/popup/pallet_bg_pattern.png");
}
.rscImgBtn.btnOver {
    border: solid 2px #c5c5c5;
    background-color: #f0f0f0;
}
.rscImgBtn.btnDown {
    border: solid 2px #7673ff;
    background-color: #ffffff;
    color: #248600;
}
.rscImgBtn.btnSelected {
    border: solid 5px #7673ff;
    background-color: #f5f4f4;
    color: #248600;
    padding: 2px;
}

.rscImgContent {
    width: 70px;
    height: 70px;
    cursor: pointer;
}

.rscImgBtnRefCnt {
    position: absolute;
    top: 0px;
    right: 0px;
    width: 20px;
    height: 20px;
    background-color: #484848;
    color: #ffffff;
    font-size: 13px;
    line-height: 20px;
    text-align: center;
    overflow: hidden;
}

/* popup resource list css */
.popupRscList {
    position: relative;
    width: 550px;
    height: 29px;
    padding-left: 3px;
    padding-right: 10px;
    margin-top: 3px;
    font-size: 12px;
    background-color: #ffffff;
    color: #666666;
    border: solid 1px transparent;
    border-radius: 5px;
    cursor: pointer;
    line-height: 29px;
}
.popupRscList.btnOver {
    border: solid 1px #a8a8a8;
    background-color: #f5f4f4;
}
.popupRscList.btnSelected {
    background-color: #ffffff;
    color: #248600;
    border: solid 1px #248600;
}

/* popup template list css */
.popupTemplateList {
    height: 29px;
    float: left;
    font-size: 12px;
    color: #666666;
    line-height: 29px;
    text-align: center;
    text-overflow: ellipsis;
    overflow: hidden;
    padding-left: 10px;
    padding-right: 10px;
}
.popupTemplateListDeleted {
    height: 29px;
    float: left;
    font-size: 12px;
    color: #ff0000;
    line-height: 29px;
    text-align: center;
    text-overflow: ellipsis;
    overflow: hidden;
    padding-left: 10px;
    padding-right: 10px;
    opacity: 0.7;
}
.popupTemplateListTitle {
    width: 100%;
    height: 30px;
    border-bottom: solid 1px #c5c5c5;
}
.templateIndicatorArea {
    position: relative;
    float: left;
    width: 100%;
    height: 42px;
}

.templateKeywordArea {
    position: absolute;
    margin-left: 12px;
    height: 100%;
}
.templateKeywordArea div {
    padding-top: 0px;
    padding-bottom: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
}
.templateKeywordArea select {
    padding-top: 0px;
    padding-bottom: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
}
.templateKeywordArea input {
    padding-top: 0px;
    padding-bottom: 0px;
    margin-top: 0px;
    margin-bottom: 0px;
}
.templateKeywordArea label {
    margin-left: 5px;
    margin-right: 5px;
}

.indicatorText {
    float: left;
    width: 56px;
    height: 20px;
    color: #666666;
    font-size: 13px;
    text-align: center;
    line-height: 20px;
}

.indicatorPrevBtn {
    float: left;
    position: relative;
    width: 18px;
    height: 18px;
    border: solid 1px #c5c5c5;
    background-color: #ffffff;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    background-image: url("../imgs/ui/icons/popup_prev_nor.png");
    background-repeat: no-repeat;
    background-position: center;
}
.indicatorPrevBtn.btnOver {
    border: solid 1px #a8a8a8;
    background-color: #f5f4f4;
}
.indicatorPrevBtn.btnDown {
    border: solid 1px #7673ff;
    background-color: #ffffff;
    color: #248600;
}
.indicatorPrevBtn.btnSelected {
    border: solid 1px #7673ff;
    background-color: #ffffff;
    background-image: url("../imgs/ui/icons/popup_prev_sel.png");
}

.indicatorNextBtn {
    float: left;
    position: relative;
    width: 18px;
    height: 18px;
    border: solid 1px #c5c5c5;
    background-color: #ffffff;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    background-image: url("../imgs/ui/icons/popup_next_nor.png");
    background-repeat: no-repeat;
    background-position: center;
}
.indicatorNextBtn.btnOver {
    border: solid 1px #a8a8a8;
    background-color: #f5f4f4;
}
.indicatorNextBtn.btnDown {
    border: solid 1px #7673ff;
    background-color: #ffffff;
    color: #248600;
}
.indicatorNextBtn.btnSelected {
    border: solid 1px #7673ff;
    background-color: #ffffff;
    background-image: url("../imgs/ui/icons/popup_next_sel.png");
}

/* Account List css */
.popupAccountList {
    position: relative;
    width: 746px;
    height: 29px;
    margin-top: 3px;
    font-size: 12px;
    background-color: #ffffff;
    color: #666666;
    border: solid 1px transparent;
    border-radius: 5px;
    cursor: pointer;
    line-height: 29px;
}
.popupAccountList.btnOver {
    border: solid 1px #a8a8a8;
    background-color: #f5f4f4;
}
.popupAccountList.btnSelected {
    background-color: #ffffff;
    color: #248600;
    border: solid 1px #248600;
}

/* ==== Property ==== */
.propertyLeft {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 17px;
    height: 100%;
    box-sizing: border-box;
    border-left: solid 1px #c5c5c5;
    border-right: solid 1px #c5c5c5;
    background-image: url("../imgs/ui/icons/ui_close.png");
    background-repeat: no-repeat;
    background-position: center;
    background-color: #dedede;
    cursor: pointer;
}
.propertyLeft.open {
    background-image: url("../imgs/ui/icons/ui_open.png");
}
.propertyLeft:hover {
    background-color: #d5d5d5;
}

.propertyRight .listWidgetGroup {
    position: relative;
    clear: both;
    height: 40px;
    font-size: 13px;
    line-height: 40px;
    color: #666666;
    background-color: #f5f4f4;
    background-repeat: no-repeat;
    box-sizing: border-box;
}
.propertyRight .listWidgetGroup.show {
    background-image: url("../imgs/ui/widget/aspen_widget_bullet01_nor.png");
    margin-bottom: 10px;
}

/* ==== Preview ==== */
.prvConsoleBtn {
    position: absolute;
    padding-left: 8px;
    padding-right: 12px;
    width: 70px;
    height: 30px;
    font-size: 12px;
    color: #666666;
    line-height: 30px;
    text-align: right;
    box-sizing: border-box;
    border: solid 1px #c5c5c5;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    background-color: #ffffff;
    background-position: 8px center;
    background-repeat: no-repeat;
}
.prvConsoleBtn.on {
    background-image: url("../imgs/ui/icons/aspen_run_show.png");
}
.prvConsoleBtn.off {
    background-image: url("../imgs/ui/icons/aspen_run_hide.png");
}
.prvConsoleBtn.btnOver {
    border: solid 1px #a8a8a8;
    background-color: #f5f4f4;
}
.prvConsoleBtn.btnDown {
    border: solid 1px #7673ff;
    color: #248600;
}
.prvConsoleBtn.btnSelected {
    border: solid 1px #7673ff;
    color: #248600;
}

.prvCfgBtn {
    position: absolute;
    width: 30px;
    height: 30px;
    margin-right: 10px;
    background: url("../imgs/ui/icons/setup_nor.png") no-repeat center;
    cursor: pointer;
}
.prvCfgBtn:hover {
    background: url("../imgs/ui/icons/setup_sel.png") no-repeat center;
}
.prvCfgBtn:active {
    background: url("../imgs/ui/icons/setup_nor.png") no-repeat center;
}

.prvFullScreenBtn {
    position: absolute;
    width: 30px;
    height: 30px;
    background: url("../imgs/ui/icons/full_screen_nor.png") no-repeat center;
    cursor: pointer;
}
.prvFullScreenBtn:hover {
    background: url("../imgs/ui/icons/full_screen_press.png") no-repeat center;
}
.prvFullScreenBtn:active {
    background: url("../imgs/ui/icons/full_screen_nor.png") no-repeat center;
}

.prvEmulExeSel {
    position: absolute;
    width: auto;
    height: 30px;
    text-align: center;
}

.prvRestoreScreenBtn {
    position: absolute;
    right: 10px;
    top: 10px;
    width: 47px;
    height: 41px;
    background: url("../imgs/ui/icons/zoom_screen_nor.png") no-repeat center;
    cursor: pointer;
}
.prvRestoreScreenBtn:hover {
    background: url("../imgs/ui/icons/zoom_screen_press.png") no-repeat center;
}
.prvRestoreScreenBtn:active {
    background: url("../imgs/ui/icons/zoom_screen_nor.png") no-repeat center;
}

.prvBtn {
    position: absolute;
    width: 30px;
    height: 30px;
    background: url("../imgs/ui/icons/full_screen_nor.png") no-repeat center;
}
.prvFullBtn:hover {
    background: url("../imgs/ui/icons/full_screen_press.png") no-repeat center;
}
.prvFullBtn:active {
    background: url("../imgs/ui/icons/full_screen_nor.png") no-repeat center;
}

.prvSplitSelect {
    color: rgb(102, 102, 102);
    font-family: "Segoe UI", Arial, Verdana, Tahoma, sans-serif;
    font-size: 13px;
    height: 28px;
    line-height: 28px;
}
.prvSplitSelectTag {
    color: rgb(102, 102, 102);
    font-family: "Segoe UI", Arial, Verdana, Tahoma, sans-serif;
    font-size: 13px;
    height: 28px;
    line-height: 28px;
}

.prvViewTypeSel {
    position: absolute;
    width: auto;
    height: 30px;
    text-align: center;
}

/* ==== New Project Dialog ==== */
.newPrjLeft {
    float: left;
    width: 200px;
    font-size: 13px;
}
.newPrjRight {
    float: left;
    width: auto;
}
.newPrjLeftTemplate {
    float: left;
    width: 200px;
    font-size: 13px;
}

.newIconDisabled {
    opacity: 0.8;
}

/* ==== Common Input Text ==== */
.commonInputText {
    display: table-cell;
    vertical-align: middle;
    padding-left: 5px;
    padding-right: 5px;
    height: 24px;
    border: solid 1px #c5c5c5;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    color: #666666;
    font-size: 12px;
}
.commonText {
    float: left;
    height: 25px;
    text-align: center;
    color: #666666;
    font-size: 13px;
    line-height: 25px;
}
.commonSelect {
    display: table-cell;
    vertical-align: middle;
    padding-left: 5px;
    padding-right: 5px;
    height: 24px;
    border: solid 1px #c5c5c5;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    opacity: 1;
}

/* ==== Object list Floating ==== */
/*.floatingFooter {position:relative;float:right;background:url('../imgs/ui/icons/popup_resize.png') no-repeat center;width:26px;height:26px;cursor:nwse-resize;}*/
.floatingFooter {
    position: absolute;
    bottom: 0px;
    right: 0px;
    background: url("../imgs/ui/icons/popup_resize.png") no-repeat center;
    width: 26px;
    height: 26px;
    cursor: nwse-resize;
}
.floatingObjItem {
    clear: both;
    position: relative;
    width: 100%;
    height: 25px;
    line-height: 25px;
    font-size: 12px;
    color: #464646;
}
.floatingObjItemSepeartor {
    clear: both;
    margin-left: 15px;
    margin-right: 0px;
    width: auto;
    height: 0px;
    border-bottom: dotted 1px transparent;
}

.floatingTreeViewBtn {
    float: left;
    margin-top: 6px;
    margin-right: 5px;
    width: 13px;
    height: 13px;
    cursor: pointer;
}
.floatingTreeViewBtn.up {
    background: url("../imgs/ui/widget/aspen_widget_bullet01_nor.png") no-repeat
        center;
}
.floatingTreeViewBtn.up:hover {
    background: url("../imgs/ui/widget/aspen_widget_bullet01_over.png")
        no-repeat center;
}
.floatingTreeViewBtn.up:active {
    background: url("../imgs/ui/widget/aspen_widget_bullet01_sel.png") no-repeat
        center;
}
.floatingTreeViewBtn.down {
    background: url("../imgs/ui/widget/aspen_widget_bullet02_nor.png") no-repeat
        center;
}
.floatingTreeViewBtn.down:hover {
    background: url("../imgs/ui/widget/aspen_widget_bullet02_over.png")
        no-repeat center;
}
.floatingTreeViewBtn.down:active {
    background: url("../imgs/ui/widget/aspen_widget_bullet02_sel.png") no-repeat
        center;
}

.floatingObjListTabWrapper {
    width: 100%;
    height: 30px;
    border-bottom: solid 1px #c5c5c5;
    box-sizing: border-box;
}
.floatingObjListTab {
    position: absolute;
    top: 5px;
    width: 93px;
    height: 25px;
    text-align: center;
    font-weight: bold;
    font-size: 12px;
    line-height: 25px;
    background: url("../imgs/ui/popup/tap_on.png");
}
.floatingObjListTab.label {
    left: 5px;
}
.floatingObjListTab.all {
    left: 89px;
}
.floatingObjListTab.over {
    cursor: pointer;
    font-weight: normal;
    background: url("../imgs/ui/popup/tap_off.png");
    color: #7673ff;
}
.floatingObjListTab.off {
    cursor: pointer;
    font-weight: normal;
    background: url("../imgs/ui/popup/tap_off.png");
}

.floatingObjListFold {
    position: absolute;
    top: 5px;
    right: 10px;
    width: 25px;
    height: 25px;
    background: url("../imgs/ui/icons/fold_nor.png") no-repeat center;
}
.floatingObjListFold:hover {
    background: url("../imgs/ui/icons/fold_hover.png") no-repeat center;
}
.floatingObjListFold:active {
    background: url("../imgs/ui/icons/fold_press.png") no-repeat center;
}
.floatingObjListUnfold {
    position: absolute;
    top: 5px;
    right: 10px;
    width: 25px;
    height: 25px;
    background: url("../imgs/ui/icons/unfold_nor.png") no-repeat center;
}
.floatingObjListUnfold:hover {
    background: url("../imgs/ui/icons/unfold_hover.png") no-repeat center;
}
.floatingObjListUnfold:active {
    background: url("../imgs/ui/icons/unfold_press.png") no-repeat center;
}

.floatingObjListOrder {
    position: absolute;
    top: 6px;
    right: 35px;
    width: 31px;
    height: 22px;
}
.floatingObjListOrder[data-op="normal"] {
    background: url("../imgs/ui/icons/z_index_off_nor.png") no-repeat center;
}
.floatingObjListOrder[data-op="normal"]:hover {
    background: url("../imgs/ui/icons/z_index_off_hover.png") no-repeat center;
}
.floatingObjListOrder[data-op="normal"]:active {
    background: url("../imgs/ui/icons/z_index_off_press.png") no-repeat center;
}
.floatingObjListOrder[data-op="zindex"] {
    background: url("../imgs/ui/icons/z_index_nor.png") no-repeat center;
}
.floatingObjListOrder[data-op="zindex"]:hover {
    background: url("../imgs/ui/icons/z_index_hover.png") no-repeat center;
}
.floatingObjListOrder[data-op="zindex"]:active {
    background: url("../imgs/ui/icons/z_index_press.png") no-repeat center;
}

.floatingObjListSearch {
    position: absolute;
    margin-top: 0px;
    top: 0px;
    right: 71px;
    height: 25px;
}

.floatingObjListBody {
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 10px;
    padding-bottom: 10px;
    width: auto;
    overflow-x: hidden;
    overflow-y: auto;
}
.floatingObjListTitle {
    float: left;
    width: 70%;
    margin-right: 10px;
}

.floatingObjListTitle:focus {
    outline: none;
}
.floatingObjListTitle.hover {
    color: #4000e3;
}
.floatingObjListTitle.selected {
    color: #4000e3;
    font-weight: bold;
}
.floatingObjListTitle.disabled {
    opacity: 0.5;
}

.helpIframeCloseBtn {
    position: absolute;
    top: 18px;
    right: 30px;
    width: 17px;
    height: 17px;
    background: url("../imgs/ui/buttons/btn_close_nor.png") no-repeat center;
    cursor: pointer;
}
.helpIframeCloseBtn:hover {
    background: url("../imgs/ui/buttons/btn_close_hover.png") no-repeat center;
}
.helpIframeCloseBtn:active {
    background: url("../imgs/ui/buttons/btn_close_press.png") no-repeat center;
}

.helpIframeNewWndBtn {
    position: absolute;
    top: 45px;
    right: 30px;
    width: 17px;
    height: 17px;
    background: url("../imgs/ui/buttons/btn_newwin_nor.png") no-repeat center;
    cursor: pointer;
}
.helpIframeNewWndBtn:hover {
    background: url("../imgs/ui/buttons/btn_newwin_hover.png") no-repeat center;
}
.helpIframeNewWndBtn:active {
    background: url("../imgs/ui/buttons/btn_newwin_press.png") no-repeat center;
}

.tempSave {
    float: right;
    width: 14px;
    height: 100%;
}
.tempSave.on {
    background: url("../imgs/ui/icons/temp_save_on.png") no-repeat center;
}
.tempSave.off {
    background: url("../imgs/ui/icons/temp_save_off.png") no-repeat center;
}
.tempSave.off_disable {
    background: url("../imgs/ui/icons/temp_save_off.png") no-repeat center;
}
.tempSave.err {
    background: url("../imgs/ui/icons/temp_save_error.png") no-repeat center;
    opacity: 0.5;
}

.helpIcon {
    width: 19px;
    height: 100%;
    background: url("../imgs/ui/icons/help_icon_nor.png") no-repeat center;
}
.helpIcon.itr {
    display: inline-block;
    margin-left: 4px;
    width: 14px;
    height: 14px;
    cursor: pointer;
}
.helpIcon:hover {
    background: url("../imgs/ui/icons/help_icon_hover.png") no-repeat center;
}
.disable .helpIcon {
    opacity: 0.5;
}
.disable .helpIcon:hover {
    background: url("../imgs/ui/icons/help_icon_nor.png") no-repeat center;
}

.googleShareFont {
    font-size: 13px;
    line-height: 1.5em;
}
.googleShareFont.bold {
    font-weight: bold;
}
.googleShareLink {
    width: 100%;
    text-indent: 5px;
    background-color: #ffffff;
}
.googleShareToSns {
    display: inline-block;
    margin-left: 5px;
    margin-right: 5px;
    width: 45px;
    height: 45px;
    cursor: pointer;
}
.googleShareToSns:first-child {
    margin-left: 0px;
}
.googleShareToSns.fb {
    background: url("../docs/help/imgs/icon_fb.png") no-repeat center;
}
.googleShareToSns.gp {
    background: url("../docs/help/imgs/icon_gp.png") no-repeat center;
}
.googleShareToSns.tw {
    background: url("../docs/help/imgs/icon_tw.png") no-repeat center;
}
.googleShareToSns.pt {
    background: url("../docs/help/imgs/icon_pinterest.png") no-repeat center;
}
.googleShareToSns.li {
    background: url("../docs/help/imgs/icon_linkedin.png") no-repeat center;
}
.googleShareToSns.rd {
    background: url("../docs/help/imgs/icon_reddit.png") no-repeat center;
}
.googleShareToSns.dg {
    background: url("../docs/help/imgs/icon_digg.png") no-repeat center;
}

.imgrowWrapper {
    border: 0px;
    margin: 0px;
    height: 25px;
    clear: both;
}
.imgrowIcon {
    border: none;
}
.imgrowIcon:active {
    outline: solid 1px #7673ff;
}

/* ==== Event script editor ==== */
#wndFloatingJSEditor {
    -webkit-user-select: text; /* Chrome all / Safari all */
    -moz-user-select: text; /* Firefox all */
    -ms-user-select: text; /* IE 10+ */
    user-select: text;
}

.scriptIframeBlock {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.2);
}
.editorMenu {
    display: inline-block;
    cursor: pointer;
}
.editorMenu:hover {
    color: #248600;
}
.editorIframe {
    position: absolute;
    border: none;
    margin: 0px;
    padding: 0px;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
}

#editor_font_size {
    float: right;
    margin-top: 13px;
    height: 20px;
    text-indent: 5px;
    line-height: 20px;
}
#editor_theme_select {
    float: right;
    margin: 13px 4px 0px 0px;
    opacity: 0.6;
    border: none;
}

.editorHeaderTxtBtn {
    float: right;
    padding-left: 25px;
    margin-top: 9px;
    height: 28px;
    font-size: 14px;
    line-height: 28px;
    color: #a3a3a3;
    background-position: 0px center;
    background-repeat: no-repeat;
}
.editorHeaderTxtBtn.sep {
    padding-left: 0px;
    margin-left: 22px;
    margin-right: 22px;
    width: 2px;
    background-image: url("../imgs/ui/script/script_divide.png");
}

.editorHeaderTxtBtn.save {
    background-image: url("../imgs/ui/script/script_save_nor.png");
    color: #ffffff;
}
.editorHeaderTxtBtn.save.btnOver {
    border: none;
    background-color: transparent;
}
.editorHeaderTxtBtn.save.btnDown {
    color: #7673ff;
    border: none;
    background-color: transparent;
    background-image: url("../imgs/ui/script/script_save_press.png");
}

.editorHeaderTxtBtn.code {
    background-position: 0px center;
    background-repeat: no-repeat;
    border: none;
    cursor: pointer;
}
.editorHeaderTxtBtn.code:hover {
    color: #ffffff;
}
.editorHeaderTxtBtn.code:active {
    color: #ffffff;
}

.editorHeaderTxtBtn.code.wgt {
    margin-right: 0px;
    background-image: url("../imgs/ui/script/script_page_nor.png");
}
.editorHeaderTxtBtn.code.wgt.btnOver {
    border: none;
    background-color: transparent;
    background-image: url("../imgs/ui/script/script_page_hover.png");
}
.editorHeaderTxtBtn.code.wgt.btnDown {
    border: none;
    background-color: transparent;
    background-image: url("../imgs/ui/script/script_page_nor.png");
}

.editorHeaderTxtBtn.code.page {
    margin-right: 17px;
    background-image: url("../imgs/ui/script/script_page_nor.png");
}
.editorHeaderTxtBtn.code.page.btnOver {
    border: none;
    background-color: transparent;
    background-image: url("../imgs/ui/script/script_page_hover.png");
}
.editorHeaderTxtBtn.code.page.btnDown {
    border: none;
    background-color: transparent;
    background-image: url("../imgs/ui/script/script_page_nor.png");
}

.editorHeaderTxtBtn.code.help {
    margin-right: 17px;
    background-image: url("../imgs/ui/script/script_help_nor.png");
}
.editorHeaderTxtBtn.code.help.btnOver {
    border: none;
    background-color: transparent;
    background-image: url("../imgs/ui/script/script_help_hover.png");
}
.editorHeaderTxtBtn.code.help.btnDown {
    border: none;
    background-color: transparent;
    background-image: url("../imgs/ui/script/script_help_nor.png");
}

.new-list-group {
    position: relative;
    height: auto;
}
.new-list-item {
    position: relative;
    height: 40px;
    width: 100%;
    font-size: 13px;
    line-height: 40px;
    color: #000000;
    border-bottom: dotted 1px lightgrey;
}
.new-list-left {
    float: left;
    width: 150px;
    background-color: #f2f2f2;
    padding-left: 15px;
}
.new-list-right {
    float: left;
    width: auto;
    padding-left: 10px;
}

#wndPopup_meta_body .new-list-right {
    width: 60%;
}
#wndPopup_meta_body .new-list-right input[type="text"] {
    width: 300px;
}
#wndPopup_meta_body .new-list-right input[type="checkbox"] {
    margin-top: 12spx;
}
#wndPopup_meta_body .new-list-right select {
    width: 310px;
}
#wndPopup_meta_body .new-list-right textarea {
    width: 300px;
}
#wndPopup_meta_body .new-list-right .xSelectBox {
    width: 310px;
}

.downloadAsset {
    width: 32px;
    height: 32px;
    position: absolute;
    right: 10px;
    top: 10px;
    display: none;
    cursor: pointer;
    background-image: url("../imgs/ui/icons/down_nor.png");
}
.downloadAsset:hover {
    background-image: url("../imgs/ui/icons/down_hover.png");
}
.downloadAsset:active {
    background-image: url("../imgs/ui/icons/down_press.png");
}

.listPublish {
    position: absolute;
    width: 23px;
    height: 23px;
    float: right;
    top: 3px;
    background-image: url("../imgs/ui/icons/publish_normal.png");
    background-size: contain;
    cursor: pointer;
}
.listPublish:hover {
    background-image: url("../imgs/ui/icons/publish_hover.png");
}
.listPublish:active {
    background-image: url("../imgs/ui/icons/publish_press.png");
}

.listDelete {
    width: 23px;
    height: 23px;
    float: right;
    position: absolute;
    right: 5px;
    top: 3px;
    cursor: pointer;
    display: none;
    background-image: url("../imgs/ui/icons/delete_normal.png");
    background-size: contain;
}
.listDelete:hover {
    background-image: url("../imgs/ui/icons/delete_hover.png");
}
.listDelete:active {
    background-image: url("../imgs/ui/icons/delete_press.png");
}

.urlAsset {
    width: 32px;
    height: 32px;
    position: absolute;
    right: 52px;
    top: 10px;
    display: none;
    cursor: pointer;
    background-image: url("../imgs/ui/icons/url_nor.png");
}
.urlAsset:hover {
    background-image: url("../imgs/ui/icons/url_hover.png");
}
.urlAsset:active {
    background-image: url("../imgs/ui/icons/url_press.png");
}

.editorAssetId {
    width: 32px;
    height: 32px;
    float: left;
    margin-left: 1px;
    cursor: pointer;
    background-image: url("../imgs/ui/icons/set_nor.png");
}
.editorAssetId:hover {
    background-image: url("../imgs/ui/icons/set_hover.png");
}
.editorAssetId:active {
    background-image: url("../imgs/ui/icons/set_press.png");
}

.saveThumbnail {
    width: 32px;
    height: 32px;
    position: absolute;
    right: 20px;
    bottom: 20px;
    display: none;
    cursor: pointer;
    background-image: url("../imgs/ui/icons/thumnail_nor.png");
}
.saveThumbnail:hover {
    background-image: url("../imgs/ui/icons/thumnail_hover.png");
}
.saveThumbnail:active {
    background-image: url("../imgs/ui/icons/thumnail_press.png");
}

div[data-aspen-rich] *[has-margin="bottom"] {
    display: inline-block;
    box-shadow: inset -1px -8px 4px -5px rgba(0, 0, 255, 1);
}
div[data-aspen-rich] *[has-margin="top"] {
    display: inline-block;
    box-shadow: inset -1px 8px 4px -5px rgba(0, 0, 255, 1);
}
div[data-aspen-rich] *[has-margin="both"] {
    display: inline-block;
    box-shadow: inset -1px -8px 4px -5px rgba(0, 0, 255, 1),
        inset -1px 8px 4px -5px rgba(0, 0, 255, 1);
}

.listPropItem[data-h-minus25] {
    height: 25px;
    line-height: 25px;
}
.listPropItem[data-h-minus25] input {
    margin-top: 0px;
    outline: none;
}
.listPropItem[data-h-minus25] label {
    margin-top: 0px;
}

/* ==== MUST PLACED IN LAST PART OF CSS FILE for Priority ==== */
.display-none {
    display: none;
}
.visibility-hidden {
    visibility: hidden;
}

.linkBtn {
    margin-top: 7px;
    cursor: pointer;
}
.linkBtn:hover {
    background-color: #c5c5c5;
    border-radius: 2px;
}
