/*==================================================== - HTML Table Filter Generator stylesheet - do not hesitate to edit classes below to change filter grid appearance =====================================================*/ /* TABLE LAYOUT =====================================================*/ table.TF{ border-spacing: 0; border-top:1px solid #D0D0D0; border-left:1px solid #D0D0D0; border-bottom:1px solid #ccc; border-right:1px solid #ccc; } table.TF th{ margin:0; background-color:#EBECEE; border-bottom:1px solid #D0D0D0; border-right:1px solid #D0D0D0; border-left:1px solid #fff; border-top:1px solid #fff; padding:5px 5px 5px 5px; color:#333; } table.TF td{ margin: 0; padding:5px 5px 5px 5px; border-bottom:1px solid #D0D0D0; border-right:1px solid #D0D0D0; } /* FILTERS BAR =====================================================*/ .fltrow{ /* filter grid row appearance */ height:20px; background-color:#f4f4f4; } .fltrow td, .fltrow th{ padding:2px !important; } .btnflt{ /* button appearance */ font-size:11px; vertical-align:middle; margin:0 2px 0 2px; padding:0 1px 0 1px; } .btnflt_icon{ /* button appearance when displayIcons is true */ width:19px; height:19px; cursor:pointer !important; border:0 !important; vertical-align:middle; background:transparent url(themes/btn_filter.png) center center no-repeat !important; } .flt{ /* filter (input) appearance */ background-color:#fff; border:1px solid #ccc; margin:0; width:97%; vertical-align:middle; } select.flt{ /* select filter */ background-color:#fff; border:1px solid #ccc; margin:0 1px 1px 0; width:99%; vertical-align:middle; } select.flt_multi{ /* multiple select filter */ background-color:#fff; border:1px solid #ccc; margin:0 1px 1px 0; width:99%; height:100px; vertical-align:middle; } .flt_s{ /* small filter (input) appearance */ background-color:#fff; border:1px solid #ccc; margin:0; width:80%; vertical-align:middle; } .single_flt{ /* single filter appearance (input) */ background-color:#fff; border-left:1px solid #999; border-right:1px solid #ccc; border-top:1px solid #ccc; border-bottom:1px solid #999; margin:0; width:120px; vertical-align:middle; } /*.fltWatermark{ watermark input color:#999; }*/ .div_checklist{ /* div containing checklist */ width:100%; height:100px; border:1px solid #ccc; overflow:auto; text-align:left; background-color:#fff; color:#333 !important; } .div_checklist ul.flt_checklist{ padding:0 !important; margin:0 !important; list-style: none !important; } .div_checklist li.flt_checklist_item{ /*check list item*/ padding:1px !important; margin:0 !important; font-size:10px !important; border-bottom:1px solid #ccc !important; } .div_checklist li.flt_checklist_item:hover{ background-color:#335EA8 !important; color:#fff !important; } .flt_checklist_item_disabled{ background-color:#E5E5E5; } .flt_checklist_slc_item{ /*selected check list item*/ background-color:#335EA8 !important; color:#fff !important; } .div_checklist label{ display:block !important; } .div_checklist input{ vertical-align:middle !important; margin:2px 5px 2px 1px !important; } /* RESET BUTTON =====================================================*/ /* Reset button */ input.reset{ width:19px; height:19px; cursor:pointer !important; border:0 !important; vertical-align:middle; background:transparent url(themes/btn_clear_filters.png) center center no-repeat !important; } input.reset:hover{ background:#CAD1D6 url(themes/btn_clear_filters.png) center center no-repeat !important; } /* PAGING ELEMENTS =====================================================*/ .inf{ /* div containing left, middle and right divs */ clear:both; width:auto; height:25px; background:#f4f4f4; font-size:12px; margin:0; padding:1px 3px 1px 3px; border:1px solid #ccc; overflow:hidden; } .ldiv{ /* left div */ float:left; width:30%; position:inherit; text-align:left; } .mdiv{ /* middle div */ float:left; width:38%; position:inherit; text-align:center; padding:1px 0; } .rdiv{ /* right div */ float:right; width:30%; position:inherit; text-align:right; } select.pgSlc{ height:20px; vertical-align:middle; font-size:10px; }/*paging drop-down list*/ input.pgNbInp{/*paging text-box*/ width:25px; height:16px; margin:1px; font-size:11px; vertical-align:middle; } input.pgInp{ /*paging buttons (Next/Previous)*/ vertical-align: middle; width:19px; height:19px; cursor:pointer !important; border:0 !important; font-weight:bold; font-size:11px; } .nextPage{ background:transparent url(themes/btn_next_page.gif) center center no-repeat !important; } .previousPage{ background:transparent url(themes/btn_previous_page.gif) center center no-repeat !important; } .firstPage{ background:transparent url(themes/btn_first_page.gif) center center no-repeat !important; } .lastPage{ background:transparent url(themes/btn_last_page.gif) center center no-repeat !important; } .nextPage:hover, .previousPage:hover, .firstPage:hover, .lastPage:hover{ background-color:#CAD1D6 !important; } span.nbpg{ padding:0 5px 0 0; }/*paging nb pages*/ div.inf a{ color:#333; text-decoration:none; font-weight:bold; }/*link appearence in .inf div*/ div.inf a:hover{ text-decoration:underline; }/*link appearence in .inf div*/ div.tot{ /* rows counter appearance */ float:left; overflow:hidden; width:150px; height:15px; border-right:1px solid #ccc; margin:0 5px 0 2px; padding:0 2px 0 2px; } div.tot span{ font-weight:bold; font-size:11px; } select.rspg{ width:50px; margin:1px 5px 0 5px; vertical-align:middle; }/*results per page select*/ span.rspgSpan{ font-size:11px; } /*results per page select label*/ /* BEHAVIOURS =====================================================*/ span.keyword{ background-color: #ffcc00;}/*highlighted word*/ .even{ background-color:#fff; }/*row bg alternating color*/ .odd{ background-color:#E5E5E5; }/*row bg alternating color*/ .loader{ /* loader appearance */ position:absolute; padding: 5px 10px 5px 10px; margin:20px 0 0 20px; width:auto; z-index:1000; font-size:12px; font-weight:bold; border:1px solid #666; background:#f4f4f4; vertical-align:middle; } div.status{ /* status bar appearance */ float:left; overflow:hidden; width:150px; height:15px; border-right:1px solid #ccc; margin:0 5px 0 2px; padding:0 2px 0 2px; } div.status span{ font-weight:bold; font-size:11px; } div.cont{ /*table container div*/ height:200px; overflow: auto; } div.head{ width:auto; overflow:hidden; } /* Help elements */ .helpBtn{ margin:0 5px 0 5px; padding: 2px 4px 2px 4px; border-left:1px solid #ccc; border-right:1px solid #ccc; } /* help button */ div.helpCont{ /* help container */ position:absolute; display:none; max-width:300px; overflow:auto; padding:10px; margin:15px 0; border:1px solid #CCC; line-height:20px; font-size:12px; color:#333; background:#fff; text-align:left; box-shadow:3px 3px 2px #888; } div.helpCont a{ color:#cc0000; text-decoration:underline; font-weight:normal; } div.helpCont a.close{ color:#333; text-decoration:none; font-weight:bold; } div.helpCont a:hover{ text-decoration:none; } div.helpCont hr{ border:1px solid #ccc; } div.helpFooter{ margin:10px 0 0 0; } div.helpFooter h4{ margin:2px 2px 2px 2px; font-size:13px; color:#333; } /* Pop-up filters elements */ div.popUpFilter{ position:absolute; display:none; width:100px; background:#C8E0FB; border:1px solid #e4e4e4; padding:1px 3px 1px 1px; margin:20px auto 0 0px; } /* Active column header */ .activeHeader{ background:#004080 !important; color:#fff !important; } /* GRID LAYOUT =====================================================*/ div.grd_Cont{ /*Main container*/ width:800px; height:auto; overflow:hidden; padding:3px 3px 3px 3px; background:#C8E0FB; border:1px solid #99BBE8; } div.grd_tblCont{ /*Content table container*/ height:400px; width:800px; background:#fff; overflow-x:auto; overflow-y:scroll; } div.grd_headTblCont{ /*headers' table container*/ height:auto; width:800px; overflow:hidden; border-bottom:1px solid #99BBE8; background-color:#C8E0FB; } div.grd_tblCont table, div.grd_headTblCont table{ /*Tables*/ font-size:12px; border-collapse:collapse; table-layout:fixed; } div.grd_tblCont table{ border-right:1px solid #99BBE8; } /* Filters */ div.grd_Cont .fltrow{ background-color:transparent; } /*Filters' row*/ div.grd_Cont .flt{ border:1px solid #99BBE8; width:97%; } div.grd_Cont .flt:focus{ border:1px solid #558DD9; } /* Headers */ div.grd_tblCont table th, div.grd_headTblCont table th, div.grd_headTblCont table td{ background:#C8E0FB; padding:2px 2px 2px 2px !important; color:#333; border-right:1px solid #99BBE8 !important; overflow:hidden; /*white-space:nowrap;*/ text-overflow:ellipsis; } div.grd_tblCont table td{ padding:2px 2px 2px 2px !important; border-bottom:1px solid #ccc !important; overflow:hidden; /*white-space:nowrap;*/ text-overflow:ellipsis; } .grd_inf{ /* div containing left, middle and right divs */ clear:both; width:auto; height:25px; background:#C8E0FB; font-size:11px; margin:0; padding:1px 3px 1px 3px; border-top:1px solid #99BBE8; } div.grd_Cont .even{ background-color:#fff; }/*row bg alternating color*/ div.grd_Cont .odd{ background-color:#DFE8F6; }/*row bg alternating color*/ /* ezEditTable =====================================================*/ /* Selection */ .ezActiveRow{ background-color:#2852A8 !important; color:#fff; } .ezSelectedRow{ background-color:#316AC5 !important; color:#fff; } .ezActiveCell{ background-color:#D9E8FB !important; color:#000 !important; font-weight:bold; } .ezETSelectedCell{ background-color:#FFDC61 !important; font-weight:bold; color:rgb(0,0,0)!important; } .ezUnselectable{ -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; -o-user-select: none; user-select: none; } /* Cell editors */ .ezInputEditor{ width:95%; height:auto; font-size:inherit; border:1px solid #AACCF6; } .ezTextareaEditor{ width:95%; height:35px; font-size:inherit; border:1px solid #AACCF6; } .ezSelectEditor{ width:100%; font-size:inherit; border:1px solid #AACCF6; } .ezModifiedCell{ background:transparent url(themes/bg_mod_cell.png) 0 0 no-repeat; } select[multiple="multiple"].ezSelectEditor{ height:35px; } /* Command type editor */ .ezCommandEditor{ margin:2px; } .ezCommandEditor button, .ezCommandEditor input[type="button"] { font-size:11px; min-height:22px; margin:1px; padding:3px; border:1px solid #ccc; background:#fff; border-radius:4px 4px 4px 4px; -moz-border-radius:4px 4px 4px 4px; } .ezCommandEditor button:hover, .ezCommandEditor input[type="button"]:hover { border:1px solid #999; } .ezCommandEditor img{ border:0; vertical-align:middle; margin:2px; } /* Utils */ .ezOpacity{ filter:alpha(opacity=60); /* for IE */ opacity:0.6; /* CSS3 standard */ } .alignLeft{ text-align:left; } .alignCenter{ text-align:center; } .alignRight{ text-align:right; } /* WEB FX Sortable table /* Change images paths if you don't use same folder /* Remove safely if not used =====================================================*/ .sort-arrow { width:11px; height:11px; margin:0 2px; background-position:center center; background-repeat:no-repeat; } .sort-arrow.descending{ background-image:url("themes/downsimple.png"); } .sort-arrow.ascending{ background-image:url("themes/upsimple.png"); }