@charset "utf-8";
/**
 * xlzTool - dom draw ui
 * 可继承布局
 * @author 薛立柱
 * @update 薛立柱 2012/5/23
 **/

/* grids */
#xt{margin:auto;text-align:left;overflow:hidden;}
.xt-b{position:relative;}
.xt-b{_position:static;}
#xt-main .xt-b{position:static;}
#xt-main,.xt-g .xt-u .xt-g{width:100%;}
#xt-main{float:right; margin-left:-25em;}
.xt-b{float:left; width:220px;}
#xt-main .xt-b{float:none;width:auto;margin-left:230px;}
.xt-u{width:49.9%;margin-left:0;float:right;}
.xt-g div.first{width:49.9%;float:left;}
#hd:after,#bd:after,#ft:after,.xt-g:after{content:".";display:block;height:0;clear:both;visibility:hidden;}
#hd,#bd,#ft,.xt-g{zoom:1; text-align:left;}
#xt div.xt-clear{border-top:1px solid transparent !important;margin-top:-1px !important;border-top:0;margin-top:0;clear:both;visibility:hidden;}

/* draw grids */
.xt-g{ letter-spacing:normal;}
.xt-u{ display:inline-block; zoom:1; *display:inline; letter-spacing:normal; word-spacing: normal; vertical-align:top;}
.xt-grids .xt-g table,.xt-grids .xt-g h1,.xt-grids .xt-g h2,.xt-grids .xt-g h3{ letter-spacing: 0;}
.xt-u,.xt-u-1,.xt-u-1-2,.xt-u-1-3,.xt-u-2-3,.xt-u-1-4,.xt-u-3-4,.xt-u-1-5,.xt-u-2-5,.xt-u-3-5,.xt-u-4-5,.xt-u-1-6,.xt-u-5-6,.xt-u-1-8,.xt-u-3-8,.xt-u-5-8,.xt-u-7-8,.xt-u-1-12,.xt-u-5-12,.xt-u-7-12,.xt-u-11-12,.xt-u-1-24,.xt-u-5-24,.xt-u-7-24,.xt-u-11-24,.xt-u-13-24,.xt-u-17-24,.xt-u-19-24,.xt-u-23-24 { display: inline-block; zoom: 1; *display: inline; letter-spacing: normal; word-spacing: normal; vertical-align: top;}
.xt-u-1 { display: block;}
.xt-u-1-2 { width: 50%;}
.xt-u-1-3 { width: 33.33333%;}
.xt-u-2-3 { width: 66.66666%;}
.xt-u-1-4 { width: 25%;}
.xt-u-3-4 { width: 75%;}
.xt-u-1-5 { width: 20%;}
.xt-u-2-5 { width: 40%;}
.xt-u-3-5 { width: 60%;}
.xt-u-4-5 { width: 80%;}
.xt-u-1-6 { width: 16.656%;}
.xt-u-5-6 { width: 83.33%;}
.xt-u-1-8 { width: 12.5%;}
.xt-u-3-8 { width: 37.5%;}
.xt-u-5-8 { width: 62.5%;}
.xt-u-7-8 { width: 87.5%;}
.xt-u-1-12 { width: 8.3333%;}
.xt-u-5-12 { width: 41.6666%;}
.xt-u-7-12 { width: 58.3333%;}
.xt-u-11-12 { width: 91.6666%;}
.xt-u-1-24 { width: 4.1666%;}
.xt-u-5-24 { width: 20.8333%;}
.xt-u-7-24 { width: 29.1666%;}
.xt-u-11-24 { width: 45.8333%;}
.xt-u-13-24 { width: 54.1666%;}
.xt-u-17-24 { width: 70.8333%;}
.xt-u-19-24 { width: 79.1666%;}
.xt-u-23-24 { width: 95.8333%;}

/* common */
.xt-hidden{ display:none;}

/* dom tip */
.xt-tip-default{ line-height:20px; margin-left:8px; padding:6px 7px 5px; position:relative; }
.xt-tip-default:before{ display:block; height:0; margin-right:0; margin-top:-6px; position:absolute; right:100%; top:50%; width:0;}
.xt-tip-default:after{ display:block; height:0; margin-right:-1px; margin-top:-6px; position:absolute; right:100%; top:50%; width:0;}

