liquid_feedback_frontend
view static/style.css @ 622:cc542ac26edc
Fixes at area list and optical enhancements
| author | bsw | 
|---|---|
| date | Mon Jun 25 15:27:23 2012 +0200 (2012-06-25) | 
| parents | 496bed1b59b8 | 
| children | 8478b5027817 | 
 line source
     2 /* Style reset */
     3 html,
     4 body,
     5 div,
     6 span,
     7 applet,
     8 object,
     9 iframe,
    10 h1, h2, h3, h4, h5, h6,
    11 p, a, img,
    12 form, label, legend,
    13 table, tbody, tfoot, thead, tr, th,td {
    14   margin: 0;
    15   padding: 0;
    16   border: 0;
    17   outline: 0;
    18   font-weight: inherit;
    19   font-style: inherit;
    20   font-size: 100%;
    21   font-family: inherit;
    22   vertical-align: baseline;
    23 }
    24 body {
    25   line-height: 1;
    26   color: black;
    27   background: white;
    28 }
    29 li {
    30   line-height: 133%;
    31 }
    32 p {
    33   margin-top: 2ex;
    34   margin-bottom: 2ex;
    35 }
    37 table {
    38   border-collapse: separate;
    39   border-spacing: 0;
    40 }
    41 caption, th, td {
    42   text-align: left;
    43   font-weight: normal;
    44 }
    46 /*************************************************************************
    47  * Some global definitions 
    48  */
    50 body {
    51   background: #fff;
    52   line-height: 120%:
    53 }
    55 body, th, td {
    56   font-family: sans-serif;
    57   font-size: 15px;
    58   font-size: 14px;
    59   padding: 0;
    60   margin: 0;
    61 }
    63 .page,
    64 .topbar_content {
    65   max-width: 1130px;
    66   margin: 0 auto;
    67 }
    69 table {
    70   margin-top: 1ex;
    71 }
    73 body, a {
    74   color: #000;
    75 }
    77 img {
    78   border: none;
    79 }
    81 table {
    82   border-collapse: collapse;
    83   border: none;
    84 }
    86 td, th {
    87   padding: 0.5ex 0.5em 0.5ex 0em;
    88 }
    90 td {
    91   vertical-align: top;
    92 }
    94 th {
    95   vertical-align: bottom;
    96   font-weight: bold;
    97 }
    99 a.active {
   100   color: #fff; 
   101 }
   103 .revoked {
   104   text-decoration: line-through;
   105 }
   107 .highlighted {
   108   background-color: #fa7;
   109   color: #000;
   110 }
   112 .admin_only {
   113   font-style: italic;
   114 }
   116 h1 {
   117   font-size: 150%;
   118 }
   120 h2 {
   121   font-size: 125%;
   122 }
   124 .inline {
   125   display: inline;
   126 }
   128 /*************************************************************************
   129  * Notices, warnings and errors
   130  */
   132 .layout_notice, .layout_error, .layout_warning {
   133   background: #fff;
   134   font-weight: bold;
   135   line-height: 1.7em;
   136   -moz-opacity:0.7;
   137 }
   139 .slot_notice, .slot_warning, .slot_error {
   140   padding-left: 1em;
   141 }
   143 .slot_notice {
   144   background-color: #cfc;
   145   color: #040;
   146 }
   148 .slot_warning {
   149   background-color: #fec;
   150   color: #420;
   151 }
   153 .slot_error {
   154   background-color: #fcc;
   155   color: #400;
   156 }
   158 /*************************************************************************
   159  * Navigation, search and language chooser bar 
   160  */
   162 .topbar {
   163   background-color: #333;
   164   background-image: -webkit-gradient(linear, left top, left bottom, 
   165     color-stop(0%, #888), color-stop(25%,#333)
   166   );
   167   font-size: 90%;
   168   box-shadow: #aaa 0 0 5px;
   169   xoverflow: auto;
   170   -mox-box-shadow: #aaa 0 0 5px;
   171   -webkit-box-shadow: #aaa 0 0 5px;
   172   border-top: 1px solid #333;
   173   line-height: 30px;
   175 }
   177 .topbar .logolf {
   178   margin-left: 6px;
   179   font-weight: bold;
   180 }
   182 .topbar .instance_name,
   183 .topbar a {
   184   color: #eee;
   185   line-height: 30px;
   186 }
   188 .topbar  a:hover {
   189   color: #fc0;
   190 }
   192 .navigation {
   193   background-color: #333;
   194   line-height: 200%;
   195 }
   197 .topbar img {
   198   margin-right: 0.5em;
   199   vertical-align: middle;
   200 }
   202 .topbar a {
   203   padding: 0 0.5em;
   204   float: left;
   205   display: block;
   206   white-space: nowrap;
   207 }
   209 form.unit_selector {
   210   display: inline;
   211 }
   213 .topbar .navigation_right {
   214   float: right;
   215   padding-right: 1%;
   216 }
   219 #member_menu {
   220  z-index: 2;
   221 }
   223 #member_menu li {
   224  float: left;
   225 }
   227 #member_menu li:hover {
   228  position: relative;
   229  z-index: 4;
   230  cursor: default;
   231 }
   233 #member_menu {
   234   margin: 0;
   235   padding: 0;
   236   width: 200px;
   237 }
   239 #member_menu > li {
   240   width: 200px;
   241 }
   243 #member_menu li a {
   244   float: right;
   245 }
   247 #member_menu ul {
   248   margin: 0;
   249   padding: 0;
   250   list-style-type: none;
   251   display: none;
   252   position: absolute;
   253   top: 100%;
   254   left: 0;
   255   z-index: 3;
   256   width: 200px;
   257   border-radius: 0 0 8px 8px;
   258   background: #000;
   259 }
   261 #member_menu ul li {
   262   float: none;
   263 }
   265 #member_menu ul li a {
   266   float: none;
   267   background: #000;
   268 }
   270 #member_menu ul ul {
   271   top: 1px;
   272   right: 1px;
   273 }
   275 #member_menu li:hover ul {
   276   display: block;
   277 }
   279 #member_menu li li a {
   280   background: #000;
   281   border-radius: 5px;
   282   color: #fff;
   283 }
   285 #member_menu ul li:hover a {
   286   background: #000;
   287   color: #fc0;
   288 }
   290 */
   291 /*************************************************************************
   292  * Title of current page including path and actions
   293  */
   295 .slot_title {
   296   font-size: 120%;
   297   font-weight: bold;
   298   margin-left: 10px;
   299   margin-right: 10px;
   300   margin-top: 1ex;
   301 }
   303 .slot_head {
   304   background-color: #fff;
   305   margin: 0px 10px 2ex 10px;
   306   border: 1px solid #aaa;
   307   border-radius: 0 0 8px 8px;
   308 }
   310 .page_head .title,
   311 .issue .context,
   312 .issue .title,
   313 .initiative_head .title,
   314 .area_list .title {
   315   padding: 8px 10px 2px 10px;
   316 }
   318 .page_head .actions,
   319 .page_head .unit_head .content,
   320 .page_head .area_head .content,
   321 .issue .content,
   322 .initiative_head .content,
   323 .area_list .unit_head .content,
   324 .area_list .area .content {
   325   padding: 10px 10px 0 10px;
   326 }
   328 .page_head .actions:last-child,
   329 .page_head .unit_head .content:last-child,
   330 .page_head .area_head .content:last-child,
   331 .issue .content:last-child,
   332 .initiative_head .content:last-child,
   333 .area_list .unit_head .content:last-child,
   334 .area_list .area .content:last-child {
   335   padding: 10px 10px 10px 10px;
   336 }
   338 .page_head .initiative_list,
   339 .issue .initiative_list {
   340   padding-left: 8px;
   341 }
   343 .issue .content.actions {
   344   margin-bottom: 1ex;
   345 }
   349 .page_head .title,
   350 .issue .title,
   351 .initiative_head .title,
   352 .area_list .unit_head .unit_name,
   353 .area_list .area_name {
   354   font-weight: bold;
   355   font-size: 120%;
   356 }
   358 .page_head .unit_head .title .extra,
   359 .page_head .area_head .title .extra,
   360 .issue .title .extra {
   361   margin-left: 0.7em;
   362   font-size: 75%;
   363 }
   365 .page_head .unit_head .content,
   366 .page_head .area_head .content,
   367 .page_head .area_head .content a,
   368 .page_head .issue .content.actions,
   369 .page_head .issue .content.actions a,
   370 .issues .issue .content.actions,
   371 .issues .issue .content.actions a,
   372 .area_list .area .content,
   373 .area_list .area .content a {
   374   color: #000;
   375 }
   377 x.page_head .unit_head .title,
   378 x.page_head .area_head .title,
   379 x.issue .title {
   380   background-color: #eee;
   381   background-image: linear-gradient(top, #eee 0%, #f7f7f7 10%, #fff 100%);
   382   background-image: -o-linear-gradient(top, #eee 0%, #f7f7f7 10%, #fff 100%);
   383   background-image: -moz-linear-gradient(top, #eee 0%, #f7f7f7 10%, #fff 100%);
   384   background-image: -webkit-linear-gradient(top, #eee 0%, #f7f7f7 10%, #fff 100%);
   385   background-image: -ms-linear-gradient(top, #eee 0%, #f7f7f7 10%, #fff 100%);
   386 }
   387 /*
   388 .unit_head {
   389   background-color: #cdf;
   390   background-image: -webkit-linear-gradient(top, #abf 0%, #cdf 20%, #f0f7ff 100%);
   391 }
   393 .area_head {
   394   background-color: #def;
   395   background-image: -webkit-linear-gradient(top, #bef 0%, #def 20%, #f7faff 100%);
   396 }
   398 .issue {
   399   background-color: #f0f7ff;
   400   background-image: -webkit-linear-gradient(top, #f0faff 0%, #f0f7ff 20%, #fff 100%);
   401 }
   402 */
   403 .issue .initiative_list {
   404   background: #fff;
   405 }
   407 x {
   408   background-image: linear-gradient(top, #eee 0%, #f7f7f7 10%, #fff 100%);
   409   background-image: -o-linear-gradient(top, #eee 0%, #f7f7f7 10%, #fff 100%);
   410   background-image: -moz-linear-gradient(top, #eee 0%, #f7f7f7 10%, #fff 100%);
   411   background-image: -webkit-linear-gradient(top, #dde 0%, #d7d7e7 10%, #fff 100%);
   412   background-image: -ms-linear-gradient(top, #eee 0%, #f7f7f7 10%, #fff 100%);
   413 }
   415 .page_head .area_head .title,
   416 .page_head .issue .title {
   417   border-top: 1px solid #ddd;
   418 }
   421 .delegation_info {
   422   float: right;
   423   text-decoration: none;
   424   padding: 5px;
   425   border-radius: 0px 5px 0px 5px;
   426 }
   428 .delegation_arrow {
   429   vertical-align: middle;
   430 }
   432 .delegation_info .link {
   433   text-decoration: underline;
   434   color: #aaa;
   435 }
   437 .delegation_info:hover {
   438   background-color: #ddd;
   439 }
   441 .delegation_info .micro_avatar {
   442   border: 2px solid #fff;
   443 }
   445 .delegation_info .micro_avatar.highlighted {
   446   border: 2px solid #fa0;
   447 }
   450 .member_list .member_image_avatar {
   451   float: left;
   452   margin-right: 0.5em;
   453 }
   455 .micro_avatar {
   456   height: 24px;
   457   border-radius: 4px;
   458   vertical-align: middle;
   459 }
   461 .logo { 
   462   float: right;
   463   margin-right: 1%;
   464 }
   467 .member_image_photo {
   468   border-radius: 8px;
   469 }
   471 /*************************************************************************
   472  * Main content
   473  */
   475 .main {
   476   margin-left: 1%;
   477   margin-right: 1%;
   478 }
   480 /*************************************************************************
   481  * ui.tab
   482  */
   483 .ui_tabs {
   484   margin: 20px 0px;
   485 }
   487 .ui_tabs_links a {
   488   padding: 1ex 1em;
   489   line-height: 300%;
   490   background-color: #f7f7f7;
   491   background-color: #444;
   492   background-image: -webkit-linear-gradient(top, #000 0%, #444 70%, #777 90%, #888 100%);
   493   color: #fff;
   494   white-space: nowrap;
   495   border-radius: 5px;
   496   margin-right: 2px;
   497   font-weight: bold;
   498 }
   500 .ui_tabs_links a:hover {
   501   box-shadow: 0px 0px 5px 0px #fc0;
   502   text-decoration: none;
   503 }
   505 .ui_tabs_links a.selected {
   506   box-shadow: 0px 0px 3px 3px #fc0;
   507   text-decoration: none;
   508 }
   511 /*************************************************************************
   512  * ui.filters
   513  */
   515 .ui_filter {
   516   overflow: auto;
   517   margin: 2ex 0;
   518 }
   520 .ui_filter_head {
   521   color: #777;
   522   font-size: 90%;
   523   float: left;
   524   line-height: 200%;
   525   margin-right: 2em;
   526 }
   528 .ui_filter a {
   529   font-weight: bold;
   530   margin-right: 0.5em;
   531 }
   534 .ui_filter_head a.active {
   535   text-decoration: none;
   536   background-color: #555;
   537   color: #fff;
   538   padding: 0.5ex 0.5em;
   539   border-radius: 4px;
   540 }
   542 /*************************************************************************
   543  * ui.paginate
   544  */
   546 .ui_paginate_head {
   547   display: none;
   548   margin-bottom: 1ex;
   549 }
   551 .ui_paginate_foot {
   552   margin-top: 1ex;
   553 }
   555 .ui_paginate_select a {
   556   padding: 0.5em;
   557 }
   559 /*************************************************************************
   560  * ui.bargraph
   561  */
   563 .bargraph {
   564   width: 103px;
   565 }
   567 .bargraph50 {
   568   width: 52px;
   569 }
   571 .bargraph div {
   572   float: left;
   573   margin-top: 0.5ex;
   574   height: 1.3ex;
   575 }
   577 .bargraph .quorum {
   578   margin-top: 0.2ex;
   579   height: 1.9ex;
   580 }
   582 /*************************************************************************
   583  * notifications
   584  */
   586 div.notifications {
   587   margin-top: 1ex;
   588   background-color: #fdd;
   589   padding: 0.5ex;
   590   border: 1px solid #fbb;
   591 }
   593 .notifications ul {
   594   margin: 0;
   595   padding: 0;
   596   margin-left: 2em;
   597 }
   599 .notifications li {
   600   margin: 0;
   601   padding: 0;
   602   margin-top: 0.5ex;
   603 }
   605 /*************************************************************************
   606  * vertical ui.form
   607  */
   609 .vertical {
   610   margin-top: 2ex;
   611 }
   613 .login input[type=text],
   614 .vertical input[type=text],
   615 .login input[type=password],
   616 .vertical input[type=password],
   617 .vertical textarea,
   618 .vertical select {
   619   font-family: sans-serif;
   620   font-size: 100%;
   621   width: 69%;
   622   border: 1px solid #444;
   623   padding: 0.2ex 0.2em 0.2ex 0.2em;
   624   margin-bottom: 1ex;
   625 }
   629 .login input[type=password],
   630 .vertical input[type=password] {
   631   width: 16em;
   632 }
   634 .vertical select {
   635   padding-right: 0;
   636 }
   638 .login .ui_field_label,
   639 .vertical .ui_field_label {
   640   text-transform: uppercase;
   641   font-size: 70%;
   642   line-height: 120%;
   643   font-weight: bold;
   644   color: #777;
   645   width: 29%;
   646   display: block;
   647   float: left;
   648   clear: left;
   649   text-align: right;
   650   padding-right: 0.5em;
   651 }
   653 .ui_field_label.label_right {
   654   text-align: left;
   655   width: auto;
   656 }
   658 .login input[type=text],
   659 .login input[type=password] {
   660   width: 10em;
   661 }
   663 .login div,
   664 .vertical div {
   665   clear: left;
   666 }
   668 .vertical span {
   669   display: block;
   670   margin-bottom: 0.5ex;
   671 }
   673 .vertical span:after {
   674   content: " ";
   675 }
   677 .vertical span span {
   678   display: inline;
   679   margin-bottom: 0;
   680 }
   682 .login input[type=submit],
   683 .vertical input[type=submit] {
   684   font-size: 100%;
   685   margin-left: 29%;
   686   background-color: #444444;
   687   color: #fff;
   688   border: none;
   689   padding: 0.75ex;
   690 }
   692 .login input[type=submit]:hover,
   693 .vertical input[type=submit]:hover {
   694   background-color: #444444;
   695 }
   697 @media screen and (max-width: 480px) {
   698   .login input[type=text],
   699   .vertical input[type=text],
   700   .login input[type=password],
   701   .vertical input[type=password],
   702   .vertical textarea,
   703   .vertical select,
   704   .vertical input[type=submit],
   705   .login input[type=submit] {
   706     width: 98%;
   707   }
   708   .login .ui_field_label,
   709   .vertical .ui_field_label {
   710     text-align: left;
   711     width: 98%;
   712   }
   713   .login input[type=text],
   714   .login input[type=password] {
   715     width: 98%;
   716   }
   717   .login input[type=submit],
   718   .vertical input[type=submit] {
   719     margin-left: 0;
   720   }
   721 }
   724 /*************************************************************************
   725  * Positive / Negtive votes
   726  */
   729 .positive_votes span {
   730   display: inline;
   731 }
   733 .positive_votes {
   734   display: inline;
   735   background-color: #cfc;
   736   padding: 0.3ex 0.5em 0.3ex 0.5em;
   737 }
   739 .negative_votes span {
   740   display: inline;
   741 }
   743 .negative_votes {
   744   display: inline;
   745   background-color: #fcc;
   746   padding: 0.3ex 0.5em 0.3ex 0.5em;
   747 }
   749 .suggestion_my_opinion a,
   750 .suggestion_my_opinion span {
   751   white-space: nowrap;
   752   padding-left: 0.2ex !important;
   753   padding-right: 0.2ex !important;
   754 }
   756 .active {
   757   background-color: #444;
   758   color: #fff;
   759 }
   761 .active_red2 { background-color: #a00; color: #fff !important; }
   762 .active_red1 { background-color: #f88; color: #000 !important; }
   763 .active_green1 { background-color: #8f8; color: #000 !important; }
   764 .active_green2 { background-color: #0a0; color: #000 !important; }
   768 /*************************************************************************
   769  * Unit list
   770  */
   772 .unit_list a {
   773   font-weight: bold;
   774 }
   776 /*************************************************************************
   777  * Area list
   778  */
   779 .area_list {
   780   border: 1px solid #aaa;
   781   border-radius: 8px;
   782   margin-top: 2ex;
   783 }
   785 .area_list .unit_head,
   786 .area_list .area {
   787   border-bottom: 1px solid #aaa;
   788 }
   790 .area_list .unit_head {
   791   border-radius: 8px 8px 0 0;
   792 }
   794 .area_list .area:last-child {
   795   border-radius: 0 0 8px 8px;
   796 }
   798 .area_list .area:first-child {
   799   border-radius: 8px 8px 0 0;
   800 }
   803 /*************************************************************************
   804  * Events
   805  */
   807 .events .date {
   808   font-size: 150%;
   809   font-weight: bold;
   810   margin-top: 2ex;
   811   line-height: 150%;
   812 }
   814 .event_list .event div {
   815 }
   817 .event_list .event .member_id {
   818   float: right;
   819 }
   822 /*************************************************************************
   823  * Issues
   824  */
   826 .issues {
   827   clear: left;
   828   margin-top: 2ex;
   829 }
   831 .issues .issue {
   832   overflow: hidden;
   833   border: 1px solid #ddd;
   834   border-radius: 8px;
   835   margin-bottom: 2ex;
   836 }
   838 .issue.interested,
   839 .issue.interest_by_delegation {
   840   border: 1px solid #b2cdff;
   841 }
   843 .issue .issue_info {
   844   padding: 1ex 1ex 0.3ex 1ex;
   845   line-height: 140%;
   846   margin-bottom: 1ex;
   847 }
   849 .event_list .event .issue_id,
   850 .issue .issue_info .issue_id {
   851   font-size: 125%;
   852 }
   854 .issue .suggestion {
   855   margin-left: 1ex;
   856   margin-bottom: 1ex;
   857   font-weight: bold;
   858 }
   860 .issue_policy_info {
   861   font-style: italic;
   862 }
   864 .issue_policy_info .event_name {
   865   font-weight: bold;
   866 }
   868 .issue_policy_info img {
   869   vertical-align: middle;
   870 }
   872 .issue .interest_by_delegation {
   873   float: right;
   874 }
   876 .issue .initiative_list a.highlighted {
   877   font-weight: bold;
   878 }
   880 .initiative {
   881   margin-left: 1ex;
   882   margin-bottom: 1ex;
   883   line-height: 50%;
   884 }
   886 .initiative .bar {
   887   margin-right: 0.3em;
   888 }
   890 .initiative .rank,
   891 .initiative .bar,
   892 .initiative .interest {
   893   float: left; 
   894   margin-right: 0.3em;
   895 }
   897 .initiative .rank {
   898   width: 2.5em;
   899 }
   902 .initiative .interest {
   903   width: 20px;
   904   height: 16px;
   905   line-height: 100%;
   906 }
   908 .initiative .name {
   909   line-height: 130%;
   910   margin-left: 160px;
   911 }
   913 @media screen and (max-width: 480px) {
   914   .initiative .name {
   915     clear: left;
   916     margin-left: 0px;
   917   }
   918 }
   921 .issue_initiative_list a {
   922   font-weight: bold;
   923 }
   925 .more_initiatives_link {
   926   display: block;
   927   margin-left: 166px;
   928   font-style: italic;
   929   margin-bottom: 1ex;
   930 }
   932 .issue tr tr {
   933   border: none;
   934   background: none;
   935 }
   937 .initiative_link.selected {
   938   font-weight: bold;
   939 }
   941 x.initiative_link.supported {
   942   background-color: #cdf;
   943   border-radius: 5px;
   944 }
   946 x.initiative_link.potentially_supported {
   947   background-color: #cdf;
   948   border-radius: 5px;
   949 }
   951 .lang_chooser {
   952   float: right;
   953   margin-right: 0.5em;
   954 }
   956 .delegation_list_entry {
   957   margin-right: 2em;
   958   margin-bottom: 2ex;
   959   float: left;
   960   clear: left;
   961 }
   963 .delegation_list_entry .delegation_arrow {
   964   float: left;
   965 }
   967 .delegation_list_entry .delegation_scope {
   968   float: left;
   969   width: 25em;
   970 }
   972 .delegation_list_entry .delegation_scope a {
   973   display: block;
   974 }
   976 .member_list .member_thumb {
   977   float: left;
   978   margin-right: 1em;
   979   margin-bottom: 2ex;
   980 }
   982 .member_thumb {
   983   text-decoration: none;
   984   width: 14.5em;
   985   height: 48px;
   986   display: block;
   987   float: left;
   988   background-color: #f2f2f2;
   989   overflow: hidden;
   990   position: relative;
   991   border-radius: 7px;
   992   padding: 2px;
   993 }
   995 .member_thumb a:hover div {
   996   background-color: #444;
   997   color: #fff;
   998 }
  1000 .member_thumb img {
  1001   padding: 0;
  1002   margin: 0;
  1003   vertical-align: bottom;
  1004   border-radius: 7px;
  1005 }
  1007 .member_thumb .member_name {
  1008   position: absolute;
  1009   left: 56px;
  1010   top: 2ex;
  1011   font-size: 100%;
  1012   width: 14em;
  1013 }
  1015 .member_thumb .flags {
  1016   float: right;
  1017   font-size: 75%;
  1018 }
  1020 .member_thumb .flags a,
  1021 .member_thumb .flags img {
  1022   position: static;
  1023   float: right;
  1024   margin-left: 0.5em;
  1025 }
  1027 .member_thumb .flags .in_delegation_chain {
  1028   font-weight: bold;
  1029 }
  1031 .member .right {
  1032   float: right;
  1033 }
  1035 .member_thumb.not_accepted,
  1036 .member_thumb.not_informed {
  1037   background: #fff;
  1038 }
  1040 .member_thumb.not_accepted .member_image,
  1041 .member_thumb.not_accepted .member_name,
  1042 .member_thumb.not_informed .member_image,
  1043 .member_thumb.not_informed .member_name {
  1044   opacity: 0.4;
  1045 }
  1047 .member_thumb {
  1048   border: 2px solid #fff;
  1049 }
  1051 .member_thumb.in_delegation_chain {
  1052   border: 2px solid #fa0;
  1053 }
  1055 .member_statement,
  1056 .draft_content,
  1057 .suggestion_content {
  1058   background-color: #f2f2f2;
  1059   padding: 1ex;
  1060   border-radius: 8px;
  1061 }
  1063 .member_statement {
  1064   margin-right: 250px;
  1065 }
  1067 #suggestion_description {
  1068   height: 15ex;
  1069 }
  1071 .diff {
  1072   background-color: #f2f2f2;
  1073   border: 1px solid #ccc;
  1074   padding: 1ex;
  1075 }
  1077 .diff_added {
  1078   background-color: #cfc;
  1079   text-decoration: underline;
  1080 }
  1082 .diff_removed {
  1083   background-color: #fcc;
  1084   text-decoration: line-through;
  1085 }
  1087 .slot_issue_info {
  1088   background-color: #f2f2f2;
  1089   border: 1px solid #ccc;
  1090   float: right;
  1091   padding: 0.5ex;
  1092   line-height: 130%;
  1093   margin-right: 1em;
  1094 }
  1096 .issue_info label {
  1097   float: left;
  1098   width: 8em;
  1099   text-transform: uppercase;
  1100   font-size: 70%;
  1101   color: #777;
  1102   font-weight: bold;
  1103   clear: left;
  1104   text-align: right;
  1105   margin-right: 0.7em;
  1106 }
  1108 .admitted_info {
  1109   background-color: #dfd;
  1110   padding: 1ex;
  1111   border-radius: 8px;
  1112 }
  1114 .not_admitted_info,
  1115 .revoked_info {
  1116   background-color: #fdd;
  1117   padding: 1ex;
  1118   border-radius: 8px;
  1119 }
  1121 .draft_updated_info,
  1122 .voting_active_info,
  1123 .initiator_invite_info,
  1124 .motd,
  1125 .public_access_issue_head {
  1126   background-color: #fffbce;
  1127   padding: 1ex;
  1128   margin-top: 1ex;
  1129   margin-bottom: 2ex;
  1130   border-top: 1px solid #ffe900;
  1131   border-bottom: 1px solid #ffe900;
  1132 }
  1134 .suggestion_fulfilled {
  1135   width: 15em;
  1136 }
  1137 .suggestion_fulfilled a.action {
  1138   padding-left: 0;
  1139   line-height: 120%;
  1140 }
  1142 .help,
  1143 .use_terms {
  1144   border-radius: 8px;
  1145   border: 1px solid #ffe900;
  1146   background-color: #fffbce;
  1147   color: #000;
  1148   padding: 1ex;
  1149 }
  1151 .help_visible {
  1152   margin-top: 2ex;
  1153   margin-bottom: 1ex;
  1154 }
  1156 .help_visible .help_icon {
  1157   float: right;
  1158 }
  1160 .slot_help_hidden {
  1161   float: left;
  1162   margin-top: 1ex;
  1163 }
  1165 .help_actions {
  1166   font-size: 75%;
  1167   float: right;
  1168 }
  1170 .help_actions a {
  1171   margin-right: 1em;
  1172   color: #468;
  1173 }
  1175 .wiki {
  1176   line-height: 133%;
  1177 }
  1179 .wiki h1,
  1180 .wiki h2,
  1181 .wiki h3,
  1182 .wiki h4 {
  1183   margin-top: 1ex;
  1184   margin-bottom: 1ex;
  1185 }
  1187 .wiki h1 {
  1188   font-size: 150%;
  1189   font-weight: bold;
  1190 }
  1192 .wiki h2 {
  1193   font-size: 125%;
  1194   font-weight: bold;
  1195 }
  1197 .wiki h3 {
  1198   font-size: 125%;
  1199 }
  1201 .wiki h4 {
  1202   font-size: 100%;
  1203   font-weight: bold;
  1204 }
  1206 .wiki p {
  1207   margin-top: 1ex;
  1208   margin-bottom: 1ex;
  1209 }
  1211 form .warning {
  1212   background-color: #ffd;
  1213   color: #000;
  1214   border: 1px solid #dda;
  1215   margin: 1ex;
  1216   margin-bottom: 2ex;
  1217   padding: 1ex;
  1218 }
  1220 a.not_voted {
  1221   display: block;
  1222   background-color: #fec;
  1223   color: #000;
  1224 }
  1226 .action_active {
  1227   background-color: #fec;
  1228 }
  1230 .heading {
  1231   display: block;
  1232   font-size: 120%;
  1233   font-weight: bold;
  1234 }
  1236 .heading.first {
  1237   margin-top: 0;
  1238 }
  1240 .menu_list li {
  1241   padding-top: 1ex;
  1242   padding-bottom: 1ex;
  1243 }
  1245 .deactivated_member_info {
  1246   background-color: #a00;
  1247   color: #fff;
  1248 }
  1250 /*************************************************************************
  1251  * Voting
  1252  */
  1254 #voting_form {
  1255   margin-top: 20px;
  1256 }
  1258 #voting {
  1259   position: relative;
  1260 }
  1262 #voting .approval, .abstention, .disapproval {
  1263   border: 2px black solid;
  1264   margin-top:   2ex;
  1265   margin-bottom: 5ex;
  1266   padding: 1ex;
  1267   padding-bottom: 2ex;
  1268   border-radius: 8px;
  1269 }
  1270 #voting .approval {
  1271   background-color: #9f9;
  1272 }
  1273 #voting .approval .movable {
  1274   background-color: #dfd;
  1275 }
  1276 #voting .abstention {
  1277   background-color: #ccc;
  1278 }
  1279 #voting .abstention .movable {
  1280   background-color: #f2f2f2;
  1281 }
  1282 #voting .disapproval {
  1283   background-color: #f88;
  1284 }
  1285 #voting .disapproval .movable {
  1286   background-color: #fbb;
  1287 }
  1288 #voting .cathead {
  1289   font-weight: bold;
  1290 }
  1291 #voting .movable {
  1292   position: relative;
  1293   border: 1px black solid;
  1294   margin-top: 1ex;
  1295   padding: 0.5ex;
  1296   border-radius: 8px;
  1297 }
  1298 #voting .voting_form_active .movable {
  1299   cursor: pointer;
  1300 }
  1301 #voting .voting_form_active .clickable {
  1302   cursor: auto;
  1303 }
  1304 #voting .voting_form_active a.clickable {
  1305   cursor: pointer;
  1306 }
  1308 #voting .movable {
  1309   vertical-align: middle;
  1310   cursor: move;
  1311 }
  1313 /*************************************************************************
  1314  * timeline
  1315  */
  1316 div.ignore_area_list {
  1317   float: left; 
  1318   width: 90%; 
  1319   margin: 0 0 1em 0;
  1320 }
  1322 div.ignore_area_list > 
  1323 label.ui_field_label {
  1324   text-align: left ;
  1325   width: 100%;
  1326   border-bottom:1px solid #000000;
  1327   color: #000000;
  1328   font-size:75%;
  1329   font-weight:bold;
  1330   vertical-align:bottom;
  1331   text-transform:none;
  1332   padding:0.5ex 0.5em
  1333 }
  1335 div.ignore_area_item {
  1336   clear: none;
  1337   float: left; 
  1338   min-width: 10em;
  1339   margin: 0.1ex 0.5em;
  1340   margin-right: 0.5em;
  1341 }
  1343 div.ignore_area_item > input {
  1344   float: none;
  1345   clear: none;
  1346   display: inline;
  1347 }
  1349 div.ignore_area_item >
  1350 label.ui_field_label {
  1351   float: none;
  1352   clear: none;
  1353   text-align: left;
  1354   display: inline;
  1355 }
  1357 div.timeline_results {
  1358   clear: both;
  1359 }
  1361 /* shadows */
  1363 .initiative_head,
  1364 .box,
  1365 div.notifications {
  1366   border-radius: 8px;
  1367 }
  1369 .initiative_head,
  1370 .box {
  1371   border: 1px solid #aaa;
  1372 }
  1374 .box {
  1375   padding: 1ex;
  1376 }
  1378 .slot_head,
  1379 .area_list,
  1380 .initiative_head,
  1381 .issues .issue,
  1382 .ui_tabs_links a,
  1383 .draft_content,
  1384 .help,
  1385 .use_terms,
  1386 .motd,
  1387 .vote_info .content,
  1388 .box,
  1389 div.notifications {
  1390   box-shadow: #777 0px 5px 5px -5px;
  1391   -mox-box-shadow: #777 0px 5px 5px -5px;
  1392   -webkit-box-shadow: #ddd 3px 3px 3px -1px;
  1393   clear: both;
  1394 }
  1396 .slot_footer {
  1397   margin: 0 1%;
  1398   border-top: 1px solid #ccc;
  1399   padding: 1ex;
  1400   font-size: 80%;
  1401   text-align: center;
  1402 }
  1403 .slot_footer,
  1404 .slot_footer a {
  1405   color: #666;
  1406 }
  1408 .footer {
  1409   margin: 0 auto;
  1410   max-width: 1130px;
  1411 }
