Commit | Line | Data |
---|---|---|
b5e7b638 MG |
1 | /** |
2 | * File picker | |
3 | */ | |
4 | /* first or middle sibling, no children */ | |
e709ddd2 | 5 | .file-picker .ygtvtn, .filemanager .ygtvtn {background: url([[pix:moodle|y/tn]]) 0 0 no-repeat;width:17px;height:22px;} |
b5e7b638 | 6 | /* first or middle sibling, collapsable */ |
e709ddd2 | 7 | .file-picker .ygtvtm, .filemanager .ygtvtm {background: url([[pix:moodle|y/tm]]) 0 0 no-repeat;width:34px;height:22px;cursor:pointer;} |
b5e7b638 | 8 | /* first or middle sibling, collapsable, hover */ |
e709ddd2 | 9 | .file-picker .ygtvtmh, .filemanager .ygtvtmh {background: url([[pix:moodle|y/tmh]]) 0 0 no-repeat;width:34px;height:22px;cursor:pointer;} |
b5e7b638 | 10 | /* first or middle sibling, expandable */ |
e709ddd2 | 11 | .file-picker .ygtvtp, .filemanager .ygtvtp {background: url([[pix:moodle|y/tp]]) 0 0 no-repeat;width:34px;height:22px;cursor:pointer;} |
b5e7b638 | 12 | /* first or middle sibling, expandable, hover */ |
e709ddd2 | 13 | .file-picker .ygtvtph, .filemanager .ygtvtph {background: url([[pix:moodle|y/tph]]) 0 0 no-repeat;width:34px;height:22px;cursor:pointer;} |
b5e7b638 | 14 | /* last sibling, no children */ |
e709ddd2 | 15 | .file-picker .ygtvln, .filemanager .ygtvln {background: url([[pix:moodle|y/ln]]) 0 0 no-repeat;width:17px;height:22px;} |
b5e7b638 | 16 | /* Last sibling, collapsable */ |
e709ddd2 | 17 | .file-picker .ygtvlm, .filemanager .ygtvlm {background: url([[pix:moodle|y/lm]]) 0 0 no-repeat;width:34px;height:22px;cursor:pointer;} |
b5e7b638 | 18 | /* Last sibling, collapsable, hover */ |
e709ddd2 | 19 | .file-picker .ygtvlmh, .filemanager .ygtvlmh {background: url([[pix:moodle|y/lmh]]) 0 0 no-repeat;width:34px;height:22px;cursor:pointer;} |
b5e7b638 | 20 | /* Last sibling, expandable */ |
e709ddd2 | 21 | .file-picker .ygtvlp, .filemanager .ygtvlp {background: url([[pix:moodle|y/lp]]) 0 0 no-repeat;width:34px;height:22px;cursor:pointer;} |
b5e7b638 | 22 | /* Last sibling, expandable, hover */ |
e709ddd2 | 23 | .file-picker .ygtvlph, .filemanager .ygtvlph {background: url([[pix:moodle|y/lph]]) 0 0 no-repeat;width:34px;height:22px;cursor:pointer;} |
b5e7b638 | 24 | /* Loading icon */ |
e709ddd2 | 25 | .file-picker .ygtvloading, .filemanager .ygtvloading {background: url([[pix:moodle|y/loading]]) 0 0 no-repeat;width:16px;height:22px;} |
b5e7b638 | 26 | /* the style for the empty cells that are used for rendering the depth* of the node */ |
e709ddd2 MG |
27 | .file-picker .ygtvdepthcell, .filemanager .ygtvdepthcell {background: url([[pix:moodle|y/vline]]) 0 0 no-repeat;width:17px;height:22px;} |
28 | .file-picker .ygtvblankdepthcell, .filemanager .ygtvblankdepthcell {width:17px;height:22px;} | |
b5e7b638 | 29 | /* the style of the div around each node */ |
e709ddd2 MG |
30 | .file-picker .ygtvitem table, .filemanager .ygtvitem table{margin-bottom:0;} |
31 | .file-picker .ygtvitem td, .filemanager .ygtvitem td {border:none;padding:0;} | |
b5e7b638 | 32 | /* the style of the div around each node's collection of children */ |
e709ddd2 | 33 | * html .file-picker .ygtvchildren, * html .filemanager .ygtvchildren {height:1%;} |
b5e7b638 MG |
34 | /* the style of the text label in ygTextNode */ |
35 | .file-picker .ygtvlabel, | |
36 | .file-picker .ygtvlabel:link, | |
37 | .file-picker .ygtvlabel:visited, | |
e709ddd2 MG |
38 | .file-picker .ygtvlabel:hover, |
39 | .filemanager .ygtvlabel, | |
40 | .filemanager .ygtvlabel:link, | |
41 | .filemanager .ygtvlabel:visited, | |
42 | .filemanager .ygtvlabel:hover {margin-left:2px;text-decoration: none;} | |
43 | .file-picker .fp-treeview .fp-folder .fp-icon, | |
44 | .filemanager .fp-treeview .fp-folder .fp-icon {display:none;} | |
45 | ||
b5e7b638 MG |
46 | .file-picker {font-size:12px;} |
47 | .file-picker.fp-generallayout {width:700px;height:480px;} | |
e88d5641 BR |
48 | |
49 | ||
50 | .file-picker {font-size:11px;color: #555;letter-spacing: .2px;} | |
51 | .file-picker a {color:#555;} | |
52 | .file-picker a:hover {color:#555;text-decoration: none;} | |
53 | .file-picker select, input, button, textarea {/*font: 99% arial,helvetica,clean,sans-serif;*/color:#555;letter-spacing: .2px;} | |
54 | .file-picker input {border: 1px solid #BBB;width: 265px;height: 18px;padding: 1px 6px;} | |
55 | .file-picker select {height: 22px;padding: 2px 1px;} | |
b5e7b638 | 56 | .file-picker strong {background:#FFFFCC;} |
e88d5641 BR |
57 | .file-picker .fp-content-center {height: 100%;width: 100%;display:table-cell;vertical-align: middle;} |
58 | ||
59 | /* | |
60 | * Layout | |
61 | */ | |
62 | .file-picker.fp-generallayout {/*width: 724px;*/min-width: 724px;max-width: 980px;border: none;border:1px solid #CCC;border-radius:10px;position: relative;} | |
63 | .file-picker .fp-wrapper {width:724px;} | |
64 | .file-picker .yui3-widget-hd {border-radius: 10px 10px 0px 0px;border-bottom: 1px solid #BBB;padding:5px 5px 5px 5px!important;text-align: center;font-size:12px;letter-spacing: 1px;color:#333!important; text-shadow: 1px 1px 1px #FFF;filter: dropshadow(color=#FFF, offx=1, offy=1); | |
65 | background: #CCC!important;filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFF', endColorstr='#CCC')!important;background: -webkit-gradient(linear, left top, left bottom, from(#FFF), to(#CCC))!important;background: -moz-linear-gradient(top, #FFF, #CCC)!important;} | |
66 | .file-picker .fp-repo-area {width:180px;overflow:auto;display:inline-block;border-right:1px solid #BBB;position:absolute;top:26px;bottom:1px;} | |
67 | .file-picker .fp-right {background: yellow;height: auto;} | |
68 | .file-picker .fp-repo-items {vertical-align:top;display: inline-block;margin-left: 181px;} | |
69 | .file-picker .fp-navbar {background: #F2F2F2;min-height:27px;border-bottom: 1px solid #BBB;padding: 5px 8px;/*position: absolute;left:182px;right:0px;*/width:527px;} | |
70 | .file-picker .fp-content {background: #FFF;clear: both;overflow:auto;/*resize:both;*/width: 543px;min-width: 543px;max-width: 780px;height: 349px;min-height: 349px;max-height: 700px;/*border-bottom-right-radius: 10px;*//*top:100px;position: relative;*/margin-bottom: 6px;} | |
71 | .file-picker .fp-repo-items p{width: auto;} | |
5cf44c1f | 72 | .file-picker .fp-content .fp-object-container {width:98%;height:98%;} |
e88d5641 BR |
73 | |
74 | /* | |
75 | * Repositories | |
76 | */ | |
b5e7b638 MG |
77 | .file-picker .fp-list {list-style-type:none;padding:0;float:left;width:100%;margin:0;} |
78 | .dir-rtl .file-picker .fp-list {text-align:right;} | |
e88d5641 BR |
79 | .file-picker .fp-list .fp-repo {display:block;padding:.5em .7em;} |
80 | .file-picker .fp-list .fp-repo.active {background:#F2F2F2;} | |
81 | .file-picker .fp-repo-icon {padding: 0px 7px 0px 5px;} | |
82 | ||
83 | /* | |
84 | * Repository tools, path & view | |
85 | */ | |
86 | .file-picker .fp-viewbar {float:right;width:69px;height:22px;/*margin-top:3px;*/margin-right:8px;} | |
87 | .file-picker .fp-viewbar.disabled {/*display:none;*/} | |
88 | .file-picker .fp-vb-icons {background:url('[[pix:theme|fp/view_icon_active]]') no-repeat 0 0;width:22px;height:22px;display: inline-block;} | |
89 | .file-picker .fp-vb-icons.checked {background:url('[[pix:theme|fp/view_icon_selected]]');} | |
90 | .file-picker .fp-viewbar.disabled .fp-vb-icons {background:url('[[pix:theme|fp/view_icon_inactive]]');} | |
91 | .file-picker .fp-vb-details {background:url('[[pix:theme|fp/view_list_active]]') no-repeat 0px 0px;width:23px;height:22px;display: inline-block;/*margin-left: -4px;*/margin-left: -3px;} | |
92 | .file-picker .fp-vb-details.checked {background:url('[[pix:theme|fp/view_list_selected]]');} | |
93 | .file-picker .fp-viewbar.disabled .fp-vb-details {background:url('[[pix:theme|fp/view_list_inactive]]');} | |
94 | .file-picker .fp-vb-tree {background:url('[[pix:theme|fp/view_tree_active]]') no-repeat 0px 0px;width:23px;height:22px;display: inline-block;/*margin-left: -4px;*/margin-left: -4px;} | |
95 | .file-picker .fp-vb-tree.checked {background:url('[[pix:theme|fp/view_tree_selected]]');} | |
96 | .file-picker .fp-viewbar.disabled .fp-vb-tree {background:url('[[pix:theme|fp/view_tree_inactive]]');} | |
97 | ||
98 | .file-picker .fp-toolbar {/*padding:7px 0px 0px 0px;*/display: table-row;} | |
99 | .file-picker .fp-toolbar.empty {display:none;} | |
100 | .file-picker .fp-toolbar .disabled {display:none;} | |
101 | .file-picker .fp-toolbar div {display: inline-block;padding: 0px 2px 2px;} | |
102 | .file-picker .fp-toolbar img {vertical-align: -20%;margin-right: 5px;} | |
103 | .file-picker .fp-toolbar a {} | |
104 | .file-picker .fp-toolbar .fp-search {} | |
105 | .file-picker .fp-searchbar {} | |
106 | .file-picker .search-entry {background:#FFF url('[[pix:a/search]]') no-repeat 3px 3px;height:18px;width:230px;border: 1px solid #BBB;padding-left:20px;/*margin-left: 7px;*/} | |
107 | ||
108 | .file-picker .fp-pathbar {display: table-row;} | |
109 | .file-picker .fp-pathbar .fp-path-folder {background:url('[[pix:theme|fp/path_folder]]') no-repeat 0 0;width:27px;height:12px;margin-left: 4px;} | |
110 | .file-picker .fp-pathbar .fp-path-folder-name {margin-left: 32px;line-height: 20px;} | |
111 | ||
112 | /* | |
113 | * Icon view | |
114 | */ | |
115 | .file-picker .fp-iconview .fp-file {float:left;display: block;text-align:center;padding: 5px 5px;} | |
116 | .file-picker .fp-iconview .fp-thumbnail {/*overflow: hidden;*/display: table-cell;vertical-align: middle;} | |
117 | .file-picker .fp-iconview .fp-thumbnail img {border: 1px solid #CCC;padding: 3px;-webkit-box-shadow: 1px 1px 2px 0px #CCC;-moz-box-shadow: 1px 1px 2px 0px #CCC;box-shadow: 1px 1px 2px 0px #CCC;} | |
118 | /*.file-picker .fp-iconview .fp-file .fp-thumbnail.over {border:1px solid red;}*/ | |
119 | .file-picker .fp-iconview .fp-filename {height:28px;min-width:50px;word-wrap:break-word;padding-top: 5px;overflow: hidden;} | |
120 | ||
121 | /* | |
122 | * Table view | |
123 | */ | |
124 | .file-picker .yui3-datatable table {border: 0px solid #BBB;width:100%;} | |
125 | .file-picker .yui3-datatable-header {background: #FFF;border-bottom: 1px solid #CCC;border-left: 0 solid #FFF;color: #555;} | |
126 | .file-picker .yui3-datatable-columns .yui3-datatable-sorted, .file-picker .yui3-datatable-sortable-column:hover {background-color: #FFF;} | |
127 | .file-picker .yui3-datatable-odd .yui3-datatable-cell {background-color: #F2F2F2;border-left: 0px solid #F2F2F2;} | |
128 | .file-picker .yui3-datatable-data .yui3-datatable-odd .yui3-datatable-sorted {background-color: #F2F2F2;} | |
129 | .file-picker .yui3-datatable-even .yui3-datatable-cell {background-color: #FFF;border-left: 0px solid #FFF;} | |
130 | .file-picker .yui3-datatable-data .yui3-datatable-even .yui3-datatable-sorted {background-color: #FFF;} | |
131 | .file-picker .fp-icon img {max-height:16px;max-width:16px;} | |
132 | ||
133 | /* | |
134 | * Login | |
135 | */ | |
136 | .file-picker .fp-login-form {height: 100%;width: 100%;display: table;} | |
137 | .file-picker .fp-login-form table {margin: 0 auto;} | |
138 | .file-picker .fp-login-form p {text-align: center;margin-top: 3em;} | |
139 | .file-picker .fp-login-form .fp-login-input .label {text-align: right;vertical-align: middle;/*width: 30%;*/} | |
140 | .file-picker .fp-login-form .fp-login-input .input {text-align: left;} | |
141 | .file-picker .fp-login-form input[type="checkbox"]{width: 15px;height:15px;} | |
142 | ||
143 | /* | |
144 | * Select | |
145 | */ | |
146 | .file-picker .fp-select {width:420px;min-height:auto;text-align:left;background: #F2F2F2;border-radius: 8px;border: 1px solid #FFF; | |
147 | -webkit-box-shadow: 5px 5px 20px 0px #666666;-moz-box-shadow: 5px 5px 20px 0px #666666;box-shadow: 5px 5px 20px 0px #666666;text-align: center;} | |
148 | .file-picker .fp-select .uneditable {display:none;} | |
149 | .file-picker .fp-select p {} | |
150 | .file-picker .fp-select .fp-select-loading {display:none;} | |
151 | .file-picker .fp-select.loading .fp-select-loading {display:block;} | |
152 | .file-picker .fp-select.loading form {display:none;} | |
153 | .file-picker .fp-select-confirm {background: #FFF;padding: 3px 20px 2px 20px; margin: 5px 0px 10px 20px; border-radius: 10px;float:left;-webkit-box-shadow: 2px 2px 1px .1px #999;-moz-box-shadow: 2px 2px 1px .1px #999;box-shadow: 2px 2px 3px .1px #999;} | |
154 | .file-picker .fp-select-cancel {background: #FFF;padding: 3px 20px 2px 20px; margin: 5px 0px 10px 20px; border-radius: 10px;float:left;-webkit-box-shadow: 2px 2px 1px .1px #999;-moz-box-shadow: 2px 2px 1px .1px #999;box-shadow: 2px 2px 3px .1px #999;} | |
155 | .file-picker .fp-select .fp-hr {clear: both;height: 1px; background-color: #FFF;border-bottom: 1px solid #BBB;width: auto; margin: 20px;} | |
156 | .file-picker .fp-select table {margin: 10px 10px;} | |
157 | .file-picker .fp-select .fp-thumbnail {float:left;width:110px;height:110px;line-height: 110px;text-align: center;margin: 10px 0px 10px 20px;background: #FFF;-webkit-box-shadow: inset 0px 0px 10px 0px #BBB;-moz-box-shadow: inset 0px 0px 10px 0px #BBB;box-shadow: inset 0px 0px 10px 0px #BBB;} | |
158 | .file-picker .fp-select .fp-thumbnail img {border: 1px solid #CCC;padding:3px;vertical-align: middle;} | |
159 | .file-picker .fp-select .fp-fileinfo {display: inline-block;/*margin-left: 10px; */margin: 4px 0px 20px 0px;width:240px;text-align: left;} | |
160 | .file-picker .fp-select .fp-fileinfo div {/*paddign-top:5px;padding-bottom:5px;*/padding: 4px 0px;} | |
161 | ||
162 | /* | |
163 | * Upload | |
164 | */ | |
165 | .file-picker .fp-upload-form {height: 100%;width: 100%;display: table;} | |
166 | .file-picker .fp-upload-form table {margin: 0 auto;} | |
167 | .file-picker .fp-upload-btn {/*clear:both;*/margin: 2em;} | |
168 | ||
169 | /* | |
170 | * Error | |
171 | */ | |
172 | .file-picker .fp-content-error {height: 100%;width: 100%;display: table;text-align: center;} | |
173 | .file-picker .fp-content-error .fp-error {height: 100%;width: 100%;display:table-cell;vertical-align: middle;} | |
174 | ||
175 | .file-picker .fp-msg {border: none;border:1px solid #CCCCCC;border-radius:10px;text-align: center;padding-bottom: 30px;} | |
176 | .file-picker .fp-msg .fp-msg-text {min-width:200px;/*min-height:50px;*/max-width:500px;max-height:300px;overflow:auto;} | |
177 | .file-picker .fp-msg.fp-msg-error .fp-msg-text {padding: 30px 40px 20px 40px;margin-bottom: 10px;} | |
178 | .file-picker .fp-msg .fp-msg-butok {} | |
179 | ||
180 | ||
181 | ||
7ccf18a6 MG |
182 | .file-picker .fp-nextpage {clear:both;align:center;} |
183 | .file-picker .fp-nextpage .fp-nextpage-link {align:center;} | |
184 | .file-picker .fp-nextpage .fp-nextpage-loading {display:none;} | |
185 | .file-picker .fp-nextpage.loading .fp-nextpage-link {display:none;} | |
186 | .file-picker .fp-nextpage.loading .fp-nextpage-loading {display:block;} | |
b5e7b638 | 187 | .file-picker .fp-popup {text-align:center;} |
e88d5641 | 188 | |
b5e7b638 | 189 | .filepicker-filelist {padding: 5px;margin: 6px 0;background: #E9F4FF;border: #AACCEE 1px solid} |
e88d5641 | 190 | |
b5e7b638 MG |
191 | /* file picker search dialog */ |
192 | .file-picker div.bd {text-align:left;} | |
193 | ||
194 | /** | |
195 | * File Manager | |
196 | */ | |
197 | .filemanager-toolbar {margin: 5px 0;} | |
198 | .filemanager-toolbar a {border: 1px solid #AACCEE;background: #F4FAFF;color: black;padding: 3px;} | |
199 | .filemanager-toolbar a:hover {background: #FFFFFF;} | |
200 | .filemanager-toolbar .helplink a {border: 0px; background: transparent;} | |
e709ddd2 MG |
201 | .fp-pathbar {margin:0;} |
202 | .filemanager .fp-pathbar.empty {display:none;} | |
906e7d89 | 203 | .filemanager-container {padding: 5px;margin: 6px 0;background: #E9F4FF;border: #AACCEE 1px solid;position: relative;} |
b5e7b638 MG |
204 | .filemanager-container ul{margin:0;padding:0;} |
205 | .filemanager-container ul li{white-space:nowrap;list-style-type:none;} | |
206 | .filemanager-container ul li a{padding:0} | |
207 | .filemanager-loading{display:none} | |
208 | .jsenabled .filemanager-loading{display:block} | |
209 | .fm-menuicon{cursor: pointer;} | |
210 | #fm-move-div {margin: 6px;} | |
211 | #fm-move-div strong{color:red;} | |
212 | .fm-file-entry{border: 1px solid red;} | |
213 | .fm-operation {font-weight: bold;} | |
214 | ||
215 | .filemanager-container, | |
216 | .filepicker-filelist {overflow:hidden;} | |
906e7d89 | 217 | |
e709ddd2 | 218 | .filemanager.fm-loading .fp-pathbar, |
906e7d89 | 219 | .filemanager.fm-loading .filemanager-toolbar, |
906e7d89 MG |
220 | .filemanager.fm-loading .filemanager-container {display:none;} |
221 | ||
222 | .filemanager.fm-loaded .filemanager-loading {display:none;} | |
223 | ||
e709ddd2 | 224 | .filemanager.fm-nofiles .fp-btn-download {display:none;} |
906e7d89 | 225 | |
e709ddd2 | 226 | .filemanager.fm-nomkdir .fp-btn-mkdir {display:none;} |
906e7d89 | 227 | |
e709ddd2 | 228 | .filemanager.fm-maxfiles .fp-btn-add {display:none;} |
906e7d89 MG |
229 | .filemanager.fm-maxfiles .dndupload-message {display:none;} |
230 | ||
231 | .filemanager .fm-empty-container {display:none;} | |
232 | .filemanager.fm-noitems .fm-empty-container {display:block;} | |
e709ddd2 | 233 | .filemanager.fm-noitems .filemanager-container .fp-content {display:none;} |
906e7d89 MG |
234 | |
235 | .filemanager .filemanager-updating {display:none;text-align:center;} | |
236 | .filemanager.fm-updating .filemanager-updating {display:block;} | |
e709ddd2 MG |
237 | .filemanager.fm-updating .fm-content-wrapper {display:none;} |
238 | .filemanager .fp-iconview .fp-file {float:left;text-align:center;} | |
239 | .filemanager .fp-iconview .fp-file div {overflow: hidden;} | |
240 | .filemanager .fp-iconview .fp-file .fp-filename {height:48px;text-align:center;min-width:50px;} | |
6c2367cc | 241 | .filemanager .fp-mainfile .fp-filename {font-weight:bold;} |
e709ddd2 | 242 | |
23b83009 MG |
243 | .filemanager .fp-contextmenu {display:none;} |
244 | .filemanager .fp-iconview .fp-folder.fp-hascontextmenu .fp-contextmenu {display:block;position:absolute;right:0px;top:0px;} | |
245 | .filemanager .fp-treeview .fp-folder.fp-hascontextmenu .fp-contextmenu, | |
246 | .filemanager .fp-tableview .fp-folder.fp-hascontextmenu .fp-contextmenu {display:inline;} | |
247 | ||
e709ddd2 MG |
248 | .filemanager .fp-select .fp-select-loading {display:none;} |
249 | .filemanager .fp-select.loading .fp-select-loading {display:block;} | |
250 | .filemanager .fp-select.loading form {display:none;} | |
251 | ||
252 | /* disable unavailable actions: */ | |
253 | /*.filemanager .fp-select.fp-zip .fp-license,*/ | |
254 | .filemanager .fp-select.fp-folder .fp-license, | |
255 | /*.filemanager .fp-select.fp-zip .fp-author,*/ | |
256 | .filemanager .fp-select.fp-folder .fp-author, | |
257 | .filemanager .fp-select.fp-file .fp-file-unzip, | |
258 | .filemanager .fp-select.fp-folder .fp-file-unzip, | |
259 | .filemanager .fp-select.fp-file .fp-file-zip, | |
260 | .filemanager .fp-select.fp-zip .fp-file-zip {display:none;} | |
261 | .filemanager .fp-select .fp-file-setmain {display:none;} | |
262 | .filemanager .fp-select.fp-cansetmain .fp-file-setmain {display:inline-block;} | |
263 | .filemanager .fp-select.fp-folder .fp-file-download {display:none;} /* to be implemented */ | |
906e7d89 MG |
264 | |
265 | /* | |
266 | * Drag and drop support | |
267 | */ | |
b5e7b638 MG |
268 | .filemanager-container .dndupload-target, |
269 | .filepicker-filelist .dndupload-target {background:#f7f998;position:absolute;height:100%;width:100%;top:0;left:0;text-align:center;padding:5px;z-index:1000} | |
270 | .filemanager-container.dndupload-over .dndupload-target, | |
271 | .filepicker-filelist.dndupload-over .dndupload-target {background:#8EF947;font-weight:bold} | |
906e7d89 MG |
272 | .dndupload-message {display:none;} |
273 | .dndsupported .dndupload-message {display:inline;} | |
274 | .dndupload-target {display:none;} | |
275 | .dndsupported .dndupload-ready .dndupload-target {display:block;} | |
276 | .dndupload-uploadinprogress {display:none;text-align:center;} | |
277 | .dndupload-uploading .dndupload-uploadinprogress {display:block;} |