/* dom step */
.xt-step{ overflow:hidden; position:relative;}
.xt-step-3 li,.xt-step-3 .xt-last{ width:33.3%;}
.xt-step-4 li,.xt-step-4 .xt-last{ width:24.9%;}
.xt-step li{ float:left; height:23px; line-height:23px; overflow:hidden; text-align:center;}
.xt-step span{ display:block;}
.xt-step .xt-last{ position:absolute; right:0;}

/* dom button common */
a.xt-button{ display:block; text-align:left; height:25px; overflow:hidden; position:relative;}
a.xt-button span{ display:block; height:16px; padding:5px 0 4px 0; line-height:16px; text-align:center;}
a.xt-button .xt-button-icon{ position:absolute; left:5px; top:5px;}
a.xt-button .xt-button-text{ display:block;}

/* dom button simple */
.xt-simple-button{ margin-right:5px; line-height:17px; padding:1px 8px; display:inline-block; overflow:visible;}
button.xt-simple-button{ padding:2px 8px\9;}
:root button.xt-simple-button{ margin-bottom:1px\9;}
.xt-simple-button span,.xt-simple-button strong{ display:inline-block;}
.xt-simple-button strong{ margin-top:2px; text-align:center;}
.xt-simple-button,.xt-simple-button span{ *display:inline;}
.xt-simple-button input{ display:none;}

/* dom button fixed */
.xt-image-button{ width:30px; height:26px; display:inline-block; cursor:pointer;}
.xt-image-button span{ display:inline-block; width:16px; height:16px; margin:5px 7px; line-height:16px;}
.xt-image-button,.xt-image-button span{ *display:inline;}

/* dom button custom */
a.xt-custom{ padding:0 5px; position:relative;}
a.xt-custom .xt-custom-center{ text-align:left; padding:5px 3px;}
a.xt-custom em{ position:absolute; top:0; display:block; width:5px; height:25px;}
a.xt-custom em.xt-custom-left{ left:0;}
a.xt-custom em.xt-custom-right{ right:0;}

/* dom input */
.xt-form-fields input.xt-input{ height:22px; line-height:22px; padding-left:5px;}
.xt-form-fields input.xt-form-disable{ padding-left:0;}
.xt-form-fields .xt-check-box input.xt-input{ height:auto; line-height:inherit; padding:0;}
.xt-form-fields select.xt-input{ padding:3px 2px; line-height:14px;}
.xt-form-fields .xt-input-left{ width:200px;}
.xt-form-fields input.xt-form-hidden{ width:5px; visibility:hidden; padding:0;}
.xt-form-fields input.xt-form-none{ display:none;}
.xt-form-fields input.xt-label,.xt-form-fields input.xt-label{ height:16px; line-height:16px; padding-left:0;}

/* dom checkbox */
.xt-check-box{ display:inline-block; height:24px; line-height:24px; margin:0; padding-left:20px; position:relative; top:0;}
.xt-check-box input{ position:absolute; left:0; top:5px; *left:-4px; *top:1px;}
.xt-check-box{ *display:inline;}
.xt-check-list .xt-check-item{ display:block; line-height:16px; height:16px; padding:4px 0;}
.xt-check-list .xt-check-item input{ float:left; margin-right:5px; margin-top:2px; *margin-right:3px; *margin-top:-2px;}

