Tom-Marble/deck.js/themes/style/web-2.0.css

   1 @charset "UTF-8";
   2 /* Resets and base styles from HTML5 Boilerplate */
   3 div, span, object, iframe,
   4 h1, h2, h3, h4, h5, h6, p, blockquote, pre,
   5 abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
   6 small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
   7 fieldset, form, label, legend,
   8 table, caption, tbody, tfoot, thead, tr, th, td,
   9 article, aside, canvas, details, figcaption, figure,
  10 footer, header, hgroup, menu, nav, section, summary,
  11 time, mark, audio, video {
  12   margin: 0;
  13   padding: 0;
  14   border: 0;
  15   font-size: 100%;
  16   font: inherit;
  17   vertical-align: baseline;
  18 }
  19
  20 article, aside, details, figcaption, figure,
  21 footer, header, hgroup, menu, nav, section {
  22   display: block;
  23 }
  24
  25 blockquote, q {
  26   quotes: none;
  27 }
  28 blockquote:before, blockquote:after, q:before, q:after {
  29   content: "";
  30   content: none;
  31 }
  32
  33 ins {
  34   background-color: #ff9;
  35   color: #000;
  36   text-decoration: none;
  37 }
  38
  39 mark {
  40   background-color: #ff9;
  41   color: #000;
  42   font-style: italic;
  43   font-weight: bold;
  44 }
  45
  46 del {
  47   text-decoration: line-through;
  48 }
  49
  50 abbr[title], dfn[title] {
  51   border-bottom: 1px dotted;
  52   cursor: help;
  53 }
  54
  55 table {
  56   border-collapse: collapse;
  57   border-spacing: 0;
  58 }
  59
  60 hr {
  61   display: block;
  62   height: 1px;
  63   border: 0;
  64   border-top: 1px solid #ccc;
  65   margin: 1em 0;
  66   padding: 0;
  67 }
  68
  69 input, select {
  70   vertical-align: middle;
  71 }
  72
  73 select, input, textarea, button {
  74   font: 99% sans-serif;
  75 }
  76
  77 pre, code, kbd, samp {
  78   font-family: monospace, sans-serif;
  79 }
  80
  81 a {
  82   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  83 }
  84 a:hover, a:active {
  85   outline: none;
  86 }
  87
  88 ul, ol {
  89   margin-left: 2em;
  90   vertical-align: top;
  91 }
  92
  93 ol {
  94   list-style-type: decimal;
  95 }
  96
  97 nav ul, nav li {
  98   margin: 0;
  99   list-style: none;
 100   list-style-image: none;
 101 }
 102
 103 small {
 104   font-size: 85%;
 105 }
 106
 107 strong, th {
 108   font-weight: bold;
 109 }
 110
 111 td {
 112   vertical-align: top;
 113 }
 114
 115 sub, sup {
 116   font-size: 75%;
 117   line-height: 0;
 118   position: relative;
 119 }
 120
 121 sup {
 122   top: -0.5em;
 123 }
 124
 125 sub {
 126   bottom: -0.25em;
 127 }
 128
 129 textarea {
 130   overflow: auto;
 131 }
 132
 133 input[type="radio"] {
 134   vertical-align: text-bottom;
 135 }
 136
 137 input[type="checkbox"] {
 138   vertical-align: bottom;
 139 }
 140
 141 label,
 142 input[type="button"],
 143 input[type="submit"],
 144 input[type="image"],
 145 button {
 146   cursor: pointer;
 147 }
 148
 149 button, input, select, textarea {
 150   margin: 0;
 151 }
 152
 153 input:invalid, textarea:invalid {
 154   border-radius: 1px;
 155   -moz-box-shadow: 0px 0px 5px red;
 156   -webkit-box-shadow: 0px 0px 5px red;
 157   box-shadow: 0px 0px 5px red;
 158 }
 159 input:invalid .no-boxshadow, textarea:invalid .no-boxshadow {
 160   background-color: #f0dddd;
 161 }
 162
 163 button {
 164   width: auto;
 165   overflow: visible;
 166 }
 167
 168 select, input, textarea {
 169   color: #444444;
 170 }
 171
 172 a {
 173   color: #607890;
 174 }
 175 a:hover, a:focus {
 176   color: #036;
 177 }
 178 a:link {
 179   -webkit-tap-highlight-color: #fff;
 180 }
 181
 182 /* End HTML5 Boilerplate adaptations */
 183 h1 {
 184   font-size: 4.5em;
 185 }
 186
 187 h1, .vcenter {
 188   font-weight: bold;
 189   text-align: center;
 190   padding-top: 1em;
 191   max-height: 100%;
 192 }
 193 .csstransforms h1, .csstransforms .vcenter {
 194   padding: 0 48px;
 195   position: absolute;
 196   left: 0;
 197   right: 0;
 198   top: 50%;
 199   -webkit-transform: translate(0, -50%);
 200   -moz-transform: translate(0, -50%);
 201   -ms-transform: translate(0, -50%);
 202   -o-transform: translate(0, -50%);
 203   transform: translate(0, -50%);
 204 }
 205
 206 .vcenter h1 {
 207   position: relative;
 208   top: auto;
 209   padding: 0;
 210   -webkit-transform: none;
 211   -moz-transform: none;
 212   -ms-transform: none;
 213   -o-transform: none;
 214   transform: none;
 215 }
 216
 217 h2 {
 218   font-size: 2.25em;
 219   font-weight: bold;
 220   padding-top: .5em;
 221   margin: 0 0 .66666em 0;
 222   border-bottom: 3px solid #888;
 223 }
 224
 225 h3 {
 226   font-size: 1.4375em;
 227   font-weight: bold;
 228   margin-bottom: .30435em;
 229 }
 230
 231 h4 {
 232   font-size: 1.25em;
 233   font-weight: bold;
 234   margin-bottom: .25em;
 235 }
 236
 237 h5 {
 238   font-size: 1.125em;
 239   font-weight: bold;
 240   margin-bottom: .2222em;
 241 }
 242
 243 h6 {
 244   font-size: 1em;
 245   font-weight: bold;
 246 }
 247
 248 img, iframe, video {
 249   display: block;
 250   max-width: 100%;
 251 }
 252
 253 video, iframe, img {
 254   display: block;
 255   margin: 0 auto;
 256 }
 257
 258 p, blockquote, iframe, img, ul, ol, pre, video {
 259   margin-bottom: 1em;
 260 }
 261
 262 pre {
 263   white-space: pre;
 264   white-space: pre-wrap;
 265   word-wrap: break-word;
 266   padding: 1em;
 267   border: 1px solid #888;
 268 }
 269
 270 em {
 271   font-style: italic;
 272 }
 273
 274 li {
 275   padding: .25em 0;
 276   vertical-align: middle;
 277 }
 278 li > ol, li > ul {
 279   margin-bottom: inherit;
 280 }
 281
 282 .deck-container {
 283   font-size: 16px;
 284   line-height: 1.25;
 285   color: #444;
 286 }
 287
 288 .slide {
 289   -moz-box-sizing: border-box;
 290   box-sizing: border-box;
 291   width: 100%;
 292 }
 293
 294 h1, h2, h3, h4, h5, h6 {
 295   font-family: "Hoefler Text", Constantia, Palatino, "Palatino Linotype", "Book Antiqua", Georgia, serif;
 296 }
 297
 298 h1 {
 299   color: #08455f;
 300 }
 301
 302 h2 {
 303   color: #0b7495;
 304   border-bottom: 0;
 305 }
 306 .cssreflections h2 {
 307   line-height: 1;
 308   -webkit-box-reflect: below -0.5555em -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(0.3, transparent), color-stop(0.7, rgba(255, 255, 255, 0.1)), to(transparent));
 309   -moz-box-reflect: below -0.5555em -moz-linear-gradient(top, transparent 0%, transparent 30%, rgba(255, 255, 255, 0.3) 100%);
 310 }
 311
 312 h3 {
 313   color: #000;
 314 }
 315
 316 pre {
 317   border-color: #cde;
 318   background: #fff;
 319   position: relative;
 320   z-index: auto;
 321   border-radius: 5px;
 322   /* http://nicolasgallagher.com/css-drop-shadows-without-images/ */
 323 }
 324 .csstransforms.boxshadow pre > :first-child:before {
 325   content: "";
 326   position: absolute;
 327   z-index: -1;
 328   background: #fff;
 329   top: 0;
 330   bottom: 0;
 331   left: 0;
 332   right: 0;
 333 }
 334 .csstransforms.boxshadow pre:before, .csstransforms.boxshadow pre:after {
 335   content: "";
 336   position: absolute;
 337   z-index: -2;
 338   bottom: 15px;
 339   width: 50%;
 340   height: 20%;
 341   max-width: 300px;
 342   box-shadow: 0 15px 10px rgba(0, 0, 0, 0.7);
 343 }
 344 .csstransforms.boxshadow pre:before {
 345   left: 10px;
 346   -webkit-transform: rotate(-3deg);
 347   -ms-transform: rotate(-3deg);
 348   transform: rotate(-3deg);
 349 }
 350 .csstransforms.boxshadow pre:after {
 351   right: 10px;
 352   -webkit-transform: rotate(3deg);
 353   -ms-transform: rotate(3deg);
 354   transform: rotate(3deg);
 355 }
 356
 357 code {
 358   color: #789;
 359 }
 360
 361 blockquote {
 362   font-family: "Hoefler Text", Constantia, Palatino, "Palatino Linotype", "Book Antiqua", Georgia, serif;
 363   font-size: 2em;
 364   padding: 1em 2em .5em 2em;
 365   color: #000;
 366   background: #fff;
 367   position: relative;
 368   border: 1px solid #cde;
 369   z-index: auto;
 370   border-radius: 5px;
 371 }
 372 .boxshadow blockquote > :first-child:before {
 373   content: "";
 374   position: absolute;
 375   z-index: -1;
 376   background: #fff;
 377   top: 0;
 378   bottom: 0;
 379   left: 0;
 380   right: 0;
 381 }
 382 .boxshadow blockquote:after {
 383   content: "";
 384   position: absolute;
 385   z-index: -2;
 386   top: 10px;
 387   bottom: 10px;
 388   left: 0;
 389   right: 50%;
 390   -moz-border-radius: 10px / 100px;
 391   border-radius: 10px / 100px;
 392   box-shadow: 0 0 15px rgba(0, 0, 0, 0.6);
 393 }
 394 blockquote p {
 395   margin: 0;
 396 }
 397 blockquote cite {
 398   font-size: .5em;
 399   font-style: normal;
 400   font-weight: bold;
 401   color: #888;
 402 }
 403 blockquote:before {
 404   content: "“";
 405   position: absolute;
 406   top: 0;
 407   left: 0;
 408   font-size: 5em;
 409   line-height: 1;
 410   color: #ccf0f0;
 411   z-index: 1;
 412 }
 413
 414 ::-moz-selection {
 415   background: #08455f;
 416   color: #fff;
 417 }
 418
 419 ::selection {
 420   background: #08455f;
 421   color: #fff;
 422 }
 423
 424 a, a:hover, a:focus, a:active, a:visited {
 425   color: #599;
 426   text-decoration: none;
 427 }
 428 a:hover, a:focus {
 429   text-decoration: underline;
 430 }
 431
 432 .deck-container {
 433   font-family: "Gill Sans", "Gill Sans MT", Calibri, sans-serif;
 434   font-size: 1.75em;
 435   background: #f4fafe;
 436   /* Old browsers */
 437   background: -moz-linear-gradient(top, #f4fafe 0%, #ccf0f0 100%);
 438   /* FF3.6+ */
 439   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #f4fafe), color-stop(100%, #ccf0f0));
 440   /* Chrome,Safari4+ */
 441   background: -webkit-linear-gradient(top, #f4fafe 0%, #ccf0f0 100%);
 442   /* Chrome10+,Safari5.1+ */
 443   background: -o-linear-gradient(top, #f4fafe 0%, #ccf0f0 100%);
 444   /* Opera11.10+ */
 445   background: -ms-linear-gradient(top, #f4fafe 0%, #ccf0f0 100%);
 446   /* IE10+ */
 447   background: linear-gradient(top, #f4fafe 0%, #ccf0f0 100%);
 448   /* W3C */
 449   background-attachment: fixed;
 450   text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.5);
 451 }
 452 .deck-container > .slide {
 453   padding: 0 48px;
 454 }
 455
 456 .slide .deck-before, .slide .deck-previous {
 457   opacity: 0.4;
 458 }
 459 .slide .deck-before:not(.deck-child-current) .deck-before, .slide .deck-before:not(.deck-child-current) .deck-previous, .slide .deck-previous:not(.deck-child-current) .deck-before, .slide .deck-previous:not(.deck-child-current) .deck-previous {
 460   opacity: 1;
 461 }
 462 .slide .deck-child-current {
 463   opacity: 1;
 464 }
 465
 466 .deck-prev-link, .deck-next-link {
 467   background: #fff;
 468   opacity: 0.5;
 469 }
 470 .deck-prev-link, .deck-prev-link:hover, .deck-prev-link:focus, .deck-prev-link:active, .deck-prev-link:visited, .deck-next-link, .deck-next-link:hover, .deck-next-link:focus, .deck-next-link:active, .deck-next-link:visited {
 471   color: #599;
 472 }
 473 .deck-prev-link:hover, .deck-prev-link:focus, .deck-next-link:hover, .deck-next-link:focus {
 474   opacity: 1;
 475   text-decoration: none;
 476 }
 477
 478 .deck-status {
 479   font-size: 0.6666em;
 480 }
 481
 482 .deck-menu .slide {
 483   background: transparent;
 484   border-radius: 5px;
 485 }
 486 .rgba .deck-menu .slide {
 487   background: rgba(0, 0, 0, 0.1);
 488 }
 489 .deck-menu .slide.deck-current, .rgba .deck-menu .slide.deck-current, .no-touch .deck-menu .slide:hover {
 490   background: #fff;
 491 }
 492
 493 .goto-form {
 494   background: #fff;
 495   border: 1px solid #cde;
 496   border-radius: 5px;
 497 }
 498 .boxshadow .goto-form {
 499   box-shadow: 0 15px 10px -10px rgba(0, 0, 0, 0.5), 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
 500 }