| .layui-layout-admin .layui-logo { | 
|     color    : #fff; | 
|     font-size: 20px; | 
| } | 
|   | 
| .layui-side-right { | 
|     position  : absolute; | 
|     right     : 0; | 
|     top       : 0; | 
|     bottom    : 0; | 
|     z-index   : 999; | 
|     width     : 330px; | 
|     overflow-x: hidden | 
| } | 
|   | 
| .layui-layout-admin .layui-side { | 
|     top       : 0px; | 
|     width     : 260px; | 
|     overflow-x: hidden | 
| } | 
|   | 
| .layui-layout-admin .layui-side-right { | 
|     top       : 0px; | 
|     right: 10px; | 
|     width     : 330px; | 
|     overflow-x: hidden | 
| } | 
|   | 
| .layui-body { | 
|     position    : absolute; | 
|     left        : 260px; | 
|     right       : 350px; | 
|     top         : 0; | 
|     bottom      : 0; | 
|     z-index     : 998; | 
|     width       : auto; | 
|     overflow-y  : auto; | 
|     box-sizing  : border-box; | 
|     min-width   : 250px; | 
|     border-left : 1px solid #e6e6e6; | 
|     border-right: 1px solid #e6e6e6; | 
| } | 
|   | 
| .layui-layout-admin .layui-body { | 
|     bottom: 0; | 
|     top: 0; | 
|     left: 260px; | 
|     padding-bottom: 0; | 
| } | 
|   | 
| /* components-list*/ | 
|   | 
| .components-list { | 
|     padding           : 4px; | 
|     -webkit-box-sizing: border-box; | 
|     box-sizing        : border-box; | 
|     height            : 100% | 
| } | 
|   | 
| .components-list .components-item { | 
|     display           : inline-block; | 
|     width             : 49%; | 
|     margin            : 0.5%; | 
|     margin-top        : 5px; | 
|     -webkit-transition: -webkit-transform 0ms !important; | 
|     transition        : -webkit-transform 0ms !important; | 
|     transition        : transform 0ms !important; | 
|     transition        : transform 0ms, -webkit-transform 0ms !important | 
| } | 
|   | 
| .components-draggable { | 
|     padding-bottom: 20px | 
| } | 
|   | 
| .components-title { | 
|     font-size: 14px; | 
|     color    : #2196f3; | 
|     margin   : 6px 2px; | 
|     font-weight: bold; | 
| } | 
|   | 
| .right-button { | 
|     float: right; | 
|     padding: 1px 3px; | 
|     border: none; | 
|     cursor: pointer; | 
| } | 
|   | 
| .button--text { | 
|     color: #009688; | 
|     background: 0 0; | 
|     padding-left: 0; | 
|     padding-right: 0; | 
|     font-size: 10px; | 
| } | 
|   | 
| .components-title .svg-icon { | 
|     color    : #666; | 
|     font-size: 18px | 
| } | 
|   | 
| .components-body { | 
|     padding      : 8px 10px; | 
|     background   : #f6f7ff; | 
|     font-size    : 12px; | 
|     cursor       : move; | 
|     border       : 1px dashed #f6f7ff; | 
|     border-radius: 3px | 
| } | 
|   | 
| .components-body .svg-icon { | 
|     color    : #777; | 
|     font-size: 15px | 
| } | 
|   | 
| .components-body:hover { | 
|     border: 1px dashed #787be8; | 
|     color : #787be8 | 
| } | 
|   | 
| .components-body:hover .svg-icon { | 
|     color: #787be8 | 
| } | 
|   | 
| .ghost { | 
|     border       : 1px dashed #e06c1d; | 
|     outline-width: 0; | 
|     height       : 39px; | 
|     box-sizing   : border-box; | 
|     content      : ''; | 
|     padding      : 0; | 
| } | 
| .ghost div { | 
|     color:#fff; | 
| } | 
|   | 
|   | 
| .layui-body .active { | 
|     outline       : 2px solid #409EFF; | 
|     border        : 1px solid #409EFF; | 
|     outline-offset: 0; | 
| } | 
|   | 
| #formDesignerForm .layui-form-item { | 
|     position: relative; | 
| } | 
|   | 
| #formDesignerForm .grid { | 
|     padding: 5px 5px; | 
| } | 
|   | 
| #formDesignerForm .layui-form-item:hover { | 
|     border          : 1px solid #409EFF; | 
|     background-color: #e9f4fd !important; | 
| } | 
|   | 
| .widget-view-drag { | 
|     position   : absolute; | 
|     left       : -2px; | 
|     top        : -2px; | 
|     bottom     : -18px; | 
|     height     : 28px; | 
|     line-height: 28px; | 
|     background : #409EFF; | 
|     z-index    : 9; | 
| } | 
|   | 
| .widget-view-drag i { | 
|     font-size: 14px; | 
|     color    : #fff; | 
|     margin   : 0 5px; | 
|     cursor   : move; | 
| } | 
|   | 
| .select-option-drag { | 
|     cursor: move; | 
| } | 
|   | 
| .select-option-delete { | 
|     cursor: pointer; | 
| } | 
|   | 
| .widget-view-action { | 
|     position   : absolute; | 
|     right      : 0; | 
|     bottom     : 0; | 
|     height     : 28px; | 
|     line-height: 28px; | 
|     background : #409EFF; | 
|     z-index    : 9; | 
| } | 
|   | 
| .widget-view-action i { | 
|     font-size: 14px; | 
|     color    : #fff; | 
|     margin   : 0 5px; | 
|     cursor   : pointer; | 
|   | 
| } | 
|   | 
| #formDesignerForm { | 
|     background: #fff; | 
|     border    : 1px dashed #999; | 
|     min-height: 94%; | 
|     margin    : 10px; | 
|     padding   : 10px 10px; | 
| } | 
|   | 
| #formDesignerForm .widget-col-list { | 
|     min-height: 50px; | 
|     border    : 1px dashed #ccc; | 
|     background: #fff; | 
| } | 
|   | 
| #formDesignerForm .widget-slider { | 
|     margin: 18px 10px; | 
|     width : 90%; | 
|     position: absolute!important; | 
| } | 
|   | 
| .layui-empty { | 
|     margin    : 10px 60px; | 
|     color     : #9e9e9e; | 
|     font-size : 16px; | 
|     text-align: center; | 
|   | 
| } | 
|   | 
| #columnProperty .layui-form-item.option { | 
|     margin-bottom: 2px; | 
| } | 
|   | 
| #columnProperty .layui-form-item.option .layui-inline { | 
|     margin-bottom: 2px; | 
| } | 
|   | 
| /* 图片上传 */ | 
| .uploader-list { | 
|     margin-left: -15px; | 
| } | 
|   | 
| .uploader-list .info { | 
|     position        : relative; | 
|     margin-top      : -25px; | 
|     background-color: black; | 
|     color           : white; | 
|     filter          : alpha(Opacity=80); | 
|     -moz-opacity    : 0.5; | 
|     opacity         : 0.5; | 
|     width           : 100px; | 
|     height          : 25px; | 
|     text-align      : center; | 
|     display         : none; | 
| } | 
|   | 
| .uploader-list .handle { | 
|     position        : relative; | 
|     background-color: black; | 
|     color           : white; | 
|     filter          : alpha(Opacity=80); | 
|     -moz-opacity    : 0.5; | 
|     opacity         : 0.5; | 
|     width           : 100px; | 
|     text-align      : right; | 
|     height          : 18px; | 
|     margin-bottom   : -18px; | 
|     display         : none; | 
| } | 
|   | 
| .uploader-list .handle i { | 
|     margin-right: 5px; | 
| } | 
|   | 
| .uploader-list .handle i:hover { | 
|     cursor: pointer; | 
| } | 
|   | 
| .uploader-list .file-iteme { | 
|     margin : 12px 0 0 15px; | 
|     padding: 1px; | 
|     float  : left; | 
| } | 
|   | 
|   | 
| /*自定义layer颜色*/ | 
| body .cool-black .layui-layer-title { | 
|     color           : #fff; | 
|     height          : 50px; | 
|     line-height     : 50px; | 
|     background-color: #191a23; | 
|     border          : none; | 
| } | 
|   | 
| body .cool-black .layui-layer-setwin a { | 
|     color                  : #fff; | 
|     font-size              : 16px; | 
|     font-style             : normal; | 
|     font-family            : layui-icon !important; | 
|     -webkit-font-smoothing : antialiased; | 
|     -moz-osx-font-smoothing: grayscale; | 
| } | 
|   | 
| body .cool-black .layui-layer-btn a { | 
|     background: #333; | 
| } | 
|   | 
|   | 
|   | 
| .htmlcodeview, | 
| .importjsoncodeview { | 
|     position: relative; | 
|     display : none; | 
| } | 
|   | 
| .htmlcodeview textarea, | 
| .getFormData textarea, | 
| .importjsoncodeview textarea { | 
|     display         : block; | 
|     width           : 760px; | 
|     height          : 560px; | 
|     border          : 10px solid #F8F8F8; | 
|     border-top-width: 0; | 
|     padding         : 10px; | 
|     line-height     : 20px; | 
|     overflow        : auto; | 
|     background-color: #3F3F3F; | 
|     color           : #eee; | 
|     font-size       : 12px; | 
|     font-family     : Courier New; | 
| } | 
|   | 
| .htmlcodeview a, | 
| .importjsoncodeview a { | 
|     position: absolute; | 
|     right   : 20px; | 
|     bottom  : 20px; | 
| } | 
|   | 
| .htmlcodeview, | 
| .importjsoncodedataview { | 
|     position: relative; | 
|     display : none; | 
| } | 
|   | 
| .htmlcodeview textarea, | 
| .getFormData textarea, | 
| .importjsoncodedataview textarea { | 
|     display         : block; | 
|     width           : 760px; | 
|     height          : 560px; | 
|     border          : 10px solid #F8F8F8; | 
|     border-top-width: 0; | 
|     padding         : 10px; | 
|     line-height     : 20px; | 
|     overflow        : auto; | 
|     background-color: #3F3F3F; | 
|     color           : #eee; | 
|     font-size       : 12px; | 
|     font-family     : Courier New; | 
| } | 
|   | 
| .htmlcodeview a, | 
| .importjsoncodedataview a { | 
|     position: absolute; | 
|     right   : 20px; | 
|     bottom  : 20px; | 
| } | 
|   | 
| .aboutusview .about { | 
|     display         : block; | 
|     width           : 760px; | 
|     height          : 554px; | 
|     padding         : 20px 20px; | 
|     overflow        : hidden; | 
|     background-color: #191a23; | 
|     color           : #ccc; | 
| } | 
| .aboutusview .about p{ | 
|     line-height: 30px; | 
|   | 
| } | 
|   | 
| .aboutusview .about .yellow{ | 
|     color:#e6ec8d; | 
| } | 
|   | 
| .layui-disabled { | 
|     background-color: #f5f7fa; | 
|     border-color: #dfe4ed; | 
|     color: #c0c4cc; | 
| } | 
|   | 
| .custom-lg{ | 
|     margin: -3px 0px 0px 10px; | 
| } | 
| .custom-zc{ | 
|     margin: 0px 0px 0px 10px; | 
| } | 
| .custom-sm{ | 
|     margin: 5px 0px 0px 10px; | 
| } | 
| .custom-xs{ | 
|     margin: 10px 0px 0px 10px; | 
| } | 
|   | 
| .iceEditor-disabled { | 
|     position: absolute; | 
|     width: 100%; | 
|     height: 100%; | 
|     top: 0; | 
|     left: 0; | 
|     background-color: rgba(245,247,250,0.79) !important; | 
|     border-color: #dfe4ed !important; | 
|     color: #c0c4cc !important; | 
|     z-index: 1 !important; | 
|     display: block; | 
| } | 
|   | 
| ::-webkit-scrollbar { | 
|     width: 5px; | 
|     color: #000; | 
| } | 
|   | 
| .component-group ol { | 
|     display: inline-block; | 
|     background: #fff; | 
|     color: #000; | 
|     min-width: 70px; | 
|     width: 32%; | 
|     height: 70px; | 
|     line-height: 1; | 
|     text-align: center; | 
|     transition: all .2s ease; | 
|     cursor: pointer; | 
| } | 
|   | 
| .component-group ol:hover { | 
|     background: #009688; | 
|     border-radius: 5px; | 
|     color: #fff; | 
|     border-color: #fff; | 
| } | 
|   | 
|   | 
| .component-group ol .icon { | 
|     padding: 10px 5px 12px; | 
|     display: inline-block; | 
| } | 
|   | 
| .component-group ol .icon i { | 
|     font-size: 18px; | 
| } | 
|   | 
| .layui-icon-switch { | 
|     border: 1px solid #666; | 
|     border-radius: 20px; | 
|     display: inline-block; | 
|     width: 20px; | 
|     height: 10px; | 
|     position: relative; | 
| } | 
|   | 
| .layui-icon-switch k { | 
|     position: absolute; | 
|     left: 4px; | 
|     top: 2px; | 
|     width: 6px; | 
|     height: 6px; | 
|     border-radius: 20px; | 
|     background-color: #666; | 
|     -webkit-transition: .1s linear; | 
|     transition: .1s linear; | 
| } | 
|   | 
| .component { | 
|     margin-bottom: 15px; | 
| } | 
|   | 
| .component-group ol:hover .layui-icon-switch { | 
|     color: #fff; | 
|     border-color: #fff; | 
| } | 
|   | 
| .component-group ol:hover k { | 
|     background-color: #fff; | 
| } | 
|   | 
| .component-group ol .name { | 
|     font-size: 12px; | 
| } | 
|   | 
| .layui-col-md2,.layui-col-md8 { | 
|     border-right: 1px solid #f6f6ff; | 
| } | 
|   | 
| .fr { | 
|     float: right; | 
| } | 
|   | 
|   | 
| .layui-form-footer { | 
|     position: fixed; | 
|     bottom: 0; | 
|     left: 0; | 
|     right: 0; | 
|     background-color: #fff; | 
|     box-shadow: 0 -1px 5px rgba(0,0,0,.15); | 
|     padding: 15px; | 
|     z-index: 9999; | 
|     margin-bottom: 0px; | 
|     margin-top: 10px; | 
|     text-align: center; | 
| } | 
| .layui-inlioc { | 
|     clear: both; | 
| } | 
|   | 
| .layui-fluid { | 
|     padding-top: 20px; | 
| } | 
|   | 
| #layui-form-attribute .layui-input-inline { | 
|     width: 169px; | 
|     margin-right: 0; | 
| } | 
|   | 
| #layui-form-attribute .layui-form-label { | 
|     padding: 6px; | 
|     padding-right: 10px; | 
|     width: 60px!important; | 
| } | 
|   | 
| .layui-minmax { | 
|     width: 76px; | 
|     display: inline-block; | 
| } | 
|   | 
| .layui-input-inline em { | 
|     margin: 0px 5px; | 
| } | 
|   | 
| .layui-component-tools { | 
|     position: absolute; | 
|     background: #009688; | 
|     right: 0; | 
|     bottom: 0; | 
|     padding: 1px 5px; | 
|     cursor: pointer; | 
|     z-index: 21; | 
|     color: #fff; | 
|     width: 32px; | 
|     height: 20px; | 
|     line-height: 20px; | 
|     text-align: center; | 
|     display: none; | 
| } | 
| .layui-input-none { | 
|     display: none; | 
| } | 
|   | 
| .layui-component-tools i,.layui-component-move i { | 
|     font-size: 12px; | 
| } | 
|   | 
| #layui-elem-field legend { | 
|     margin-left: 39%; | 
|     font-size: 14px; | 
| } | 
|   | 
|   | 
| #tab-options input { | 
|     width: 139px; | 
|     display: inline-block; | 
|     margin: 0px 8px; | 
| } | 
|   | 
| #form-options .layui-add-option,#tab-options .layui-add-tab { | 
|     position: relative; | 
|     left: 26px; | 
| } | 
|   | 
| .layui-slider { | 
|     margin-top: 3px; | 
| } | 
|   | 
| #Propertie .layui-slider { | 
|     margin-top: 13px; | 
| } | 
|   | 
| #tpl_main,#tpl_right_main { | 
|     margin: 25% auto; | 
|     text-align: center; | 
|     font-size: 18px; | 
|     color: #c9e0f3; | 
| } | 
|   | 
| #layui-form-template .item-list { | 
|     padding: 8px 0px; | 
| } | 
|   | 
| .item-body { | 
|     border: 1px solid #f6f6f6; | 
|     padding: 20px; | 
|     border-radius: 5px; | 
|     cursor: pointer; | 
|     margin-bottom: 10px; | 
| } | 
|   | 
| .item-body:hover { | 
|     border: 1px solid #009688; | 
| } | 
|   | 
| .item-body .item-img { | 
|     overflow: hidden; | 
| } | 
|   | 
| .item-body .item-img img { | 
|     width: 100%;; | 
| } | 
|   | 
| .item-body .item-desc { | 
|     margin-top: 10px; | 
| } | 
|   | 
| .item-body .item-desc span.item-title{ | 
|     font-size: 13px; | 
|     font-weight: 700; | 
| } | 
| .right-button { | 
|     float: right; | 
|     padding: 1px 3px; | 
|     border: none; | 
|     cursor: pointer; | 
| } | 
|   | 
| .button--text { | 
|     color: #009688; | 
|     background: 0 0; | 
|     padding-left: 0; | 
|     padding-right: 0; | 
|     font-size: 10px; | 
| } | 
|   | 
| .layui-htmlview { | 
|     position: relative; | 
| } | 
|   | 
| .layui-htmlview textarea { | 
|     display: block; | 
|     width: 760px; | 
|     height: 566px; | 
|     border: 10px solid #F8F8F8; | 
|     border-top-width: 0; | 
|     padding: 10px; | 
|     line-height: 20px; | 
|     overflow: auto; | 
|     background-color: #3F3F3F; | 
|     color: #eee; | 
|     font-size: 12px; | 
|     font-family: Courier New; | 
| } | 
|   | 
| .layui-htmlview .layui-htmlbtn{ | 
|     position: absolute; | 
|     right: 20px; | 
|     bottom:20px; | 
| } | 
|   | 
| #parse-table .layui-input { | 
|     height: 30px; | 
|     width: 139px; | 
|     font-size: 12px; | 
|     border: none; | 
| } | 
|   | 
|   | 
| .components-draggable ol { | 
|     display: inline-block; | 
|     background: #fff; | 
|     color: #000; | 
|     min-width: 70px; | 
|     width: 32%; | 
|     height: 70px; | 
|     line-height: 1; | 
|     text-align: center; | 
|     transition: all .2s ease; | 
|     cursor: pointer; | 
| } | 
|   | 
| .components-draggable ol:hover { | 
|     background: #009688; | 
|     border-radius: 5px; | 
|     color: #fff; | 
|     border-color: #fff; | 
| } | 
|   | 
|   | 
| .components-draggable ol .icon { | 
|     padding: 10px 5px 12px; | 
|     display: inline-block; | 
| } | 
|   | 
| .components-draggable ol .icon i { | 
|     font-size: 18px; | 
| } | 
| #formPreviewForm .widget-slider { | 
|     margin: 18px 10px; | 
|     width : 90%; | 
|     position: absolute!important; | 
| } | 
| .custom-lg{ | 
|     margin: -3px 0px 0px 10px; | 
| } | 
| .custom-zc{ | 
|     margin: 0px 0px 0px 10px; | 
| } | 
| .custom-sm{ | 
|     margin: 5px 0px 0px 10px; | 
| } | 
| .custom-xs{ | 
|     margin: 10px 0px 0px 10px; | 
| } | 
| .my-disabled{ | 
|     position: absolute; | 
|     width: 100%; | 
|     height: 100%; | 
|     top: 0; | 
|     left: 0; | 
|     background: rgba(191,191,191,.79); | 
| } | 
| .iceEditor-disabled { | 
|     position: absolute; | 
|     width: 100%; | 
|     height: 100%; | 
|     top: 0; | 
|     left: 0; | 
|     background-color: rgba(245,247,250,0.79) !important; | 
|     border-color: #dfe4ed !important; | 
|     color: #c0c4cc !important; | 
|     z-index: 1 !important; | 
|     display: block; | 
| } | 
| /* 图片上传 */ | 
| .uploader-list { | 
|     margin-left: -15px; | 
| } | 
| .uploader-list .info { | 
|     position: relative; | 
|     margin-top: -25px; | 
|     background-color: black; | 
|     color: white; | 
|     filter: alpha(Opacity=80); | 
|     -moz-opacity: 0.5; | 
|     opacity: 0.5; | 
|     width: 100px; | 
|     height: 25px; | 
|     text-align: center; | 
|     display: none; | 
| } | 
| .uploader-list .handle { | 
|     position: relative; | 
|     background-color: black; | 
|     color: white; | 
|     filter: alpha(Opacity=80); | 
|     -moz-opacity: 0.5; | 
|     opacity: 0.5; | 
|     width: 100px; | 
|     text-align: right; | 
|     height: 18px; | 
|     margin-bottom: -18px; | 
|     display: none; | 
| } | 
| .uploader-list .handle i { | 
|     margin-right: 5px; | 
| } | 
| .uploader-list .handle i:hover { | 
|     cursor: pointer; | 
| } | 
| .uploader-list .file-iteme { | 
|     margin: 12px 0 0 15px; | 
|     padding: 1px; | 
|     float: left; | 
| } |