app/assets/stylesheets/peta.common.css

   1 @charset "UTF-8";\r
   2 \r
   3 /*\r
   4  * pettanR\r
   5  * \r
   6  *   common.css\r
   7  * \r
   8  *   version 0.4.23\r
   9  *\r
  10  */\r
  11 \r
  12 \r
  13 /*  dl table\r
  14 --------------------------------------------------------------------------------------*/\r
  15         .dl-table dt,\r
  16         .dl-table-small dt {\r
  17                 float:                  left;\r
  18                 height:                 1.6em;\r
  19                 line-height:    1.6em;\r
  20                 overflow:               hidden;\r
  21                 margin:                 0;\r
  22                 padding:                0 0 0 0.2em;\r
  23         }\r
  24         .dl-table dd,\r
  25         .dl-table-small dd {\r
  26                 margin:                 0 0 0.5em;\r
  27                 line-height:    1.6em;\r
  28                 border-bottom:  1px solid #ccc;\r
  29         }\r
  30         .dl-table dt {\r
  31                 width:                  180px;\r
  32         }\r
  33         .dl-table dd {\r
  34                 padding:                0 0 0 200px;\r
  35         }\r
  36         .dl-table-small dt {\r
  37                 width:                  140px;\r
  38         }\r
  39         .dl-table-small dd {\r
  40                 padding:                0 0 0 160px;\r
  41         }\r
  42 \r
  43 /*  Reversible Image\r
  44 --------------------------------------------------------------------------------------*/        \r
  45         img.img-flip-v { /* 上下反転 */\r
  46                 transform:                              scale( 1, -1);\r
  47                 -o-transform:                   scale( 1, -1);\r
  48                 -ms-transform:                  scale( 1, -1);\r
  49                 -moz-transform:                 scale( 1, -1);\r
  50                 -webkit-transform:              scale( 1, -1);\r
  51         }\r
  52         .pettanr-ActiveX-enabled img.img-flip-v {\r
  53                 filter:                                 flipv();\r
  54                 -ms-filter:                             flipv();                \r
  55         }\r
  56         v\:image.img-flip-v {\r
  57                 flip:                                   y; /* vml */\r
  58         } \r
  59         \r
  60         img.img-flip-h { /* 左右反転 */\r
  61                 transform:                              scale( -1, 1);\r
  62                 -o-transform:                   scale( -1, 1);\r
  63                 -ms-transform:                  scale( -1, 1);\r
  64                 -moz-transform:                 scale( -1, 1);\r
  65                 -webkit-transform:              scale( -1, 1);\r
  66         }\r
  67         .pettanr-ActiveX-enabled img.img-flip-h {\r
  68                 filter:                                 fliph();\r
  69                 -ms-filter:                             fliph();\r
  70         }\r
  71         v\:image.img-flip-h {\r
  72                 flip:                                   x; /* vml */\r
  73         }\r
  74         \r
  75         img.img-flip-vh { /* 上下左右反転 */\r
  76                 transform:                              scale( -1, -1);\r
  77                 -o-transform:                   rotate(180deg);\r
  78                 -ms-transform:                  scale( -1, -1);\r
  79                 -moz-transform:                 scale( -1, -1);\r
  80                 -webkit-transform:              scale( -1, -1);\r
  81         }\r
  82         .pettanr-ActiveX-enabled img.img-flip-vh {\r
  83                 filter:                                 flipv() fliph();\r
  84                 -ms-filter:                             flipv() fliph();\r
  85         }\r
  86         v\:image.img-flip-vh {\r
  87                 rotation :                              180; /* vml */\r
  88         }\r
  89 \r
  90 /*  PettanR Comic\r
  91 --------------------------------------------------------------------------------------*/\r
  92 .pettanr-comic-wrapper {\r
  93         margin:                                 1em auto;\r
  94 }\r
  95         .pettanr-comic-panel {\r
  96                 border-style:                   solid;\r
  97                 border-color:                   #111;\r
  98                 position:                               relative;\r
  99                 margin:                                 1em auto;\r
 100                 overflow:                               hidden;\r
 101         }\r
 102                 .pettanr-comic-panel img,\r
 103                 .pettanr-comic-panel .reversible-image-container {\r
 104                         position:                               absolute;\r
 105                 }\r
 106                 .pettanr-comic-balloon {\r
 107                         position:                               absolute;\r
 108                 }\r
 109                         .pettanr-comic-panel .reversible-image-container img,\r
 110                         .pettanr-comic-balloon img {\r
 111                                 width:                                  100%;\r
 112                                 height:                                 100%;                           \r
 113                         }\r
 114                         .pettanr-comic-balloon p {\r
 115                                 margin:                                 0 !important;\r
 116                                 padding:                                0 !important;                           \r
 117                                 display:                                table;\r
 118                                 position:                               absolute;\r
 119                                 top:                                    0;\r
 120                                 left:                                   16.6%;\r
 121                                 width:                                  66.6%;\r
 122                                 height:                                 100%;\r
 123                                 *height:                                auto;\r
 124                                 *top:                                   50% !important;\r
 125                         }\r
 126                                 .pettanr-comic-balloon p span,\r
 127                                 .pettanr-comic-balloon p strong,\r
 128                                 .pettanr-comic-balloon p em,\r
 129                                 .pettanr-comic-balloon p i,\r
 130                                 .pettanr-comic-balloon p samp,\r
 131                                 .pettanr-comic-balloon p code {\r
 132                                         vertical-align:                 middle;\r
 133                                         text-align:                             center;\r
 134                                         font-size:                              14px; /* opera6 で使用 13px は不可 */\r
 135                                         display:                                table-cell;\r
 136                                         *display:                               block;\r
 137                                         zoom:                                   1;\r
 138                                         *position:                              relative;\r
 139                                         *top:                                   -50%;\r
 140                                 }\r
 141                                 .pettanr-comic-balloon p strong {\r
 142                                         font-weight:                    bold;\r
 143                                 }\r
 144                                 .pettanr-comic-balloon p em,\r
 145                                 .pettanr-comic-balloon p i {\r
 146                                         font-style:                             italic;\r
 147                                 }\r
 148                                 .pettanr-comic-balloon p samp,\r
 149                                 .pettanr-comic-balloon p code {\r
 150                                         font-family:                    monospace;\r
 151                                 }