Upgraded to rails 3.1.8. Fixed various bugs in wiki.

app/assets/stylesheets/application.css

@@ -0,0 +1,8 @@
+/*
+*= require main
+*= require rails_messages
+*= require nav
+*= require simple_form
+*= require token-input
+*= require jquery.fancybox-1.3.4
+*/

app/assets/stylesheets/ie_hacks.css

@@ -0,0 +1,8 @@
+#nav {
+  text-align: left; }
+  #nav ul {
+    margin: 0; }
+    #nav ul li.current a:hover {
+      color: white; }
+    #nav ul li.current ul {
+      width: 100%; }

app/assets/stylesheets/jquery.fancybox-1.3.4.css

@@ -0,0 +1,359 @@
+/*
+ * FancyBox - jQuery Plugin
+ * Simple and fancy lightbox alternative
+ *
+ * Examples and documentation at: http://fancybox.net
+ * 
+ * Copyright (c) 2008 - 2010 Janis Skarnelis
+ * That said, it is hardly a one-person project. Many people have submitted bugs, code, and offered their advice freely. Their support is greatly appreciated.
+ * 
+ * Version: 1.3.4 (11/11/2010)
+ * Requires: jQuery v1.3+
+ *
+ * Dual licensed under the MIT and GPL licenses:
+ *   http://www.opensource.org/licenses/mit-license.php
+ *   http://www.gnu.org/licenses/gpl.html
+ */
+
+#fancybox-loading {
+	position: fixed;
+	top: 50%;
+	left: 50%;
+	width: 40px;
+	height: 40px;
+	margin-top: -20px;
+	margin-left: -20px;
+	cursor: pointer;
+	overflow: hidden;
+	z-index: 1104;
+	display: none;
+}
+
+#fancybox-loading div {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 40px;
+	height: 480px;
+	background-image: url('fancybox/fancybox.png');
+}
+
+#fancybox-overlay {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100%;
+	z-index: 1100;
+	display: none;
+}
+
+#fancybox-tmp {
+	padding: 0;
+	margin: 0;
+	border: 0;
+	overflow: auto;
+	display: none;
+}
+
+#fancybox-wrap {
+	position: absolute;
+	top: 0;
+	left: 0;
+	padding: 20px;
+	z-index: 1101;
+	outline: none;
+	display: none;
+}
+
+#fancybox-outer {
+	position: relative;
+	width: 100%;
+	height: 100%;
+	background: #fff;
+}
+
+#fancybox-content {
+	width: 0;
+	height: 0;
+	padding: 0;
+	outline: none;
+	position: relative;
+	overflow: hidden;
+	z-index: 1102;
+	border: 0px solid #fff;
+}
+
+#fancybox-hide-sel-frame {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+	background: transparent;
+	z-index: 1101;
+}
+
+#fancybox-close {
+	position: absolute;
+	top: -15px;
+	right: -15px;
+	width: 30px;
+	height: 30px;
+	background: transparent url('fancybox/fancybox.png') -40px 0px;
+	cursor: pointer;
+	z-index: 1103;
+	display: none;
+}
+
+#fancybox-error {
+	color: #444;
+	font: normal 12px/20px Arial;
+	padding: 14px;
+	margin: 0;
+}
+
+#fancybox-img {
+	width: 100%;
+	height: 100%;
+	padding: 0;
+	margin: 0;
+	border: none;
+	outline: none;
+	line-height: 0;
+	vertical-align: top;
+}
+
+#fancybox-frame {
+	width: 100%;
+	height: 100%;
+	border: none;
+	display: block;
+}
+
+#fancybox-left, #fancybox-right {
+	position: absolute;
+	bottom: 0px;
+	height: 100%;
+	width: 35%;
+	cursor: pointer;
+	outline: none;
+	background: transparent url('fancybox/blank.gif');
+	z-index: 1102;
+	display: none;
+}
+
+#fancybox-left {
+	left: 0px;
+}
+
+#fancybox-right {
+	right: 0px;
+}
+
+#fancybox-left-ico, #fancybox-right-ico {
+	position: absolute;
+	top: 50%;
+	left: -9999px;
+	width: 30px;
+	height: 30px;
+	margin-top: -15px;
+	cursor: pointer;
+	z-index: 1102;
+	display: block;
+}
+
+#fancybox-left-ico {
+	background-image: url('fancybox/fancybox.png');
+	background-position: -40px -30px;
+}
+
+#fancybox-right-ico {
+	background-image: url('fancybox/fancybox.png');
+	background-position: -40px -60px;
+}
+
+#fancybox-left:hover, #fancybox-right:hover {
+	visibility: visible; /* IE6 */
+}
+
+#fancybox-left:hover span {
+	left: 20px;
+}
+
+#fancybox-right:hover span {
+	left: auto;
+	right: 20px;
+}
+
+.fancybox-bg {
+	position: absolute;
+	padding: 0;
+	margin: 0;
+	border: 0;
+	width: 20px;
+	height: 20px;
+	z-index: 1001;
+}
+
+#fancybox-bg-n {
+	top: -20px;
+	left: 0;
+	width: 100%;
+	background-image: url('fancybox/fancybox-x.png');
+}
+
+#fancybox-bg-ne {
+	top: -20px;
+	right: -20px;
+	background-image: url('fancybox/fancybox.png');
+	background-position: -40px -162px;
+}
+
+#fancybox-bg-e {
+	top: 0;
+	right: -20px;
+	height: 100%;
+	background-image: url('fancybox/fancybox-y.png');
+	background-position: -20px 0px;
+}
+
+#fancybox-bg-se {
+	bottom: -20px;
+	right: -20px;
+	background-image: url('fancybox/fancybox.png');
+	background-position: -40px -182px; 
+}
+
+#fancybox-bg-s {
+	bottom: -20px;
+	left: 0;
+	width: 100%;
+	background-image: url('fancybox/fancybox-x.png');
+	background-position: 0px -20px;
+}
+
+#fancybox-bg-sw {
+	bottom: -20px;
+	left: -20px;
+	background-image: url('fancybox/fancybox.png');
+	background-position: -40px -142px;
+}
+
+#fancybox-bg-w {
+	top: 0;
+	left: -20px;
+	height: 100%;
+	background-image: url('fancybox/fancybox-y.png');
+}
+
+#fancybox-bg-nw {
+	top: -20px;
+	left: -20px;
+	background-image: url('fancybox/fancybox.png');
+	background-position: -40px -122px;
+}
+
+#fancybox-title {
+	font-family: Helvetica;
+	font-size: 12px;
+	z-index: 1102;
+}
+
+.fancybox-title-inside {
+	padding-bottom: 10px;
+	text-align: center;
+	color: #333;
+	background: #fff;
+	position: relative;
+}
+
+.fancybox-title-outside {
+	padding-top: 10px;
+	color: #fff;
+}
+
+.fancybox-title-over {
+	position: absolute;
+	bottom: 0;
+	left: 0;
+	color: #FFF;
+	text-align: left;
+}
+
+#fancybox-title-over {
+	padding: 10px;
+	background-image: url('fancybox/fancy_title_over.png');
+	display: block;
+}
+
+.fancybox-title-float {
+	position: absolute;
+	left: 0;
+	bottom: -20px;
+	height: 32px;
+}
+
+#fancybox-title-float-wrap {
+	border: none;
+	border-collapse: collapse;
+	width: auto;
+}
+
+#fancybox-title-float-wrap td {
+	border: none;
+	white-space: nowrap;
+}
+
+#fancybox-title-float-left {
+	padding: 0 0 0 15px;
+	background: url('fancybox/fancybox.png') -40px -90px no-repeat;
+}
+
+#fancybox-title-float-main {
+	color: #FFF;
+	line-height: 29px;
+	font-weight: bold;
+	padding: 0 0 3px 0;
+	background: url('fancybox/fancybox-x.png') 0px -40px;
+}
+
+#fancybox-title-float-right {
+	padding: 0 0 0 15px;
+	background: url('fancybox/fancybox.png') -55px -90px no-repeat;
+}
+
+/* IE6 */
+
+.fancybox-ie6 #fancybox-close { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_close.png', sizingMethod='scale'); }
+
+.fancybox-ie6 #fancybox-left-ico { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_nav_left.png', sizingMethod='scale'); }
+.fancybox-ie6 #fancybox-right-ico { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_nav_right.png', sizingMethod='scale'); }
+
+.fancybox-ie6 #fancybox-title-over { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_over.png', sizingMethod='scale'); zoom: 1; }
+.fancybox-ie6 #fancybox-title-float-left { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_left.png', sizingMethod='scale'); }
+.fancybox-ie6 #fancybox-title-float-main { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_main.png', sizingMethod='scale'); }
+.fancybox-ie6 #fancybox-title-float-right { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_right.png', sizingMethod='scale'); }
+
+.fancybox-ie6 #fancybox-bg-w, .fancybox-ie6 #fancybox-bg-e, .fancybox-ie6 #fancybox-left, .fancybox-ie6 #fancybox-right, #fancybox-hide-sel-frame {
+	height: expression(this.parentNode.clientHeight + "px");
+}
+
+#fancybox-loading.fancybox-ie6 {
+	position: absolute; margin-top: 0;
+	top: expression( (-20 + (document.documentElement.clientHeight ? document.documentElement.clientHeight/2 : document.body.clientHeight/2 ) + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop )) + 'px');
+}
+
+#fancybox-loading.fancybox-ie6 div	{ background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_loading.png', sizingMethod='scale'); }
+
+/* IE6, IE7, IE8 */
+
+.fancybox-ie .fancybox-bg { background: transparent !important; }
+
+.fancybox-ie #fancybox-bg-n { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_n.png', sizingMethod='scale'); }
+.fancybox-ie #fancybox-bg-ne { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_ne.png', sizingMethod='scale'); }
+.fancybox-ie #fancybox-bg-e { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_e.png', sizingMethod='scale'); }
+.fancybox-ie #fancybox-bg-se { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_se.png', sizingMethod='scale'); }
+.fancybox-ie #fancybox-bg-s { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_s.png', sizingMethod='scale'); }
+.fancybox-ie #fancybox-bg-sw { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_sw.png', sizingMethod='scale'); }
+.fancybox-ie #fancybox-bg-w { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_w.png', sizingMethod='scale'); }
+.fancybox-ie #fancybox-bg-nw { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_nw.png', sizingMethod='scale'); }

