/* Library Cover */
.x-form-check-wrap{
    line-height: 22px;
}
.x-form-item{
    margin-bottom: 0px;
}
.x-form-invalid, textarea.x-form-invalid, input.x-form-invalid{
	border-color: #ff7870;
    background-color: #fee;
}
.x-window-ml, .x-window-mr{
    background-color: transparent;
}
.x-window-bl, .x-window-br, .x-window-bc{
    background: none repeat scroll 0px 0px transparent;
}
.x-tool-close-over{
	background-position: 0 0;
}
/* QOS Self Tag */
.q-app-systemPreferences .x-window-ml{
    padding-left: 0;
}
.q-app-systemPreferences .x-window-mr{
    padding-right: 0;
}
.q-app-systemPreferences .x-toolbar-layout-ct{
    padding-right: 20px;
}
.q-app-systemPreferences .x-window-tl, .q-app-systemPreferences .x-window-tr{
    background-image:url("../images/qts_toolbar/title_bg.png") !important;
    background-color: #DDDDDD;
    background-repeat: repeat;
}
.q-app-systemPreferences .x-window-tl, .q-app-systemPreferences .x-window-tr{
    border-top-left-radius: 7px;
    border-top-right-radius: 7px;
}

.ds3_q_dlg .x-window-bl,
.q-app-systemPreferences .x-window-bl{
}
.ds3_q_dlg .x-window-br,
.q-app-systemPreferences .x-window-br{
}

.q-app-systemPreferences .x-window-bl, .q-app-systemPreferences .x-window-br, .q-app-systemPreferences .x-window-bc{
    background: none repeat scroll 0 0 #E7E7E7 !important;
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
    height: auto;
}

.wizard-middle-body{
    background-color: #FFF;
}
.q-app-systemPreferences .x-window-tl .x-window-header{
    padding-top: 0;
}
/* QOS Ext CSS */

.q-app-systemPreferences .systemPreferences-tb {
padding:0 28px 5px;
}
.q-app-systemPreferences .x-window-header{
margin: 0 6px;
text-align: center;
}
.q-app-systemPreferences .x-window-tbar,
.q-app-systemPreferences .x-window-tc{
background-image:url("../images/qts_toolbar/title_bg.png") !important;
}
.q-app-systemPreferences .x-window-tc{
background-color:transparent;
}
.q-app-systemPreferences .x-window-tbar{
background-position:0 -28px;
background-color:transparent;
}
.q-app-systemPreferences .x-toolbar{
background-color:transparent;
}

.q-app-systemPreferences .x-panel-mc, .q-app-systemPreferences .x-panel-ml, .q-app-systemPreferences .x-panel-mr{
    background-image: none;
    background-color: transparent;
}
.q-app-systemPreferences .x-panel-body{
    background-color: #FFF;
    border-top-color: #FFF;
    border-left-color: #FFF;
    border-right-color: #FFF;
}

.x-window .x-tool-help,.x-panel-ghost .x-tool-help, .bt-help{
background-image:url("../images/qts_toolbar/icon_help.png");
width:21px;
height:26px;
background-position:0 0;
}
.x-window .x-tool-help-over,.x-panel-ghost .x-tool-help-over, .bt-help.x-btn-over{
background-position:0 -26px;
}
.bottomLineBar{
background-image:url("../images/qts_toolbar/bg_iconline.png");
}
ul.x-tab-strip-top {
padding: 1px 0 0 0;
background: repeat-x bottom;
}
.q-app-systemPreferences .x-window-header-text,.x-panel-ghost.q-app-systemPreferences .x-window-header-text {
display:block;
padding:7px 0 8px;
font-weight:900;
margin: 0 91px;
}
.q-app-miniWindowTitle.q-app-systemPreferences .x-window-header-text, .q-app-miniWindowTitle.x-panel-ghost.q-app-systemPreferences .x-window-header-text {
    margin: 0 11px;
}
.q-app-systemPreferences.win-help .x-window-header{
height: 28px;
}
.q-app-systemPreferences.win-help .x-window-header-text,.x-panel-ghost.q-app-systemPreferences.win-help .x-window-header-text {
display:block;
padding:7px 0 8px;
font-weight:900;
margin: 0 123px;
}
.q-app-systemPreferences .x-tab-panel-header{
padding-top: 15px;
border-bottom: 0;
background-color: #FFF;
}
.q-app-systemPreferences .x-tab-panel-header .x-tab-scroller-right, .q-app-systemPreferences .x-tab-panel-header .x-tab-scroller-left{
margin-top: 15px;
}
/* QOS Wizard Middle Class */
.wizard-middle-bl {
border-top:2px solid #FFF !important;
background:transparent url('../images/qts_toolbar/middle_downbar_3.png') no-repeat 0 bottom;
zoom:1;
padding-bottom:6px;
}