/* dom table */
.xt-table-box{ overflow:hidden;}
.xt-table-box .xt-table{ position:relative;}
.xt-table-caption{ line-height:26px; padding-left:5px; position:relative;}
.xt-table-caption .xt-caption-icon{ padding-left:5px;}
.xt-table-caption .xt-table-operate{ position:absolute; height:26px; right:5px; top:0;}
.xt-table-caption .xt-table-operate .xt-simple-button{ margin-right:5px;}
.xt-table-content,.xt-form-fields.xt-page-table .xt-table-content{ overflow-y:hidden;}
.xt-form-fields .xt-table-content,.xt-table-filter .xt-table-content{ overflow-y:visible;}
.xt-table-header{ overflow:hidden;}
.xt-table-filter .xt-spinner .xt-simple-button{ line-height:13px; margin:0;}
.xt-table-content.xt-loaded .xt-table-header{ overflow:visible;}
.xt-table-header th,.xt-table-content td{ text-align:left; margin:0;}
.xt-hidden-td{ display:none;}
.xt-table-content .xt-fixed-td .xt-td{ display:block; overflow:hidden;}
.xt-table-container .xt-table-scrollY{ position:relative; z-index:110;}
.xt-table-container .xt-table-scrollY .xt-scroll-box{ position:absolute; right:0;}
.xt-table-container.xt-scrollable .xt-table-content{ overflow-y:hidden;}
.xt-table-container.xt-scrollable .xt-table-body{ overflow-x:hidden; position:relative; z-index:100;}
.xt-table-container.xt-scrollable .xt-table-header{ position:relative; z-index:110;}
.xt-table-container.xt-scrollable .xt-table-body .xt-table{ position:relative;}
.xt-table-header .xt-check-row,.xt-table-content .xt-check-row{ width:24px; text-align:center;}

.xt-table-content .xt-group-row{ text-align:center; vertical-align:middle;}
.xt-table-content .xt-group-by{ height:16px;}
.xt-table-header th .xt-sort-by{ display:block; text-align:left; position:relative;}
.xt-table-header th .xt-sort-by em{ position:absolute; display:block; right:0; width:20px;}
.xt-table-header th .xt-set-column{ position:absolute; right:0; top:0; display:block; width:10px; height:100%;}
.xt-table-header th .xt-set-column em{ display:block; height:100%;}
.xt-table-filter,.xt-filter-tips{ padding-left:10px; position:relative; z-index:150;}
.xt-filter-tips{ height:22px; line-height:22px; overflow:hidden;}
.xt-filter-tips .xt-button-expand{ position:absolute; top:0; right:-4px;}
.xt-table-filter .xt-table-bar,.xt-append-list .xt-table-bar, .xt-form-fields .xt-table-bar{ display:none;}
.xt-table-container.xt-scrollable .xt-table-filter .xt-table-content,.xt-table-container.xt-scrollable .xt-table-filter .xt-table-body{ overflow-x:visible; overflow-y:visible;}
.xt-table-filter .xt-form-fields{ padding:0 0 5px 0;}
.xt-table-filter .xt-form-fields .xt-form-label{ padding-left:0; line-height:14px;}
.xt-table-filter .xt-table-search{ margin-top:10px;}
.xt-table-filter .xt-column{ padding-top:10px;}
.xt-table-filter .xt-td-select{ height:40px; line-height:40px; padding-top:0;}
.xt-table-filter .xt-form-fields .xt-td-select .xt-select{ position:absolute; margin-top:0;}
.xt-table-filter .xt-td-select .xt-form-label{ position:absolute; margin-top:-14px;}
.xt-table-control,.xt-table-toolbar{ padding:10px 5px 5px 10px; height:26px;}
.xt-total-count{ float:right; line-height:22px;}
.xt-table-toolbar .xt-button span{ padding-left:20px;}
.xt-table-toolbar .xt-button .xt-button-text{ margin-left:-20px;}
.xt-table-toolbar .xt-icon-button .xt-button-text{ margin-left:0;}
.xt-table-toolbar .xt-simple-button.xt-button-set:hover,.xt-table-toolbar .xt-button-set.xt-focused{ margin-bottom:-9px; height:26px;}
.xt-table-toolbar .xt-button-external{ padding-right:20px;}
.xt-more-box{ position:relative;}
.xt-more-box li.more-cover-space{ position:absolute; right:0; top:-9px; height:9px;}
.xt-more-box li a{ display:block; height:22px; line-height:22px; padding:1px 10px 0 10px;}
.xt-xt-tool-more .xt-more-box li a{ min-width:60px;}
.xt-table-control select{ margin:0 5px;}
.xt-page-info{ padding:0 5px;}
.xt-page-current{ text-align:center;}
.xt-table-content tr.xt-table-null td{ text-align:center; line-height:100%; visibility:hidden;}
.xt-table-content .xt-table-header th em,.xt-table-content .xt-table-header .xt-table-check-all,.xt-table-content .xt-table-body td{ visibility:hidden;}
.xt-table-content.xt-loaded .xt-table-header th em,.xt-table-content.xt-loaded .xt-table-header .xt-table-check-all,.xt-table-content.xt-loaded tr.xt-table-null td,.xt-table-content.xt-loaded .xt-table-body td{ visibility:visible;}