app/assets/stylesheets/main.sass

@@ -0,0 +1,662 @@
+// colors which are used in the foodsoft
+$main_red: #ED0606
+$hover_yellow: #ffff72
+$boxContent: #e4eed6
+$lightGrey: #efefef
+$darkGreen: #78b74e
+$lightGreen: #e4eed6
+
+// General rules ...
+body
+  :background-color #fff
+  :color black
+  :margin 0
+  :padding 1% 0 0 0
+  :min-width 990px
+  :font-size 62.5%
+  :font-family verdana, arial, sans-serif
+
+#loader
+  :position fixed
+  :top 1px
+  :right 1px
+  :background #FFF
+  :padding 10px
+  :color black
+  :border
+    :width 2px
+    :style solid 
+    color: $main_red
+
+a, a:visited
+  :text-decoration underline
+  :color black
+
+a:hover
+  color: $main_red
+
+h1, h2
+  color: $main_red
+
+h1
+  :font-size 2.2em
+  :line-height 0.8em
+  :padding 1em 0 5px 5%
+  :margin 0 0 1em 0
+  :border-bottom 
+    :width 1px
+    :style dotted 
+    color: $main_red
+
+h2
+  :font-size 1.4em
+  :margin-top .5em
+    
+h3
+  :font-size 1em
+  :margin-top 1.5em
+    
+input
+  :color #2e2e2e
+
+abbr, acronym
+  :cursor help
+
+input, textarea, select
+  border: 1px solid #D7D7D7
+  font-family: verdana, arial, helvetica, sans-serif
+  font-size: 0.9em
+  padding-left: .2em
+  padding-right: .2em
+
+input:focus, textarea:focus, select:focus
+  border-color: #000
+
+input[type="button"], input[type="submit"], input[type="reset"]
+  background: #EEEEEE none repeat scroll 0%
+  border: 1px outset #CCCCCC
+  color: #222222
+  padding: 0.1em 0.5em
+  font-size: 1em
+  font-weight: bold
+  min-width: 34px
+
+select
+  max-width: 15em
+
+option
+  border-top: 1px solid #D7D7D7
+  margin: .2em 0
+
+.click-me
+  cursor: pointer
+.left
+  float: left
+.right
+  float: right
+.clear
+  clear: both
+
+.description
+  color: grey
+  font-size: 0.9em
+
+.hidden
+  display: none
+
+.warning
+  background: yellow
+  font-weight: bold
+  padding: 1px 10px
+
+// ********************************* loginpage
+#login
+  :margin auto
+  :width 35em
+  :font-size 1.2em
+
+#login #meta
+  :margin-top 2em
+  :padding-top .3em
+  :border-top 1px dotted #ED0606
+  :color #2e2e2e
+
+    
+// ******************************** - Logo - head
+#header 
+  :margin 0
+  :padding 0
+
+
+#logo 
+  background: $main_red
+  :height 1.1em
+  :width 8em
+  :padding 0 20px
+  :text-align left
+  :line-height 54px
+  :font-size 54px
+  :overflow hidden
+  :letter-spacing -3px
+  :margin 0
+  a, a:hover
+    :color white
+    background-color: $main_red
+    :text-decoration none
+  a span
+    color: $main_red
+    :background #FFF
+    :padding-right 0.1em
+    :font-weight bold
+    :border-top
+      :width 2px
+      :style dotted 
+      color: $main_red
+    
+#logininfo
+  :position absolute
+  :top 3px
+  :right 10px
+  :font-size 1em
+  ul 
+    :list-style none
+    li 
+      :margin 0 0 0 5px
+      :float left
+  a 
+    :color #737272
+    :font-weight bold
+  a:hover 
+    color: $main_red
+    
+// *************************************  box structure
+#main 
+  :background #FFF
+  :padding 0
+  :margin 0 15px 0 15px
+
+//  ************************************* infobar
+#infobar 
+  :width 10% 
+  :min-width 5em
+  :float right
+  :padding 2.6em 1em
+  :margin 3em 0 0 0
+  :border-left 1px dotted #ED0606
+  :font-size 1.2em 
+  h3
+    :color #ED0606
+  ul 
+    :list-style none
+  li 
+    :margin .3em 0 0 -3em
+
+// ************************************ embedded menu
+.menu, #start_nav
+  :border 2px solid #e3e3e3
+  :background #f5f5f5
+  :padding 0 10px 0px 5px
+  :float left
+
+  ul 
+    :list-style-type none
+    :margin 0 0 0.2em 0
+    :padding 0
+
+    li 
+      :border-bottom 1px solid #dedede
+      :color #666
+      :margin 0.8em 0 0 0
+      :font-weight bold    
+      a:link, a:visited 
+        :display block
+        :padding 0.25em 1em
+        :text-decoration none
+        :width 12em 
+      a:hover, a:focus 
+        :background-color #e3e3e3
+
+      ul 
+        :margin 0
+        :padding 0
+        li 
+          :border-top 1px solid #dedede
+          :border-bottom none
+          :margin 0
+          :font-weight normal
+          a:link, a:visited 
+            :width 11.5em
+            :padding 0 1em 0.1em 1.5em
+            :font-weight normal
+            :text-decoration none
+.menu
+  :position absolute
+  :top 100px
+  :right 1px
+  
+// ************************************** content
+#content 
+  :padding .5em 0 2.5em 0
+  :margin 0
+  :background #FFF
+  :font-size 1.3em
+  :width 100%
+  :float left
+
+
+/************************************ tables
+table 
+  :border-collapse collapse
+  // border2px solid #e3e3e3
+  :text-align left
+  :width 100%
+  :margin 0
+  
+  thead th, tbody td, th, td 
+    :padding 0.3em  
+
+  thead tr  
+    :background-color #efefef
+  th
+    :color black
+  tr.odd, tr.even
+    :border-top 1px solid #DDDDDD 
+  tr.odd, tr.odd input
+    :background-color #F6F6F6
+  tr.even
+    :background-color #FBFBFB
+  tr.unavailable, tr.unavailable a
+    :color grey 
+  tr.unavailable a:hover
+    :color #ED0606
+  tr.just_updated
+    :color #008000
+  tr.selected, tr.active
+    :background-color #ffffc2
+  tr.ignored
+    color: grey
+  tr.success
+    color: green
+  tr.failed
+    color: red
+      
+table.list
+  //:border 2px solid #78b74e
+  tr
+    :border 1px solid #e3e3e3
+  tbody tr:hover
+    :background-color #EEEEDD
+    
+table tfoot tr
+  :background-color #fff
+  td
+    :padding-top 0.8em
+
+tr.edit_inline
+  background-color: $hover_yellow
+  td, span
+    :padding 0.5em 0.2em
+
+div.legend, div.legend table th  
+  :color grey
+  :font-size .8em
+  :background none
+
+form table 
+  :border none
+
+table.ordered_articles
+  :background-color #fff
+  tbody tr:hover
+    :background-color #EEEEDD
+  a
+    :display block
+  tr.results:hover
+    :background-color none
+  table
+    tfoot
+      :font-weight bold
+      
+td.currency, td.actions
+  :text-align right
+  :padding-right 0.5em
+td.closed
+  background: image-url('arrow_right_red.png') no-repeat center left
+  a
+    display: block
+    text-decoration: none
+    padding-left: 20px
+td.open
+  background: image-url('arrow_down_red.png') no-repeat center left
+
+// ************************************* for edit formulars
+div.edit_form
+  :border 2px solid #e3e3e3
+  :background #f5f5f5
+  :padding 0 0.8em 0.8em 0.8em
+  :margin 5px 0
+  :color black
+  
+#edit_article, #edit_box, #ajax_box
+  :position fixed
+  :top 5em
+  :left 10em
+  :width 55em
+  :background #FBFBFB
+  :padding 3em
+  :padding-top 1em
+  :border 
+    :width 3px
+    :style solid
+    color: $main_red
+  
+// ***************************************** other boxes */
+
+// *********boxes in columns ****/
+div.box 
+  :border-left 2px solid #78b74e
+  :padding-left 5px
+
+div.single_column 
+  :width 100%
+
+div.left_column 
+  :width 40%
+  :float left
+
+div.middle_column
+  :width 40%
+  :margin-left 10px
+  :float left
+
+div.right_column
+  :margin-bottom 3em
+  :width 55%
+  :float right
+
+// *********** content of boxes ******/
+
+div.box_title 
+  :background #78b74e
+  :padding 5px 10px
+  
+  h2, h2 a 
+    :color #FFF
+    :margin 0
+  h2
+    :font-size 1.3em 
+
+div.column_content 
+  background: $boxContent
+  :color black
+  :padding 10px
+  margin-bottom: 2em
+  h2 
+    :color black
+    :font-size 1.3em
+    :margin 1em 0 0 0
+  #links
+    :float right
+
+// for special pages
+// index-page
+
+
+
+
+// * article show
+tr.current_price
+  :background #cdee9e
+    
+
+// **** maybe later for the very little spinner
+li.check div.spinner
+  :display block 
+  :height 5px 
+  :width 21px 
+  :background-image image-url('dots-white.gif')
+  :line-height 16px 
+  :float left 
+  :margin-right 5px
+  :background-position center center
+  :background-repeat no-repeat
+
+
+// ************************************* the order page */
+span.used, span.unused
+  :font-weight bold
+span.used  
+  :color #008000
+span.unused
+  :color #ed0606
+span.total
+  :font-size 80% 
+table#order
+  :text-align center
+  input
+    font-size: 0.9em
+    font-weight: bolder
+    background-color: #78B74E
+    color: #fff
+    -moz-border-radius: 3px
+    -webkit-border-radius: 3px
+    padding: 0
+  th#col_required, th#col_tolerance
+    :width 145px
+  th#col_packages,  th#col_left_units
+    :width 50px
+  td.quantity, td.tolerance
+    text-align: right
+  td#col_left_units
+    :color #ed0606
+  td
+    :padding 0.6em
+  td.name
+    :text-align left
+    :padding-left 10px
+  tfoot
+    tr
+      background-color: $lightGreen
+    td
+      :padding-right 10px
+#order-footer, .article-info
+  text-align: left
+  z-index: 1
+  position: fixed
+  bottom: 0
+  background-color: #E4EED6
+  border-top: 2px solid #78B74E
+  //opacity: 0.95
+  #total-sum
+    width: 22em
+    margin: .5em 2em 0 0
+    float: right
+    #order-button
+      margin: .5em 0
+      input
+        background-color: #78B74E
+        color: #fff
+        -moz-border-radius: 3px
+        -webkit-border-radius: 3px
+      input:disabled
+        background-color: red
+#order-footer
+  width: 100%
+  right: 0
+  left: 0
+.article-info
+  z-index: 2
+  width: 45em
+  height: 8em
+  border: none
+  left: 30px
+  h3
+    text-align: center
+    margin: 0
+    margin-bottom: 5px
+    width: 100%
+  .right
+    width: 35%
+  .left
+    width: 60%
+tr.order-article .article-info
+  display: none
+tr.order-article:hover .article-info
+  display: block
+
+// ********* Comments
+#newComment
+  :margin 1em
+.comment
+  :border-bottom 1px dotted black
+  :padding .5em 0 1em .5em
+  .timestamp
+    :font-size 0.8em
+    :color grey
+    
+// *************** Clearing Order Page ..
+#editOrderNav
+  a
+    :color #fff
+    :font-weight bold
+  ul
+    :margin 0
+    :padding 0
+    li
+      :display inline
+      :list-style none
+      :margin-right 1em
+      
+// *************** Tasks ...
+.accepted
+  color: green
+  font-weight: bold
+.done, .done a, .done .accepted
+  color: grey
+  font-weight: normal
+  
+// **************  auto_complete
+ul.autocomplete
+  .nick, .informal
+    margin: auto
+  .nick
+    font-weight: bold
+  .informal
+    color: grey
+    margin-left: 1em
+    
+// ******* to navigate easy to the next element, e.g. next order
+#element_navigation
+  position: relative
+  top: -1em
+  left: 5%
+
+// group stats
+.stats-bar
+  height: 20px
+  min-width: 10px
+  border: 1px solid #DDDDDD
+  background-color: #fff
+  text-align: center
+  margin: 0 10px 10px 0
+  
+// *** wiki
+#wiki_content
+  border-style: none
+  color: black
+  line-height: 1.5em
+
+.wiki_show, .wiki_version, .wiki_new, .wiki_edit, .wiki_all
+  margin-top: 30px
+  padding: 10px
+  h1
+    padding-left: 0
+    padding-top: 10px
+    border-bottom:
+      :style solid
+  .column_content
+    margin-bottom: 0
+
+#wiki_content
+  min-height: 400px
+  span.editsection
+    display: none
+  h2, h3, h4, h5, h6
+    background: transparent none repeat scroll 0 0
+    border-bottom: 1px solid #AAAAAA
+    padding-bottom: 0,17em
+    padding-top: 0,5em
+    font-weight: normal
+    font-size: 150%
+    color: black
+  h3, h4, h5, h6
+    border-bottom: medium none
+    font-weight: bold
+  h3
+    font-size: 132%
+  h4
+    font-size: 116%
+  ul
+    line-height: 1.5em
+    margin: 0.3em 0 0 1.5em
+    padding: 0
+  ol
+    line-height: 1.5em
+    margin: 0.3em 0 0 3.2em
+    padding: 0
+    list-style-image: none
+  li
+    margin-bottom: 0.1em
+
+a.new_wiki_link
+  color: grey
+#preview
+  border: 1px dotted grey
+  padding: 0 1em
+#wikitoc
+  padding: 5px
+  margin-bottom: 2em
+  width: 25em
+  border: 1px solid grey
+  background-color: $lightGrey
+  h2
+    font-size: 1em
+    color: black
+    span a
+      font-size: 0.5em
+      color: grey
+
+#breadcrump
+  font-size: 0.5em
+  margin-bottom: 5px
+  height: 1em
+  color: #ED0606
+  a
+    color: $main_red
+    text-decoration: none
+  a:hover
+    text-decoration: underline
+#sidebar
+  float: right
+  width: 290px
+  margin-top: -60px
+  #sidebar-links
+    margin-bottom: 18px
+    text-align: right
+  #subpages
+    border: 1px solid #78b74e
+    margin-top: 10px
+    padding: 0 0 0 0
+  #versions
+    margin-top: 10px
+    border: 1px solid #78b74e
+
+#wiki-syntax-help
+  float: right
+  table
+    border-color: #78b74e
+
+.wiki_version
+  #sidebar
+    margin-top: -23px
+    border: 1px solid #78b74e