.wizard-middle-footer {
background-image:url('../images/qts_toolbar/middle_downbar_2.png') !important;
background-position:0 0 !important;
padding-left:21px !important;
padding-right:21px !important;
}
.wizard-middle .footBarLine {
background-image:url('../images/qts_toolbar/middle_downbar_1.png') !important;
background:transparent no-repeat right 0;
}
.wizard-middle .body-under-line {
bottom:0;
position:absolute;
height:2px;
width:100%;
background-image:url('../images/qts_toolbar/middle_downbar_1.png');
background-repeat:no-repeat;
background-position:bottom;
}
.wizard-large-bc,.wizard-middle-bc {
background:transparent repeat-x 0 bottom;
zoom:1;
}
.wizard-large-bc .wizard-large-footer,.wizard-middle-bc .wizard-middle-footer,.wizard-small-footer {
zoom:1;
font-size:0;
line-height:0;
}
.wizard-large .x-panel-btns,.wizard-middle .x-panel-btns {
overflow:hidden;
padding:1px 0 0;
padding-top: 5px;
}
.wizard-large-br,.wizard-middle-br {
background:transparent no-repeat right bottom;
zoom:1;
}
.wizard-large .x-tool-close,.wizard-middle .x-tool-close,.wizard-small .x-tool-close,.x-panel-ghost .x-tool-close {
background-image:url('../images/qts_toolbar/large_icon_close.png') !important;
width:45px !important;
height:19px !important;
background-position:0 0 !important;
margin-right:0 !important;
}
.wizard-large .x-tool-close-over,.wizard-middle .x-tool-close-over,.wizard-small .x-tool-close-over,.x-panel-ghost .x-tool-close-over {
background-image:url('../images/qts_toolbar/large_icon_close_pressed.png') !important;
width:45px !important;
height:19px !important;
background-position:0 0 !important;
margin-right:0 !important;
}
.wizard-large-tl,.wizard-middle-tl,.wizard-small-tl {
background-image:url('../images/qts_toolbar/large_topbar_left.png') !important;
background:transparent no-repeat 0 0;
zoom:1;
z-index:1;
position:relative;
}
.wizard-large-tr,.wizard-middle-tr,.wizard-small-tr {
background-image:url('../images/qts_toolbar/large_topbar_right.png') !important;
background:transparent no-repeat right 0;
padding-right:20px;
padding-left:20px;
}
.wizard-large-tc,.wizard-middle-tc {
background-image:url('../images/qts_toolbar/large_topbar_middle.png') !important;
}
.wizard-large .x-panel-body,.wizard-middle .x-panel-body,.wizard-small .qos-window-body,.wizard-small .x-panel-body {
background-color:#fff;
}
.wizard-large .x-tab-panel-footer,.wizard-large .x-panel-footer,.wizard-middle .x-tab-panel-footer,.wizard-middle .x-panel-footer {
background-image:url('../images/qts_toolbar/large_downbar_2.png') !important;
border-top:2px solid #FFF !important;
}
.x-panel-ghost .wizard-large-header .x-tool-close,.x-panel-ghost .wizard-middle-header .x-tool-close,.x-panel-ghost .wizard-small-header .x-tool-close {
background-image:url('../images/qts_toolbar/icon_close_one.png') !important;
width:41px !important;
height:21px !important;
background-position:0 0 !important;
margin-right:0 !important;
}
.wizard-large .x-panel-btns td.x-toolbar-cell,.wizard-middle .x-panel-btns td.x-toolbar-cell,.hdd-list dt em {
padding:3px;
}
.q-window .wizard-large-header,.q-window .wizard-middle-header,.wizard-middle .wizard-middle-header,.x-panel-ghost .wizard-middle-header {
height:37px;
text-align:center;
}
.wizard-large .wizard-large-header-text,.wizard-middle .wizard-middle-header-text,.wizard-small .wizard-small-header-text,.x-panel-ghost .wizard-large-header-text,.x-panel-ghost .wizard-middle-header-text,.x-panel-ghost .wizard-small-header-text {
display:block;
padding-top:7px;
font-weight:900;
}
.wizard-middle.AddClose .x-tool-close,.x-panel-ghost.AddClose .x-tool-close{
background-image:url('../images/qts_toolbar/icon_close_one.png') !important;
width:41px !important;
height:21px !important;
background-position:0 0 !important;
margin-right:0 !important;
}
.x-window-dlg .x-tool-close-over,.x-panel-ghost .x-window-draggable .x-tool-close-over, .wizard-middle.AddClose .x-tool-close-over,.x-panel-ghost.AddClose .x-tool-close-over{
background-image:url('../images/qts_toolbar/icon_close_one_pressed.png') !important;;
}

.x-panel-ghost .wizard-large-header .x-tool-close-over,.x-panel-ghost .wizard-middle-header .x-tool-close-over,.x-panel-ghost .wizard-small-header .x-tool-close-over {
background-image:url('../images/qts_toolbar/icon_close_one_pressed.png') !important;;
}
.wizard-middle .x-tab-panel-header {
padding-top: 15px;
border-bottom: 0;
background-color: white;
}
.wizard-large-tc, .wizard-middle-tc, .wizard-small-tc {
padding: 0 6px;
}
.wizard-modal .wizard-large-header,.wizard-modal .wizard-middle-header,.wizard-modal .wizard-large-header,.x-panel-ghost .wizard-large-header {
height:37px;
text-align:center;
}
.x-panel-ghost.AddClose .wizard-middle-header{
margin-left:32px;
}
.wizard-large.AddClose .wizard-large-header,.wizard-middle.AddClose .wizard-middle-header {
margin-left:32px;
}
.x-panel-ghost .wizard-middle-header{
margin-left: 0;
}
.wizard-large .wizard-large-header,.wizard-middle .wizard-middle-header {
margin-left:0;
}

/* QOS Window tool rotate 
.x-window .x-tool-bg .x-tool, .x-window .x-tool-close{
	-webkit-transition: 0.3s;
	-moz-transition: 0.3s;
	-ms-transition: 0.3s;
	-o-transition: 0.3s;
	transition: 0.3s;
}
.x-window .x-tool-over .x-tool, .x-window .x-tool-close-over{
	-webkit-transform:rotateZ(180deg);
	-moz-transform:rotate(180deg);
	-ms-transform:rotate(180deg);
	-o-transform:rotate(180deg);
	transform:rotate(180deg);
}*/

/* QOS Self Modify After Tag */
.q-dlg-hd-tx1 .x-window-header-text{
    margin: 0 1px;
}
.q-dlg-hd-tx1 .x-toolbar-layout-ct{
    padding-right: 0;
}
.ds3_common_t1Imp, .ds3_common_t1Imp .x-panel-body{
    background-color: transparent;
}


