mediagoblin/static/css/base.css

   1 /* @font-face */
   2
   3 @font-face {
   4   font-family: 'Lato';
   5   font-style: normal;
   6   font-weight: 700;
   7   src: local('Lato Bold'), local('Lato-Bold'), url('../fonts/Lato-Bold.ttf') format('truetype');
   8 }
   9 @font-face {
  10   font-family: 'Lato';
  11   font-style: italic;
  12   font-weight: 400;
  13   src: local('Lato Italic'), local('Lato-Italic'), url('../fonts/Lato-Italic.ttf') format('truetype');
  14 }
  15 @font-face {
  16   font-family: 'Lato';
  17   font-style: italic;
  18   font-weight: 700;
  19   src: local('Lato Bold Italic'), local('Lato-BoldItalic'), url('../fonts/Lato-BoldItalic.ttf') format('truetype');
  20 }
  21 @font-face {
  22   font-family: 'Lato';
  23   font-style: normal;
  24   font-weight: 400;
  25   src: local('Lato Regular'), local('Lato-Regular'), url('../fonts/Lato-Regular.ttf') format('truetype');
  26 }
  27
  28 html, body {
  29   background-color: #161616;
  30   color: #C3C3C3;
  31   padding: 0;
  32   margin: 0px;
  33   height: 100%;
  34   font: 16px 'Lato', 'Helvetica Neue', Arial, 'Liberation Sans', FreeSans, sans-serif;
  35 }
  36
  37 form {
  38   margin: 0px;
  39   padding: 0px;
  40 }
  41
  42 /* text styles */
  43
  44 h1,h2,h3,p {
  45   margin-bottom: 20px;
  46 }
  47
  48 h1,h2,h3 {
  49   font-weight: bold;
  50 }
  51
  52 h1 {
  53   margin-top: 15px;
  54   color: #fff;
  55   font-size: 1.875em;
  56 }
  57
  58 h2 {
  59   font-size: 1.375em;
  60   margin-top: 20px;
  61   color: #fff;
  62 }
  63
  64 h3 {
  65   border-bottom: 1px solid #333;
  66   font-size: 1.125em;
  67 }
  68
  69 p {
  70   margin-top: 0px;
  71 }
  72
  73 a {
  74   color: #86D4B1;
  75 }
  76
  77 a.highlight {
  78   color: #fff;
  79 }
  80
  81 .header_right a {
  82   text-decoration: none;
  83   color: #fff;
  84 }
  85
  86 em {
  87   font-style: italic;
  88 }
  89
  90 strong {
  91   font-weight: bold;
  92 }
  93
  94 ul {
  95   list-style: disc inside;
  96 }
  97
  98 ol {
  99   list-style: decimal inside;
 100 }
 101
 102 label {
 103   font-weight: normal;
 104 }
 105
 106 input, textarea {
 107   font-size:1em;
 108   font-family:'Lato', sans-serif;
 109 }
 110
 111 /* website structure */
 112
 113 #wrap {
 114   min-height: 100%;
 115   height: auto;
 116
 117   /* This must be equal to the footer height + 5px */
 118   margin-bottom: -35px;
 119 }
 120
 121 #wrap:after {
 122   content: "";
 123   display: block;
 124 }
 125
 126 footer, #wrap:after {
 127   height: 30px;
 128 }
 129
 130 header {
 131   width: 100%;
 132   padding: 0;
 133   margin-bottom: 42px;
 134   border-bottom: 1px solid #333;
 135 }
 136
 137 .header_left {
 138   width: 47%;
 139   margin: 0 0 0 8px;
 140   display: inline-block;
 141 }
 142
 143 .header_right {
 144   width: 47%;
 145   margin: 8px 8px 4px 0;
 146   display: inline-block;
 147   float: right;
 148   text-align: right;
 149   line-height: 1.6em;
 150 }
 151
 152 #header_dropdown {
 153   margin-bottom: 20px;
 154   padding: 0px 10px 0px 10px;
 155 }
 156
 157 #header_dropdown li {
 158   margin: 4px 0;
 159   list-style: none;
 160 }
 161
 162 #header_dropdown p {
 163   margin-top: 12px;
 164   margin-bottom: 10px;
 165 }
 166
 167 .dropdown_title {
 168   font-size: 20px;
 169 }
 170
 171 a.logo {
 172   color: #fff;
 173   font-weight: bold;
 174   text-decoration: none;
 175 }
 176
 177 .status_icon {
 178   border-radius: 2px;
 179   padding: 4px;
 180   margin: 0px 4px;
 181 }
 182
 183 .num_queued {
 184   background: #56446F;
 185 }
 186
 187 .num_failed {
 188   background: #87453B;
 189 }
 190
 191 .status_icon a {
 192   display: inline-block;
 193   color: #C3C3C3;
 194 }
 195
 196 .logo img {
 197   vertical-align: middle;
 198   margin: 6px 8px 6px 0;
 199 }
 200
 201 .welcomeimage {
 202   float: right;
 203 }
 204
 205 .fine_print {
 206   font-size: 0.8em;
 207 }
 208
 209 .mediagoblin_content {
 210   width: 100%;
 211   padding-bottom: 74px;
 212 }
 213
 214 footer {
 215   width: 100%;
 216   border-top: 1px solid #333;
 217   padding: 8px 0;
 218   text-align: center;
 219   font-size: 0.875em;
 220   clear: both;
 221 }
 222
 223 .thumb_gallery {
 224   margin-left: 10px;
 225   margin-right: 10px;
 226 }
 227
 228 .profile_showcase .thumb_gallery {
 229   margin-left: 0;
 230   margin-right: 0;
 231 }
 232
 233 .media_image_container {
 234 }
 235
 236 .media_image {
 237   display: block;
 238   margin-left: auto;
 239   margin-right: auto;
 240   max-width: 100%;
 241 }
 242
 243 .media_other_container {
 244   display: flex;
 245   justify-content: center;
 246 }
 247
 248 .media_pane {
 249 /* in place for possible future wide view */
 250 /*  border-bottom: 1px solid #333333;*/
 251 }
 252
 253 .media_sidebar {
 254 /* in place for possible future wide view */
 255 /*  border-left: 1px solid #333333;*/
 256 /*  padding-left: 1em;*/
 257 /*  padding-top: 1em;*/
 258 }
 259
 260 .media_comments {
 261   padding-top: 1em;
 262 }
 263
 264 /* common website elements */
 265
 266 .button_action, .button_action_highlight, .button_form {
 267   display: inline-block;
 268   color: #c3c3c3;
 269   background-color: #363636;
 270   border: 1px solid;
 271   border-color: #464646 #2B2B2B #252525;
 272   border-radius: 4px;
 273   padding: 3px 8px;
 274   font-size: 16px;
 275   text-decoration: none;
 276   font-style: normal;
 277   font-weight: bold;
 278   cursor: pointer;
 279 }
 280
 281 .button_action_highlight, .button_form {
 282   background-color: #86D4B1;
 283   border-color: #A2DEC3 #6CAA8E #5C9179;
 284   color: #283F35;
 285 }
 286
 287 .button_info {
 288   background-color: #508BB5;
 289   border-color: #5899C7 #437699 #427496;
 290   color: #C3C3C3;
 291 }
 292
 293 .button_warning {
 294   background-color: #8A2D2D;
 295   border-color: #913030 #451717 #431212;
 296   color: #C3C3C3;
 297 }
 298
 299 .button_form {
 300   min-width: 99px;
 301   margin: 10px 0px 10px 15px;
 302   text-align: center;
 303   font-family: 'Lato', sans-serif;
 304 }
 305
 306 .pagination {
 307 text-align: center;
 308 }
 309
 310 .pagination_arrow {
 311   margin: 5px;
 312 }
 313
 314 .empty_space {
 315   background-image: url("../images/empty_back.png");
 316   font-style: italic;
 317   text-align: center;
 318   height: 160px;
 319   padding-top: 70px;
 320 }
 321
 322 .no_background {
 323   background-image: none;
 324   height: 0;
 325   padding-top: 0;
 326   display: inline-block;
 327 }
 328
 329 .right_align {
 330   float: right;
 331 }
 332
 333 .left_align {
 334   float: right;
 335 }
 336
 337 .pull-right {
 338   float: right !important;
 339 }
 340 .pull-left {
 341   float: left !important;
 342 }
 343
 344 .clear {
 345   clear: both;
 346   display: block;
 347   overflow: hidden;
 348   visibility: hidden;
 349   width: 0;
 350   height: 0;
 351 }
 352
 353 .hidden {
 354   display: none;
 355 }
 356
 357 .media_sidebar h3 {
 358   font-size: 1em;
 359   margin: 0 0 5px;
 360   border: none;
 361 }
 362
 363 .media_sidebar p {
 364   margin-left: 8px;
 365 }
 366
 367 .alpha {
 368   margin-left:0;
 369 }
 370
 371 .omega {
 372   margin-right:0;
 373 }
 374
 375 .head {
 376   margin-top:0;
 377 }
 378
 379 .foot {
 380   margin-bottom:0;
 381 }
 382
 383 /* forms */
 384
 385 .form_box,.form_box_xl {
 386   background-color: #222;
 387   border-top: 6px solid #D49086;
 388   padding: 3% 5%;
 389   display: block;
 390   float: none;
 391   width: 90%;
 392   max-width: 340px;
 393   margin-left: auto;
 394   margin-right: auto;
 395 }
 396
 397 .form_box > h1, .form_box_xl > h1 {
 398   /* Fix header overflowing issue. */
 399   overflow: hidden;
 400   text-overflow: ellipsis
 401 }
 402
 403 .form_box_xl {
 404   max-width: 460px;
 405 }
 406
 407 .blog_form_box_xl  {
 408   background-color: #222;
 409   border-top: 6px solid #D49086;
 410   padding: 3% 5%;
 411   display: block;
 412   float: none;
 413   width: 90%;
 414   max-width: 800px;
 415   min-height: 500px;
 416   margin-left: auto;
 417   margin-right: auto;
 418 }
 419
 420 .b_listing_title {
 421   height: 30px;
 422   width: 100%;
 423   padding: 0px;
 424   background-color: #86D4B1;
 425   text-transform:capitalize;
 426   text-decoration: none;
 427   #border-radius: 4px;
 428 }
 429
 430 .b_listing_title > a {
 431   text-decoration: none;
 432 }
 433
 434 .b_list_owner {
 435   height: 100px;
 436   width: 100%;
 437   padding: 0em;
 438   margin-right: auto;
 439   background-color: #DDA0DD;
 440   #border-radius: 4px;
 441   text-transform: capitalize;
 442 }
 443
 444 .b_list_des {
 445   text-align:justify;
 446 }
 447
 448
 449 .edit_box {
 450   border-top: 6px dashed #D49086
 451 }
 452
 453 /*.form_field_input input,*/ .form_field_input textarea {
 454   width: 100%;
 455 }
 456
 457 .blog_form_field_input input, .blog_form_field_input textarea {
 458   width: 100%;
 459 }
 460
 461 .form_field_input {
 462   margin-bottom: 10px;
 463 }
 464
 465 .form_field_label {
 466   font-size:1.125em;
 467   margin-bottom: 0;
 468   padding: 10px 0;
 469 }
 470
 471 .form_field_description {
 472   font-style: italic;
 473 }
 474
 475 .form_field_error {
 476   background-color: #87453b;
 477   color: #fff;
 478   border: none;
 479   padding: 9px;
 480   margin-top: 8px;
 481   margin-bottom: 8px;
 482 }
 483
 484 .form_submit_buttons {
 485   text-align: right;
 486 }
 487
 488 .subform {
 489   margin: 2em;
 490 }
 491
 492 #password_boolean {
 493   margin-top: 4px;
 494   width: 20px;
 495 }
 496
 497 .boolean {
 498   margin-bottom: 8px;
 499   }
 500
 501 textarea#description, textarea#bio {
 502   resize: vertical;
 503   height: 100px;
 504 }
 505
 506 .delete {
 507   margin-top: 36px;
 508   display: block;
 509   text-align: center;
 510 }
 511
 512 /* comments */
 513
 514 .comment_wrapper, .report_wrapper {
 515   margin-top: 20px;
 516   margin-bottom: 20px;
 517 }
 518
 519 .comment_wrapper p, .report_wrapper p {
 520   margin-bottom: 2px;
 521 }
 522
 523 .comment_author, .report_author {
 524   padding-top: 4px;
 525   font-size: 0.9em;
 526 }
 527
 528 a.comment_authorlink, a.report_authorlink {
 529   text-decoration: none;
 530   padding-right: 5px;
 531   font-weight: bold;
 532   padding-left: 2px;
 533 }
 534
 535 a.comment_authorlink:hover, a.report_authorlink:hover {
 536   text-decoration: underline;
 537 }
 538
 539 a.comment_whenlink, a.report_whenlink {
 540   text-decoration: none;
 541 }
 542
 543 a.comment_whenlink:hover, a.report_whenlink:hover {
 544   text-decoration: underline;
 545 }
 546
 547 .comment_content, .report_content {
 548   margin-left: 8px;
 549   margin-top: 8px;
 550 }
 551
 552 .comment_active {
 553   box-shadow: 0px 0px 15px 15px #378566;
 554   background: #378566;
 555   color: #f7f7f7;
 556 }
 557
 558 textarea#comment_content {
 559   resize: vertical;
 560   width: 100%;
 561   height: 90px;
 562   border: none;
 563   background-color: #f1f1f1;
 564   padding: 3px;
 565 }
 566
 567 #form_comment .form_field_input {
 568         padding-right: 6px;
 569 }
 570
 571
 572 a.report_authorlink, a.report_whenlink {
 573   color: #D486B1;
 574 }
 575
 576 ul#action_to_resolve {list-style:none; margin-left:10px;}
 577
 578 /* media galleries */
 579
 580 .media_thumbnail {
 581   float: left;
 582   padding: 0px;
 583   width: 180px;
 584   overflow: hidden;
 585   margin: 0px 3px 10px;
 586   text-align: center;
 587   font-size: 0.875em;
 588   background-color: #222;
 589   border-radius: 0 0 5px 5px;
 590   padding: 0 0 6px;
 591   text-overflow: ellipsis;
 592   overflow: hidden;
 593   border-color: #0D0D0D;
 594   border-style: solid;
 595   border-width: 1px 1px 2px;
 596   position: relative;
 597 }
 598
 599 .media_thumbnail a {
 600   color: #eee;
 601   text-decoration: none;
 602   display: block;
 603 }
 604
 605 .media_thumbnail a.remove {
 606   color: #86D4B1;
 607   text-decoration: underline;
 608 }
 609
 610 a.thumb_entry_title {
 611   padding: 8px;
 612 }
 613
 614 .entry_type_icon {
 615   position: absolute;
 616   top: 2px;
 617   left: 2px;
 618 }
 619
 620 .thumb_entry_last {
 621   margin-right: 0px;
 622 }
 623
 624 /* media detail */
 625
 626 h2.media_title {
 627   margin-bottom: 0px;
 628   display: inline-block;
 629 }
 630
 631 p.context {
 632         display: inline-block;
 633         padding-top: 4px;
 634 }
 635
 636 p.media_specs {
 637   font-size: 0.9em;
 638   border-top: 1px solid #222;
 639   padding: 10px 0px;
 640   color: #888;
 641 }
 642
 643 .no_html5 {
 644   background: black;
 645   color: white;
 646   text-align: center;
 647   height: 160px;
 648   padding: 130px 10px 20px 10px;
 649 }
 650
 651 a img.media_image {
 652   cursor: -webkit-zoom-in;
 653   cursor: -moz-zoom-in;
 654   cursor: zoom-in;
 655 }
 656 /* icons */
 657
 658 img.media_icon {
 659   margin: 0 4px;
 660   vertical-align: sub;
 661 }
 662
 663 /* EXIF information */
 664
 665 #exif_content {
 666   padding-bottom: 20px;
 667 }
 668
 669 #exif_camera_information {
 670   margin-bottom: 20px;
 671   margin-left: 8px;
 672 }
 673
 674 #exif_additional_info_button {
 675   margin-left: 8px;
 676 }
 677
 678 #exif_additional_info {
 679   display: none;
 680   margin-left: 8px;
 681 }
 682
 683 #exif_additional_info table {
 684   font-size: 11px;
 685   margin-top: 10px;
 686 }
 687
 688 #exif_additional_info td {
 689   vertical-align: top;
 690   padding-bottom: 5px;
 691 }
 692
 693 #exif_content .col1 {
 694   padding-right: 20px;
 695 }
 696
 697 #exif_additional_info table tr {
 698   margin-bottom: 10px;
 699 }
 700
 701 /* navigation */
 702
 703 .navigation {
 704 }
 705
 706 .navigation_button {
 707   width: 48%;
 708   display: inline-block;
 709   text-align: center;
 710   background-color: #1d1d1d;
 711   border: 1px solid;
 712   border-color: #2c2c2c #232323 #1a1a1a;
 713   border-radius: 4px;
 714   text-decoration: none;
 715   padding: 4px 0 8px;
 716   margin: 0 0 6px;
 717 }
 718
 719 .navigation_left {
 720   margin-right: 3px;
 721 }
 722
 723 /* messages */
 724
 725 ul.mediagoblin_messages {
 726   list-style: none inside;
 727   color: #f7f7f7;
 728   padding: 0;
 729 }
 730
 731 .mediagoblin_messages li {
 732   margin: 5px 0;
 733   padding: 8px;
 734   text-align: center;
 735 }
 736
 737 .message_success {
 738   background-color: #378566;
 739 }
 740
 741 .message_warning {
 742   background-color: #87453b;
 743 }
 744
 745 .message_error {
 746   background-color: #87453b;
 747 }
 748
 749 .message_info {
 750   background-color: #378566;
 751 }
 752
 753 .message_debug {
 754   background-color: #f7f7f7;
 755   color: #272727;
 756 }
 757
 758 ul.mediaentry_tags {
 759   list-style-type: none;
 760 }
 761
 762 ul.mediaentry_tags li {
 763   display: inline;
 764   margin: 0px 5px 0px 0px;
 765   padding: 0px;
 766 }
 767
 768
 769 /* media processing panel */
 770
 771 table.media_panel {
 772   width: 100%;
 773 }
 774
 775 table.media_panel th {
 776   font-weight: bold;
 777   padding-bottom: 4px;
 778   text-align: left;
 779 }
 780 .thumb-overlay-status {
 781   position: absolute;
 782   margin: auto;
 783   top: 0; bottom: 0; left: 0; right: 0;
 784   width: 180px;
 785   height: 20px;
 786   display: inline;
 787   text-align: center;
 788   background-color: rgba(255, 255, 255, 0.8);
 789 }
 790
 791 .thumb-processing {
 792   color: black;
 793   font-weight: bold;
 794 }
 795
 796 .thumb-failed {
 797   color: red;
 798   font-weight: bold;
 799 }
 800
 801 .thumb-wrapper {
 802   position: relative;
 803 /* for proportional thumb resizing */
 804   width: auto;
 805   height: auto;
 806   display: inline-block;
 807 }
 808
 809 .thumb-wrapper img {
 810   max-height: 180px;
 811   max-width: 180px;
 812 }
 813 .media_panel td {
 814   vertical-align: middle;
 815 }
 816
 817 /* moderator panels */
 818
 819 table.admin_panel {
 820   width: 100%
 821 }
 822
 823 table.admin_side_panel {
 824   width: 90%;
 825   margin-bottom: 10px;
 826 }
 827
 828 table.admin_panel th, table.admin_side_panel th {
 829   font-weight: bold;
 830   padding-bottom: 4px;
 831   text-align: left;
 832   color: #fff;
 833 }
 834
 835 table td.user_with_privilege {
 836   font-weight: bold;
 837   color: #86D4B1;
 838 }
 839
 840 table td.user_without_privilege {
 841   font-weight: bold;
 842   color: #D486B1;
 843 }
 844
 845 .return_to_panel    {
 846   text-align:right;
 847   float: right;
 848   font-size:1.2em
 849 }
 850
 851 /* Delete panel */
 852
 853 .delete_checkbox_box {
 854   margin-top: 10px;
 855   margin-left: 10px;
 856 }
 857
 858 /* code of conduct */
 859
 860 #code_of_conduct_list  {
 861     margin-left:25px;
 862     margin-bottom: 10px;
 863 }
 864 #code_of_conduct_list li {
 865     margin:5px 0 15px 25px;
 866 }
 867 #code_of_conduct_list strong{
 868     color:#fff;
 869 }
 870
 871 .nested_sublist {
 872     margin: 5px 0 10px 25px;
 873     font-size:80%;
 874 }
 875 .nested_sublist li {
 876     margin-bottom: 10px;
 877 }
 878
 879 /* ASCII art and code */
 880
 881 @font-face {
 882   font-family: Inconsolata;
 883   src: local('Inconsolata'), url('../fonts/Inconsolata.otf') format('opentype')
 884 }
 885
 886 pre, code {
 887   font-family: Inconsolata, monospace;
 888   line-height: 1em;
 889 }
 890
 891 pre {
 892   overflow: auto;
 893   margin-bottom: 20px;
 894 }
 895
 896 .comment_wrapper pre {
 897   margin-bottom: 2px;
 898 }
 899
 900 .ascii-wrapper pre {
 901   /* but it should not affect the ASCII art */
 902   margin: 0;
 903 }
 904
 905 /* Media queries and other responsivisivity */
 906 /* initial GMG max 940 */
 907 @media screen and (max-width: 960px) {
 908
 909   img.media_image {
 910     max-width: 100%;
 911 /*    display: inline;*/
 912   }
 913
 914   .media_thumbnail {
 915 /*    width: 21%;*/
 916   }
 917
 918   .profile_sidebar {
 919     width: 100%;
 920     margin: 0px;
 921   }
 922
 923   .profile_showcase {
 924     width: 100%;
 925     margin: 0px;
 926   }
 927
 928   .navigation {
 929     float: none;
 930   }
 931
 932   .navigation_button {
 933     float: right;
 934     padding: 10px 0 14px;
 935   }
 936
 937   .navigation_left {
 938     margin-right: 0;
 939     float: left;
 940   }
 941
 942   .button_action, .button_action_highlight, .button_form {
 943     padding: 5px 14px;
 944     margin-bottom: 0.5em;
 945   }
 946
 947 }
 948 /* desktop resolutions */
 949 @media screen and (min-width: 960px) {
 950   .container .three.columns.media_thumbnail {
 951     width:180px;
 952     margin-left:3px;
 953     margin-right:3px;
 954   }
 955   #thingy_view {
 956     width:640px;
 957     height:640px;
 958   }
 959 }
 960
 961 /* Tablet Portrait size to standard 960 (devices and browsers) */
 962 @media only screen and (min-width: 768px) and (max-width: 959px) {
 963   .container .three.columns.media_thumbnail {
 964     width:147px;
 965     margin-left:2px;
 966     margin-right:2px;
 967   }
 968   .media_thumbnail.thumb_entry img {
 969     max-width:100%;
 970   }
 971   .thumb_gallery {
 972     margin-left: 0;
 973     margin-right: 0;
 974   }
 975   .navigation_button {
 976   }
 977   #thingy_view {
 978     width:508px;
 979     height:508px;
 980   }
 981 }
 982
 983 /* All Mobile Sizes (devices and browser) */
 984 @media screen and (max-width: 767px) {
 985   .thumb_row {
 986     margin-bottom: 0;
 987   }
 988   .thumb_gallery {
 989     margin-left: 0;
 990     margin-right: 0;
 991   }
 992   h1,h2,h3,p {
 993     margin-bottom: 10px !important;
 994   }
 995
 996   header {
 997     text-align: center;
 998   }
 999
1000   .header_right {
1001     text-align: center;
1002   }
1003
1004   .welcomeimage {
1005     float: none;
1006     display: inherit;
1007     margin-left: auto;
1008     margin-right: auto;
1009     margin-top: 1em;
1010   }
1011
1012   .media_sidebar {
1013     border-left: none;
1014     padding-left: 0;
1015     padding-top: 1em;
1016     margin-top: 1em;
1017   }
1018
1019   .media_comments {
1020     border-bottom: 1px solid #333333;
1021   }
1022 }
1023
1024 /* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
1025 @media only screen and (min-width: 480px) and (max-width: 767px) {
1026   #thingy_view {
1027     width:420px;
1028     height:420px;
1029   }
1030 }
1031
1032 /* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
1033 @media only screen and (max-width: 479px) {
1034   #thingy_view {
1035     width:300px;
1036     height:300px;
1037   }
1038 }
1039
1040 p.verifier {
1041     text-align:center;
1042     font-size:50px;
1043     none repeat scroll 0% 0% rgb(221, 221, 221);
1044     padding: 1em 0px;
1045 }
1046
1047 /* for the media metadata editing table */
1048 table.metadata_editor {
1049     margin: 10px auto;
1050     width: 800px;
1051 }
1052
1053 table.metadata_editor tr td {
1054     width:350px;
1055 }
1056 table.metadata_editor tr td.form_field_input input {
1057     width:350px;
1058 }
1059
1060 .application {
1061   min-height: 30px;
1062   margin-left: 70px;
1063 }
1064
1065 .application-icon {
1066   position: absolute;
1067   left: 12px;
1068   width: 50px;
1069   height: 50px;
1070 }
1071
1072 .application-button {
1073   float: right;
1074 }