app/assets/stylesheets/nav.css

@@ -0,0 +1,58 @@
+/* Navigation .... */
+#nav {
+  position: relative;
+  height: 3em;
+  text-align: right;
+  margin-top: 5px; }
+  #nav ul {
+    padding: 0 0 0 0;
+    margin: -2.3em 0 0 0;
+    list-style: none; }
+    #nav ul li {
+      display: inline;
+      list-style: none;
+      padding: 0.3em 0 0.3em 0;
+      margin: 0 0 0 0.2em;
+      background: none;
+      vertical-align: middle; }
+      #nav ul li a {
+        margin: 0.1em 0 0 0;
+        text-align: center;
+        font-size: 1.1em;
+        font-weight: bold;
+        text-decoration: none;
+        color: #737272;
+        border: none;
+        background: #e3e3e3;
+        padding: 0.5em 1.2em 0.6em 1.2em;
+        margin-top: 0; }
+      #nav ul li a:hover {
+        color: #ed0606; }
+      #nav ul li ul {
+        display: none;
+        position: absolute;
+        margin: 0;
+        left: 0;
+        padding: 0.6em;
+        bottom: -1.4em;
+        right: 0em;
+        background: #ed0606; }
+        #nav ul li ul li {
+          border-left: 0.1em dotted white;
+          background: none; }
+        #nav ul li ul a, #nav ul li ul a:hover {
+          border: none;
+          background: none;
+          color: white;
+          font-style: normal;
+          font-size: 1em; }
+    #nav ul li.current a {
+      border: none;
+      border-bottom: none;
+      background: #ed0606;
+      padding-bottom: 0.6em;
+      color: white; }
+    #nav ul li.current ul {
+      display: inline; }
+      #nav ul li.current ul a {
+        background: none; }