.ds3_q_dlg{
    min-width: 340px;
    max-width: 450px;
    width: auto !important;
}
.ds3_q_dlg.x-window-dlg .x-window-body{
    width: auto !important;
}
.ds3_q_dlg .x-window-tl {
    display: none;
}
.ds3_q_dlg .x-window-tr {
    display: none;
}
.ds3_q_dlg .x-window-tc {
    display: none;
}
/*.ds3_q_dlg .x-window-body {
    background: none repeat scroll 0 0 #FFF !important;
    padding: 15px 10px 5px 20px;
}*/
.ds3_q_dlg .x-window-header{
    height:37px;
    text-align:center;
    padding: 0;
}
.ds3_q_dlg .x-window-ml{
    padding-left: 0;
}
.ds3_q_dlg .x-window-mr{
    padding-right: 0;
}
.ds3_q_dlg .x-window-mc{
    background-color: transparent !important;
}
.ds3_q_dlg .x-toolbar-layout-ct{
    padding-right: 0;
}
.ds3_q_dlg .x-window-bc{
    background: transparent none;
}
.ds3_q_dlg .x-window-bc .x-window-footer{
    width: auto !important;
    padding: 8px 0px 0px 0px;
}
.ds3_q_dlg .x-window-br{
    padding-right: 0px;
}
.ds3_q_dlg .ext-mb-icon{
    height: 32px;
    width: 32px;
}
.ds3_q_dlg .x-dlg-icon .ext-mb-content{
    margin-left: 48px;
    overflow: auto;
    height: auto;
    max-height: 400px;
    /*height: 32px;
    line-height: 32px;*/
}
.ds3_q_dlg.x-window-dlg .ext-mb-text{
    /*height: 16px;*/
    color: #2F2F2F;
    line-height: 20px;
    font-size: 14px;
    display: block;
    padding-right: 16px;
}
.ds3_q_dlg .ext-mb-warning,
.ds3_q_dlg .ext-mb-question,
.ds3_q_dlg .ext-mb-info,
.ds3_q_dlg .ext-mb-error{
    background-image:url("../images/icons/message_type.png");
}
.ds3_q_dlg .ext-mb-info{background-position: 0px 0px;}
.ds3_q_dlg .ext-mb-question{background-position: 0 -60px;}
.ds3_q_dlg .ext-mb-error{background-position: 0px -120px;}
.ds3_q_dlg .ext-mb-warning{background-position: 0px -300px;}

.x-window-header{
    text-align: center;
}
.loginPS .x-panel-body{
    background-color: #F1F1F1;
}
.msg_url_link_color_2{
    color: #FFF;
}


