150 files changed, 3021 insertions, 0 deletions
diff --git a/resources/themes/Default/Demo.html b/resources/themes/Default/Demo.html
new file mode 100755
index 0000000..6078ad1
--- /dev/null
+++ b/resources/themes/Default/Demo.html
@@ -0,0 +1,91 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+	<meta http-equiv="content-type" content="text/html; charset=utf-8" />
+	<base href="%@">
+
+	<style id="mainStyle" type="text/css" media="screen,print">	@import url( "Variants/Yellow on Green Alternating.css" ); </style>
+
+</head>
+<body style="background-color:#e3e3e3">
+<div id="Chat">
+	<div class="chatItem incomingItem">
+		<table width="100%">
+			<tr>
+				<td valign="top">
+					<img src="images/DummyContact.png" alt="%sender%" title="%sender%" class="avatar">
+					<div class="myBubble">
+						<div class="indicator"></div>
+						<table class="tableBubble" cellspacing="0" cellpadding="0">
+							<tr>
+								<td class="tl"></td>
+								<td class="tr"></td>
+							</tr>
+							<tr>
+								<td class="message">
+									Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
+									<div class="timeStamp">Torrey @ 4:55 am</div>
+										<div class="followUp"></div>
+										<div>
+											testing 1
+											<div class="timeStamp">%sender% @ %time%</div>
+										</div>
+										<div class="followUp"></div>
+										<div class="followUpMessage">
+											testing 123
+											<div class="timeStamp">%sender% @ %time%</div>
+										</div>
+										<div class="followUp"></div>
+										<div>
+											testing 123testing 123testing 123testing 123
+											testing 123testing 123
+											<div class="timeStamp">%sender% @ %time%</div>
+										</div>
+								</td>
+								<td class="messageRight"></td>
+							</tr>
+							<tr>
+								<td class="bl"></td>
+								<td class="br"></td>
+							</tr>
+						</table>
+					</div>
+				</td>
+			</tr>
+		</table>
+	</div>
+
+	<div class="chatItem outgoingItem">
+		<table width="100%">
+			<tr>
+				<td valign="top">
+					<img src="images/DummyContact.png" alt="%sender%" title="%sender%" class="avatar">
+					<div class="myBubble">
+						<div class="indicator"></div>
+						<table class="tableBubble" cellspacing="0" cellpadding="0">
+							<tr>
+								<td class="tl"></td>
+								<td class="tr"></td>
+							</tr>
+							<tr>
+								<td class="message">										
+									Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Maecenas aliquam sapien. Aliquam sed erat eu leo bibendum egestas. Praesent mauris. Quisque eget eros et neque scelerisque convallis. Phasellus orci. Pellentesque interdum tellus a erat. venenatis tristique.
+									<div class="timeStamp">Torrey @ 4:55 am</div>
+								</td>
+								<td class="messageRight"></td>
+							</tr>
+							<tr>
+								<td class="bl"></td>
+								<td class="br"></td>
+							</tr>
+						</table>
+					</div>
+				</td>
+			</tr>
+		</table>
+	</div>
+
+</div>
+</body>
+</html>
+\ No newline at end of file
diff --git a/resources/themes/Default/Header.html b/resources/themes/Default/Header.html
new file mode 100755
index 0000000..b97bbb3
--- /dev/null
+++ b/resources/themes/Default/Header.html
@@ -0,0 +1,5 @@
+<div id="heading">
+	<div class="conversationIncomingIcon"><img src="%incomingIconPath%" /></div>
+	<div class="conversationWith">%chatName%</div>
+	<div class="conversationTime">Conversation began %timeOpened%</div>
+</div>
+\ No newline at end of file
diff --git a/resources/themes/Default/Incoming/Content.html b/resources/themes/Default/Incoming/Content.html
new file mode 100755
index 0000000..2946716
--- /dev/null
+++ b/resources/themes/Default/Incoming/Content.html
@@ -0,0 +1,30 @@
+<div class="chatItem incomingItem">
+	<table width="100%">
+		<tr>
+			<td valign="top">
+				<img src="%userIconPath%" class="avatar" title="%sender%" />
+				<div class="myBubble">
+					<div class="indicator"></div>
+					<table class="tableBubble" cellspacing="0" cellpadding="0">
+						<tr>
+							<td class="tl"></td>
+							<td class="tr"></td>
+						</tr>
+						<tr>
+							<td class="message">
+								%message%
+								<div class="timeStamp"><span class="name">%sender% @</span> %time%</div>
+								<span id="insert"></span>
+							</td>
+							<td class="messageRight"></td>
+						</tr>
+						<tr>
+							<td class="bl"></td>
+							<td class="br"></td>
+						</tr>
+					</table>
+				</div>
+			</td>
+		</tr>
+	</table>
+</div>
diff --git a/resources/themes/Default/Incoming/Context.html b/resources/themes/Default/Incoming/Context.html
new file mode 100755
index 0000000..b1aca27
--- /dev/null
+++ b/resources/themes/Default/Incoming/Context.html
@@ -0,0 +1,30 @@
+<div class="chatItem incomingItem">
+	<table width="100%">
+		<tr>
+			<td valign="top">
+				<img src="%userIconPath%" class="avatar"/>
+				<div class="myBubble">
+					<div class="indicator"></div>
+					<table class="tableBubble" cellspacing="0" cellpadding="0">
+						<tr>
+							<td class="tl"></td>
+							<td class="tr"></td>
+						</tr>
+						<tr>
+							<td class="message">
+									%message%
+									<div class="timeStamp"><span class="name">%sender% @</span> %time%</div>
+								<span id="insert"></span>
+							</td>
+							<td class="messageRight"></td>
+						</tr>
+						<tr>
+							<td class="bl"></td>
+							<td class="br"></td>
+						</tr>
+					</table>
+				</div>
+			</td>
+		</tr>
+	</table>
+</div>
diff --git a/resources/themes/Default/Incoming/NextContent.html b/resources/themes/Default/Incoming/NextContent.html
new file mode 100755
index 0000000..4aec8ab
--- /dev/null
+++ b/resources/themes/Default/Incoming/NextContent.html
@@ -0,0 +1,10 @@
+<div>
+	<div class="followUp"></div>
+	<div>
+		
+		%message%
+		<div class="timeStamp">%time%</div>
+	</div>
+	<span id="insert"></span>
+</div>
+
diff --git a/resources/themes/Default/Incoming/NextContext.html b/resources/themes/Default/Incoming/NextContext.html
new file mode 100755
index 0000000..18b8dc4
--- /dev/null
+++ b/resources/themes/Default/Incoming/NextContext.html
@@ -0,0 +1,7 @@
+			<div class="followUp"></div>
+			<div>
+				
+				%message%
+				<div class="timeStamp">%time%</div>
+			</div><span id="insert"></span>
+
diff --git a/resources/themes/Default/Incoming/buddy_icon.png b/resources/themes/Default/Incoming/buddy_icon.png
new file mode 100644
index 0000000..1d9f5f3
--- /dev/null
+++ b/resources/themes/Default/Incoming/buddy_icon.png
diff --git a/resources/themes/Default/LICENSE.txt b/resources/themes/Default/LICENSE.txt
new file mode 100644
index 0000000..2eee1ee
--- /dev/null
+++ b/resources/themes/Default/LICENSE.txt
@@ -0,0 +1,15 @@
+The images, css and html is dual licensed under the BSD and AFL license. 
+The source files for the bubbles can be found at http://www.itorrey.com/adiumx/
+
+The fading javascript is not covered in this license. The code is fadomatic and is covered under its own license as set by its author.
+
+BSD LICENSE
+Copyright (c) 2007, Torrey Rice/Renkoo�6�3
+All rights reserved.
+Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met:
+    * Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.
+    * Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.
+    * Neither the name of the Torrey Rice and Renkoo nor the names of its contributors may be used to endorse or promote products derived from this software without specific prior written permission.
+THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
+
+Renkoo is a service mark of Renkoo, Inc.
+
+http://www.opensource.org/licenses/bsd-license.php
+
+
+
+# Larry Rosen has ceased to use or recommend any version
+# of the Academic Free License below version 2.1
+The Academic Free License
+v. 2.1
+This Academic Free License (the "License") applies to any original work of authorship (the "Original Work") whose owner (the "Licensor") has placed the following notice immediately following the copyright notice for the Original Work:
+Licensed under the Academic Free License version 2.1
+1) Grant of Copyright License. Licensor hereby grants You a world-wide, royalty-free, non-exclusive, perpetual, sublicenseable license to do the following:
+a) to reproduce the Original Work in copies;
+b) to prepare derivative works ("Derivative Works") based upon the Original Work;
+c) to distribute copies of the Original Work and Derivative Works to the public;
+d) to perform the Original Work publicly; and
+e) to display the Original Work publicly.
+2) Grant of Patent License. Licensor hereby grants You a world-wide, royalty-free, non-exclusive, perpetual, sublicenseable license, under patent claims owned or controlled by the Licensor that are embodied in the Original Work as furnished by the Licensor, to make, use, sell and offer for sale the Original Work and Derivative Works.
+3) Grant of Source Code License. The term "Source Code" means the preferred form of the Original Work for making modifications to it and all available documentation describing how to modify the Original Work. Licensor hereby agrees to provide a machine-readable copy of the Source Code of the Original Work along with each copy of the Original Work that Licensor distributes. Licensor reserves the right to satisfy this obligation by placing a machine-readable copy of the Source Code in an information repository reasonably calculated to permit inexpensive and convenient access by You for as long as Licensor continues to distribute the Original Work, and by publishing the address of that information repository in a notice immediately following the copyright notice that applies to the Original Work.
+4) Exclusions From License Grant. Neither the names of Licensor, nor the names of any contributors to the Original Work, nor any of their trademarks or service marks, may be used to endorse or promote products derived from this Original Work without express prior written permission of the Licensor. Nothing in this License shall be deemed to grant any rights to trademarks, copyrights, patents, trade secrets or any other intellectual property of Licensor except as expressly stated herein. No patent license is granted to make, use, sell or offer to sell embodiments of any patent claims other than the licensed claims defined in Section 2. No right is granted to the trademarks of Licensor even if such marks are included in the Original Work. Nothing in this License shall be interpreted to prohibit Licensor from licensing under different terms from this License any Original Work that Licensor otherwise would have a right to license.
+5) This section intentionally omitted.
+6) Attribution Rights. You must retain, in the Source Code of any Derivative Works that You create, all copyright, patent or trademark notices from the Source Code of the Original Work, as well as any notices of licensing and any descriptive text identified therein as an "Attribution Notice." You must cause the Source Code for any Derivative Works that You create to carry a prominent Attribution Notice reasonably calculated to inform recipients that You have modified the Original Work.
+7) Warranty of Provenance and Disclaimer of Warranty. Licensor warrants that the copyright in and to the Original Work and the patent rights granted herein by Licensor are owned by the Licensor or are sublicensed to You under the terms of this License with the permission of the contributor(s) of those copyrights and patent rights. Except as expressly stated in the immediately proceeding sentence, the Original Work is provided under this License on an "AS IS" BASIS and WITHOUT WARRANTY, either express or implied, including, without limitation, the warranties of NON-INFRINGEMENT, MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. THE ENTIRE RISK AS TO THE QUALITY OF THE ORIGINAL WORK IS WITH YOU. This DISCLAIMER OF WARRANTY constitutes an essential part of this License. No license to Original Work is granted hereunder except under this disclaimer.
+8) Limitation of Liability. Under no circumstances and under no legal theory, whether in tort (including negligence), contract, or otherwise, shall the Licensor be liable to any person for any direct, indirect, special, incidental, or consequential damages of any character arising as a result of this License or the use of the Original Work including, without limitation, damages for loss of goodwill, work stoppage, computer failure or malfunction, or any and all other commercial damages or losses. This limitation of liability shall not apply to liability for death or personal injury resulting from Licensor's negligence to the extent applicable law prohibits such limitation. Some jurisdictions do not allow the exclusion or limitation of incidental or consequential damages, so this exclusion and limitation may not apply to You.
+9) Acceptance and Termination. If You distribute copies of the Original Work or a Derivative Work, You must make a reasonable effort under the circumstances to obtain the express assent of recipients to the terms of this License. Nothing else but this License (or another written agreement between Licensor and You) grants You permission to create Derivative Works based upon the Original Work or to exercise any of the rights granted in Section 1 herein, and any attempt to do so except under the terms of this License (or another written agreement between Licensor and You) is expressly prohibited by U.S. copyright law, the equivalent laws of other countries, and by international treaty. Therefore, by exercising any of the rights granted to You in Section 1 herein, You indicate Your acceptance of this License and all of its terms and conditions.
+10) Termination for Patent Action. This License shall terminate automatically and You may no longer exercise any of the rights granted to You by this License as of the date You commence an action, including a cross-claim or counterclaim, against Licensor or any licensee alleging that the Original Work infringes a patent. This termination provision shall not apply for an action alleging patent infringement by combinations of the Original Work with other software or hardware.
+11) Jurisdiction, Venue and Governing Law. Any action or suit relating to this License may be brought only in the courts of a jurisdiction wherein the Licensor resides or in which Licensor conducts its primary business, and under the laws of that jurisdiction excluding its conflict-of-law provisions. The application of the United Nations Convention on Contracts for the International Sale of Goods is expressly excluded. Any use of the Original Work outside the scope of this License or after its termination shall be subject to the requirements and penalties of the U.S. Copyright Act, 17 U.S.C. �0�30��0��0�3 101 et seq., the equivalent laws of other countries, and international treaty. This section shall survive the termination of this License.
+12) Attorneys Fees. In any action to enforce the terms of this License or seeking damages relating thereto, the prevailing party shall be entitled to recover its costs and expenses, including, without limitation, reasonable attorneys' fees and costs incurred in connection with such action, including any appeal of such action. This section shall survive the termination of this License.
+13) Miscellaneous. This License represents the complete agreement concerning the subject matter hereof. If any provision of this License is held to be unenforceable, such provision shall be reformed only to the extent necessary to make it enforceable.
+14) Definition of "You" in This License. "You" throughout this License, whether in upper or lower case, means an individual or a legal entity exercising rights under, and complying with all of the terms of, this License. For legal entities, "You" includes any entity that controls, is controlled by, or is under common control with you. For purposes of this definition, "control" means (i) the power, direct or indirect, to cause the direction or management of such entity, whether by contract or otherwise, or (ii) ownership of fifty percent (50%) or more of the outstanding shares, or (iii) beneficial ownership of such entity.
+15) Right to Use. You may use the Original Work in all ways not otherwise restricted or conditioned by this License or by law, and Licensor promises not to interfere with or be responsible for such uses by You.
+This license is Copyright (C) 2003-2004 Lawrence E. Rosen. All rights reserved. Permission is hereby granted to copy and distribute this license without modification. This license may not be modified without the express written permission of its copyright owner.
+ 
+\ No newline at end of file
diff --git a/resources/themes/Default/Outgoing/Content.html b/resources/themes/Default/Outgoing/Content.html
new file mode 100755
index 0000000..beb57f0
--- /dev/null
+++ b/resources/themes/Default/Outgoing/Content.html
@@ -0,0 +1,30 @@
+<div class="chatItem outgoingItem">
+	<table width="100%">
+		<tr>
+			<td valign="top">
+				<img src="%userIconPath%" class="avatar" title="%sender%" />
+				<div class="myBubble">
+					<div class="indicator"></div>
+					<table class="tableBubble" cellspacing="0" cellpadding="0">
+						<tr>
+							<td class="tl"></td>
+							<td class="tr"></td>
+						</tr>
+						<tr>
+							<td class="message">
+								%message%
+								<div class="timeStamp"><span class="name">%sender% @</span> %time%</div>
+								<span id="insert"></span>
+							</td>
+							<td class="messageRight"></td>
+						</tr>
+						<tr>
+							<td class="bl"></td>
+							<td class="br"></td>
+						</tr>
+					</table>
+				</div>
+			</td>
+		</tr>
+	</table>
+</div>
diff --git a/resources/themes/Default/Outgoing/Context.html b/resources/themes/Default/Outgoing/Context.html
new file mode 100755
index 0000000..7822cac
--- /dev/null
+++ b/resources/themes/Default/Outgoing/Context.html
@@ -0,0 +1,31 @@
+<div class="chatItem outgoingItem">
+	<table width="100%">
+		<tr>
+			<td valign="top">
+				<img src="%userIconPath%" class="avatar"/>
+				<div class="myBubble">
+					<div class="indicator"></div>
+					<table class="tableBubble" cellspacing="0" cellpadding="0">
+						<tr>
+							<td class="tl"></td>
+							<td class="tr"></td>
+						</tr>
+						<tr>
+							<td class="message">
+								
+								%message%
+								<div class="timeStamp"><span class="name">%sender% @</span> %time%</div>
+								<span id="insert"></span>
+							</td>
+							<td class="messageRight"></td>
+						</tr>
+						<tr>
+							<td class="bl"></td>
+							<td class="br"></td>
+						</tr>
+					</table>
+				</div>
+			</td>
+		</tr>
+	</table>
+</div>
diff --git a/resources/themes/Default/Outgoing/NextContent.html b/resources/themes/Default/Outgoing/NextContent.html
new file mode 100755
index 0000000..4367197
--- /dev/null
+++ b/resources/themes/Default/Outgoing/NextContent.html
@@ -0,0 +1,9 @@
+<div>
+	<div class="followUp"></div>
+	<div>
+		%message%
+		<div class="timeStamp">%time%</div>
+	</div>
+	<span id="insert"></span>
+</div>
+
diff --git a/resources/themes/Default/Outgoing/NextContext.html b/resources/themes/Default/Outgoing/NextContext.html
new file mode 100755
index 0000000..1f84771
--- /dev/null
+++ b/resources/themes/Default/Outgoing/NextContext.html
@@ -0,0 +1,6 @@
+<div class="followUp"></div>
+<div>
+	%message%
+	<div class="timeStamp">%time%</div>
+</div><span id="insert"></span>
+
diff --git a/resources/themes/Default/Outgoing/buddy_icon.png b/resources/themes/Default/Outgoing/buddy_icon.png
new file mode 100644
index 0000000..1d9f5f3
--- /dev/null
+++ b/resources/themes/Default/Outgoing/buddy_icon.png
diff --git a/resources/themes/Default/Status.html b/resources/themes/Default/Status.html
new file mode 100755
index 0000000..b8168e8
--- /dev/null
+++ b/resources/themes/Default/Status.html
@@ -0,0 +1,27 @@
+<div class="chatItem statusMessage">
+	<table width="100%">
+		<tr>
+			<td valign="top">
+				<div class="myBubble">
+					<table class="tableBubble" cellspacing="0" cellpadding="0">
+						<tr>
+							<td class="tl"></td>
+							<td class="tr"></td>
+						</tr>
+						<tr>
+							<td class="message">
+								%message%
+								<div class="timeStamp">%time%</div>
+							</td>
+							<td class="messageRight"></td>
+						</tr>
+						<tr>
+							<td class="bl"></td>
+							<td class="br"></td>
+						</tr>
+					</table>
+				</div>
+			</td>
+		</tr>
+	</table>
+</div>
diff --git a/resources/themes/Default/Template.html b/resources/themes/Default/Template.html
new file mode 100755
index 0000000..15f208c
--- /dev/null
+++ b/resources/themes/Default/Template.html
@@ -0,0 +1,366 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
+<html xmlns="http://www.w3.org/1999/xhtml">
+<head>
+	<meta http-equiv="content-type" content="text/html; charset=utf-8" />
+	<base href="%@">
+	
+	<script type="text/javascript">
+	//<![CDATA[
+	
+	   isDebug = false;        
+        
+        // Fade interval in milliseconds
+        // Make this larger if you experience performance issues
+        Fadomatic.INTERVAL_MILLIS = 50;
+        
+        // Creates a fader
+        // element - The element to fade
+        // speed - The speed to fade at, from 0.0 to 100.0
+        // initialOpacity (optional, default 100) - element's starting opacity, 0 to 100
+        // minOpacity (optional, default 0) - element's minimum opacity, 0 to 100
+        // maxOpacity (optional, default 0) - element's minimum opacity, 0 to 100
+        function Fadomatic (element, rate, initialOpacity, minOpacity, maxOpacity) {
+          this._element = element;
+          this._intervalId = null;
+          this._rate = rate;
+          this._isFadeOut = true;
+        
+          // Set initial opacity and bounds
+          // NB use 99 instead of 100 to avoid flicker at start of fade
+          this._minOpacity = 0;
+          this._maxOpacity = 99;
+          this._opacity = 99;
+        
+          if (typeof minOpacity != 'undefined') {
+            if (minOpacity < 0) {
+              this._minOpacity = 0;
+            } else if (minOpacity > 99) {
+              this._minOpacity = 99;
+            } else {
+              this._minOpacity = minOpacity;
+            }
+          }
+        
+          if (typeof maxOpacity != 'undefined') {
+            if (maxOpacity < 0) {
+              this._maxOpacity = 0;
+            } else if (maxOpacity > 99) {
+              this._maxOpacity = 99;
+            } else {
+              this._maxOpacity = maxOpacity;
+            }
+        
+            if (this._maxOpacity < this._minOpacity) {
+              this._maxOpacity = this._minOpacity;
+            }
+          }
+          
+          if (typeof initialOpacity != 'undefined') {
+            if (initialOpacity > this._maxOpacity) {
+              this._opacity = this._maxOpacity;
+            } else if (initialOpacity < this._minOpacity) {
+              this._opacity = this._minOpacity;
+            } else {
+              this._opacity = initialOpacity;
+            }
+          }
+        
+          // See if we're using W3C opacity, MSIE filter, or just
+          // toggling visiblity
+          if(typeof element.style.opacity != 'undefined') {
+        
+            this._updateOpacity = this._updateOpacityW3c;
+        
+          } else if(typeof element.style.filter != 'undefined') {
+        
+            // If there's not an alpha filter on the element already,
+            // add one
+            if (element.style.filter.indexOf("alpha") == -1) {
+        
+              // Attempt to preserve existing filters
+              var existingFilters="";
+              if (element.style.filter) {
+                existingFilters = element.style.filter+" ";
+              }
+              element.style.filter = existingFilters+"alpha(opacity="+this._opacity+")";
+            }
+        
+            this._updateOpacity = this._updateOpacityMSIE;
+            
+          } else {
+        
+            this._updateOpacity = this._updateVisibility;
+          }
+        
+          this._updateOpacity();
+        }
+        
+        // Initiates a fade out
+        Fadomatic.prototype.fadeOut = function () {
+          this._isFadeOut = true;
+          this._beginFade();
+        }
+        
+        // Initiates a fade in
+        Fadomatic.prototype.fadeIn = function () {
+          this._isFadeOut = false;
+          this._beginFade();
+        }
+        
+        // Makes the element completely opaque, stops any fade in progress
+        Fadomatic.prototype.show = function () {
+          this.haltFade();
+          this._opacity = this._maxOpacity;
+          this._updateOpacity();
+        }
+        
+        // Makes the element completely transparent, stops any fade in progress
+        Fadomatic.prototype.hide = function () {
+          this.haltFade();
+          this._opacity = 0;
+          this._updateOpacity();
+        }
+        
+        // Halts any fade in progress
+        Fadomatic.prototype.haltFade = function () {
+        
+          clearInterval(this._intervalId);
+        }
+        
+        // Resumes a fade where it was halted
+        Fadomatic.prototype.resumeFade = function () {
+        
+          this._beginFade();
+        }
+        
+        // Pseudo-private members
+        
+        Fadomatic.prototype._beginFade = function () {
+        
+          this.haltFade();
+          var objref = this;
+          this._intervalId = setInterval(function() { objref._tickFade(); },Fadomatic.INTERVAL_MILLIS);
+        }
+        
+        Fadomatic.prototype._tickFade = function () {
+        
+          if (this._isFadeOut) {
+            this._opacity -= this._rate;
+            if (this._opacity < this._minOpacity) {
+              this._opacity = this._minOpacity;
+              this.haltFade();
+            }
+          } else {
+            this._opacity += this._rate;
+            if (this._opacity > this._maxOpacity ) {
+              this._opacity = this._maxOpacity;
+              this.haltFade();
+            }
+          }
+        
+          this._updateOpacity();
+        }
+        
+        Fadomatic.prototype._updateVisibility = function () {
+          
+          if (this._opacity > 0) {
+            this._element.style.visibility = 'visible';
+          } else {
+            this._element.style.visibility = 'hidden';
+          }
+        }
+        
+        Fadomatic.prototype._updateOpacityW3c = function () {
+          
+          this._element.style.opacity = this._opacity/100;
+          this._updateVisibility();
+        }
+        
+        Fadomatic.prototype._updateOpacityMSIE = function () {
+          
+          this._element.filters.alpha.opacity = this._opacity;
+          this._updateVisibility();
+        }
+        
+        Fadomatic.prototype._updateOpacity = null;
+        
+        
+        
+	   //Do this on load
+		function initEvents() {
+			if(document.getElementById("heading") == null){
+				document.getElementById("bodyNode").style.marginTop = "5px";
+			}
+			
+            if(isDebug == false) {
+	           document.getElementById("debug").style.display = "none";
+	       }
+	       
+	       	       
+			alignChat(true);
+		}
+
+	   //Debugging function
+	   function trace(msg) {
+			var node = document.createElement("div");
+			var debugCon = document.getElementById("debug");
+			node.innerHTML = msg;
+			debugCon.appendChild(node);
+		}
+		
+	
+		//Appending new content to the message view
+		function appendMessage(html) {
+			var shouldScroll = nearBottom();
+			
+			//Remove any existing insertion point
+			var insert = document.getElementById("insert");
+			
+			if(insert) insert.parentNode.removeChild(insert);
+			
+			//Append the new message to the bottom of our chat block
+			var chat = document.getElementById("Chat");
+			var range = document.createRange();
+			range.selectNode(chat);
+			var documentFragment = range.createContextualFragment(html);
+      var myFrag = chat.appendChild(documentFragment);
+      var frag1 = document.getElementById("insert");
+      if (frag1) {
+        var frag= frag1.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode.parentNode;
+      
+        try {
+            var fader = new Fadomatic(frag, 9, 0, 0, 95);
+        } catch(e) {
+            trace(e);
+        }
+        fader.fadeIn();
+      }
+            
+			alignChat(true);
+		}
+		
+		
+		function appendNextMessage(html){
+			var shouldScroll = nearBottom();
+			
+			//Locate the insertion point
+			var insert = document.getElementById("insert");
+		
+			//make new node
+			range = document.createRange();
+			range.selectNode(insert.parentNode);
+			newNode = range.createContextualFragment(html);
+			
+			//swap
+			var pointer = insert.parentNode;
+			insert.parentNode.replaceChild(newNode,insert);
+			var els = pointer.getElementsByTagName("div");
+
+			alignChat(true);
+		}
+		
+		
+		//Auto-scroll to bottom.  Use nearBottom to determine if a scrollToBottom is desired.
+		function nearBottom() {
+			return ( document.body.scrollTop >= ( document.body.offsetHeight - ( window.innerHeight * 1.2 ) ) );
+		}
+		
+		var intervall_scroll;
+		function scrollToBottom() {
+			//document.body.scrollTop = (document.body.scrollHeight-window.innerHeight);
+			//return;
+			if( intervall_scroll ) clearInterval( intervall_scroll );
+			intervall_scroll = setInterval( function() {
+				var target_scroll = (document.body.scrollHeight-window.innerHeight);
+				var scrolldiff = target_scroll - document.body.scrollTop;
+				if ( document.body.scrollTop != target_scroll ) {
+					var saved_scroll = document.body.scrollTop;
+					document.body.scrollTop += scrolldiff / 5 + ( scrolldiff >= 0 ? (scrolldiff != 0 ) : -1 );
+				 } else {
+				 	saved_scroll = -1;
+					clearInterval( intervall_scroll );
+				 }
+			} , 10 );
+			return;
+		}
+		
+		
+		//Dynamically exchange the active stylesheet
+		function setStylesheet( id, url ) {
+			var code = "<style id=\"" + id + "\" type=\"text/css\" media=\"screen,print\">";
+			if( url.length ) code += "@import url( \"" + url + "\" );";
+			code += "</style>";
+			var range = document.createRange();
+			var head = document.getElementsByTagName( "head" ).item(0);
+			range.selectNode( head );
+			documentFragment = range.createContextualFragment( code );
+			head.removeChild( document.getElementById( id ) );
+			head.appendChild( documentFragment );
+		}
+		
+		//Swap an image with its alt-tag text on click
+		document.onclick = imageCheck;
+		function imageCheck() {		
+			node = event.target;
+			if(node.tagName == 'IMG' && node.alt && node.className!="avatar") {
+				a = document.createElement('a');
+				a.setAttribute('onclick', 'imageSwap(this)');
+				a.setAttribute('src', node.src);
+				a.className = node.className;
+				text = document.createTextNode(node.alt);
+				a.appendChild(text);
+				node.parentNode.replaceChild(a, node);
+			}
+		}
+		function imageSwap(node) {
+			shouldScroll = nearBottom();
+
+			//Swap the image/text
+			img = document.createElement('img');
+			img.setAttribute('src', node.src);
+			img.className = node.className;
+			img.setAttribute('alt', node.firstChild.nodeValue);
+			node.parentNode.replaceChild(img, node);
+			
+			alignChat(shouldScroll);
+		}
+		
+		//Align our chat to the bottom of the window.  If true is passed, view will also be scrolled down
+		function alignChat(shouldScroll) {
+
+			var windowHeight = window.innerHeight;
+			
+			if(windowHeight > 0) {
+				var contentElement = document.getElementById('Chat');
+				var contentHeight = contentElement.offsetHeight;
+				if (windowHeight - contentHeight > 0) {
+					contentElement.style.position = 'relative';
+					contentElement.style.top = '0px';
+				} else {
+					contentElement.style.position = 'static';
+				}
+			}
+			
+			if(shouldScroll) scrollToBottom();
+		}
+		
+		function windowDidResize() {
+			alignChat(true/*nearBottom()*/); //nearBottom buggy with inavtive tabs
+		}
+		
+		window.onresize = windowDidResize;
+		//]]>
+	</script>
+
+	<style id="mainStyle" type="text/css" media="screen,print">	@import url( "%@" ); </style>
+
+</head>
+<body style="==bodyBackground==" id="bodyNode" onload="initEvents()">
+%@
+<div id="Chat">
+</div>
+%@
+<div id="debug"></div>
+</body>
+</html>
diff --git a/resources/themes/Default/Variants/Blue on Green Alternating.css b/resources/themes/Default/Variants/Blue on Green Alternating.css
new file mode 100644
index 0000000..5b910eb
--- /dev/null
+++ b/resources/themes/Default/Variants/Blue on Green Alternating.css
@@ -0,0 +1,7 @@
+@import url("Blue on Green.css");
+@import url("../alternating.css");
+
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/blueIndicator2.png") no-repeat top left;
+}
diff --git a/resources/themes/Default/Variants/Blue on Green No Names Alt.css b/resources/themes/Default/Variants/Blue on Green No Names Alt.css
new file mode 100644
index 0000000..ebad314
--- /dev/null
+++ b/resources/themes/Default/Variants/Blue on Green No Names Alt.css
@@ -0,0 +1,2 @@
+@import url("Blue on Green Alternating.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Blue on Green No Names.css b/resources/themes/Default/Variants/Blue on Green No Names.css
new file mode 100644
index 0000000..2a0902c
--- /dev/null
+++ b/resources/themes/Default/Variants/Blue on Green No Names.css
@@ -0,0 +1,2 @@
+@import url("Blue on Green.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Blue on Green.css b/resources/themes/Default/Variants/Blue on Green.css
new file mode 100644
index 0000000..361c8c6
--- /dev/null
+++ b/resources/themes/Default/Variants/Blue on Green.css
@@ -0,0 +1,90 @@
+@import url("../main.css");
+
+/* outgoing */
+
+
+.outgoingItem .timeStamp {
+		color:#7fc5f8;
+}
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/blueIndicator.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tl {
+	background:url("../images/blueCurves.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tr {
+	background:url("../images/blueCurves.png") no-repeat top right;
+}
+
+.outgoingItem .tableBubble .head {
+	background:url("../images/blueCurves.png") no-repeat -10px 0;
+}
+
+.outgoingItem .tableBubble .message {
+	background:url("../images/blueBackground.png") repeat-y top left;
+}
+
+.outgoingItem .tableBubble .messageRight {
+	background:url("../images/blueBackground.png") repeat-y top right;
+}
+
+.outgoingItem .tableBubble .bl {
+	background:url("../images/blueCurves.png") no-repeat bottom left;
+}
+
+.outgoingItem .tableBubble .br {
+	background:url("../images/blueCurves.png") no-repeat bottom right;
+}
+
+.outgoingItem .followUp {
+	background-color:#ddf0fe;
+	border-bottom:1px solid #fff;
+}
+
+/*incoming */
+
+.incomingItem .myBubble .indicator {
+	background:url("../images/greenIndicator.png") no-repeat top left;
+}
+
+.incomingItem .timeStamp {
+	color:#9ecf35;
+}
+
+.incomingItem .tableBubble .tl {
+	background:url("../images/greenCurves.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tr {
+	background:url("../images/greenCurves.png") no-repeat top right;
+}
+
+.incomingItem .tableBubble .head {
+	background:url("../images/greenCurves.png") no-repeat -10px 0;
+}
+
+.incomingItem .tableBubble .message {
+	background:url("../images/greenBackground.png") repeat-y top left;
+}
+
+.incomingItem .tableBubble .messageRight {
+	background:url("../images/greenBackground.png") repeat-y top right;
+}
+
+.incomingItem .tableBubble .bl {
+	background:url("../images/greenCurves.png") no-repeat bottom left;
+}
+
+.incomingItem .tableBubble .br {
+	background:url("../images/greenCurves.png") no-repeat bottom right;
+}
+
+.incomingItem .followUp {
+	background-color:#e2efc4;
+	border-bottom:1px solid #fff;
+}
+
+
diff --git a/resources/themes/Default/Variants/Blue on Red Alternating.css b/resources/themes/Default/Variants/Blue on Red Alternating.css
new file mode 100644
index 0000000..5481c10
--- /dev/null
+++ b/resources/themes/Default/Variants/Blue on Red Alternating.css
@@ -0,0 +1,7 @@
+@import url("Blue on Red.css");
+@import url("../alternating.css");
+
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/blueIndicator2.png") no-repeat top left;
+}
diff --git a/resources/themes/Default/Variants/Blue on Red No Names Alt.css b/resources/themes/Default/Variants/Blue on Red No Names Alt.css
new file mode 100644
index 0000000..9818a6c
--- /dev/null
+++ b/resources/themes/Default/Variants/Blue on Red No Names Alt.css
@@ -0,0 +1,2 @@
+@import url("Blue on Red Alternating.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Blue on Red No Names.css b/resources/themes/Default/Variants/Blue on Red No Names.css
new file mode 100644
index 0000000..3ac8c9a
--- /dev/null
+++ b/resources/themes/Default/Variants/Blue on Red No Names.css
@@ -0,0 +1,2 @@
+@import url("Blue on Red.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Blue on Red.css b/resources/themes/Default/Variants/Blue on Red.css
new file mode 100644
index 0000000..0717920
--- /dev/null
+++ b/resources/themes/Default/Variants/Blue on Red.css
@@ -0,0 +1,89 @@
+@import url("../main.css");
+
+/* outgoing */
+
+
+.outgoingItem .timeStamp {
+		color:#7fc5f8;
+}
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/blueIndicator.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tl {
+	background:url("../images/blueCurves.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tr {
+	background:url("../images/blueCurves.png") no-repeat top right;
+}
+
+.outgoingItem .tableBubble .head {
+	background:url("../images/blueCurves.png") no-repeat -10px 0;
+}
+
+.outgoingItem .tableBubble .message {
+	background:url("../images/blueBackground.png") repeat-y top left;
+}
+
+.outgoingItem .tableBubble .messageRight {
+	background:url("../images/blueBackground.png") repeat-y top right;
+}
+
+.outgoingItem .tableBubble .bl {
+	background:url("../images/blueCurves.png") no-repeat bottom left;
+}
+
+.outgoingItem .tableBubble .br {
+	background:url("../images/blueCurves.png") no-repeat bottom right;
+}
+
+.outgoingItem .followUp {
+	background-color:#ddf0fe;
+	border-bottom:1px solid #fff;
+}
+
+
+/*incoming */
+
+.incomingItem .timeStamp {
+	color:#f88f8f;
+}
+
+.incomingItem .myBubble .indicator {
+	background:url("../images/redIndicator.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tl {
+	background:url("../images/redCurves.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tr {
+	background:url("../images/redCurves.png") no-repeat top right;
+}
+
+.incomingItem .tableBubble .head {
+	background:url("../images/redCurves.png") no-repeat -10px 0;
+}
+
+.incomingItem .tableBubble .message {
+	background:url("../images/redBackground.png") repeat-y top left;
+}
+
+.incomingItem .tableBubble .messageRight {
+	background:url("../images/redBackground.png") repeat-y top right;
+}
+
+.incomingItem .tableBubble .bl {
+	background:url("../images/redCurves.png") no-repeat bottom left;
+}
+
+.incomingItem .tableBubble .br {
+	background:url("../images/redCurves.png") no-repeat bottom right;
+}
+
+.incomingItem .followUp {
+	background-color:#ffdada;
+	border-bottom:1px solid #fff;
+}
diff --git a/resources/themes/Default/Variants/Blue on Steel Alternating.css b/resources/themes/Default/Variants/Blue on Steel Alternating.css
new file mode 100644
index 0000000..8473d1f
--- /dev/null
+++ b/resources/themes/Default/Variants/Blue on Steel Alternating.css
@@ -0,0 +1,7 @@
+@import url("Blue on Steel.css");
+@import url("../alternating.css");
+
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/blueIndicator2.png") no-repeat top left;
+}
diff --git a/resources/themes/Default/Variants/Blue on Steel No Names Alt.css b/resources/themes/Default/Variants/Blue on Steel No Names Alt.css
new file mode 100644
index 0000000..1925d5c
--- /dev/null
+++ b/resources/themes/Default/Variants/Blue on Steel No Names Alt.css
@@ -0,0 +1,2 @@
+@import url("Blue on Steel Alternating.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Blue on Steel No Names.css b/resources/themes/Default/Variants/Blue on Steel No Names.css
new file mode 100644
index 0000000..573aa58
--- /dev/null
+++ b/resources/themes/Default/Variants/Blue on Steel No Names.css
@@ -0,0 +1,2 @@
+@import url("Blue on Steel.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Blue on Steel.css b/resources/themes/Default/Variants/Blue on Steel.css
new file mode 100644
index 0000000..48ab03d
--- /dev/null
+++ b/resources/themes/Default/Variants/Blue on Steel.css
@@ -0,0 +1,91 @@
+@import url("../main.css");
+
+/* outgoing */
+
+
+.outgoingItem .timeStamp {
+		color:#7fc5f8;
+}
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/blueIndicator.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tl {
+	background:url("../images/blueCurves.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tr {
+	background:url("../images/blueCurves.png") no-repeat top right;
+}
+
+.outgoingItem .tableBubble .head {
+	background:url("../images/blueCurves.png") no-repeat -10px 0;
+}
+
+.outgoingItem .tableBubble .message {
+	background:url("../images/blueBackground.png") repeat-y top left;
+}
+
+.outgoingItem .tableBubble .messageRight {
+	background:url("../images/blueBackground.png") repeat-y top right;
+}
+
+.outgoingItem .tableBubble .bl {
+	background:url("../images/blueCurves.png") no-repeat bottom left;
+}
+
+.outgoingItem .tableBubble .br {
+	background:url("../images/blueCurves.png") no-repeat bottom right;
+}
+
+.outgoingItem .followUp {
+	background-color:#ddf0fe;
+	border-bottom:1px solid #fff;
+}
+
+
+/*incoming */
+
+.incomingItem .timeStamp {
+	color:#a9a9a9;
+}
+
+.incomingItem .myBubble .indicator {
+	background:url("../images/steelIndicator.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tl {
+	background:url("../images/steelCurves.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tr {
+	background:url("../images/steelCurves.png") no-repeat top right;
+}
+
+.incomingItem .tableBubble .head {
+	background:url("../images/steelCurves.png") no-repeat -10px 0;
+}
+
+.incomingItem .tableBubble .message {
+	background:url("../images/steelBackground.png") repeat-y top left;
+}
+
+.incomingItem .tableBubble .messageRight {
+	background:url("../images/steelBackground.png") repeat-y top right;
+}
+
+.incomingItem .tableBubble .bl {
+	background:url("../images/steelCurves.png") no-repeat bottom left;
+}
+
+.incomingItem .tableBubble .br {
+	background:url("../images/steelCurves.png") no-repeat bottom right;
+}
+
+.incomingItem .followUp {
+	background-color:#ececec;
+	border-bottom:1px solid #fff;
+}
+
+
diff --git a/resources/themes/Default/Variants/Blue on Yellow Alternating.css b/resources/themes/Default/Variants/Blue on Yellow Alternating.css
new file mode 100644
index 0000000..d7927fc
--- /dev/null
+++ b/resources/themes/Default/Variants/Blue on Yellow Alternating.css
@@ -0,0 +1,7 @@
+@import url("Blue on Yellow.css");
+@import url("../alternating.css");
+
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/blueIndicator2.png") no-repeat top left;
+}
diff --git a/resources/themes/Default/Variants/Blue on Yellow No Names Alt.css b/resources/themes/Default/Variants/Blue on Yellow No Names Alt.css
new file mode 100644
index 0000000..38d374d
--- /dev/null
+++ b/resources/themes/Default/Variants/Blue on Yellow No Names Alt.css
@@ -0,0 +1,2 @@
+@import url("Blue on Yellow Alternating.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Blue on Yellow No Names.css b/resources/themes/Default/Variants/Blue on Yellow No Names.css
new file mode 100644
index 0000000..3fdc8cd
--- /dev/null
+++ b/resources/themes/Default/Variants/Blue on Yellow No Names.css
@@ -0,0 +1,2 @@
+@import url("Blue on Yellow.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Blue on Yellow.css b/resources/themes/Default/Variants/Blue on Yellow.css
new file mode 100644
index 0000000..b019b0b
--- /dev/null
+++ b/resources/themes/Default/Variants/Blue on Yellow.css
@@ -0,0 +1,91 @@
+@import url("../main.css");
+
+/* outgoing */
+
+
+.outgoingItem .timeStamp {
+		color:#7fc5f8;
+}
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/blueIndicator.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tl {
+	background:url("../images/blueCurves.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tr {
+	background:url("../images/blueCurves.png") no-repeat top right;
+}
+
+.outgoingItem .tableBubble .head {
+	background:url("../images/blueCurves.png") no-repeat -10px 0;
+}
+
+.outgoingItem .tableBubble .message {
+	background:url("../images/blueBackground.png") repeat-y top left;
+}
+
+.outgoingItem .tableBubble .messageRight {
+	background:url("../images/blueBackground.png") repeat-y top right;
+}
+
+.outgoingItem .tableBubble .bl {
+	background:url("../images/blueCurves.png") no-repeat bottom left;
+}
+
+.outgoingItem .tableBubble .br {
+	background:url("../images/blueCurves.png") no-repeat bottom right;
+}
+
+.outgoingItem .followUp {
+	background-color:#ddf0fe;
+	border-bottom:1px solid #fff;
+}
+
+
+/*incoming */
+
+.incomingItem .timeStamp {
+	color:#bdb410;
+}
+
+.incomingItem .myBubble .indicator {
+	background:url("../images/yellowIndicator.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tl {
+	background:url("../images/yellowCurves.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tr {
+	background:url("../images/yellowCurves.png") no-repeat top right;
+}
+
+.incomingItem .tableBubble .head {
+	background:url("../images/yellowCurves.png") no-repeat -10px 0;
+}
+
+.incomingItem .tableBubble .message {
+	background:url("../images/yellowBackground.png") repeat-y top left;
+}
+
+.incomingItem .tableBubble .messageRight {
+	background:url("../images/yellowBackground.png") repeat-y top right;
+}
+
+.incomingItem .tableBubble .bl {
+	background:url("../images/yellowCurves.png") no-repeat bottom left;
+}
+
+.incomingItem .tableBubble .br {
+	background:url("../images/yellowCurves.png") no-repeat bottom right;
+}
+
+.incomingItem .followUp {
+	background-color:#f4f0a7;
+	border-bottom:1px solid #fff;
+}
+
+
diff --git a/resources/themes/Default/Variants/Green on Blue Alternating.css b/resources/themes/Default/Variants/Green on Blue Alternating.css
new file mode 100644
index 0000000..272c0d0
--- /dev/null
+++ b/resources/themes/Default/Variants/Green on Blue Alternating.css
@@ -0,0 +1,7 @@
+@import url("Green on Blue.css");
+@import url("../alternating.css");
+
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/greenIndicator2.png") no-repeat top left;
+}
diff --git a/resources/themes/Default/Variants/Green on Blue No Names Alt.css b/resources/themes/Default/Variants/Green on Blue No Names Alt.css
new file mode 100644
index 0000000..973f91a
--- /dev/null
+++ b/resources/themes/Default/Variants/Green on Blue No Names Alt.css
@@ -0,0 +1,2 @@
+@import url("Green on Blue Alternating.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Green on Blue No Names.css b/resources/themes/Default/Variants/Green on Blue No Names.css
new file mode 100644
index 0000000..0d92eb0
--- /dev/null
+++ b/resources/themes/Default/Variants/Green on Blue No Names.css
@@ -0,0 +1,2 @@
+@import url("Green on Blue.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Green on Blue.css b/resources/themes/Default/Variants/Green on Blue.css
new file mode 100644
index 0000000..7185f4f
--- /dev/null
+++ b/resources/themes/Default/Variants/Green on Blue.css
@@ -0,0 +1,91 @@
+@import url("../main.css");
+
+/* outgoing */
+
+
+.outgoingItem .timeStamp {
+	color:#9ecf35;
+}
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/greenIndicator.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tl {
+	background:url("../images/greenCurves.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tr {
+	background:url("../images/greenCurves.png") no-repeat top right;
+}
+
+.outgoingItem .tableBubble .head {
+	background:url("../images/greenCurves.png") no-repeat -10px 0;
+}
+
+.outgoingItem .tableBubble .message {
+	background:url("../images/greenBackground.png") repeat-y top left;
+}
+
+.outgoingItem .tableBubble .messageRight {
+	background:url("../images/greenBackground.png") repeat-y top right;
+}
+
+.outgoingItem .tableBubble .bl {
+	background:url("../images/greenCurves.png") no-repeat bottom left;
+}
+
+.outgoingItem .tableBubble .br {
+	background:url("../images/greenCurves.png") no-repeat bottom right;
+}
+
+.outgoingItem .followUp {
+	background-color:#e2efc4;
+	border-bottom:1px solid #fff;
+}
+
+
+/*incoming */
+
+.incomingItem .timeStamp {
+	color:#7fc5f8;
+}
+
+.incomingItem .myBubble .indicator {
+	background:url("../images/blueIndicator.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tl {
+	background:url("../images/blueCurves.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tr {
+	background:url("../images/blueCurves.png") no-repeat top right;
+}
+
+.incomingItem .tableBubble .head {
+	background:url("../images/blueCurves.png") no-repeat -10px 0;
+}
+
+.incomingItem .tableBubble .message {
+	background:url("../images/blueBackground.png") repeat-y top left;
+}
+
+.incomingItem .tableBubble .messageRight {
+	background:url("../images/blueBackground.png") repeat-y top right;
+}
+
+.incomingItem .tableBubble .bl {
+	background:url("../images/blueCurves.png") no-repeat bottom left;
+}
+
+.incomingItem .tableBubble .br {
+	background:url("../images/blueCurves.png") no-repeat bottom right;
+}
+
+.incomingItem .followUp {
+	background-color:#ddf0fe;
+	border-bottom:1px solid #fff;
+}
+
+
diff --git a/resources/themes/Default/Variants/Green on Red Alternating.css b/resources/themes/Default/Variants/Green on Red Alternating.css
new file mode 100644
index 0000000..e656dc0
--- /dev/null
+++ b/resources/themes/Default/Variants/Green on Red Alternating.css
@@ -0,0 +1,7 @@
+@import url("Green on Red.css");
+@import url("../alternating.css");
+
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/greenIndicator2.png") no-repeat top left;
+}
diff --git a/resources/themes/Default/Variants/Green on Red No Names Alt.css b/resources/themes/Default/Variants/Green on Red No Names Alt.css
new file mode 100644
index 0000000..5fd2482
--- /dev/null
+++ b/resources/themes/Default/Variants/Green on Red No Names Alt.css
@@ -0,0 +1,2 @@
+@import url("Green on Red Alternating.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Green on Red No Names.css b/resources/themes/Default/Variants/Green on Red No Names.css
new file mode 100644
index 0000000..23dae81
--- /dev/null
+++ b/resources/themes/Default/Variants/Green on Red No Names.css
@@ -0,0 +1,2 @@
+@import url("Green on Red.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Green on Red.css b/resources/themes/Default/Variants/Green on Red.css
new file mode 100644
index 0000000..cdf38b3
--- /dev/null
+++ b/resources/themes/Default/Variants/Green on Red.css
@@ -0,0 +1,91 @@
+@import url("../main.css");
+
+/* outgoing */
+
+
+.outgoingItem .timeStamp {
+	color:#9ecf35;
+}
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/greenIndicator.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tl {
+	background:url("../images/greenCurves.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tr {
+	background:url("../images/greenCurves.png") no-repeat top right;
+}
+
+.outgoingItem .tableBubble .head {
+	background:url("../images/greenCurves.png") no-repeat -10px 0;
+}
+
+.outgoingItem .tableBubble .message {
+	background:url("../images/greenBackground.png") repeat-y top left;
+}
+
+.outgoingItem .tableBubble .messageRight {
+	background:url("../images/greenBackground.png") repeat-y top right;
+}
+
+.outgoingItem .tableBubble .bl {
+	background:url("../images/greenCurves.png") no-repeat bottom left;
+}
+
+.outgoingItem .tableBubble .br {
+	background:url("../images/greenCurves.png") no-repeat bottom right;
+}
+
+.outgoingItem .followUp {
+	background-color:#e2efc4;
+	border-bottom:1px solid #fff;
+}
+
+
+/*incoming */
+
+.incomingItem .timeStamp {
+	color:#f88f8f;
+}
+
+.incomingItem .myBubble .indicator {
+	background:url("../images/redIndicator.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tl {
+	background:url("../images/redCurves.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tr {
+	background:url("../images/redCurves.png") no-repeat top right;
+}
+
+.incomingItem .tableBubble .head {
+	background:url("../images/redCurves.png") no-repeat -10px 0;
+}
+
+.incomingItem .tableBubble .message {
+	background:url("../images/redBackground.png") repeat-y top left;
+}
+
+.incomingItem .tableBubble .messageRight {
+	background:url("../images/redBackground.png") repeat-y top right;
+}
+
+.incomingItem .tableBubble .bl {
+	background:url("../images/redCurves.png") no-repeat bottom left;
+}
+
+.incomingItem .tableBubble .br {
+	background:url("../images/redCurves.png") no-repeat bottom right;
+}
+
+.incomingItem .followUp {
+	background-color:#ffdada;
+	border-bottom:1px solid #fff;
+}
+
+
diff --git a/resources/themes/Default/Variants/Green on Steel Alternating.css b/resources/themes/Default/Variants/Green on Steel Alternating.css
new file mode 100644
index 0000000..3c14f7f
--- /dev/null
+++ b/resources/themes/Default/Variants/Green on Steel Alternating.css
@@ -0,0 +1,7 @@
+@import url("Green on Steel.css");
+@import url("../alternating.css");
+
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/greenIndicator2.png") no-repeat top left;
+}
diff --git a/resources/themes/Default/Variants/Green on Steel No Names Alt.css b/resources/themes/Default/Variants/Green on Steel No Names Alt.css
new file mode 100644
index 0000000..cfd6bb9
--- /dev/null
+++ b/resources/themes/Default/Variants/Green on Steel No Names Alt.css
@@ -0,0 +1,2 @@
+@import url("Green on Steel Alternating.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Green on Steel No Names.css b/resources/themes/Default/Variants/Green on Steel No Names.css
new file mode 100644
index 0000000..41bc9de
--- /dev/null
+++ b/resources/themes/Default/Variants/Green on Steel No Names.css
@@ -0,0 +1,2 @@
+@import url("Green on Steel.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Green on Steel.css b/resources/themes/Default/Variants/Green on Steel.css
new file mode 100644
index 0000000..30a78a0
--- /dev/null
+++ b/resources/themes/Default/Variants/Green on Steel.css
@@ -0,0 +1,91 @@
+@import url("../main.css");
+
+/* outgoing */
+
+
+.outgoingItem .timeStamp {
+	color:#9ecf35;
+}
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/greenIndicator.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tl {
+	background:url("../images/greenCurves.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tr {
+	background:url("../images/greenCurves.png") no-repeat top right;
+}
+
+.outgoingItem .tableBubble .head {
+	background:url("../images/greenCurves.png") no-repeat -10px 0;
+}
+
+.outgoingItem .tableBubble .message {
+	background:url("../images/greenBackground.png") repeat-y top left;
+}
+
+.outgoingItem .tableBubble .messageRight {
+	background:url("../images/greenBackground.png") repeat-y top right;
+}
+
+.outgoingItem .tableBubble .bl {
+	background:url("../images/greenCurves.png") no-repeat bottom left;
+}
+
+.outgoingItem .tableBubble .br {
+	background:url("../images/greenCurves.png") no-repeat bottom right;
+}
+
+.outgoingItem .followUp {
+	background-color:#e2efc4;
+	border-bottom:1px solid #fff;
+}
+
+
+/*incoming */
+
+.incomingItem .timeStamp {
+	color:#a9a9a9;
+}
+
+.incomingItem .myBubble .indicator {
+	background:url("../images/steelIndicator.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tl {
+	background:url("../images/steelCurves.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tr {
+	background:url("../images/steelCurves.png") no-repeat top right;
+}
+
+.incomingItem .tableBubble .head {
+	background:url("../images/steelCurves.png") no-repeat -10px 0;
+}
+
+.incomingItem .tableBubble .message {
+	background:url("../images/steelBackground.png") repeat-y top left;
+}
+
+.incomingItem .tableBubble .messageRight {
+	background:url("../images/steelBackground.png") repeat-y top right;
+}
+
+.incomingItem .tableBubble .bl {
+	background:url("../images/steelCurves.png") no-repeat bottom left;
+}
+
+.incomingItem .tableBubble .br {
+	background:url("../images/steelCurves.png") no-repeat bottom right;
+}
+
+.incomingItem .followUp {
+	background-color:#ececec;
+	border-bottom:1px solid #fff;
+}
+
+
diff --git a/resources/themes/Default/Variants/Green on Yellow Alternating.css b/resources/themes/Default/Variants/Green on Yellow Alternating.css
new file mode 100644
index 0000000..d0553e8
--- /dev/null
+++ b/resources/themes/Default/Variants/Green on Yellow Alternating.css
@@ -0,0 +1,7 @@
+@import url("Green on Yellow.css");
+@import url("../alternating.css");
+
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/greenIndicator2.png") no-repeat top left;
+}
diff --git a/resources/themes/Default/Variants/Green on Yellow No Names Alt.css b/resources/themes/Default/Variants/Green on Yellow No Names Alt.css
new file mode 100644
index 0000000..27adc33
--- /dev/null
+++ b/resources/themes/Default/Variants/Green on Yellow No Names Alt.css
@@ -0,0 +1,2 @@
+@import url("Green on Yellow Alternating.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Green on Yellow No Names.css b/resources/themes/Default/Variants/Green on Yellow No Names.css
new file mode 100644
index 0000000..8c8cb28
--- /dev/null
+++ b/resources/themes/Default/Variants/Green on Yellow No Names.css
@@ -0,0 +1,2 @@
+@import url("Green on Yellow.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Green on Yellow.css b/resources/themes/Default/Variants/Green on Yellow.css
new file mode 100644
index 0000000..d7f64d3
--- /dev/null
+++ b/resources/themes/Default/Variants/Green on Yellow.css
@@ -0,0 +1,91 @@
+@import url("../main.css");
+
+/* outgoing */
+
+
+.outgoingItem .timeStamp {
+	color:#9ecf35;
+}
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/greenIndicator.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tl {
+	background:url("../images/greenCurves.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tr {
+	background:url("../images/greenCurves.png") no-repeat top right;
+}
+
+.outgoingItem .tableBubble .head {
+	background:url("../images/greenCurves.png") no-repeat -10px 0;
+}
+
+.outgoingItem .tableBubble .message {
+	background:url("../images/greenBackground.png") repeat-y top left;
+}
+
+.outgoingItem .tableBubble .messageRight {
+	background:url("../images/greenBackground.png") repeat-y top right;
+}
+
+.outgoingItem .tableBubble .bl {
+	background:url("../images/greenCurves.png") no-repeat bottom left;
+}
+
+.outgoingItem .tableBubble .br {
+	background:url("../images/greenCurves.png") no-repeat bottom right;
+}
+
+.outgoingItem .followUp {
+	background-color:#e2efc4;
+	border-bottom:1px solid #fff;
+}
+
+
+/*incoming */
+
+.incomingItem .timeStamp {
+	color:#bdb410;
+}
+
+.incomingItem .myBubble .indicator {
+	background:url("../images/yellowIndicator.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tl {
+	background:url("../images/yellowCurves.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tr {
+	background:url("../images/yellowCurves.png") no-repeat top right;
+}
+
+.incomingItem .tableBubble .head {
+	background:url("../images/yellowCurves.png") no-repeat -10px 0;
+}
+
+.incomingItem .tableBubble .message {
+	background:url("../images/yellowBackground.png") repeat-y top left;
+}
+
+.incomingItem .tableBubble .messageRight {
+	background:url("../images/yellowBackground.png") repeat-y top right;
+}
+
+.incomingItem .tableBubble .bl {
+	background:url("../images/yellowCurves.png") no-repeat bottom left;
+}
+
+.incomingItem .tableBubble .br {
+	background:url("../images/yellowCurves.png") no-repeat bottom right;
+}
+
+.incomingItem .followUp {
+	background-color:#f4f0a7;
+	border-bottom:1px solid #fff;
+}
+
+
diff --git a/resources/themes/Default/Variants/Red on Blue Alternating.css b/resources/themes/Default/Variants/Red on Blue Alternating.css
new file mode 100644
index 0000000..5d241fb
--- /dev/null
+++ b/resources/themes/Default/Variants/Red on Blue Alternating.css
@@ -0,0 +1,7 @@
+@import url("Red on Blue.css");
+@import url("../alternating.css");
+
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/redIndicator2.png") no-repeat top left;
+}
diff --git a/resources/themes/Default/Variants/Red on Blue No Names Alt.css b/resources/themes/Default/Variants/Red on Blue No Names Alt.css
new file mode 100644
index 0000000..2e80935
--- /dev/null
+++ b/resources/themes/Default/Variants/Red on Blue No Names Alt.css
@@ -0,0 +1,2 @@
+@import url("Red on Blue Alternating.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Red on Blue No Names.css b/resources/themes/Default/Variants/Red on Blue No Names.css
new file mode 100644
index 0000000..da98b5c
--- /dev/null
+++ b/resources/themes/Default/Variants/Red on Blue No Names.css
@@ -0,0 +1,2 @@
+@import url("Red on Blue.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Red on Blue.css b/resources/themes/Default/Variants/Red on Blue.css
new file mode 100644
index 0000000..f6e646c
--- /dev/null
+++ b/resources/themes/Default/Variants/Red on Blue.css
@@ -0,0 +1,90 @@
+@import url("../main.css");
+
+/* outgoing */
+
+
+.outgoingItem .timeStamp {
+		color:#f88f8f;
+}
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/redIndicator.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tl {
+	background:url("../images/redCurves.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tr {
+	background:url("../images/redCurves.png") no-repeat top right;
+}
+
+.outgoingItem .tableBubble .head {
+	background:url("../images/redCurves.png") no-repeat -10px 0;
+}
+
+.outgoingItem .tableBubble .message {
+	background:url("../images/redBackground.png") repeat-y top left;
+}
+
+.outgoingItem .tableBubble .messageRight {
+	background:url("../images/redBackground.png") repeat-y top right;
+}
+
+.outgoingItem .tableBubble .bl {
+	background:url("../images/redCurves.png") no-repeat bottom left;
+}
+
+.outgoingItem .tableBubble .br {
+	background:url("../images/redCurves.png") no-repeat bottom right;
+}
+
+.outgoingItem .followUp {
+	background-color:#ffdada;
+	border-bottom:1px solid #fff;
+}
+
+
+
+/*incoming */
+
+.incomingItem .timeStamp {
+	color:#7fc5f8;
+}
+
+.incomingItem .myBubble .indicator {
+	background:url("../images/blueIndicator.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tl {
+	background:url("../images/blueCurves.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tr {
+	background:url("../images/blueCurves.png") no-repeat top right;
+}
+
+.incomingItem .tableBubble .head {
+	background:url("../images/blueCurves.png") no-repeat -10px 0;
+}
+
+.incomingItem .tableBubble .message {
+	background:url("../images/blueBackground.png") repeat-y top left;
+}
+
+.incomingItem .tableBubble .messageRight {
+	background:url("../images/blueBackground.png") repeat-y top right;
+}
+
+.incomingItem .tableBubble .bl {
+	background:url("../images/blueCurves.png") no-repeat bottom left;
+}
+
+.incomingItem .tableBubble .br {
+	background:url("../images/blueCurves.png") no-repeat bottom right;
+}
+
+.incomingItem .followUp {
+	background-color:#ddf0fe;
+	border-bottom:1px solid #fff;
+}
diff --git a/resources/themes/Default/Variants/Red on Green Alternating.css b/resources/themes/Default/Variants/Red on Green Alternating.css
new file mode 100644
index 0000000..db8effa
--- /dev/null
+++ b/resources/themes/Default/Variants/Red on Green Alternating.css
@@ -0,0 +1,7 @@
+@import url("Red on Green.css");
+@import url("../alternating.css");
+
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/redIndicator2.png") no-repeat top left;
+}
diff --git a/resources/themes/Default/Variants/Red on Green No Names Alt.css b/resources/themes/Default/Variants/Red on Green No Names Alt.css
new file mode 100644
index 0000000..9a230f2
--- /dev/null
+++ b/resources/themes/Default/Variants/Red on Green No Names Alt.css
@@ -0,0 +1,2 @@
+@import url("Red on Green Alternating.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Red on Green No Names.css b/resources/themes/Default/Variants/Red on Green No Names.css
new file mode 100644
index 0000000..1bbc2a5
--- /dev/null
+++ b/resources/themes/Default/Variants/Red on Green No Names.css
@@ -0,0 +1,2 @@
+@import url("Red on Green.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Red on Green.css b/resources/themes/Default/Variants/Red on Green.css
new file mode 100644
index 0000000..0e7c12b
--- /dev/null
+++ b/resources/themes/Default/Variants/Red on Green.css
@@ -0,0 +1,95 @@
+@import url("../main.css");
+
+/* outgoing */
+
+
+.outgoingItem .timeStamp {
+		color:#f88f8f;
+}
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/redIndicator.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tl {
+	background:url("../images/redCurves.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tr {
+	background:url("../images/redCurves.png") no-repeat top right;
+}
+
+.outgoingItem .tableBubble .head {
+	background:url("../images/redCurves.png") no-repeat -10px 0;
+}
+
+.outgoingItem .tableBubble .message {
+	background:url("../images/redBackground.png") repeat-y top left;
+}
+
+.outgoingItem .tableBubble .messageRight {
+	background:url("../images/redBackground.png") repeat-y top right;
+}
+
+.outgoingItem .tableBubble .bl {
+	background:url("../images/redCurves.png") no-repeat bottom left;
+}
+
+.outgoingItem .tableBubble .br {
+	background:url("../images/redCurves.png") no-repeat bottom right;
+}
+
+.outgoingItem .followUp {
+	background-color:#ffdada;
+	border-bottom:1px solid #fff;
+}
+
+/*incoming */
+
+.incomingItem .timeStamp {
+	color:#9ecf35;
+}
+
+
+.incomingItem .myBubble .indicator {
+	background:url("../images/greenIndicator.png") no-repeat top left;
+}
+
+.incomingItem .timeStamp {
+	color:#9ecf35;
+}
+
+.incomingItem .tableBubble .tl {
+	background:url("../images/greenCurves.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tr {
+	background:url("../images/greenCurves.png") no-repeat top right;
+}
+
+.incomingItem .tableBubble .head {
+	background:url("../images/greenCurves.png") no-repeat -10px 0;
+}
+
+.incomingItem .tableBubble .message {
+	background:url("../images/greenBackground.png") repeat-y top left;
+}
+
+.incomingItem .tableBubble .messageRight {
+	background:url("../images/greenBackground.png") repeat-y top right;
+}
+
+.incomingItem .tableBubble .bl {
+	background:url("../images/greenCurves.png") no-repeat bottom left;
+}
+
+.incomingItem .tableBubble .br {
+	background:url("../images/greenCurves.png") no-repeat bottom right;
+}
+
+.incomingItem .followUp {
+	background-color:#e2efc4;
+	border-bottom:1px solid #fff;
+}
+
+
diff --git a/resources/themes/Default/Variants/Red on Steel Alternating.css b/resources/themes/Default/Variants/Red on Steel Alternating.css
new file mode 100644
index 0000000..ad7eb15
--- /dev/null
+++ b/resources/themes/Default/Variants/Red on Steel Alternating.css
@@ -0,0 +1,7 @@
+@import url("Red on Steel.css");
+@import url("../alternating.css");
+
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/redIndicator2.png") no-repeat top left;
+}
diff --git a/resources/themes/Default/Variants/Red on Steel No Names Alt.css b/resources/themes/Default/Variants/Red on Steel No Names Alt.css
new file mode 100644
index 0000000..9c6ab55
--- /dev/null
+++ b/resources/themes/Default/Variants/Red on Steel No Names Alt.css
@@ -0,0 +1,2 @@
+@import url("Red on Steel Alternating.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Red on Steel No Names.css b/resources/themes/Default/Variants/Red on Steel No Names.css
new file mode 100644
index 0000000..aa2b60a
--- /dev/null
+++ b/resources/themes/Default/Variants/Red on Steel No Names.css
@@ -0,0 +1,2 @@
+@import url("Red on Steel.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Red on Steel.css b/resources/themes/Default/Variants/Red on Steel.css
new file mode 100644
index 0000000..8a39df2
--- /dev/null
+++ b/resources/themes/Default/Variants/Red on Steel.css
@@ -0,0 +1,93 @@
+@import url("../main.css");
+
+/* outgoing */
+
+
+.outgoingItem .timeStamp {
+		color:#f88f8f;
+}
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/redIndicator.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tl {
+	background:url("../images/redCurves.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tr {
+	background:url("../images/redCurves.png") no-repeat top right;
+}
+
+.outgoingItem .tableBubble .head {
+	background:url("../images/redCurves.png") no-repeat -10px 0;
+}
+
+.outgoingItem .tableBubble .message {
+	background:url("../images/redBackground.png") repeat-y top left;
+}
+
+.outgoingItem .tableBubble .messageRight {
+	background:url("../images/redBackground.png") repeat-y top right;
+}
+
+.outgoingItem .tableBubble .bl {
+	background:url("../images/redCurves.png") no-repeat bottom left;
+}
+
+.outgoingItem .tableBubble .br {
+	background:url("../images/redCurves.png") no-repeat bottom right;
+}
+
+.outgoingItem .followUp {
+	background-color:#ffdada;
+	border-bottom:1px solid #fff;
+}
+
+
+
+
+/*incoming */
+
+.incomingItem .timeStamp {
+	color:#a9a9a9;
+}
+
+.incomingItem .myBubble .indicator {
+	background:url("../images/steelIndicator.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tl {
+	background:url("../images/steelCurves.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tr {
+	background:url("../images/steelCurves.png") no-repeat top right;
+}
+
+.incomingItem .tableBubble .head {
+	background:url("../images/steelCurves.png") no-repeat -10px 0;
+}
+
+.incomingItem .tableBubble .message {
+	background:url("../images/steelBackground.png") repeat-y top left;
+}
+
+.incomingItem .tableBubble .messageRight {
+	background:url("../images/steelBackground.png") repeat-y top right;
+}
+
+.incomingItem .tableBubble .bl {
+	background:url("../images/steelCurves.png") no-repeat bottom left;
+}
+
+.incomingItem .tableBubble .br {
+	background:url("../images/steelCurves.png") no-repeat bottom right;
+}
+
+.incomingItem .followUp {
+	background-color:#ececec;
+	border-bottom:1px solid #fff;
+}
+
+
diff --git a/resources/themes/Default/Variants/Red on Yellow Alternating.css b/resources/themes/Default/Variants/Red on Yellow Alternating.css
new file mode 100644
index 0000000..b264d7d
--- /dev/null
+++ b/resources/themes/Default/Variants/Red on Yellow Alternating.css
@@ -0,0 +1,7 @@
+@import url("Red on Yellow.css");
+@import url("../alternating.css");
+
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/redIndicator2.png") no-repeat top left;
+}
diff --git a/resources/themes/Default/Variants/Red on Yellow No Names Alt.css b/resources/themes/Default/Variants/Red on Yellow No Names Alt.css
new file mode 100644
index 0000000..dc4394e
--- /dev/null
+++ b/resources/themes/Default/Variants/Red on Yellow No Names Alt.css
@@ -0,0 +1,2 @@
+@import url("Red on Yellow Alternating.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Red on Yellow No Names.css b/resources/themes/Default/Variants/Red on Yellow No Names.css
new file mode 100644
index 0000000..9ca44ec
--- /dev/null
+++ b/resources/themes/Default/Variants/Red on Yellow No Names.css
@@ -0,0 +1,2 @@
+@import url("Red on Yellow.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Red on Yellow.css b/resources/themes/Default/Variants/Red on Yellow.css
new file mode 100644
index 0000000..f2dc5a0
--- /dev/null
+++ b/resources/themes/Default/Variants/Red on Yellow.css
@@ -0,0 +1,91 @@
+@import url("../main.css");
+
+/* outgoing */
+
+
+.outgoingItem .timeStamp {
+		color:#f88f8f;
+}
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/redIndicator.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tl {
+	background:url("../images/redCurves.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tr {
+	background:url("../images/redCurves.png") no-repeat top right;
+}
+
+.outgoingItem .tableBubble .head {
+	background:url("../images/redCurves.png") no-repeat -10px 0;
+}
+
+.outgoingItem .tableBubble .message {
+	background:url("../images/redBackground.png") repeat-y top left;
+}
+
+.outgoingItem .tableBubble .messageRight {
+	background:url("../images/redBackground.png") repeat-y top right;
+}
+
+.outgoingItem .tableBubble .bl {
+	background:url("../images/redCurves.png") no-repeat bottom left;
+}
+
+.outgoingItem .tableBubble .br {
+	background:url("../images/redCurves.png") no-repeat bottom right;
+}
+
+.outgoingItem .followUp {
+	background-color:#ffdada;
+	border-bottom:1px solid #fff;
+}
+
+
+
+
+/*incoming */
+
+.incomingItem .timeStamp {
+	color:#bdb410;
+}
+
+.incomingItem .myBubble .indicator {
+	background:url("../images/yellowIndicator.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tl {
+	background:url("../images/yellowCurves.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tr {
+	background:url("../images/yellowCurves.png") no-repeat top right;
+}
+
+.incomingItem .tableBubble .head {
+	background:url("../images/yellowCurves.png") no-repeat -10px 0;
+}
+
+.incomingItem .tableBubble .message {
+	background:url("../images/yellowBackground.png") repeat-y top left;
+}
+
+.incomingItem .tableBubble .messageRight {
+	background:url("../images/yellowBackground.png") repeat-y top right;
+}
+
+.incomingItem .tableBubble .bl {
+	background:url("../images/yellowCurves.png") no-repeat bottom left;
+}
+
+.incomingItem .tableBubble .br {
+	background:url("../images/yellowCurves.png") no-repeat bottom right;
+}
+
+.incomingItem .followUp {
+	background-color:#f4f0a7;
+	border-bottom:1px solid #fff;
+}
diff --git a/resources/themes/Default/Variants/Steel on Blue Alternating.css b/resources/themes/Default/Variants/Steel on Blue Alternating.css
new file mode 100644
index 0000000..8c15ec2
--- /dev/null
+++ b/resources/themes/Default/Variants/Steel on Blue Alternating.css
@@ -0,0 +1,7 @@
+@import url("Steel on Blue.css");
+@import url("../alternating.css");
+
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/steelIndicator2.png") no-repeat top left;
+}
diff --git a/resources/themes/Default/Variants/Steel on Blue No Names Alt.css b/resources/themes/Default/Variants/Steel on Blue No Names Alt.css
new file mode 100644
index 0000000..7edfcb1
--- /dev/null
+++ b/resources/themes/Default/Variants/Steel on Blue No Names Alt.css
@@ -0,0 +1,2 @@
+@import url("Steel on Blue Alternating.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Steel on Blue No Names.css b/resources/themes/Default/Variants/Steel on Blue No Names.css
new file mode 100644
index 0000000..f7058b9
--- /dev/null
+++ b/resources/themes/Default/Variants/Steel on Blue No Names.css
@@ -0,0 +1,2 @@
+@import url("Steel on Blue.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Steel on Blue.css b/resources/themes/Default/Variants/Steel on Blue.css
new file mode 100644
index 0000000..6203dc2
--- /dev/null
+++ b/resources/themes/Default/Variants/Steel on Blue.css
@@ -0,0 +1,92 @@
+@import url("../main.css");
+
+/* outgoing */
+
+
+.outgoingItem .timeStamp {
+		color:#a9a9a9;
+}
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/steelIndicator.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tl {
+	background:url("../images/steelCurves.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tr {
+	background:url("../images/steelCurves.png") no-repeat top right;
+}
+
+.outgoingItem .tableBubble .head {
+	background:url("../images/steelCurves.png") no-repeat -10px 0;
+}
+
+.outgoingItem .tableBubble .message {
+	background:url("../images/steelBackground.png") repeat-y top left;
+}
+
+.outgoingItem .tableBubble .messageRight {
+	background:url("../images/steelBackground.png") repeat-y top right;
+}
+
+.outgoingItem .tableBubble .bl {
+	background:url("../images/steelCurves.png") no-repeat bottom left;
+}
+
+.outgoingItem .tableBubble .br {
+	background:url("../images/steelCurves.png") no-repeat bottom right;
+}
+
+.outgoingItem .followUp {
+	background-color:#ececec;
+	border-bottom:1px solid #fff;
+}
+
+
+
+/*incoming */
+
+.incomingItem .timeStamp {
+	color:#7fc5f8;
+}
+
+.incomingItem .myBubble .indicator {
+	background:url("../images/blueIndicator.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tl {
+	background:url("../images/blueCurves.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tr {
+	background:url("../images/blueCurves.png") no-repeat top right;
+}
+
+.incomingItem .tableBubble .head {
+	background:url("../images/blueCurves.png") no-repeat -10px 0;
+}
+
+.incomingItem .tableBubble .message {
+	background:url("../images/blueBackground.png") repeat-y top left;
+}
+
+.incomingItem .tableBubble .messageRight {
+	background:url("../images/blueBackground.png") repeat-y top right;
+}
+
+.incomingItem .tableBubble .bl {
+	background:url("../images/blueCurves.png") no-repeat bottom left;
+}
+
+.incomingItem .tableBubble .br {
+	background:url("../images/blueCurves.png") no-repeat bottom right;
+}
+
+.incomingItem .followUp {
+	background-color:#ddf0fe;
+	border-bottom:1px solid #fff;
+}
+
+
diff --git a/resources/themes/Default/Variants/Steel on Green Alternating.css b/resources/themes/Default/Variants/Steel on Green Alternating.css
new file mode 100644
index 0000000..69474f0
--- /dev/null
+++ b/resources/themes/Default/Variants/Steel on Green Alternating.css
@@ -0,0 +1,7 @@
+@import url("Steel on Green.css");
+@import url("../alternating.css");
+
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/steelIndicator2.png") no-repeat top left;
+}
diff --git a/resources/themes/Default/Variants/Steel on Green No Names Alt.css b/resources/themes/Default/Variants/Steel on Green No Names Alt.css
new file mode 100644
index 0000000..6fc5606
--- /dev/null
+++ b/resources/themes/Default/Variants/Steel on Green No Names Alt.css
@@ -0,0 +1,2 @@
+@import url("Steel on Green Alternating.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Steel on Green No Names.css b/resources/themes/Default/Variants/Steel on Green No Names.css
new file mode 100644
index 0000000..f07264b
--- /dev/null
+++ b/resources/themes/Default/Variants/Steel on Green No Names.css
@@ -0,0 +1,2 @@
+@import url("Steel on Green.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Steel on Green.css b/resources/themes/Default/Variants/Steel on Green.css
new file mode 100644
index 0000000..800dc6b
--- /dev/null
+++ b/resources/themes/Default/Variants/Steel on Green.css
@@ -0,0 +1,97 @@
+@import url("../main.css");
+
+/* outgoing */
+
+
+.outgoingItem .timeStamp {
+		color:#a9a9a9;
+}
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/steelIndicator.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tl {
+	background:url("../images/steelCurves.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tr {
+	background:url("../images/steelCurves.png") no-repeat top right;
+}
+
+.outgoingItem .tableBubble .head {
+	background:url("../images/steelCurves.png") no-repeat -10px 0;
+}
+
+.outgoingItem .tableBubble .message {
+	background:url("../images/steelBackground.png") repeat-y top left;
+}
+
+.outgoingItem .tableBubble .messageRight {
+	background:url("../images/steelBackground.png") repeat-y top right;
+}
+
+.outgoingItem .tableBubble .bl {
+	background:url("../images/steelCurves.png") no-repeat bottom left;
+}
+
+.outgoingItem .tableBubble .br {
+	background:url("../images/steelCurves.png") no-repeat bottom right;
+}
+
+.outgoingItem .followUp {
+	background-color:#ececec;
+	border-bottom:1px solid #fff;
+}
+
+
+
+/*incoming */
+
+.incomingItem .timeStamp {
+	color:#9ecf35;
+}
+
+
+.incomingItem .myBubble .indicator {
+	background:url("../images/greenIndicator.png") no-repeat top left;
+}
+
+.incomingItem .timeStamp {
+	color:#9ecf35;
+}
+
+.incomingItem .tableBubble .tl {
+	background:url("../images/greenCurves.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tr {
+	background:url("../images/greenCurves.png") no-repeat top right;
+}
+
+.incomingItem .tableBubble .head {
+	background:url("../images/greenCurves.png") no-repeat -10px 0;
+}
+
+.incomingItem .tableBubble .message {
+	background:url("../images/greenBackground.png") repeat-y top left;
+}
+
+.incomingItem .tableBubble .messageRight {
+	background:url("../images/greenBackground.png") repeat-y top right;
+}
+
+.incomingItem .tableBubble .bl {
+	background:url("../images/greenCurves.png") no-repeat bottom left;
+}
+
+.incomingItem .tableBubble .br {
+	background:url("../images/greenCurves.png") no-repeat bottom right;
+}
+
+.incomingItem .followUp {
+	background-color:#e2efc4;
+	border-bottom:1px solid #fff;
+}
+
+
diff --git a/resources/themes/Default/Variants/Steel on Red Alternating.css b/resources/themes/Default/Variants/Steel on Red Alternating.css
new file mode 100644
index 0000000..64a783b
--- /dev/null
+++ b/resources/themes/Default/Variants/Steel on Red Alternating.css
@@ -0,0 +1,7 @@
+@import url("Steel on Red.css");
+@import url("../alternating.css");
+
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/steelIndicator2.png") no-repeat top left;
+}
diff --git a/resources/themes/Default/Variants/Steel on Red No Names Alt.css b/resources/themes/Default/Variants/Steel on Red No Names Alt.css
new file mode 100644
index 0000000..995f329
--- /dev/null
+++ b/resources/themes/Default/Variants/Steel on Red No Names Alt.css
@@ -0,0 +1,2 @@
+@import url("Steel on Red Alternating.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Steel on Red No Names.css b/resources/themes/Default/Variants/Steel on Red No Names.css
new file mode 100644
index 0000000..b5e622e
--- /dev/null
+++ b/resources/themes/Default/Variants/Steel on Red No Names.css
@@ -0,0 +1,2 @@
+@import url("Steel on Red.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Steel on Red.css b/resources/themes/Default/Variants/Steel on Red.css
new file mode 100644
index 0000000..922c6ef
--- /dev/null
+++ b/resources/themes/Default/Variants/Steel on Red.css
@@ -0,0 +1,89 @@
+@import url("../main.css");
+
+/* outgoing */
+
+
+.outgoingItem .timeStamp {
+		color:#a9a9a9;
+}
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/steelIndicator.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tl {
+	background:url("../images/steelCurves.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tr {
+	background:url("../images/steelCurves.png") no-repeat top right;
+}
+
+.outgoingItem .tableBubble .head {
+	background:url("../images/steelCurves.png") no-repeat -10px 0;
+}
+
+.outgoingItem .tableBubble .message {
+	background:url("../images/steelBackground.png") repeat-y top left;
+}
+
+.outgoingItem .tableBubble .messageRight {
+	background:url("../images/steelBackground.png") repeat-y top right;
+}
+
+.outgoingItem .tableBubble .bl {
+	background:url("../images/steelCurves.png") no-repeat bottom left;
+}
+
+.outgoingItem .tableBubble .br {
+	background:url("../images/steelCurves.png") no-repeat bottom right;
+}
+
+.outgoingItem .followUp {
+	background-color:#ececec;
+	border-bottom:1px solid #fff;
+}
+
+
+/*incoming */
+
+.incomingItem .timeStamp {
+	color:#f88f8f;
+}
+
+.incomingItem .myBubble .indicator {
+	background:url("../images/redIndicator.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tl {
+	background:url("../images/redCurves.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tr {
+	background:url("../images/redCurves.png") no-repeat top right;
+}
+
+.incomingItem .tableBubble .head {
+	background:url("../images/redCurves.png") no-repeat -10px 0;
+}
+
+.incomingItem .tableBubble .message {
+	background:url("../images/redBackground.png") repeat-y top left;
+}
+
+.incomingItem .tableBubble .messageRight {
+	background:url("../images/redBackground.png") repeat-y top right;
+}
+
+.incomingItem .tableBubble .bl {
+	background:url("../images/redCurves.png") no-repeat bottom left;
+}
+
+.incomingItem .tableBubble .br {
+	background:url("../images/redCurves.png") no-repeat bottom right;
+}
+
+.incomingItem .followUp {
+	background-color:#ffdada;
+	border-bottom:1px solid #fff;
+}
diff --git a/resources/themes/Default/Variants/Steel on Yellow Alternating.css b/resources/themes/Default/Variants/Steel on Yellow Alternating.css
new file mode 100644
index 0000000..0249230
--- /dev/null
+++ b/resources/themes/Default/Variants/Steel on Yellow Alternating.css
@@ -0,0 +1,7 @@
+@import url("Steel on Yellow.css");
+@import url("../alternating.css");
+
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/steelIndicator2.png") no-repeat top left;
+}
diff --git a/resources/themes/Default/Variants/Steel on Yellow No Names Alt.css b/resources/themes/Default/Variants/Steel on Yellow No Names Alt.css
new file mode 100644
index 0000000..9ab928c
--- /dev/null
+++ b/resources/themes/Default/Variants/Steel on Yellow No Names Alt.css
@@ -0,0 +1,2 @@
+@import url("Steel on Yellow Alternating.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Steel on Yellow No Names.css b/resources/themes/Default/Variants/Steel on Yellow No Names.css
new file mode 100644
index 0000000..ecf7861
--- /dev/null
+++ b/resources/themes/Default/Variants/Steel on Yellow No Names.css
@@ -0,0 +1,2 @@
+@import url("Steel on Yellow.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Steel on Yellow.css b/resources/themes/Default/Variants/Steel on Yellow.css
new file mode 100644
index 0000000..2d91510
--- /dev/null
+++ b/resources/themes/Default/Variants/Steel on Yellow.css
@@ -0,0 +1,92 @@
+@import url("../main.css");
+
+/* outgoing */
+
+
+.outgoingItem .timeStamp {
+		color:#a9a9a9;
+}
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/steelIndicator.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tl {
+	background:url("../images/steelCurves.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tr {
+	background:url("../images/steelCurves.png") no-repeat top right;
+}
+
+.outgoingItem .tableBubble .head {
+	background:url("../images/steelCurves.png") no-repeat -10px 0;
+}
+
+.outgoingItem .tableBubble .message {
+	background:url("../images/steelBackground.png") repeat-y top left;
+}
+
+.outgoingItem .tableBubble .messageRight {
+	background:url("../images/steelBackground.png") repeat-y top right;
+}
+
+.outgoingItem .tableBubble .bl {
+	background:url("../images/steelCurves.png") no-repeat bottom left;
+}
+
+.outgoingItem .tableBubble .br {
+	background:url("../images/steelCurves.png") no-repeat bottom right;
+}
+
+.outgoingItem .followUp {
+	background-color:#ececec;
+	border-bottom:1px solid #fff;
+}
+
+
+
+/*incoming */
+
+.incomingItem .timeStamp {
+	color:#bdb410;
+}
+
+.incomingItem .myBubble .indicator {
+	background:url("../images/yellowIndicator.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tl {
+	background:url("../images/yellowCurves.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tr {
+	background:url("../images/yellowCurves.png") no-repeat top right;
+}
+
+.incomingItem .tableBubble .head {
+	background:url("../images/yellowCurves.png") no-repeat -10px 0;
+}
+
+.incomingItem .tableBubble .message {
+	background:url("../images/yellowBackground.png") repeat-y top left;
+}
+
+.incomingItem .tableBubble .messageRight {
+	background:url("../images/yellowBackground.png") repeat-y top right;
+}
+
+.incomingItem .tableBubble .bl {
+	background:url("../images/yellowCurves.png") no-repeat bottom left;
+}
+
+.incomingItem .tableBubble .br {
+	background:url("../images/yellowCurves.png") no-repeat bottom right;
+}
+
+.incomingItem .followUp {
+	background-color:#f4f0a7;
+	border-bottom:1px solid #fff;
+}
+
+
diff --git a/resources/themes/Default/Variants/Yellow on Blue Alternating.css b/resources/themes/Default/Variants/Yellow on Blue Alternating.css
new file mode 100644
index 0000000..361856d
--- /dev/null
+++ b/resources/themes/Default/Variants/Yellow on Blue Alternating.css
@@ -0,0 +1,7 @@
+@import url("Yellow on Blue.css");
+@import url("../alternating.css");
+
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/yellowIndicator2.png") no-repeat top left;
+}
diff --git a/resources/themes/Default/Variants/Yellow on Blue No Names Alt.css b/resources/themes/Default/Variants/Yellow on Blue No Names Alt.css
new file mode 100644
index 0000000..2e31a7c
--- /dev/null
+++ b/resources/themes/Default/Variants/Yellow on Blue No Names Alt.css
@@ -0,0 +1,2 @@
+@import url("Yellow on Blue Alternating.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Yellow on Blue No Names.css b/resources/themes/Default/Variants/Yellow on Blue No Names.css
new file mode 100644
index 0000000..808377f
--- /dev/null
+++ b/resources/themes/Default/Variants/Yellow on Blue No Names.css
@@ -0,0 +1,2 @@
+@import url("Yellow on Blue.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Yellow on Blue.css b/resources/themes/Default/Variants/Yellow on Blue.css
new file mode 100644
index 0000000..7e745e9
--- /dev/null
+++ b/resources/themes/Default/Variants/Yellow on Blue.css
@@ -0,0 +1,91 @@
+@import url("../main.css");
+
+/* outgoing */
+
+
+.outgoingItem .timeStamp {
+		color:#bdb410;
+}
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/yellowIndicator.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tl {
+	background:url("../images/yellowCurves.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tr {
+	background:url("../images/yellowCurves.png") no-repeat top right;
+}
+
+.outgoingItem .tableBubble .head {
+	background:url("../images/yellowCurves.png") no-repeat -10px 0;
+}
+
+.outgoingItem .tableBubble .message {
+	background:url("../images/yellowBackground.png") repeat-y top left;
+}
+
+.outgoingItem .tableBubble .messageRight {
+	background:url("../images/yellowBackground.png") repeat-y top right;
+}
+
+.outgoingItem .tableBubble .bl {
+	background:url("../images/yellowCurves.png") no-repeat bottom left;
+}
+
+.outgoingItem .tableBubble .br {
+	background:url("../images/yellowCurves.png") no-repeat bottom right;
+}
+
+.outgoingItem .followUp {
+	background-color:#f4f0a7;
+	border-bottom:1px solid #fff;
+}
+
+
+/*incoming */
+
+.incomingItem .timeStamp {
+	color:#7fc5f8;
+}
+
+.incomingItem .myBubble .indicator {
+	background:url("../images/blueIndicator.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tl {
+	background:url("../images/blueCurves.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tr {
+	background:url("../images/blueCurves.png") no-repeat top right;
+}
+
+.incomingItem .tableBubble .head {
+	background:url("../images/blueCurves.png") no-repeat -10px 0;
+}
+
+.incomingItem .tableBubble .message {
+	background:url("../images/blueBackground.png") repeat-y top left;
+}
+
+.incomingItem .tableBubble .messageRight {
+	background:url("../images/blueBackground.png") repeat-y top right;
+}
+
+.incomingItem .tableBubble .bl {
+	background:url("../images/blueCurves.png") no-repeat bottom left;
+}
+
+.incomingItem .tableBubble .br {
+	background:url("../images/blueCurves.png") no-repeat bottom right;
+}
+
+.incomingItem .followUp {
+	background-color:#ddf0fe;
+	border-bottom:1px solid #fff;
+}
+
+
diff --git a/resources/themes/Default/Variants/Yellow on Green Alternating.css b/resources/themes/Default/Variants/Yellow on Green Alternating.css
new file mode 100644
index 0000000..cb88dfb
--- /dev/null
+++ b/resources/themes/Default/Variants/Yellow on Green Alternating.css
@@ -0,0 +1,7 @@
+@import url("Yellow on Green.css");
+@import url("../alternating.css");
+
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/yellowIndicator2.png") no-repeat top left;
+}
diff --git a/resources/themes/Default/Variants/Yellow on Green No Names Alt.css b/resources/themes/Default/Variants/Yellow on Green No Names Alt.css
new file mode 100644
index 0000000..24fe8ef
--- /dev/null
+++ b/resources/themes/Default/Variants/Yellow on Green No Names Alt.css
@@ -0,0 +1,2 @@
+@import url("Yellow on Green Alternating.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Yellow on Green No Names.css b/resources/themes/Default/Variants/Yellow on Green No Names.css
new file mode 100644
index 0000000..0c7d12b
--- /dev/null
+++ b/resources/themes/Default/Variants/Yellow on Green No Names.css
@@ -0,0 +1,2 @@
+@import url("Yellow on Green.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Yellow on Green.css b/resources/themes/Default/Variants/Yellow on Green.css
new file mode 100644
index 0000000..de4afc6
--- /dev/null
+++ b/resources/themes/Default/Variants/Yellow on Green.css
@@ -0,0 +1,96 @@
+@import url("../main.css");
+
+/* outgoing */
+
+
+.outgoingItem .timeStamp {
+		color:#bdb410;
+}
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/yellowIndicator.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tl {
+	background:url("../images/yellowCurves.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tr {
+	background:url("../images/yellowCurves.png") no-repeat top right;
+}
+
+.outgoingItem .tableBubble .head {
+	background:url("../images/yellowCurves.png") no-repeat -10px 0;
+}
+
+.outgoingItem .tableBubble .message {
+	background:url("../images/yellowBackground.png") repeat-y top left;
+}
+
+.outgoingItem .tableBubble .messageRight {
+	background:url("../images/yellowBackground.png") repeat-y top right;
+}
+
+.outgoingItem .tableBubble .bl {
+	background:url("../images/yellowCurves.png") no-repeat bottom left;
+}
+
+.outgoingItem .tableBubble .br {
+	background:url("../images/yellowCurves.png") no-repeat bottom right;
+}
+
+.outgoingItem .followUp {
+	background-color:#f4f0a7;
+	border-bottom:1px solid #fff;
+}
+
+
+/*incoming */
+
+.incomingItem .timeStamp {
+	color:#9ecf35;
+}
+
+
+.incomingItem .myBubble .indicator {
+	background:url("../images/greenIndicator.png") no-repeat top left;
+}
+
+.incomingItem .timeStamp {
+	color:#9ecf35;
+}
+
+.incomingItem .tableBubble .tl {
+	background:url("../images/greenCurves.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tr {
+	background:url("../images/greenCurves.png") no-repeat top right;
+}
+
+.incomingItem .tableBubble .head {
+	background:url("../images/greenCurves.png") no-repeat -10px 0;
+}
+
+.incomingItem .tableBubble .message {
+	background:url("../images/greenBackground.png") repeat-y top left;
+}
+
+.incomingItem .tableBubble .messageRight {
+	background:url("../images/greenBackground.png") repeat-y top right;
+}
+
+.incomingItem .tableBubble .bl {
+	background:url("../images/greenCurves.png") no-repeat bottom left;
+}
+
+.incomingItem .tableBubble .br {
+	background:url("../images/greenCurves.png") no-repeat bottom right;
+}
+
+.incomingItem .followUp {
+	background-color:#e2efc4;
+	border-bottom:1px solid #fff;
+}
+
+
diff --git a/resources/themes/Default/Variants/Yellow on Red Alternating.css b/resources/themes/Default/Variants/Yellow on Red Alternating.css
new file mode 100644
index 0000000..592b8c4
--- /dev/null
+++ b/resources/themes/Default/Variants/Yellow on Red Alternating.css
@@ -0,0 +1,7 @@
+@import url("Yellow on Red.css");
+@import url("../alternating.css");
+
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/yellowIndicator2.png") no-repeat top left;
+}
diff --git a/resources/themes/Default/Variants/Yellow on Red No Names Alt.css b/resources/themes/Default/Variants/Yellow on Red No Names Alt.css
new file mode 100644
index 0000000..fe464d9
--- /dev/null
+++ b/resources/themes/Default/Variants/Yellow on Red No Names Alt.css
@@ -0,0 +1,2 @@
+@import url("Yellow on Red Alternating.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Yellow on Red No Names.css b/resources/themes/Default/Variants/Yellow on Red No Names.css
new file mode 100644
index 0000000..f35c8a2
--- /dev/null
+++ b/resources/themes/Default/Variants/Yellow on Red No Names.css
@@ -0,0 +1,2 @@
+@import url("Yellow on Red.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Yellow on Red.css b/resources/themes/Default/Variants/Yellow on Red.css
new file mode 100644
index 0000000..f73f0d0
--- /dev/null
+++ b/resources/themes/Default/Variants/Yellow on Red.css
@@ -0,0 +1,91 @@
+@import url("../main.css");
+
+/* outgoing */
+
+
+.outgoingItem .timeStamp {
+		color:#bdb410;
+}
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/yellowIndicator.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tl {
+	background:url("../images/yellowCurves.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tr {
+	background:url("../images/yellowCurves.png") no-repeat top right;
+}
+
+.outgoingItem .tableBubble .head {
+	background:url("../images/yellowCurves.png") no-repeat -10px 0;
+}
+
+.outgoingItem .tableBubble .message {
+	background:url("../images/yellowBackground.png") repeat-y top left;
+}
+
+.outgoingItem .tableBubble .messageRight {
+	background:url("../images/yellowBackground.png") repeat-y top right;
+}
+
+.outgoingItem .tableBubble .bl {
+	background:url("../images/yellowCurves.png") no-repeat bottom left;
+}
+
+.outgoingItem .tableBubble .br {
+	background:url("../images/yellowCurves.png") no-repeat bottom right;
+}
+
+.outgoingItem .followUp {
+	background-color:#f4f0a7;
+	border-bottom:1px solid #fff;
+}
+
+
+/*incoming */
+
+.incomingItem .timeStamp {
+	color:#f88f8f;
+}
+
+.incomingItem .myBubble .indicator {
+	background:url("../images/redIndicator.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tl {
+	background:url("../images/redCurves.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tr {
+	background:url("../images/redCurves.png") no-repeat top right;
+}
+
+.incomingItem .tableBubble .head {
+	background:url("../images/redCurves.png") no-repeat -10px 0;
+}
+
+.incomingItem .tableBubble .message {
+	background:url("../images/redBackground.png") repeat-y top left;
+}
+
+.incomingItem .tableBubble .messageRight {
+	background:url("../images/redBackground.png") repeat-y top right;
+}
+
+.incomingItem .tableBubble .bl {
+	background:url("../images/redCurves.png") no-repeat bottom left;
+}
+
+.incomingItem .tableBubble .br {
+	background:url("../images/redCurves.png") no-repeat bottom right;
+}
+
+.incomingItem .followUp {
+	background-color:#ffdada;
+	border-bottom:1px solid #fff;
+}
+
+
diff --git a/resources/themes/Default/Variants/Yellow on Steel Alternating.css b/resources/themes/Default/Variants/Yellow on Steel Alternating.css
new file mode 100644
index 0000000..a019487
--- /dev/null
+++ b/resources/themes/Default/Variants/Yellow on Steel Alternating.css
@@ -0,0 +1,7 @@
+@import url("Yellow on Steel.css");
+@import url("../alternating.css");
+
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/yellowIndicator2.png") no-repeat top left;
+}
diff --git a/resources/themes/Default/Variants/Yellow on Steel No Names Alt.css b/resources/themes/Default/Variants/Yellow on Steel No Names Alt.css
new file mode 100644
index 0000000..273bcbb
--- /dev/null
+++ b/resources/themes/Default/Variants/Yellow on Steel No Names Alt.css
@@ -0,0 +1,2 @@
+@import url("Yellow on Steel Alternating.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Yellow on Steel No Names.css b/resources/themes/Default/Variants/Yellow on Steel No Names.css
new file mode 100644
index 0000000..1f8d314
--- /dev/null
+++ b/resources/themes/Default/Variants/Yellow on Steel No Names.css
@@ -0,0 +1,2 @@
+@import url("Yellow on Steel.css");
+@import url("../noname.css");
diff --git a/resources/themes/Default/Variants/Yellow on Steel.css b/resources/themes/Default/Variants/Yellow on Steel.css
new file mode 100644
index 0000000..680f0c8
--- /dev/null
+++ b/resources/themes/Default/Variants/Yellow on Steel.css
@@ -0,0 +1,91 @@
+@import url("../main.css");
+
+/* outgoing */
+
+
+.outgoingItem .timeStamp {
+		color:#bdb410;
+}
+
+.outgoingItem .myBubble .indicator {
+	background:url("../images/yellowIndicator.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tl {
+	background:url("../images/yellowCurves.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tr {
+	background:url("../images/yellowCurves.png") no-repeat top right;
+}
+
+.outgoingItem .tableBubble .head {
+	background:url("../images/yellowCurves.png") no-repeat -10px 0;
+}
+
+.outgoingItem .tableBubble .message {
+	background:url("../images/yellowBackground.png") repeat-y top left;
+}
+
+.outgoingItem .tableBubble .messageRight {
+	background:url("../images/yellowBackground.png") repeat-y top right;
+}
+
+.outgoingItem .tableBubble .bl {
+	background:url("../images/yellowCurves.png") no-repeat bottom left;
+}
+
+.outgoingItem .tableBubble .br {
+	background:url("../images/yellowCurves.png") no-repeat bottom right;
+}
+
+.outgoingItem .followUp {
+	background-color:#f4f0a7;
+	border-bottom:1px solid #fff;
+}
+
+
+/*incoming */
+
+.incomingItem .timeStamp {
+	color:#a9a9a9;
+}
+
+.incomingItem .myBubble .indicator {
+	background:url("../images/steelIndicator.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tl {
+	background:url("../images/steelCurves.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tr {
+	background:url("../images/steelCurves.png") no-repeat top right;
+}
+
+.incomingItem .tableBubble .head {
+	background:url("../images/steelCurves.png") no-repeat -10px 0;
+}
+
+.incomingItem .tableBubble .message {
+	background:url("../images/steelBackground.png") repeat-y top left;
+}
+
+.incomingItem .tableBubble .messageRight {
+	background:url("../images/steelBackground.png") repeat-y top right;
+}
+
+.incomingItem .tableBubble .bl {
+	background:url("../images/steelCurves.png") no-repeat bottom left;
+}
+
+.incomingItem .tableBubble .br {
+	background:url("../images/steelCurves.png") no-repeat bottom right;
+}
+
+.incomingItem .followUp {
+	background-color:#ececec;
+	border-bottom:1px solid #fff;
+}
+
+
diff --git a/resources/themes/Default/alternating.css b/resources/themes/Default/alternating.css
new file mode 100644
index 0000000..2b21147
--- /dev/null
+++ b/resources/themes/Default/alternating.css
@@ -0,0 +1,16 @@
+
+.outgoingItem .avatar {
+	float:right;
+}
+
+.outgoingItem .indicator {
+	float:right;
+	position:relative;
+	left:11px;
+	top:8px;
+}
+
+.myBubble {
+	margin-right:40px;
+}
+
diff --git a/resources/themes/Default/images/DummyContact.png b/resources/themes/Default/images/DummyContact.png
new file mode 100755
index 0000000..5149ea5
--- /dev/null
+++ b/resources/themes/Default/images/DummyContact.png
diff --git a/resources/themes/Default/images/alert.png b/resources/themes/Default/images/alert.png
new file mode 100755
index 0000000..ad59ebc
--- /dev/null
+++ b/resources/themes/Default/images/alert.png
diff --git a/resources/themes/Default/images/blueBackground.gif b/resources/themes/Default/images/blueBackground.gif
new file mode 100755
index 0000000..1aad572
--- /dev/null
+++ b/resources/themes/Default/images/blueBackground.gif
diff --git a/resources/themes/Default/images/blueBackground.png b/resources/themes/Default/images/blueBackground.png
new file mode 100644
index 0000000..c3eecf5
--- /dev/null
+++ b/resources/themes/Default/images/blueBackground.png
diff --git a/resources/themes/Default/images/blueCurves.gif b/resources/themes/Default/images/blueCurves.gif
new file mode 100755
index 0000000..90e3823
--- /dev/null
+++ b/resources/themes/Default/images/blueCurves.gif
diff --git a/resources/themes/Default/images/blueCurves.png b/resources/themes/Default/images/blueCurves.png
new file mode 100644
index 0000000..7a6afe1
--- /dev/null
+++ b/resources/themes/Default/images/blueCurves.png
diff --git a/resources/themes/Default/images/blueIndicator.gif b/resources/themes/Default/images/blueIndicator.gif
new file mode 100755
index 0000000..3a1b40a
--- /dev/null
+++ b/resources/themes/Default/images/blueIndicator.gif
diff --git a/resources/themes/Default/images/blueIndicator.png b/resources/themes/Default/images/blueIndicator.png
new file mode 100644
index 0000000..29b65cb
--- /dev/null
+++ b/resources/themes/Default/images/blueIndicator.png
diff --git a/resources/themes/Default/images/blueIndicator2.png b/resources/themes/Default/images/blueIndicator2.png
new file mode 100644
index 0000000..d7c3621
--- /dev/null
+++ b/resources/themes/Default/images/blueIndicator2.png
diff --git a/resources/themes/Default/images/blueIndicatorAlt.gif b/resources/themes/Default/images/blueIndicatorAlt.gif
new file mode 100644
index 0000000..aaacb89
--- /dev/null
+++ b/resources/themes/Default/images/blueIndicatorAlt.gif
diff --git a/resources/themes/Default/images/greenBackground.gif b/resources/themes/Default/images/greenBackground.gif
new file mode 100755
index 0000000..a11a52d
--- /dev/null
+++ b/resources/themes/Default/images/greenBackground.gif
diff --git a/resources/themes/Default/images/greenBackground.png b/resources/themes/Default/images/greenBackground.png
new file mode 100644
index 0000000..dfeb36e
--- /dev/null
+++ b/resources/themes/Default/images/greenBackground.png
diff --git a/resources/themes/Default/images/greenCurves.gif b/resources/themes/Default/images/greenCurves.gif
new file mode 100755
index 0000000..165892a
--- /dev/null
+++ b/resources/themes/Default/images/greenCurves.gif
diff --git a/resources/themes/Default/images/greenCurves.png b/resources/themes/Default/images/greenCurves.png
new file mode 100644
index 0000000..13fae75
--- /dev/null
+++ b/resources/themes/Default/images/greenCurves.png
diff --git a/resources/themes/Default/images/greenIndicator.gif b/resources/themes/Default/images/greenIndicator.gif
new file mode 100755
index 0000000..b6409c7
--- /dev/null
+++ b/resources/themes/Default/images/greenIndicator.gif
diff --git a/resources/themes/Default/images/greenIndicator.png b/resources/themes/Default/images/greenIndicator.png
new file mode 100644
index 0000000..381db82
--- /dev/null
+++ b/resources/themes/Default/images/greenIndicator.png
diff --git a/resources/themes/Default/images/greenIndicator2.png b/resources/themes/Default/images/greenIndicator2.png
new file mode 100644
index 0000000..1dedb31
--- /dev/null
+++ b/resources/themes/Default/images/greenIndicator2.png
diff --git a/resources/themes/Default/images/greenIndicatorAlt.gif b/resources/themes/Default/images/greenIndicatorAlt.gif
new file mode 100644
index 0000000..3ccbc23
--- /dev/null
+++ b/resources/themes/Default/images/greenIndicatorAlt.gif
diff --git a/resources/themes/Default/images/redBackground.gif b/resources/themes/Default/images/redBackground.gif
new file mode 100755
index 0000000..ce1443e
--- /dev/null
+++ b/resources/themes/Default/images/redBackground.gif
diff --git a/resources/themes/Default/images/redBackground.png b/resources/themes/Default/images/redBackground.png
new file mode 100644
index 0000000..bbacbc7
--- /dev/null
+++ b/resources/themes/Default/images/redBackground.png
diff --git a/resources/themes/Default/images/redCurves.gif b/resources/themes/Default/images/redCurves.gif
new file mode 100755
index 0000000..55e496d
--- /dev/null
+++ b/resources/themes/Default/images/redCurves.gif
diff --git a/resources/themes/Default/images/redCurves.png b/resources/themes/Default/images/redCurves.png
new file mode 100644
index 0000000..3e7065a
--- /dev/null
+++ b/resources/themes/Default/images/redCurves.png
diff --git a/resources/themes/Default/images/redIndicator.gif b/resources/themes/Default/images/redIndicator.gif
new file mode 100755
index 0000000..58e189c
--- /dev/null
+++ b/resources/themes/Default/images/redIndicator.gif
diff --git a/resources/themes/Default/images/redIndicator.png b/resources/themes/Default/images/redIndicator.png
new file mode 100644
index 0000000..9c906a9
--- /dev/null
+++ b/resources/themes/Default/images/redIndicator.png
diff --git a/resources/themes/Default/images/redIndicator2.png b/resources/themes/Default/images/redIndicator2.png
new file mode 100644
index 0000000..1f625a0
--- /dev/null
+++ b/resources/themes/Default/images/redIndicator2.png
diff --git a/resources/themes/Default/images/redIndicatorAlt.gif b/resources/themes/Default/images/redIndicatorAlt.gif
new file mode 100644
index 0000000..1f9c4f1
--- /dev/null
+++ b/resources/themes/Default/images/redIndicatorAlt.gif
diff --git a/resources/themes/Default/images/silverBackground.gif b/resources/themes/Default/images/silverBackground.gif
new file mode 100755
index 0000000..b2798a4
--- /dev/null
+++ b/resources/themes/Default/images/silverBackground.gif
diff --git a/resources/themes/Default/images/silverCurves.gif b/resources/themes/Default/images/silverCurves.gif
new file mode 100755
index 0000000..b7bca30
--- /dev/null
+++ b/resources/themes/Default/images/silverCurves.gif
diff --git a/resources/themes/Default/images/steelBackground.gif b/resources/themes/Default/images/steelBackground.gif
new file mode 100755
index 0000000..c292710
--- /dev/null
+++ b/resources/themes/Default/images/steelBackground.gif
diff --git a/resources/themes/Default/images/steelBackground.png b/resources/themes/Default/images/steelBackground.png
new file mode 100644
index 0000000..b1180d3
--- /dev/null
+++ b/resources/themes/Default/images/steelBackground.png
diff --git a/resources/themes/Default/images/steelCurves.gif b/resources/themes/Default/images/steelCurves.gif
new file mode 100755
index 0000000..663c5c3
--- /dev/null
+++ b/resources/themes/Default/images/steelCurves.gif
diff --git a/resources/themes/Default/images/steelCurves.png b/resources/themes/Default/images/steelCurves.png
new file mode 100644
index 0000000..e1ddeb0
--- /dev/null
+++ b/resources/themes/Default/images/steelCurves.png
diff --git a/resources/themes/Default/images/steelHeading.jpg b/resources/themes/Default/images/steelHeading.jpg
new file mode 100755
index 0000000..a319c7e
--- /dev/null
+++ b/resources/themes/Default/images/steelHeading.jpg
diff --git a/resources/themes/Default/images/steelIndicator.gif b/resources/themes/Default/images/steelIndicator.gif
new file mode 100755
index 0000000..0d91eed
--- /dev/null
+++ b/resources/themes/Default/images/steelIndicator.gif
diff --git a/resources/themes/Default/images/steelIndicator.png b/resources/themes/Default/images/steelIndicator.png
new file mode 100644
index 0000000..48a3af5
--- /dev/null
+++ b/resources/themes/Default/images/steelIndicator.png
diff --git a/resources/themes/Default/images/steelIndicator2.png b/resources/themes/Default/images/steelIndicator2.png
new file mode 100644
index 0000000..1a34ac7
--- /dev/null
+++ b/resources/themes/Default/images/steelIndicator2.png
diff --git a/resources/themes/Default/images/steelIndicatorAlt.gif b/resources/themes/Default/images/steelIndicatorAlt.gif
new file mode 100644
index 0000000..5d7686d
--- /dev/null
+++ b/resources/themes/Default/images/steelIndicatorAlt.gif
diff --git a/resources/themes/Default/images/typing-left.png b/resources/themes/Default/images/typing-left.png
new file mode 100755
index 0000000..e5448a5
--- /dev/null
+++ b/resources/themes/Default/images/typing-left.png
diff --git a/resources/themes/Default/images/typing-right.png b/resources/themes/Default/images/typing-right.png
new file mode 100755
index 0000000..1e997d4
--- /dev/null
+++ b/resources/themes/Default/images/typing-right.png
diff --git a/resources/themes/Default/images/yellowBackground.gif b/resources/themes/Default/images/yellowBackground.gif
new file mode 100755
index 0000000..adcdb5d
--- /dev/null
+++ b/resources/themes/Default/images/yellowBackground.gif
diff --git a/resources/themes/Default/images/yellowBackground.png b/resources/themes/Default/images/yellowBackground.png
new file mode 100644
index 0000000..ea79d06
--- /dev/null
+++ b/resources/themes/Default/images/yellowBackground.png
diff --git a/resources/themes/Default/images/yellowCurves.gif b/resources/themes/Default/images/yellowCurves.gif
new file mode 100755
index 0000000..c8bf931
--- /dev/null
+++ b/resources/themes/Default/images/yellowCurves.gif
diff --git a/resources/themes/Default/images/yellowCurves.png b/resources/themes/Default/images/yellowCurves.png
new file mode 100644
index 0000000..b4133ba
--- /dev/null
+++ b/resources/themes/Default/images/yellowCurves.png
diff --git a/resources/themes/Default/images/yellowHeading.jpg b/resources/themes/Default/images/yellowHeading.jpg
new file mode 100755
index 0000000..bd6f049
--- /dev/null
+++ b/resources/themes/Default/images/yellowHeading.jpg
diff --git a/resources/themes/Default/images/yellowIndicator.gif b/resources/themes/Default/images/yellowIndicator.gif
new file mode 100755
index 0000000..537414c
--- /dev/null
+++ b/resources/themes/Default/images/yellowIndicator.gif
diff --git a/resources/themes/Default/images/yellowIndicator.png b/resources/themes/Default/images/yellowIndicator.png
new file mode 100644
index 0000000..bfaf230
--- /dev/null
+++ b/resources/themes/Default/images/yellowIndicator.png
diff --git a/resources/themes/Default/images/yellowIndicator2.png b/resources/themes/Default/images/yellowIndicator2.png
new file mode 100644
index 0000000..c59fe2b
--- /dev/null
+++ b/resources/themes/Default/images/yellowIndicator2.png
diff --git a/resources/themes/Default/images/yellowIndicatorAlt.gif b/resources/themes/Default/images/yellowIndicatorAlt.gif
new file mode 100644
index 0000000..f3cd7b0
--- /dev/null
+++ b/resources/themes/Default/images/yellowIndicatorAlt.gif
diff --git a/resources/themes/Default/images/yellowTL.png b/resources/themes/Default/images/yellowTL.png
new file mode 100644
index 0000000..2bdfa65
--- /dev/null
+++ b/resources/themes/Default/images/yellowTL.png
diff --git a/resources/themes/Default/images/yellowTR.png b/resources/themes/Default/images/yellowTR.png
new file mode 100644
index 0000000..1aff191
--- /dev/null
+++ b/resources/themes/Default/images/yellowTR.png
diff --git a/resources/themes/Default/incoming_icon.png b/resources/themes/Default/incoming_icon.png
new file mode 100755
index 0000000..7080fd6
--- /dev/null
+++ b/resources/themes/Default/incoming_icon.png
diff --git a/resources/themes/Default/main.css b/resources/themes/Default/main.css
new file mode 100755
index 0000000..c2ce2d5
--- /dev/null
+++ b/resources/themes/Default/main.css
@@ -0,0 +1,292 @@
+* {
+		word-wrap: break-word;
+		word-break:break-word;
+}
+
+#header1 { 
+	position: fixed; 
+	top: 0px; 
+	left: 0px; 
+	right: 0px; 
+	margin: 0; 
+	padding: 10px; 
+	overflow: auto; 
+	color: white; 
+	font-family: Lucida Grande; 
+	text-align: center; 
+	font-size: 10px; 
+	font-weight: regular; 
+	background: rgba(0,0,0,.65); 
+	z-index: 999; 
+}
+
+#heading { 
+	position: fixed; 
+	top: 0px; 
+	left: 0px; 
+	margin: 0; 
+	padding: 5px;
+	font-weight: regular; 
+	background-color:#fbfbed;
+	z-index: 999;
+	width:100%;
+	height:45px;
+	border-bottom:2px solid #d5d5d5;
+	background:url("images/steelHeading.jpg") repeat-x top left;
+	
+}
+
+#heading .conversationIncomingIcon {
+	position:absolute;
+	left:5px;
+	top:5px;
+}
+
+#heading .conversationIncomingIcon img {
+	width:48px;
+	height:48px;
+}
+
+#heading .conversationWith {
+	position:relative;
+	left:60px;
+	margin:5px 0 0 0;
+	font: bold 16px Myriad Pro, Myriad, Lucida Grande, Trebuchet MS, Arial;
+	overflow:hide;
+}
+
+#heading .conversationTime {
+	position:relative;
+	left:60px;
+	color:#6d6d6d;
+	font: bold 10px Myriad Pro, Myriad, Lucida Grande, Trebuchet MS, Arial;
+}
+
+body {
+	margin-top: 65px;
+	background-color: white;
+	color: black;
+}
+
+.status_container {
+	font: 10px Myriad, Lucida Grande, Arial;
+}
+
+
+body {
+}
+
+.followUp {
+	clear:right;
+	height:1px;
+	font-size:1px;
+	line-height:1px;
+	margin:4px 0 4px 0;
+}
+
+.chatItem {
+	opacity:0.96;
+}
+
+.tableBubble {
+	width:100%;
+}
+
+.tableBubble .tl {
+	height:8px;
+}
+
+.tableBubble .tr {
+	width:8px;
+	height:8px;
+}
+
+.message {
+	padding:0 1em 0 1.25em;
+	word-wrap: break-word;
+}
+
+.tableBubble .message {
+	font-size:11px;
+}
+
+.tableBubble .message img {
+	vertical-align:middle;
+}
+
+.tableBubble .messageRight {
+	width:1px;
+}
+
+.tableBubble .bl {
+	height:10px;
+}
+
+.tableBubble .br {
+	width:8px;
+	height:10px;
+}
+
+.tableBubble .timeStamp {
+	margin:2px;
+	margin-left:7px;
+	text-align:right;
+	float:right;
+}
+
+.myBubble .indicator {
+	position:absolute;
+	top:8px;
+	left:0;
+	width:13px;
+	height:11px;
+}
+
+.myBubble {
+	position:relative;
+	padding-left:10px;
+	margin-left:33px;
+	margin-right:10px;
+}
+
+.chatItem .avatar {
+	width:26px;
+	height:26px;
+	float:left;
+}
+
+/****** STatus  ******/
+
+.statusMessage {
+	opacity:0.8;
+	color:#676767;
+}
+
+.statusMessage .myBubble .indicator {
+	background:url("images/steelIndicator.png") no-repeat top left;
+}
+
+.statusMessage .tableBubble .tl {
+	background:url("images/steelCurves.png") no-repeat top left;
+}
+
+.statusMessage .tableBubble .tr {
+	background:url("images/steelCurves.png") no-repeat top right;
+}
+
+.statusMessage .tableBubble .head {
+	background:url("images/steelCurves.png") no-repeat -10px 0;
+}
+
+.statusMessage .tableBubble .message {
+	background:url("images/steelBackground.png") repeat-y top left;
+}
+
+.statusMessage .tableBubble .messageRight {
+	background:url("images/steelBackground.png") repeat-y top right;
+}
+
+.statusMessage .tableBubble .bl {
+	background:url("images/steelCurves.png") no-repeat bottom left;
+}
+
+.statusMessage .tableBubble .br {
+	background:url("images/steelCurves.png") no-repeat bottom right;
+}
+
+.statusMessage .followUp {
+	background-color:#f4f0a7;
+	border-bottom:1px solid #fff;
+}
+
+.statusMessage .timeStamp {
+	color:#676767;
+}
+
+
+/*incoming */
+
+.incomingItem .myBubble .indicator {
+	background:url("images/yellowIndicator.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tl {
+	background:url("images/yellowCurves.png") no-repeat top left;
+}
+
+.incomingItem .tableBubble .tr {
+	background:url("images/yellowCurves.png") no-repeat top right;
+}
+
+.incomingItem .tableBubble .head {
+	background:url("images/yellowCurves.png") no-repeat -10px 0;
+}
+
+.incomingItem .tableBubble .message {
+	background:url("images/yellowBackground.png") repeat-y top left;
+}
+
+.incomingItem .tableBubble .messageRight {
+	background:url("images/yellowBackground.png") repeat-y top right;
+}
+
+.incomingItem .tableBubble .bl {
+	background:url("images/yellowCurves.png") no-repeat bottom left;
+}
+
+.incomingItem .tableBubble .br {
+	background:url("images/yellowCurves.png") no-repeat bottom right;
+}
+
+.incomingItem .followUp {
+	background-color:#f4f0a7;
+	border-bottom:1px solid #fff;
+}
+
+.incomingItem .timeStamp {
+	color:#bdb410;
+}
+
+/* outgoing */
+
+
+.outgoingItem .myBubble .indicator {
+	background:url("images/greenIndicator.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tl {
+	background:url("images/greenCurves.png") no-repeat top left;
+}
+
+.outgoingItem .tableBubble .tr {
+	background:url("images/greenCurves.png") no-repeat top right;
+}
+
+.outgoingItem .tableBubble .head {
+	background:url("images/greenCurves.png") no-repeat -10px 0;
+}
+
+.outgoingItem .tableBubble .message {
+	background:url("images/greenBackground.png") repeat-y top left;
+}
+
+.outgoingItem .tableBubble .messageRight {
+	background:url("images/greenBackground.png") repeat-y top right;
+}
+
+.outgoingItem .tableBubble .bl {
+	background:url("images/greenCurves.png") no-repeat bottom left;
+}
+
+.outgoingItem .tableBubble .br {
+	background:url("images/greenCurves.png") no-repeat bottom right;
+}
+
+.outgoingItem .followUp {
+	background-color:#e2efc4;
+	border-bottom:1px solid #fff;
+}
+
+.outgoingItem .timeStamp {
+	color:#9ecf35;
+}
diff --git a/resources/themes/Default/noname.css b/resources/themes/Default/noname.css
new file mode 100644
index 0000000..9d905a9
--- /dev/null
+++ b/resources/themes/Default/noname.css
@@ -0,0 +1,3 @@
+.name {
+	display:none;
+}
diff --git a/resources/themes/Default/outgoing_icon.png b/resources/themes/Default/outgoing_icon.png
new file mode 100755
index 0000000..7080fd6
--- /dev/null
+++ b/resources/themes/Default/outgoing_icon.png