app/assets/stylesheets/print.scss

@@ -0,0 +1,621 @@
+/* General rules ... */
+body {
+  background-color: #fff;
+  color: black;
+  margin: 0;
+  padding: 1% 0 0 0;
+  min-width: 990px;
+  font-size: 62.5%;
+  font-family: verdana, arial, sans-serif; }
+
+#loader {
+  position: fixed;
+  top: 1px;
+  right: 1px;
+  background: #FFF;
+  padding: 10px;
+  color: black;
+  border-width: 2px;
+  border-style: solid;
+  border-color: #ed0606; }
+
+a, a:visited {
+  text-decoration: underline;
+  color: black; }
+
+a:hover {
+  color: #ed0606; }
+
+h1, h2 {
+  color: #ed0606; }
+
+h1 {
+  font-size: 2.2em;
+  line-height: 0.8em;
+  padding: 1em 0 5px 5%;
+  margin: 0 0 1em 0;
+  border-bottom-width: 1px;
+  border-bottom-style: dotted;
+  border-bottom-color: #ed0606; }
+
+h2 {
+  font-size: 1.4em;
+  margin-top: .5em; }
+
+h3 {
+  font-size: 1em;
+  margin-top: 1.5em; }
+
+input {
+  color: #2e2e2e; }
+
+abbr, acronym {
+  cursor: help; }
+
+input, textarea, select {
+  border: 1px solid #D7D7D7;
+  font-family: verdana, arial, helvetica, sans-serif;
+  font-size: 0.9em;
+  padding-left: .2em;
+  padding-right: .2em; }
+
+input:focus, textarea:focus, select:focus {
+  border-color: #000; }
+
+input[type="button"], input[type="submit"], input[type="reset"] {
+  background: #EEEEEE none repeat scroll 0%;
+  border: 1px outset #CCCCCC;
+  color: #222222;
+  padding: 0.1em 0.5em;
+  font-size: 1em;
+  font-weight: bold;
+  min-width: 34px; }
+
+select {
+  max-width: 15em; }
+
+option {
+  border-top: 1px solid #D7D7D7;
+  margin: .2em 0; }
+
+span.click-me {
+  cursor: pointer; }
+
+.left {
+  float: left; }
+
+.right {
+  float: right; }
+
+.clear {
+  clear: both; }
+
+.description {
+  color: grey;
+  font-size: 0.9em; }
+
+.hidden {
+  display: none; }
+
+#login {
+  margin: auto;
+  width: 27em;
+  font-size: 1.2em; }
+
+#login #meta {
+  margin-top: 2em;
+  padding-top: .3em;
+  border-top: 1px dotted #ED0606;
+  color: #2e2e2e; }
+
+#header {
+  margin: 0;
+  padding: 0; }
+
+#logo {
+  background: #ed0606;
+  height: 1.1em;
+  width: 8em;
+  padding: 0 20px;
+  text-align: left;
+  line-height: 54px;
+  font-size: 54px;
+  overflow: hidden;
+  letter-spacing: -3px;
+  margin: 0; }
+  #logo a, #logo a:hover {
+    color: white;
+    background-color: #ed0606;
+    text-decoration: none; }
+  #logo a span {
+    color: #ed0606;
+    background: #FFF;
+    padding-right: 0.1em;
+    font-weight: bold;
+    border-top-width: 2px;
+    border-top-style: dotted;
+    border-top-color: #ed0606; }
+
+#logininfo {
+  position: absolute;
+  top: 3px;
+  right: 10px;
+  font-size: 1em; }
+  #logininfo ul {
+    list-style: none; }
+    #logininfo ul li {
+      margin: 0 0 0 5px;
+      float: left; }
+  #logininfo a {
+    color: #737272;
+    font-weight: bold; }
+  #logininfo a:hover {
+    color: #ed0606; }
+
+#main {
+  background: #FFF;
+  padding: 0;
+  margin: 0 15px 0 15px; }
+
+#infobar {
+  width: 10%;
+  min-width: 5em;
+  float: right;
+  padding: 2.6em 1em;
+  margin: 3em 0 0 0;
+  border-left: 1px dotted #ED0606;
+  font-size: 1.2em; }
+  #infobar h3 {
+    color: #ED0606; }
+  #infobar ul {
+    list-style: none; }
+  #infobar li {
+    margin: .3em 0 0 -3em; }
+
+.menu, #start_nav {
+  border: 2px solid #e3e3e3;
+  background: #f5f5f5;
+  padding: 0 10px 0px 5px;
+  float: left; }
+  .menu ul, #start_nav ul {
+    list-style-type: none;
+    margin: 0 0 0.2em 0;
+    padding: 0; }
+    .menu ul li, #start_nav ul li {
+      border-bottom: 1px solid #dedede;
+      color: #666;
+      margin: 0.8em 0 0 0;
+      font-weight: bold; }
+      .menu ul li a:link, .menu ul li a:visited, #start_nav ul li a:link, #start_nav ul li a:visited {
+        display: block;
+        padding: 0.25em 1em;
+        text-decoration: none;
+        width: 12em; }
+      .menu ul li a:hover, .menu ul li a:focus, #start_nav ul li a:hover, #start_nav ul li a:focus {
+        background-color: #e3e3e3; }
+      .menu ul li ul, #start_nav ul li ul {
+        margin: 0;
+        padding: 0; }
+        .menu ul li ul li, #start_nav ul li ul li {
+          border-top: 1px solid #dedede;
+          border-bottom: none;
+          margin: 0;
+          font-weight: normal; }
+          .menu ul li ul li a:link, .menu ul li ul li a:visited, #start_nav ul li ul li a:link, #start_nav ul li ul li a:visited {
+            width: 11.5em;
+            padding: 0 1em 0.1em 1.5em;
+            font-weight: normal;
+            text-decoration: none; }
+
+.menu {
+  position: absolute;
+  top: 100px;
+  right: 1px; }
+
+#content {
+  padding: .5em 0 2.5em 0;
+  margin: 0;
+  background: #FFF;
+  font-size: 1.3em;
+  width: 100%;
+  float: left; }
+
+/* *********************************** tables */
+table {
+  border-collapse: collapse;
+  text-align: left;
+  width: 100%;
+  margin: 0; }
+  table thead th, table tbody td, table th, table td {
+    padding: 0.3em; }
+  table thead tr {
+    background-color: #efefef; }
+  table th {
+    color: black; }
+  table tr.odd, table tr.even {
+    border-top: 1px solid #DDDDDD; }
+  table tr.odd, table tr.odd input {
+    background-color: #F6F6F6; }
+  table tr.even {
+    background-color: #FBFBFB; }
+  table tr.unavailable, table tr.unavailable a {
+    color: grey; }
+  table tr.unavailable a:hover {
+    color: #ED0606; }
+  table tr.just_updated {
+    color: #008000; }
+  table tr.selected, table tr.active {
+    background-color: #ffffc2; }
+  table tr.click-me {
+    cursor: pointer; }
+  table tr.ignored {
+    color: grey; }
+  table tr.success {
+    color: green; }
+  table tr.failed {
+    color: red; }
+
+table.list tr {
+  border: 1px solid #e3e3e3; }
+table.list tbody tr:hover {
+  background-color: #EEEEDD; }
+
+table tfoot tr {
+  background-color: #fff; }
+  table tfoot tr td {
+    padding-top: 0.8em; }
+
+tr.edit_inline {
+  background-color: #ffff72; }
+  tr.edit_inline td, tr.edit_inline span {
+    padding: 0.5em 0.2em; }
+
+div.legend, div.legend table th {
+  color: grey;
+  font-size: .8em;
+  background: none; }
+
+form table {
+  border: none; }
+
+table.ordered_articles {
+  background-color: #fff; }
+  table.ordered_articles tbody tr:hover {
+    background-color: #EEEEDD; }
+  table.ordered_articles a {
+    display: block; }
+  table.ordered_articles tr.results:hover {
+    background-color: none; }
+  table.ordered_articles table tfoot {
+    font-weight: bold; }
+
+td.currency, td.actions {
+  text-align: right;
+  padding-right: 0.5em; }
+
+td.closed {
+  background: image-url('arrow_right_red.png') no-repeat center left; }
+  td.closed a {
+    display: block;
+    text-decoration: none;
+    padding-left: 20px; }
+
+td.open {
+  background: image-url('arrow_down_red.png') no-repeat center left; }
+
+div.edit_form {
+  border: 2px solid #e3e3e3;
+  background: #f5f5f5;
+  padding: 0 0.8em 0.8em 0.8em;
+  margin: 5px 0;
+  color: black; }
+
+#edit_article, #edit_box, #ajax_box {
+  position: fixed;
+  top: 5em;
+  left: 10em;
+  width: 55em;
+  background: #FBFBFB;
+  padding: 3em;
+  padding-top: 1em;
+  border-width: 3px;
+  border-style: solid;
+  border-color: #ed0606; }
+
+div.box {
+  border-left: 2px solid #78b74e;
+  padding-left: 5px; }
+
+div.single_column {
+  width: 100%; }
+
+div.left_column {
+  width: 40%;
+  float: left; }
+
+div.middle_column {
+  width: 40%;
+  margin-left: 10px;
+  float: left; }
+
+div.right_column {
+  margin-bottom: 3em;
+  width: 55%;
+  float: right; }
+
+div.box_title {
+  background: #78b74e;
+  padding: 5px 10px; }
+  div.box_title h2, div.box_title h2 a {
+    color: #FFF;
+    margin: 0; }
+  div.box_title h2 {
+    font-size: 1.3em; }
+
+div.column_content {
+  background: #e4eed6;
+  color: black;
+  padding: 10px;
+  margin-bottom: 2em; }
+  div.column_content h2 {
+    color: black;
+    font-size: 1.3em;
+    margin: 1em 0 0 0; }
+  div.column_content #links {
+    float: right; }
+
+tr.current_price {
+  background: #cdee9e; }
+
+li.check div.spinner {
+  display: block;
+  height: 5px;
+  width: 21px;
+  background-image: image-url('dots-white.gif');
+  line-height: 16px;
+  float: left;
+  margin-right: 5px;
+  background-position: center center;
+  background-repeat: no-repeat; }
+
+span.used, span.unused {
+  font-weight: bold; }
+
+span.used {
+  color: #008000; }
+
+span.unused {
+  color: #ed0606; }
+
+span.total {
+  font-size: 80%; }
+
+table#order {
+  text-align: center; }
+  table#order input {
+    font-size: 0.9em;
+    font-weight: bolder;
+    background-color: #78B74E;
+    color: #fff;
+    -moz-border-radius: 3px;
+    -webkit-border-radius: 3px;
+    padding: 0; }
+  table#order th#col_required, table#order th#col_tolerance {
+    width: 140px; }
+  table#order th#col_packages, table#order th#col_left_units {
+    width: 50px; }
+  table#order td.quantity, table#order td.tolerance {
+    text-align: right; }
+  table#order td#col_left_units {
+    color: #ed0606; }
+  table#order td {
+    padding: 0.6em; }
+  table#order td.name {
+    text-align: left;
+    padding-left: 10px; }
+  table#order tfoot tr {
+    background-color: #e4eed6; }
+  table#order tfoot td {
+    padding-right: 10px; }
+
+#order-footer, .article-info {
+  text-align: left;
+  z-index: 1;
+  position: fixed;
+  bottom: 0;
+  background-color: #E4EED6;
+  border-top: 2px solid #78B74E; }
+  #order-footer #total-sum, .article-info #total-sum {
+    width: 22em;
+    margin: .5em 2em 0 0;
+    float: right; }
+    #order-footer #total-sum #order-button, .article-info #total-sum #order-button {
+      margin: .5em 0; }
+      #order-footer #total-sum #order-button input, .article-info #total-sum #order-button input {
+        background-color: #78B74E;
+        color: #fff;
+        -moz-border-radius: 3px;
+        -webkit-border-radius: 3px; }
+      #order-footer #total-sum #order-button input:disabled, .article-info #total-sum #order-button input:disabled {
+        background-color: red; }
+
+#order-footer {
+  width: 100%;
+  right: 0;
+  left: 0; }
+
+.article-info {
+  z-index: 2;
+  width: 45em;
+  height: 8em;
+  border: none;
+  left: 30px; }
+  .article-info h3 {
+    text-align: center;
+    margin: 0;
+    margin-bottom: 5px;
+    width: 100%; }
+  .article-info .right {
+    width: 35%; }
+  .article-info .left {
+    width: 60%; }
+
+tr.order-article .article-info {
+  display: none; }
+
+tr.order-article:hover .article-info {
+  display: block; }
+
+#newComment {
+  margin: 1em; }
+
+.comment {
+  border-bottom: 1px dotted black;
+  padding: .5em 0 1em .5em; }
+  .comment .timestamp {
+    font-size: 0.8em;
+    color: grey; }
+
+#editOrderNav a {
+  color: #fff;
+  font-weight: bold; }
+#editOrderNav ul {
+  margin: 0;
+  padding: 0; }
+  #editOrderNav ul li {
+    display: inline;
+    list-style: none;
+    margin-right: 1em; }
+
+.accepted {
+  color: green;
+  font-weight: bold; }
+
+.done, .done a, .done .accepted {
+  color: grey;
+  font-weight: normal; }
+
+ul.autocomplete .nick, ul.autocomplete .informal {
+  margin: auto; }
+ul.autocomplete .nick {
+  font-weight: bold; }
+ul.autocomplete .informal {
+  color: grey;
+  margin-left: 1em; }
+
+#element_navigation {
+  position: relative;
+  top: -1em;
+  left: 5%; }
+
+.stats-bar {
+  height: 20px;
+  min-width: 10px;
+  border: 1px solid #DDDDDD;
+  background-color: #fff;
+  text-align: center;
+  margin: 0 10px 10px 0; }
+
+.wiki_show, .wiki_version, .wiki_new, .wiki_edit, .wiki_all {
+  margin-top: 30px;
+  padding: 10px; }
+
+#wiki_content {
+  border: 1px solid grey;
+  margin-right: 300px;
+  padding: 10px;
+  color: black;
+  line-height: 1.5em;
+  min-height: 400px; }
+  #wiki_content span.editsection {
+    display: none; }
+  #wiki_content h1 {
+    padding-left: 0;
+    padding-top: 10px;
+    border: none;
+    margin-bottom: 10px; }
+  #wiki_content h2, #wiki_content h3, #wiki_content h4, #wiki_content h5, #wiki_content h6 {
+    background: transparent none repeat scroll 0 0;
+    border-bottom: 1px solid #AAAAAA;
+    padding-bottom: 0,17em;
+    padding-top: 0,5em;
+    font-weight: normal;
+    font-size: 150%;
+    color: black; }
+  #wiki_content h3, #wiki_content h4, #wiki_content h5, #wiki_content h6 {
+    border-bottom: medium none;
+    font-weight: bold; }
+  #wiki_content h3 {
+    font-size: 132%; }
+  #wiki_content h4 {
+    font-size: 116%; }
+  #wiki_content ul {
+    line-height: 1.5em;
+    margin: 0.3em 0 0 1.5em;
+    padding: 0; }
+  #wiki_content ol {
+    line-height: 1.5em;
+    margin: 0.3em 0 0 3.2em;
+    padding: 0;
+    list-style-image: none; }
+
+a.new_wiki_link {
+  color: grey; }
+
+#preview {
+  border: 1px dotted grey;
+  padding: 0 1em; }
+
+#wikitoc {
+  padding: 5px;
+  margin-bottom: 2em;
+  width: 25em;
+  border: 1px solid grey;
+  background-color: #efefef; }
+  #wikitoc h2 {
+    font-size: 1em;
+    color: black; }
+    #wikitoc h2 span a {
+      font-size: 0.5em;
+      color: grey; }
+
+#breadcrump {
+  font-size: 0.5em;
+  margin-bottom: 5px;
+  height: 1em;
+  color: #ED0606; }
+  #breadcrump a {
+    color: #ed0606;
+    text-decoration: none; }
+  #breadcrump a:hover {
+    text-decoration: underline; }
+
+#sidebar {
+  float: right;
+  width: 290px; }
+  #sidebar #sidebar-links {
+    margin-bottom: 18px;
+    text-align: right; }
+  #sidebar #subpages {
+    border: 1px solid #78b74e;
+    margin-top: 10px;
+    padding: 0 0 0 0; }
+  #sidebar #versions {
+    margin-top: 10px;
+    border: 1px solid #78b74e; }
+
+#wiki-syntax-help {
+  float: right; }
+  #wiki-syntax-help table {
+    border-color: #78b74e; }
+
+.wiki_version #sidebar {
+  margin-top: -23px;
+  border: 1px solid #78b74e; }
+
+#logininfo, #header, #footer {
+  display: none; }
+
+h1, h2 {
+  color: black;
+  border-color: black; }