/* QTS x-tip CSS */
.x-tip{
    box-shadow: 0px 0px 0px 1px #767676;
    min-height: 20px;
    background: linear-gradient(#FEFEFE, #E5E4F2) repeat scroll 0% 0% transparent;
    border-radius: 2px;
}
.x-tip .x-tip-tc, .x-tip .x-tip-tl, .x-tip .x-tip-tr, .x-tip .x-tip-bc, .x-tip .x-tip-bl, .x-tip .x-tip-br, .x-tip .x-tip-ml, .x-tip .x-tip-mr, .x-tip .x-tip-mc {
    background: none repeat scroll 0% 0% transparent;
}
.x-tip .x-tip-ml {
    padding-left: 20px;
}
.x-tip .x-tip-mr {
    padding-right: 20px;
}
.x-tip .x-tip-mc {
    background: none repeat scroll 0% 0% transparent;
}
.x-tip .x-tip-body{
    line-height: 135%;
    /*font-family: "QTS Font","Helvetica","Arial","Sans-serif","Verdana","Heiti SC","微軟正黑體","Microsoft JhengHei","微軟雅黑體","Microsoft YaHei","明瞭體","Meiryo","清黑體","Malgun Gothic","新細明體","PMingLiU";*/
    font-family:'QTS Font', 'Helvetica', 'Arial', 'Sans-serif', 'Verdana', "Tahoma";
}

/* QTS InfoClickTip */
.x-tip.iconInfoClickTip .x-tip-bwrap{
	padding: 3px 20px 0;
}

/* QTS log-list */
.x-tip.log-list-tip{
    background: none;
    border-radius: none;
    box-shadow: none;
}
.x-tip.log-list-tip .x-tip-body{
    line-height: none;
}
.x-tip.log-list-tip {
    background-color: #ffffff;
    border: 1px solid #b0b0b0;
    padding: 28px 0px;
    max-height: 312px; 
    overflow-y: auto;
    overflow-x: hidden;
}

.log-list-tip .x-tip-body{
    overflow-y: auto;
}

.log-list-tip .log-filter-btns{
    top:42px;
    left: 12px;
    right: 18px;
    height: 25px;
}

.log-list-tip .x-list-body-inner dl{
    background:url(/cgi-bin/images/bg/bg_line.png?367309862) no-repeat bottom;
}

.log-list-tip .system-tray-bg .inner-bg{
top:66px;
bottom:36px;
}
.log-list-tip .clear-all{
top: 375px;
left: auto;
min-width: 80px;
right: 15px;
}
.log-list-tip .log-list-tab-btn button{
max-width: 90px;
margin: auto;
display: block;
text-overflow: ellipsis;
overflow: hidden;
padding: 0 2px 0 5px;
}

.log-list-tip .log-list-middle-div{
    max-height:270px; 
    overflow-x:hidden; 
    overflow-y:auto;
}


.log-list-tip .log-item-d{
    width: 100%; 
    overflow:hidden;
    position: relative;
    padding-top: 16px;
}
.log-list-tip .log-item-icon-div{
    width: 72px;
    height: 64px;
    float: left;
}
.log-list-tip .log-item-main-div{
    width: 158px;
    height: 45px;
    overflow: hidden;
    float: left;
    margin-top: 5px;
}
.log-list-tip .log-item-cancel-div{
    width: 46px;
    height: 64px;
    float: left;
}
.log-list-tip .log-item-line-div{
    width: 208px;
    height: 0px;
    border-bottom: 1px solid #DDDDDD;
    position: absolute;
    bottom: 0px;
    left: 0px;
}
.log-list-tip .log-item-title{
    font-size: 14px;
    /*font-family:'QTS Font', 'Helvetica', 'Arial', 'Sans-serif', 'Verdana', "Heiti SC", "微軟正黑體", "Microsoft JhengHei", "微軟雅黑體", "Microsoft YaHei", "明瞭體", "Meiryo", "清黑體", "Malgun Gothic", "新細明體", "PMingLiU";*/
    font-family:'QTS Font', 'Helvetica', 'Arial', 'Sans-serif', 'Verdana', "Tahoma";
    font-weight: 700;
    padding: 0 0 10px 28px;
    border-bottom: 1px solid #DADADA;
}
.log-list-tip .log-item-name, .log-list-tip .log-item-count{
    font-size: 12px;
    /*font-family:'QTS Font', 'Helvetica', 'Arial', 'Sans-serif', 'Verdana', "Heiti SC", "微軟正黑體", "Microsoft JhengHei", "微軟雅黑體", "Microsoft YaHei", "明瞭體", "Meiryo", "清黑體", "Malgun Gothic", "新細明體", "PMingLiU";*/
    font-family:'QTS Font', 'Helvetica', 'Arial', 'Sans-serif', 'Verdana', "Tahoma";
    font-weight: 300;
}
.log-list-tip .empty{
    text-align: center;
    margin-top: 15px;
}
.log-list-tip .empty .img{
    width: 34px;
    height: 34px;
    background-image: url("../images/toolbar/bgtask_slice.png?367309862");
    background-position: 0px -360px;
    margin: 0 auto;
}
.log-list-tip .log-item-name{
    /*margin: 15px 0 0 50px;*/
    color: #7F7F7F;
    font-size: 12px;
    line-height: 17px;
    height: 17px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space:nowrap;
}
.log-list-tip .log-item-progress{
    position: relative;
    height: 25px;
}
.log-list-tip .log-item-count{
    position: absolute;
    bottom: 1px;
}
.log-list-tip .log-item-prg1, .log-list-tip .log-item-prg2{
    height: 0px;
    position: absolute; 
    bottom: 15px;
}
.log-list-tip .log-item-prg1{
    width: 60px;
    border-bottom: 4px solid #E5E5E5;
}
.log-list-tip .log-item-prg2{
    width: 0px;
    border-bottom: 4px solid #1E9FE0;
}
.log-list-tip .log-item-prg3{
    position: absolute; 
    left: 72px;
    font-size: 12px;
    color: #334B84;
    bottom: 11px;
}

/* QTS PS4 Self Change CSS */

.q_app_PS_S1 .x-window-bwrap .x-window-mc .x-window-body{
    background-color: #FFF;
}
.q_app_PS_S1 .x-window-bc{
    background-color: #E7E7E7;
}

.q_app_PS_S1 .x-window-bl, .q_app_PS_S1 .x-window-bc, .q_app_PS_S1 .x-window-br{
    background: #E7E7E7 none;
    border-bottom-left-radius: 7px;
    border-bottom-right-radius: 7px;
    padding: 0;
}
/* QTS PS5 Self Change CSS */
.x-form-field-wrap .x-form-trigger{
    background-color: #FFF;
    background-image: url('../images/icons/Share_slice.png?367309862');
    border-top: 1px solid #B0B0B0;
    border-right: 1px solid #B0B0B0;
    border-bottom: 1px solid #B0B0B0;
    background-position: 6px -22px;
    height: 20px;
}
.x-form-field-wrap .x-trigger-noedit{
    border-right: 0px solid transparent; 
}

.x-combo-list .x-combo-selected{
    background-color: #DEFEFD;
    border: 1px solid transparent !important;
}
.x-btn-noicon .x-btn-small .x-btn-text{
    line-height: 16px;
}

/* QTS 4.2 DatePicker amd DateField CSS */
.qnapDateTimeMenu.x-menu{
    background: #FFF none;
}
.qnapDatePicker .x-date-right a, .qnapDatePicker .x-date-left a,
.qnapDatePicker .qnapSelectDateButton .x-btn-text,
.qnapDatePicker .x-date-inner .qnap_x-date-radius:hover, .qnapDatePicker .x-date-inner .x-date-selected .qnap_x-date-radius{
    background-image: url('../images/icons/Share_slice.png?367309862');
}
.qnapDatePicker .x-date-right a{background-position: 5px -1230px;}
.qnapDatePicker .x-date-right a:hover{background-position: -25px -1230px;}
.qnapDatePicker .x-date-left a{background-position: 5px -1260px;}
.qnapDatePicker .x-date-left a:hover{background-position: -25px -1260px;}
.btn_remove3px .x-btn-tl i, .btn_remove3px .x-btn-tr i, .btn_remove3px .x-btn-tc i, .btn_remove3px .x-btn-ml i, .btn_remove3px .x-btn-mr i, .btn_remove3px .x-btn-bl i, .btn_remove3px .x-btn-br i, .btn_remove3px .x-btn-bc i{
    display: none;
}
.btn_remove3px .x-btn-tl, .btn_remove3px .x-btn-tr, .btn_remove3px .x-btn-tc, .btn_remove3px .x-btn-ml, .btn_remove3px .x-btn-mr, .btn_remove3px .x-btn-bl, .btn_remove3px .x-btn-br, .btn_remove3px .x-btn-bc {
    height: 0;
    width: 0;
}
.qnapDatePicker .yearMonthArea{
    border-bottom: 1px solid #B4B4B4;
}
.qnapDatePicker .qnap_x_c_year{
    font-size: 12px;
    color: #858585;
}
.qnapDatePicker .qnap_x_c_month{
    font-size: 24px;
    color: #2F2F2F;
}
.qnapDatePicker .x-date-middle, .qnapDatePicker .x-date-left, .qnapDatePicker .x-date-right{
    background: transparent none;
    color: #858585;
    vertical-align: bottom;
}
.qnapDatePicker .x-date-middle{
    width: auto;
}
.qnapDatePicker .x-date-middle .x-btn .x-btn-text{
    color: #858585;
    height: 44px;
}
.qnapDatePicker .x-date-inner th{
    background: transparent none;
    color: #707070;
    font-size: 10px;
    border-bottom: none;
    width: 33px;
    height: 20px;
}
.qnapDatePicker .x-date-active, .qnapDatePicker .x-date-nextday{
    height: 28px;
    width: 33px;
}
.qnapDatePicker .x-date-inner .qnap_x-date-radius{
    width: 25px;
    height: 25px;
}
.qnapDatePicker .x-date-inner .qnap_x-date-radius:hover, .qnapDatePicker .x-date-inner .x-date-selected .qnap_x-date-radius{
    color: #FFF;
    background-position: 0px -480px;
}
.qnapDatePicker .x-date-inner .x-date-selected a{
    background-color: transparent;
}
.qnapDatePicker .x-date-inner .x-date-nextday a.x-date-date{
    border: none;
    padding: 1px 4px;
    font-size: 12px;
    color: #B4B4B4;
}
.qnapDatePicker .x-date-inner .x-date-active a.x-date-date{
    border: none;
    padding: 1px 4px;
    font-size: 12px;
    color: #2F2F2F;
}
.qnapDatePicker a.x-date-date, .qnapDatePicker .x-date-inner th span{
    text-align: center;
}
.qnapDatePicker .x-date-inner th span{
    color: #707070;
}
.qnapDatePicker a.x-date-date{
    top: 5px;
    position: relative;
}
.qnapDatePicker a.x-date-date:hover, .qnapDatePicker .x-date-inner .qnap_x-date-radius:hover a.x-date-date,  .qnapDatePicker .x-date-inner .x-date-selected a.x-date-date{
    background-color: transparent;
    color: #FFF;
    border: none;
    padding: 1px 4px;
}
.qnapDatePicker .x-date-inner .x-date-today a.x-date-date{
    border: none;
    padding: 1px 4px;
    color: #B8292D;
}
.qnapDatePicker .x-date-inner .x-date-selected.x-date-today a.x-date-date{
    color: #FFF;
}
.qnapDatePicker .qnapSelectDateButton{
    width: 100%;
}
.qnapDatePicker .x-date-bottom{
    background: #808080 none;
    border-top: none;
}
.qnapDatePicker .x-date-bottom:hover{
    background: #39BDE2 none;
}
.qnapDatePicker .x-date-bottom .qnapSelectDateButton .x-btn-text{
    background-position: 0px -540px;
    width: 20px;
    height: 20px;
}
.qnapDatePicker .x-date-bottom:hover .qnapSelectDateButton .x-btn-text{
    background-position: -30px -540px;
}

/*****************************************************************************\
**   ######   ######  ########   #######  ##       ##       ########     ###    ########  
**  ##    ## ##    ## ##     ## ##     ## ##       ##       ##     ##   ## ##   ##     ## 
**  ##       ##       ##     ## ##     ## ##       ##       ##     ##  ##   ##  ##     ## 
**   ######  ##       ########  ##     ## ##       ##       ########  ##     ## ########  
**        ## ##       ##   ##   ##     ## ##       ##       ##     ## ######### ##   ##   
**  ##    ## ##    ## ##    ##  ##     ## ##       ##       ##     ## ##     ## ##    ##  
**   ######   ######  ##     ##  #######  ######## ######## ########  ##     ## ##     ## 
*-----------------------------------------------------------------------------
* .qts-scrollbar
*     &.scrollbar-track
*     .scrollbar-thumb
*     &.dark
*       &.scrollbar-track
*       .scrollbar-thumb
*     &.scrollbar-over, &.drag
\*****************************************************************************/
.qts-scrollbar.scrollbar-track {
  width: 12px;
  height: 100%;
  background: #F4F4F4;
  position: absolute;
  right: 0;
  top: 0;
  margin: 1px;
  opacity: 0;
  transition: opacity 300ms;
}
.qts-scrollbar .scrollbar-thumb {
  min-height: 10%;
  background: #CBCBCB;
  position: absolute;
  margin: 0px;
  border: 1px solid #C1C1C1;
  left: 0 !important;
  right: 0;
  top: auto;
  max-width: 10px;
  transition: background 300ms;
}
.qts-scrollbar.dark.scrollbar-track {
  background: #474747;
}
.qts-scrollbar.dark .scrollbar-thumb {
  background: #7f7f82;
  border: 1px solid #939393;
}
.qts-scrollbar.scrollbar-over, .qts-scrollbar.drag, .qts-scrollbar:hover {
  opacity: 1;
}
.qts-scrollbar .scrollbar-thumb:hover, .qts-scrollbar.drag .scrollbar-thumb{
    background: #909090;
    border: 1px solid #828282;
}
.qts-scrollbar.dark .scrollbar-thumb:hover, .qts-scrollbar.dark.drag .scrollbar-thumb{
    background: #D6D6D6;
    border: 1px solid #EdEdEd;
}

.overflow-hidden {
  overflow: hidden !important;
}

.qpc_menu_no_show_qts_scrollbar .qts-scrollbar{
    display: none;
}

.x-form-cb-label {
    top: 0;
}


/*****************************************************************************\
* **************** Compass sprite png area **************
*     
* git path: source/lib/scss/mediaviewer3bg   
*     
* Warning! Do not change it directly, these CSS create by SCSS+Compass
* If you want change any string, run "compass compile" at git path and copy CSS string to this area
* After paste new CSS, change vr360icon.png name and copy to source/images/common/vr360icon/
* After paste new CSS, change vlcplayer.png name and copy to source/images/common/vlcplayer/
* 
\*****************************************************************************/


/* VR 360 icon area */
.vr360icon_sprite, .vr360icon_compass_base, .vr360icon_compass_direction, .vr360icon_ic_mark_360_list, .vr360icon_ic_mark_360_thumbnail, .vr360icon_vr360_reminder
{ background-image: url('../images/common/vr360icon.png?367309862'); background-repeat: no-repeat; }
.vr360icon_compass_base { background-position: 0 0; height: 66px; width: 54px; }

.vr360icon_compass_direction { background-position: 0 -76px; height: 54px; width: 54px; }
.vr360icon_compass_direction:hover, .vr360icon_compass_direction.compass_direction_hover { background-position: 0 -204px; }
.vr360icon_compass_direction:active, .vr360icon_compass_direction.compass_direction_active { background-position: 0 -140px; }

.vr360icon_ic_mark_360_list { background-position: 0 -268px; height: 20px; width: 36px; }

.vr360icon_ic_mark_360_thumbnail { background-position: 0 -298px; height: 26px; width: 48px; }

.vr360icon_vr360_reminder { background-position: 0 -334px; height: 44px; width: 44px; }

/* VR 360 icon area */
.vlcplayer_sprite, .vlcplayer_install, .vlcplayer_vlc_off, .vlcplayer_vlc_on, .vlcplayer_web_socket_agent_off, .vlcplayer_web_socket_agent_on 
{ background-image: url('../images/common/vlcplayer.png?367309862'); background-repeat: no-repeat; }

.vlcplayer_install { background-position: 0 0; height: 200px; width: 300px; }

.vlcplayer_vlc_off { background-position: 0 -210px; height: 200px; width: 200px; }

.vlcplayer_vlc_on { background-position: 0 -420px; height: 200px; width: 200px; }

.vlcplayer_web_socket_agent_off { background-position: 0 -630px; height: 200px; width: 200px; }

.vlcplayer_web_socket_agent_on { background-position: 0 -840px; height: 200px; width: 200px; }


/*****************************************************************************\
* **************** Compass sprite png area **************
*     
* git path: source/lib/scss/common   
*     
* Warning! Do not change it directly, these CSS create by SCSS+Compass
* If you want change any string, run "compass compile" at git path and copy CSS string to this area
* After paste new CSS, change common.png name and copy to source/images/common/
* 
\*****************************************************************************/
.common_sprite, .common_a000_btn_close, .common_a001_btn_close_over, .common_a002_btn_close_pressed, .common_a003_btn_max, .common_a004_btn_max_over, .common_a005_btn_max_pressed, .common_a006_btn_mimi, .common_a007_btn_mini_over, .common_a008_btn_mini_pressed, .common_a009_btn_close_black, .common_a010_btn_close_over_black, .common_a011_btn_close_pressed_black, .common_a012_btn_max_black, .common_a013_btn_max_over_black, .common_a014_btn_max_pressed_black, .common_a015_btn_mimi_black, .common_a016_btn_mini_over_black, .common_a017_btn_mini_pressed_black, .common_a018_filing_method_delete_normal, .common_a019_add_sub_folders, .common_a020_add_sub_folders_active, .common_a021_add_sub_folders_disable, .common_a022_btn_upload, .common_a023_list_delete, .common_a024_list_delete_active, .common_a025_list_delete_hover, .common_a026_select_folder, .common_a027_select_folder_active, .common_a028_leaf, .common_a029_line, .common_a030_line_half, .common_a031_line_o, .common_a032_line_o_end, .common_a033_line_o_open, .common_a034_line_o_openend, .common_a035_menu_folder_expand, .common_a036_menu_folder, .common_a037_menu_db, .common_a038_menu_nas, .common_a039_menu_nook_normal, .common_a040_menu_ok_normal, .common_a041_icon_back, .common_a042_icon_sort, .common_a043_face_ignore, .common_a044_face_reco, .common_a045_tag_yes, .common_a046_tag_no, .common_a047_tag_top, .common_a048_toolbar_face_normal, .common_a049_tollbar_face_disable, .common_a050_action_preview, .common_a051_empty_bursts, .common_a052_empty_time_lapse, .common_a053_error_14, .common_a054_new, .common_a055_ok_14, .common_a056_processing, .common_a057_remind_14, .common_a058_step_2, .common_a059_step_3, .common_a060_step_1, .common_a061_empty_status, .x-window-dlg .x-tool-close, .x-panel-ghost .x-window-draggable .x-tool-close, .x-window .x-tool-close, .x-panel-ghost .x-tool-close, .x-panel-ghost.q-app-systemPreferences .x-window-draggable .x-tool-close, .x-panel-ghost.file-explorer .x-tool-close, .x-window .x-tool-over .x-tool, .x-window .x-tool-close-over, .x-window .x-tool-minimize, .x-panel-ghost .x-tool-minimize, .x-window .x-tool-minimize-over, .x-panel-ghost .x-tool-minimize-over, .x-window .x-tool-restore, .x-panel-ghost .x-tool-restore, .x-window .x-tool-maximize, .x-panel-ghost .x-tool-maximize, .x-window .x-tool-restore-over, .x-panel-ghost .x-tool-restore-over, .x-window .x-tool-maximize-over, .x-panel-ghost .x-tool-maximize-over, .x-window.dark .x-tool-close, .x-panel-ghost.dark .x-tool-close, .x-panel-ghost.dark.q-app-systemPreferences .x-window-draggable .x-tool-close, .x-panel-ghost.dark.file-explorer .x-tool-close, .x-window.dark .x-tool-over .x-tool, .x-window.dark .x-tool-close-over, .x-window.dark .x-tool-minimize, .x-panel-ghost.dark .x-tool-minimize, .x-window.dark .x-tool-minimize-over, .x-panel-ghost.dark .x-tool-minimize-over, .x-window.dark .x-tool-restore, .x-panel-ghost.dark .x-tool-restore, .x-window.dark .x-tool-maximize, .x-panel-ghost.dark .x-tool-maximize, .x-window.dark .x-tool-restore-over, .x-panel-ghost.dark .x-tool-restore-over, .x-window.dark .x-tool-maximize-over, .x-panel-ghost.dark .x-tool-maximize-over, .filing_method_delete_normal, .uploadListWindow_FromUserClientDisk, .folderSelectWindow2 .add_sub_folders, .folderSelectWindow2 .add_sub_folders_active, .folderSelectWindow2 .add_sub_folders_disable, .folderSelectWindow2 .list_delete, .folderSelectWindow2_list_delete, .folderSelectWindow2 .a024_list_delete_active, .folderSelectWindow2_list_delete:active, .folderSelectWindow2 .a025_list_delete_hover, .folderSelectWindow2_list_delete:hover, .folderSelectWindow2 .select_folder, .uploadListWindow_SelectFolder, .folderSelectWindow2 .select_folder_active, .uploadListWindow_SelectFolderActive, .folderSelectWindow2 .leaf, .folderSelectWindow2 .line, .folderSelectWindow2 .line_half, .folderSelectWindow2 .line_o, .folderSelectWindow2 .line_o_end, .folderSelectWindow2 .line_o_open, .folderSelectWindow2 .line_o_openend, .folderSelectWindow2 .menu_folder_expand, .folderSelectWindow2 .menu_folder, .folderSelectWindow2 .menu_db, .folderSelectWindow2 .menu_nas, .folderSelectWindow2 .menu_nook_normal, .folderSelectWindow2 .menu_ok_normal, .a041_icon_back, #main-panel .statusNameBar .icon_back, .a041_icon_back_hover, #main-panel .statusNameBar .icon_back_hover, .a041_icon_back_active, #main-panel .statusNameBar .icon_back_active, .a042_icon_sort, #main-panel .statusNameBar .icon_sort, .a043_face_ignore, .a044_face_reco, .a045_tag_yes, .a046_tag_no, .a047_tag_top, .a048_toolbar_face_normal, .qpc_toolbar5 .x-btn-icon .x-btn-small .ftb_btn_facerecog, .a049_tollbar_face_disable, .qpc_toolbar5 .qpc_toolbar5_button_disable.x-btn-icon .x-btn-small .ftb_btn_facerecog, .qpc_toolbar5 .no_use.x-btn-icon .x-btn-small .ftb_btn_facerecog, .a050_action_preview, .a051_empty_bursts, .qpc_qphoto_emptyIcon.bursts, .a052_empty_time_lapse, .qpc_qphoto_emptyIcon.time_lapse, .a053_error_14, .qpc_qphoto_statusBar_error, .a054_new, .qpc_tree_qphoto_new, .a055_ok_14, .qpc_qphoto_statusBar_ok, .a056_processing, .qpc_qphoto_statusBar_processing, .a057_remind_14, .a058_step_2, .a059_step_3, .a060_step_1, .a061_empty_status, .qpc_qphoto_emptyIcon.status
{ background-image: url('../images/common/common.png?367309862'); background-repeat: no-repeat; }
/* Light mode window tools start*/
.x-window-dlg .x-tool-close, .x-panel-ghost .x-window-draggable .x-tool-close, .x-window .x-tool-close, .x-panel-ghost .x-tool-close, .x-panel-ghost.q-app-systemPreferences .x-window-draggable .x-tool-close, .x-panel-ghost.file-explorer .x-tool-close { width: 16px !important; height: 16px !important; margin: 10px 4px 0; background-position: 0 0; height: 11px; width: 11px; }

.x-window .x-tool-over .x-tool, .x-window .x-tool-close-over { background-position: 0 -21px; height: 11px; width: 11px; }

.x-window .x-tool-minimize, .x-panel-ghost .x-tool-minimize { width: 33px; height: 19px; background-position: 0 -126px; height: 11px; width: 11px; margin-left: 0; padding-top: 0; }

.x-window .x-tool-minimize-over, .x-panel-ghost .x-tool-minimize-over { background-position: 0 -147px; height: 11px; width: 11px; }

.x-window .x-tool-restore, .x-panel-ghost .x-tool-restore, .x-window .x-tool-maximize, .x-panel-ghost .x-tool-maximize { width: 32px; height: 19px; background-position: 0 -63px; height: 11px; width: 11px; margin-left: 0; padding-top: 0; }

.x-window .x-tool-restore-over, .x-panel-ghost .x-tool-restore-over, .x-window .x-tool-maximize-over, .x-panel-ghost .x-tool-maximize-over { background-position: 0 -84px; height: 11px; width: 11px; }

/* Dark mode window tools start*/
.x-window.dark .x-tool-close, .x-panel-ghost.dark .x-tool-close, .x-panel-ghost.dark.q-app-systemPreferences .x-window-draggable .x-tool-close, .x-panel-ghost.dark.file-explorer .x-tool-close { width: 16px !important; height: 16px !important; background-position: 0 -189px; height: 11px; width: 11px; margin: 10px 4px 0; }

.x-window.dark .x-tool-over .x-tool, .x-window.dark .x-tool-close-over { background-position: 0 -210px; height: 11px; width: 11px; }

.x-window.dark .x-tool-minimize, .x-panel-ghost.dark .x-tool-minimize { width: 33px; height: 19px; background-position: 0 -315px; height: 11px; width: 11px; margin-left: 0; padding-top: 0; }

.x-window.dark .x-tool-minimize-over, .x-panel-ghost.dark .x-tool-minimize-over { background-position: 0 -336px; height: 11px; width: 11px; }

.x-window.dark .x-tool-restore, .x-panel-ghost.dark .x-tool-restore, .x-window.dark .x-tool-maximize, .x-panel-ghost.dark .x-tool-maximize { width: 32px; height: 19px; background-position: 0 -252px; height: 11px; width: 11px; margin-left: 0; padding-top: 0; }

.x-window.dark .x-tool-restore-over, .x-panel-ghost.dark .x-tool-restore-over, .x-window.dark .x-tool-maximize-over, .x-panel-ghost.dark .x-tool-maximize-over { background-position: 0 -273px; height: 11px; width: 11px; }

/* Dark mode window tools end*/
/* Create Album Window Start */
.filing_method_delete_normal { background-position: 0 -378px; height: 20px; width: 20px; }

/* Create Album Window End */
/* Folder and upload window icon start (.folderSelectWindow2) */
.uploadListWindow_FromUserClientDisk { background-position: 0 -510px; height: 24px; width: 24px; }

.folderSelectWindow2 .add_sub_folders { background-position: 0 -408px; height: 24px; width: 40px; }

.folderSelectWindow2 .add_sub_folders_active { background-position: 0 -442px; height: 24px; width: 40px; }

.folderSelectWindow2 .add_sub_folders_disable { background-position: 0 -476px; height: 24px; width: 40px; }

.folderSelectWindow2 .list_delete, .folderSelectWindow2_list_delete { background-position: 0 -544px; height: 28px; width: 40px; }

.folderSelectWindow2 .a024_list_delete_active, .folderSelectWindow2_list_delete:active { background-position: 0 -582px; height: 28px; width: 40px; }

.folderSelectWindow2 .a025_list_delete_hover, .folderSelectWindow2_list_delete:hover { background-position: 0 -620px; height: 28px; width: 40px; }

.folderSelectWindow2 .select_folder, .uploadListWindow_SelectFolder { background-position: 0 -658px; height: 24px; width: 24px; }

.folderSelectWindow2 .select_folder_active, .uploadListWindow_SelectFolderActive { background-position: 0 -692px; height: 24px; width: 24px; }

.folderSelectWindow2 .leaf { background-position: 0 -726px; height: 25px; width: 12px; }

.folderSelectWindow2 .line { background-position: 0 -761px; height: 25px; width: 12px; }

.folderSelectWindow2 .line_half { background-position: 0 -796px; height: 25px; width: 12px; }

.folderSelectWindow2 .line_o { background-position: 0 -831px; height: 25px; width: 12px; }

.folderSelectWindow2 .line_o_end { background-position: 0 -866px; height: 25px; width: 12px; }

.folderSelectWindow2 .line_o_open { background-position: 0 -901px; height: 25px; width: 12px; }

.folderSelectWindow2 .line_o_openend { background-position: 0 -936px; height: 25px; width: 12px; }

.folderSelectWindow2 .menu_folder_expand { background-position: 0 -971px; height: 18px; width: 18px; }

.folderSelectWindow2 .menu_folder { background-position: 0 -999px; height: 18px; width: 18px; }

.folderSelectWindow2 .menu_db { background-position: 0 -1027px; height: 18px; width: 18px; }

.folderSelectWindow2 .menu_nas { background-position: 0 -1055px; height: 18px; width: 18px; }

.folderSelectWindow2 .menu_nook_normal { background-position: 0 -1083px; height: 10px; width: 10px; }

.folderSelectWindow2 .menu_ok_normal { background-position: 0 -1103px; height: 10px; width: 10px; }

/* Folder and upload window icon end*/
/* Top status name bar icon end*/
.a041_icon_back, #main-panel .statusNameBar .icon_back { background-position: 0 -1123px; height: 18px; width: 18px; }
.a041_icon_back:hover, .a041_icon_back.a041_icon_back_hover, #main-panel .statusNameBar .icon_back:hover, #main-panel .statusNameBar .icon_back.a041_icon_back_hover { background-position: 0 -1179px; }
.a041_icon_back:active, .a041_icon_back.a041_icon_back_active, #main-panel .statusNameBar .icon_back:active, #main-panel .statusNameBar .icon_back.a041_icon_back_active { background-position: 0 -1151px; }

.a041_icon_back_hover, #main-panel .statusNameBar .icon_back_hover { background-position: 0 -1179px; height: 18px; width: 18px; }

.a041_icon_back_active, #main-panel .statusNameBar .icon_back_active { background-position: 0 -1151px; height: 18px; width: 18px; }

.a042_icon_sort, #main-panel .statusNameBar .icon_sort { background-position: 0 -1207px; height: 18px; width: 18px; }

/* Top status name bar icon end*/
/* Face function icon start #11521 */
.a043_face_ignore { background-position: 0 -1235px; height: 14px; width: 14px; }

.a044_face_reco { background-position: 0 -1259px; height: 250px; width: 250px; }

.a045_tag_yes { background-position: 0 -1519px; height: 14px; width: 14px; }

.a046_tag_no { background-position: 0 -1543px; height: 14px; width: 14px; }

.a047_tag_top { background-position: 0 -1567px; height: 5px; width: 10px; }

.a048_toolbar_face_normal, .qpc_toolbar5 .x-btn-icon .x-btn-small .ftb_btn_facerecog { background-position: 0 -1582px; height: 20px; width: 23px; }

.a049_tollbar_face_disable, .qpc_toolbar5 .qpc_toolbar5_button_disable.x-btn-icon .x-btn-small .ftb_btn_facerecog, .qpc_toolbar5 .no_use.x-btn-icon .x-btn-small .ftb_btn_facerecog { background-position: 0 -1612px; height: 20px; width: 23px; }

/* Face function icon end*/
/* Qphoto icon start #13211*/
.a050_action_preview { background-position: 0 -1642px; height: 14px; width: 24px; }

.a051_empty_bursts, .qpc_qphoto_emptyIcon.bursts { background-position: 0 -1666px; height: 100px; width: 131px; }

.a052_empty_time_lapse, .qpc_qphoto_emptyIcon.time_lapse { background-position: 0 -1776px; height: 100px; width: 130px; }

.a053_error_14, .qpc_qphoto_statusBar_error { background-position: 0 -1886px; height: 14px; width: 14px; }

.a054_new, .qpc_tree_qphoto_new { background-position: 0 -1910px; height: 17px; width: 40px; }

.a055_ok_14, .qpc_qphoto_statusBar_ok { background-position: 0 -1937px; height: 14px; width: 14px; }

.a056_processing, .qpc_qphoto_statusBar_processing { background-position: 0 -1961px; height: 14px; width: 14px; }

.a057_remind_14 { background-position: 0 -1985px; height: 14px; width: 14px; }

.a058_step_2 { background-position: 0 -2009px; height: 130px; width: 230px; }

.a059_step_3 { background-position: 0 -2149px; height: 130px; width: 230px; }

.a060_step_1 { background-position: 0 -2289px; height: 130px; width: 230px; }

.a061_empty_status, .qpc_qphoto_emptyIcon.status { background-position: 0 -2429px; height: 100px; width: 130px; }

/* Qphoto icon end*/




/*****************************************************************************\
* 
* End of Compass sprite png area
*
\*****************************************************************************/