.xt-context-menu{ position:absolute; z-index:1000;}
.xt-column-box .column-item td{ line-height:12px; padding:6px; *padding:3px 6px;}
.xt-column-box .column-item td.xt-column-text{ padding-right:50px;}
.xt-resize-col{ width:5px; height:100%;}
.xt-resize-row{ width:100%; height:5px; overflow:hidden;}
.xt-separator-horizontal{ height:18px; margin:3px;}
.xt-tree-table .xt-node-button{ display:block; width:16px; height:16px; float:left;}

/* dom select */
.xt-select dt{ padding-left:8px; overflow:hidden; position:relative; left:0; vertical-align:middle;}
.xt-select dt .xt-input{ display:none;}
.xt-select dt .xt-select-button{ position:absolute; right:0; top:2px;}
.xt-select-input{ display:block; line-height:100%; width:100%; text-align:left;}
.xt-select dd{ position:relative; left:0;}
.xt-select-content{ display:none; position:absolute; overflow:hidden; left:0; z-index:999;}
.xt-select-items{ float:left; text-align:left; width:100%; margin-top:-1px;}
.xt-select-items li{ display:block; overflow:hidden; padding-left:5px;}

/* dom scrollBar */
.xt-scrollBar{ display:block; position:relative; float:right; padding:0; margin:0; width:17px; height:100%;}
.xt-scrollBar li{ position:absolute; left:0; display:block; height:17px; width:17px; overflow:hidden;}
.xt-scrollBar-up{ top:0;}
.xt-scrollBar-bar{ top:17px;}
.xt-scrollBar-down{ bottom:0;}
.xt-scrollBar-btn{ display:block; height:28px; position:relative;}

/* ui box */
.xt-mask{ position:absolute; left:0; top:0; display:none; z-index:999;}
.xt-popup,.xt-tool-tip{ text-align:left; z-index:1000;}
.xt-box-caption{ padding-left:8px; position:relative;}
.xt-box .xt-box-close{ display:block; position:absolute; right:8px;}
.xt-message{ padding-left:5px; line-height:18px;}

/* ui search */
.xt-search-box{ overflow:hidden; position:relative;}
.xt-search-box .xt-search-inner{ overflow:hidden; padding-left:22px;}
.xt-search-box .xt-search-input{ width:100%;}
.xt-search-box .xt-search-submit{ display:block; position:absolute; text-align:center;}

/* ui tree */
.xt-tree .xt-tree-null{ text-align:center;}
.xt-tree li{ display:block; line-height:20px; position:relative; padding-left:22px;}
.xt-tree li .xt-tree-guide{ position:absolute; display:block; width:20px; height:20px; left:0; top:0; _left:-20px;}
.xt-tree li .xt-tree-node{ display:inline-block; height:20px;}
.xt-tree li .xt-level{ clear:both;}
.xt-tree li .xt-tree-node{ *display:inline;}

/* ui box circle */
.xt-circle{ overflow:hidden;}
.xt-circle .xt-top,.xt-circle .xt-top span,.xt-circle .xt-bom,.xt-circle .xt-bom span{ display:block; height:10px; line-height:10px; overflow:hidden;}
.xt-circle .xt-top span,.xt-circle .xt-bom span{ width:10px; float:right;}
.xt-circle .xt-mid{ padding-left:10px;}
.xt-circle .xt-mid .xt-inner{padding-right:10px; }
.xt-circle .xt-top span:after,.xt-circle .xt-bom span:after{content:".";display:block;height:0;clear:both;visibility:hidden;}

