diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/_mixins.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/_mixins.scssc
new file mode 100644
index 0000000..8c66fc6
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/_mixins.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/_vars.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/_vars.scssc
new file mode 100644
index 0000000..ff21688
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/_vars.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/accordion.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/accordion.scssc
new file mode 100644
index 0000000..936bf47
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/accordion.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/alert.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/alert.scssc
new file mode 100644
index 0000000..93707a1
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/alert.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/alignment.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/alignment.scssc
new file mode 100644
index 0000000..ebf7bb9
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/alignment.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/animate.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/animate.scssc
new file mode 100644
index 0000000..ffa0a77
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/animate.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/article.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/article.scssc
new file mode 100644
index 0000000..71b2b3d
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/article.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/badge.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/badge.scssc
new file mode 100644
index 0000000..1607bc6
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/badge.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/blockquote.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/blockquote.scssc
new file mode 100644
index 0000000..492e4ef
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/blockquote.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/breadcrumb.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/breadcrumb.scssc
new file mode 100644
index 0000000..d694b10
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/breadcrumb.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/button.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/button.scssc
new file mode 100644
index 0000000..13c208a
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/button.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/canvas.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/canvas.scssc
new file mode 100644
index 0000000..cb1be29
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/canvas.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/clean.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/clean.scssc
new file mode 100644
index 0000000..7c64ada
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/clean.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/color.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/color.scssc
new file mode 100644
index 0000000..0954453
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/color.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/default.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/default.scssc
new file mode 100644
index 0000000..e86fb10
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/default.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/draggable.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/draggable.scssc
new file mode 100644
index 0000000..59e5f8a
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/draggable.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/form.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/form.scssc
new file mode 100644
index 0000000..589ab1a
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/form.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/grid.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/grid.scssc
new file mode 100644
index 0000000..ea699f2
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/grid.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/icon.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/icon.scssc
new file mode 100644
index 0000000..773988a
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/icon.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/image.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/image.scssc
new file mode 100644
index 0000000..75a0d0e
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/image.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/input.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/input.scssc
new file mode 100644
index 0000000..4bc57ad
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/input.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/layout.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/layout.scssc
new file mode 100644
index 0000000..4a009a9
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/layout.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/link.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/link.scssc
new file mode 100644
index 0000000..9658e74
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/link.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/list.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/list.scssc
new file mode 100644
index 0000000..41c32cc
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/list.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/main.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/main.scssc
new file mode 100644
index 0000000..733cb13
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/main.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/media.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/media.scssc
new file mode 100644
index 0000000..39399e0
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/media.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/nav.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/nav.scssc
new file mode 100644
index 0000000..570468e
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/nav.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/note.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/note.scssc
new file mode 100644
index 0000000..99bd4e9
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/note.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/pagination.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/pagination.scssc
new file mode 100644
index 0000000..a2b024f
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/pagination.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/popup.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/popup.scssc
new file mode 100644
index 0000000..78bfe14
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/popup.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/progress.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/progress.scssc
new file mode 100644
index 0000000..4c6201a
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/progress.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/section.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/section.scssc
new file mode 100644
index 0000000..4baa05f
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/section.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/size.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/size.scssc
new file mode 100644
index 0000000..f57c99b
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/size.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/slider.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/slider.scssc
new file mode 100644
index 0000000..ff5232a
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/slider.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/spinner.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/spinner.scssc
new file mode 100644
index 0000000..af61af3
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/spinner.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/styles.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/styles.scssc
new file mode 100644
index 0000000..7772205
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/styles.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/tab.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/tab.scssc
new file mode 100644
index 0000000..6e3ef8e
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/tab.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/table.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/table.scssc
new file mode 100644
index 0000000..8174144
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/table.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/tag.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/tag.scssc
new file mode 100644
index 0000000..292da18
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/tag.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/text.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/text.scssc
new file mode 100644
index 0000000..08fe596
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/text.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/tooltip.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/tooltip.scssc
new file mode 100644
index 0000000..52513d8
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/tooltip.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/transformation.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/transformation.scssc
new file mode 100644
index 0000000..c312db4
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/transformation.scssc differ
diff --git a/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/visibility.scssc b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/visibility.scssc
new file mode 100644
index 0000000..68aed83
Binary files /dev/null and b/.sass-cache/5e591186641690eb707c6871d9b7164b732cda4d/visibility.scssc differ
diff --git a/.sass-cache/6628299038ad3142c7fbdbe399e3a0ce74d7aa2a/chart.scssc b/.sass-cache/6628299038ad3142c7fbdbe399e3a0ce74d7aa2a/chart.scssc
new file mode 100644
index 0000000..ebead30
Binary files /dev/null and b/.sass-cache/6628299038ad3142c7fbdbe399e3a0ce74d7aa2a/chart.scssc differ
diff --git a/.sass-cache/6628299038ad3142c7fbdbe399e3a0ce74d7aa2a/chart_area.scssc b/.sass-cache/6628299038ad3142c7fbdbe399e3a0ce74d7aa2a/chart_area.scssc
new file mode 100644
index 0000000..30c935a
Binary files /dev/null and b/.sass-cache/6628299038ad3142c7fbdbe399e3a0ce74d7aa2a/chart_area.scssc differ
diff --git a/.sass-cache/6628299038ad3142c7fbdbe399e3a0ce74d7aa2a/chart_bar.scssc b/.sass-cache/6628299038ad3142c7fbdbe399e3a0ce74d7aa2a/chart_bar.scssc
new file mode 100644
index 0000000..185cdd5
Binary files /dev/null and b/.sass-cache/6628299038ad3142c7fbdbe399e3a0ce74d7aa2a/chart_bar.scssc differ
diff --git a/.sass-cache/6628299038ad3142c7fbdbe399e3a0ce74d7aa2a/chart_line.scssc b/.sass-cache/6628299038ad3142c7fbdbe399e3a0ce74d7aa2a/chart_line.scssc
new file mode 100644
index 0000000..4a66ff1
Binary files /dev/null and b/.sass-cache/6628299038ad3142c7fbdbe399e3a0ce74d7aa2a/chart_line.scssc differ
diff --git a/.sass-cache/6628299038ad3142c7fbdbe399e3a0ce74d7aa2a/chart_map.scssc b/.sass-cache/6628299038ad3142c7fbdbe399e3a0ce74d7aa2a/chart_map.scssc
new file mode 100644
index 0000000..f443f41
Binary files /dev/null and b/.sass-cache/6628299038ad3142c7fbdbe399e3a0ce74d7aa2a/chart_map.scssc differ
diff --git a/.sass-cache/6628299038ad3142c7fbdbe399e3a0ce74d7aa2a/chart_pie.scssc b/.sass-cache/6628299038ad3142c7fbdbe399e3a0ce74d7aa2a/chart_pie.scssc
new file mode 100644
index 0000000..8c8f236
Binary files /dev/null and b/.sass-cache/6628299038ad3142c7fbdbe399e3a0ce74d7aa2a/chart_pie.scssc differ
diff --git a/.sass-cache/6628299038ad3142c7fbdbe399e3a0ce74d7aa2a/chart_radar.scssc b/.sass-cache/6628299038ad3142c7fbdbe399e3a0ce74d7aa2a/chart_radar.scssc
new file mode 100644
index 0000000..575c8af
Binary files /dev/null and b/.sass-cache/6628299038ad3142c7fbdbe399e3a0ce74d7aa2a/chart_radar.scssc differ
diff --git a/.sass-cache/eda40c975fdc0bc377064a0cc713b9027e34cc54/backend-small.scssc b/.sass-cache/eda40c975fdc0bc377064a0cc713b9027e34cc54/backend-small.scssc
new file mode 100644
index 0000000..71d0327
Binary files /dev/null and b/.sass-cache/eda40c975fdc0bc377064a0cc713b9027e34cc54/backend-small.scssc differ
diff --git a/.sass-cache/eda40c975fdc0bc377064a0cc713b9027e34cc54/backend.scssc b/.sass-cache/eda40c975fdc0bc377064a0cc713b9027e34cc54/backend.scssc
new file mode 100644
index 0000000..e0ffa57
Binary files /dev/null and b/.sass-cache/eda40c975fdc0bc377064a0cc713b9027e34cc54/backend.scssc differ
diff --git a/.sass-cache/eda40c975fdc0bc377064a0cc713b9027e34cc54/backend_box.scssc b/.sass-cache/eda40c975fdc0bc377064a0cc713b9027e34cc54/backend_box.scssc
new file mode 100644
index 0000000..6b437c6
Binary files /dev/null and b/.sass-cache/eda40c975fdc0bc377064a0cc713b9027e34cc54/backend_box.scssc differ
diff --git a/.sass-cache/eda40c975fdc0bc377064a0cc713b9027e34cc54/backend_form.scssc b/.sass-cache/eda40c975fdc0bc377064a0cc713b9027e34cc54/backend_form.scssc
new file mode 100644
index 0000000..c161bf7
Binary files /dev/null and b/.sass-cache/eda40c975fdc0bc377064a0cc713b9027e34cc54/backend_form.scssc differ
diff --git a/.sass-cache/eda40c975fdc0bc377064a0cc713b9027e34cc54/backend_media.scssc b/.sass-cache/eda40c975fdc0bc377064a0cc713b9027e34cc54/backend_media.scssc
new file mode 100644
index 0000000..4dec0f2
Binary files /dev/null and b/.sass-cache/eda40c975fdc0bc377064a0cc713b9027e34cc54/backend_media.scssc differ
diff --git a/.sass-cache/eda40c975fdc0bc377064a0cc713b9027e34cc54/backend_table.scssc b/.sass-cache/eda40c975fdc0bc377064a0cc713b9027e34cc54/backend_table.scssc
new file mode 100644
index 0000000..458563c
Binary files /dev/null and b/.sass-cache/eda40c975fdc0bc377064a0cc713b9027e34cc54/backend_table.scssc differ
diff --git a/.sass-cache/eda40c975fdc0bc377064a0cc713b9027e34cc54/backend_vars.scssc b/.sass-cache/eda40c975fdc0bc377064a0cc713b9027e34cc54/backend_vars.scssc
new file mode 100644
index 0000000..7d7c225
Binary files /dev/null and b/.sass-cache/eda40c975fdc0bc377064a0cc713b9027e34cc54/backend_vars.scssc differ
diff --git a/.sass-cache/eda40c975fdc0bc377064a0cc713b9027e34cc54/default.scssc b/.sass-cache/eda40c975fdc0bc377064a0cc713b9027e34cc54/default.scssc
new file mode 100644
index 0000000..690c917
Binary files /dev/null and b/.sass-cache/eda40c975fdc0bc377064a0cc713b9027e34cc54/default.scssc differ
diff --git a/_vars.scss b/_vars.scss
index 91091b9..b83de6e 100644
--- a/_vars.scss
+++ b/_vars.scss
@@ -13,10 +13,12 @@ $link-hover-color: #fff;
$link-hover-decoration: none;
$default-border: 1px;
-$default-border-color: #000;
+$default-border-color: #d6d6d6;
$default-border-radius: 3px;
$default-padding: 5px;
+$default-highlighter: #FBA026;
+
/* Content Container */
$content-container-padding: $default-padding;
$content-container-color: $reverse-font-color;
diff --git a/accordion.css b/accordion.css
new file mode 100644
index 0000000..a602400
--- /dev/null
+++ b/accordion.css
@@ -0,0 +1,79 @@
+/* Global */
+/* Content Container */
+/* Content box */
+/* Navigation */
+/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
+.ac-container {
+ margin: 10px auto 30px auto;
+ text-align: left; }
+ .ac-container > input {
+ display: none; }
+ .ac-container > input:checked + label {
+ background: #fff;
+ background: -moz-linear-gradient(top, #fff 0, #fff 100);
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(100, #fff));
+ background: -webkit-linear-gradient(top, #fff 0, #fff 100);
+ background: -o-linear-gradient(top, #fff 0, #fff 100);
+ background: -ms-linear-gradient(top, #fff 0, #fff 100);
+ background: linear-gradient(to bottom, #fff 0, #fff 100);
+ color: #000; }
+ .ac-container > input:checked + label + section {
+ display: inherit; }
+ .ac-container > input + label + section {
+ display: none; }
+ .ac-container label {
+ display: block;
+ padding: 5px 20px;
+ position: relative;
+ z-index: 20;
+ margin-top: -1px;
+ cursor: pointer;
+ color: #777;
+ font-size: 1rem;
+ border: 1px solid #d6d6d6;
+ -webkit-border-radius: 3px;
+ -moz-border-radius: 3px;
+ -ms-border-radius: 3px;
+ border-radius: 3px;
+ background-clip: padding-box;
+ background: #f5f5ff;
+ background: -moz-linear-gradient(top, #e0e3eb 0, #f5f5ff 100);
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #e0e3eb), color-stop(100, #f5f5ff));
+ background: -webkit-linear-gradient(top, #e0e3eb 0, #f5f5ff 100);
+ background: -o-linear-gradient(top, #e0e3eb 0, #f5f5ff 100);
+ background: -ms-linear-gradient(top, #e0e3eb 0, #f5f5ff 100);
+ background: linear-gradient(to bottom, #e0e3eb 0, #f5f5ff 100); }
+ .ac-container label:hover {
+ background: #fff;
+ background: -moz-linear-gradient(top, #fff 0, #fff 100);
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(100, #fff));
+ background: -webkit-linear-gradient(top, #fff 0, #fff 100);
+ background: -o-linear-gradient(top, #fff 0, #fff 100);
+ background: -ms-linear-gradient(top, #fff 0, #fff 100);
+ background: linear-gradient(to bottom, #fff 0, #fff 100); }
+ .ac-container > section {
+ background: #fff;
+ overflow: hidden;
+ height: auto;
+ position: relative;
+ z-index: 10;
+ border-left: 1px solid #d6d6d6;
+ border-right: 1px solid #d6d6d6;
+ padding: 10px; }
+
+/*# sourceMappingURL=accordion.css.map */
diff --git a/alert.css b/alert.css
index 8aa59dc..42f4f3a 100644
--- a/alert.css
+++ b/alert.css
@@ -1,25 +1,45 @@
-.log-msg {
- padding: 5px;
- margin: 5px; }
-
-.log-msg-status-ok {
- background: #aaffad;
- border: 2px solid #81e27d;
- color: #459442; }
-
-.log-msg-status-warning {
- background: #f8ffa8;
- border: 2px solid #d6d949;
- color: #94972f; }
-
-.log-msg-status-error {
- background: #ff7d79;
- border: 2px solid #ee5649;
- color: #a5302a; }
-
-.log-msg-status-info {
- background: #b6d2ff;
- border: 2px solid #85b0ee;
- color: #4865a5; }
-
-/*# sourceMappingURL=alert.css.map */
+/* Global */
+/* Content Container */
+/* Content box */
+/* Navigation */
+/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
+.log-msg {
+ padding: 5px;
+ margin: 5px; }
+
+.log-msg-status-ok {
+ background: #aaffad;
+ border: 2px solid #81e27d;
+ color: #459442; }
+
+.log-msg-status-warning {
+ background: #f8ffa8;
+ border: 2px solid #d6d949;
+ color: #94972f; }
+
+.log-msg-status-error {
+ background: #ff7d79;
+ border: 2px solid #ee5649;
+ color: #a5302a; }
+
+.log-msg-status-info {
+ background: #b6d2ff;
+ border: 2px solid #85b0ee;
+ color: #4865a5; }
+
+/*# sourceMappingURL=alert.css.map */
diff --git a/alignment.css b/alignment.css
new file mode 100644
index 0000000..9c14d1c
--- /dev/null
+++ b/alignment.css
@@ -0,0 +1,27 @@
+.center {
+ margin: 0 auto; }
+
+.centerText {
+ text-align: center; }
+
+.rightText {
+ text-align: right; }
+
+.floatLeft {
+ float: left; }
+
+.floatRight {
+ float: right; }
+
+.pAlignTable {
+ display: table;
+ width: 100%; }
+
+.vCenterTable {
+ display: table-cell;
+ vertical-align: middle; }
+
+.h-overflow {
+ overflow-x: auto; }
+
+/*# sourceMappingURL=alignment.css.map */
diff --git a/animate.css b/animate.css
new file mode 100644
index 0000000..ad26ed5
--- /dev/null
+++ b/animate.css
@@ -0,0 +1,2215 @@
+/*!
+ * animate.css -http://daneden.me/animate
+ * Version - 3.5.1
+ * Licensed under the MIT license - http://opensource.org/licenses/MIT
+ *
+ * Copyright (c) 2016 Daniel Eden
+ */
+.animated {
+ -webkit-animation-duration: 0.5s;
+ animation-duration: 0.5s;
+ -webkit-animation-fill-mode: both;
+ animation-fill-mode: both; }
+
+.animated.infinite {
+ -webkit-animation-iteration-count: infinite;
+ animation-iteration-count: infinite; }
+
+.animated.hinge {
+ -webkit-animation-duration: 2s;
+ animation-duration: 2s; }
+
+.animated.flipOutX,
+.animated.flipOutY,
+.animated.bounceIn,
+.animated.bounceOut {
+ -webkit-animation-duration: .75s;
+ animation-duration: .75s; }
+
+@-webkit-keyframes bounce {
+ from, 20%, 53%, 80%, to {
+ -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+ animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+ -webkit-transform: translate3d(0, 0, 0);
+ transform: translate3d(0, 0, 0); }
+ 40%, 43% {
+ -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
+ animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
+ -webkit-transform: translate3d(0, -30px, 0);
+ transform: translate3d(0, -30px, 0); }
+ 70% {
+ -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
+ animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
+ -webkit-transform: translate3d(0, -15px, 0);
+ transform: translate3d(0, -15px, 0); }
+ 90% {
+ -webkit-transform: translate3d(0, -4px, 0);
+ transform: translate3d(0, -4px, 0); } }
+@keyframes bounce {
+ from, 20%, 53%, 80%, to {
+ -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+ animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+ -webkit-transform: translate3d(0, 0, 0);
+ transform: translate3d(0, 0, 0); }
+ 40%, 43% {
+ -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
+ animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
+ -webkit-transform: translate3d(0, -30px, 0);
+ transform: translate3d(0, -30px, 0); }
+ 70% {
+ -webkit-animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
+ animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
+ -webkit-transform: translate3d(0, -15px, 0);
+ transform: translate3d(0, -15px, 0); }
+ 90% {
+ -webkit-transform: translate3d(0, -4px, 0);
+ transform: translate3d(0, -4px, 0); } }
+.bounce {
+ -webkit-animation-name: bounce;
+ animation-name: bounce;
+ -webkit-transform-origin: center bottom;
+ transform-origin: center bottom; }
+
+@-webkit-keyframes flash {
+ from, 50%, to {
+ opacity: 1; }
+ 25%, 75% {
+ opacity: 0; } }
+@keyframes flash {
+ from, 50%, to {
+ opacity: 1; }
+ 25%, 75% {
+ opacity: 0; } }
+.flash {
+ -webkit-animation-name: flash;
+ animation-name: flash; }
+
+/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
+@-webkit-keyframes pulse {
+ from {
+ -webkit-transform: scale3d(1, 1, 1);
+ transform: scale3d(1, 1, 1); }
+ 50% {
+ -webkit-transform: scale3d(1.05, 1.05, 1.05);
+ transform: scale3d(1.05, 1.05, 1.05); }
+ to {
+ -webkit-transform: scale3d(1, 1, 1);
+ transform: scale3d(1, 1, 1); } }
+@keyframes pulse {
+ from {
+ -webkit-transform: scale3d(1, 1, 1);
+ transform: scale3d(1, 1, 1); }
+ 50% {
+ -webkit-transform: scale3d(1.05, 1.05, 1.05);
+ transform: scale3d(1.05, 1.05, 1.05); }
+ to {
+ -webkit-transform: scale3d(1, 1, 1);
+ transform: scale3d(1, 1, 1); } }
+.pulse {
+ -webkit-animation-name: pulse;
+ animation-name: pulse; }
+
+@-webkit-keyframes rubberBand {
+ from {
+ -webkit-transform: scale3d(1, 1, 1);
+ transform: scale3d(1, 1, 1); }
+ 30% {
+ -webkit-transform: scale3d(1.25, 0.75, 1);
+ transform: scale3d(1.25, 0.75, 1); }
+ 40% {
+ -webkit-transform: scale3d(0.75, 1.25, 1);
+ transform: scale3d(0.75, 1.25, 1); }
+ 50% {
+ -webkit-transform: scale3d(1.15, 0.85, 1);
+ transform: scale3d(1.15, 0.85, 1); }
+ 65% {
+ -webkit-transform: scale3d(0.95, 1.05, 1);
+ transform: scale3d(0.95, 1.05, 1); }
+ 75% {
+ -webkit-transform: scale3d(1.05, 0.95, 1);
+ transform: scale3d(1.05, 0.95, 1); }
+ to {
+ -webkit-transform: scale3d(1, 1, 1);
+ transform: scale3d(1, 1, 1); } }
+@keyframes rubberBand {
+ from {
+ -webkit-transform: scale3d(1, 1, 1);
+ transform: scale3d(1, 1, 1); }
+ 30% {
+ -webkit-transform: scale3d(1.25, 0.75, 1);
+ transform: scale3d(1.25, 0.75, 1); }
+ 40% {
+ -webkit-transform: scale3d(0.75, 1.25, 1);
+ transform: scale3d(0.75, 1.25, 1); }
+ 50% {
+ -webkit-transform: scale3d(1.15, 0.85, 1);
+ transform: scale3d(1.15, 0.85, 1); }
+ 65% {
+ -webkit-transform: scale3d(0.95, 1.05, 1);
+ transform: scale3d(0.95, 1.05, 1); }
+ 75% {
+ -webkit-transform: scale3d(1.05, 0.95, 1);
+ transform: scale3d(1.05, 0.95, 1); }
+ to {
+ -webkit-transform: scale3d(1, 1, 1);
+ transform: scale3d(1, 1, 1); } }
+.rubberBand {
+ -webkit-animation-name: rubberBand;
+ animation-name: rubberBand; }
+
+@-webkit-keyframes shake {
+ from, to {
+ -webkit-transform: translate3d(0, 0, 0);
+ transform: translate3d(0, 0, 0); }
+ 10%, 30%, 50%, 70%, 90% {
+ -webkit-transform: translate3d(-10px, 0, 0);
+ transform: translate3d(-10px, 0, 0); }
+ 20%, 40%, 60%, 80% {
+ -webkit-transform: translate3d(10px, 0, 0);
+ transform: translate3d(10px, 0, 0); } }
+@keyframes shake {
+ from, to {
+ -webkit-transform: translate3d(0, 0, 0);
+ transform: translate3d(0, 0, 0); }
+ 10%, 30%, 50%, 70%, 90% {
+ -webkit-transform: translate3d(-10px, 0, 0);
+ transform: translate3d(-10px, 0, 0); }
+ 20%, 40%, 60%, 80% {
+ -webkit-transform: translate3d(10px, 0, 0);
+ transform: translate3d(10px, 0, 0); } }
+.shake {
+ -webkit-animation-name: shake;
+ animation-name: shake; }
+
+@-webkit-keyframes headShake {
+ 0% {
+ -webkit-transform: translateX(0);
+ transform: translateX(0); }
+ 6.5% {
+ -webkit-transform: translateX(-6px) rotateY(-9deg);
+ transform: translateX(-6px) rotateY(-9deg); }
+ 18.5% {
+ -webkit-transform: translateX(5px) rotateY(7deg);
+ transform: translateX(5px) rotateY(7deg); }
+ 31.5% {
+ -webkit-transform: translateX(-3px) rotateY(-5deg);
+ transform: translateX(-3px) rotateY(-5deg); }
+ 43.5% {
+ -webkit-transform: translateX(2px) rotateY(3deg);
+ transform: translateX(2px) rotateY(3deg); }
+ 50% {
+ -webkit-transform: translateX(0);
+ transform: translateX(0); } }
+@keyframes headShake {
+ 0% {
+ -webkit-transform: translateX(0);
+ transform: translateX(0); }
+ 6.5% {
+ -webkit-transform: translateX(-6px) rotateY(-9deg);
+ transform: translateX(-6px) rotateY(-9deg); }
+ 18.5% {
+ -webkit-transform: translateX(5px) rotateY(7deg);
+ transform: translateX(5px) rotateY(7deg); }
+ 31.5% {
+ -webkit-transform: translateX(-3px) rotateY(-5deg);
+ transform: translateX(-3px) rotateY(-5deg); }
+ 43.5% {
+ -webkit-transform: translateX(2px) rotateY(3deg);
+ transform: translateX(2px) rotateY(3deg); }
+ 50% {
+ -webkit-transform: translateX(0);
+ transform: translateX(0); } }
+.headShake {
+ -webkit-animation-timing-function: ease-in-out;
+ animation-timing-function: ease-in-out;
+ -webkit-animation-name: headShake;
+ animation-name: headShake; }
+
+@-webkit-keyframes swing {
+ 20% {
+ -webkit-transform: rotate3d(0, 0, 1, 15deg);
+ transform: rotate3d(0, 0, 1, 15deg); }
+ 40% {
+ -webkit-transform: rotate3d(0, 0, 1, -10deg);
+ transform: rotate3d(0, 0, 1, -10deg); }
+ 60% {
+ -webkit-transform: rotate3d(0, 0, 1, 5deg);
+ transform: rotate3d(0, 0, 1, 5deg); }
+ 80% {
+ -webkit-transform: rotate3d(0, 0, 1, -5deg);
+ transform: rotate3d(0, 0, 1, -5deg); }
+ to {
+ -webkit-transform: rotate3d(0, 0, 1, 0deg);
+ transform: rotate3d(0, 0, 1, 0deg); } }
+@keyframes swing {
+ 20% {
+ -webkit-transform: rotate3d(0, 0, 1, 15deg);
+ transform: rotate3d(0, 0, 1, 15deg); }
+ 40% {
+ -webkit-transform: rotate3d(0, 0, 1, -10deg);
+ transform: rotate3d(0, 0, 1, -10deg); }
+ 60% {
+ -webkit-transform: rotate3d(0, 0, 1, 5deg);
+ transform: rotate3d(0, 0, 1, 5deg); }
+ 80% {
+ -webkit-transform: rotate3d(0, 0, 1, -5deg);
+ transform: rotate3d(0, 0, 1, -5deg); }
+ to {
+ -webkit-transform: rotate3d(0, 0, 1, 0deg);
+ transform: rotate3d(0, 0, 1, 0deg); } }
+.swing {
+ -webkit-transform-origin: top center;
+ transform-origin: top center;
+ -webkit-animation-name: swing;
+ animation-name: swing; }
+
+@-webkit-keyframes tada {
+ from {
+ -webkit-transform: scale3d(1, 1, 1);
+ transform: scale3d(1, 1, 1); }
+ 10%, 20% {
+ -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
+ transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); }
+ 30%, 50%, 70%, 90% {
+ -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
+ transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); }
+ 40%, 60%, 80% {
+ -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
+ transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); }
+ to {
+ -webkit-transform: scale3d(1, 1, 1);
+ transform: scale3d(1, 1, 1); } }
+@keyframes tada {
+ from {
+ -webkit-transform: scale3d(1, 1, 1);
+ transform: scale3d(1, 1, 1); }
+ 10%, 20% {
+ -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
+ transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg); }
+ 30%, 50%, 70%, 90% {
+ -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
+ transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg); }
+ 40%, 60%, 80% {
+ -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
+ transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg); }
+ to {
+ -webkit-transform: scale3d(1, 1, 1);
+ transform: scale3d(1, 1, 1); } }
+.tada {
+ -webkit-animation-name: tada;
+ animation-name: tada; }
+
+/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
+@-webkit-keyframes wobble {
+ from {
+ -webkit-transform: none;
+ transform: none; }
+ 15% {
+ -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
+ transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); }
+ 30% {
+ -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
+ transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); }
+ 45% {
+ -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
+ transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); }
+ 60% {
+ -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
+ transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); }
+ 75% {
+ -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
+ transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); }
+ to {
+ -webkit-transform: none;
+ transform: none; } }
+@keyframes wobble {
+ from {
+ -webkit-transform: none;
+ transform: none; }
+ 15% {
+ -webkit-transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
+ transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg); }
+ 30% {
+ -webkit-transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
+ transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg); }
+ 45% {
+ -webkit-transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
+ transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg); }
+ 60% {
+ -webkit-transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
+ transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg); }
+ 75% {
+ -webkit-transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
+ transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg); }
+ to {
+ -webkit-transform: none;
+ transform: none; } }
+.wobble {
+ -webkit-animation-name: wobble;
+ animation-name: wobble; }
+
+@-webkit-keyframes jello {
+ from, 11.1%, to {
+ -webkit-transform: none;
+ transform: none; }
+ 22.2% {
+ -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
+ transform: skewX(-12.5deg) skewY(-12.5deg); }
+ 33.3% {
+ -webkit-transform: skewX(6.25deg) skewY(6.25deg);
+ transform: skewX(6.25deg) skewY(6.25deg); }
+ 44.4% {
+ -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
+ transform: skewX(-3.125deg) skewY(-3.125deg); }
+ 55.5% {
+ -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
+ transform: skewX(1.5625deg) skewY(1.5625deg); }
+ 66.6% {
+ -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
+ transform: skewX(-0.78125deg) skewY(-0.78125deg); }
+ 77.7% {
+ -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
+ transform: skewX(0.390625deg) skewY(0.390625deg); }
+ 88.8% {
+ -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
+ transform: skewX(-0.1953125deg) skewY(-0.1953125deg); } }
+@keyframes jello {
+ from, 11.1%, to {
+ -webkit-transform: none;
+ transform: none; }
+ 22.2% {
+ -webkit-transform: skewX(-12.5deg) skewY(-12.5deg);
+ transform: skewX(-12.5deg) skewY(-12.5deg); }
+ 33.3% {
+ -webkit-transform: skewX(6.25deg) skewY(6.25deg);
+ transform: skewX(6.25deg) skewY(6.25deg); }
+ 44.4% {
+ -webkit-transform: skewX(-3.125deg) skewY(-3.125deg);
+ transform: skewX(-3.125deg) skewY(-3.125deg); }
+ 55.5% {
+ -webkit-transform: skewX(1.5625deg) skewY(1.5625deg);
+ transform: skewX(1.5625deg) skewY(1.5625deg); }
+ 66.6% {
+ -webkit-transform: skewX(-0.78125deg) skewY(-0.78125deg);
+ transform: skewX(-0.78125deg) skewY(-0.78125deg); }
+ 77.7% {
+ -webkit-transform: skewX(0.390625deg) skewY(0.390625deg);
+ transform: skewX(0.390625deg) skewY(0.390625deg); }
+ 88.8% {
+ -webkit-transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
+ transform: skewX(-0.1953125deg) skewY(-0.1953125deg); } }
+.jello {
+ -webkit-animation-name: jello;
+ animation-name: jello;
+ -webkit-transform-origin: center;
+ transform-origin: center; }
+
+@-webkit-keyframes bounceIn {
+ from, 20%, 40%, 60%, 80%, to {
+ -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+ animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
+ 0% {
+ opacity: 0;
+ -webkit-transform: scale3d(0.3, 0.3, 0.3);
+ transform: scale3d(0.3, 0.3, 0.3); }
+ 20% {
+ -webkit-transform: scale3d(1.1, 1.1, 1.1);
+ transform: scale3d(1.1, 1.1, 1.1); }
+ 40% {
+ -webkit-transform: scale3d(0.9, 0.9, 0.9);
+ transform: scale3d(0.9, 0.9, 0.9); }
+ 60% {
+ opacity: 1;
+ -webkit-transform: scale3d(1.03, 1.03, 1.03);
+ transform: scale3d(1.03, 1.03, 1.03); }
+ 80% {
+ -webkit-transform: scale3d(0.97, 0.97, 0.97);
+ transform: scale3d(0.97, 0.97, 0.97); }
+ to {
+ opacity: 1;
+ -webkit-transform: scale3d(1, 1, 1);
+ transform: scale3d(1, 1, 1); } }
+@keyframes bounceIn {
+ from, 20%, 40%, 60%, 80%, to {
+ -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+ animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
+ 0% {
+ opacity: 0;
+ -webkit-transform: scale3d(0.3, 0.3, 0.3);
+ transform: scale3d(0.3, 0.3, 0.3); }
+ 20% {
+ -webkit-transform: scale3d(1.1, 1.1, 1.1);
+ transform: scale3d(1.1, 1.1, 1.1); }
+ 40% {
+ -webkit-transform: scale3d(0.9, 0.9, 0.9);
+ transform: scale3d(0.9, 0.9, 0.9); }
+ 60% {
+ opacity: 1;
+ -webkit-transform: scale3d(1.03, 1.03, 1.03);
+ transform: scale3d(1.03, 1.03, 1.03); }
+ 80% {
+ -webkit-transform: scale3d(0.97, 0.97, 0.97);
+ transform: scale3d(0.97, 0.97, 0.97); }
+ to {
+ opacity: 1;
+ -webkit-transform: scale3d(1, 1, 1);
+ transform: scale3d(1, 1, 1); } }
+.bounceIn {
+ -webkit-animation-name: bounceIn;
+ animation-name: bounceIn; }
+
+@-webkit-keyframes bounceInDown {
+ from, 60%, 75%, 90%, to {
+ -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+ animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
+ 0% {
+ opacity: 0;
+ -webkit-transform: translate3d(0, -3000px, 0);
+ transform: translate3d(0, -3000px, 0); }
+ 60% {
+ opacity: 1;
+ -webkit-transform: translate3d(0, 25px, 0);
+ transform: translate3d(0, 25px, 0); }
+ 75% {
+ -webkit-transform: translate3d(0, -10px, 0);
+ transform: translate3d(0, -10px, 0); }
+ 90% {
+ -webkit-transform: translate3d(0, 5px, 0);
+ transform: translate3d(0, 5px, 0); }
+ to {
+ -webkit-transform: none;
+ transform: none; } }
+@keyframes bounceInDown {
+ from, 60%, 75%, 90%, to {
+ -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+ animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
+ 0% {
+ opacity: 0;
+ -webkit-transform: translate3d(0, -3000px, 0);
+ transform: translate3d(0, -3000px, 0); }
+ 60% {
+ opacity: 1;
+ -webkit-transform: translate3d(0, 25px, 0);
+ transform: translate3d(0, 25px, 0); }
+ 75% {
+ -webkit-transform: translate3d(0, -10px, 0);
+ transform: translate3d(0, -10px, 0); }
+ 90% {
+ -webkit-transform: translate3d(0, 5px, 0);
+ transform: translate3d(0, 5px, 0); }
+ to {
+ -webkit-transform: none;
+ transform: none; } }
+.bounceInDown {
+ -webkit-animation-name: bounceInDown;
+ animation-name: bounceInDown; }
+
+@-webkit-keyframes bounceInLeft {
+ from, 60%, 75%, 90%, to {
+ -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+ animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
+ 0% {
+ opacity: 0;
+ -webkit-transform: translate3d(-3000px, 0, 0);
+ transform: translate3d(-3000px, 0, 0); }
+ 60% {
+ opacity: 1;
+ -webkit-transform: translate3d(25px, 0, 0);
+ transform: translate3d(25px, 0, 0); }
+ 75% {
+ -webkit-transform: translate3d(-10px, 0, 0);
+ transform: translate3d(-10px, 0, 0); }
+ 90% {
+ -webkit-transform: translate3d(5px, 0, 0);
+ transform: translate3d(5px, 0, 0); }
+ to {
+ -webkit-transform: none;
+ transform: none; } }
+@keyframes bounceInLeft {
+ from, 60%, 75%, 90%, to {
+ -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+ animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
+ 0% {
+ opacity: 0;
+ -webkit-transform: translate3d(-3000px, 0, 0);
+ transform: translate3d(-3000px, 0, 0); }
+ 60% {
+ opacity: 1;
+ -webkit-transform: translate3d(25px, 0, 0);
+ transform: translate3d(25px, 0, 0); }
+ 75% {
+ -webkit-transform: translate3d(-10px, 0, 0);
+ transform: translate3d(-10px, 0, 0); }
+ 90% {
+ -webkit-transform: translate3d(5px, 0, 0);
+ transform: translate3d(5px, 0, 0); }
+ to {
+ -webkit-transform: none;
+ transform: none; } }
+.bounceInLeft {
+ -webkit-animation-name: bounceInLeft;
+ animation-name: bounceInLeft; }
+
+@-webkit-keyframes bounceInRight {
+ from, 60%, 75%, 90%, to {
+ -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+ animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
+ from {
+ opacity: 0;
+ -webkit-transform: translate3d(3000px, 0, 0);
+ transform: translate3d(3000px, 0, 0); }
+ 60% {
+ opacity: 1;
+ -webkit-transform: translate3d(-25px, 0, 0);
+ transform: translate3d(-25px, 0, 0); }
+ 75% {
+ -webkit-transform: translate3d(10px, 0, 0);
+ transform: translate3d(10px, 0, 0); }
+ 90% {
+ -webkit-transform: translate3d(-5px, 0, 0);
+ transform: translate3d(-5px, 0, 0); }
+ to {
+ -webkit-transform: none;
+ transform: none; } }
+@keyframes bounceInRight {
+ from, 60%, 75%, 90%, to {
+ -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+ animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
+ from {
+ opacity: 0;
+ -webkit-transform: translate3d(3000px, 0, 0);
+ transform: translate3d(3000px, 0, 0); }
+ 60% {
+ opacity: 1;
+ -webkit-transform: translate3d(-25px, 0, 0);
+ transform: translate3d(-25px, 0, 0); }
+ 75% {
+ -webkit-transform: translate3d(10px, 0, 0);
+ transform: translate3d(10px, 0, 0); }
+ 90% {
+ -webkit-transform: translate3d(-5px, 0, 0);
+ transform: translate3d(-5px, 0, 0); }
+ to {
+ -webkit-transform: none;
+ transform: none; } }
+.bounceInRight {
+ -webkit-animation-name: bounceInRight;
+ animation-name: bounceInRight; }
+
+@-webkit-keyframes bounceInUp {
+ from, 60%, 75%, 90%, to {
+ -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+ animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
+ from {
+ opacity: 0;
+ -webkit-transform: translate3d(0, 3000px, 0);
+ transform: translate3d(0, 3000px, 0); }
+ 60% {
+ opacity: 1;
+ -webkit-transform: translate3d(0, -20px, 0);
+ transform: translate3d(0, -20px, 0); }
+ 75% {
+ -webkit-transform: translate3d(0, 10px, 0);
+ transform: translate3d(0, 10px, 0); }
+ 90% {
+ -webkit-transform: translate3d(0, -5px, 0);
+ transform: translate3d(0, -5px, 0); }
+ to {
+ -webkit-transform: translate3d(0, 0, 0);
+ transform: translate3d(0, 0, 0); } }
+@keyframes bounceInUp {
+ from, 60%, 75%, 90%, to {
+ -webkit-animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
+ animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); }
+ from {
+ opacity: 0;
+ -webkit-transform: translate3d(0, 3000px, 0);
+ transform: translate3d(0, 3000px, 0); }
+ 60% {
+ opacity: 1;
+ -webkit-transform: translate3d(0, -20px, 0);
+ transform: translate3d(0, -20px, 0); }
+ 75% {
+ -webkit-transform: translate3d(0, 10px, 0);
+ transform: translate3d(0, 10px, 0); }
+ 90% {
+ -webkit-transform: translate3d(0, -5px, 0);
+ transform: translate3d(0, -5px, 0); }
+ to {
+ -webkit-transform: translate3d(0, 0, 0);
+ transform: translate3d(0, 0, 0); } }
+.bounceInUp {
+ -webkit-animation-name: bounceInUp;
+ animation-name: bounceInUp; }
+
+@-webkit-keyframes bounceOut {
+ 20% {
+ -webkit-transform: scale3d(0.9, 0.9, 0.9);
+ transform: scale3d(0.9, 0.9, 0.9); }
+ 50%, 55% {
+ opacity: 1;
+ -webkit-transform: scale3d(1.1, 1.1, 1.1);
+ transform: scale3d(1.1, 1.1, 1.1); }
+ to {
+ opacity: 0;
+ -webkit-transform: scale3d(0.3, 0.3, 0.3);
+ transform: scale3d(0.3, 0.3, 0.3); } }
+@keyframes bounceOut {
+ 20% {
+ -webkit-transform: scale3d(0.9, 0.9, 0.9);
+ transform: scale3d(0.9, 0.9, 0.9); }
+ 50%, 55% {
+ opacity: 1;
+ -webkit-transform: scale3d(1.1, 1.1, 1.1);
+ transform: scale3d(1.1, 1.1, 1.1); }
+ to {
+ opacity: 0;
+ -webkit-transform: scale3d(0.3, 0.3, 0.3);
+ transform: scale3d(0.3, 0.3, 0.3); } }
+.bounceOut {
+ -webkit-animation-name: bounceOut;
+ animation-name: bounceOut; }
+
+@-webkit-keyframes bounceOutDown {
+ 20% {
+ -webkit-transform: translate3d(0, 10px, 0);
+ transform: translate3d(0, 10px, 0); }
+ 40%, 45% {
+ opacity: 1;
+ -webkit-transform: translate3d(0, -20px, 0);
+ transform: translate3d(0, -20px, 0); }
+ to {
+ opacity: 0;
+ -webkit-transform: translate3d(0, 2000px, 0);
+ transform: translate3d(0, 2000px, 0); } }
+@keyframes bounceOutDown {
+ 20% {
+ -webkit-transform: translate3d(0, 10px, 0);
+ transform: translate3d(0, 10px, 0); }
+ 40%, 45% {
+ opacity: 1;
+ -webkit-transform: translate3d(0, -20px, 0);
+ transform: translate3d(0, -20px, 0); }
+ to {
+ opacity: 0;
+ -webkit-transform: translate3d(0, 2000px, 0);
+ transform: translate3d(0, 2000px, 0); } }
+.bounceOutDown {
+ -webkit-animation-name: bounceOutDown;
+ animation-name: bounceOutDown; }
+
+@-webkit-keyframes bounceOutLeft {
+ 20% {
+ opacity: 1;
+ -webkit-transform: translate3d(20px, 0, 0);
+ transform: translate3d(20px, 0, 0); }
+ to {
+ opacity: 0;
+ -webkit-transform: translate3d(-2000px, 0, 0);
+ transform: translate3d(-2000px, 0, 0); } }
+@keyframes bounceOutLeft {
+ 20% {
+ opacity: 1;
+ -webkit-transform: translate3d(20px, 0, 0);
+ transform: translate3d(20px, 0, 0); }
+ to {
+ opacity: 0;
+ -webkit-transform: translate3d(-2000px, 0, 0);
+ transform: translate3d(-2000px, 0, 0); } }
+.bounceOutLeft {
+ -webkit-animation-name: bounceOutLeft;
+ animation-name: bounceOutLeft; }
+
+@-webkit-keyframes bounceOutRight {
+ 20% {
+ opacity: 1;
+ -webkit-transform: translate3d(-20px, 0, 0);
+ transform: translate3d(-20px, 0, 0); }
+ to {
+ opacity: 0;
+ -webkit-transform: translate3d(2000px, 0, 0);
+ transform: translate3d(2000px, 0, 0); } }
+@keyframes bounceOutRight {
+ 20% {
+ opacity: 1;
+ -webkit-transform: translate3d(-20px, 0, 0);
+ transform: translate3d(-20px, 0, 0); }
+ to {
+ opacity: 0;
+ -webkit-transform: translate3d(2000px, 0, 0);
+ transform: translate3d(2000px, 0, 0); } }
+.bounceOutRight {
+ -webkit-animation-name: bounceOutRight;
+ animation-name: bounceOutRight; }
+
+@-webkit-keyframes bounceOutUp {
+ 20% {
+ -webkit-transform: translate3d(0, -10px, 0);
+ transform: translate3d(0, -10px, 0); }
+ 40%, 45% {
+ opacity: 1;
+ -webkit-transform: translate3d(0, 20px, 0);
+ transform: translate3d(0, 20px, 0); }
+ to {
+ opacity: 0;
+ -webkit-transform: translate3d(0, -2000px, 0);
+ transform: translate3d(0, -2000px, 0); } }
+@keyframes bounceOutUp {
+ 20% {
+ -webkit-transform: translate3d(0, -10px, 0);
+ transform: translate3d(0, -10px, 0); }
+ 40%, 45% {
+ opacity: 1;
+ -webkit-transform: translate3d(0, 20px, 0);
+ transform: translate3d(0, 20px, 0); }
+ to {
+ opacity: 0;
+ -webkit-transform: translate3d(0, -2000px, 0);
+ transform: translate3d(0, -2000px, 0); } }
+.bounceOutUp {
+ -webkit-animation-name: bounceOutUp;
+ animation-name: bounceOutUp; }
+
+@-webkit-keyframes fadeIn {
+ from {
+ opacity: 0; }
+ to {
+ opacity: 1; } }
+@keyframes fadeIn {
+ from {
+ opacity: 0; }
+ to {
+ opacity: 1; } }
+.fadeIn {
+ -webkit-animation-name: fadeIn;
+ animation-name: fadeIn; }
+
+@-webkit-keyframes fadeInDown {
+ from {
+ opacity: 0;
+ -webkit-transform: translate3d(0, -100%, 0);
+ transform: translate3d(0, -100%, 0); }
+ to {
+ opacity: 1;
+ -webkit-transform: none;
+ transform: none; } }
+@keyframes fadeInDown {
+ from {
+ opacity: 0;
+ -webkit-transform: translate3d(0, -100%, 0);
+ transform: translate3d(0, -100%, 0); }
+ to {
+ opacity: 1;
+ -webkit-transform: none;
+ transform: none; } }
+.fadeInDown {
+ -webkit-animation-name: fadeInDown;
+ animation-name: fadeInDown; }
+
+@-webkit-keyframes fadeInDownBig {
+ from {
+ opacity: 0;
+ -webkit-transform: translate3d(0, -2000px, 0);
+ transform: translate3d(0, -2000px, 0); }
+ to {
+ opacity: 1;
+ -webkit-transform: none;
+ transform: none; } }
+@keyframes fadeInDownBig {
+ from {
+ opacity: 0;
+ -webkit-transform: translate3d(0, -2000px, 0);
+ transform: translate3d(0, -2000px, 0); }
+ to {
+ opacity: 1;
+ -webkit-transform: none;
+ transform: none; } }
+.fadeInDownBig {
+ -webkit-animation-name: fadeInDownBig;
+ animation-name: fadeInDownBig; }
+
+@-webkit-keyframes fadeInLeft {
+ from {
+ opacity: 0;
+ -webkit-transform: translate3d(-100%, 0, 0);
+ transform: translate3d(-100%, 0, 0); }
+ to {
+ opacity: 1;
+ -webkit-transform: none;
+ transform: none; } }
+@keyframes fadeInLeft {
+ from {
+ opacity: 0;
+ -webkit-transform: translate3d(-100%, 0, 0);
+ transform: translate3d(-100%, 0, 0); }
+ to {
+ opacity: 1;
+ -webkit-transform: none;
+ transform: none; } }
+.fadeInLeft {
+ -webkit-animation-name: fadeInLeft;
+ animation-name: fadeInLeft; }
+
+@-webkit-keyframes fadeInLeftBig {
+ from {
+ opacity: 0;
+ -webkit-transform: translate3d(-2000px, 0, 0);
+ transform: translate3d(-2000px, 0, 0); }
+ to {
+ opacity: 1;
+ -webkit-transform: none;
+ transform: none; } }
+@keyframes fadeInLeftBig {
+ from {
+ opacity: 0;
+ -webkit-transform: translate3d(-2000px, 0, 0);
+ transform: translate3d(-2000px, 0, 0); }
+ to {
+ opacity: 1;
+ -webkit-transform: none;
+ transform: none; } }
+.fadeInLeftBig {
+ -webkit-animation-name: fadeInLeftBig;
+ animation-name: fadeInLeftBig; }
+
+@-webkit-keyframes fadeInRight {
+ from {
+ opacity: 0;
+ -webkit-transform: translate3d(100%, 0, 0);
+ transform: translate3d(100%, 0, 0); }
+ to {
+ opacity: 1;
+ -webkit-transform: none;
+ transform: none; } }
+@keyframes fadeInRight {
+ from {
+ opacity: 0;
+ -webkit-transform: translate3d(100%, 0, 0);
+ transform: translate3d(100%, 0, 0); }
+ to {
+ opacity: 1;
+ -webkit-transform: none;
+ transform: none; } }
+.fadeInRight {
+ -webkit-animation-name: fadeInRight;
+ animation-name: fadeInRight; }
+
+@-webkit-keyframes fadeInRightBig {
+ from {
+ opacity: 0;
+ -webkit-transform: translate3d(2000px, 0, 0);
+ transform: translate3d(2000px, 0, 0); }
+ to {
+ opacity: 1;
+ -webkit-transform: none;
+ transform: none; } }
+@keyframes fadeInRightBig {
+ from {
+ opacity: 0;
+ -webkit-transform: translate3d(2000px, 0, 0);
+ transform: translate3d(2000px, 0, 0); }
+ to {
+ opacity: 1;
+ -webkit-transform: none;
+ transform: none; } }
+.fadeInRightBig {
+ -webkit-animation-name: fadeInRightBig;
+ animation-name: fadeInRightBig; }
+
+@-webkit-keyframes fadeInUp {
+ from {
+ opacity: 0;
+ -webkit-transform: translate3d(0, 100%, 0);
+ transform: translate3d(0, 100%, 0); }
+ to {
+ opacity: 1;
+ -webkit-transform: none;
+ transform: none; } }
+@keyframes fadeInUp {
+ from {
+ opacity: 0;
+ -webkit-transform: translate3d(0, 100%, 0);
+ transform: translate3d(0, 100%, 0); }
+ to {
+ opacity: 1;
+ -webkit-transform: none;
+ transform: none; } }
+.fadeInUp {
+ -webkit-animation-name: fadeInUp;
+ animation-name: fadeInUp; }
+
+@-webkit-keyframes fadeInUpBig {
+ from {
+ opacity: 0;
+ -webkit-transform: translate3d(0, 2000px, 0);
+ transform: translate3d(0, 2000px, 0); }
+ to {
+ opacity: 1;
+ -webkit-transform: none;
+ transform: none; } }
+@keyframes fadeInUpBig {
+ from {
+ opacity: 0;
+ -webkit-transform: translate3d(0, 2000px, 0);
+ transform: translate3d(0, 2000px, 0); }
+ to {
+ opacity: 1;
+ -webkit-transform: none;
+ transform: none; } }
+.fadeInUpBig {
+ -webkit-animation-name: fadeInUpBig;
+ animation-name: fadeInUpBig; }
+
+@-webkit-keyframes fadeOut {
+ from {
+ opacity: 1; }
+ to {
+ opacity: 0; } }
+@keyframes fadeOut {
+ from {
+ opacity: 1; }
+ to {
+ opacity: 0; } }
+.fadeOut {
+ -webkit-animation-name: fadeOut;
+ animation-name: fadeOut; }
+
+@-webkit-keyframes fadeOutDown {
+ from {
+ opacity: 1; }
+ to {
+ opacity: 0;
+ -webkit-transform: translate3d(0, 100%, 0);
+ transform: translate3d(0, 100%, 0); } }
+@keyframes fadeOutDown {
+ from {
+ opacity: 1; }
+ to {
+ opacity: 0;
+ -webkit-transform: translate3d(0, 100%, 0);
+ transform: translate3d(0, 100%, 0); } }
+.fadeOutDown {
+ -webkit-animation-name: fadeOutDown;
+ animation-name: fadeOutDown; }
+
+@-webkit-keyframes fadeOutDownBig {
+ from {
+ opacity: 1; }
+ to {
+ opacity: 0;
+ -webkit-transform: translate3d(0, 2000px, 0);
+ transform: translate3d(0, 2000px, 0); } }
+@keyframes fadeOutDownBig {
+ from {
+ opacity: 1; }
+ to {
+ opacity: 0;
+ -webkit-transform: translate3d(0, 2000px, 0);
+ transform: translate3d(0, 2000px, 0); } }
+.fadeOutDownBig {
+ -webkit-animation-name: fadeOutDownBig;
+ animation-name: fadeOutDownBig; }
+
+@-webkit-keyframes fadeOutLeft {
+ from {
+ opacity: 1; }
+ to {
+ opacity: 0;
+ -webkit-transform: translate3d(-100%, 0, 0);
+ transform: translate3d(-100%, 0, 0); } }
+@keyframes fadeOutLeft {
+ from {
+ opacity: 1; }
+ to {
+ opacity: 0;
+ -webkit-transform: translate3d(-100%, 0, 0);
+ transform: translate3d(-100%, 0, 0); } }
+.fadeOutLeft {
+ -webkit-animation-name: fadeOutLeft;
+ animation-name: fadeOutLeft; }
+
+@-webkit-keyframes fadeOutLeftBig {
+ from {
+ opacity: 1; }
+ to {
+ opacity: 0;
+ -webkit-transform: translate3d(-2000px, 0, 0);
+ transform: translate3d(-2000px, 0, 0); } }
+@keyframes fadeOutLeftBig {
+ from {
+ opacity: 1; }
+ to {
+ opacity: 0;
+ -webkit-transform: translate3d(-2000px, 0, 0);
+ transform: translate3d(-2000px, 0, 0); } }
+.fadeOutLeftBig {
+ -webkit-animation-name: fadeOutLeftBig;
+ animation-name: fadeOutLeftBig; }
+
+@-webkit-keyframes fadeOutRight {
+ from {
+ opacity: 1; }
+ to {
+ opacity: 0;
+ -webkit-transform: translate3d(100%, 0, 0);
+ transform: translate3d(100%, 0, 0); } }
+@keyframes fadeOutRight {
+ from {
+ opacity: 1; }
+ to {
+ opacity: 0;
+ -webkit-transform: translate3d(100%, 0, 0);
+ transform: translate3d(100%, 0, 0); } }
+.fadeOutRight {
+ -webkit-animation-name: fadeOutRight;
+ animation-name: fadeOutRight; }
+
+@-webkit-keyframes fadeOutRightBig {
+ from {
+ opacity: 1; }
+ to {
+ opacity: 0;
+ -webkit-transform: translate3d(2000px, 0, 0);
+ transform: translate3d(2000px, 0, 0); } }
+@keyframes fadeOutRightBig {
+ from {
+ opacity: 1; }
+ to {
+ opacity: 0;
+ -webkit-transform: translate3d(2000px, 0, 0);
+ transform: translate3d(2000px, 0, 0); } }
+.fadeOutRightBig {
+ -webkit-animation-name: fadeOutRightBig;
+ animation-name: fadeOutRightBig; }
+
+@-webkit-keyframes fadeOutUp {
+ from {
+ opacity: 1; }
+ to {
+ opacity: 0;
+ -webkit-transform: translate3d(0, -100%, 0);
+ transform: translate3d(0, -100%, 0); } }
+@keyframes fadeOutUp {
+ from {
+ opacity: 1; }
+ to {
+ opacity: 0;
+ -webkit-transform: translate3d(0, -100%, 0);
+ transform: translate3d(0, -100%, 0); } }
+.fadeOutUp {
+ -webkit-animation-name: fadeOutUp;
+ animation-name: fadeOutUp; }
+
+@-webkit-keyframes fadeOutUpBig {
+ from {
+ opacity: 1; }
+ to {
+ opacity: 0;
+ -webkit-transform: translate3d(0, -2000px, 0);
+ transform: translate3d(0, -2000px, 0); } }
+@keyframes fadeOutUpBig {
+ from {
+ opacity: 1; }
+ to {
+ opacity: 0;
+ -webkit-transform: translate3d(0, -2000px, 0);
+ transform: translate3d(0, -2000px, 0); } }
+.fadeOutUpBig {
+ -webkit-animation-name: fadeOutUpBig;
+ animation-name: fadeOutUpBig; }
+
+@-webkit-keyframes flip {
+ from {
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
+ transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
+ -webkit-animation-timing-function: ease-out;
+ animation-timing-function: ease-out; }
+ 40% {
+ -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
+ transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
+ -webkit-animation-timing-function: ease-out;
+ animation-timing-function: ease-out; }
+ 50% {
+ -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
+ transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
+ -webkit-animation-timing-function: ease-in;
+ animation-timing-function: ease-in; }
+ 80% {
+ -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
+ transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
+ -webkit-animation-timing-function: ease-in;
+ animation-timing-function: ease-in; }
+ to {
+ -webkit-transform: perspective(400px);
+ transform: perspective(400px);
+ -webkit-animation-timing-function: ease-in;
+ animation-timing-function: ease-in; } }
+@keyframes flip {
+ from {
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
+ transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
+ -webkit-animation-timing-function: ease-out;
+ animation-timing-function: ease-out; }
+ 40% {
+ -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
+ transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
+ -webkit-animation-timing-function: ease-out;
+ animation-timing-function: ease-out; }
+ 50% {
+ -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
+ transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
+ -webkit-animation-timing-function: ease-in;
+ animation-timing-function: ease-in; }
+ 80% {
+ -webkit-transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
+ transform: perspective(400px) scale3d(0.95, 0.95, 0.95);
+ -webkit-animation-timing-function: ease-in;
+ animation-timing-function: ease-in; }
+ to {
+ -webkit-transform: perspective(400px);
+ transform: perspective(400px);
+ -webkit-animation-timing-function: ease-in;
+ animation-timing-function: ease-in; } }
+.animated.flip {
+ -webkit-backface-visibility: visible;
+ backface-visibility: visible;
+ -webkit-animation-name: flip;
+ animation-name: flip; }
+
+@-webkit-keyframes flipInX {
+ from {
+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
+ transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
+ -webkit-animation-timing-function: ease-in;
+ animation-timing-function: ease-in;
+ opacity: 0; }
+ 40% {
+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
+ transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
+ -webkit-animation-timing-function: ease-in;
+ animation-timing-function: ease-in; }
+ 60% {
+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
+ transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
+ opacity: 1; }
+ 80% {
+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
+ transform: perspective(400px) rotate3d(1, 0, 0, -5deg); }
+ to {
+ -webkit-transform: perspective(400px);
+ transform: perspective(400px); } }
+@keyframes flipInX {
+ from {
+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
+ transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
+ -webkit-animation-timing-function: ease-in;
+ animation-timing-function: ease-in;
+ opacity: 0; }
+ 40% {
+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
+ transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
+ -webkit-animation-timing-function: ease-in;
+ animation-timing-function: ease-in; }
+ 60% {
+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
+ transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
+ opacity: 1; }
+ 80% {
+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
+ transform: perspective(400px) rotate3d(1, 0, 0, -5deg); }
+ to {
+ -webkit-transform: perspective(400px);
+ transform: perspective(400px); } }
+.flipInX {
+ -webkit-backface-visibility: visible !important;
+ backface-visibility: visible !important;
+ -webkit-animation-name: flipInX;
+ animation-name: flipInX; }
+
+@-webkit-keyframes flipInY {
+ from {
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
+ transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
+ -webkit-animation-timing-function: ease-in;
+ animation-timing-function: ease-in;
+ opacity: 0; }
+ 40% {
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
+ transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
+ -webkit-animation-timing-function: ease-in;
+ animation-timing-function: ease-in; }
+ 60% {
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
+ transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
+ opacity: 1; }
+ 80% {
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
+ transform: perspective(400px) rotate3d(0, 1, 0, -5deg); }
+ to {
+ -webkit-transform: perspective(400px);
+ transform: perspective(400px); } }
+@keyframes flipInY {
+ from {
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
+ transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
+ -webkit-animation-timing-function: ease-in;
+ animation-timing-function: ease-in;
+ opacity: 0; }
+ 40% {
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
+ transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
+ -webkit-animation-timing-function: ease-in;
+ animation-timing-function: ease-in; }
+ 60% {
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
+ transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
+ opacity: 1; }
+ 80% {
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
+ transform: perspective(400px) rotate3d(0, 1, 0, -5deg); }
+ to {
+ -webkit-transform: perspective(400px);
+ transform: perspective(400px); } }
+.flipInY {
+ -webkit-backface-visibility: visible !important;
+ backface-visibility: visible !important;
+ -webkit-animation-name: flipInY;
+ animation-name: flipInY; }
+
+@-webkit-keyframes flipOutX {
+ from {
+ -webkit-transform: perspective(400px);
+ transform: perspective(400px); }
+ 30% {
+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
+ transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
+ opacity: 1; }
+ to {
+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
+ transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
+ opacity: 0; } }
+@keyframes flipOutX {
+ from {
+ -webkit-transform: perspective(400px);
+ transform: perspective(400px); }
+ 30% {
+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
+ transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
+ opacity: 1; }
+ to {
+ -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
+ transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
+ opacity: 0; } }
+.flipOutX {
+ -webkit-animation-name: flipOutX;
+ animation-name: flipOutX;
+ -webkit-backface-visibility: visible !important;
+ backface-visibility: visible !important; }
+
+@-webkit-keyframes flipOutY {
+ from {
+ -webkit-transform: perspective(400px);
+ transform: perspective(400px); }
+ 30% {
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
+ transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
+ opacity: 1; }
+ to {
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
+ transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
+ opacity: 0; } }
+@keyframes flipOutY {
+ from {
+ -webkit-transform: perspective(400px);
+ transform: perspective(400px); }
+ 30% {
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
+ transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
+ opacity: 1; }
+ to {
+ -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
+ transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
+ opacity: 0; } }
+.flipOutY {
+ -webkit-backface-visibility: visible !important;
+ backface-visibility: visible !important;
+ -webkit-animation-name: flipOutY;
+ animation-name: flipOutY; }
+
+@-webkit-keyframes lightSpeedIn {
+ from {
+ -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
+ transform: translate3d(100%, 0, 0) skewX(-30deg);
+ opacity: 0; }
+ 60% {
+ -webkit-transform: skewX(20deg);
+ transform: skewX(20deg);
+ opacity: 1; }
+ 80% {
+ -webkit-transform: skewX(-5deg);
+ transform: skewX(-5deg);
+ opacity: 1; }
+ to {
+ -webkit-transform: none;
+ transform: none;
+ opacity: 1; } }
+@keyframes lightSpeedIn {
+ from {
+ -webkit-transform: translate3d(100%, 0, 0) skewX(-30deg);
+ transform: translate3d(100%, 0, 0) skewX(-30deg);
+ opacity: 0; }
+ 60% {
+ -webkit-transform: skewX(20deg);
+ transform: skewX(20deg);
+ opacity: 1; }
+ 80% {
+ -webkit-transform: skewX(-5deg);
+ transform: skewX(-5deg);
+ opacity: 1; }
+ to {
+ -webkit-transform: none;
+ transform: none;
+ opacity: 1; } }
+.lightSpeedIn {
+ -webkit-animation-name: lightSpeedIn;
+ animation-name: lightSpeedIn;
+ -webkit-animation-timing-function: ease-out;
+ animation-timing-function: ease-out; }
+
+@-webkit-keyframes lightSpeedOut {
+ from {
+ opacity: 1; }
+ to {
+ -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
+ transform: translate3d(100%, 0, 0) skewX(30deg);
+ opacity: 0; } }
+@keyframes lightSpeedOut {
+ from {
+ opacity: 1; }
+ to {
+ -webkit-transform: translate3d(100%, 0, 0) skewX(30deg);
+ transform: translate3d(100%, 0, 0) skewX(30deg);
+ opacity: 0; } }
+.lightSpeedOut {
+ -webkit-animation-name: lightSpeedOut;
+ animation-name: lightSpeedOut;
+ -webkit-animation-timing-function: ease-in;
+ animation-timing-function: ease-in; }
+
+@-webkit-keyframes rotateIn {
+ from {
+ -webkit-transform-origin: center;
+ transform-origin: center;
+ -webkit-transform: rotate3d(0, 0, 1, -200deg);
+ transform: rotate3d(0, 0, 1, -200deg);
+ opacity: 0; }
+ to {
+ -webkit-transform-origin: center;
+ transform-origin: center;
+ -webkit-transform: none;
+ transform: none;
+ opacity: 1; } }
+@keyframes rotateIn {
+ from {
+ -webkit-transform-origin: center;
+ transform-origin: center;
+ -webkit-transform: rotate3d(0, 0, 1, -200deg);
+ transform: rotate3d(0, 0, 1, -200deg);
+ opacity: 0; }
+ to {
+ -webkit-transform-origin: center;
+ transform-origin: center;
+ -webkit-transform: none;
+ transform: none;
+ opacity: 1; } }
+.rotateIn {
+ -webkit-animation-name: rotateIn;
+ animation-name: rotateIn; }
+
+@-webkit-keyframes rotateInDownLeft {
+ from {
+ -webkit-transform-origin: left bottom;
+ transform-origin: left bottom;
+ -webkit-transform: rotate3d(0, 0, 1, -45deg);
+ transform: rotate3d(0, 0, 1, -45deg);
+ opacity: 0; }
+ to {
+ -webkit-transform-origin: left bottom;
+ transform-origin: left bottom;
+ -webkit-transform: none;
+ transform: none;
+ opacity: 1; } }
+@keyframes rotateInDownLeft {
+ from {
+ -webkit-transform-origin: left bottom;
+ transform-origin: left bottom;
+ -webkit-transform: rotate3d(0, 0, 1, -45deg);
+ transform: rotate3d(0, 0, 1, -45deg);
+ opacity: 0; }
+ to {
+ -webkit-transform-origin: left bottom;
+ transform-origin: left bottom;
+ -webkit-transform: none;
+ transform: none;
+ opacity: 1; } }
+.rotateInDownLeft {
+ -webkit-animation-name: rotateInDownLeft;
+ animation-name: rotateInDownLeft; }
+
+@-webkit-keyframes rotateInDownRight {
+ from {
+ -webkit-transform-origin: right bottom;
+ transform-origin: right bottom;
+ -webkit-transform: rotate3d(0, 0, 1, 45deg);
+ transform: rotate3d(0, 0, 1, 45deg);
+ opacity: 0; }
+ to {
+ -webkit-transform-origin: right bottom;
+ transform-origin: right bottom;
+ -webkit-transform: none;
+ transform: none;
+ opacity: 1; } }
+@keyframes rotateInDownRight {
+ from {
+ -webkit-transform-origin: right bottom;
+ transform-origin: right bottom;
+ -webkit-transform: rotate3d(0, 0, 1, 45deg);
+ transform: rotate3d(0, 0, 1, 45deg);
+ opacity: 0; }
+ to {
+ -webkit-transform-origin: right bottom;
+ transform-origin: right bottom;
+ -webkit-transform: none;
+ transform: none;
+ opacity: 1; } }
+.rotateInDownRight {
+ -webkit-animation-name: rotateInDownRight;
+ animation-name: rotateInDownRight; }
+
+@-webkit-keyframes rotateInUpLeft {
+ from {
+ -webkit-transform-origin: left bottom;
+ transform-origin: left bottom;
+ -webkit-transform: rotate3d(0, 0, 1, 45deg);
+ transform: rotate3d(0, 0, 1, 45deg);
+ opacity: 0; }
+ to {
+ -webkit-transform-origin: left bottom;
+ transform-origin: left bottom;
+ -webkit-transform: none;
+ transform: none;
+ opacity: 1; } }
+@keyframes rotateInUpLeft {
+ from {
+ -webkit-transform-origin: left bottom;
+ transform-origin: left bottom;
+ -webkit-transform: rotate3d(0, 0, 1, 45deg);
+ transform: rotate3d(0, 0, 1, 45deg);
+ opacity: 0; }
+ to {
+ -webkit-transform-origin: left bottom;
+ transform-origin: left bottom;
+ -webkit-transform: none;
+ transform: none;
+ opacity: 1; } }
+.rotateInUpLeft {
+ -webkit-animation-name: rotateInUpLeft;
+ animation-name: rotateInUpLeft; }
+
+@-webkit-keyframes rotateInUpRight {
+ from {
+ -webkit-transform-origin: right bottom;
+ transform-origin: right bottom;
+ -webkit-transform: rotate3d(0, 0, 1, -90deg);
+ transform: rotate3d(0, 0, 1, -90deg);
+ opacity: 0; }
+ to {
+ -webkit-transform-origin: right bottom;
+ transform-origin: right bottom;
+ -webkit-transform: none;
+ transform: none;
+ opacity: 1; } }
+@keyframes rotateInUpRight {
+ from {
+ -webkit-transform-origin: right bottom;
+ transform-origin: right bottom;
+ -webkit-transform: rotate3d(0, 0, 1, -90deg);
+ transform: rotate3d(0, 0, 1, -90deg);
+ opacity: 0; }
+ to {
+ -webkit-transform-origin: right bottom;
+ transform-origin: right bottom;
+ -webkit-transform: none;
+ transform: none;
+ opacity: 1; } }
+.rotateInUpRight {
+ -webkit-animation-name: rotateInUpRight;
+ animation-name: rotateInUpRight; }
+
+@-webkit-keyframes rotateOut {
+ from {
+ -webkit-transform-origin: center;
+ transform-origin: center;
+ opacity: 1; }
+ to {
+ -webkit-transform-origin: center;
+ transform-origin: center;
+ -webkit-transform: rotate3d(0, 0, 1, 200deg);
+ transform: rotate3d(0, 0, 1, 200deg);
+ opacity: 0; } }
+@keyframes rotateOut {
+ from {
+ -webkit-transform-origin: center;
+ transform-origin: center;
+ opacity: 1; }
+ to {
+ -webkit-transform-origin: center;
+ transform-origin: center;
+ -webkit-transform: rotate3d(0, 0, 1, 200deg);
+ transform: rotate3d(0, 0, 1, 200deg);
+ opacity: 0; } }
+.rotateOut {
+ -webkit-animation-name: rotateOut;
+ animation-name: rotateOut; }
+
+@-webkit-keyframes rotateOutDownLeft {
+ from {
+ -webkit-transform-origin: left bottom;
+ transform-origin: left bottom;
+ opacity: 1; }
+ to {
+ -webkit-transform-origin: left bottom;
+ transform-origin: left bottom;
+ -webkit-transform: rotate3d(0, 0, 1, 45deg);
+ transform: rotate3d(0, 0, 1, 45deg);
+ opacity: 0; } }
+@keyframes rotateOutDownLeft {
+ from {
+ -webkit-transform-origin: left bottom;
+ transform-origin: left bottom;
+ opacity: 1; }
+ to {
+ -webkit-transform-origin: left bottom;
+ transform-origin: left bottom;
+ -webkit-transform: rotate3d(0, 0, 1, 45deg);
+ transform: rotate3d(0, 0, 1, 45deg);
+ opacity: 0; } }
+.rotateOutDownLeft {
+ -webkit-animation-name: rotateOutDownLeft;
+ animation-name: rotateOutDownLeft; }
+
+@-webkit-keyframes rotateOutDownRight {
+ from {
+ -webkit-transform-origin: right bottom;
+ transform-origin: right bottom;
+ opacity: 1; }
+ to {
+ -webkit-transform-origin: right bottom;
+ transform-origin: right bottom;
+ -webkit-transform: rotate3d(0, 0, 1, -45deg);
+ transform: rotate3d(0, 0, 1, -45deg);
+ opacity: 0; } }
+@keyframes rotateOutDownRight {
+ from {
+ -webkit-transform-origin: right bottom;
+ transform-origin: right bottom;
+ opacity: 1; }
+ to {
+ -webkit-transform-origin: right bottom;
+ transform-origin: right bottom;
+ -webkit-transform: rotate3d(0, 0, 1, -45deg);
+ transform: rotate3d(0, 0, 1, -45deg);
+ opacity: 0; } }
+.rotateOutDownRight {
+ -webkit-animation-name: rotateOutDownRight;
+ animation-name: rotateOutDownRight; }
+
+@-webkit-keyframes rotateOutUpLeft {
+ from {
+ -webkit-transform-origin: left bottom;
+ transform-origin: left bottom;
+ opacity: 1; }
+ to {
+ -webkit-transform-origin: left bottom;
+ transform-origin: left bottom;
+ -webkit-transform: rotate3d(0, 0, 1, -45deg);
+ transform: rotate3d(0, 0, 1, -45deg);
+ opacity: 0; } }
+@keyframes rotateOutUpLeft {
+ from {
+ -webkit-transform-origin: left bottom;
+ transform-origin: left bottom;
+ opacity: 1; }
+ to {
+ -webkit-transform-origin: left bottom;
+ transform-origin: left bottom;
+ -webkit-transform: rotate3d(0, 0, 1, -45deg);
+ transform: rotate3d(0, 0, 1, -45deg);
+ opacity: 0; } }
+.rotateOutUpLeft {
+ -webkit-animation-name: rotateOutUpLeft;
+ animation-name: rotateOutUpLeft; }
+
+@-webkit-keyframes rotateOutUpRight {
+ from {
+ -webkit-transform-origin: right bottom;
+ transform-origin: right bottom;
+ opacity: 1; }
+ to {
+ -webkit-transform-origin: right bottom;
+ transform-origin: right bottom;
+ -webkit-transform: rotate3d(0, 0, 1, 90deg);
+ transform: rotate3d(0, 0, 1, 90deg);
+ opacity: 0; } }
+@keyframes rotateOutUpRight {
+ from {
+ -webkit-transform-origin: right bottom;
+ transform-origin: right bottom;
+ opacity: 1; }
+ to {
+ -webkit-transform-origin: right bottom;
+ transform-origin: right bottom;
+ -webkit-transform: rotate3d(0, 0, 1, 90deg);
+ transform: rotate3d(0, 0, 1, 90deg);
+ opacity: 0; } }
+.rotateOutUpRight {
+ -webkit-animation-name: rotateOutUpRight;
+ animation-name: rotateOutUpRight; }
+
+@-webkit-keyframes hinge {
+ 0% {
+ -webkit-transform-origin: top left;
+ transform-origin: top left;
+ -webkit-animation-timing-function: ease-in-out;
+ animation-timing-function: ease-in-out; }
+ 20%, 60% {
+ -webkit-transform: rotate3d(0, 0, 1, 80deg);
+ transform: rotate3d(0, 0, 1, 80deg);
+ -webkit-transform-origin: top left;
+ transform-origin: top left;
+ -webkit-animation-timing-function: ease-in-out;
+ animation-timing-function: ease-in-out; }
+ 40%, 80% {
+ -webkit-transform: rotate3d(0, 0, 1, 60deg);
+ transform: rotate3d(0, 0, 1, 60deg);
+ -webkit-transform-origin: top left;
+ transform-origin: top left;
+ -webkit-animation-timing-function: ease-in-out;
+ animation-timing-function: ease-in-out;
+ opacity: 1; }
+ to {
+ -webkit-transform: translate3d(0, 700px, 0);
+ transform: translate3d(0, 700px, 0);
+ opacity: 0; } }
+@keyframes hinge {
+ 0% {
+ -webkit-transform-origin: top left;
+ transform-origin: top left;
+ -webkit-animation-timing-function: ease-in-out;
+ animation-timing-function: ease-in-out; }
+ 20%, 60% {
+ -webkit-transform: rotate3d(0, 0, 1, 80deg);
+ transform: rotate3d(0, 0, 1, 80deg);
+ -webkit-transform-origin: top left;
+ transform-origin: top left;
+ -webkit-animation-timing-function: ease-in-out;
+ animation-timing-function: ease-in-out; }
+ 40%, 80% {
+ -webkit-transform: rotate3d(0, 0, 1, 60deg);
+ transform: rotate3d(0, 0, 1, 60deg);
+ -webkit-transform-origin: top left;
+ transform-origin: top left;
+ -webkit-animation-timing-function: ease-in-out;
+ animation-timing-function: ease-in-out;
+ opacity: 1; }
+ to {
+ -webkit-transform: translate3d(0, 700px, 0);
+ transform: translate3d(0, 700px, 0);
+ opacity: 0; } }
+.hinge {
+ -webkit-animation-name: hinge;
+ animation-name: hinge; }
+
+/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
+@-webkit-keyframes rollIn {
+ from {
+ opacity: 0;
+ -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
+ transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); }
+ to {
+ opacity: 1;
+ -webkit-transform: none;
+ transform: none; } }
+@keyframes rollIn {
+ from {
+ opacity: 0;
+ -webkit-transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
+ transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg); }
+ to {
+ opacity: 1;
+ -webkit-transform: none;
+ transform: none; } }
+.rollIn {
+ -webkit-animation-name: rollIn;
+ animation-name: rollIn; }
+
+/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */
+@-webkit-keyframes rollOut {
+ from {
+ opacity: 1; }
+ to {
+ opacity: 0;
+ -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
+ transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); } }
+@keyframes rollOut {
+ from {
+ opacity: 1; }
+ to {
+ opacity: 0;
+ -webkit-transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
+ transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg); } }
+.rollOut {
+ -webkit-animation-name: rollOut;
+ animation-name: rollOut; }
+
+@-webkit-keyframes zoomIn {
+ from {
+ opacity: 0;
+ -webkit-transform: scale3d(0.3, 0.3, 0.3);
+ transform: scale3d(0.3, 0.3, 0.3); }
+ 50% {
+ opacity: 1; } }
+@keyframes zoomIn {
+ from {
+ opacity: 0;
+ -webkit-transform: scale3d(0.3, 0.3, 0.3);
+ transform: scale3d(0.3, 0.3, 0.3); }
+ 50% {
+ opacity: 1; } }
+.zoomIn {
+ -webkit-animation-name: zoomIn;
+ animation-name: zoomIn; }
+
+@-webkit-keyframes zoomInDown {
+ from {
+ opacity: 0;
+ -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
+ transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
+ -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
+ animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
+ 60% {
+ opacity: 1;
+ -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
+ transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }
+@keyframes zoomInDown {
+ from {
+ opacity: 0;
+ -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
+ transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
+ -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
+ animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
+ 60% {
+ opacity: 1;
+ -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
+ transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }
+.zoomInDown {
+ -webkit-animation-name: zoomInDown;
+ animation-name: zoomInDown; }
+
+@-webkit-keyframes zoomInLeft {
+ from {
+ opacity: 0;
+ -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
+ transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
+ -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
+ animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
+ 60% {
+ opacity: 1;
+ -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
+ transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }
+@keyframes zoomInLeft {
+ from {
+ opacity: 0;
+ -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
+ transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
+ -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
+ animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
+ 60% {
+ opacity: 1;
+ -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
+ transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }
+.zoomInLeft {
+ -webkit-animation-name: zoomInLeft;
+ animation-name: zoomInLeft; }
+
+@-webkit-keyframes zoomInRight {
+ from {
+ opacity: 0;
+ -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
+ transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
+ -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
+ animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
+ 60% {
+ opacity: 1;
+ -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
+ transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }
+@keyframes zoomInRight {
+ from {
+ opacity: 0;
+ -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
+ transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
+ -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
+ animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
+ 60% {
+ opacity: 1;
+ -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
+ transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }
+.zoomInRight {
+ -webkit-animation-name: zoomInRight;
+ animation-name: zoomInRight; }
+
+@-webkit-keyframes zoomInUp {
+ from {
+ opacity: 0;
+ -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
+ transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
+ -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
+ animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
+ 60% {
+ opacity: 1;
+ -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
+ transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }
+@keyframes zoomInUp {
+ from {
+ opacity: 0;
+ -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
+ transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
+ -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
+ animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
+ 60% {
+ opacity: 1;
+ -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
+ transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }
+.zoomInUp {
+ -webkit-animation-name: zoomInUp;
+ animation-name: zoomInUp; }
+
+@-webkit-keyframes zoomOut {
+ from {
+ opacity: 1; }
+ 50% {
+ opacity: 0;
+ -webkit-transform: scale3d(0.3, 0.3, 0.3);
+ transform: scale3d(0.3, 0.3, 0.3); }
+ to {
+ opacity: 0; } }
+@keyframes zoomOut {
+ from {
+ opacity: 1; }
+ 50% {
+ opacity: 0;
+ -webkit-transform: scale3d(0.3, 0.3, 0.3);
+ transform: scale3d(0.3, 0.3, 0.3); }
+ to {
+ opacity: 0; } }
+.zoomOut {
+ -webkit-animation-name: zoomOut;
+ animation-name: zoomOut; }
+
+@-webkit-keyframes zoomOutDown {
+ 40% {
+ opacity: 1;
+ -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
+ transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
+ -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
+ animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
+ to {
+ opacity: 0;
+ -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
+ transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
+ -webkit-transform-origin: center bottom;
+ transform-origin: center bottom;
+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }
+@keyframes zoomOutDown {
+ 40% {
+ opacity: 1;
+ -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
+ transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
+ -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
+ animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
+ to {
+ opacity: 0;
+ -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
+ transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
+ -webkit-transform-origin: center bottom;
+ transform-origin: center bottom;
+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }
+.zoomOutDown {
+ -webkit-animation-name: zoomOutDown;
+ animation-name: zoomOutDown; }
+
+@-webkit-keyframes zoomOutLeft {
+ 40% {
+ opacity: 1;
+ -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
+ transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); }
+ to {
+ opacity: 0;
+ -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
+ transform: scale(0.1) translate3d(-2000px, 0, 0);
+ -webkit-transform-origin: left center;
+ transform-origin: left center; } }
+@keyframes zoomOutLeft {
+ 40% {
+ opacity: 1;
+ -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
+ transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); }
+ to {
+ opacity: 0;
+ -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0);
+ transform: scale(0.1) translate3d(-2000px, 0, 0);
+ -webkit-transform-origin: left center;
+ transform-origin: left center; } }
+.zoomOutLeft {
+ -webkit-animation-name: zoomOutLeft;
+ animation-name: zoomOutLeft; }
+
+@-webkit-keyframes zoomOutRight {
+ 40% {
+ opacity: 1;
+ -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
+ transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); }
+ to {
+ opacity: 0;
+ -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
+ transform: scale(0.1) translate3d(2000px, 0, 0);
+ -webkit-transform-origin: right center;
+ transform-origin: right center; } }
+@keyframes zoomOutRight {
+ 40% {
+ opacity: 1;
+ -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
+ transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0); }
+ to {
+ opacity: 0;
+ -webkit-transform: scale(0.1) translate3d(2000px, 0, 0);
+ transform: scale(0.1) translate3d(2000px, 0, 0);
+ -webkit-transform-origin: right center;
+ transform-origin: right center; } }
+.zoomOutRight {
+ -webkit-animation-name: zoomOutRight;
+ animation-name: zoomOutRight; }
+
+@-webkit-keyframes zoomOutUp {
+ 40% {
+ opacity: 1;
+ -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
+ transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
+ -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
+ animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
+ to {
+ opacity: 0;
+ -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
+ transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
+ -webkit-transform-origin: center bottom;
+ transform-origin: center bottom;
+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }
+@keyframes zoomOutUp {
+ 40% {
+ opacity: 1;
+ -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
+ transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
+ -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
+ animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
+ to {
+ opacity: 0;
+ -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
+ transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
+ -webkit-transform-origin: center bottom;
+ transform-origin: center bottom;
+ -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
+ animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); } }
+.zoomOutUp {
+ -webkit-animation-name: zoomOutUp;
+ animation-name: zoomOutUp; }
+
+@-webkit-keyframes slideInDown {
+ from {
+ -webkit-transform: translate3d(0, -100%, 0);
+ transform: translate3d(0, -100%, 0);
+ visibility: visible; }
+ to {
+ -webkit-transform: translate3d(0, 0, 0);
+ transform: translate3d(0, 0, 0); } }
+@keyframes slideInDown {
+ from {
+ -webkit-transform: translate3d(0, -100%, 0);
+ transform: translate3d(0, -100%, 0);
+ visibility: visible; }
+ to {
+ -webkit-transform: translate3d(0, 0, 0);
+ transform: translate3d(0, 0, 0); } }
+.slideInDown {
+ -webkit-animation-name: slideInDown;
+ animation-name: slideInDown; }
+
+@-webkit-keyframes slideInLeft {
+ from {
+ -webkit-transform: translate3d(-100%, 0, 0);
+ transform: translate3d(-100%, 0, 0);
+ visibility: visible; }
+ to {
+ -webkit-transform: translate3d(0, 0, 0);
+ transform: translate3d(0, 0, 0); } }
+@keyframes slideInLeft {
+ from {
+ -webkit-transform: translate3d(-100%, 0, 0);
+ transform: translate3d(-100%, 0, 0);
+ visibility: visible; }
+ to {
+ -webkit-transform: translate3d(0, 0, 0);
+ transform: translate3d(0, 0, 0); } }
+.slideInLeft {
+ -webkit-animation-name: slideInLeft;
+ animation-name: slideInLeft; }
+
+@-webkit-keyframes slideInRight {
+ from {
+ -webkit-transform: translate3d(100%, 0, 0);
+ transform: translate3d(100%, 0, 0);
+ visibility: visible; }
+ to {
+ -webkit-transform: translate3d(0, 0, 0);
+ transform: translate3d(0, 0, 0); } }
+@keyframes slideInRight {
+ from {
+ -webkit-transform: translate3d(100%, 0, 0);
+ transform: translate3d(100%, 0, 0);
+ visibility: visible; }
+ to {
+ -webkit-transform: translate3d(0, 0, 0);
+ transform: translate3d(0, 0, 0); } }
+.slideInRight {
+ -webkit-animation-name: slideInRight;
+ animation-name: slideInRight; }
+
+@-webkit-keyframes slideInUp {
+ from {
+ -webkit-transform: translate3d(0, 100%, 0);
+ transform: translate3d(0, 100%, 0);
+ visibility: visible; }
+ to {
+ -webkit-transform: translate3d(0, 0, 0);
+ transform: translate3d(0, 0, 0); } }
+@keyframes slideInUp {
+ from {
+ -webkit-transform: translate3d(0, 100%, 0);
+ transform: translate3d(0, 100%, 0);
+ visibility: visible; }
+ to {
+ -webkit-transform: translate3d(0, 0, 0);
+ transform: translate3d(0, 0, 0); } }
+.slideInUp {
+ -webkit-animation-name: slideInUp;
+ animation-name: slideInUp; }
+
+@-webkit-keyframes slideOutDown {
+ from {
+ -webkit-transform: translate3d(0, 0, 0);
+ transform: translate3d(0, 0, 0); }
+ to {
+ visibility: hidden;
+ -webkit-transform: translate3d(0, 100%, 0);
+ transform: translate3d(0, 100%, 0); } }
+@keyframes slideOutDown {
+ from {
+ -webkit-transform: translate3d(0, 0, 0);
+ transform: translate3d(0, 0, 0); }
+ to {
+ visibility: hidden;
+ -webkit-transform: translate3d(0, 100%, 0);
+ transform: translate3d(0, 100%, 0); } }
+.slideOutDown {
+ -webkit-animation-name: slideOutDown;
+ animation-name: slideOutDown; }
+
+@-webkit-keyframes slideOutLeft {
+ from {
+ -webkit-transform: translate3d(0, 0, 0);
+ transform: translate3d(0, 0, 0); }
+ to {
+ visibility: hidden;
+ -webkit-transform: translate3d(-100%, 0, 0);
+ transform: translate3d(-100%, 0, 0); } }
+@keyframes slideOutLeft {
+ from {
+ -webkit-transform: translate3d(0, 0, 0);
+ transform: translate3d(0, 0, 0); }
+ to {
+ visibility: hidden;
+ -webkit-transform: translate3d(-100%, 0, 0);
+ transform: translate3d(-100%, 0, 0); } }
+.slideOutLeft {
+ -webkit-animation-name: slideOutLeft;
+ animation-name: slideOutLeft; }
+
+@-webkit-keyframes slideOutRight {
+ from {
+ -webkit-transform: translate3d(0, 0, 0);
+ transform: translate3d(0, 0, 0); }
+ to {
+ visibility: hidden;
+ -webkit-transform: translate3d(100%, 0, 0);
+ transform: translate3d(100%, 0, 0); } }
+@keyframes slideOutRight {
+ from {
+ -webkit-transform: translate3d(0, 0, 0);
+ transform: translate3d(0, 0, 0); }
+ to {
+ visibility: hidden;
+ -webkit-transform: translate3d(100%, 0, 0);
+ transform: translate3d(100%, 0, 0); } }
+.slideOutRight {
+ -webkit-animation-name: slideOutRight;
+ animation-name: slideOutRight; }
+
+@-webkit-keyframes slideOutUp {
+ from {
+ -webkit-transform: translate3d(0, 0, 0);
+ transform: translate3d(0, 0, 0); }
+ to {
+ visibility: hidden;
+ -webkit-transform: translate3d(0, -100%, 0);
+ transform: translate3d(0, -100%, 0); } }
+@keyframes slideOutUp {
+ from {
+ -webkit-transform: translate3d(0, 0, 0);
+ transform: translate3d(0, 0, 0); }
+ to {
+ visibility: hidden;
+ -webkit-transform: translate3d(0, -100%, 0);
+ transform: translate3d(0, -100%, 0); } }
+.slideOutUp {
+ -webkit-animation-name: slideOutUp;
+ animation-name: slideOutUp; }
+
+/*# sourceMappingURL=animate.css.map */
diff --git a/article.css b/article.css
new file mode 100644
index 0000000..6a28731
--- /dev/null
+++ b/article.css
@@ -0,0 +1,49 @@
+/* Global */
+/* Content Container */
+/* Content box */
+/* Navigation */
+/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
+article {
+ background: #fff;
+ padding: 5px;
+ margin: 0; }
+ article a {
+ color: #8ea4ff;
+ border-bottom: 1px dotted #8ea4ff; }
+ article a:hover {
+ border-bottom: none; }
+ article p {
+ line-height: 1.5em; }
+ article ol, article ul {
+ margin-left: 30px; }
+ article ul {
+ list-style: disc; }
+ article blockquote {
+ margin: 10px 0 10px 0; }
+ article blockquote p:last-child {
+ margin-bottom: 0; }
+ article table {
+ border-collapse: collapse;
+ border: 1px solid #999; }
+ article table th, article table td {
+ padding: 5px;
+ border: 1px solid #999; }
+ article table tr:nth-child(2n) {
+ background: #eee; }
+
+/*# sourceMappingURL=article.css.map */
diff --git a/badge.css b/badge.css
new file mode 100644
index 0000000..23cff36
--- /dev/null
+++ b/badge.css
@@ -0,0 +1,3 @@
+
+
+/*# sourceMappingURL=badge.css.map */
diff --git a/blockquote.css b/blockquote.css
new file mode 100644
index 0000000..d6baf0a
--- /dev/null
+++ b/blockquote.css
@@ -0,0 +1,34 @@
+/* Global */
+/* Content Container */
+/* Content box */
+/* Navigation */
+/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
+blockquote {
+ border: 1px solid #d6d6d6;
+ background: #fff;
+ padding: 10px;
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+ -webkit-border-radius: 3px;
+ -moz-border-radius: 3px;
+ -ms-border-radius: 3px;
+ border-radius: 3px;
+ background-clip: padding-box; }
+
+/*# sourceMappingURL=blockquote.css.map */
diff --git a/breadcrumb.css b/breadcrumb.css
new file mode 100644
index 0000000..d890820
--- /dev/null
+++ b/breadcrumb.css
@@ -0,0 +1,77 @@
+/* Global */
+/* Content Container */
+/* Content box */
+/* Navigation */
+/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
+.crumbs-1 {
+ list-style: none;
+ overflow: hidden;
+ font-size: 12px; }
+ .crumbs-1 li {
+ background: #f5f5ff;
+ border: 1px solid #d6d6d6;
+ padding: 10px;
+ position: relative;
+ display: block;
+ float: left;
+ text-shadow: -1px -1px 1px #ffffff;
+ cursor: pointer;
+ -moz-box-shadow: inset 1px 1px 0px 0px #ffffff;
+ -webkit-box-shadow: inset 1px 1px 0px 0px #ffffff;
+ box-shadow: inset 1px 1px 0px 0px #ffffff; }
+ .crumbs-1 li:first-child {
+ -webkit-border-bottom-left-radius: 3px;
+ border-bottom-left-radius: 3px;
+ -webkit-border-top-left-radius: 3px;
+ border-top-left-radius: 3px;
+ background-clip: padding-box; }
+ .crumbs-1 li:not(.last):after, .crumbs-1 li:before {
+ content: " ";
+ display: block;
+ width: 0;
+ height: 0;
+ border-top: 18px solid transparent;
+ border-bottom: 17px solid transparent;
+ border-left: 14px solid #d6d6d6;
+ position: absolute;
+ top: 50%;
+ margin-top: -18px;
+ left: 100%; }
+ .crumbs-1 li:not(.last):after {
+ z-index: 2; }
+ .crumbs-1 li:before {
+ border-left-color: #d6d6d6;
+ margin-left: 1px;
+ z-index: 1; }
+ .crumbs-1 li.active:not(.last):after, .crumbs-1 li:hover:not(.last):after {
+ border-left: 14px solid #ffffff; }
+ .crumbs-1 .last {
+ padding-right: 20px;
+ -webkit-border-bottom-right-radius: 3px;
+ border-bottom-right-radius: 3px;
+ -webkit-border-top-right-radius: 3px;
+ border-top-right-radius: 3px;
+ background-clip: padding-box; }
+ .crumbs-1 .last:before {
+ border: none; }
+ .crumbs-1 .active {
+ cursor: default; }
+ .crumbs-1 .active, .crumbs-1 li:hover {
+ background: #fff; }
+
+/*# sourceMappingURL=breadcrumb.css.map */
diff --git a/button.css b/button.css
index aee396f..4dc1af6 100644
--- a/button.css
+++ b/button.css
@@ -1,130 +1,145 @@
-/* Global */
-/* Content Container */
-/* Content box */
-/* Navigation */
-/* Colors */
-.btn {
- cursor: pointer; }
-
-button, input[type="submit"], input[type="button"], a.button {
- border: 1px solid #b7b7b7;
- cursor: pointer;
- text-shadow: 1px 1px 1px #ffffff;
- min-width: 70px;
- height: 2rem;
- font-size: 0.9rem;
- background: #f1f1f1;
- -moz-box-shadow: inset 1px 1px 0px 0px #ffffff;
- -webkit-box-shadow: inset 1px 1px 0px 0px #ffffff;
- box-shadow: inset 1px 1px 0px 0px #ffffff; }
- button:hover, button :active, input[type="submit"]:hover, input[type="submit"] :active, input[type="button"]:hover, input[type="button"] :active, a.button:hover, a.button :active {
- text-shadow: -1px -1px 1px #ffffff;
- background: #d6d6d6; }
-
-button.red {
- color: #ffffff;
- text-shadow: 1px 1px 1px #696969;
- background: #d9645b;
- background: -moz-linear-gradient(top, #f17068 0, #d16059 100);
- background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #f17068), color-stop(100, #d16059));
- background: -webkit-linear-gradient(top, #f17068 0, #d16059 100);
- background: -o-linear-gradient(top, #f17068 0, #d16059 100);
- background: -ms-linear-gradient(top, #f17068 0, #d16059 100);
- background: linear-gradient(to bottom, #f17068 0, #d16059 100);
- -moz-box-shadow: inset 1px 1px 0px 0px #ff8d7c;
- -webkit-box-shadow: inset 1px 1px 0px 0px #ff8d7c;
- box-shadow: inset 1px 1px 0px 0px #ff8d7c; }
- button.red:hover, button.red :active {
- text-shadow: -1px -1px 1px #696969;
- background: #d9645b;
- background: -moz-linear-gradient(top, #d16059 0, #f17068 100);
- background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #d16059), color-stop(100, #f17068));
- background: -webkit-linear-gradient(top, #d16059 0, #f17068 100);
- background: -o-linear-gradient(top, #d16059 0, #f17068 100);
- background: -ms-linear-gradient(top, #d16059 0, #f17068 100);
- background: linear-gradient(to bottom, #d16059 0, #f17068 100); }
-
-button.green {
- color: #ffffff;
- text-shadow: 1px 1px 1px #696969;
- background: #90d99d;
- background: -moz-linear-gradient(top, #9df1ad 0, #77d17c 100);
- background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #9df1ad), color-stop(100, #77d17c));
- background: -webkit-linear-gradient(top, #9df1ad 0, #77d17c 100);
- background: -o-linear-gradient(top, #9df1ad 0, #77d17c 100);
- background: -ms-linear-gradient(top, #9df1ad 0, #77d17c 100);
- background: linear-gradient(to bottom, #9df1ad 0, #77d17c 100);
- -moz-box-shadow: inset 1px 1px 0px 0px #c8ffb6;
- -webkit-box-shadow: inset 1px 1px 0px 0px #c8ffb6;
- box-shadow: inset 1px 1px 0px 0px #c8ffb6; }
- button.green:hover, button.green :active {
- text-shadow: -1px -1px 1px #696969;
- background: #90d99d;
- background: -moz-linear-gradient(top, #77d17c 0, #9df1ad 100);
- background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #77d17c), color-stop(100, #9df1ad));
- background: -webkit-linear-gradient(top, #77d17c 0, #9df1ad 100);
- background: -o-linear-gradient(top, #77d17c 0, #9df1ad 100);
- background: -ms-linear-gradient(top, #77d17c 0, #9df1ad 100);
- background: linear-gradient(to bottom, #77d17c 0, #9df1ad 100); }
-
-button.blue {
- color: #ffffff;
- text-shadow: 1px 1px 1px #696969;
- background: #97afd9;
- background: -moz-linear-gradient(top, #beddf1 0, #7ba9d1 100);
- background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #beddf1), color-stop(100, #7ba9d1));
- background: -webkit-linear-gradient(top, #beddf1 0, #7ba9d1 100);
- background: -o-linear-gradient(top, #beddf1 0, #7ba9d1 100);
- background: -ms-linear-gradient(top, #beddf1 0, #7ba9d1 100);
- background: linear-gradient(to bottom, #beddf1 0, #7ba9d1 100);
- -moz-box-shadow: inset 1px 1px 0px 0px #cbf3ff;
- -webkit-box-shadow: inset 1px 1px 0px 0px #cbf3ff;
- box-shadow: inset 1px 1px 0px 0px #cbf3ff; }
- button.blue:hover, button.blue :active {
- text-shadow: -1px -1px 1px #696969;
- background: #97afd9;
- background: -moz-linear-gradient(top, #7ba9d1 0, #beddf1 100);
- background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #7ba9d1), color-stop(100, #beddf1));
- background: -webkit-linear-gradient(top, #7ba9d1 0, #beddf1 100);
- background: -o-linear-gradient(top, #7ba9d1 0, #beddf1 100);
- background: -ms-linear-gradient(top, #7ba9d1 0, #beddf1 100);
- background: linear-gradient(to bottom, #7ba9d1 0, #beddf1 100); }
-
-ul.btns {
- list-style: none;
- overflow: hidden;
- font-size: 12px; }
- ul.btns li {
- background: #f5f5ff;
- border-left: 1px solid #b7b7b7;
- border-top: 1px solid #b7b7b7;
- border-bottom: 1px solid #b7b7b7;
- float: left;
- text-shadow: -1px -1px 1px #ffffff;
- cursor: pointer;
- -moz-box-shadow: inset 1px 1px 0px 0px #ffffff;
- -webkit-box-shadow: inset 1px 1px 0px 0px #ffffff;
- box-shadow: inset 1px 1px 0px 0px #ffffff; }
- ul.btns li:last-child {
- border-right: 1px solid #b7b7b7; }
- ul.btns li:before {
- border-left-color: #b7b7b7;
- margin-left: 1px; }
- ul.btns a {
- display: block;
- padding: 10px; }
- ul.btns .active {
- cursor: default; }
- ul.btns .active, ul.btns li:hover {
- background: #ffffff; }
-
-button.simple {
- background: #f5f5ff;
- border: 1px solid #b7b7b7;
- text-shadow: -1px -1px 1px #ffffff;
- padding: 5px;
- min-width: 40px; }
- button.simple:hover {
- background: #ffffff; }
-
-/*# sourceMappingURL=button.css.map */
+/* Global */
+/* Content Container */
+/* Content box */
+/* Navigation */
+/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
+.btn {
+ cursor: pointer; }
+
+button, input[type="submit"], input[type="button"], a.button {
+ border: 1px solid #d6d6d6;
+ cursor: pointer;
+ text-shadow: 1px 1px 1px #ffffff;
+ min-width: 70px;
+ height: 2rem;
+ font-size: 0.9rem;
+ background: #f1f1f1;
+ -moz-box-shadow: inset 1px 1px 0px 0px #ffffff;
+ -webkit-box-shadow: inset 1px 1px 0px 0px #ffffff;
+ box-shadow: inset 1px 1px 0px 0px #ffffff; }
+ button:hover, button :active, input[type="submit"]:hover, input[type="submit"] :active, input[type="button"]:hover, input[type="button"] :active, a.button:hover, a.button :active {
+ text-shadow: -1px -1px 1px #ffffff;
+ background: #d6d6d6; }
+
+button.red {
+ color: #ffffff;
+ text-shadow: 1px 1px 1px #696969;
+ background: #d9645b;
+ background: -moz-linear-gradient(top, #f17068 0, #d16059 100);
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #f17068), color-stop(100, #d16059));
+ background: -webkit-linear-gradient(top, #f17068 0, #d16059 100);
+ background: -o-linear-gradient(top, #f17068 0, #d16059 100);
+ background: -ms-linear-gradient(top, #f17068 0, #d16059 100);
+ background: linear-gradient(to bottom, #f17068 0, #d16059 100);
+ -moz-box-shadow: inset 1px 1px 0px 0px #ff8d7c;
+ -webkit-box-shadow: inset 1px 1px 0px 0px #ff8d7c;
+ box-shadow: inset 1px 1px 0px 0px #ff8d7c; }
+ button.red:hover, button.red :active {
+ text-shadow: -1px -1px 1px #696969;
+ background: #d9645b;
+ background: -moz-linear-gradient(top, #d16059 0, #f17068 100);
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #d16059), color-stop(100, #f17068));
+ background: -webkit-linear-gradient(top, #d16059 0, #f17068 100);
+ background: -o-linear-gradient(top, #d16059 0, #f17068 100);
+ background: -ms-linear-gradient(top, #d16059 0, #f17068 100);
+ background: linear-gradient(to bottom, #d16059 0, #f17068 100); }
+
+button.green {
+ color: #ffffff;
+ text-shadow: 1px 1px 1px #696969;
+ background: #90d99d;
+ background: -moz-linear-gradient(top, #9df1ad 0, #77d17c 100);
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #9df1ad), color-stop(100, #77d17c));
+ background: -webkit-linear-gradient(top, #9df1ad 0, #77d17c 100);
+ background: -o-linear-gradient(top, #9df1ad 0, #77d17c 100);
+ background: -ms-linear-gradient(top, #9df1ad 0, #77d17c 100);
+ background: linear-gradient(to bottom, #9df1ad 0, #77d17c 100);
+ -moz-box-shadow: inset 1px 1px 0px 0px #c8ffb6;
+ -webkit-box-shadow: inset 1px 1px 0px 0px #c8ffb6;
+ box-shadow: inset 1px 1px 0px 0px #c8ffb6; }
+ button.green:hover, button.green :active {
+ text-shadow: -1px -1px 1px #696969;
+ background: #90d99d;
+ background: -moz-linear-gradient(top, #77d17c 0, #9df1ad 100);
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #77d17c), color-stop(100, #9df1ad));
+ background: -webkit-linear-gradient(top, #77d17c 0, #9df1ad 100);
+ background: -o-linear-gradient(top, #77d17c 0, #9df1ad 100);
+ background: -ms-linear-gradient(top, #77d17c 0, #9df1ad 100);
+ background: linear-gradient(to bottom, #77d17c 0, #9df1ad 100); }
+
+button.blue {
+ color: #ffffff;
+ text-shadow: 1px 1px 1px #696969;
+ background: #97afd9;
+ background: -moz-linear-gradient(top, #beddf1 0, #7ba9d1 100);
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #beddf1), color-stop(100, #7ba9d1));
+ background: -webkit-linear-gradient(top, #beddf1 0, #7ba9d1 100);
+ background: -o-linear-gradient(top, #beddf1 0, #7ba9d1 100);
+ background: -ms-linear-gradient(top, #beddf1 0, #7ba9d1 100);
+ background: linear-gradient(to bottom, #beddf1 0, #7ba9d1 100);
+ -moz-box-shadow: inset 1px 1px 0px 0px #cbf3ff;
+ -webkit-box-shadow: inset 1px 1px 0px 0px #cbf3ff;
+ box-shadow: inset 1px 1px 0px 0px #cbf3ff; }
+ button.blue:hover, button.blue :active {
+ text-shadow: -1px -1px 1px #696969;
+ background: #97afd9;
+ background: -moz-linear-gradient(top, #7ba9d1 0, #beddf1 100);
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #7ba9d1), color-stop(100, #beddf1));
+ background: -webkit-linear-gradient(top, #7ba9d1 0, #beddf1 100);
+ background: -o-linear-gradient(top, #7ba9d1 0, #beddf1 100);
+ background: -ms-linear-gradient(top, #7ba9d1 0, #beddf1 100);
+ background: linear-gradient(to bottom, #7ba9d1 0, #beddf1 100); }
+
+ul.btns {
+ list-style: none;
+ overflow: hidden;
+ font-size: 12px; }
+ ul.btns li {
+ background: #f5f5ff;
+ border-left: 1px solid #d6d6d6;
+ border-top: 1px solid #d6d6d6;
+ border-bottom: 1px solid #d6d6d6;
+ float: left;
+ text-shadow: -1px -1px 1px #ffffff;
+ cursor: pointer;
+ -moz-box-shadow: inset 1px 1px 0px 0px #ffffff;
+ -webkit-box-shadow: inset 1px 1px 0px 0px #ffffff;
+ box-shadow: inset 1px 1px 0px 0px #ffffff; }
+ ul.btns li:last-child {
+ border-right: 1px solid #d6d6d6; }
+ ul.btns li:before {
+ border-left-color: #d6d6d6;
+ margin-left: 1px; }
+ ul.btns a {
+ display: block;
+ padding: 10px; }
+ ul.btns .active {
+ cursor: default; }
+ ul.btns .active, ul.btns li:hover {
+ background: #fff; }
+
+button.simple {
+ background: #f1f1f1;
+ border: 1px solid #d6d6d6;
+ text-shadow: -1px -1px 1px #ffffff;
+ padding: 5px;
+ min-width: 40px; }
+ button.simple:hover {
+ background: #f1f1f1; }
+
+/*# sourceMappingURL=button.css.map */
diff --git a/canvas.css b/canvas.css
new file mode 100644
index 0000000..2d5fc6b
--- /dev/null
+++ b/canvas.css
@@ -0,0 +1,26 @@
+/* Global */
+/* Content Container */
+/* Content box */
+/* Navigation */
+/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
+canvas {
+ background: #fff;
+ border: 1px solid #d6d6d6;
+ user-select: none; }
+
+/*# sourceMappingURL=canvas.css.map */
diff --git a/clean.css b/clean.css
new file mode 100644
index 0000000..aae4c72
--- /dev/null
+++ b/clean.css
@@ -0,0 +1,85 @@
+.ok {
+ color: #5cff56; }
+
+.warning {
+ color: #ff4b41; }
+
+.favorite {
+ color: #d16059; }
+
+.green {
+ background: #61BD6D; }
+
+.red {
+ background: #D14841; }
+
+.blue {
+ background: #2C82C9; }
+
+.orange {
+ background: #FBA026; }
+
+.lightblue {
+ background: #54ACD2; }
+
+.yellow {
+ background: #FAC51C; }
+
+.purple {
+ background: #553982; }
+
+.pink {
+ background: #ffa6e3; }
+
+.grey {
+ background: #dcdcdc; }
+
+.darkred {
+ background: #B8312F; }
+
+.darkgreen {
+ background: #41A85F; }
+
+.darkblue {
+ background: #2969B0; }
+
+html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td, nav, section, iframe, label {
+ margin: 0;
+ padding: 0; }
+
+a, img, button {
+ outline: none; }
+
+a {
+ color: inherit;
+ text-decoration: none; }
+
+h1, h2, h3, h4, h5, h6 {
+ font-weight: normal; }
+
+ul {
+ list-style: none; }
+
+input, select, textarea, .textarea {
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+ appearance: none;
+ box-shadow: none; }
+ input:focus, select:focus, textarea:focus, .textarea:focus {
+ outline: none; }
+
+input[type=checkbox] {
+ margin-right: 5px; }
+
+button::-moz-focus-inner, input[type=submit]::-moz-focus-inner, input[type=button]::-moz-focus-inner {
+ border: 0; }
+
+table {
+ border-collapse: separate;
+ border-spacing: 0; }
+
+i {
+ font-style: normal; }
+
+/*# sourceMappingURL=clean.css.map */
diff --git a/clean.scss b/clean.scss
index a54869b..e2e791b 100644
--- a/clean.scss
+++ b/clean.scss
@@ -1,3 +1,5 @@
+@import "_mixins", "color";
+
html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td, nav, section, iframe, label {
margin: 0;
padding: 0;
diff --git a/color.css b/color.css
new file mode 100644
index 0000000..9f53d2f
--- /dev/null
+++ b/color.css
@@ -0,0 +1,46 @@
+.ok {
+ color: #5cff56; }
+
+.warning {
+ color: #ff4b41; }
+
+.favorite {
+ color: #d16059; }
+
+.green {
+ background: #61BD6D; }
+
+.red {
+ background: #D14841; }
+
+.blue {
+ background: #2C82C9; }
+
+.orange {
+ background: #FBA026; }
+
+.lightblue {
+ background: #54ACD2; }
+
+.yellow {
+ background: #FAC51C; }
+
+.purple {
+ background: #553982; }
+
+.pink {
+ background: #ffa6e3; }
+
+.grey {
+ background: #dcdcdc; }
+
+.darkred {
+ background: #B8312F; }
+
+.darkgreen {
+ background: #41A85F; }
+
+.darkblue {
+ background: #2969B0; }
+
+/*# sourceMappingURL=color.css.map */
diff --git a/default.css b/default.css
index dab02b7..7c3bd3e 100644
--- a/default.css
+++ b/default.css
@@ -1,62 +1,56 @@
-/* Global */
-/* Content Container */
-/* Content box */
-/* Navigation */
-/* Colors */
-body {
- background: #e7ebf3;
- font-family: Open Sans, sans-serif;
- font-size: 0.9em; }
-
-.clear {
- clear: both; }
-
-pre {
- background: #fff;
- -webkit-border-radius: 3px;
- -moz-border-radius: 3px;
- -ms-border-radius: 3px;
- border-radius: 3px;
- background-clip: padding-box;
- border: 1px solid #b7b7b7;
- padding: 5px;
- overflow-x: scroll;
- counter-reset: line;
- width: 100%;
- box-sizing: border-box; }
- pre span {
- display: block; }
- pre span:before {
- counter-increment: line;
- content: counter(line);
- display: inline-block;
- border-right: 1px solid #ddd;
- padding: 0 .5em;
- margin-right: .5em;
- color: #888;
- width: 30px; }
-
-article {
- background: #fff;
- padding: 5px;
- margin: 0; }
- article p {
- line-height: 1.5em; }
- article ol, article ul {
- margin-left: 30px; }
- article ul {
- list-style: disc; }
- article blockquote {
- margin: 10px 0 10px 0; }
- article blockquote p:last-child {
- margin-bottom: 0; }
- article table {
- border-collapse: collapse;
- border: 1px solid #999; }
- article table th, article table td {
- padding: 5px;
- border: 1px solid #999; }
- article table tr:nth-child(2n) {
- background: #eee; }
-
-/*# sourceMappingURL=default.css.map */
+/* Global */
+/* Content Container */
+/* Content box */
+/* Navigation */
+/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
+body {
+ background: #fff;
+ font-family: Open Sans, sans-serif;
+ font-size: 1rem; }
+
+.clear {
+ clear: both; }
+
+pre {
+ background: #fff;
+ -webkit-border-radius: 3px;
+ -moz-border-radius: 3px;
+ -ms-border-radius: 3px;
+ border-radius: 3px;
+ background-clip: padding-box;
+ border: 1px solid #d6d6d6;
+ padding: 5px;
+ overflow-x: scroll;
+ counter-reset: line;
+ width: 100%;
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box; }
+ pre span {
+ display: block; }
+ pre span:before {
+ counter-increment: line;
+ content: counter(line);
+ display: inline-block;
+ border-right: 1px solid #ddd;
+ padding: 0 .5em;
+ margin-right: .5em;
+ color: #888;
+ width: 30px; }
+
+/*# sourceMappingURL=default.css.map */
diff --git a/draggable.css b/draggable.css
new file mode 100644
index 0000000..bc08eac
--- /dev/null
+++ b/draggable.css
@@ -0,0 +1,4 @@
+*[draggable] {
+ cursor: move; }
+
+/*# sourceMappingURL=draggable.css.map */
diff --git a/form.css b/form.css
index 503583e..24fe3da 100644
--- a/form.css
+++ b/form.css
@@ -3,6 +3,21 @@
/* Content box */
/* Navigation */
/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
form li {
margin: 5px 0 5px 0; }
form td {
@@ -11,33 +26,17 @@ form td {
form td textarea + i {
vertical-align: top; }
form label {
- font-size: 0.9em;
+ font-size: 0.9rem;
color: #878787;
text-shadow: -1px -1px 1px #ffffff; }
form i + i {
margin-left: 3px; }
-form .inputPrefix {
- border-left: 1px solid #b7b7b7;
- border-top: 1px solid #b7b7b7;
- border-bottom: 1px solid #b7b7b7;
- line-height: 2em;
- height: 100%;
- background: #bebebe; }
form .layout td + td {
padding-left: 5px; }
form .list {
- font-size: 0.9em; }
+ font-size: 0.9rem; }
form .list td {
white-space: nowrap;
padding: 3px 5px 3px 5px; }
-form .ipt-wrap {
- display: table;
- box-sizing: border-box; }
- form .ipt-wrap .ipt-first {
- width: 100%;
- display: table-cell; }
- form .ipt-wrap .ipt-second {
- padding-left: 5px;
- display: table-cell; }
/*# sourceMappingURL=form.css.map */
diff --git a/grid.css b/grid.css
new file mode 100644
index 0000000..2c6fc0c
--- /dev/null
+++ b/grid.css
@@ -0,0 +1,732 @@
+.container-fluid, .container {
+ box-sizing: border-box; }
+
+.row {
+ box-sizing: border-box;
+ display: flex;
+ flex: 0 1 auto;
+ flex-direction: row;
+ flex-wrap: wrap; }
+
+.col {
+ box-sizing: border-box;
+ display: flex;
+ flex: 1 0 auto;
+ flex-direction: column;
+ flex-wrap: wrap;
+ margin-bottom: var(--gutter-compensation, -0.5rem);
+ margin-left: var(--gutter-compensation, -0.5rem); }
+
+.row.reverse {
+ flex-direction: row-reverse; }
+
+.col.reverse {
+ flex-direction: column-reverse; }
+
+.col-xs,
+.col-xs-1,
+.col-xs-2,
+.col-xs-3,
+.col-xs-4,
+.col-xs-5,
+.col-xs-6,
+.col-xs-7,
+.col-xs-8,
+.col-xs-9,
+.col-xs-10,
+.col-xs-11,
+.col-xs-12 {
+ box-sizing: border-box;
+ -ms-flex: 0 0 auto;
+ -webkit-box-flex: 0;
+ flex: 0 0 auto;
+ padding-right: 0.3rem;
+ padding-left: 0.3rem; }
+
+.col-xs {
+ -webkit-flex-grow: 1;
+ -ms-flex-positive: 1;
+ -webkit-box-flex: 1;
+ flex-grow: 1;
+ -ms-flex-preferred-size: 0;
+ flex-basis: 0;
+ max-width: 100%; }
+
+.col-xs-1 {
+ -ms-flex-preferred-size: 8.333%;
+ flex-basis: 8.333%;
+ max-width: 8.333%; }
+
+.col-xs-2 {
+ -ms-flex-preferred-size: 16.667%;
+ flex-basis: 16.667%;
+ max-width: 16.667%; }
+
+.col-xs-3 {
+ -ms-flex-preferred-size: 25%;
+ flex-basis: 25%;
+ max-width: 25%; }
+
+.col-xs-4 {
+ -ms-flex-preferred-size: 33.333%;
+ flex-basis: 33.333%;
+ max-width: 33.333%; }
+
+.col-xs-5 {
+ -ms-flex-preferred-size: 41.667%;
+ flex-basis: 41.667%;
+ max-width: 41.667%; }
+
+.col-xs-6 {
+ -ms-flex-preferred-size: 50%;
+ flex-basis: 50%;
+ max-width: 50%; }
+
+.col-xs-7 {
+ -ms-flex-preferred-size: 58.333%;
+ flex-basis: 58.333%;
+ max-width: 58.333%; }
+
+.col-xs-8 {
+ -ms-flex-preferred-size: 66.667%;
+ flex-basis: 66.667%;
+ max-width: 66.667%; }
+
+.col-xs-9 {
+ -ms-flex-preferred-size: 75%;
+ flex-basis: 75%;
+ max-width: 75%; }
+
+.col-xs-10 {
+ -ms-flex-preferred-size: 83.333%;
+ flex-basis: 83.333%;
+ max-width: 83.333%; }
+
+.col-xs-11 {
+ -ms-flex-preferred-size: 91.667%;
+ flex-basis: 91.667%;
+ max-width: 91.667%; }
+
+.col-xs-12 {
+ -ms-flex-preferred-size: 100%;
+ flex-basis: 100%;
+ max-width: 100%; }
+
+.col-xs-offset-1 {
+ margin-left: 8.333%; }
+
+.col-xs-offset-2 {
+ margin-left: 16.667%; }
+
+.col-xs-offset-3 {
+ margin-left: 25%; }
+
+.col-xs-offset-4 {
+ margin-left: 33.333%; }
+
+.col-xs-offset-5 {
+ margin-left: 41.667%; }
+
+.col-xs-offset-6 {
+ margin-left: 50%; }
+
+.col-xs-offset-7 {
+ margin-left: 58.333%; }
+
+.col-xs-offset-8 {
+ margin-left: 66.667%; }
+
+.col-xs-offset-9 {
+ margin-left: 75%; }
+
+.col-xs-offset-10 {
+ margin-left: 83.333%; }
+
+.col-xs-offset-11 {
+ margin-left: 91.667%; }
+
+.start-xs {
+ -ms-flex-pack: start;
+ -webkit-box-pack: start;
+ justify-content: flex-start;
+ text-align: start; }
+
+.center-xs {
+ -ms-flex-pack: center;
+ -webkit-box-pack: center;
+ justify-content: center;
+ text-align: center; }
+
+.end-xs {
+ -ms-flex-pack: end;
+ -webkit-box-pack: end;
+ justify-content: flex-end;
+ text-align: end; }
+
+.top-xs {
+ -ms-flex-align: start;
+ -webkit-box-align: start;
+ align-items: flex-start; }
+
+.middle-xs {
+ -ms-flex-align: center;
+ -webkit-box-align: center;
+ align-items: center; }
+
+.bottom-xs {
+ -ms-flex-align: end;
+ -webkit-box-align: end;
+ align-items: flex-end; }
+
+.around-xs {
+ -ms-flex-pack: distribute;
+ justify-content: space-around; }
+
+.between-xs {
+ -ms-flex-pack: justify;
+ -webkit-box-pack: justify;
+ justify-content: space-between; }
+
+.first-xs {
+ -ms-flex-order: -1;
+ -webkit-box-ordinal-group: 0;
+ order: -1; }
+
+.last-xs {
+ -ms-flex-order: 1;
+ -webkit-box-ordinal-group: 2;
+ order: 1; }
+
+@media only screen and (min-width: 48em) {
+ .container {
+ width: 46rem; }
+
+ .col-sm,
+ .col-sm-1,
+ .col-sm-2,
+ .col-sm-3,
+ .col-sm-4,
+ .col-sm-5,
+ .col-sm-6,
+ .col-sm-7,
+ .col-sm-8,
+ .col-sm-9,
+ .col-sm-10,
+ .col-sm-11,
+ .col-sm-12 {
+ box-sizing: border-box;
+ -ms-flex: 0 0 auto;
+ -webkit-box-flex: 0;
+ flex: 0 0 auto;
+ padding-right: 0.3rem;
+ padding-left: 0.3rem; }
+
+ .col-sm {
+ -webkit-flex-grow: 1;
+ -ms-flex-positive: 1;
+ -webkit-box-flex: 1;
+ flex-grow: 1;
+ -ms-flex-preferred-size: 0;
+ flex-basis: 0;
+ max-width: 100%; }
+
+ .col-sm-1 {
+ -ms-flex-preferred-size: 8.333%;
+ flex-basis: 8.333%;
+ max-width: 8.333%; }
+
+ .col-sm-2 {
+ -ms-flex-preferred-size: 16.667%;
+ flex-basis: 16.667%;
+ max-width: 16.667%; }
+
+ .col-sm-3 {
+ -ms-flex-preferred-size: 25%;
+ flex-basis: 25%;
+ max-width: 25%; }
+
+ .col-sm-4 {
+ -ms-flex-preferred-size: 33.333%;
+ flex-basis: 33.333%;
+ max-width: 33.333%; }
+
+ .col-sm-5 {
+ -ms-flex-preferred-size: 41.667%;
+ flex-basis: 41.667%;
+ max-width: 41.667%; }
+
+ .col-sm-6 {
+ -ms-flex-preferred-size: 50%;
+ flex-basis: 50%;
+ max-width: 50%; }
+
+ .col-sm-7 {
+ -ms-flex-preferred-size: 58.333%;
+ flex-basis: 58.333%;
+ max-width: 58.333%; }
+
+ .col-sm-8 {
+ -ms-flex-preferred-size: 66.667%;
+ flex-basis: 66.667%;
+ max-width: 66.667%; }
+
+ .col-sm-9 {
+ -ms-flex-preferred-size: 75%;
+ flex-basis: 75%;
+ max-width: 75%; }
+
+ .col-sm-10 {
+ -ms-flex-preferred-size: 83.333%;
+ flex-basis: 83.333%;
+ max-width: 83.333%; }
+
+ .col-sm-11 {
+ -ms-flex-preferred-size: 91.667%;
+ flex-basis: 91.667%;
+ max-width: 91.667%; }
+
+ .col-sm-12 {
+ -ms-flex-preferred-size: 100%;
+ flex-basis: 100%;
+ max-width: 100%; }
+
+ .col-sm-offset-1 {
+ margin-left: 8.333%; }
+
+ .col-sm-offset-2 {
+ margin-left: 16.667%; }
+
+ .col-sm-offset-3 {
+ margin-left: 25%; }
+
+ .col-sm-offset-4 {
+ margin-left: 33.333%; }
+
+ .col-sm-offset-5 {
+ margin-left: 41.667%; }
+
+ .col-sm-offset-6 {
+ margin-left: 50%; }
+
+ .col-sm-offset-7 {
+ margin-left: 58.333%; }
+
+ .col-sm-offset-8 {
+ margin-left: 66.667%; }
+
+ .col-sm-offset-9 {
+ margin-left: 75%; }
+
+ .col-sm-offset-10 {
+ margin-left: 83.333%; }
+
+ .col-sm-offset-11 {
+ margin-left: 91.667%; }
+
+ .start-sm {
+ -ms-flex-pack: start;
+ -webkit-box-pack: start;
+ justify-content: flex-start;
+ text-align: start; }
+
+ .center-sm {
+ -ms-flex-pack: center;
+ -webkit-box-pack: center;
+ justify-content: center;
+ text-align: center; }
+
+ .end-sm {
+ -ms-flex-pack: end;
+ -webkit-box-pack: end;
+ justify-content: flex-end;
+ text-align: end; }
+
+ .top-sm {
+ -ms-flex-align: start;
+ -webkit-box-align: start;
+ align-items: flex-start; }
+
+ .middle-sm {
+ -ms-flex-align: center;
+ -webkit-box-align: center;
+ align-items: center; }
+
+ .bottom-sm {
+ -ms-flex-align: end;
+ -webkit-box-align: end;
+ align-items: flex-end; }
+
+ .around-sm {
+ -ms-flex-pack: distribute;
+ justify-content: space-around; }
+
+ .between-sm {
+ -ms-flex-pack: justify;
+ -webkit-box-pack: justify;
+ justify-content: space-between; }
+
+ .first-sm {
+ -ms-flex-order: -1;
+ -webkit-box-ordinal-group: 0;
+ order: -1; }
+
+ .last-sm {
+ -ms-flex-order: 1;
+ -webkit-box-ordinal-group: 2;
+ order: 1; } }
+@media only screen and (min-width: 62em) {
+ .container {
+ width: 61rem; }
+
+ .col-md,
+ .col-md-1,
+ .col-md-2,
+ .col-md-3,
+ .col-md-4,
+ .col-md-5,
+ .col-md-6,
+ .col-md-7,
+ .col-md-8,
+ .col-md-9,
+ .col-md-10,
+ .col-md-11,
+ .col-md-12 {
+ box-sizing: border-box;
+ -ms-flex: 0 0 auto;
+ -webkit-box-flex: 0;
+ flex: 0 0 auto;
+ padding-right: 0.3rem;
+ padding-left: 0.3rem; }
+
+ .col-md {
+ -webkit-flex-grow: 1;
+ -ms-flex-positive: 1;
+ -webkit-box-flex: 1;
+ flex-grow: 1;
+ -ms-flex-preferred-size: 0;
+ flex-basis: 0;
+ max-width: 100%; }
+
+ .col-md-1 {
+ -ms-flex-preferred-size: 8.333%;
+ flex-basis: 8.333%;
+ max-width: 8.333%; }
+
+ .col-md-2 {
+ -ms-flex-preferred-size: 16.667%;
+ flex-basis: 16.667%;
+ max-width: 16.667%; }
+
+ .col-md-3 {
+ -ms-flex-preferred-size: 25%;
+ flex-basis: 25%;
+ max-width: 25%; }
+
+ .col-md-4 {
+ -ms-flex-preferred-size: 33.333%;
+ flex-basis: 33.333%;
+ max-width: 33.333%; }
+
+ .col-md-5 {
+ -ms-flex-preferred-size: 41.667%;
+ flex-basis: 41.667%;
+ max-width: 41.667%; }
+
+ .col-md-6 {
+ -ms-flex-preferred-size: 50%;
+ flex-basis: 50%;
+ max-width: 50%; }
+
+ .col-md-7 {
+ -ms-flex-preferred-size: 58.333%;
+ flex-basis: 58.333%;
+ max-width: 58.333%; }
+
+ .col-md-8 {
+ -ms-flex-preferred-size: 66.667%;
+ flex-basis: 66.667%;
+ max-width: 66.667%; }
+
+ .col-md-9 {
+ -ms-flex-preferred-size: 75%;
+ flex-basis: 75%;
+ max-width: 75%; }
+
+ .col-md-10 {
+ -ms-flex-preferred-size: 83.333%;
+ flex-basis: 83.333%;
+ max-width: 83.333%; }
+
+ .col-md-11 {
+ -ms-flex-preferred-size: 91.667%;
+ flex-basis: 91.667%;
+ max-width: 91.667%; }
+
+ .col-md-12 {
+ -ms-flex-preferred-size: 100%;
+ flex-basis: 100%;
+ max-width: 100%; }
+
+ .col-md-offset-1 {
+ margin-left: 8.333%; }
+
+ .col-md-offset-2 {
+ margin-left: 16.667%; }
+
+ .col-md-offset-3 {
+ margin-left: 25%; }
+
+ .col-md-offset-4 {
+ margin-left: 33.333%; }
+
+ .col-md-offset-5 {
+ margin-left: 41.667%; }
+
+ .col-md-offset-6 {
+ margin-left: 50%; }
+
+ .col-md-offset-7 {
+ margin-left: 58.333%; }
+
+ .col-md-offset-8 {
+ margin-left: 66.667%; }
+
+ .col-md-offset-9 {
+ margin-left: 75%; }
+
+ .col-md-offset-10 {
+ margin-left: 83.333%; }
+
+ .col-md-offset-11 {
+ margin-left: 91.667%; }
+
+ .start-md {
+ -ms-flex-pack: start;
+ -webkit-box-pack: start;
+ justify-content: flex-start;
+ text-align: start; }
+
+ .center-md {
+ -ms-flex-pack: center;
+ -webkit-box-pack: center;
+ justify-content: center;
+ text-align: center; }
+
+ .end-md {
+ -ms-flex-pack: end;
+ -webkit-box-pack: end;
+ justify-content: flex-end;
+ text-align: end; }
+
+ .top-md {
+ -ms-flex-align: start;
+ -webkit-box-align: start;
+ align-items: flex-start; }
+
+ .middle-md {
+ -ms-flex-align: center;
+ -webkit-box-align: center;
+ align-items: center; }
+
+ .bottom-md {
+ -ms-flex-align: end;
+ -webkit-box-align: end;
+ align-items: flex-end; }
+
+ .around-md {
+ -ms-flex-pack: distribute;
+ justify-content: space-around; }
+
+ .between-md {
+ -ms-flex-pack: justify;
+ -webkit-box-pack: justify;
+ justify-content: space-between; }
+
+ .first-md {
+ -ms-flex-order: -1;
+ -webkit-box-ordinal-group: 0;
+ order: -1; }
+
+ .last-md {
+ -ms-flex-order: 1;
+ -webkit-box-ordinal-group: 2;
+ order: 1; } }
+@media only screen and (min-width: 75em) {
+ .container {
+ width: 71rem; }
+
+ .col-lg,
+ .col-lg-1,
+ .col-lg-2,
+ .col-lg-3,
+ .col-lg-4,
+ .col-lg-5,
+ .col-lg-6,
+ .col-lg-7,
+ .col-lg-8,
+ .col-lg-9,
+ .col-lg-10,
+ .col-lg-11,
+ .col-lg-12 {
+ box-sizing: border-box;
+ -ms-flex: 0 0 auto;
+ -webkit-box-flex: 0;
+ flex: 0 0 auto;
+ padding-right: 0.3rem;
+ padding-left: 0.3rem; }
+
+ .col-lg {
+ -webkit-flex-grow: 1;
+ -ms-flex-positive: 1;
+ -webkit-box-flex: 1;
+ flex-grow: 1;
+ -ms-flex-preferred-size: 0;
+ flex-basis: 0;
+ max-width: 100%; }
+
+ .col-lg-1 {
+ -ms-flex-preferred-size: 8.333%;
+ flex-basis: 8.333%;
+ max-width: 8.333%; }
+
+ .col-lg-2 {
+ -ms-flex-preferred-size: 16.667%;
+ flex-basis: 16.667%;
+ max-width: 16.667%; }
+
+ .col-lg-3 {
+ -ms-flex-preferred-size: 25%;
+ flex-basis: 25%;
+ max-width: 25%; }
+
+ .col-lg-4 {
+ -ms-flex-preferred-size: 33.333%;
+ flex-basis: 33.333%;
+ max-width: 33.333%; }
+
+ .col-lg-5 {
+ -ms-flex-preferred-size: 41.667%;
+ flex-basis: 41.667%;
+ max-width: 41.667%; }
+
+ .col-lg-6 {
+ -ms-flex-preferred-size: 50%;
+ flex-basis: 50%;
+ max-width: 50%; }
+
+ .col-lg-7 {
+ -ms-flex-preferred-size: 58.333%;
+ flex-basis: 58.333%;
+ max-width: 58.333%; }
+
+ .col-lg-8 {
+ -ms-flex-preferred-size: 66.667%;
+ flex-basis: 66.667%;
+ max-width: 66.667%; }
+
+ .col-lg-9 {
+ -ms-flex-preferred-size: 75%;
+ flex-basis: 75%;
+ max-width: 75%; }
+
+ .col-lg-10 {
+ -ms-flex-preferred-size: 83.333%;
+ flex-basis: 83.333%;
+ max-width: 83.333%; }
+
+ .col-lg-11 {
+ -ms-flex-preferred-size: 91.667%;
+ flex-basis: 91.667%;
+ max-width: 91.667%; }
+
+ .col-lg-12 {
+ -ms-flex-preferred-size: 100%;
+ flex-basis: 100%;
+ max-width: 100%; }
+
+ .col-lg-offset-1 {
+ margin-left: 8.333%; }
+
+ .col-lg-offset-2 {
+ margin-left: 16.667%; }
+
+ .col-lg-offset-3 {
+ margin-left: 25%; }
+
+ .col-lg-offset-4 {
+ margin-left: 33.333%; }
+
+ .col-lg-offset-5 {
+ margin-left: 41.667%; }
+
+ .col-lg-offset-6 {
+ margin-left: 50%; }
+
+ .col-lg-offset-7 {
+ margin-left: 58.333%; }
+
+ .col-lg-offset-8 {
+ margin-left: 66.667%; }
+
+ .col-lg-offset-9 {
+ margin-left: 75%; }
+
+ .col-lg-offset-10 {
+ margin-left: 83.333%; }
+
+ .col-lg-offset-11 {
+ margin-left: 91.667%; }
+
+ .start-lg {
+ -ms-flex-pack: start;
+ -webkit-box-pack: start;
+ justify-content: flex-start;
+ text-align: start; }
+
+ .center-lg {
+ -ms-flex-pack: center;
+ -webkit-box-pack: center;
+ justify-content: center;
+ text-align: center; }
+
+ .end-lg {
+ -ms-flex-pack: end;
+ -webkit-box-pack: end;
+ justify-content: flex-end;
+ text-align: end; }
+
+ .top-lg {
+ -ms-flex-align: start;
+ -webkit-box-align: start;
+ align-items: flex-start; }
+
+ .middle-lg {
+ -ms-flex-align: center;
+ -webkit-box-align: center;
+ align-items: center; }
+
+ .bottom-lg {
+ -ms-flex-align: end;
+ -webkit-box-align: end;
+ align-items: flex-end; }
+
+ .around-lg {
+ -ms-flex-pack: distribute;
+ justify-content: space-around; }
+
+ .between-lg {
+ -ms-flex-pack: justify;
+ -webkit-box-pack: justify;
+ justify-content: space-between; }
+
+ .first-lg {
+ -ms-flex-order: -1;
+ -webkit-box-ordinal-group: 0;
+ order: -1; }
+
+ .last-lg {
+ -ms-flex-order: 1;
+ -webkit-box-ordinal-group: 2;
+ order: 1; } }
+
+/*# sourceMappingURL=grid.css.map */
diff --git a/icon.css b/icon.css
new file mode 100644
index 0000000..4ecb299
--- /dev/null
+++ b/icon.css
@@ -0,0 +1,41 @@
+/* Global */
+/* Content Container */
+/* Content box */
+/* Navigation */
+/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
+.infoIcon {
+ width: 0.9rem;
+ text-align: center;
+ vertical-align: middle;
+ position: relative;
+ cursor: pointer; }
+ .infoIcon span {
+ font-size: .55rem;
+ display: block;
+ position: absolute;
+ right: -.55rem;
+ top: -.45rem;
+ width: 0.9rem;
+ height: 0.9rem;
+ line-height: 0.9rem;
+ border-radius: 50%;
+ text-align: center;
+ color: #fff;
+ background: #d16059; }
+
+/*# sourceMappingURL=icon.css.map */
diff --git a/image.css b/image.css
new file mode 100644
index 0000000..0cd090b
--- /dev/null
+++ b/image.css
@@ -0,0 +1,121 @@
+/* Global */
+/* Content Container */
+/* Content box */
+/* Navigation */
+/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
+img.frame-1 {
+ padding: 5px;
+ background: #fff;
+ border: 1px solid #d6d6d6;
+ -moz-box-shadow: inset 1px 1px 0px 0px #ffffff;
+ -webkit-box-shadow: inset 1px 1px 0px 0px #ffffff;
+ box-shadow: inset 1px 1px 0px 0px #ffffff;
+ -webkit-border-radius: 3px;
+ -moz-border-radius: 3px;
+ -ms-border-radius: 3px;
+ border-radius: 3px;
+ background-clip: padding-box;
+ box-sizing: border-box;
+ width: 100%; }
+img.frame-2 {
+ border: 1px solid #d6d6d6;
+ background: #fff;
+ box-sizing: border-box;
+ width: 100%; }
+img.frame-3 {
+ padding: 5px;
+ background: #fff;
+ border: 1px solid #d6d6d6;
+ -moz-box-shadow: inset 1px 1px 0px 0px #ffffff;
+ -webkit-box-shadow: inset 1px 1px 0px 0px #ffffff;
+ box-shadow: inset 1px 1px 0px 0px #ffffff;
+ -webkit-border-radius: 3px;
+ -moz-border-radius: 3px;
+ -ms-border-radius: 3px;
+ border-radius: 3px;
+ background-clip: padding-box;
+ box-sizing: border-box;
+ width: 100%; }
+
+@keyframes slidy {
+ 0% {
+ left: 0%; }
+ 20% {
+ left: 0%; }
+ 25% {
+ left: -100%; }
+ 45% {
+ left: -100%; }
+ 50% {
+ left: -200%; }
+ 70% {
+ left: -200%; }
+ 75% {
+ left: -300%; }
+ 95% {
+ left: -300%; }
+ 100% {
+ left: -400%; } }
+div.slider-1 {
+ overflow: hidden; }
+ div.slider-1 figure {
+ position: relative;
+ width: 500%;
+ margin: 0;
+ left: 0;
+ text-align: left;
+ font-size: 0;
+ animation: 30s slidy infinite; }
+ div.slider-1 figure img {
+ width: 20%;
+ float: left; }
+
+.slider-2 {
+ width: 100%;
+ position: relative;
+ padding-top: auto;
+ text-align: center; }
+ .slider-2 > img {
+ width: 100%;
+ position: absolute;
+ left: 0;
+ top: 0;
+ transition: all 0.5s;
+ box-shadow: 0 10px 20px -5px rgba(0, 0, 0, 0.75); }
+ .slider-2 input {
+ display: none; }
+ .slider-2 input:checked + label {
+ border-color: #666;
+ opacity: 1; }
+ .slider-2 input:checked + label + img {
+ opacity: 1;
+ transform: scale(1); }
+ .slider-2 input ~ img {
+ opacity: 0;
+ transform: scale(1.1); }
+ .slider-2 label {
+ display: inline-block;
+ margin-top: calc(50% + 15px);
+ margin-left: 15px;
+ border: 3px solid #999;
+ cursor: pointer;
+ opacity: 0.6; }
+ .slider-2 label img {
+ display: block; }
+
+/*# sourceMappingURL=image.css.map */
diff --git a/input.css b/input.css
index 0dba1cb..5f427b3 100644
--- a/input.css
+++ b/input.css
@@ -1,179 +1,214 @@
-/* Global */
-/* Content Container */
-/* Content box */
-/* Navigation */
-/* Colors */
-input, select, textarea, .textarea {
- border: 1px solid #b7b7b7; }
-
-progress {
- height: 20px;
- width: 100%;
- min-width: 150px; }
-
-.textarea,
-.tag-input,
-textarea,
-select,
-input[type="password"],
-input[type="text"],
-input[type="datetime"],
-input[type="email"],
-input[type="date"],
-input[type="number"],
-input[type="datetime-local"] {
- box-sizing: border-box;
- color: #454545;
- background: #fff;
- width: 100%;
- height: 2rem;
- min-width: 70px;
- max-width: 100%;
- padding: 7px;
- font-size: 0.9rem;
- border: solid 1px #dcdcdc;
- transition: background 0.3s, border 0.3s;
- box-shadow: inset 1px 1px 4px -2px #c5c5c5; }
- .textarea:focus,
- .tag-input:focus,
- textarea:focus,
- select:focus,
- input[type="password"]:focus,
- input[type="text"]:focus,
- input[type="datetime"]:focus,
- input[type="email"]:focus,
- input[type="date"]:focus,
- input[type="number"]:focus,
- input[type="datetime-local"]:focus {
- border-color: #0c69d6; }
-
-select {
- cursor: pointer;
- padding: 0 7px 0 7px;
- /* overwrites input padding: 7px. don't know why i have to do this! */ }
-
-option {
- line-height: 1rem; }
-
-input[type="file"] {
- border: solid 1px #dcdcdc;
- width: 100%;
- max-width: 100%;
- color: #454545;
- padding: 10px;
- box-sizing: border-box; }
-
-input[placeholder], textarea {
- font-family: 'FontAwesome', serif; }
-
-input:invalid {
- transition: all 0.5s;
- border: 1px solid #b85450; }
-
-textarea, .textarea {
- overflow: auto;
- resize: both;
- min-height: 100px;
- -moz-box-sizing: border-box;
- -webkit-box-sizing: border-box;
- box-sizing: border-box; }
-
-span.checkbox, span.radio {
- -moz-user-select: none;
- -ms-user-select: none;
- -webkit-user-select: none;
- user-select: none; }
- span.checkbox label, span.radio label {
- cursor: pointer; }
-
-span.checkbox input[type="checkbox"], span.radio input[type="radio"] {
- position: relative;
- vertical-align: middle;
- bottom: 1px;
- margin-right: 5px;
- cursor: pointer; }
-
-input[type="range"] {
- border: none;
- width: 100%;
- min-width: 150px;
- cursor: pointer; }
-
-.input {
- width: 100%;
- min-width: 120px;
- display: flex;
- flex-direction: row;
- flex-wrap: nowrap; }
- .input button {
- -moz-box-sizing: border-box;
- -webkit-box-sizing: border-box;
- box-sizing: border-box;
- display: inline-block;
- background: #fff;
- height: 2rem;
- font-size: 1rem;
- min-width: 40px;
- border-left: solid 1px #dcdcdc;
- border-top: solid 1px #dcdcdc;
- border-bottom: solid 1px #dcdcdc;
- border-right: none;
- padding: 0;
- position: relative;
- vertical-align: middle;
- flex-grow: 0;
- flex-shrink: 0; }
- .input button:hover {
- background: #fff; }
- .input i {
- position: relative;
- vertical-align: middle; }
- .input input {
- -moz-box-sizing: border-box;
- -webkit-box-sizing: border-box;
- box-sizing: border-box;
- font-size: 1em;
- position: relative;
- vertical-align: middle;
- flex-grow: 1;
- flex-shrink: 1; }
-
-.dropdown {
- position: relative;
- display: inline-block; }
- .dropdown:hover .content {
- display: block; }
- .dropdown .content {
- display: none;
- position: absolute;
- z-index: 2;
- background: #fff; }
- .dropdown .content input {
- display: none; }
- .dropdown .content label {
- display: block;
- margin: 5px;
- padding: 5px; }
-
-select.plain {
- width: auto;
- margin: 0;
- padding: 0;
- border: none;
- outline: none;
- display: inline-block;
- -webkit-appearance: none;
- -moz-appearance: none;
- appearance: none;
- cursor: pointer;
- box-shadow: none; }
-
-.tag-input input {
- border: none;
- padding: 0;
- margin: 0; }
-.tag-input .tag {
- padding: 3px;
- font-size: 0.8rem; }
-
-/*# sourceMappingURL=input.css.map */
+/* Global */
+/* Content Container */
+/* Content box */
+/* Navigation */
+/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
+input, select, textarea, .textarea {
+ border: 1px solid #d6d6d6; }
+
+progress {
+ height: 20px;
+ width: 100%;
+ min-width: 150px; }
+
+.textarea,
+.tag-input,
+textarea,
+select,
+input[type="password"],
+input[type="text"],
+input[type="datetime"],
+input[type="email"],
+input[type="date"],
+input[type="number"],
+input[type="datetime-local"] {
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+ color: #000;
+ background: #fff;
+ width: 100%;
+ height: 2rem;
+ min-width: 70px;
+ max-width: 100%;
+ padding: 7px;
+ font-size: 1rem;
+ border: 1px solid #d6d6d6;
+ transition: background 0.3s, border 0.3s;
+ box-shadow: inset 1px 1px 4px -2px #c5c5c5; }
+ .textarea:focus, .textarea .active,
+ .tag-input:focus,
+ .tag-input .active,
+ textarea:focus,
+ textarea .active,
+ select:focus,
+ select .active,
+ input[type="password"]:focus,
+ input[type="password"] .active,
+ input[type="text"]:focus,
+ input[type="text"] .active,
+ input[type="datetime"]:focus,
+ input[type="datetime"] .active,
+ input[type="email"]:focus,
+ input[type="email"] .active,
+ input[type="date"]:focus,
+ input[type="date"] .active,
+ input[type="number"]:focus,
+ input[type="number"] .active,
+ input[type="datetime-local"]:focus,
+ input[type="datetime-local"] .active {
+ border-color: #FBA026; }
+ .textarea:disabled,
+ .tag-input:disabled,
+ textarea:disabled,
+ select:disabled,
+ input[type="password"]:disabled,
+ input[type="text"]:disabled,
+ input[type="datetime"]:disabled,
+ input[type="email"]:disabled,
+ input[type="date"]:disabled,
+ input[type="number"]:disabled,
+ input[type="datetime-local"]:disabled {
+ background: #efefef; }
+
+input ~ .dropdown {
+ position: absolute;
+ display: none; }
+
+input:focus ~ .dropdown, input.active ~ .dropdown {
+ display: inline-block; }
+
+select {
+ cursor: pointer;
+ padding: 0 7px 0 7px;
+ /* overwrites input padding: 7px. don't know why i have to do this! */ }
+
+option {
+ line-height: 1rem; }
+
+input[type="file"] {
+ border: solid 1rem #fff;
+ width: 100%;
+ max-width: 100%;
+ color: #000;
+ padding: 10px;
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box; }
+
+input::placeholder {
+ color: #cfcfcf;
+ opacity: 0.5; }
+
+input::placeholder, textarea {
+ font-family: 'FontAwesome', serif; }
+
+input:invalid {
+ transition: all 0.5s;
+ border-color: #b85450; }
+
+textarea, .textarea {
+ overflow: auto;
+ resize: both;
+ min-height: 100px;
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box; }
+
+span.checkbox, span.radio {
+ -moz-user-select: none;
+ -ms-user-select: none;
+ -webkit-user-select: none;
+ user-select: none; }
+ span.checkbox label, span.radio label {
+ cursor: pointer; }
+
+span.checkbox input[type="checkbox"], span.radio input[type="radio"] {
+ position: relative;
+ vertical-align: middle;
+ bottom: 1px;
+ margin-right: 5px;
+ cursor: pointer; }
+
+input[type="range"] {
+ border: none;
+ width: 100%;
+ min-width: 150px;
+ cursor: pointer; }
+
+.input {
+ width: 100%;
+ min-width: 120px;
+ display: flex;
+ flex-direction: row;
+ flex-wrap: nowrap; }
+ .input button {
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+ display: inline-block;
+ background: #fff;
+ height: 2rem;
+ font-size: 1rem;
+ min-width: 40px;
+ border-left: solid 1px #d6d6d6;
+ border-top: solid 1px #d6d6d6;
+ border-bottom: solid 1px #d6d6d6;
+ border-right: none;
+ padding: 0;
+ position: relative;
+ vertical-align: middle;
+ flex-grow: 0;
+ flex-shrink: 0; }
+ .input button:hover {
+ background: #fff; }
+ .input i {
+ position: relative;
+ vertical-align: middle; }
+ .input input {
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+ font-size: 1rem;
+ position: relative;
+ vertical-align: middle;
+ flex-grow: 1;
+ flex-shrink: 1; }
+
+select.plain {
+ width: auto;
+ margin: 0;
+ padding: 0;
+ border: none;
+ outline: none;
+ display: inline-block;
+ -webkit-appearance: none;
+ -moz-appearance: none;
+ appearance: none;
+ cursor: pointer;
+ box-shadow: none; }
+
+.tag-input input {
+ border: none;
+ padding: 0;
+ margin: 0; }
+.tag-input .tag {
+ padding: 3px;
+ font-size: 0.8rem; }
+
+/*# sourceMappingURL=input.css.map */
diff --git a/input.scss b/input.scss
index dd291af..78c5cb9 100644
--- a/input.scss
+++ b/input.scss
@@ -34,8 +34,8 @@ input[type="datetime-local"] {
transition: background 0.3s, border 0.3s;
box-shadow: inset 1px 1px 4px -2px #c5c5c5;
- &:focus {
- border-color:#0c69d6;
+ &:focus, .active {
+ border-color: $default-highlighter;
}
&:disabled {
@@ -43,6 +43,15 @@ input[type="datetime-local"] {
}
}
+input ~ .dropdown {
+ position: absolute;
+ display: none;
+}
+
+input:focus ~ .dropdown, input.active ~ .dropdown {
+ display: inline-block;
+}
+
select {
cursor: pointer;
padding: 0 7px 0 7px; /* overwrites input padding: 7px. don't know why i have to do this! */
@@ -122,9 +131,9 @@ input[type="range"] {
height: 2rem;
font-size: $input-font-size;
min-width: 40px;
- border-left: solid $input-font-size $input-background;
- border-top: solid $input-font-size $input-background;
- border-bottom: solid $input-font-size $input-background;
+ border-left: solid $input-border $input-border-color;
+ border-top: solid $input-border $input-border-color;
+ border-bottom: solid $input-border $input-border-color;
border-right: none;
padding: 0;
diff --git a/layout.css b/layout.css
new file mode 100644
index 0000000..58bd04a
--- /dev/null
+++ b/layout.css
@@ -0,0 +1,58 @@
+.ok {
+ color: #5cff56; }
+
+.warning {
+ color: #ff4b41; }
+
+.favorite {
+ color: #d16059; }
+
+.green {
+ background: #61BD6D; }
+
+.red {
+ background: #D14841; }
+
+.blue {
+ background: #2C82C9; }
+
+.orange {
+ background: #FBA026; }
+
+.lightblue {
+ background: #54ACD2; }
+
+.yellow {
+ background: #FAC51C; }
+
+.purple {
+ background: #553982; }
+
+.pink {
+ background: #ffa6e3; }
+
+.grey {
+ background: #dcdcdc; }
+
+.darkred {
+ background: #B8312F; }
+
+.darkgreen {
+ background: #41A85F; }
+
+.darkblue {
+ background: #2969B0; }
+
+.ipt-wrap {
+ display: table;
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box; }
+ .ipt-wrap .ipt-first {
+ width: 100%;
+ display: table-cell; }
+ .ipt-wrap .ipt-second {
+ padding-left: 5px;
+ display: table-cell; }
+
+/*# sourceMappingURL=layout.css.map */
diff --git a/layout.scss b/layout.scss
index ec7d2be..704de5f 100644
--- a/layout.scss
+++ b/layout.scss
@@ -1,4 +1,4 @@
-@import "color";
+@import "_mixins", "color";
.ipt-wrap {
display: table;
diff --git a/link.css b/link.css
new file mode 100644
index 0000000..e6f0bf7
--- /dev/null
+++ b/link.css
@@ -0,0 +1,7 @@
+.unseen {
+ font-weight: bold; }
+
+[data-href] {
+ cursor: pointer; }
+
+/*# sourceMappingURL=link.css.map */
diff --git a/list.css b/list.css
index ee5ac5f..719bf0b 100644
--- a/list.css
+++ b/list.css
@@ -1,52 +1,23 @@
-.ok {
- color: #5cff56; }
-
-.warning {
- color: #ff4b41; }
-
-.green {
- background: #c0ffb4; }
-
-.red {
- background: #ff7c70; }
-
-.blue {
- background: #c1c8ff; }
-
-.orange {
- background: #ffbf7c; }
-
-.lightblue {
- background: #b5ffff; }
-
-.yellow {
- background: #fffe97; }
-
-.purple {
- background: #bfa5ff; }
-
-.pink {
- background: #ffa6e3; }
-
-.grey {
- background: #dcdcdc; }
-
-.darkred {
- background: #d16059; }
-
-.darkgreen {
- background: #77d17c; }
-
-.darkblue {
- background: #7ba9d1; }
-
-ul.default li {
- margin: 5px 0 5px 0; }
- ul.default li:first-child {
- margin: 0 0 5px 0; }
- ul.default li:last-child {
- margin: 5px 0 0 0; }
-
+/* Global */
+/* Content Container */
+/* Content box */
+/* Navigation */
+/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
ul.boxed {
background: #fff;
padding: 5px;
@@ -55,14 +26,13 @@ ul.boxed {
-ms-border-radius: 3px;
border-radius: 3px;
background-clip: padding-box;
- border: 1px solid #b7b7b7; }
-
-ul.boxed li {
- margin: 5px 0 5px 0; }
- ul.boxed li:first-child {
- margin-top: 0; }
- ul.boxed li:last-child {
- margin-bottom: 0; }
+ border: 1px solid #d6d6d6; }
+ ul.boxed li {
+ margin: 5px 0 5px 0; }
+ ul.boxed li:first-child {
+ margin-top: 0; }
+ ul.boxed li:last-child {
+ margin-bottom: 0; }
ul.h-list li {
display: inline-block;
diff --git a/main.css b/main.css
new file mode 100644
index 0000000..0b2589d
--- /dev/null
+++ b/main.css
@@ -0,0 +1,32 @@
+/* Global */
+/* Content Container */
+/* Content box */
+/* Navigation */
+/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
+main {
+ height: 100%;
+ width: 100%;
+ position: relative;
+ top: 0;
+ bottom: 100%;
+ left: 0;
+ z-index: 1;
+ background: #fff;
+ transition: all 0.2s; }
+
+/*# sourceMappingURL=main.css.map */
diff --git a/media.css b/media.css
new file mode 100644
index 0000000..9e343c8
--- /dev/null
+++ b/media.css
@@ -0,0 +1,3 @@
+
+
+/*# sourceMappingURL=media.css.map */
diff --git a/nav.css b/nav.css
index 2dece4c..c983ac6 100644
--- a/nav.css
+++ b/nav.css
@@ -3,6 +3,21 @@
/* Content box */
/* Navigation */
/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
#nav-side {
user-select: none;
width: 175px;
@@ -14,7 +29,10 @@
z-index: 0;
overflow-y: auto;
font-size: 0.8em;
- background: #2F2F2F; }
+ background: #3b3b3b; }
+ #nav-side span {
+ width: 20px;
+ display: inline-block; }
#nav-side input {
display: none; }
#nav-side input:checked + ul .max {
@@ -30,20 +48,21 @@
#nav-side input + ul > li:nth-child(n+2) {
display: none; }
#nav-side > li li {
- border-top: 1px solid #3f3f3f;
+ border-top: 1px solid #505050;
border-bottom: 1px solid #252525;
color: #fff; }
#nav-side > li li:not(:first-child) {
- background: #353535; }
+ background: #444; }
#nav-side > li li:first-child {
- border-bottom: 1px solid #1a1a1a; }
+ border-bottom: 1px solid #252525; }
#nav-side > li li:first-child {
padding: 7px 0 7px 7px; }
#nav-side > li li a {
display: block;
padding: 7px 0 7px 7px; }
#nav-side > li li a:hover {
- background: #3F3F3F; }
+ color: #252525;
+ background: #FBA026; }
#nav-side li:last-child li:last-child {
border-bottom: none; }
#nav-side .max, #nav-side .min {
@@ -78,20 +97,20 @@ label[for="nav-trigger"] {
user-select: none;
margin-top: 5px;
display: block;
- background: #ffffff;
+ background: #fff;
border: 1px solid #b7b7b7;
- -moz-box-shadow: inset 0px 1px 0px 0px #ffffff;
- -webkit-box-shadow: inset 0px 1px 0px 0px #ffffff;
- box-shadow: inset 0px 1px 0px 0px #ffffff; }
+ -moz-box-shadow: inset 0px 1px 0px 0px #fff;
+ -webkit-box-shadow: inset 0px 1px 0px 0px #fff;
+ box-shadow: inset 0px 1px 0px 0px #fff; }
.nav-top > li {
- -moz-box-shadow: inset 0px 1px 0px 0px #ffffff;
- -webkit-box-shadow: inset 0px 1px 0px 0px #ffffff;
- box-shadow: inset 0px 1px 0px 0px #ffffff;
- text-shadow: 1px 1px 1px #ffffff; }
+ -moz-box-shadow: inset 0px 1px 0px 0px #fff;
+ -webkit-box-shadow: inset 0px 1px 0px 0px #fff;
+ box-shadow: inset 0px 1px 0px 0px #fff;
+ text-shadow: 1px 1px 1px #fff; }
.nav-top > li:first-child {
- -moz-box-shadow: inset 1px 1px 0px 0px #ffffff;
- -webkit-box-shadow: inset 1px 1px 0px 0px #ffffff;
- box-shadow: inset 1px 1px 0px 0px #ffffff; }
+ -moz-box-shadow: inset 1px 1px 0px 0px #fff;
+ -webkit-box-shadow: inset 1px 1px 0px 0px #fff;
+ box-shadow: inset 1px 1px 0px 0px #fff; }
.nav-top li {
background: #fff;
diff --git a/nav.scss b/nav.scss
index 058dd5e..4c7d8a1 100644
--- a/nav.scss
+++ b/nav.scss
@@ -11,7 +11,7 @@
z-index: 0;
overflow-y: auto;
font-size: 0.8em;
- background: #2F2F2F;
+ background: #3b3b3b;
span {
width: 20px;
@@ -52,16 +52,16 @@
> li {
li {
- border-top: 1px solid #3f3f3f;
+ border-top: 1px solid #505050;
border-bottom: 1px solid #252525;
color: #fff;
&:not(:first-child) {
- background: #353535;
+ background: #444;
}
&:first-child {
- border-bottom: 1px solid #1a1a1a;
+ border-bottom: 1px solid #252525;
}
&:first-child {
@@ -73,7 +73,8 @@
padding: 7px 0 7px 7px;
&:hover {
- background: #3F3F3F;
+ color: #252525;
+ background: $default-highlighter;
}
}
}
@@ -131,17 +132,17 @@ label[for="nav-trigger"] {
user-select: none;
margin-top: 5px;
display: block;
- background: #ffffff;
+ background: #fff;
border: 1px solid $content-border-color;
- @include box-shadow-top(#ffffff);
+ @include box-shadow-top(#fff);
> li {
- @include box-shadow-top(#ffffff);
- text-shadow: 1px 1px 1px #ffffff;
+ @include box-shadow-top(#fff);
+ text-shadow: 1px 1px 1px #fff;
&:first-child {
- @include box-shadow-out(#ffffff);
+ @include box-shadow-out(#fff);
}
}
}
diff --git a/note.css b/note.css
new file mode 100644
index 0000000..d1d5641
--- /dev/null
+++ b/note.css
@@ -0,0 +1,3 @@
+
+
+/*# sourceMappingURL=note.css.map */
diff --git a/pagination.css b/pagination.css
new file mode 100644
index 0000000..25deac1
--- /dev/null
+++ b/pagination.css
@@ -0,0 +1,41 @@
+/* Global */
+/* Content Container */
+/* Content box */
+/* Navigation */
+/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
+.pagination li {
+ display: inline; }
+.pagination a {
+ -webkit-border-radius: 3px;
+ -moz-border-radius: 3px;
+ -ms-border-radius: 3px;
+ border-radius: 3px;
+ background-clip: padding-box;
+ -moz-box-shadow: inset 1px 1px 0px 0px #ffffff;
+ -webkit-box-shadow: inset 1px 1px 0px 0px #ffffff;
+ box-shadow: inset 1px 1px 0px 0px #ffffff;
+ background: #f5f5ff;
+ padding: 5px 10px 5px 10px; }
+.pagination .active, .pagination a:hover, .pagination a:active {
+ color: #fff;
+ background: #353535;
+ -moz-box-shadow: inset 1px 1px 0px 0px #e8e8e8;
+ -webkit-box-shadow: inset 1px 1px 0px 0px #e8e8e8;
+ box-shadow: inset 1px 1px 0px 0px #e8e8e8; }
+
+/*# sourceMappingURL=pagination.css.map */
diff --git a/popup.css b/popup.css
new file mode 100644
index 0000000..6fb1a61
--- /dev/null
+++ b/popup.css
@@ -0,0 +1,3 @@
+
+
+/*# sourceMappingURL=popup.css.map */
diff --git a/progress.css b/progress.css
new file mode 100644
index 0000000..1a5dad5
--- /dev/null
+++ b/progress.css
@@ -0,0 +1,181 @@
+/* Global */
+/* Content Container */
+/* Content box */
+/* Navigation */
+/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
+.meter {
+ height: 20px;
+ /* Can be anything */
+ position: relative;
+ background: none !important; }
+ .meter > span {
+ display: block;
+ height: 100%;
+ -webkit-border-radius: 3px;
+ -moz-border-radius: 3px;
+ -ms-border-radius: 3px;
+ border-radius: 3px;
+ background-clip: padding-box;
+ background-color: #2bc253;
+ background-image: linear-gradient(to left top, color-stop(0, #2bc253), color-stop(1, #54f054));
+ position: relative;
+ overflow: hidden; }
+
+.meter > span:after, .animate > span > span {
+ content: "";
+ position: absolute;
+ top: 0;
+ left: 0;
+ bottom: 0;
+ right: 0;
+ background-image: -webkit-gradient(linear, 0 0, 100% 100%, color-stop(0.25, rgba(255, 255, 255, 0.2)), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, rgba(255, 255, 255, 0.2)), color-stop(0.75, rgba(255, 255, 255, 0.2)), color-stop(0.75, transparent), to(transparent));
+ background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 0.2) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.2) 50%, rgba(255, 255, 255, 0.2) 75%, transparent 75%, transparent);
+ z-index: 1;
+ -webkit-background-size: 50px 50px;
+ -moz-background-size: 50px 50px;
+ -webkit-animation: move 4s linear infinite;
+ overflow: hidden; }
+
+.animate > span:after {
+ display: none; }
+
+@-webkit-keyframes move {
+ 0% {
+ background-position: 0 0; }
+ 100% {
+ background-position: 50px 50px; } }
+.orange > span {
+ background-color: #f1a165;
+ background-image: -moz-linear-gradient(top, #f1a165, #f36d0a);
+ background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #f1a165), color-stop(1, #f36d0a));
+ background-image: -webkit-linear-gradient(#f1a165, #f36d0a); }
+
+.blue > span {
+ background-color: #96c2f1;
+ background-image: -moz-linear-gradient(top, #96c2f1, #4394f3);
+ background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #96c2f1), color-stop(1, #4394f3));
+ background-image: -webkit-linear-gradient(#96c2f1, #4394f3); }
+
+.red > span {
+ background-color: #f0a3a3;
+ background-image: -moz-linear-gradient(top, #f0a3a3, #f42323);
+ background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #f0a3a3), color-stop(1, #f42323));
+ background-image: -webkit-linear-gradient(#f0a3a3, #f42323); }
+
+.nostripes > span > span, .nostripes > span:after {
+ -webkit-animation: none;
+ background-image: none; }
+
+.timeline {
+ list-style: none;
+ margin: 0 0 30px 120px;
+ padding-left: 30px;
+ border-left: 3px solid #eaeaea; }
+ .timeline li {
+ margin: 0;
+ position: relative; }
+ .timeline p {
+ margin: 0 0 15px; }
+
+.timeline-date {
+ margin-top: -18px;
+ top: 50%;
+ left: -150px;
+ font-size: 0.95em;
+ line-height: 20px;
+ position: absolute;
+ padding: 5px 10px 5px 10px;
+ border: 1px solid #ccc; }
+
+.timeline-circle {
+ margin-top: -10px;
+ top: 50%;
+ left: -40px;
+ width: 10px;
+ height: 10px;
+ background: tomato;
+ border: 3px solid #eaeaea;
+ border-radius: 50%;
+ display: block;
+ position: absolute; }
+
+.timeline-circle-start {
+ margin-top: 0;
+ top: 0;
+ left: -45px;
+ width: 20px;
+ height: 20px;
+ background: #fff;
+ border: 3px solid #eaeaea;
+ border-radius: 50%;
+ display: block;
+ position: absolute; }
+
+.timeline-circle-end {
+ margin-top: 0;
+ top: 100%;
+ left: -45px;
+ width: 20px;
+ height: 20px;
+ background: #fff;
+ border: 3px solid #eaeaea;
+ border-radius: 50%;
+ display: block;
+ position: absolute; }
+
+.timeline-content {
+ padding: 50px 20px 0;
+ border-radius: 0.5em;
+ position: relative; }
+
+.timeline-content p {
+ text-align: justify; }
+
+.timeline label {
+ font-size: 1.3em;
+ position: absolute;
+ z-index: 100;
+ top: 20px; }
+
+.timeline-radio {
+ display: none; }
+
+.timeline-break {
+ display: none; }
+
+.progress-radial {
+ float: left;
+ margin-right: 20px;
+ position: relative;
+ width: 70px;
+ height: 70px;
+ border-radius: 50%;
+ background-color: tomato; }
+ .progress-radial .overlay {
+ position: absolute;
+ width: 60px;
+ height: 60px;
+ background-color: #fff;
+ border-radius: 50%;
+ margin-left: 5px;
+ margin-top: 5px;
+ text-align: center;
+ line-height: 60px;
+ font-size: 9px; }
+
+/*# sourceMappingURL=progress.css.map */
diff --git a/section.css b/section.css
index e7707df..0beca4a 100644
--- a/section.css
+++ b/section.css
@@ -3,6 +3,21 @@
/* Content box */
/* Navigation */
/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
.box {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
@@ -26,7 +41,7 @@ section.box {
-moz-box-shadow: 0px 1px 0px 0px #f1f1f1;
-webkit-box-shadow: 0px 1px 0px 0px #f1f1f1;
box-shadow: 0px 1px 0px 0px #f1f1f1;
- border: 1px solid #b7b7b7;
+ border: 1px solid #d6d6d6;
background: #fff; }
section.box.orange {
border-top: 3px solid #FBA026; }
@@ -40,6 +55,8 @@ section.box {
border-top: 3px solid #553982; }
section.box.darkblue {
border-top: 3px solid #2969B0; }
+ section.box.purple {
+ border-top: 3px solid #553982; }
section header > h1 {
margin: 10px 10px 0 10px;
diff --git a/section.scss b/section.scss
index f8038e9..0762e9e 100644
--- a/section.scss
+++ b/section.scss
@@ -26,7 +26,6 @@ section.box {
'orange' #FBA026, 'red' #B8312F, 'green' #41A85F,
'blue' #2C82C9, 'purple' #553982, 'darkblue' #2969B0, 'purple' #553982 {
&.#{nth($tuple, 1)} {
- background: #{nth($tuple, 2)};
border-top: 3px solid #{nth($tuple, 2)};
}
}
diff --git a/size.css b/size.css
new file mode 100644
index 0000000..3532c71
--- /dev/null
+++ b/size.css
@@ -0,0 +1,32 @@
+.wf-100 {
+ width: 100%; }
+
+.wf-80 {
+ width: 80%; }
+
+.wf-20 {
+ width: 20%; }
+
+.wf-66 {
+ width: 66.66%; }
+
+.wf-50 {
+ width: 50%; }
+
+.wf-33 {
+ width: 33.33%; }
+
+.wf-25 {
+ width: 25%; }
+
+.wf-75 {
+ width: 75%; }
+
+.spacer {
+ padding: 5px; }
+
+.resizable {
+ resize: both;
+ overflow: auto; }
+
+/*# sourceMappingURL=size.css.map */
diff --git a/slider.css b/slider.css
new file mode 100644
index 0000000..d6da2f0
--- /dev/null
+++ b/slider.css
@@ -0,0 +1,7 @@
+.slider {
+ overflow-x: auto;
+ white-space: nowrap; }
+ .slider ul {
+ display: inline; }
+
+/*# sourceMappingURL=slider.css.map */
diff --git a/spinner.css b/spinner.css
new file mode 100644
index 0000000..9120657
--- /dev/null
+++ b/spinner.css
@@ -0,0 +1,215 @@
+.spinner-1 {
+ width: 40px;
+ height: 40px;
+ background-color: #333;
+ margin: 50px auto;
+ -webkit-animation: sk-rotateplane 1.2s infinite ease-in-out;
+ animation: sk-rotateplane 1.2s infinite ease-in-out; }
+
+@-webkit-keyframes sk-rotateplane {
+ 0% {
+ -webkit-transform: perspective(120px); }
+ 50% {
+ -webkit-transform: perspective(120px) rotateY(180deg); }
+ 100% {
+ -webkit-transform: perspective(120px) rotateY(180deg) rotateX(180deg); } }
+@keyframes sk-rotateplane {
+ 0% {
+ transform: perspective(120px) rotateX(0deg) rotateY(0deg);
+ -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg); }
+ 50% {
+ transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
+ -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg); }
+ 100% {
+ transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
+ -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg); } }
+.spinner-2 {
+ text-align: center; }
+
+.spinner-2 > div {
+ width: 18px;
+ height: 18px;
+ background-color: #333;
+ border-radius: 100%;
+ display: inline-block;
+ -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
+ animation: sk-bouncedelay 1.4s infinite ease-in-out both; }
+
+.spinner-2 .bounce1 {
+ -webkit-animation-delay: -0.32s;
+ animation-delay: -0.32s; }
+
+.spinner-2 .bounce2 {
+ -webkit-animation-delay: -0.16s;
+ animation-delay: -0.16s; }
+
+@-webkit-keyframes sk-bouncedelay {
+ 0%, 80%, 100% {
+ -webkit-transform: scale(0); }
+ 40% {
+ -webkit-transform: scale(1); } }
+@keyframes sk-bouncedelay {
+ 0%, 80%, 100% {
+ -webkit-transform: scale(0);
+ transform: scale(0); }
+ 40% {
+ -webkit-transform: scale(1);
+ transform: scale(1); } }
+.spinner-3 {
+ margin: 50px auto;
+ width: 40px;
+ height: 40px;
+ position: relative; }
+
+.spinner-3 .sk-circle {
+ width: 100%;
+ height: 100%;
+ position: absolute;
+ left: 0;
+ top: 0; }
+
+.spinner-3 .sk-circle:before {
+ content: '';
+ display: block;
+ margin: 0 auto;
+ width: 15%;
+ height: 15%;
+ background-color: #333;
+ border-radius: 100%;
+ -webkit-animation: sk-circleFadeDelay 1.2s infinite ease-in-out both;
+ animation: sk-circleFadeDelay 1.2s infinite ease-in-out both; }
+
+.spinner-3 .sk-circle2 {
+ -webkit-transform: rotate(30deg);
+ -ms-transform: rotate(30deg);
+ transform: rotate(30deg); }
+
+.spinner-3 .sk-circle3 {
+ -webkit-transform: rotate(60deg);
+ -ms-transform: rotate(60deg);
+ transform: rotate(60deg); }
+
+.spinner-3 .sk-circle4 {
+ -webkit-transform: rotate(90deg);
+ -ms-transform: rotate(90deg);
+ transform: rotate(90deg); }
+
+.spinner-3 .sk-circle5 {
+ -webkit-transform: rotate(120deg);
+ -ms-transform: rotate(120deg);
+ transform: rotate(120deg); }
+
+.spinner-3 .sk-circle6 {
+ -webkit-transform: rotate(150deg);
+ -ms-transform: rotate(150deg);
+ transform: rotate(150deg); }
+
+.spinner-3 .sk-circle7 {
+ -webkit-transform: rotate(180deg);
+ -ms-transform: rotate(180deg);
+ transform: rotate(180deg); }
+
+.spinner-3 .sk-circle8 {
+ -webkit-transform: rotate(210deg);
+ -ms-transform: rotate(210deg);
+ transform: rotate(210deg); }
+
+.spinner-3 .sk-circle9 {
+ -webkit-transform: rotate(240deg);
+ -ms-transform: rotate(240deg);
+ transform: rotate(240deg); }
+
+.spinner-3 .sk-circle10 {
+ -webkit-transform: rotate(270deg);
+ -ms-transform: rotate(270deg);
+ transform: rotate(270deg); }
+
+.spinner-3 .sk-circle11 {
+ -webkit-transform: rotate(300deg);
+ -ms-transform: rotate(300deg);
+ transform: rotate(300deg); }
+
+.spinner-3 .sk-circle12 {
+ -webkit-transform: rotate(330deg);
+ -ms-transform: rotate(330deg);
+ transform: rotate(330deg); }
+
+.spinner-3 .sk-circle2:before {
+ -webkit-animation-delay: -1.1s;
+ animation-delay: -1.1s; }
+
+.spinner-3 .sk-circle3:before {
+ -webkit-animation-delay: -1s;
+ animation-delay: -1s; }
+
+.spinner-3 .sk-circle4:before {
+ -webkit-animation-delay: -0.9s;
+ animation-delay: -0.9s; }
+
+.spinner-3 .sk-circle5:before {
+ -webkit-animation-delay: -0.8s;
+ animation-delay: -0.8s; }
+
+.spinner-3 .sk-circle6:before {
+ -webkit-animation-delay: -0.7s;
+ animation-delay: -0.7s; }
+
+.spinner-3 .sk-circle7:before {
+ -webkit-animation-delay: -0.6s;
+ animation-delay: -0.6s; }
+
+.spinner-3 .sk-circle8:before {
+ -webkit-animation-delay: -0.5s;
+ animation-delay: -0.5s; }
+
+.spinner-3 .sk-circle9:before {
+ -webkit-animation-delay: -0.4s;
+ animation-delay: -0.4s; }
+
+.spinner-3 .sk-circle10:before {
+ -webkit-animation-delay: -0.3s;
+ animation-delay: -0.3s; }
+
+.spinner-3 .sk-circle11:before {
+ -webkit-animation-delay: -0.2s;
+ animation-delay: -0.2s; }
+
+.spinner-3 .sk-circle12:before {
+ -webkit-animation-delay: -0.1s;
+ animation-delay: -0.1s; }
+
+@-webkit-keyframes sk-circleFadeDelay {
+ 0%, 39%, 100% {
+ opacity: 0; }
+ 40% {
+ opacity: 1; } }
+@keyframes sk-circleFadeDelay {
+ 0%, 39%, 100% {
+ opacity: 0; }
+ 40% {
+ opacity: 1; } }
+.spinner-4 {
+ width: 40px;
+ height: 40px;
+ margin: 50px auto;
+ background-color: #333;
+ border-radius: 100%;
+ -webkit-animation: sk-scaleout 1.0s infinite ease-in-out;
+ animation: sk-scaleout 1.0s infinite ease-in-out; }
+
+@-webkit-keyframes sk-scaleout {
+ 0% {
+ -webkit-transform: scale(0); }
+ 100% {
+ -webkit-transform: scale(1);
+ opacity: 0; } }
+@keyframes sk-scaleout {
+ 0% {
+ -webkit-transform: scale(0);
+ transform: scale(0); }
+ 100% {
+ -webkit-transform: scale(1);
+ transform: scale(1);
+ opacity: 0; } }
+
+/*# sourceMappingURL=spinner.css.map */
diff --git a/styles.css b/styles.css
index 43e7e49..1e417ba 100644
--- a/styles.css
+++ b/styles.css
@@ -3,6 +3,66 @@
/* Content box */
/* Navigation */
/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
+.ok {
+ color: #5cff56; }
+
+.warning {
+ color: #ff4b41; }
+
+.favorite {
+ color: #d16059; }
+
+.green {
+ background: #61BD6D; }
+
+.red {
+ background: #D14841; }
+
+.blue {
+ background: #2C82C9; }
+
+.orange {
+ background: #FBA026; }
+
+.lightblue {
+ background: #54ACD2; }
+
+.yellow {
+ background: #FAC51C; }
+
+.purple {
+ background: #553982; }
+
+.pink {
+ background: #ffa6e3; }
+
+.grey {
+ background: #dcdcdc; }
+
+.darkred {
+ background: #B8312F; }
+
+.darkgreen {
+ background: #41A85F; }
+
+.darkblue {
+ background: #2969B0; }
+
html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td, nav, section, iframe, label {
margin: 0;
padding: 0; }
@@ -21,6 +81,8 @@ ul {
list-style: none; }
input, select, textarea, .textarea {
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
box-sizing: border-box;
appearance: none;
box-shadow: none; }
@@ -45,10 +107,25 @@ i {
/* Content box */
/* Navigation */
/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
body {
- background: #e7ebf3;
+ background: #fff;
font-family: Open Sans, sans-serif;
- font-size: 0.9em; }
+ font-size: 1rem; }
.clear {
clear: both; }
@@ -60,11 +137,13 @@ pre {
-ms-border-radius: 3px;
border-radius: 3px;
background-clip: padding-box;
- border: 1px solid #b7b7b7;
+ border: 1px solid #d6d6d6;
padding: 5px;
overflow-x: scroll;
counter-reset: line;
width: 100%;
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
box-sizing: border-box; }
pre span {
display: block; }
@@ -78,29 +157,6 @@ pre {
color: #888;
width: 30px; }
-article {
- background: #fff;
- padding: 5px;
- margin: 0; }
- article p {
- line-height: 1.5em; }
- article ol, article ul {
- margin-left: 30px; }
- article ul {
- list-style: disc; }
- article blockquote {
- margin: 10px 0 10px 0; }
- article blockquote p:last-child {
- margin-bottom: 0; }
- article table {
- border-collapse: collapse;
- border: 1px solid #999; }
- article table th, article table td {
- padding: 5px;
- border: 1px solid #999; }
- article table tr:nth-child(2n) {
- background: #eee; }
-
.ok {
color: #5cff56; }
@@ -155,6 +211,9 @@ article {
.wf-20 {
width: 20%; }
+.wf-66 {
+ width: 66.66%; }
+
.wf-50 {
width: 50%; }
@@ -167,9 +226,6 @@ article {
.wf-75 {
width: 75%; }
-.wf-66 {
- width: 66.66%; }
-
.spacer {
padding: 5px; }
@@ -177,18 +233,6 @@ article {
resize: both;
overflow: auto; }
-@media only screen and (min-width: 501px) and (max-width: 900px) {
- .box.w-33, .box.w-25 {
- width: 49%;
- width: calc(50% - 5px); }
-
- .box.w-75, .box.w-66 {
- width: 49%;
- width: calc(50% - 5px); } }
-@media only screen and (max-width: 500px) {
- .box.w-33, .box.w-50, .box.w-25, .box.w-66, .box.w-75 {
- width: 100%;
- width: calc(100% - 5px); } }
.center {
margin: 0 auto; }
@@ -3162,6 +3206,54 @@ article {
-ms-flex-order: 1;
-webkit-box-ordinal-group: 2;
order: 1; } }
+/* Global */
+/* Content Container */
+/* Content box */
+/* Navigation */
+/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
+article {
+ background: #fff;
+ padding: 5px;
+ margin: 0; }
+ article a {
+ color: #8ea4ff;
+ border-bottom: 1px dotted #8ea4ff; }
+ article a:hover {
+ border-bottom: none; }
+ article p {
+ line-height: 1.5em; }
+ article ol, article ul {
+ margin-left: 30px; }
+ article ul {
+ list-style: disc; }
+ article blockquote {
+ margin: 10px 0 10px 0; }
+ article blockquote p:last-child {
+ margin-bottom: 0; }
+ article table {
+ border-collapse: collapse;
+ border: 1px solid #999; }
+ article table th, article table td {
+ padding: 5px;
+ border: 1px solid #999; }
+ article table tr:nth-child(2n) {
+ background: #eee; }
+
.ok {
color: #5cff56; }
@@ -3209,6 +3301,8 @@ article {
.ipt-wrap {
display: table;
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
box-sizing: border-box; }
.ipt-wrap .ipt-first {
width: 100%;
@@ -3234,6 +3328,21 @@ p {
/* Content box */
/* Navigation */
/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
.tooltip {
position: relative;
cursor: pointer;
@@ -3491,9 +3600,24 @@ p {
/* Content box */
/* Navigation */
/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
canvas {
background: #fff;
- border: 1px solid #000;
+ border: 1px solid #d6d6d6;
user-select: none; }
/* Global */
@@ -3501,6 +3625,21 @@ canvas {
/* Content box */
/* Navigation */
/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
form li {
margin: 5px 0 5px 0; }
form td {
@@ -3509,28 +3648,41 @@ form td {
form td textarea + i {
vertical-align: top; }
form label {
- font-size: 0.9em;
+ font-size: 0.9rem;
color: #878787;
text-shadow: -1px -1px 1px #ffffff; }
form i + i {
margin-left: 3px; }
-form .inputPrefix {
- border-left: 1px solid #b7b7b7;
- border-top: 1px solid #b7b7b7;
- border-bottom: 1px solid #b7b7b7;
- line-height: 2em;
- height: 100%;
- background: #bebebe; }
form .layout td + td {
padding-left: 5px; }
form .list {
- font-size: 0.9em; }
+ font-size: 0.9rem; }
form .list td {
white-space: nowrap;
padding: 3px 5px 3px 5px; }
+/* Global */
+/* Content Container */
+/* Content box */
+/* Navigation */
+/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
.infoIcon {
- width: .9rem;
+ width: 0.9rem;
text-align: center;
vertical-align: middle;
position: relative;
@@ -3541,9 +3693,9 @@ form .list {
position: absolute;
right: -.55rem;
top: -.45rem;
- width: .9rem;
- height: .9rem;
- line-height: .9rem;
+ width: 0.9rem;
+ height: 0.9rem;
+ line-height: 0.9rem;
border-radius: 50%;
text-align: center;
color: #fff;
@@ -3554,10 +3706,25 @@ form .list {
/* Content box */
/* Navigation */
/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
img.frame-1 {
padding: 5px;
- background: #f5f5ff;
- border: 1px solid #b7b7b7;
+ background: #fff;
+ border: 1px solid #d6d6d6;
-moz-box-shadow: inset 1px 1px 0px 0px #ffffff;
-webkit-box-shadow: inset 1px 1px 0px 0px #ffffff;
box-shadow: inset 1px 1px 0px 0px #ffffff;
@@ -3565,18 +3732,18 @@ img.frame-1 {
-moz-border-radius: 3px;
-ms-border-radius: 3px;
border-radius: 3px;
- width: 100%;
+ background-clip: padding-box;
box-sizing: border-box;
- background-clip: padding-box; }
+ width: 100%; }
img.frame-2 {
- border: 1px solid #b7b7b7;
+ border: 1px solid #d6d6d6;
+ background: #fff;
box-sizing: border-box;
- width: 100%;
- background: #f5f5ff; }
+ width: 100%; }
img.frame-3 {
padding: 5px;
- background: #ffffff;
- border: 1px solid #b7b7b7;
+ background: #fff;
+ border: 1px solid #d6d6d6;
-moz-box-shadow: inset 1px 1px 0px 0px #ffffff;
-webkit-box-shadow: inset 1px 1px 0px 0px #ffffff;
box-shadow: inset 1px 1px 0px 0px #ffffff;
@@ -3584,9 +3751,9 @@ img.frame-3 {
-moz-border-radius: 3px;
-ms-border-radius: 3px;
border-radius: 3px;
+ background-clip: padding-box;
box-sizing: border-box;
- width: 100%;
- background-clip: padding-box; }
+ width: 100%; }
@keyframes slidy {
0% {
@@ -3659,8 +3826,23 @@ div.slider-1 {
/* Content box */
/* Navigation */
/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
input, select, textarea, .textarea {
- border: 1px solid #b7b7b7; }
+ border: 1px solid #d6d6d6; }
progress {
height: 20px;
@@ -3678,30 +3860,42 @@ input[type="email"],
input[type="date"],
input[type="number"],
input[type="datetime-local"] {
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
box-sizing: border-box;
- color: #454545;
+ color: #000;
background: #fff;
width: 100%;
height: 2rem;
min-width: 70px;
max-width: 100%;
padding: 7px;
- font-size: 0.9rem;
- border: solid 1px #dcdcdc;
+ font-size: 1rem;
+ border: 1px solid #d6d6d6;
transition: background 0.3s, border 0.3s;
box-shadow: inset 1px 1px 4px -2px #c5c5c5; }
- .textarea:focus,
+ .textarea:focus, .textarea .active,
.tag-input:focus,
+ .tag-input .active,
textarea:focus,
+ textarea .active,
select:focus,
+ select .active,
input[type="password"]:focus,
+ input[type="password"] .active,
input[type="text"]:focus,
+ input[type="text"] .active,
input[type="datetime"]:focus,
+ input[type="datetime"] .active,
input[type="email"]:focus,
+ input[type="email"] .active,
input[type="date"]:focus,
+ input[type="date"] .active,
input[type="number"]:focus,
- input[type="datetime-local"]:focus {
- border-color: #0c69d6; }
+ input[type="number"] .active,
+ input[type="datetime-local"]:focus,
+ input[type="datetime-local"] .active {
+ border-color: #FBA026; }
.textarea:disabled,
.tag-input:disabled,
textarea:disabled,
@@ -3715,6 +3909,13 @@ input[type="datetime-local"] {
input[type="datetime-local"]:disabled {
background: #efefef; }
+input ~ .dropdown {
+ position: absolute;
+ display: none; }
+
+input:focus ~ .dropdown, input.active ~ .dropdown {
+ display: inline-block; }
+
select {
cursor: pointer;
padding: 0 7px 0 7px;
@@ -3724,23 +3925,25 @@ option {
line-height: 1rem; }
input[type="file"] {
- border: solid 1px #dcdcdc;
+ border: solid 1rem #fff;
width: 100%;
max-width: 100%;
- color: #454545;
+ color: #000;
padding: 10px;
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
box-sizing: border-box; }
input::placeholder {
color: #cfcfcf;
- opacity: 1; }
+ opacity: 0.5; }
input::placeholder, textarea {
font-family: 'FontAwesome', serif; }
input:invalid {
transition: all 0.5s;
- border: 1px solid #b85450; }
+ border-color: #b85450; }
textarea, .textarea {
overflow: auto;
@@ -3786,9 +3989,9 @@ input[type="range"] {
height: 2rem;
font-size: 1rem;
min-width: 40px;
- border-left: solid 1px #dcdcdc;
- border-top: solid 1px #dcdcdc;
- border-bottom: solid 1px #dcdcdc;
+ border-left: solid 1px #d6d6d6;
+ border-top: solid 1px #d6d6d6;
+ border-bottom: solid 1px #d6d6d6;
border-right: none;
padding: 0;
position: relative;
@@ -3804,29 +4007,12 @@ input[type="range"] {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
- font-size: 1em;
+ font-size: 1rem;
position: relative;
vertical-align: middle;
flex-grow: 1;
flex-shrink: 1; }
-.dropdown {
- position: relative;
- display: inline-block; }
- .dropdown:hover .content {
- display: block; }
- .dropdown .content {
- display: none;
- position: absolute;
- z-index: 2;
- background: #fff; }
- .dropdown .content input {
- display: none; }
- .dropdown .content label {
- display: block;
- margin: 5px;
- padding: 5px; }
-
select.plain {
width: auto;
margin: 0;
@@ -3853,19 +4039,34 @@ select.plain {
/* Content box */
/* Navigation */
/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
.ac-container {
margin: 10px auto 30px auto;
text-align: left; }
.ac-container > input {
display: none; }
.ac-container > input:checked + label {
- background: #ffffff;
- background: -moz-linear-gradient(top, #ffffff 0, #f5f5ff 100);
- background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ffffff), color-stop(100, #f5f5ff));
- background: -webkit-linear-gradient(top, #ffffff 0, #f5f5ff 100);
- background: -o-linear-gradient(top, #ffffff 0, #f5f5ff 100);
- background: -ms-linear-gradient(top, #ffffff 0, #f5f5ff 100);
- background: linear-gradient(to bottom, #ffffff 0, #f5f5ff 100);
+ background: #fff;
+ background: -moz-linear-gradient(top, #fff 0, #fff 100);
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(100, #fff));
+ background: -webkit-linear-gradient(top, #fff 0, #fff 100);
+ background: -o-linear-gradient(top, #fff 0, #fff 100);
+ background: -ms-linear-gradient(top, #fff 0, #fff 100);
+ background: linear-gradient(to bottom, #fff 0, #fff 100);
color: #000; }
.ac-container > input:checked + label + section {
display: inherit; }
@@ -3879,8 +4080,8 @@ select.plain {
margin-top: -1px;
cursor: pointer;
color: #777;
- font-size: 1em;
- border: 1px solid #b7b7b7;
+ font-size: 1rem;
+ border: 1px solid #d6d6d6;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
-ms-border-radius: 3px;
@@ -3894,23 +4095,43 @@ select.plain {
background: -ms-linear-gradient(top, #e0e3eb 0, #f5f5ff 100);
background: linear-gradient(to bottom, #e0e3eb 0, #f5f5ff 100); }
.ac-container label:hover {
- background: #ffffff;
- background: -moz-linear-gradient(top, #ffffff 0, #f5f5ff 100);
- background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ffffff), color-stop(100, #f5f5ff));
- background: -webkit-linear-gradient(top, #ffffff 0, #f5f5ff 100);
- background: -o-linear-gradient(top, #ffffff 0, #f5f5ff 100);
- background: -ms-linear-gradient(top, #ffffff 0, #f5f5ff 100);
- background: linear-gradient(to bottom, #ffffff 0, #f5f5ff 100); }
+ background: #fff;
+ background: -moz-linear-gradient(top, #fff 0, #fff 100);
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #fff), color-stop(100, #fff));
+ background: -webkit-linear-gradient(top, #fff 0, #fff 100);
+ background: -o-linear-gradient(top, #fff 0, #fff 100);
+ background: -ms-linear-gradient(top, #fff 0, #fff 100);
+ background: linear-gradient(to bottom, #fff 0, #fff 100); }
.ac-container > section {
- background: #f5f5ff;
+ background: #fff;
overflow: hidden;
height: auto;
position: relative;
z-index: 10;
- border-left: 1px solid #b7b7b7;
- border-right: 1px solid #b7b7b7;
+ border-left: 1px solid #d6d6d6;
+ border-right: 1px solid #d6d6d6;
padding: 10px; }
+/* Global */
+/* Content Container */
+/* Content box */
+/* Navigation */
+/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
.log-msg {
padding: 5px;
margin: 5px; }
@@ -3946,9 +4167,24 @@ select.plain {
/* Content box */
/* Navigation */
/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
blockquote {
- border: 1px solid #dddddd;
- background: #ffffff;
+ border: 1px solid #d6d6d6;
+ background: #fff;
padding: 10px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
@@ -3964,14 +4200,29 @@ blockquote {
/* Content box */
/* Navigation */
/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
.crumbs-1 {
list-style: none;
overflow: hidden;
font-size: 12px; }
.crumbs-1 li {
background: #f5f5ff;
- border: 1px solid #b7b7b7;
- padding: 10px 10px 10px 20px;
+ border: 1px solid #d6d6d6;
+ padding: 10px;
position: relative;
display: block;
float: left;
@@ -3993,7 +4244,7 @@ blockquote {
height: 0;
border-top: 18px solid transparent;
border-bottom: 17px solid transparent;
- border-left: 14px solid #f5f5ff;
+ border-left: 14px solid #d6d6d6;
position: absolute;
top: 50%;
margin-top: -18px;
@@ -4001,7 +4252,7 @@ blockquote {
.crumbs-1 li:not(.last):after {
z-index: 2; }
.crumbs-1 li:before {
- border-left-color: #b7b7b7;
+ border-left-color: #d6d6d6;
margin-left: 1px;
z-index: 1; }
.crumbs-1 li.active:not(.last):after, .crumbs-1 li:hover:not(.last):after {
@@ -4018,18 +4269,33 @@ blockquote {
.crumbs-1 .active {
cursor: default; }
.crumbs-1 .active, .crumbs-1 li:hover {
- background: #ffffff; }
+ background: #fff; }
/* Global */
/* Content Container */
/* Content box */
/* Navigation */
/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
.btn {
cursor: pointer; }
button, input[type="submit"], input[type="button"], a.button {
- border: 1px solid #b7b7b7;
+ border: 1px solid #d6d6d6;
cursor: pointer;
text-shadow: 1px 1px 1px #ffffff;
min-width: 70px;
@@ -4118,9 +4384,9 @@ ul.btns {
font-size: 12px; }
ul.btns li {
background: #f5f5ff;
- border-left: 1px solid #b7b7b7;
- border-top: 1px solid #b7b7b7;
- border-bottom: 1px solid #b7b7b7;
+ border-left: 1px solid #d6d6d6;
+ border-top: 1px solid #d6d6d6;
+ border-bottom: 1px solid #d6d6d6;
float: left;
text-shadow: -1px -1px 1px #ffffff;
cursor: pointer;
@@ -4128,9 +4394,9 @@ ul.btns {
-webkit-box-shadow: inset 1px 1px 0px 0px #ffffff;
box-shadow: inset 1px 1px 0px 0px #ffffff; }
ul.btns li:last-child {
- border-right: 1px solid #b7b7b7; }
+ border-right: 1px solid #d6d6d6; }
ul.btns li:before {
- border-left-color: #b7b7b7;
+ border-left-color: #d6d6d6;
margin-left: 1px; }
ul.btns a {
display: block;
@@ -4138,22 +4404,16 @@ ul.btns {
ul.btns .active {
cursor: default; }
ul.btns .active, ul.btns li:hover {
- background: #ffffff; }
+ background: #fff; }
button.simple {
- background: #f5f5ff;
- border: 1px solid #b7b7b7;
+ background: #f1f1f1;
+ border: 1px solid #d6d6d6;
text-shadow: -1px -1px 1px #ffffff;
padding: 5px;
min-width: 40px; }
button.simple:hover {
- background: #ffffff; }
-
-article a {
- color: #8ea4ff;
- border-bottom: 1px dotted #8ea4ff; }
- article a:hover {
- border-bottom: none; }
+ background: #f1f1f1; }
.unseen {
font-weight: bold; }
@@ -4166,13 +4426,21 @@ article a {
/* Content box */
/* Navigation */
/* Colors */
-ul.default li {
- margin: 5px 0 5px 0; }
- ul.default li:first-child {
- margin: 0 0 5px 0; }
- ul.default li:last-child {
- margin: 5px 0 0 0; }
-
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
ul.boxed {
background: #fff;
padding: 5px;
@@ -4181,7 +4449,7 @@ ul.boxed {
-ms-border-radius: 3px;
border-radius: 3px;
background-clip: padding-box;
- border: 1px solid #b7b7b7; }
+ border: 1px solid #d6d6d6; }
ul.boxed li {
margin: 5px 0 5px 0; }
ul.boxed li:first-child {
@@ -4193,30 +4461,26 @@ ul.h-list li {
display: inline-block;
margin: 5px 10px 5px 10px; }
-.bullet-list {
- margin: 0;
- padding: 0;
- border-spacing: 0;
- border-collapse: collapse; }
- .bullet-list td:first-child {
- padding-right: 20px; }
- .bullet-list span {
- margin-right: 5px; }
-
-.bullet {
- width: 7px;
- height: 7px;
- border-radius: 30px;
- background: #ccc;
- display: inline-block; }
- .bullet.active {
- background: #000; }
-
/* Global */
/* Content Container */
/* Content box */
/* Navigation */
/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
#nav-side {
user-select: none;
width: 175px;
@@ -4228,7 +4492,7 @@ ul.h-list li {
z-index: 0;
overflow-y: auto;
font-size: 0.8em;
- background: #2F2F2F; }
+ background: #3b3b3b; }
#nav-side span {
width: 20px;
display: inline-block; }
@@ -4247,20 +4511,21 @@ ul.h-list li {
#nav-side input + ul > li:nth-child(n+2) {
display: none; }
#nav-side > li li {
- border-top: 1px solid #3f3f3f;
+ border-top: 1px solid #505050;
border-bottom: 1px solid #252525;
color: #fff; }
#nav-side > li li:not(:first-child) {
- background: #353535; }
+ background: #444; }
#nav-side > li li:first-child {
- border-bottom: 1px solid #1a1a1a; }
+ border-bottom: 1px solid #252525; }
#nav-side > li li:first-child {
padding: 7px 0 7px 7px; }
#nav-side > li li a {
display: block;
padding: 7px 0 7px 7px; }
#nav-side > li li a:hover {
- background: #3F3F3F; }
+ color: #252525;
+ background: #FBA026; }
#nav-side li:last-child li:last-child {
border-bottom: none; }
#nav-side .max, #nav-side .min {
@@ -4295,20 +4560,20 @@ label[for="nav-trigger"] {
user-select: none;
margin-top: 5px;
display: block;
- background: #ffffff;
+ background: #fff;
border: 1px solid #b7b7b7;
- -moz-box-shadow: inset 0px 1px 0px 0px #ffffff;
- -webkit-box-shadow: inset 0px 1px 0px 0px #ffffff;
- box-shadow: inset 0px 1px 0px 0px #ffffff; }
+ -moz-box-shadow: inset 0px 1px 0px 0px #fff;
+ -webkit-box-shadow: inset 0px 1px 0px 0px #fff;
+ box-shadow: inset 0px 1px 0px 0px #fff; }
.nav-top > li {
- -moz-box-shadow: inset 0px 1px 0px 0px #ffffff;
- -webkit-box-shadow: inset 0px 1px 0px 0px #ffffff;
- box-shadow: inset 0px 1px 0px 0px #ffffff;
- text-shadow: 1px 1px 1px #ffffff; }
+ -moz-box-shadow: inset 0px 1px 0px 0px #fff;
+ -webkit-box-shadow: inset 0px 1px 0px 0px #fff;
+ box-shadow: inset 0px 1px 0px 0px #fff;
+ text-shadow: 1px 1px 1px #fff; }
.nav-top > li:first-child {
- -moz-box-shadow: inset 1px 1px 0px 0px #ffffff;
- -webkit-box-shadow: inset 1px 1px 0px 0px #ffffff;
- box-shadow: inset 1px 1px 0px 0px #ffffff; }
+ -moz-box-shadow: inset 1px 1px 0px 0px #fff;
+ -webkit-box-shadow: inset 1px 1px 0px 0px #fff;
+ box-shadow: inset 1px 1px 0px 0px #fff; }
.nav-top li {
background: #fff;
@@ -4369,6 +4634,21 @@ label[for="nav-trigger"] {
/* Content box */
/* Navigation */
/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
main {
height: 100%;
width: 100%;
@@ -4377,7 +4657,7 @@ main {
bottom: 100%;
left: 0;
z-index: 1;
- background: #e7ebf3;
+ background: #fff;
transition: all 0.2s; }
/* Global */
@@ -4385,6 +4665,21 @@ main {
/* Content box */
/* Navigation */
/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
.pagination li {
display: inline; }
.pagination a {
@@ -4399,7 +4694,7 @@ main {
background: #f5f5ff;
padding: 5px 10px 5px 10px; }
.pagination .active, .pagination a:hover, .pagination a:active {
- color: #ffffff;
+ color: #fff;
background: #353535;
-moz-box-shadow: inset 1px 1px 0px 0px #e8e8e8;
-webkit-box-shadow: inset 1px 1px 0px 0px #e8e8e8;
@@ -4410,6 +4705,21 @@ main {
/* Content box */
/* Navigation */
/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
.meter {
height: 20px;
/* Can be anything */
@@ -4575,6 +4885,21 @@ main {
/* Content box */
/* Navigation */
/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
.box {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
@@ -4598,7 +4923,7 @@ section.box {
-moz-box-shadow: 0px 1px 0px 0px #f1f1f1;
-webkit-box-shadow: 0px 1px 0px 0px #f1f1f1;
box-shadow: 0px 1px 0px 0px #f1f1f1;
- border: 1px solid #b7b7b7;
+ border: 1px solid #d6d6d6;
background: #fff; }
section.box.orange {
border-top: 3px solid #FBA026; }
@@ -4612,6 +4937,8 @@ section.box {
border-top: 3px solid #553982; }
section.box.darkblue {
border-top: 3px solid #2969B0; }
+ section.box.purple {
+ border-top: 3px solid #553982; }
section header > h1 {
margin: 10px 10px 0 10px;
@@ -4632,6 +4959,21 @@ section > h2 {
/* Content box */
/* Navigation */
/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
.tabular {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
@@ -4735,6 +5077,21 @@ section > h2 {
/* Content box */
/* Navigation */
/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
table:not([id]) > thead .sort-asc, table:not([id]) > thead .sort-desc {
display: none; }
@@ -4748,16 +5105,22 @@ table .sort-asc, table .sort-desc {
color: #fff; }
.table thead {
color: #fff; }
- .table.red caption, .table.red thead {
- background: #B8312F; }
.table.orange caption, .table.orange thead {
background: #FBA026; }
+ .table.red caption, .table.red thead {
+ background: #B8312F; }
.table.green caption, .table.green thead {
background: #41A85F; }
- .table.blue caption, .table.blue thead {
- background: #2C82C9; }
.table.white caption, .table.white thead {
background: #fff; }
+ .table.blue caption, .table.blue thead {
+ background: #2C82C9; }
+ .table.purple caption, .table.purple thead {
+ background: #553982; }
+ .table.darkblue caption, .table.darkblue thead {
+ background: #2969B0; }
+ .table.purple caption, .table.purple thead {
+ background: #553982; }
table.table {
-moz-box-sizing: border-box;
@@ -4868,9 +5231,24 @@ table.list td {
/* Content box */
/* Navigation */
/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
.tag {
cursor: pointer;
- border: 1px solid #b7b7b7;
+ border: 1px solid #d6d6d6;
padding: 5px 10px 5px 10px;
font-size: 0.7rem;
color: #fff;
diff --git a/tab.css b/tab.css
index 9b0ae65..5d88161 100644
--- a/tab.css
+++ b/tab.css
@@ -1,45 +1,23 @@
-.ok {
- color: #5cff56; }
-
-.warning {
- color: #ff4b41; }
-
-.green {
- background: #c0ffb4; }
-
-.red {
- background: #ff7c70; }
-
-.blue {
- background: #c1c8ff; }
-
-.orange {
- background: #ffbf7c; }
-
-.lightblue {
- background: #b5ffff; }
-
-.yellow {
- background: #fffe97; }
-
-.purple {
- background: #bfa5ff; }
-
-.pink {
- background: #ffa6e3; }
-
-.grey {
- background: #dcdcdc; }
-
-.darkred {
- background: #d16059; }
-
-.darkgreen {
- background: #77d17c; }
-
-.darkblue {
- background: #7ba9d1; }
-
+/* Global */
+/* Content Container */
+/* Content box */
+/* Navigation */
+/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
.tabular {
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
@@ -48,26 +26,21 @@
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
- padding: 5px 0 4px 0; }
+ padding: 0.3rem 0 0 0.3rem; }
.tabular .tab-links label {
-moz-box-shadow: inset 1px 1px 0px 0px #ffffff;
-webkit-box-shadow: inset 1px 1px 0px 0px #ffffff;
box-shadow: inset 1px 1px 0px 0px #ffffff;
- -webkit-border-top-right-radius: 3px;
- border-top-right-radius: 3px;
- -webkit-border-top-left-radius: 3px;
- border-top-left-radius: 3px;
- background-clip: padding-box;
border-top: 1px solid #b7b7b7;
border-left: 1px solid #b7b7b7;
border-right: 1px solid #b7b7b7;
background: #f5f5ff;
- background: -moz-linear-gradient(top, #e0e3eb 0, #f5f5ff 100);
- background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #e0e3eb), color-stop(100, #f5f5ff));
- background: -webkit-linear-gradient(top, #e0e3eb 0, #f5f5ff 100);
- background: -o-linear-gradient(top, #e0e3eb 0, #f5f5ff 100);
- background: -ms-linear-gradient(top, #e0e3eb 0, #f5f5ff 100);
- background: linear-gradient(to bottom, #e0e3eb 0, #f5f5ff 100);
+ background: -moz-linear-gradient(top, #e0e3eb 0, #ffffff 100);
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #e0e3eb), color-stop(100, #ffffff));
+ background: -webkit-linear-gradient(top, #e0e3eb 0, #ffffff 100);
+ background: -o-linear-gradient(top, #e0e3eb 0, #ffffff 100);
+ background: -ms-linear-gradient(top, #e0e3eb 0, #ffffff 100);
+ background: linear-gradient(to bottom, #e0e3eb 0, #ffffff 100);
padding: 5px 10px 5px 10px;
text-shadow: 1px 1px 1px #ffffff;
font-size: 0.9em;
@@ -89,19 +62,10 @@
display: inline-block;
margin: 0 5px 0 0; }
.tabular .tab-content {
- -webkit-border-bottom-left-radius: 3px;
- border-bottom-left-radius: 3px;
- background-clip: padding-box;
- -webkit-border-bottom-right-radius: 3px;
- border-bottom-right-radius: 3px;
- background-clip: padding-box;
- -webkit-border-top-right-radius: 3px;
- border-top-right-radius: 3px;
- background-clip: padding-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
- background: #f5f5ff;
+ background: #ffffff;
border: 1px solid #b7b7b7;
padding: 10px; }
.tabular .tab-content > input {
@@ -112,24 +76,19 @@
display: inherit; }
.tabular-2 .tab-links {
- padding: 5px 0 0 0; }
+ padding: 0.3rem 0 0 0.3rem; }
.tabular-2 .tab-links label {
-moz-box-shadow: inset 1px 1px 0px 0px #ffffff;
-webkit-box-shadow: inset 1px 1px 0px 0px #ffffff;
box-shadow: inset 1px 1px 0px 0px #ffffff;
- -webkit-border-radius: 3px;
- -moz-border-radius: 3px;
- -ms-border-radius: 3px;
- border-radius: 3px;
- background-clip: padding-box;
border: 1px solid #b7b7b7;
background: #f5f5ff;
- background: -moz-linear-gradient(top, #e0e3eb 0, #f5f5ff 100);
- background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #e0e3eb), color-stop(100, #f5f5ff));
- background: -webkit-linear-gradient(top, #e0e3eb 0, #f5f5ff 100);
- background: -o-linear-gradient(top, #e0e3eb 0, #f5f5ff 100);
- background: -ms-linear-gradient(top, #e0e3eb 0, #f5f5ff 100);
- background: linear-gradient(to bottom, #e0e3eb 0, #f5f5ff 100);
+ background: -moz-linear-gradient(top, #e0e3eb 0, #ffffff 100);
+ background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #e0e3eb), color-stop(100, #ffffff));
+ background: -webkit-linear-gradient(top, #e0e3eb 0, #ffffff 100);
+ background: -o-linear-gradient(top, #e0e3eb 0, #ffffff 100);
+ background: -ms-linear-gradient(top, #e0e3eb 0, #ffffff 100);
+ background: linear-gradient(to bottom, #e0e3eb 0, #ffffff 100);
padding: 5px 10px 5px 10px;
text-shadow: 1px 1px 1px #ffffff;
font-size: 0.9em;
diff --git a/table.css b/table.css
index 237f2f6..98e8f9c 100644
--- a/table.css
+++ b/table.css
@@ -1,127 +1,155 @@
-/* Global */
-/* Content Container */
-/* Content box */
-/* Navigation */
-/* Colors */
-.table {
- background: none; }
- .table caption {
- color: #fff; }
- .table thead {
- color: #fff; }
- .table.red caption, .table.red thead {
- background: #B8312F; }
- .table.orange caption, .table.orange thead {
- background: #FBA026; }
- .table.green caption, .table.green thead {
- background: #41A85F; }
- .table.blue caption, .table.blue thead {
- background: #2C82C9; }
- .table.white caption, .table.white thead {
- background: #fff; }
-
-table.table {
- -moz-box-sizing: border-box;
- -webkit-box-sizing: border-box;
- box-sizing: border-box;
- width: 100%;
- font-size: 0.9em;
- max-width: 100%;
- overflow: hidden; }
- table.table caption {
- background: #fff;
- border-right: 1px solid #b7b7b7;
- border-left: 1px solid #b7b7b7;
- border-top: 1px solid #b7b7b7;
- padding: 5px; }
- table.table td {
- padding: 5px 10px 5px 10px;
- white-space: nowrap; }
- table.table tbody td:first-child {
- border-left: 1px solid #b7b7b7; }
- table.table tbody td:last-child {
- border-right: 1px solid #b7b7b7; }
- table.table tbody td {
- border-top: 1px solid #b7b7b7;
- -moz-box-shadow: inset 0px 1px 0px 0px #ffffff;
- -webkit-box-shadow: inset 0px 1px 0px 0px #ffffff;
- box-shadow: inset 0px 1px 0px 0px #ffffff; }
- table.table tbody tr {
- height: 2rem; }
- table.table tbody tr:nth-of-type(2n) {
- background: #f8f8f8; }
- table.table tbody tr:nth-of-type(2n+1) {
- background: #fff; }
- table.table tbody tr:hover {
- background: #f0f0f0; }
- table.table tbody tr:last-child td {
- border-bottom: 1px solid #b7b7b7; }
- table.table thead {
- background: #fff; }
- table.table thead td:first-child {
- border-left: 1px solid #b7b7b7; }
- table.table thead td:last-child {
- border-right: 1px solid #b7b7b7; }
- table.table .empty {
- text-align: center;
- color: #d8d8d8; }
- table.table tfoot {
- border: none; }
- table.table tfoot label {
- float: left; }
- table.table tfoot select {
- width: auto;
- float: right;
- margin: 0;
- min-width: 0px; }
- table.table tfoot td {
- text-align: center;
- padding-top: 10px; }
-
-table.list th {
- text-align: left;
- padding: 2px 0 2px 0; }
-table.list td {
- padding: 2px 5px 2px 5px; }
-
-@media screen and (max-width: 600px) {
- table.table {
- display: table;
- table-layout: fixed;
- width: 100%;
- border: 0; }
- table.table thead {
- display: none; }
- table.table tbody tr {
- height: auto;
- display: block;
- margin-bottom: .625em; }
- table.table tbody tr td:last-child {
- border-bottom: 1px solid #b7b7b7; }
- table.table tbody tr:last-child td {
- border-bottom: none; }
- table.table tbody tr:last-child td:last-child {
- border-bottom: 1px solid #b7b7b7; }
- table.table tbody td {
- border-left: 1px solid #b7b7b7;
- border-right: 1px solid #b7b7b7;
- display: block;
- font-size: .8rem;
- text-align: right;
- position: relative;
- height: 2rem;
- line-height: 2rem;
- text-overflow: ellipsis;
- overflow: hidden;
- max-width: 100%; }
- table.table tbody td:before {
- content: attr(data-label);
- float: left;
- margin-right: 10px;
- font-weight: bold; }
- table.table tfoot {
- display: none; } }
-.nobreak {
- white-space: nowrap; }
-
-/*# sourceMappingURL=table.css.map */
+/* Global */
+/* Content Container */
+/* Content box */
+/* Navigation */
+/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
+table:not([id]) > thead .sort-asc, table:not([id]) > thead .sort-desc {
+ display: none; }
+
+table .sort-asc, table .sort-desc {
+ padding-left: 5px;
+ cursor: pointer; }
+
+.table {
+ background: none; }
+ .table caption {
+ color: #fff; }
+ .table thead {
+ color: #fff; }
+ .table.orange caption, .table.orange thead {
+ background: #FBA026; }
+ .table.red caption, .table.red thead {
+ background: #B8312F; }
+ .table.green caption, .table.green thead {
+ background: #41A85F; }
+ .table.white caption, .table.white thead {
+ background: #fff; }
+ .table.blue caption, .table.blue thead {
+ background: #2C82C9; }
+ .table.purple caption, .table.purple thead {
+ background: #553982; }
+ .table.darkblue caption, .table.darkblue thead {
+ background: #2969B0; }
+ .table.purple caption, .table.purple thead {
+ background: #553982; }
+
+table.table {
+ -moz-box-sizing: border-box;
+ -webkit-box-sizing: border-box;
+ box-sizing: border-box;
+ width: 100%;
+ font-size: 0.9em;
+ max-width: 100%;
+ overflow: hidden; }
+ table.table caption {
+ background: #fff;
+ border-right: 1px solid #b7b7b7;
+ border-left: 1px solid #b7b7b7;
+ border-top: 1px solid #b7b7b7;
+ padding: 5px; }
+ table.table td {
+ padding: 5px 10px 5px 10px;
+ white-space: nowrap; }
+ table.table tbody td:first-child {
+ border-left: 1px solid #b7b7b7; }
+ table.table tbody td:last-child {
+ border-right: 1px solid #b7b7b7; }
+ table.table tbody td {
+ border-top: 1px solid #b7b7b7;
+ -moz-box-shadow: inset 0px 1px 0px 0px #ffffff;
+ -webkit-box-shadow: inset 0px 1px 0px 0px #ffffff;
+ box-shadow: inset 0px 1px 0px 0px #ffffff; }
+ table.table tbody tr {
+ height: 2rem; }
+ table.table tbody tr:nth-of-type(2n) {
+ background: #f8f8f8; }
+ table.table tbody tr:nth-of-type(2n+1) {
+ background: #fff; }
+ table.table tbody tr:hover {
+ background: #f0f0f0; }
+ table.table tbody tr:last-child td {
+ border-bottom: 1px solid #b7b7b7; }
+ table.table thead {
+ background: #fff; }
+ table.table thead td:first-child {
+ border-left: 1px solid #b7b7b7; }
+ table.table thead td:last-child {
+ border-right: 1px solid #b7b7b7; }
+ table.table .empty {
+ text-align: center;
+ color: #d8d8d8; }
+ table.table tfoot {
+ border: none; }
+ table.table tfoot label {
+ float: left; }
+ table.table tfoot select {
+ width: auto;
+ float: right;
+ margin: 0;
+ min-width: 0px; }
+ table.table tfoot td {
+ text-align: center;
+ padding-top: 10px; }
+
+table.list th {
+ text-align: left;
+ padding: 2px 0 2px 0; }
+table.list td {
+ padding: 2px 5px 2px 5px; }
+
+@media screen and (max-width: 600px) {
+ table.table {
+ display: table;
+ table-layout: fixed;
+ width: 100%;
+ border: 0; }
+ table.table thead {
+ display: none; }
+ table.table tbody tr {
+ height: auto;
+ display: block;
+ margin-bottom: .625em; }
+ table.table tbody tr td:last-child {
+ border-bottom: 1px solid #b7b7b7; }
+ table.table tbody tr:last-child td {
+ border-bottom: none; }
+ table.table tbody tr:last-child td:last-child {
+ border-bottom: 1px solid #b7b7b7; }
+ table.table tbody td {
+ border-left: 1px solid #b7b7b7;
+ border-right: 1px solid #b7b7b7;
+ display: block;
+ font-size: .8rem;
+ text-align: right;
+ position: relative;
+ height: 2rem;
+ line-height: 2rem;
+ text-overflow: ellipsis;
+ overflow: hidden;
+ max-width: 100%; }
+ table.table tbody td:before {
+ content: attr(data-label);
+ float: left;
+ margin-right: 10px;
+ font-weight: bold; }
+ table.table tfoot {
+ display: none; } }
+.nobreak {
+ white-space: nowrap; }
+
+/*# sourceMappingURL=table.css.map */
diff --git a/tag.css b/tag.css
new file mode 100644
index 0000000..d2c0038
--- /dev/null
+++ b/tag.css
@@ -0,0 +1,30 @@
+/* Global */
+/* Content Container */
+/* Content box */
+/* Navigation */
+/* Colors */
+/* Accordion */
+/* Log */
+/* Blockquote */
+/* Breadcrumbs */
+/* Input */
+/* Button */
+/* Canvas */
+/* Article */
+/* Form */
+/* Icon */
+/* Img */
+/* list */
+/* pagination */
+/* pre */
+/* tag */
+.tag {
+ cursor: pointer;
+ border: 1px solid #d6d6d6;
+ padding: 5px 10px 5px 10px;
+ font-size: 0.7rem;
+ color: #fff;
+ display: inline-block;
+ line-height: 1rem; }
+
+/*# sourceMappingURL=tag.css.map */
diff --git a/tests/app/3d.php b/tests/app/3d.php
new file mode 100644
index 0000000..e69de29
diff --git a/tests/app/actions.php b/tests/app/actions.php
new file mode 100644
index 0000000..e69de29
diff --git a/tests/app/forms.php b/tests/app/forms.php
index 865aa89..26fd424 100644
--- a/tests/app/forms.php
+++ b/tests/app/forms.php
@@ -37,7 +37,7 @@
|
- |
+ |
|
@@ -131,26 +131,26 @@
-