app/assets/stylesheets/rails_messages.scss

@@ -0,0 +1,68 @@
+/* rails messages .... */
+h3.notice, div.notice {
+  color: #090; }
+
+h3.notice {
+  background: #dfd image-url('icon_message.gif') no-repeat 10px 3px;
+  border: 1px solid #bfb;
+  padding: 4px 40px;
+  margin: 2em 0 1em 0;
+  font-size: 100%;
+  position: relative; }
+
+h3.alert, div.alert, div.error {
+  color: red;
+  font-size: 100%;
+  font-weight: bold; }
+
+h3.alert {
+  background: yellow image-url('error.png') no-repeat 10px 3px;
+  border: 1px solid red;
+  padding: 4px 40px;
+  position: relative;
+  margin: 2em 0 1em 0;
+  font-weight: normal; }
+
+.fieldWithErrors {
+  padding: 2px;
+  background-color: red;
+  display: table; }
+
+.fieldWithErrors input {
+  background-color: yellow; }
+
+#errorExplanation {
+  width: 40em;
+  padding: 7px;
+  padding-bottom: 12px;
+  color: #ed0606; }
+  #errorExplanation h2 {
+    color: #ed0606;
+    text-align: left;
+    font-weight: bold;
+    margin: 0;
+    padding: 5px 5px 5px 5px;
+    font-size: 15px; }
+  #errorExplanation p {
+    margin: 0;
+    padding: 5px; }
+  #errorExplanation ul, #errorExplanation li {
+    margin: 0; }
+  #errorExplanation li {
+    padding: 0;
+    font-size: 12px;
+    list-style: square; }
+
+div.uploadStatus {
+  margin: 5px; }
+
+div.progressBar {
+  margin: 5px; }
+  div.progressBar div.border {
+    background-color: #fff;
+    border: 1px solid grey;
+    width: 100%; }
+  div.progressBar div.background {
+    background-color: #333;
+    height: 18px;
+    width: 0%; }

