Chat: Title; Minimization and new messages and connectivity notification.

Scrummer/Styles/10. Chat.css

@@ -6,6 +6,46 @@
     border-radius: 5px;
     background-color: rgb(220,220,220);
     box-shadow: 0px 0px 5px black;
+    position: absolute;
+    bottom: 0;
+    right: 0;
+}
+
+.divChatTitleBar{
+    text-align: right;
+}
+
+.titleChatNormal{
+    background-color: rgb(220,220,220);
+    cursor: pointer;
+    display: inline-block;
+    border-radius: 5px;
+    padding: 5px;
+}
+
+@keyframes alert {
+    0%   {background-color: red;}
+    50%  {background-color: rgb(220,220,220);}
+    100%  {background-color: red;}
+}
+
+.titleChatAlert{
+    background-color: red;
+    animation-name: alert;
+    animation-duration: 1s;
+    animation-iteration-count: infinite;
+    cursor: pointer;
+    display: inline-block;
+    border-radius: 5px;
+    padding: 5px;
+}
+.titleChatDisconnected{
+    color: rgb(64,64,64);
+    background-color: rgb(220,220,220);
+    cursor: pointer;
+    display: inline-block;
+    border-radius: 5px;
+    padding: 5px;
 }
 
 .divChat {
@@ -16,6 +56,7 @@
     border-radius: 5px;
     border: solid 1px black;
     box-shadow: inset 0px 0px 5px black;
+    
 }
 
 .messageRow,
@@ -99,4 +140,13 @@
     font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
     font-size: 12px;
     text-align: center;
+    cursor: pointer;
+    background-color: rgb(192,192,192);
+}
+.chatButton:hover {
+    background-color: rgb(220,220,220);
+}
+.chatButton:active {
+    background-color: rgb(220,220,220);
+    box-shadow: inset 0px 2px 5px rgba(255,255,255,1), inset 0px -2px 5px rgba(128,128,128,1);
 }