several minor changes:color,buttons,text

7 files changed, 72 insertions, 48 deletions

diff --git a/public/images/greendot.png b/public/images/greendot.png
new file mode 100644
index 0000000..867dffa
--- /dev/null
+++ b/public/images/greendot.png
diff --git a/public/images/reddot.png b/public/images/reddot.png
new file mode 100644
index 0000000..73ea745
--- /dev/null
+++ b/public/images/reddot.png
diff --git a/public/stylesheets/screen.css b/public/stylesheets/screen.css
index 95d3fb6..84f943a 100644
--- a/public/stylesheets/screen.css
+++ b/public/stylesheets/screen.css
@@ -1 +1 @@
-body{background-image:url("/images/gray_jean.png");background-color:#ccf;overflow:scroll;font-family:sans-serif;min-width:800px;min-heigth:600px}body a{text-decoration:none;font-weight:bold;color:#000}.logo img{float:left;display:inline;margin-right:1em}.content{background-image:url("/images/gray_jean.png")}.content h1{margin:0.3em;text-shadow:#fff 1px 1px 0;font-size:x-large;font-family:Verdana;display:inline}.content h2{text-shadow:#fff 1px 1px 0;font-size:x-large;color:#f55}.content .arrow{margin:5px 0px 5px 20px}.content .back{display:inline}.content .close{text-align:right}.content #back-top{z-index:100;position:fixed;bottom:3%;margin-left:91%}.content #back-top a:hover{color:#bbb}.content fieldset#top{border:0;padding:10px;background-color:#dbc87b;-moz-border-radius-topleft:25px;-webkit-border-top-left-radius:25px;border-top-left-radius:25px;-moz-border-radius-topright:25px;-webkit-border-top-right-radius:25px;border-top-right-radius:25px;-webkit-background-clip:border;-moz-background-clip:border;background-clip:border-box;-webkit-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;-moz-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset}.content fieldset#top a#linkInsert{display:block;width:100%;height:2em}.content fieldset#top #appletContainer{padding:10px}.content fieldset#middle{border:0;padding:10px;background-color:#dbc87b;-webkit-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;-moz-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset}.content fieldset#middle a#linkModels{display:block;width:100%;height:2em}.content fieldset#middle #endpoint{padding-top:2em}.content fieldset#middle #model a{display:inline;font-weight:normal}.content fieldset#bottom{border:0;background-color:#dbc87b;padding:10px;margin-bottom:5em;-webkit-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;-moz-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;-moz-border-radius-bottomleft:25px;-webkit-border-bottom-left-radius:25px;border-bottom-left-radius:25px;-moz-border-radius-bottomright:25px;-webkit-border-bottom-right-radius:25px;border-bottom-right-radius:25px;-webkit-background-clip:border;-moz-background-clip:border;background-clip:border-box}.content fieldset#bottom input#predict{margin-left:1em}.content .predictions{background-color:#dbc87b;padding:10px;text-align:justify;-webkit-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;-moz-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;-moz-border-radius-topleft:25px;-webkit-border-top-left-radius:25px;border-top-left-radius:25px;-moz-border-radius-bottomleft:25px;-webkit-border-bottom-left-radius:25px;border-bottom-left-radius:25px;-moz-border-radius-topright:25px;-webkit-border-top-right-radius:25px;border-top-right-radius:25px;-moz-border-radius-bottomright:25px;-webkit-border-bottom-right-radius:25px;border-bottom-right-radius:25px;-webkit-background-clip:border;-moz-background-clip:border;background-clip:border-box}.content .overview{background-image:url("/images/gray_jean.png");padding:12px;margin-top:1em;text-align:center;-webkit-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;-moz-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;-moz-border-radius-topleft:25px;-webkit-border-top-left-radius:25px;border-top-left-radius:25px;-moz-border-radius-topright:25px;-webkit-border-top-right-radius:25px;border-top-right-radius:25px;-webkit-background-clip:border;-moz-background-clip:border;background-clip:border-box}.content .overview caption{text-align:left}.content .overview #overview tr td{background-color:#fff;border:1px solid #dad9c7;padding-left:1em}.content .overview #overview tr td#compound{width:200px}.content .overview #overview tr td.ctrue{padding-top:0.5em;background-color:#ff5a3b;-webkit-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;-moz-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset}.content .overview #overview tr td.cfalse{padding-top:0.5em;background-color:#82ba4b;-webkit-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;-moz-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset}.content .overview #overview tr td.c1{padding-top:0.5em;background-color:#ff5a3b;-webkit-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;-moz-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset}.content .overview #overview tr td.c0{padding-top:0.5em;background-color:#82ba4b;-webkit-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;-moz-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset}.content .overview #overview tr td.c0 .confidence{display:inline}.content .error{background-color:#dbc87b;padding:10px;text-align:justify;-webkit-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;-moz-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;-moz-border-radius-topleft:25px;-webkit-border-top-left-radius:25px;border-top-left-radius:25px;-moz-border-radius-bottomleft:25px;-webkit-border-bottom-left-radius:25px;border-bottom-left-radius:25px;-moz-border-radius-topright:25px;-webkit-border-top-right-radius:25px;border-top-right-radius:25px;-moz-border-radius-bottomright:25px;-webkit-border-bottom-right-radius:25px;border-bottom-right-radius:25px;-webkit-background-clip:border;-moz-background-clip:border;background-clip:border-box}.content .error error{border:2px solid #f55;background-color:#fff;color:#f55}.details{margin-bottom:2em;height:400px;background-image:url("/images/gray_jean.png");-moz-border-radius-bottomleft:25px;-webkit-border-bottom-left-radius:25px;border-bottom-left-radius:25px;-moz-border-radius-bottomright:25px;-webkit-border-bottom-right-radius:25px;border-bottom-right-radius:25px;-webkit-background-clip:border;-moz-background-clip:border;background-clip:border-box}.results{background-image:url("/images/gray_jean.png");overflow-x:auto;overflow-y:hidden;margin-top:2em;margin-bottom:2em;-webkit-box-shadow:1px 1px 1px #fff inset,0px -1px 2px rgba(0,0,0,0.3) inset;-moz-box-shadow:1px 1px 1px #fff inset,0px -1px 2px rgba(0,0,0,0.3) inset;box-shadow:1px 1px 1px #fff inset,0px -1px 2px rgba(0,0,0,0.3) inset}.results .tablesorter{width:100%}.results .tablesorter thead{background-color:#e6d8a3}.results .tablesorter thead tr th.header{background-image:url("/images/bg.gif");background-repeat:no-repeat;background-position:center left;cursor:pointer;padding-left:20px;border:1px solid #dad9c7;margin-left:-1px}.results .tablesorter thead tr th.headerSortDown{background-image:url("/images/desc.gif");background-color:#dbc87b}.results .tablesorter thead tr th.headerSortUp{background-image:url("/images/asc.gif");background-color:#dbc87b}.results .tablesorter tbody tr td{-webkit-box-shadow:1px 1px 1px #fff inset,0px -1px 2px rgba(0,0,0,0.3) inset;-moz-box-shadow:1px 1px 1px #fff inset,0px -1px 2px rgba(0,0,0,0.3) inset;box-shadow:1px 1px 1px #fff inset,0px -1px 2px rgba(0,0,0,0.3) inset}.results .tablesorter tbody tr td.compound{width:200px}.results .tablesorter tbody tr td.cfalse{text-align:center;color:#5c8533}.results .tablesorter tbody tr td.ctrue{text-align:center;color:#d42200}.results .tablesorter tbody tr td.c0{text-align:center;color:#5c8533}.results .tablesorter tbody tr td.c1{text-align:center;color:#d42200}input#predict{border:0px;background-color:#dbc87b;margin:0;padding:0}.tooltip{background-color:#fff;border:2px solid #ccc;font-size:0.5em;padding:1em;display:none;z-index:50}.footer{margin:20px 0 20px 0}
+body{background-image:url("/images/gray_jean.png");background-color:#ccf;overflow:scroll;font-family:sans-serif;min-width:800px;min-heigth:600px}body a{text-decoration:none;font-weight:bold;color:#000}.logo img{float:left;display:inline;margin-right:1em}.content{background-image:url("/images/gray_jean.png")}.content h1{margin:0.3em;text-shadow:#fff 1px 1px 0;font-size:x-large;font-family:Verdana;display:inline}.content h2{text-shadow:#fff 1px 1px 0;font-size:x-large;color:#f55}.content .arrow{margin:5px 0px 5px 20px}.content .back{display:inline}.content .close{text-align:right}.content #back-top{z-index:100;position:fixed;bottom:3%;margin-left:91%}.content #back-top a:hover{color:#bbb}.content fieldset#top{border:0;padding:10px;background-color:#c5c1e4;-moz-border-radius-topleft:25px;-webkit-border-top-left-radius:25px;border-top-left-radius:25px;-moz-border-radius-topright:25px;-webkit-border-top-right-radius:25px;border-top-right-radius:25px;-webkit-background-clip:border;-moz-background-clip:border;background-clip:border-box;-webkit-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;-moz-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset}.content fieldset#top a#linkInsert{display:block;width:100%;height:2em}.content fieldset#top #appletContainer{padding:10px}.content fieldset#middle{border:0;padding:10px;background-color:#c5c1e4;-webkit-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;-moz-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset}.content fieldset#middle a#linkModels{display:block;width:100%;height:2em}.content fieldset#middle #endpoint{padding-top:2em}.content fieldset#middle #model a{display:inline;font-weight:normal}.content fieldset#bottom{border:0;background-color:#c5c1e4;padding:10px;margin-bottom:5em;-webkit-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;-moz-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;-moz-border-radius-bottomleft:25px;-webkit-border-bottom-left-radius:25px;border-bottom-left-radius:25px;-moz-border-radius-bottomright:25px;-webkit-border-bottom-right-radius:25px;border-bottom-right-radius:25px;-webkit-background-clip:border;-moz-background-clip:border;background-clip:border-box}.content fieldset#bottom input#predict{margin-left:1em}.content .predictions{background-color:#c5c1e4;padding:10px;text-align:justify;-webkit-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;-moz-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;-moz-border-radius-topleft:25px;-webkit-border-top-left-radius:25px;border-top-left-radius:25px;-moz-border-radius-bottomleft:25px;-webkit-border-bottom-left-radius:25px;border-bottom-left-radius:25px;-moz-border-radius-topright:25px;-webkit-border-top-right-radius:25px;border-top-right-radius:25px;-moz-border-radius-bottomright:25px;-webkit-border-bottom-right-radius:25px;border-bottom-right-radius:25px;-webkit-background-clip:border;-moz-background-clip:border;background-clip:border-box}.content .overview{background-image:url("/images/gray_jean.png");padding:12px;margin-top:1em;margin-bottom:1em;text-align:center;-webkit-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;-moz-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;-moz-border-radius-topleft:25px;-webkit-border-top-left-radius:25px;border-top-left-radius:25px;-moz-border-radius-topright:25px;-webkit-border-top-right-radius:25px;border-top-right-radius:25px;-webkit-background-clip:border;-moz-background-clip:border;background-clip:border-box}.content .overview caption{text-align:left}.content .overview .result{display:inline}.content .overview #overview tr td{background-color:#fff;border:1px solid #dad9c7;padding-left:1em}.content .overview #overview tr td#compound{width:200px}.content .overview #overview tr td.ctrue{padding-top:0.5em}.content .overview #overview tr td.cfalse{padding-top:0.5em}.content .overview #overview tr td.c1{padding-top:0.5em}.content .overview #overview tr td.c0{padding-top:0.5em}.content .overview #overview tr td.c0 .confidence{display:inline}.content .error{background-color:#c5c1e4;padding:10px;text-align:justify;-webkit-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;-moz-box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;box-shadow:1px 1px 1px #fff inset,-1px -1px 5px rgba(0,0,0,0.3) inset;-moz-border-radius-topleft:25px;-webkit-border-top-left-radius:25px;border-top-left-radius:25px;-moz-border-radius-bottomleft:25px;-webkit-border-bottom-left-radius:25px;border-bottom-left-radius:25px;-moz-border-radius-topright:25px;-webkit-border-top-right-radius:25px;border-top-right-radius:25px;-moz-border-radius-bottomright:25px;-webkit-border-bottom-right-radius:25px;border-bottom-right-radius:25px;-webkit-background-clip:border;-moz-background-clip:border;background-clip:border-box}.content .error error{border:2px solid #f55;background-color:#fff;color:#f55}.content #closebutton{margin-left:95%;padding:0;background-color:#c5c1e4;-moz-border-radius-bottomleft:5px;-webkit-border-bottom-left-radius:5px;border-bottom-left-radius:5px;-moz-border-radius-bottomright:5px;-webkit-border-bottom-right-radius:5px;border-bottom-right-radius:5px}.details{margin-bottom:2em;background-image:url("/images/gray_jean.png");-moz-border-radius-bottomleft:25px;-webkit-border-bottom-left-radius:25px;border-bottom-left-radius:25px;-moz-border-radius-bottomright:25px;-webkit-border-bottom-right-radius:25px;border-bottom-right-radius:25px;-webkit-background-clip:border;-moz-background-clip:border;background-clip:border-box}.results{background-image:url("/images/gray_jean.png");overflow-x:auto;overflow-y:hidden;margin-top:2em;margin-bottom:2em;-webkit-box-shadow:1px 1px 1px #fff inset,0px -1px 2px rgba(0,0,0,0.3) inset;-moz-box-shadow:1px 1px 1px #fff inset,0px -1px 2px rgba(0,0,0,0.3) inset;box-shadow:1px 1px 1px #fff inset,0px -1px 2px rgba(0,0,0,0.3) inset}.results .tablesorter{width:100%}.results .tablesorter thead{background-color:#e6e5f3}.results .tablesorter thead tr th.header{background-image:url("/images/bg.gif");background-repeat:no-repeat;background-position:center left;cursor:pointer;padding-left:20px;border:1px solid #dad9c7;margin-left:-1px}.results .tablesorter thead tr th.headerSortDown{background-image:url("/images/desc.gif");background-color:#c5c1e4}.results .tablesorter thead tr th.headerSortUp{background-image:url("/images/asc.gif");background-color:#c5c1e4}.results .tablesorter tbody tr td{-webkit-box-shadow:1px 1px 1px #fff inset,0px -1px 2px rgba(0,0,0,0.3) inset;-moz-box-shadow:1px 1px 1px #fff inset,0px -1px 2px rgba(0,0,0,0.3) inset;box-shadow:1px 1px 1px #fff inset,0px -1px 2px rgba(0,0,0,0.3) inset}.results .tablesorter tbody tr td.compound{width:200px}.results .tablesorter tbody tr td.cfalse{text-align:center;color:#5c8533}.results .tablesorter tbody tr td.ctrue{text-align:center;color:#d42200}.results .tablesorter tbody tr td.c0{text-align:center;color:#5c8533}.results .tablesorter tbody tr td.c1{text-align:center;color:#d42200}input#predict{border:0px;background-color:#c5c1e4;margin:0;padding:0}.tooltip{background-color:#fff;border:2px solid #ccc;font-size:0.5em;padding:1em;display:none;z-index:50}.footer{margin:20px 0 20px 0}
diff --git a/public/stylesheets/screen.sass b/public/stylesheets/screen.sass
index d460dbc..52d5c6b 100644
--- a/public/stylesheets/screen.sass
+++ b/public/stylesheets/screen.sass
@@ -5,7 +5,8 @@ $bg-color: #CCCCFF
 $bg-color-div: #C5C1E4
 //$ist-color: #B9DCFF
 $i-color: #C8AB37
-$ist-color: adjust-lightness($i-color, 17%)
+//$ist-color: adjust-lightness($i-color, 17%)
+$ist-color: #C5C1E4
 
 body
   background-image: url("/images/gray_jean.png")
@@ -128,6 +129,7 @@ body
     background-image: url("/images/gray_jean.png")
     padding: 12px
     margin-top: 1em
+    margin-bottom: 1em
     text-align: center
     +box-shadow(1px 1px 1px rgba(white, 1) inset, -1px -1px 5px rgba(black, 0.3) inset)
     +border-top-left-radius(25px)
@@ -137,6 +139,9 @@ body
     caption
       text-align: left
     
+    .result
+      display: inline
+        
     #overview tr td
       background-color: white
       border: 1px solid #dad9c7
@@ -146,23 +151,23 @@ body
 
     #overview tr td.ctrue
       padding-top: 0.5em
-      background-color: adjust-lightness(#D42200, 20%)
-      +box-shadow(1px 1px 1px rgba(white, 1) inset, -1px -1px 5px rgba(black, 0.3) inset)
+      //background-color: adjust-lightness(#D42200, 20%)
+      //+box-shadow(1px 1px 1px rgba(white, 1) inset, -1px -1px 5px rgba(black, 0.3) inset)
 
     #overview tr td.cfalse
       padding-top: 0.5em
-      background-color: adjust-lightness(#5C8533, 15%)
-      +box-shadow(1px 1px 1px rgba(white, 1) inset, -1px -1px 5px rgba(black, 0.3) inset)
+      //background-color: adjust-lightness(#5C8533, 15%)
+      //+box-shadow(1px 1px 1px rgba(white, 1) inset, -1px -1px 5px rgba(black, 0.3) inset)
 
     #overview tr td.c1
       padding-top: 0.5em
-      background-color: adjust-lightness(#D42200, 20%)
-      +box-shadow(1px 1px 1px rgba(white, 1) inset, -1px -1px 5px rgba(black, 0.3) inset)
+      //background-color: adjust-lightness(#D42200, 20%)
+      //+box-shadow(1px 1px 1px rgba(white, 1) inset, -1px -1px 5px rgba(black, 0.3) inset)
 
     #overview tr td.c0
       padding-top: 0.5em
-      background-color: adjust-lightness(#5C8533, 15%)
-      +box-shadow(1px 1px 1px rgba(white, 1) inset, -1px -1px 5px rgba(black, 0.3) inset)      
+      //background-color: adjust-lightness(#5C8533, 15%)
+      //+box-shadow(1px 1px 1px rgba(white, 1) inset, -1px -1px 5px rgba(black, 0.3) inset)      
       .confidence
         display: inline
     
@@ -181,10 +186,18 @@ body
       border: 2px solid #FF5555
       background-color: #FFFFFF
       color: #FF5555
+      
+  #closebutton
+    margin-left: 95%
+    padding: 0
+    background-color: $ist-color
+    //display: inline
+    +border-bottom-left-radius(5px)
+    +border-bottom-right-radius(5px)
   
 .details
   margin-bottom: 2em
-  height: 400px
+  //height: 400px
   background-image: url("/images/gray_jean.png")
   +border-bottom-left-radius(25px)
   +border-bottom-right-radius(25px)
diff --git a/views/details.haml b/views/details.haml
index 1697831..fc57d5e 100644
--- a/views/details.haml
+++ b/views/details.haml
@@ -1,10 +1,14 @@
 %link{ :href=>"/stylesheets/screen.css", :media=>"screen, projection", :rel=>"stylesheet", :type=>"text/css"}
 
 .content
+  %button{:id=>"closebutton", :onclick=>"parent.$('#iframe').bPopup().close();parent.$('#iframe_overview').bPopup().close();"}
+    X
+    
   .details
-    %h2
+    %h2{:style=>"margin-top:0px"}
       Details:
-    %img{:src=>"#{@compound_uri.uri}/image", :alt=>"", :width=>"100px"}
+    %img{:src=>"#{@compound_uri.uri}/image", :alt=>"", :width=>"300px", :heigth=>"300px"}
+    %br
     %br
     %b
       SMILES:
diff --git a/views/predict.haml b/views/predict.haml
index 98b9edb..12ed158 100644
--- a/views/predict.haml
+++ b/views/predict.haml
@@ -1,7 +1,7 @@
 :javascript
   function checksmiles () {
     if (document.form.identifier.value == "") {
-      alert("Please insert a compound.");
+      alert("Please draw or insert a chemical structure.");
       document.form.identifier.focus();
       return false;
     };
@@ -29,11 +29,11 @@
   };
 
 
-/ whole site content needs to be in one form. Input and checkboxes are checked by js functions. 
+/ whole site content needs to be in one form. Input and checkboxes are proofed by js functions. 
 %form{:name => "form", :action => to('/predict'), :method => "post", :enctype => "multipart/form-data", :onsubmit => "return  !!(checksmiles() & checkboxes())" }
   %fieldset#top
     %a{:href => "#", :id => "linkInsert"}
-      %h1 1. Draw or insert your compound   
+      %h1 1. Draw a chemical structure
     :javascript
       $("a#linkInsert").click(function () {
         $("#insert").toggle();
@@ -52,7 +52,7 @@
         
       
       .close
-        = hide_link "#insert"
+        -#= hide_link "#insert"
     
   .arrow
     %img{:src=>"/images/arrow_down_float.png", :alt=>"arrow", :class=> "arrow"}
@@ -68,7 +68,7 @@
         document.location = document.location + "#" + "models";
       });
       
-    #models{ :style => "display: none;"}
+    #models
       %i Please observe validation report for model details.
 
       // TODO order models by echa endpoint currently manually added and to find in model.type[0].split("#").last
@@ -80,11 +80,11 @@
           %label{:for => "selection[#{model.title}]"}
             = "DSSTox Carcinogenic Potency DBS "+model.title.split(" ").first
           %a{:href=>"#", :alt=>"#{model.title} validation"}
-            %i ( Validation Link )
+            %i ( Validation report )
           %br
           
       .close
-        = hide_link "#models"
+        -#= hide_link "#models"
 
   .arrow
     %img{:src=>"/images/arrow_down_float.png", :alt=>"arrow", :class=> "arrow"}
diff --git a/views/prediction.haml b/views/prediction.haml
index 89e66f0..bc8d96d 100644
--- a/views/prediction.haml
+++ b/views/prediction.haml
@@ -16,7 +16,7 @@
         %tr
           %td{:id=>"compound"}
             %a{:href => to("/prediction/#{CGI.escape(@compound.uri)}/details"), :id=>"linkCompound", :target=>"details_overview"}
-              %img{:src=>"#{@compound.uri}/image", :alt=>"image not available", :width=>"100"}
+              %img{:src=>"#{@compound.uri}/image", :alt=>"Compound image not available", :width=>"100"}
             %br
             %br
             %img{:src=>"/images/arrow_up_float.png", :alt=>"arrow"}
@@ -41,31 +41,38 @@
                 %b{:class => "title"}
                   = @@prediction_models[count].title
                 %br
-                %br            
-                  = "Result:"
-                  %b= p.data_entries[0][0] != nil ? p.data_entries[0][0] : "No prediction result"
-                  %a{:href=>"#result", :title=>"", :id=>"result"}
-                    %img{:src=>"/images/info_white.png"}
-                  .tooltip{:style=>"font-weight: normal; font-size: 1em; width: 50%; text-align: left;"}
-                    %dt
-                      Result
-                    %dd
-                      %code lazar 
-                      calculates searches the training dataset for similar compounds (neighbors) 
-                      and calculates the prediction from their measured activities. lazar 
-                      calculates predictions using
-                      %ul
-                        %li a majority vote (weighted by compound similarity) for 
-                        %em classification 
-                        (
-                        %a{:href=>"http://www.in-silico.de/articles/modi020905.pdf"} original publication
-                        )
-                        %li a local QSAR model based on neighbors for
-                        %em regression
-                        (
-                        %a{:href=>"http://www.in-silico.de/articles/mh_tf.pdf"} original publication
-                        )
-                      Please keep in mind that predictions are based on the measured activities of neighbors.
+                %br
+                  .result
+                    - if c != ''
+                      - if c == 0||"false"
+                        %image{:src=>"/images/greendot.png"}
+                      - elsif c == 1||"true"
+                        %image{:src=>"/images/reddot.png"}
+
+                    %b Result:
+                    %b= p.data_entries[0][0] != nil ? p.data_entries[0][0] : "No prediction result"
+                    %a{:href=>"#result", :title=>"", :id=>"result"}
+                      %img{:src=>"/images/info_white.png"}
+                    .tooltip{:style=>"font-weight: normal; font-size: 1em; width: 50%; text-align: left;"}
+                      %dt
+                        Result
+                      %dd
+                        %code lazar 
+                        calculates searches the training dataset for similar compounds (neighbors) 
+                        and calculates the prediction from their measured activities. lazar 
+                        calculates predictions using
+                        %ul
+                          %li a majority vote (weighted by compound similarity) for 
+                          %em classification 
+                          (
+                          %a{:href=>"http://www.in-silico.de/articles/modi020905.pdf"} original publication
+                          )
+                          %li a local QSAR model based on neighbors for
+                          %em regression
+                          (
+                          %a{:href=>"http://www.in-silico.de/articles/mh_tf.pdf"} original publication
+                          )
+                        Please keep in mind that predictions are based on the measured activities of neighbors.
                 %br
                   .confidence
                     %b Confidence:
@@ -97,5 +104,5 @@
     = haml :neighbors, :layout => false
   - else
     %h2
-      no neighbors available             
-%iframe{:id=>"iframe_overview", :name=>"details_overview", :height=>"90%", :width=>"90%", :style=>"display:none;border:0px"}            
+      no neighbors available
+%iframe{:id=>"iframe_overview", :name=>"details_overview", :height=>"90%", :width=>"90%", :style=>"display:none;border:0px"}