doc/manuals/scripts/style.css

   1 body, html {
   2     background: #f5f5f5;
   3     color: #333;
   4     text-align: center;
   5     font-family: sans-serif;
   6     font-size: 0.9em;
   7     width: 100%;
   8     height: 100%;
   9     margin: 0;
  10     padding : 0;
  11 }
  12 a {
  13     color: #06b;
  14     font-weight: bold;
  15     text-decoration: none;
  16 }
  17 a:hover {
  18     text-decoration: underline;
  19 }
  20 img {
  21     border: none;
  22 }
  23 h1 {
  24 /*    color: #D5F16A;*/
  25     color: #ddd;
  26     font-size: 4em;
  27     line-height: 1.3em;
  28     font-weight: normal;
  29     letter-spacing: -0.08em;
  30 /*    background: url(../images/style_p.png) transparent;*/
  31     text-align: right;
  32     margin: 20px;
  33 /*    border-bottom: 1px dotted #fff;*/
  34     text-shadow: 0px -1px rgba(0,0,0,0.01);
  35     -moz-border-radius: 12px;
  36     -webkit-border-radius: 12px;
  37     border-radius: 12px;
  38 }
  39 h2, h3 {
  40     color: #3C4858;
  41     font-size: 23px;
  42     letter-spacing: -0.08em;
  43     font-weight: normal;
  44     text-shadow: 0px 1px white;
  45     padding: 5px 0 10px 10px;
  46 }
  47 h3 {
  48 /*    border-bottom: 1px dotted #fff;*/
  49 }
  50 p, ul {
  51     background: #f9f9f9;
  52     margin: 0 0 15px;
  53     padding: 10px;
  54     -moz-border-radius: 12px;
  55     -webkit-border-radius: 12px;
  56     border-radius: 12px;
  57 /*
  58     -moz-box-shadow:    0 2px 5px #1f1f1f;
  59     -webkit-box-shadow: 0 2px 5px #1f1f1f;
  60     box-shadow:         0 2px 5px #1f1f1f;
  61 */
  62 }
  63 ul ul {
  64     border: none;
  65     -moz-box-shadow:    none;
  66     -webkit-box-shadow: none;
  67     box-shadow:         none;
  68     margin: 0;
  69 }
  70 li {
  71     padding: 0;
  72     margin: 20;
  73 }
  74 strong {
  75     color: #333;
  76 /*
  77     color: #D5F16A;
  78 */
  79 /*    color: black;*/
  80 }
  81
  82 .wrapper {
  83     clear: both;
  84     min-width: 600px;
  85     max-width: 1280px;
  86     margin: auto;
  87     text-align: left;
  88     padding: 0 30px 30px 80px;
  89 }
  90 .footer {
  91     padding-bottom: 20px;
  92     clear: both;
  93 }
  94 .footer a {
  95     font-weight: normal;
  96     color: #666;
  97     display: block;
  98     float: right;
  99     margin: 5px;
 100     padding: 3px 12px;
 101     background: rgb(238,238,238); /* Old browsers */
 102     background: -moz-linear-gradient(top, rgba(238,238,238,1) 0%, rgba(204,204,204,1) 100%); /* FF3.6+ */
 103     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(238,238,238,1)), color-stop(100%,rgba(204,204,204,1))); /* Chrome,Safari4+ */
 104     background: -webkit-linear-gradient(top, rgba(238,238,238,1) 0%,rgba(204,204,204,1) 100%); /* Chrome10+,Safari5.1+ */
 105     background: -o-linear-gradient(top, rgba(238,238,238,1) 0%,rgba(204,204,204,1) 100%); /* Opera 11.10+ */
 106     background: -ms-linear-gradient(top, rgba(238,238,238,1) 0%,rgba(204,204,204,1) 100%); /* IE10+ */
 107     background: linear-gradient(to bottom, rgba(238,238,238,1) 0%,rgba(204,204,204,1) 100%); /* W3C */
 108     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#cccccc',GradientType=0 ); /* IE6-9 */
 109     -moz-border-radius: 5px;
 110     -webkit-border-radius: 5px;
 111     border-radius: 5px;
 112 }
 113 .footer a:hover {
 114     color: white;
 115     text-decoration: none;
 116     -moz-box-shadow:    0 2px 4px rgba(0,0,0,0.25);
 117     -webkit-box-shadow: 0 2px 4px rgba(0,0,0,0.25);
 118     box-shadow:         0 2px 4px rgba(0,0,0,0.25);
 119
 120 }
 121
 122 .thumbnail {
 123     width: 42%;
 124     float: right;
 125     margin: 10px;
 126 /*    border: 2px solid black;*/
 127 /*    border-top: 12px solid black;*/
 128     -moz-box-shadow:    0 2px 5px rgba(0,0,0,0.4);
 129     -webkit-box-shadow: 0 2px 5px rgba(0,0,0,0.4);
 130     box-shadow:         0 2px 5px rgba(0,0,0,0.4);
 131
 132 }
 133
 134 .headerbg {
 135     background: #111;
 136     border-bottom: 1px solid #111;
 137     -moz-box-shadow:    0 3px 10px #111;
 138     -webkit-box-shadow: 0 3px 10px #111;
 139     box-shadow:         0 3px 10px #111;
 140 }
 141 .menu {
 142     width: 56px;
 143     min-height: 100%;
 144     position: fixed;
 145     left: 0;
 146     top: 0;
 147     background: #555;
 148     transition-property: padding-bottom;
 149     transition-duration: 0.3s;
 150     padding-bottom: 16px;
 151 }
 152 .menu.mover {
 153     padding-bottom: 0px;
 154 }
 155 .menu .micon {
 156     width: 50px;
 157     height: 50px;
 158     margin: 5px 2px 2px 2px;
 159     transition-property: all;
 160     transition-duration: 0.3s;
 161     background: #555;
 162     padding: 4px;
 163     -moz-border-radius: 4px !important;
 164     -webkit-border-radius: 4px !important;
 165     border-radius: 4px !important;
 166 }
 167 .menu .micon:hover {
 168     width: 66px;
 169     height: 66px;
 170     margin-left: -2px;
 171 }
 172 .menu span {
 173     font-size: 0;
 174     color: white;
 175     padding: 0 0 5px 0;
 176     font-size: 8.5px;
 177     line-height: 8.5px;
 178     letter-spacing: -0.09em;
 179 }
 180 .menu .submenu {
 181     z-index: 1000000;
 182     margin: 0;
 183     padding: 0;
 184     list-style: none;
 185     position: absolute;
 186     display: none;
 187     opacity: 0;
 188     background: #555;
 189     color: #fff;
 190     border: none;
 191     -moz-box-shadow:    none;
 192     -webkit-box-shadow: none;
 193     box-shadow:         none;
 194     left: 75px;
 195     -moz-border-radius: 0px;
 196     -webkit-border-radius: 0px;
 197     border-radius: 0px;
 198     text-align: left;
 199     -moz-box-shadow:     0 2px 5px rgba(0,0,0,0.3);
 200     -webkit-box-shadow: 0 2px 5px rgba(0,0,0,0.3);
 201     box-shadow:         0 2px 5px rgba(0,0,0,0.3);
 202 }
 203
 204 .menu .submenu li {
 205     list-style: none;
 206     white-space: nowrap;
 207     margin: 0;
 208     padding: 0;
 209 }
 210 .menu .submenu li:hover {
 211     background:black;
 212 }
 213 .menu .submenu a {
 214     font-weight: normal;
 215     white-space: nowrap;
 216     display: block;
 217     padding: 4px 15px;
 218     color: white;
 219     transition-property: all;
 220     transition-duration: 0.3s;
 221 }
 222 .menu .submenu a:hover {
 223     color: #0097FF;
 224     background: #222;
 225     text-decoration: none;
 226 }
 227 .menu .submenu img {
 228     display: none;
 229     margin: 0;
 230 }
 231 .menu .submenu li .marrow {
 232     margin-left: -8px;
 233     position: absolute;
 234     display: block;
 235 }
 236 .menu .submenu li h3 {
 237     margin: 0px;
 238     font-weight: normal;
 239     font-size: 13px;
 240     border-bottom: 1px dotted #999;
 241     padding: 4px 15px;
 242     background: #333;
 243     color: white;
 244     text-shadow: none;
 245 }
 246 #index {
 247     -moz-border-radius: 12px;
 248     -webkit-border-radius: 12px;
 249     border-radius: 12px;
 250 }
 251 #index img.iicon {
 252     vertical-align: bottom;
 253     width: 75px;
 254     position: static;
 255     padding: 5px;
 256     margin-right: 10px;
 257     -moz-box-shadow:    none;
 258     -webkit-box-shadow: none;
 259     box-shadow:         none;
 260     -moz-border-radius: 6px;
 261     -webkit-border-radius: 6px;
 262     border-radius: 6px;
 263     background: #555;
 264     border: none;
 265 }
 266 #index h3 {
 267     font-size: 32px;
 268     line-height: 50px;
 269     font-weight: normal;
 270     padding: 25px 0 10px 0;
 271     clear: left;
 272     color: #555;
 273     text-shadow: none;
 274     margin: 0;
 275 }
 276
 277 #index ul {
 278     border: none;
 279     clear: left;
 280     background: none;
 281     margin: 0;
 282     padding: 0;
 283 }
 284 #index li {
 285     position: relative;
 286     display: block;
 287     width: 160px;
 288     height: 180px;
 289     margin: 8px;
 290     float: left;
 291     text-align: center;
 292 }
 293 #index li.inactive {
 294     opacity: 0.5;
 295     -webkit-filter: grayscale(1); -webkit-filter: grayscale(100%);
 296     filter: gray; filter: grayscale(100%);
 297 }
 298 #index a {
 299     display: block;
 300     text-align: center;
 301     font-weight: normal;
 302     position: relative;
 303     width: 160px;
 304     height: 180px;
 305     display: block;
 306     background: #fff;
 307     color: #666;
 308     -moz-border-radius: 6px;
 309     -webkit-border-radius: 6px;
 310     border-radius: 6px;
 311     font-size: 11px;
 312     opacity: 0.8;
 313     transition-property: all;
 314     transition-duration: 0.3s;
 315     line-height: 150px;
 316     border: 1px solid #ccc;
 317 }
 318 #index a:hover {
 319     -moz-box-shadow:    0 3px 5px rgba(0,0,0,0.2);
 320     -webkit-box-shadow: 0 3px 5px rgba(0,0,0,0.2);
 321     box-shadow:         0 3px 5px rgba(0,0,0,0.2);
 322     text-decoration: none;
 323     color: #333;
 324     opacity: 1;
 325 }
 326 #index img {
 327     text-align: center;
 328     width: 140px;
 329     vertical-align: middle;
 330     position:absolute;
 331     top:0;
 332     bottom:30px;
 333     margin:auto;
 334     left: 10px;
 335 }
 336 #index span {
 337     display: block;
 338     position: absolute;
 339     top: 150px !important;
 340     line-height: 30px;
 341     text-align: center;
 342     left: 0px;
 343     width: 160px;
 344     text-align: center;
 345     background: #ccc;
 346     -webkit-border-bottom-right-radius: 5px;
 347     -webkit-border-bottom-left-radius: 5px;
 348     -moz-border-radius-bottomright: 5px;
 349     -moz-border-radius-bottomleft: 5px;
 350     border-bottom-right-radius: 5px;
 351     border-bottom-left-radius: 5px;
 352     background: rgb(238,238,238); /* Old browsers */
 353     background: -moz-linear-gradient(top, rgba(238,238,238,1) 0%, rgba(204,204,204,1) 100%); /* FF3.6+ */
 354     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(238,238,238,1)), color-stop(100%,rgba(204,204,204,1))); /* Chrome,Safari4+ */
 355     background: -webkit-linear-gradient(top, rgba(238,238,238,1) 0%,rgba(204,204,204,1) 100%); /* Chrome10+,Safari5.1+ */
 356     background: -o-linear-gradient(top, rgba(238,238,238,1) 0%,rgba(204,204,204,1) 100%); /* Opera 11.10+ */
 357     background: -ms-linear-gradient(top, rgba(238,238,238,1) 0%,rgba(204,204,204,1) 100%); /* IE10+ */
 358     background: linear-gradient(to bottom, rgba(238,238,238,1) 0%,rgba(204,204,204,1) 100%); /* W3C */
 359     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#cccccc',GradientType=0 ); /* IE6-9 */
 360 }
 361
 362 #index li:hover {
 363
 364 }
 365
 366 .inactive {
 367     color: #bbb !important;
 368 }
 369
 370 .developers li {
 371     clear: left;
 372 }
 373 .portrait {
 374     width: 100px;
 375     float: left;
 376     margin: 10px;
 377 }