app/assets/stylesheets/scaffold.css

@@ -0,0 +1,54 @@
+body { background-color: #fff; color: #333; }
+
+body, p, ol, ul, td {
+  font-family: verdana, arial, helvetica, sans-serif;
+  font-size:   13px;
+  line-height: 18px;
+}
+
+pre {
+  background-color: #eee;
+  padding: 10px;
+  font-size: 11px;
+}
+
+a { color: #000; }
+a:visited { color: #666; }
+a:hover { color: #fff; background-color:#000; }
+
+.fieldWithErrors {
+  padding: 2px;
+  background-color: red;
+  display: table;
+}
+
+#errorExplanation {
+  width: 400px;
+  border: 2px solid red;
+  padding: 7px;
+  padding-bottom: 12px;
+  margin-bottom: 20px;
+  background-color: #f0f0f0;
+}
+
+#errorExplanation h2 {
+  text-align: left;
+  font-weight: bold;
+  padding: 5px 5px 5px 15px;
+  font-size: 12px;
+  margin: -7px;
+  background-color: #c00;
+  color: #fff;
+}
+
+#errorExplanation p {
+  color: #333;
+  margin-bottom: 0;
+  padding: 5px;
+}
+
+#errorExplanation ul li {
+  font-size: 12px;
+  list-style: square;
+}
+