/* ui box corner */
.xt-top,.xt-bottom{display:block; text-align:center; font-size:1px; clear:both;} 
.xt-b1,.xt-b2,.xt-b3,.xt-b4,.xt-b5,.xt-b6,.xt-b7{ margin:0 auto; display:block; overflow:hidden;} 
.xt-b1,.xt-b2,.xt-b3{height:1px;}
.xt-b1{margin:0 5px;} 
.xt-b2{margin:0 3px; border-width:0 2px;} 
.xt-b3{margin:0 2px;} 
.xt-b4{height:2px; margin:0 1px;}
.xt-b5,.xt-b6,.xt-b7{height:1px;}
.xt-b5{ width:5px;}
.xt-b6{ width:3px;}
.xt-b7{ width:1px;}
.xt-cont .xt-b5,.xt-cont .xt-b6,.xt-cont .xt-b7{ display:inline-block; width:1px;}
.xt-cont .xt-b5{ height:5px;}
.xt-cont .xt-b6{ height:3px;}
.xt-cont .xt-b7{ height:1px;}
.xt-corner .xt-inner{ padding:0 5px;}

/* ui box table */
.xt-tbox{ width:auto; display:inline-block;}
.xt-tbox{ *display:inline;}
.xt-top-left,.xt-top-right,.xt-bom-right,.xt-bom-left { width:40px; height:40px;}
.xt-tbox-top,.xt-tbox-bom { height:40px;}
.xt-tbox-left,.xt-tbox-right { width:40px;}
.xt-load-box{ padding:2px; z-index:1000;}
.xt-load-box .xt-loading{ padding:2px 2px 2px 25px; line-height:20px;}

/* ui box tip */
.xt-tip-left{ padding-left:31px;}
.xt-tip-top{ padding-top:31px;}
.xt-tip-wrapper{ position:relative; z-index:500;}
.xt-tip-wrapper .xt-tip-stem{ position:absolute; height:35px; width:32px;}
.xt-tip-left .xt-tip-stem{ top:34px; left:-31px; _left:-32px;}
.xt-tip-top .xt-tip-stem{ top:-12px; right:16px;}
.xt-tip-shadow{ height:100%; width:100%; _display:none; position:absolute; z-index:-2;}
.xt-tip-wrapper .xt-box-caption{ padding-top:6px; padding-bottom:6px;}
.xt-tip-outer .xt-inner{ min-height:100px;}

/* ui form */
.xt-form-fields .xt-form-item td{ padding-bottom:5px; line-height:26px;}
.xt-form-fields .xt-time-picker td{ padding:0;}
.xt-form-fields .xt-form-label{ padding-left:10px;}
input.xt-ip-input,.xt-form-fields input.xt-ip-input{ width:40px; text-align:center; padding-left:0;}
.xt-form-operate .xt-button{ margin-right:5px;}
.xt-form-fields .xt-form-list{ padding:5px 0;}
.xt-file-upload{ position:relative;}
.xt-form-fields .xt-file-upload .xt-input{ width:200px;}
.xt-file-upload .xt-upload-swf{ position:absolute; top:0; left:-10000px;}
.xt-form-fields .xt-tag-box dd{ width:100%; overflow-y:scroll;}
.xt-form-fields .xt-tag-box li{ padding-left:20px;}
.xt-form-fields .xt-form-items li{ float:left;}
.xt-form-fields .xt-form-items li .xt-check-box{ margin-right:10px;}

/* ui tab */
.xt-tab{ overflow:hidden; position:relative; display:block;}
.xt-tab ul{ width:10000px; position:absolute;}
.xt-tab ul li{ float:left; display:inline;}
.xt-tab ul li span{ display:block; margin-left:10px; padding-right:10px; position:relative;}
.xt-tab ul li span a{ display:inline-block;}
.xt-tab ul li span a b{ display:none;}
.xt-tab ul li span a strong{text-align:center;}
.xt-tab ul li.xt-selected span a b,.xt-tab ul li.xt-selected span a:hover b{ display:block;}
.xt-tab ul li span a{ *display:inline;}

