23 background-image: url(../img/pencil-icon.png); |
22 background-image: url(../img/pencil-icon.png); |
24 background-repeat: no-repeat; |
23 background-repeat: no-repeat; |
25 background-position: right 2px; |
24 background-position: right 2px; |
26 padding-right: 20px; |
25 padding-right: 20px; |
27 } |
26 } |
28 .header .title-video-wrap a:hover{ |
27 .title-video-wrap a:hover{ |
29 text-decoration: none; |
28 text-decoration: none; |
30 } |
29 } |
31 .header .title-video-wrap p.time-length{ |
30 .title-video-wrap p.time-length{ |
32 position: absolute; |
31 position: absolute; |
33 top: 34px; |
32 top: 34px; |
34 color: #333333; |
33 color: #333333; |
35 font-size: 14px; |
34 font-size: 14px; |
36 } |
35 } |
37 .header .title-video-wrap p.time-length span{ |
36 .title-video-wrap p.time-length span{ |
38 color: #de2500; |
37 color: #de2500; |
39 } |
38 } |
40 /* popin - update-title */ |
39 /* popin - update-title */ |
41 .update-title.popin{ |
40 .update-title { |
42 top: 34px; |
41 top: 34px; |
43 left: 150px; |
42 left: 150px; |
44 } |
43 } |
45 .update-title.popin .form-right, |
44 .update-title .form-right, |
46 .update-title.popin .form-left{ |
45 .update-title .form-left{ |
47 float: left; |
46 float: left; |
48 } |
47 } |
49 .update-title.popin textarea{ |
48 .update-title textarea{ |
50 width: 200px; |
49 width: 200px; |
51 height: 66px; |
50 height: 66px; |
52 max-width: 530px; |
51 max-width: 530px; |
53 } |
52 } |
54 .update-title.popin .form-left{ |
53 .update-title .form-left{ |
55 margin-right: 12px; |
54 margin-right: 12px; |
56 } |
55 } |
57 .update-title.popin img.pointer{ |
56 .update-title .pointer{ |
58 left: 110px; |
57 left: 110px; |
59 } |
58 } |
60 .update-title.popin label{ |
59 .update-title label{ |
61 display: block; |
60 display: block; |
62 margin-bottom: 4px; |
61 margin-bottom: 4px; |
63 } |
62 } |
64 .update-title.popin input[type=text]{ |
63 .update-title input[type=text]{ |
65 width: 200px; |
64 width: 200px; |
66 } |
65 } |
67 .update-title.popin p.titre-wrap{ |
66 .update-title p.titre-wrap{ |
68 margin-bottom: 6px; |
67 margin-bottom: 6px; |
69 } |
68 } |
70 /* col */ |
69 /* col */ |
71 .col-middle, |
70 .col-middle, |
72 .col-left, |
71 .col-left, |
74 float: left; |
73 float: left; |
75 } |
74 } |
76 /* col-middle */ |
75 /* col-middle */ |
77 .col-middle{ |
76 .col-middle{ |
78 width: 460px; |
77 width: 460px; |
|
78 min-height: 1px; |
79 } |
79 } |
80 .col-middle-header{ |
80 .col-middle-header{ |
81 height: 35px; |
81 height: 35px; |
82 background: url(../img/bg-previsualiser.png) repeat-x 0 0; |
82 font-size: 16px; |
|
83 clear: both; |
|
84 } |
|
85 /* Tabs */ |
|
86 .tab { |
|
87 height: 35px; |
83 line-height: 35px; |
88 line-height: 35px; |
84 font-size: 16px; |
|
85 font-weight: 600px; |
|
86 font-style: italic; |
|
87 } |
|
88 .col-middle-header a{ |
|
89 color: #30036d; |
89 color: #30036d; |
90 } |
90 padding: 0 10px; |
91 .col-middle-header a:hover{ |
91 width: 210px; |
|
92 float: left; |
|
93 background-position: 0 -35px; |
|
94 } |
|
95 .tab:hover{ |
92 color: #FF00FC; |
96 color: #FF00FC; |
93 } |
97 } |
94 .col-middle-header a.disable, |
98 .tab.disable, |
95 .col-middle-header a.disable:hover{ |
99 .tab.disable:hover{ |
96 color: #796891; |
100 color: #796891; |
97 } |
101 } |
98 .col-middle-header a.segmenter{ |
102 .tab-segment { |
99 padding: 0 10px; |
103 background-image: url(../img/bg-segmenter.png); |
100 display: inline-block; |
104 } |
101 min-width: 210px; |
105 .tab-pvw { |
102 height: 35px; |
106 background-image: url(../img/bg-previsualiser.png); text-align: right; |
103 background: url(../img/bg-segmenter.png) repeat-x 0 0; |
107 } |
104 } |
108 |
105 .col-middle-header a.segmenter.disable, |
109 .pvw-mode .tab-pvw, .segment-mode .tab-segment { |
106 .col-middle-header a.previsualiser.disable, |
110 width: 250px; background-position: 0 0; font-weight: 600; |
107 .col-middle-header.disable { |
111 } |
108 background-position: 0 -35px; |
112 |
109 } |
113 .segment-mode .tab-pvw, .pvw-mode .tab-segment { |
110 .col-middle-header a.previsualiser{ |
114 width: 170px; color: #796891; |
111 background: url(../img/bg-previsualiser.png) repeat-x 0 0; |
115 } |
112 float: right; |
116 |
113 padding-right: 10px; |
117 .tab-media-title { |
114 } |
118 font-style: italic; font-weight: normal; |
115 .col-middle .video{ |
119 } |
116 width: 460px; |
120 |
117 position: relative; |
121 .frise{ |
118 margin-bottom: 8px; |
|
119 } |
|
120 .col-middle .video a.publier-button{ |
|
121 position: absolute; |
|
122 width: 69px; |
|
123 height: 67px; |
|
124 background: url(../img/publier-button-sprite.png) 0 0 no-repeat; |
|
125 left: 382px; |
|
126 top: 10px; |
|
127 } |
|
128 .col-middle .video a.publier-button:hover{ |
|
129 background-position: 0 -67px; |
|
130 } |
|
131 .col-middle .video a.publier-button.disable{ |
|
132 background: url(../img/publier-button-sprite.png) 0 -67px no-repeat; |
|
133 } |
|
134 .col-middle .video a.publier-button.disable:hover{ |
|
135 background-color: none; |
|
136 } |
|
137 .col-middle .frise{ |
|
138 width: 458px; |
122 width: 458px; |
139 position: relative; |
123 position: relative; |
140 height: 22px; |
124 height: 22px; |
141 } |
125 } |
142 .col-middle .frise .segment{ |
126 .frise .segment{ |
143 height: 22px; |
127 height: 22px; |
144 } |
128 } |
145 .col-middle .frise span.indication{ |
129 .frise span.indication{ |
146 height: 22px; |
130 height: 22px; |
147 line-height: 22px; |
131 line-height: 22px; |
148 } |
132 } |
149 /* frise */ |
133 /* frise */ |
150 .frise{ |
134 .frise{ |
181 } |
165 } |
182 /* col-middle - bloc-segmentation */ |
166 /* col-middle - bloc-segmentation */ |
183 .bloc-segmentation{ |
167 .bloc-segmentation{ |
184 position: relative; |
168 position: relative; |
185 } |
169 } |
186 .bloc-segmentation .existant{ |
170 |
187 margin-top: 190px; |
|
188 |
|
189 } |
|
190 .bloc-segmentation .existant h2{ |
171 .bloc-segmentation .existant h2{ |
191 color: #30036d; |
172 color: #30036d; |
192 font-size: 14px; |
173 font-size: 14px; |
193 font-weight: 600; |
174 font-weight: 600; |
194 padding-left: 8px; |
175 margin: 10px 8px 8px; |
195 margin-bottom: 8px; |
|
196 } |
176 } |
197 .bloc-segmentation .segment{ |
177 .bloc-segmentation .segment{ |
198 width: 100%; |
178 width: 100%; |
199 height: 8px; |
179 height: 8px; |
200 background-color: #b6b8b8; |
180 background-color: #b6b8b8; |
201 margin-bottom: 5px; |
181 margin-bottom: 5px; |
202 position: relative; |
182 position: relative; |
203 } |
183 } |
204 .bloc-segmentation .segment .section{ |
184 .bloc-segmentation .section{ |
205 background-color: #ff7f0e; |
185 background-color: #ff7f0e; |
206 height: 6px; |
186 height: 6px; |
207 border:1px solid #999999; |
187 border:1px solid #999999; |
208 position: absolute; |
188 position: absolute; |
209 } |
189 } |
|
190 |
|
191 .segment-info { |
|
192 padding-top: 12px; |
|
193 position: relative; |
|
194 width: 100%; |
|
195 overflow: hidden; |
|
196 } |
|
197 |
210 /* col-middle - bloc-segmentation - popin.segmentation */ |
198 /* col-middle - bloc-segmentation - popin.segmentation */ |
211 .popin.segmentation{ |
199 .segment-info .pointer{ |
212 top: 376px; |
200 top: 0; margin-left: -10px; |
213 width: 100%; |
201 } |
214 } |
202 |
215 .popin.segmentation img.pointer{ |
203 .segmentation .pointer{ |
216 left: 222px ; |
204 left: 230px; |
217 } |
205 } |
218 .popin.segmentation h2{ |
206 .segmentation h2{ |
219 font-size: 14px; |
207 font-size: 14px; |
220 font-weight: 600; |
208 font-weight: 600; |
221 color:#de2500; |
209 color:#de2500; |
222 margin-bottom: 10px; |
210 margin-bottom: 10px; |
223 } |
211 } |
224 .popin.segmentation h2 span{ |
212 .segmentation h2 span{ |
225 color: #7628df; |
213 color: #7628df; |
226 } |
214 } |
227 .popin.segmentation form{ |
215 .segmentation form{ |
228 overflow: hidden; |
216 overflow: hidden; |
229 } |
217 } |
230 .popin.segmentation form .form-segment-left, |
218 .form-segment-left, |
231 .popin.segmentation form .form-segment-right{ |
219 .form-segment-right{ |
232 float: left; |
220 float: left; |
233 } |
221 } |
234 .popin.segmentation form .form-segment-left{ |
222 .segmentation .form-segment-left{ |
235 width: 228px; |
223 width: 228px; |
236 } |
224 } |
237 .popin.segmentation form p{ |
225 .segmentation form p{ |
238 margin-bottom: 8px; |
226 margin-bottom: 8px; |
239 } |
227 } |
240 .popin.segmentation label{ |
228 .segmentation label{ |
241 display: block; |
229 display: block; |
242 font-size: 12px; |
230 font-size: 12px; |
243 font-weight: 600; |
231 font-weight: 600; |
244 margin-bottom: 4px; |
232 margin-bottom: 4px; |
245 } |
233 } |
246 .popin.segmentation textarea{ |
234 .segmentation textarea{ |
247 width: 200px; |
235 width: 200px; |
248 height: 66px; |
236 height: 66px; |
249 max-width: 200px; |
237 max-width: 200px; |
250 font-size: 12px; |
238 font-size: 12px; |
251 } |
239 } |
252 .popin.segmentation input[type=text]{ |
240 .segmentation input[type=text]{ |
253 font-size: 12px; |
241 font-size: 12px; |
254 width: 200px; |
242 width: 200px; |
255 height: 20px; |
243 height: 20px; |
256 } |
244 } |
257 .bloc-segmentation .segment .popin.segment-section{ |
245 |
258 top: 8px; |
246 .add-segment { |
259 } |
247 float: right; margin: 4px 0; |
260 .bloc-segmentation .segment .popin.segment-section h2{ |
248 } |
|
249 |
|
250 .segment-section{ |
|
251 top: 8px; left: 15px; |
|
252 } |
|
253 .segment-section h3{ |
261 padding: 0; |
254 padding: 0; |
262 color: #de2500; |
255 color: #de2500; |
263 margin-bottom: 4px; |
256 margin-bottom: 4px; |
264 } |
257 font-weight: 600; |
265 .bloc-segmentation .segment .popin.segment-section p{ |
258 } |
266 font-size: 12px; |
259 .segment-section p{ |
267 } |
260 font-size: 12px; |
268 .bloc-segmentation .segment .popin.segment-section p span{ |
261 } |
|
262 .segment-section p span{ |
269 color: #7628df; |
263 color: #7628df; |
270 } |
264 } |
271 |
265 |
272 .bloc-segmentation .segment .popin.segment-section a.reprendre-segment{ |
266 .segment-section a.reprendre-segment{ |
273 float: right; |
267 float: right; |
274 display: block; |
268 display: block; |
275 height: 20px; |
269 } |
276 line-height: 20px; |
270 .segment-section .instant-description{ |
277 } |
|
278 .bloc-segmentation .segment .popin.segment-section .instant-description{ |
|
279 float: left; |
271 float: left; |
280 margin-right: 16px; |
272 margin-right: 16px; |
281 } |
273 } |
282 /* col-middle - bloc-vide */ |
274 /* col-middle - bloc-vide */ |
283 .bloc-vide .tutorial{ |
275 .tutorial{ |
284 padding: 0 10px; |
276 padding: 0 10px; |
285 color: #FFF; |
277 color: #FFF; |
286 font-weight: 600; |
278 font-weight: 600; |
287 height: 316px; |
279 } |
288 background: url(../img/visuel-player-bar.jpg) 0 276px no-repeat #333333; |
280 .tutorial h2{ |
289 } |
|
290 .bloc-vide .tutorial h2{ |
|
291 padding-top: 16px; |
281 padding-top: 16px; |
292 font-size: 18px; |
282 font-size: 18px; |
293 margin-bottom: 20px; |
283 margin-bottom: 20px; |
294 } |
284 } |
295 .bloc-vide .tutorial ol{ |
285 .tutorial ol{ |
296 padding-left: 22px; |
286 padding-left: 22px; |
297 } |
287 } |
298 .bloc-vide .tutorial ol li:first-child{ |
288 .tutorial ol li:first-child{ |
299 width: 324px; |
289 width: 324px; |
300 } |
290 } |
301 .bloc-vide .tutorial ol li{ |
291 .tutorial ol li{ |
302 list-style: decimal; |
292 list-style: decimal; |
303 font-size: 14px; |
293 font-size: 14px; |
304 margin-bottom: 16px; |
294 margin-bottom: 16px; |
305 padding-left: 20px; |
295 padding-left: 20px; |
306 } |
296 } |
376 font-weight: 600; |
366 font-weight: 600; |
377 font-size: 16px; |
367 font-size: 16px; |
378 margin-bottom: 12px; |
368 margin-bottom: 12px; |
379 padding-top: 8px; |
369 padding-top: 8px; |
380 } |
370 } |
381 .col-right .liste-segment .frise{ |
371 .col-right .frise{ |
382 width: 228px; |
372 width: 228px; |
383 position: relative; |
373 position: relative; |
384 height: 20px; |
374 height: 20px; |
385 } |
375 } |
386 .col-right .liste-segment .frise .segment{ |
376 .col-right .frise .segment{ |
387 height: 20px; |
377 height: 20px; |
388 } |
378 } |
389 .col-right .liste-segment .frise span.indication{ |
379 .col-right .frise .indication{ |
390 height: 20px; |
380 height: 20px; |
391 line-height: 20px; |
381 line-height: 20px; |
392 } |
382 } |
393 .col-right .list-video > li{ |
383 |
394 position: relative; |
384 .col-right .item-video:hover, |
395 } |
385 .col-right .item-video.active{ |
396 .col-right .list-video > li > a:hover, |
|
397 .col-right .list-video > li > a.active{ |
|
398 background: url(../img/arrow-item-video-sprite.png) left top no-repeat; |
386 background: url(../img/arrow-item-video-sprite.png) left top no-repeat; |
399 } |
387 } |
400 .col-right .list-video > li .tools{ |
388 |
401 position: absolute; |
|
402 left: 94px; |
|
403 top: 48px; |
|
404 } |
|
405 /* popin - frise-description */ |
389 /* popin - frise-description */ |
406 .frise-description.popin{ |
390 |
407 top: 26px; |
391 .mashup-description img.pointer{ |
408 left: 0; |
|
409 width: 458px; |
|
410 } |
|
411 .frise-description.popin img.pointer{ |
|
412 right: 36px; |
392 right: 36px; |
413 } |
393 } |
414 .frise-description.popin h2{ |
394 .mashup-description h2{ |
415 color: #de2500; |
395 color: #de2500; |
416 font-size: 14px; |
396 font-size: 14px; |
417 font-weight: bold; |
397 font-weight: bold; |
418 } |
398 } |
419 .frise-description.popin table{ |
399 .mashup-description table{ |
420 font-size: 12px; |
400 font-size: 12px; |
421 } |
401 } |
422 .frise-description.popin th{ |
402 .mashup-description th{ |
423 text-align: left; |
403 text-align: left; |
424 font-weight: 600; |
404 font-weight: 600; |
425 display: block; |
405 display: block; |
426 min-width: 75px; |
406 min-width: 75px; |
427 } |
407 } |
428 .frise-description.popin td{ |
408 .mashup-description td{ |
429 line-height: 15px; |
409 line-height: 15px; |
430 padding-left: 2px; |
410 padding-left: 2px; |
431 } |
411 } |
432 .frise-description.popin th, |
412 .mashup-description th, |
433 .frise-description.popin td, |
413 .mashup-description td, |
434 .frise-description.popin h2{ |
414 .mashup-description h2{ |
435 padding-bottom: 8px; |
415 padding-bottom: 8px; |
436 } |
416 } |
437 .frise-description.popin .tools{ |
417 .mashup-description .tools{ |
438 float: right; |
418 float: right; |
439 } |
419 } |
440 /* tools */ |
420 /* tools */ |
|
421 .tools { |
|
422 height: 17px; |
|
423 } |
441 .tools li{ |
424 .tools li{ |
442 float: left; |
425 float: left; |
443 } |
426 } |
444 .tools li a{ |
427 .tools a{ |
445 display: block; |
428 display: block; |
446 width: 17px; |
429 width: 17px; |
447 height: 17px; |
430 height: 17px; |
448 background: url(../img/tools-sprite.png) no-repeat 0 0; |
431 background: url(../img/tools-sprite.png) no-repeat 0 0; |
449 } |
432 } |
450 .tools li a.edit{ |
433 .tools a.edit{ |
451 background-position: 2px 0; |
434 background-position: 2px 0; |
452 } |
435 } |
453 .tools li a.edit:hover{ |
436 .tools a.edit:hover{ |
454 background-position: 2px -32px; |
437 background-position: 2px -32px; |
455 } |
438 } |
456 .tools li a.edit.disable:hover, |
439 .tools a.edit.disable:hover, |
457 .tools li a.edit.disable{ |
440 .tools a.edit.disable{ |
458 background-position: 2px -16px; |
441 background-position: 2px -16px; |
459 } |
442 } |
460 .tools li a.bottom{ |
443 .tools a.bottom{ |
461 background-position: -19px 0; |
444 background-position: -19px 0; |
462 } |
445 } |
463 .tools li a.bottom:hover{ |
446 .tools a.bottom:hover{ |
464 background-position: -19px -32px; |
447 background-position: -19px -32px; |
465 } |
448 } |
466 .tools li a.bottom.disable:hover, |
449 .tools a.bottom.disable:hover, |
467 .tools li a.bottom.disable{ |
450 .tools a.bottom.disable{ |
468 background-position: -19px -16px; |
451 background-position: -19px -16px; |
469 } |
452 } |
470 .tools li a.top{ |
453 .tools a.top{ |
471 background-position: -40px 0; |
454 background-position: -40px 0; |
472 } |
455 } |
473 .tools li a.top:hover{ |
456 .tools a.top:hover{ |
474 background-position: -40px -32px; |
457 background-position: -40px -32px; |
475 } |
458 } |
476 .tools li a.top.disable:hover, |
459 .tools a.top.disable:hover, |
477 .tools li a.top.disable{ |
460 .tools a.top.disable{ |
478 background-position: -40px -16px; |
461 background-position: -40px -16px; |
479 } |
462 } |
480 .tools li a.delete{ |
463 .tools a.delete{ |
481 background-position: -61px 0; |
464 background-position: -61px 0; |
482 } |
465 } |
483 .tools li a.delete:hover{ |
466 .tools a.delete:hover{ |
484 background-position: -61px -32px; |
467 background-position: -61px -32px; |
485 } |
468 } |
486 .tools li a.delete.disable:hover, |
469 .tools a.delete.disable:hover, |
487 .tools li a.delete.disable{ |
470 .tools a.delete.disable{ |
488 background-position: -61px -16px; |
471 background-position: -61px -16px; |
489 } |
472 } |
490 /* list-video */ |
473 /* list-video */ |
491 .list-video{ |
474 .list-video { |
492 overflow: hidden; |
475 overflow: hidden; |
493 overflow-y: auto; |
476 overflow-y: auto; |
494 max-height: 680px; |
477 height: 680px; |
495 } |
478 } |
496 .list-video > li{ |
479 .item-video { |
497 margin-bottom: 1px; |
480 margin-bottom: 1px; |
498 } |
481 } |
499 .list-video > li > a{ |
482 .item-video{ |
500 padding: 5px 10px 5px 10px; |
483 padding: 5px 10px 5px 10px; |
501 position: relative; |
484 position: relative; |
502 clear: both; |
485 clear: both; |
503 width: auto; |
486 width: auto; |
504 min-height: 62px; |
487 min-height: 62px; |
505 display: block; |
488 display: block; |
506 } |
489 } |
507 .list-video li a img{ |
490 .item-video img{ |
508 float: left; |
491 float: left; |
509 } |
492 } |
510 .list-video li a img{ |
493 .item-video img{ |
511 margin-right: 4px; |
494 margin-right: 4px; |
512 } |
495 } |
513 .list-video li a span.video-info{ |
496 .item-video .video-info{ |
514 display: block; |
497 display: block; |
515 margin-left: 88px; |
498 margin-left: 88px; |
516 } |
499 } |
517 .list-video li a .video-info .title-video{ |
500 .item-video .title-video{ |
518 font-size: 13px; |
501 font-size: 13px; |
519 font-weight: 600; |
502 font-weight: 600; |
520 color: #30036d; |
503 color: #30036d; |
521 display: block; |
504 display: block; |
522 margin-bottom: 1px; |
505 margin-bottom: 1px; |
523 } |
506 } |
524 .list-video li a span.video-info .author{ |
507 .item-video .author{ |
525 font-size: 11px; |
508 font-size: 11px; |
526 display: block; |
509 display: block; |
527 margin-bottom: 1px; |
510 margin-bottom: 1px; |
528 } |
511 } |
529 .list-video li a .video-info .time-lenght{ |
512 .item-video .time-length{ |
530 font-size: 12px; |
513 font-size: 12px; |
531 font-weight: 600; |
514 font-weight: 600; |
532 display: block; |
515 display: block; |
533 } |
516 } |
534 .list-video li a .video-info .time-lenght span{ |
517 .item-video .time-length span{ |
535 color: #de2500; |
518 color: #de2500; |
536 } |
519 } |
537 .list-video li a .number{ |
520 .item-video .number{ |
538 color: #FFF; |
521 color: #FFF; |
539 font-size: 10px; |
522 font-size: 10px; |
540 text-align: center; |
523 text-align: center; |
541 width:15px; |
524 width:15px; |
542 height: 15px; |
525 height: 15px; |