app/assets/stylesheets/simple_form.css

@@ -0,0 +1,42 @@
+.simple_form label {
+    float: left;
+    width: 120px;
+    text-align: right;
+    margin: 2px 10px;
+}
+
+.simple_form div.input {
+    margin-bottom: 10px;
+    clear: both;
+}
+
+.simple_form div.boolean, .simple_form input[type='submit'] {
+    margin-left: 140px;
+}
+
+.simple_form div.boolean label, .simple_form label.collection_radio {
+    float: none;
+    margin: 0;
+}
+
+.simple_form label.collection_radio {
+    margin-right: 10px;
+    margin-left: 2px;
+}
+
+.simple_form .error {
+    clear: left;
+    margin-left: 140px;
+    font-size: 12px;
+    color: #D00;
+    display: block;
+}
+
+.simple_form .hint {
+    clear: left;
+    margin-left: 140px;
+    font-size: 12px;
+    color: #555;
+    display: block;
+    font-style: italic;
+}

app/assets/stylesheets/token-input.css

@@ -0,0 +1,112 @@
+/* Example tokeninput style #1: Token vertical list*/
+ul.token-input-list {
+    overflow: hidden; 
+    height: auto !important; 
+    height: 1%;
+    width: 300px;
+    border: 1px solid #999;
+    cursor: text;
+    font-size: 12px;
+    font-family: Verdana;
+    z-index: 999;
+    margin: 0;
+    padding: 0;
+    background-color: #fff;
+    list-style-type: none;
+}
+
+ul.token-input-list li {
+    list-style-type: none;
+}
+
+ul.token-input-list li input {
+    border: 0;
+    width: 350px;
+    padding: 3px 8px;
+    background-color: white;
+    -webkit-appearance: caret;
+}
+
+li.token-input-token {
+    overflow: hidden; 
+    height: auto !important; 
+    height: 1%;
+    margin: 3px;
+    padding: 3px 5px;
+    background-color: #d0efa0;
+    color: #000;
+    font-weight: bold;
+    cursor: default;
+    display: block;
+}
+
+li.token-input-token p {
+    float: left;
+    padding: 0;
+    margin: 0;
+}
+
+li.token-input-token span {
+    float: right;
+    color: #777;
+    cursor: pointer;
+}
+
+li.token-input-selected-token {
+    background-color: #08844e;
+    color: #fff;
+}
+
+li.token-input-selected-token span {
+    color: #bbb;
+}
+
+div.token-input-dropdown {
+    position: absolute;
+    width: 400px;
+    background-color: #fff;
+    overflow: hidden;
+    border-left: 1px solid #ccc;
+    border-right: 1px solid #ccc;
+    border-bottom: 1px solid #ccc;
+    cursor: default;
+    font-size: 12px;
+    font-family: Verdana;
+    z-index: 1;
+}
+
+div.token-input-dropdown p {
+    margin: 0;
+    padding: 5px;
+    font-weight: bold;
+    color: #777;
+}
+
+div.token-input-dropdown ul {
+    margin: 0;
+    padding: 0;
+}
+
+div.token-input-dropdown ul li {
+    background-color: #fff;
+    padding: 3px;
+    list-style-type: none;
+}
+
+div.token-input-dropdown ul li.token-input-dropdown-item {
+    background-color: #fafafa;
+}
+
+div.token-input-dropdown ul li.token-input-dropdown-item2 {
+    background-color: #fff;
+}
+
+div.token-input-dropdown ul li em {
+    font-weight: bold;
+    font-style: normal;
+}
+
+div.token-input-dropdown ul li.token-input-selected-dropdown-item {
+    background-color: #d0efa0;
+}
+