/* ui calender */
.xt-calender{ position:absolute; z-index:1000; display:none; width:228px; padding:3px;}
.xt-calendar-toolbar{ text-align:center; height:26px; line-height:26px; padding-top:4px;}
.xt-calendar-toolbar .xt-prev a,.xt-calendar-toolbar .xt-next a{ display:block; width:20px; height:20px;}
.xt-calendar-toolbar .xt-prev a{ margin-left:5px;}
.xt-calender .xt-select .xt-select-items li{ height:17px; line-height:17px; overflow:hidden; padding-left:5px;}
.xt-calender .xt-select .xt-select-content{ *top:-2px;}
.xt-calender table{ border-collapse:collapse; border-spacing:0; width:100%;}
.xt-calendar-body thead th{ height:20px; line-height:20px; width:26px; text-align:center;}
.xt-calendar-body td{ text-align:center; height:24px;}
.xt-calendar-body td a{ display:block; width:26px; line-height:20px; height:20px; margin:0 auto;}
.xt-calendar-set .xt-choose,.xt-calendar-set .xt-clear{ display:block; height:100%;}

/* ui time picker */
.xt-calender .xt-time-picker{ width:auto;}
.xt-calender .xt-time-picker td{ height:auto;}
.xt-time-picker input{ height:17px; line-height:17px; text-align:center; width:7px;}
.xt-time-picker .xt-time{ width:17px;}
.xt-time-picker .xt-time-up,.xt-time-picker .xt-time-down{ height:9px; width:13px;}

/* ui color picker */
.xt-color-picker{ position:relative; padding-right:140px;}
.xt-color-picker dt{ position:absolute; height:105px; right:5px; top:5px; width:120px;}
.xt-color-picker dt input{ position:absolute; bottom:3px; right:3px; text-align:center;}
.xt-color-picker dd ul{ padding-left:15px;}
.xt-color-picker dd li{ padding:14px 0;}

/* ui progress*/
.xt-progress-bar{ height:22px; line-height:22px; position:relative;}
.xt-progress-bar .xt-cursor{ margin:-1px; height:100%;}
.xt-progress-bar .xt-button{ display:block; position:absolute;}
.xt-progress-bar .xt-info{ position:absolute; z-index:1; top:0; height:100%; line-height:22px;}

.xt-progress-upload{ overflow:hidden;}
.xt-progress-upload .xt-info{ width:100%; text-align:center;}
.xt-progress-upload .xt-button{ display:none;}

.xt-progress-slider{ height:9px; line-height:9px;}
.xt-progress-slider .xt-button{ top:-3px; width:13px; height:13px; line-height:13px;}
.xt-progress-slider .xt-info{ text-indent:-1000em;}

/* ui params */
.xt-params ul.xt-params-group{ width:100%;}
.xt-params h3.xt-caption{ line-height:16px; margin-top:10px;}
.xt-params .xt-params-group li{ line-height:20px; padding-left:8px;}
.xt-params .xt-operate{ width:35px;}
.xt-params .xt-operate .xt-image-button{ display:block; margin-bottom:5px; margin-left:8px; width:20px; height:20px;}
.xt-params .xt-operate .xt-image-button span{ margin:0; height:20px;}
.xt-params .xt-add-params span,.xt-params .xt-addAll-params span{ padding-left:0; padding-right:20px;}

/* ui editor */
.xt-editor-content{ overflow-x:scroll;}
.xt-editor-content.xt-editor-lined{ position:relative;}
.xt-editor textarea{ display:block; width:10000px;}
.xt-editor-content.xt-editor-lined textarea{ padding-left:40px;}
.xt-editor-tools{ padding:6px 8px;}
.xt-line-bar{ width:30px; padding-right:5px; overflow:hidden; position:absolute; left:0; top:0; text-align:right;}
.xt-line-bar pre{ line-height:inherit;}
.xt-editor-search .xt-box-content td{ padding:5px;}