diff --git a/.jshintignore b/.jshintignore
index 3546263..7da1c6d 100644
--- a/.jshintignore
+++ b/.jshintignore
@@ -4,3 +4,4 @@ clientapp/helpers/htmlify.js
 clientapp/libraries
 clientapp/templates.js
 clientapp/.build
+clientapp/helpers/callbar.js
diff --git a/clientapp/models/contact.js b/clientapp/models/contact.js
index a5e225d..a6f1616 100644
--- a/clientapp/models/contact.js
+++ b/clientapp/models/contact.js
@@ -148,6 +148,12 @@ module.exports = HumanModel.define({
                     return res.supportsJingleMedia;
                 });
             }
+        },
+        callable: {
+            deps: ['jingleResources'],
+            fn: function () {
+                return !!this.jingleResources.length;
+            }
         }
     },
     collections: {
diff --git a/clientapp/templates/main.html b/clientapp/templates/main.html
index e9b3ae5..d4c08ff 100644
--- a/clientapp/templates/main.html
+++ b/clientapp/templates/main.html
@@ -11,7 +11,7 @@
     </header>
     <section class="box connect">
       <h2>Connecting...</h2> 
-      <a href="/logout">Cancel</a>
+      <a class="button" href="/logout">Cancel</a>
     </section>
   </body>
 </html>
diff --git a/public/css/app/aux.styl b/public/css/app/aux.styl
index 3e742f1..e7aa9d9 100644
--- a/public/css/app/aux.styl
+++ b/public/css/app/aux.styl
@@ -24,6 +24,10 @@
     h2
       padding: 0
 
+    .button
+      float: none
+      margin-top: 20px
+
   .head, .content
     padding: 0 20px
 
diff --git a/public/css/app/chat.styl b/public/css/app/chat.styl
index 839ba84..2c85d54 100644
--- a/public/css/app/chat.styl
+++ b/public/css/app/chat.styl
@@ -3,7 +3,6 @@
 
 .page.chat
   padding-top: 0px
-  height: 100%
   borderbox()
 
 .conversation
@@ -12,7 +11,6 @@
   left: 0px
   right: 0px
   padding: 0px
-  height: 100%
   width: 100%
   borderbox()
 
@@ -24,9 +22,6 @@
       width: 100%
       display: block
 
-    .messages
-      padding-top: 630px
-
   header
     padding: 5px
     border-bottom: 2px solid $grayOutline
diff --git a/public/css/app/forms.styl b/public/css/app/forms.styl
index 8c111bc..57c411a 100644
--- a/public/css/app/forms.styl
+++ b/public/css/app/forms.styl
@@ -59,4 +59,7 @@ button, a.button
   cursor: pointer
 
   &:hover
-    background: darken($activeBlue, 30%)
\ No newline at end of file
+    background: darken($activeBlue, 30%)
+
+.enableAlerts
+  margin-right: 5px
\ No newline at end of file
diff --git a/public/css/app/roster.styl b/public/css/app/roster.styl
index f1007cf..9fda121 100644
--- a/public/css/app/roster.styl
+++ b/public/css/app/roster.styl
@@ -148,7 +148,7 @@
       margin-top: -15px
       position: absolute
       left: 10px
-      top: 50%
+      top: 20px
       avatar()
       noselect()
 
@@ -178,7 +178,7 @@
       padding-top: 8px
       roundall(30px)
       position: absolute
-      top: 7px
+      top: 5px
       left: 10px
       font-size: 10px
       font-weight: bold
@@ -191,6 +191,11 @@
       font-size: 10px
       color: darken($textSecondary, 50%)
 
+#bookmarks
+
+  .name
+    padding: 10px 15px 10px 40px
+
 @keyframes pulsate
   0%
     opacity: 1.0
diff --git a/public/css/app/settings.styl b/public/css/app/settings.styl
index c5b402b..37da7e2 100644
--- a/public/css/app/settings.styl
+++ b/public/css/app/settings.styl
@@ -12,6 +12,7 @@
     padding: 5px
     background: $grayBackground
     roundall(3px)
+    font-size: $fontSmall
 
 .uploadRegion
   padding: 15px
@@ -26,3 +27,6 @@
 
   input
     width: 100%
+
+  img
+    margin: 10px 0
diff --git a/public/css/otalk.css b/public/css/otalk.css
index 12b42d4..fffe062 100644
--- a/public/css/otalk.css
+++ b/public/css/otalk.css
@@ -503,7 +503,7 @@ h3 {
   margin-top: -15px;
   position: absolute;
   left: 10px;
-  top: 50%;
+  top: 20px;
   width: 30px;
   height: 30px;
   -moz-border-radius: 50px;
@@ -554,7 +554,7 @@ h3 {
   -border-radius: 30px;
   border-radius: 30px;
   position: absolute;
-  top: 7px;
+  top: 5px;
   left: 10px;
   font-size: 10px;
   font-weight: bold;
@@ -568,6 +568,9 @@ h3 {
   font-size: 10px;
   color: #5c5c5c;
 }
+#bookmarks .name {
+  padding: 10px 15px 10px 40px;
+}
 @-moz-keyframes pulsate {
   0% {
     opacity: 1;
@@ -635,7 +638,6 @@ h3 {
 }
 .page.chat {
   padding-top: 0px;
-  height: 100%;
   -moz-box-sizing: border-box;
   -webkit-box-sizing: border-box;
   box-sizing: border-box;
@@ -646,7 +648,6 @@ h3 {
   left: 0px;
   right: 0px;
   padding: 0px;
-  height: 100%;
   width: 100%;
   -moz-box-sizing: border-box;
   -webkit-box-sizing: border-box;
@@ -659,9 +660,6 @@ h3 {
   width: 100%;
   display: block;
 }
-.conversation.activeCall .messages {
-  padding-top: 630px;
-}
 .conversation header {
   padding: 5px;
   border-bottom: 2px solid #e4e4e4;
@@ -877,6 +875,7 @@ h3 {
   -o-border-radius: 3px;
   -border-radius: 3px;
   border-radius: 3px;
+  font-size: 12px;
 }
 .uploadRegion {
   padding: 15px;
@@ -897,6 +896,9 @@ h3 {
 .uploadRegion input {
   width: 100%;
 }
+.uploadRegion img {
+  margin: 10px 0;
+}
 .aux {
   background: #f7f7f7;
 }
@@ -928,6 +930,10 @@ h3 {
 .box.connect h2 {
   padding: 0;
 }
+.box.connect .button {
+  float: none;
+  margin-top: 20px;
+}
 .box .head,
 .box .content {
   padding: 0 20px;
@@ -1038,6 +1044,9 @@ button:hover,
 a.button:hover {
   background: #007aa7;
 }
+.enableAlerts {
+  margin-right: 5px;
+}
 body {
   position: relative !important;
   -webkit-transition: top 1s;