diff --git a/static/mailman_django/css/basics.css b/static/mailman_django/css/basics.css
new file mode 100644
index 0000000..2e7147d
--- /dev/null
+++ b/static/mailman_django/css/basics.css
@@ -0,0 +1,33 @@
+/** 
+Colors:
+
+grey:       #727682
+
+light_blue  #cfdcec → rgba(207, 220, 236, 0.6)
+blue        #186aaf → rgba(24, 106, 175, 1)
+dark_blue   #40486f
+
+**/
+
+body {
+    color:#40486f;
+}
+
+div#logo {
+    height:153px;
+    width:244px;
+    background-image: url("./logo2010.png");
+    background-repeat: no-repeat;
+}
+
+h1,h2,h3,h4,h5,h6 {
+    color:#727682;
+    font-family:Trebuchet, Helvetica;
+}
+
+ul {
+    list-style-type:none;
+}
+#content ul {
+    list-style-type:disc;
+}
diff --git a/static/mailman_django/css/left_tab.css b/static/mailman_django/css/left_tab.css
new file mode 100644
index 0000000..fb1fa5e
--- /dev/null
+++ b/static/mailman_django/css/left_tab.css
@@ -0,0 +1,15 @@
+/** Optional CSS to use the site with Tabbed navigaiton on the left-side**/
+
+#menu {
+    width:20%;
+    float:left;
+}
+
+#content{
+    width:80%;
+    float:left;
+}
+
+#menu ul ul{
+    display:none;
+}
diff --git a/static/mailman_django/css/mega_dropdown.css b/static/mailman_django/css/mega_dropdown.css
new file mode 100644
index 0000000..293b3d0
--- /dev/null
+++ b/static/mailman_django/css/mega_dropdown.css
@@ -0,0 +1,78 @@
+/** Optional CSS for use with Mega dropdown**/
+
+/** List entry spacers **/
+div.menu {
+    padding-top:10px;
+    padding-bottom:30px;
+}
+/**  ----  1st Level Navigation  ----  **/
+div.menu > ul {
+    padding-left:0px;
+}
+div.menu > ul > li {
+    float:left;
+    padding: 0px 5px 0px 5px;
+    font-weight:bold;
+    margin:1px 1px 0px 1px; /** instead of border **/
+}
+/**  ----  2nd Level Navigation  ----  **/
+div.menu ul > li > div > ul {
+    max-width: 600px;
+    padding-left:10px;
+    padding-right:10px;
+}
+div.menu > ul > li > div { 
+    /** Blue transparent Background**/
+    background-color:rgba(207, 220, 236, 0.6);
+    margin-left:-6px;
+    border: 1px solid rgba(24, 106, 175, 0.6);
+    border-top:none;
+    /** hiding the part - hover actions below **/
+    position:absolute;
+    left:-10000; 
+    visibility:hidden;
+}
+div.menu > ul > li > div > ul { 
+    /** White Background**/
+    display:inline-block;
+    background-color:white;
+    border-radius: 2px; 
+    margin:10px;
+}
+div.menu ul > li > div > ul > li {
+    position:relative;
+    float:none;
+    clear:both;
+    padding: 5px 0px 5px 0px;
+}
+/** ---- 3rd Level Navigation ---- **/
+div.menu ul > li > div > ul > li > div > ul > li{
+    float:left;
+    clear:none;
+    padding: 0px 5px 0px 5px;
+    font-weight:normal;
+}
+
+/** Hover TopLevel Navigation entry**/
+div.menu > ul > li:hover{
+    background-color:rgba(207, 220, 236, 0.6);
+    margin:0;
+    border: 1px solid rgba(24, 106, 175, 0.6);
+    border-bottom:none;
+    border-top-left-radius: 2px;
+    border-top-right-radius: 2px;
+}
+div.menu > ul > li:hover > div{
+    left:auto;
+    visibility:visible;
+    border-bottom-left-radius: 2px;
+    border-bottom-right-radius: 2px;
+    border-top-right-radius: 2px;    
+}
+
+/**  Content Layout **/
+
+div#content {
+    clear:both;
+}
+