fcid 0.0.1 → 0.0.2

data/app/assets/javascripts/fcid.js

@@ -0,0 +1,14 @@
+var Fcid = function() {
+  this.init = function() {
+    this.init_css();
+  }
+
+  this.init_css = function() {
+    jQuery('#container').corner("10px");
+    jQuery('.round-corner-5').corner("5px");
+    jQuery('.round-corner-10').corner("10px");
+  }
+}
+
+var fcid = new Fcid();
+jQuery(function(){ fcid.init() });

data/app/assets/javascripts/jquery.corner.js

@@ -0,0 +1,152 @@
+/*
+ * jQuery corner plugin
+ *
+ * version 1.7 (1/26/2007)
+ *
+ * Dual licensed under the MIT and GPL licenses:
+ *   http://www.opensource.org/licenses/mit-license.php
+ *   http://www.gnu.org/licenses/gpl.html
+ */
+
+/**
+ * The corner() method provides a simple way of styling DOM elements.  
+ *
+ * corner() takes a single string argument:  $().corner("effect corners width")
+ *
+ *   effect:  The name of the effect to apply, such as round or bevel. 
+ *            If you don't specify an effect, rounding is used.
+ *
+ *   corners: The corners can be one or more of top, bottom, tr, tl, br, or bl. 
+ *            By default, all four corners are adorned. 
+ *
+ *   width:   The width specifies the width of the effect; in the case of rounded corners this 
+ *            will be the radius of the width. 
+ *            Specify this value using the px suffix such as 10px, and yes it must be pixels.
+ *
+ * For more details see: http://methvin.com/jquery/jq-corner.html
+ * For a full demo see:  http://malsup.com/jquery/corner/
+ *
+ *
+ * @example $('.adorn').corner();
+ * @desc Create round, 10px corners 
+ *
+ * @example $('.adorn').corner("25px");
+ * @desc Create round, 25px corners 
+ *
+ * @example $('.adorn').corner("notch bottom");
+ * @desc Create notched, 10px corners on bottom only
+ *
+ * @example $('.adorn').corner("tr dog 25px");
+ * @desc Create dogeared, 25px corner on the top-right corner only
+ *
+ * @example $('.adorn').corner("round 8px").parent().css('padding', '4px').corner("round 10px");
+ * @desc Create a rounded border effect by styling both the element and its parent
+ * 
+ * @name corner
+ * @type jQuery
+ * @param String options Options which control the corner style
+ * @cat Plugins/Corner
+ * @return jQuery
+ * @author Dave Methvin (dave.methvin@gmail.com)
+ * @author Mike Alsup (malsup@gmail.com)
+ */
+jQuery.fn.corner = function(o) {
+    function hex2(s) {
+        var s = parseInt(s).toString(16);
+        return ( s.length < 2 ) ? '0'+s : s;
+    };
+    function gpc(node) {
+        for ( ; node && node.nodeName.toLowerCase() != 'html'; node = node.parentNode  ) {
+            var v = jQuery.css(node,'backgroundColor');
+            if ( v.indexOf('rgb') >= 0 ) { 
+                rgb = v.match(/\d+/g); 
+                return '#'+ hex2(rgb[0]) + hex2(rgb[1]) + hex2(rgb[2]);
+            }
+            if ( v && v != 'transparent' )
+                return v;
+        }
+        return '#ffffff';
+    };
+    function getW(i) {
+        switch(fx) {
+        case 'round':  return Math.round(width*(1-Math.cos(Math.asin(i/width))));
+        case 'cool':   return Math.round(width*(1+Math.cos(Math.asin(i/width))));
+        case 'sharp':  return Math.round(width*(1-Math.cos(Math.acos(i/width))));
+        case 'bite':   return Math.round(width*(Math.cos(Math.asin((width-i-1)/width))));
+        case 'slide':  return Math.round(width*(Math.atan2(i,width/i)));
+        case 'jut':    return Math.round(width*(Math.atan2(width,(width-i-1))));
+        case 'curl':   return Math.round(width*(Math.atan(i)));
+        case 'tear':   return Math.round(width*(Math.cos(i)));
+        case 'wicked': return Math.round(width*(Math.tan(i)));
+        case 'long':   return Math.round(width*(Math.sqrt(i)));
+        case 'sculpt': return Math.round(width*(Math.log((width-i-1),width)));
+        case 'dog':    return (i&1) ? (i+1) : width;
+        case 'dog2':   return (i&2) ? (i+1) : width;
+        case 'dog3':   return (i&3) ? (i+1) : width;
+        case 'fray':   return (i%2)*width;
+        case 'notch':  return width; 
+        case 'bevel':  return i+1;
+        }
+    };
+    o = (o||"").toLowerCase();
+    var keep = /keep/.test(o);                       // keep borders?
+    var cc = ((o.match(/cc:(#[0-9a-f]+)/)||[])[1]);  // corner color
+    var sc = ((o.match(/sc:(#[0-9a-f]+)/)||[])[1]);  // strip color
+    var width = parseInt((o.match(/(\d+)px/)||[])[1]) || 10; // corner width
+    var re = /round|bevel|notch|bite|cool|sharp|slide|jut|curl|tear|fray|wicked|sculpt|long|dog3|dog2|dog/;
+    var fx = ((o.match(re)||['round'])[0]);
+    var edges = { T:0, B:1 };
+    var opts = {
+        TL:  /top|tl/.test(o),       TR:  /top|tr/.test(o),
+        BL:  /bottom|bl/.test(o),    BR:  /bottom|br/.test(o)
+    };
+    if ( !opts.TL && !opts.TR && !opts.BL && !opts.BR )
+        opts = { TL:1, TR:1, BL:1, BR:1 };
+    var strip = document.createElement('div');
+    strip.style.overflow = 'hidden';
+    strip.style.height = '1px';
+    strip.style.backgroundColor = sc || 'transparent';
+    strip.style.borderStyle = 'solid';
+    return this.each(function(index){
+        var pad = {
+            T: parseInt(jQuery.css(this,'paddingTop'))||0,     R: parseInt(jQuery.css(this,'paddingRight'))||0,
+            B: parseInt(jQuery.css(this,'paddingBottom'))||0,  L: parseInt(jQuery.css(this,'paddingLeft'))||0
+        };
+
+        if (jQuery.browser.msie) this.style.zoom = 1; // force 'hasLayout' in IE
+        if (!keep) this.style.border = 'none';
+        strip.style.borderColor = cc || gpc(this.parentNode);
+        var cssHeight = jQuery.curCSS(this, 'height');
+
+        for (var j in edges) {
+            var bot = edges[j];
+            strip.style.borderStyle = 'none '+(opts[j+'R']?'solid':'none')+' none '+(opts[j+'L']?'solid':'none');
+            var d = document.createElement('div');
+            var ds = d.style;
+
+            bot ? this.appendChild(d) : this.insertBefore(d, this.firstChild);
+
+            if (bot && cssHeight != 'auto') {
+                if (jQuery.css(this,'position') == 'static')
+                    this.style.position = 'relative';
+                ds.position = 'absolute';
+                ds.bottom = ds.left = ds.padding = ds.margin = '0';
+                if (jQuery.browser.msie)
+                    ds.setExpression('width', 'this.parentNode.offsetWidth');
+                else
+                    ds.width = '100%';
+            }
+            else {
+                ds.margin = !bot ? '-'+pad.T+'px -'+pad.R+'px '+(pad.T-width)+'px -'+pad.L+'px' : 
+                                    (pad.B-width)+'px -'+pad.R+'px -'+pad.B+'px -'+pad.L+'px';                
+            }
+
+            for (var i=0; i < width; i++) {
+                var w = Math.max(0,getW(i));
+                var e = strip.cloneNode(false);
+                e.style.borderWidth = '0 '+(opts[j+'R']?w:0)+'px 0 '+(opts[j+'L']?w:0)+'px';
+                bot ? d.appendChild(e) : d.insertBefore(e, d.firstChild);
+            }
+        }
+    });
+};

data/app/assets/stylesheets/fcid/admin.css

@@ -0,0 +1,3 @@
+body {
+  background-color:#eef;
+}

data/app/assets/stylesheets/fcid/application.css

@@ -0,0 +1,30 @@
+#footer .info {
+  width:30%;
+  padding:10px;
+  float:left;
+}
+
+
+.inner {
+  padding:10px;
+}
+
+label {
+  display:block;
+}
+
+
+.column-1 {
+}
+
+
+.state-pending,
+.state-delete,
+.state-forbid
+{
+  color:red;
+}
+
+.state-active {
+  color:green;
+}

data/app/assets/stylesheets/fcid/apps.css

@@ -0,0 +1,74 @@
+#app-list {
+}
+
+#app-list ul {
+}
+
+#app-list ul li {
+  line-height:20px;
+  padding:2px;
+  border-bottom:1px solid #D8DFEA;
+}
+
+#app-list ul li span {
+  display:inline;
+  float:right;
+}
+
+
+#app-list ul li a {
+  padding-left:20px;
+}
+
+#app-list ul li span a{
+  display:inline;
+  padding:0px;
+  color:#777;
+}
+
+#app-list .app-list-journal,.feed-journal a {
+  background:url(/images/newsfeed/blog.gif) left no-repeat;
+}
+
+#app-list .app-list-group,.feed-group a  {
+  background:url(/images/newsfeed/group.gif) left no-repeat;
+}
+
+#app-list .app-list-album,.feed-album a,.feed-photo a  {
+  background:url(/images/newsfeed/photo.gif) left no-repeat;
+}
+
+#app-list .app-list-gift,.feed-gift a  {
+  background:url(/images/newsfeed/gift.gif) left no-repeat;
+}
+
+#app-list .app-list-share,.feed-share a  {
+  background:url(/images/newsfeed/share.gif) left no-repeat;
+}
+
+#app-list .app-list-events,.feed-event a  {
+  background:url(/images/newsfeed/acts.gif) left no-repeat;
+}
+
+#app-list .app-list-class,.feed-class a  {
+  background:url(/images/newsfeed/class.gif) left no-repeat;
+}
+
+#app-list .app-list-course,.feed-course a  {
+  background:url(/images/newsfeed/course.gif) left no-repeat;
+}
+
+.feed-profile a {
+  background:url(/images/newsfeed/profile.gif) left no-repeat;
+}
+
+.feed-network a {
+  background:url(/images/newsfeed/network.gif) left no-repeat;
+}
+
+.feed-all a {
+  background:url(/images/newsfeed/arrow.gif) left no-repeat;
+}
+
+
+

data/app/assets/stylesheets/fcid/base.css

@@ -0,0 +1,151 @@
+/* base element */
+
+
+* {
+  padding:0px;
+  margin:0px;
+  font-size:13px;
+  font-weight:normal;
+  font-family:  "lucida grande",tahoma,verdana,arial,sans-serif;
+  line-height:1.4em;
+}
+
+p {
+  padding:2px;
+  margin-bottom:8px;
+}
+
+li {
+  list-style:none;
+}
+
+body {
+ /* background: transparent url(/images/page-header-background.gif) 50% 0 repeat-x;*/
+}
+
+body {
+  background-color: #3B5998;
+}
+
+a {
+  color: #3B5998;
+  text-decoration:none;
+}
+
+/* clear */
+.clear:after {
+  content:".";
+  display:block;
+  height:0px;
+  clear:both;
+  visibility:hidden;
+}
+
+.clear {
+  display:inline-block;
+}
+
+.clear {
+  display:block;
+}
+
+/* links */
+a {
+  color:#0000ff;
+  text-decoration:underline;
+}
+
+a:hover {
+}
+
+a:active {
+}
+
+a:visited {
+}
+
+a img {
+  border:none;
+}
+
+a:hover img {
+  /*border-bottom:1px solid #aaa;*/
+}
+
+/* shortcuts */
+
+.hidden {
+  display:none;
+}
+
+.highlight {
+  background-color:#FFF8CC;
+  border-bottom:1px solid #FFE222;
+  color:#000;
+  display:inline;
+}
+
+.p40 {
+  padding:40px;
+}
+
+.inner {
+  padding:10px;
+}
+
+.text-center {
+  text-align:center;
+}
+
+.text-left , .text-left p {
+  text-align:left;
+}
+
+.text-right {
+  text-align:right;
+}
+
+.center {
+  margin-left:auto;
+  margin-right:auto;
+}
+
+.bold,.strong,.strong a,.bold a {
+  font-weight:bold;
+}
+
+.empty {
+  padding:40px!important;
+  text-align:center;
+}
+
+.italic {
+  font-style:italic;
+}
+
+.left {
+  float:left;
+}
+
+.right {
+  float:right;
+}
+
+dl.object-fields {
+}
+
+dl.object-fields dt {
+  float:left;
+  width:120px;
+  line-height:20px;
+}
+
+dl.object-fields dd {
+  width:300px;
+  line-height:20px;
+}
+
+input[type=text],
+input[type=password]{
+  width:200px;
+}

data/app/assets/stylesheets/fcid/base_xiaonei.css

@@ -0,0 +1,1678 @@
+* { margin:0; padding:0;}
+body { padding: 5px 0; color:#333; font-family:'lucida grande',tahoma,helvetica,"宋体",arial,'bitstream vera sans',sans-serif; font-size:12px;}
+h1, h2, h3, h4, h5, h6 { font-size:1.0em;}
+q:before,q:after{content:'';}
+table { width:100%; border-collapse:collapse; overflow:hidden;}
+td { vertical-align:top;}
+a { color:#3B5888; text-decoration:none;}
+a:hover { color:#3B5888; text-decoration:underline;}
+img { border:0;}
+
+.marginbottom10{margin:0; margin-bottom:10px;}
+
+/* Miscellaneous */
+.pipe { padding:0 3px; color:#AAA; font-size:11px;}
+.hyphen {padding:0 5px; font-size:14px;}
+.text, .content { word-break:break-all;word-wrap:break-word}
+.discription { color:#808080;}
+cite { font-style:normal;}
+.rank { padding:0 3px;}
+.hey { margin:0 2px; padding:0 2px; border-bottom:1px solid #ffe222; background:#fffbe2; color:#000;}
+pre {
+    white-space: pre-wrap;       /* css-3 */
+    white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
+    white-space: -pre-wrap;      /* Opera 4-6 */
+    white-space: -o-pre-wrap;    /* Opera 7 */
+    word-break: break-all;
+    word-wrap: break-word;       /* Internet Explorer 5.5+ */
+}
+/* styling for the links */
+a.sudo { color:#dc5173;}
+a.sudo:hover { background:#dc5173;}
+ul.actions {list-style:none;}
+ul.actions li {
+	line-height:1.5em;
+	text-indent:0.5em;
+	border-bottom: 1px solid #D8DFEA;
+}
+ul.actions a { display:block; width:100px; text-decoration:none;}
+ul.actions a:hover { background:#3B5888; color:#fff; text-decoration:none;}
+/* styling for the icons with link */
+a.photoicon img { padding:2px; border:1px solid #d8dfea; background:#fff;}
+a.photoicon:hover img { border-color:#3B5888; background:#d8dfea;}
+a.albumicon img { padding:4px; border:1px solid #d8dfea; background:#fff;}
+a.albumicon:hover img { border-color:#3B5888; background:#d8dfea;}
+/* styling for the tables with user icons */
+.personInfo { overflow:hidden; width:91px; text-align:center; vertical-align:bottom;}
+.personIcon { width:52px; margin:0 auto; overflow:hidden;}
+.personIcon td { width:52px; text-align:center;}
+.personName { padding:5px 0 2px; text-align:center; line-height:15px; overflow:hidden;}
+.personName a { display:block; white-space:nowrap;}
+/* styling for the promoes */
+#huge-ad {width:658px; height:280px;}
+.xp-h, .xp-w, .xp-n, .xp-n2, .xp-n3 { position:relative; overflow:hidden;}
+.xp-h { width:628px; height:280px;}
+.xp-w { width:628px; height:60px;}
+.xp-n { width:120px; height:280px;}
+.xp-n2 { width:120px; height:60px;}
+.xp-n3 { width:200px; height:300px;}
+.ads-mt { width:500px; height:300px; margin:0 60px 25px;}
+#header .xp-w { position:absolute; left:132px; top:25px;}
+#sidebar .xp-n2, #adbar .xp-n2 { margin:10px 0;}
+#sidebar #p44, #adbar #p44 { margin:5px 0; display:block;}
+/* styling for notice boxs */
+.attention, .warning, .success, .none, .messages_div, .errors_div { margin:10px; padding:10px; border:1px solid; text-align:center; line-height:20px;}
+.stdcontainer .attention, .stdcontainer .warning, .stdcontainer .success, .stdcontainer .none, .stdcontainer .messages_div, .stdcontainer .errors_div { margin:10px 0;}
+.gnrcontainer .attention, .gnrcontainer .warning, .gnrcontainer .success, .gnrcontainer .none, .gnrcontainer .messages_div, .gnrcontainer .errors_div { margin:10px 0;}
+.attention { border-color:#ffe222; background:#fffbe2;}
+.attention strong { font-size:1.2em;}
+.warning { border-color:#dd3c10; background:#ffebe8;}
+.success { border-color:#3B5888; background:#f7f7f7;}
+.none { border-color:#d8dfea; background:#fff;}
+.messages_div { border-color:#ffe222; background:#fffbe2;}
+.errors_div	{ border-color:#dd3c10; background:#ffebe8;}
+.updated {background:#FFF8CC;border-bottom:1px solid #FFE222;}
+/* End of Miscellaneous */
+
+/* Form Elements */
+.stdcontainer form { margin-top:10px; margin-bottom:10px;}
+.subcontainer form { margin:0; background:#FFF; padding:20px}
+form#basicInfoForm h4 { margin:5px 60px; padding-left:20px; border-bottom:1px solid #d8dfea; color:#3B5888; font-size:12px; text-align:left; line-height:20px;}
+form .notes { margin:10px 0; padding:10px; border:1px solid #d8dfea; background:#fff; text-align:center; line-height:24px;}
+form .notes h4 { margin:5px 60px; padding-left:20px; border-bottom:1px solid #d8dfea; color:#3B5888; font-size:12px; text-align:left; line-height:20px;}
+form .notes p, form .notes ol, form .notes ul { margin:0 60px; padding-left:20px; text-align:left; line-height:24px;}
+form .notes em { font-style:normal; color:#dd3c10;}
+form .notes span.url { margin-left:15px;}
+form .hint em { font-style:normal; color:#dd3c10;}
+
+form .required, form .optional { clear:both; padding:2px 0; line-height:24px;overflow:hidden;zoom:1}
+form .required h4, form .optional h4 { margin:5px 80px 5px 150px; padding-left:10px; border-bottom:1px solid #d8dfea; color:#3B5888; font-size:12px; line-height:20px;}
+form .required h4, form .optional h4, form .required p, form .optional p { margin:5px 80px 5px 150px; padding-left:10px;}
+form .required label, form .optional label,.bindmsn label { float:left; width:150px; margin:0 10px 0 0; color:#808080; font-weight:bold; text-align:right;}
+form .required .labelCheckbox, form .optional .labelCheckbox { display:block; float:none; width:auto; margin:0 0 0 160px; color:#000; font-weight:normal; text-align:left;}
+form .required .labelCheckbox input, form .optional .labelCheckbox input { margin-right:10px;}
+form .required em, form .optional em { padding:0 2px; font-style:normal;}
+form .actions { margin:10px 0;text-align:center;}
+form .required .labelRadio, form .optional .labelRadio { display:block; float:none; width:auto; margin:0; padding-left:160px; color:#000; font-weight:normal; text-align:left;}
+form .wide textarea { width:350px; margin-left:160px;}
+form .required .labelRadio input, form .optional .labelRadio input { margin-right:10px;}
+.wideform .wide { text-align:center;}
+.wideform .wide textarea { width:500px; margin:0;}
+.wideform .actions { padding:0; text-align:center;}
+.wideform .actions a { margin:0 50px;}
+.narrowform .wide label { display:block; float:none; width:100%; margin:0; color:#000; text-align:left;}
+.narrowform .actions { padding:0; text-align:left;}
+
+input {font-size:12px;}
+textarea, select { background:#fff; font-size:12px;}
+input.inputtext:focus, textarea:focus, select:focus { background:#fcfcfc;}
+input.validate-code {width:4em !important;float:left;}
+.validate-num {float:left;margin:2px 0 0 4px;}
+textarea { overflow:auto; padding:2px; border:1px solid #bdc7d8;}
+select { height:21px; padding:2px; border:1px solid #bdc7d8;}
+.inputtext { padding:2px; border:1px solid #bdc7d8;}
+.inputfile { padding:2px}
+.inputtext.error {border:1px solid red;text-align:left !important;}
+.inputbutton, .inputsubmit, .subbutton, .canbutton, .button-group button { height:24px; font-size:12px; padding:3px 15px; border:1px solid; border-color:#d8dfea #0e1f5b #0e1f5b #d8dfea; background:#3B5888; color:#fff; line-height:16px; cursor:pointer; text-align:center;}
+* html .inputbutton, * html .inputsubmit, * html .subbutton, * html .canbutton, * html .button-group button {padding:3px 6px}
+*+html .inputbutton, *+html .inputsubmit, *+html .subbutton, *+html .canbutton, *+html .button-group button {padding:3px 6px}
+input.gray { border:1px solid; border-color:#fff #848484 #848484 #fff; background:#f0f0f0; color:#333;}
+a.subbutton { display:inline-block; height:16px; padding:3px 10px;}
+a.subbutton:hover { color:#fff; text-decoration:none;}
+
+input#highSchool { padding-right:15px; background:#fff url(/images/act_select.gif) 100% 100% no-repeat;}
+
+/* New Form Elements */
+form {
+    color: #333;
+}
+form fieldset {
+    border: none;
+}
+
+.white form fieldset label.empty {
+    color: #FFF;
+}
+
+.gray form fieldset label.empty {
+    color: #F7F7F7;
+}
+
+form p.submit-container {
+    text-align: center;
+    padding: 10px 0;
+}
+
+form p.submit-container input {
+    width: 8.0em;
+}
+
+form p .labelRadio, form p .labelCheckbox {
+    text-align: left !important;
+    float: none !important;
+    font-weight: normal !important;
+    color: #333 !important;
+}
+
+form p .labelRadio input, form p .labelCheckbox input {
+    margin-right: 5px !important;
+}
+
+/* confirmation */
+.confirmation { margin:10px 30px; padding:1px; border:10px solid #d8dfea; background:#3B5888;}
+.confirmation form { padding:20px; background:#fff;}
+.confirmation h3 { border-bottom:1px solid #d8dfea; color:#3B5888;}
+.confirmation p { margin:5px 0;}
+.confirmation .operation { text-align:right;}
+
+/* Structure */
+#container {position: relative; width:1000px; margin:0 auto; text-align:left;}
+#content {clear:both;border-left:1px solid #B7B7B7; border-right:1px solid #B7B7B7; border-bottom:1px solid #3B5888;}
+#content:after {
+	content:".";
+	display:block;
+	height:0;
+	clear:both;
+	visibility:hidden;
+}
+#content {
+	display:inline-block;
+}
+/* Hide from IE Mac */
+#content {display:block;}
+/* End hide from IE Mac */
+
+
+#grouppage #content {padding-top:10px;}
+/* Header */
+#header {
+    background: url(/images/header.gif) no-repeat 0 0;
+    position: relative;
+	height: 8px;
+}
+
+/* Header - Logo */
+#header #logo {position:absolute;background:#3B5888;bottom:-45px;}
+#header #logo a { background:transparent;}
+
+/* Header - Tagline */
+#header #tagline { position:absolute; left:132px; top:0; width:628px; height:24px; background:#3B5888 url(/images/hl.gif) 0 0 no-repeat; color:#fff; font-size:14px; text-indent:15px; line-height:24px;}
+#header #tagline a { color:#fff; text-decoration:none;}
+
+/* Header - Utility */
+#utility { position:relative; background:#5D74A2; border-right: 1px solid #B7B7B7; z-index:101; float:right; height:29px; padding-right:10px; margin-left: -5px; color:#d8dfea; text-align:right; line-height:28px;}
+#utility a { padding:0 5px; color:#d8dfea; text-decoration:none;}
+#utility a:hover { color:#fff; text-decoration:underline;}
+#utility .pipe { display:none;}
+.paopao {background:url(http://static.xiaonei.com/img/paopao.gif) no-repeat 0 2px; padding-left:15px !important;}
+.paopao span {font-size:10px;}
+/* End of Header */
+
+/* Sidebar */
+#sidebar { float:left; margin-top: 44px; width:139px;}
+#welcomepage #sidebar, #infopage #sidebar {background:none; border:none;}
+#welcomepage #content {border-left:none;border-bottom:none;}
+#welcomepage #banner {
+    border-bottom: 1px solid #3B5888;
+    border-left: 1px solid #B7B7B7 !important;
+    border-right: none;
+    padding-left:0;
+    background:none;}
+* html #welcomepage #banner {
+    border-left: 3px solid #B7B7B7 !important; }
+#loginpanel h3, #mymenu h3 { display:none;}
+#welcomepage #huge-ad {padding-left:1px;background:url(/images/huge_ad_bg.gif) no-repeat 0 0 }
+#welcomepage #huge-ad img {display: block;}
+#welcomepage .box {margin-bottom:0;padding-bottom:10px;border-left:1px solid #B7B7B7;width:628px;}
+
+
+/* Widebar */
+#widebar {
+    float: right;
+    position: relative;
+    width: 860px;
+    border: 1px solid #E5E5E5;
+    border-width: 0 1px 1px 0;
+    background: #FFF;
+}
+
+#banner {
+    border-right: 1px solid #B8B8B8;
+    padding-left: 1px;
+    background: url(/images/banner_bg.gif) no-repeat 0 0;
+    height: 60px;
+	overflow:hidden;
+}
+#banner img {
+    display: block;
+}
+#adbar {
+    clear: left;
+    float: left;
+	background: #F0F0F0;
+	padding: 0 5px;
+	border-top: 10px solid #FFF;
+}
+/* Sidebar - Login Panel */
+#loginForm p { margin:10px 0; line-height:20px;}
+#loginForm p.top {margin:0;padding-top:10px;}
+	#loginForm label { display:block; color:#808080; font-weight:bold; line-height:20px;}
+	#loginForm .labelCheckbox { font-weight:normal; color:#333;}
+	#loginForm .labelCheckbox input { margin-right:5px;}
+#loginForm .inputtext { width:114px;}
+
+#loginpanel .portal { position:relative; display:block; margin:10px 5px 10px 0; padding:5px 0 5px 18px; border:1px solid #ccc; border-width:1px 0; background:#f7f7f7 url(/images/style_triangle.gif) 8px 10px no-repeat; color:#666;}
+#loginpanel .portal:hover { border-color:#3B5888; background-color:#d8dfea; color:#333; text-decoration:none;}
+#loginpanel .portal strong { display:block; color:#333;}
+#loginpanel .portal:hover strong { color:#000;}
+#loginpanel #loginForm {
+    background: #F7F7F7;
+    border-bottom: 1px solid #DDDDDD;
+    padding-left: 10px;
+    padding-top: -10px;
+    position: relative;
+}
+
+#loginpanel #loginForm #email, #loginpanel #loginForm #password {
+    width:114px;
+}
+
+#welcome {background: #F7F7F7; position: relative; border-bottom: 1px solid #DDD; padding-bottom: 5px;}
+#welcome dt { padding:10px 5px 5px; color:#333; font-weight:bold; font-size:12px;}
+#welcome dd { margin:3px 0; padding:0 10px 0 20px; background:url(/images/style_square.gif) 8px 5px no-repeat; color:#666; line-height:14px;}
+#infopage #welcome {background:#FFF;border-bottom:0;padding-bottom:0}
+/* highlight */
+#myclass a span { padding:0 5px; font-size:9px; font-family:Tahoma, sans-serif;}
+
+/* Sidebar - Hot Links */
+#sidebar .block, #adbar .block { width:118px; margin:5px 0; background: #F9F9F9; padding-bottom:5px; border:1px solid #D8DFEA; border-color:#D8DFEA #D8DFEA #3B5888; overflow:hidden;}
+#sidebar .block h3, #adbar .block h3 { padding:2px 5px; color:#808080; font-size:12px; line-height:15px; font-weight:normal; text-align:center;}
+#sidebar .blockcont, #adbar .blockcont { padding:2px;}
+#sidebar #postannouncement a, #adbar #postannouncement a { display:block; height:18px; margin:0 5px; border:1px solid; border-color:#d8dfea #0e1f5b #0e1f5b #d8dfea; background:#3B5888; color:#fff; line-height:18px; text-align:center; text-decoration:none; cursor:pointer;}
+#sidebar .attention {padding:0;background:#F9F9F9;border:1px solid #D8DEEA; border-bottom-color:#3B5999;line-height:2.5em;width:118px;}
+#adbar .blockcont p {line-height: 1.3em;padding-left:5px;}
+#adbar .blockcont.shit p {line-height:1.3em;padding-left:0;background:none}
+#adbar .attention {padding:0;background:#F9F9F9;border:1px solid #D8DEEA; border-bottom-color:#3B5999;line-height:2.5em;width:118px;}
+#adbar .list ul {list-style: none}
+#adbar .list ul li {line-height:1.3em}
+/* End of Sidebar */
+
+/* Footer */
+#footer { float:right; width:860px; margin-right:1px; text-align:left; display:inline;}
+#footer p { margin:6px 0; padding:0 10px; color:#808080;}
+#footer .pipe {padding:0 6px;}
+.shy { color:#808080; text-decoration:none;}
+/* End of Footer */
+
+/* Other Structures */
+.stdcontainer { clear:both; padding:0 10px; border-top:1px solid #d8dfea; background:#f7f7f7;}
+.stdcontainer:after { content:"."; display:block; font-size:0; clear:both; visibility:hidden;}
+.stdcontainer { *zoom:1;}
+.gnrcontainer:after { content:"."; display:block; font-size:0; line-height:0; clear:both; visibility:hidden;}
+.gnrcontainer { *zoom:1;}
+.stdcontainer .box h3 { margin:0; border:0; background:transparent;}
+.subcontainer { padding:1px; border:10px solid #d8dfea; background:#3B5888;}
+/* styling for blocks */
+.box { position:relative; overflow:hidden; width:100%; margin-bottom:10px;}
+.box h3 { height:24px; margin-bottom:8px; padding-left:8px; background:#d8dfea; color:#333; border-top:1px solid #3B5888; font-size:12px; line-height:24px;}
+.box h3 .stat { height:24px; margin-left:5px; color:#000; font-size:12px; font-weight:normal; line-height:24px;}
+.box h3 .count { padding:0 2px;}
+.box .readmore { text-align:right;}
+.box .more { position:absolute; right:10px; top:0px; line-height:24px;}
+.box .more .stat { color:#3B5888;}
+/* if the block have no content, go here */
+.nocontent { margin:10px 0;}
+.nocontent h3 { margin-bottom:10px; border-bottom:1px solid #d8dfea; color:#3B5888; font-size:14px;}
+.nocontent ul { padding-left:20px;}
+.nocontent li { margin:5px 0;}
+.nocontent p { margin:10px 0;}
+/* styling for page navigation */
+.page {
+    clear: both;
+    margin: 0.75em 0;
+    text-align: center;
+    overflow: hidden;
+    zoom: 1;
+}
+.page .this-page { padding:2px 6px; font-weight:bold;}
+.page a { position:relative; padding:2px 6px; border:solid 1px #d8dfea; background:#fff; color:#3B5888; text-decoration:none;}
+.page a:hover { border:solid 1px #d8dfea; color:#fff; background:#3B5888; text-decoration:none;}
+.page .pageCount { display:block; color:#808080; text-align:center; padding-top:10px;}
+.page select { float:left;}
+
+.quote {
+	margin-top: 1.0em;
+	padding: 0 0 0 18px;
+	background: url(/images/quote_start.gif) no-repeat 0 0;
+}
+
+.quote q {
+	color: #555;
+	padding-right: 18px;
+	background: url(/images/quote_end.gif) no-repeat 100% 100%;
+	display: inline;
+	zoom: 1;
+}
+
+
+/* Table of Contents */
+#toc { position:relative; height:28px; line-height:28px; word-break:break-all;}
+#toc a { text-decoration:none;}
+.crumbs, .snav, .status { padding:0 10px;}
+.crumbs a { text-decoration:none; font-weight:bold;}
+
+#toc .status { float:right; color:#808080;}
+#toc .status.sign {background: url(/images/sigh.gif) no-repeat left center; text-indent: 0.6em;}
+#toc .op { color:#808080;}
+#toc .op a { font-weight:normal;}
+#toc .count { padding:0 3px; color:#3B5888; font-weight:bold;}
+#toc form { float:right;}
+#toc input#name, #toc input#groupname { border:1px solid #bdc7d8; padding:3px;}
+#toc strong { padding:0 3px;}
+
+#tocie { position:relative; height:28px; line-height:28px; border-bottom: 1px solid #D8DFEA; word-break:break-all;}
+#tocie a { text-decoration:none;}
+
+#tocie .status { float:right; color:#808080;}
+#tocie .status.sign {background: url(/images/sigh.gif) no-repeat left center; text-indent: 0.6em;}
+#tocie .op { color:#808080;}
+#tocie .op a { font-weight:normal;}
+#tocie .count { padding:0 3px; color:#3B5888; font-weight:bold;}
+#tocie form { float:right;}
+#tocie input#name, #toc input#groupname { border:1px solid #bdc7d8; padding:3px;}
+#tocie strong { padding:0 3px;}
+
+
+#headline { padding:5px 10px 0; color:#3B5888; font-size:14px; font-weight:bold; line-height:19px;}
+#pagename { margin:10px 0; border-top:1px solid #d8dfea; border-bottom:1px solid #d8dfea; color:#3B5888; font-size:14px; font-weight:bold; line-height:30px;}
+
+
+/* tab */
+#tabs { height:28px; list-style:none; padding-left:10px; border-bottom:1px solid #3B5888;}
+#tabs:after { content:"."; display:block; height:0; clear:both; visibility:hidden;}
+#tabs { *zoom:1;}
+#tabs li { float:left;}
+#tabs li.activetab, #tabs li.inactivetab { margin:9px 0 -9px}
+#tabs a { display:block; margin-right:5px; padding:2px 5px 1px; text-decoration:none; line-height:16px; word-break:keep-all; white-space: nowrap;}
+#tabs a:hover { background:#d8dfea; text-decoration:none;}
+#tabs .activetab a { color:#fff; background:#3B5888;}
+#tabs .activetab a:hover { text-decoration:none; background:#3B5888;}
+#tabs .inactivetab a:hover { color:#3B5888; background:#d8dfea; text-decoration:none;}
+
+
+/* ==== list styles ==== */
+/* infolist (ol) */
+.infolist { margin:10px 0; list-style:none;}
+.infolist div { margin:5px 0; padding:10px; border:1px solid #d8dfea; background:#fff;}
+.infolist div:after { content:"."; display:block; clear:both; height:0; visibility:hidden;}
+.infolist div { *zoom:1;}
+.infolist .image { float:left; margin-right:10px; overflow:hidden;}
+.infolist .info { float:left; table-layout:fixed; overflow:hidden;}
+.infolist .info caption { padding:3px 0; color:#808080; font-weight:bold; text-align:left; word-break:break-all;}
+.infolist .info th { color:#808080; font-weight:normal; text-align:left; vertical-align:top;}
+.infolist .info .count, .infolist .info .date, .infolist .info .time { padding:0 2px; font-size:11px;}
+.infolist .actions { float:right; list-style:none; width:100px;}
+.infolist .actions li { border-bottom:1px solid #d8dfea; background:#fff; color:#808080; text-indent:8px;}
+/* styling for the people list */
+.peoplelist .image { width:102px;}
+.peoplelist .info, .people .info caption { width:300px;}
+.peoplelist .info th { width:3em;}
+/* styling for the group list */
+.grouplist .image { width:102px;}
+.grouplist .info, .grouplist .info caption { width:360px;}
+.grouplist .info th { width:50px;}
+/* styling for the album list */
+.albumlist .image { width:110px;}
+.albumlist .info, .albumlist .info caption { width:360px; color:#666;}
+/* styling for the announcement list */
+.announcement .image { float:right; width:62px; margin:0; text-align:center;}
+.announcement .image img { width:50px; margin-bottom:5px; padding:5px; border:1px solid #d8dfea; background:#fff; overflow:hidden;}
+.announcement .image a:hover { background:transparent;}
+.announcement .image a:hover img { border:1px solid #3B5888; background:#d8dfea;}
+.announcement .info, .announcement .info caption { width:480px;}
+.announcement .info caption { color:#3B5888;}
+.announcement .info th { width:6em;}
+
+/* iconlist */
+.iconlist { list-style:none;}
+.iconlist li { clear:both; margin:5px 0; overflow:hidden;}
+.iconlist li .icon { float:left; margin-right:5px;}
+.iconlist li .icon img { width:20px; max-height:30px;}
+
+/* commentlist */
+.commentlist { list-style:none;}
+	.commentlist li { padding:5px 10px;}
+		.commentlist .odd { background:#f7f7f7; border-top:1px solid #d8dfea; border-bottom:1px solid #d8dfea;}
+		.commentlist .even { background:#fff;}
+		.commentlist .content {padding:5px;}
+.comment { padding-left:60px;}
+.comment:after { content:"."; display:block; height:0; clear:both; visibility:hidden;}
+	.comment .picture { float:left; width:60px; margin-left:-60px;}
+	* html .comment .picture { display:inline;}
+	.comment .usericon img { width:50px; max-height:75px;}
+	.comment .info { line-height:20px;}
+	.comment .floor { float:right; color:#808080;}
+.commentlist, .comment { *zoom:1;}
+
+/* navlist (ol) */
+.navlist { list-style:none; margin:10px 0;}
+.navlist li { margin:5px 0; padding-left:11px; color:#808080;}
+.navlist li.current { text-indent:-11px;}
+
+/* datalist (table) */
+.datalist { table-layout:fixed;}
+.datalist th { height:24px; border:solid #d8dfea; border-width:1px 0; background:#f8f9fc; color:#3B5888; line-height:24px;}
+.datalist td { padding:5px 0; overflow:hidden; border-bottom:1px solid #d8dfea; line-height:15px; vertical-align:middle;}
+.datalist td p { white-space:nowrap;}
+.datalist .title { padding:0 5px; border-right:1px solid #d8dfea;}
+.datalist .author, .datalist .responder { width:6em; padding:0 5px; text-align:center;}
+.datalist .author { border-right:1px solid #d8dfea;}
+.datalist .responder { width:6em; padding:0 2px; text-align:center;}
+.datalist .time { width:65px; text-align:center;}
+
+/* popup */
+.popupwrap { display:none; overflow: hidden; position:absolute; padding:10px; border:1px solid; border-color:#fff #666 #666 #fff; background:#d8dfea; text-align:left; z-index:1000;}
+.popupwrap iframe {
+    position:absolute;
+	top:0;
+	left:0;
+	z-index:-1;
+	filter:mask();
+	width:3000px;
+	height:3000px;
+	display:hidden;
+}
+.popup { display:block; padding:10px; border:1px solid #3B5888; background:#f7f7f7;}
+.popup h4 { color:#333; border-bottom:1px solid #e8eef6; line-height:24px;}
+.popup p { margin:5px 0; color:#000;}
+.popup p.operation { text-align:right;}
+#commendit { width:300px;}
+/* styling for poke */
+#pan { width:300px;}
+#poke_confirm, #poke_working, #poke_ok { display:none;}
+#poke_ok, #poke_working { text-align:center;}
+
+/* tip */
+.tipwrap { margin:0 0 10px; border:7px solid #d8dfea; background:#fff; line-height:20px;}
+.tip { position: relative; padding:10px; border:1px solid #3B5888; background:#fffeed;}
+.xui-t1 .xui-gf .tip .box { margin:0;}
+.tip .close {
+	position: absolute;
+	top: 0.3em;
+	right: 0.5em;
+}
+
+*html .tip .close {
+	right: 1.2em;
+}
+
+/* univlist */
+#univlist, #searchSchoolList, #highSchoolList { position:absolute; width:606px; z-index:9999;}
+#univlist_provinces { border-bottom:1px solid #3B5888;}
+#univlist_provinces td { vertical-align:middle; color:#808080; text-align:center; font-size:13px;}
+#univlist_provinces a { font-size:12px;display:block; text-decoration:none;}
+#univlist_provinces td.activetab a { background:#3B5888; color:#fff;}
+#univlist_provinces:after { content:"."; display:block; height:0; clear:both; visibility:hidden;}
+#univlist_provinces { *zoom:1;}
+#univlist_univs { list-style:none; padding:5px 10px; border:1px solid #d8dfea; background:#fff;}
+#univlist_univs:after { content:"."; display:block; height:0; line-height:0; clear:both; visibility:hidden;}
+#univlist_univs { *zoom:1;}
+#univlist_univs li { float:left; width:140px; border-bottom:1px solid #f4f4f4; line-height:23px;}
+#univlist_univs li.univ { width:112px;}
+#univlist_univs li a:hover { background:#3B5888; color:#fff; text-decoration:none;}
+#searchlist_school { list-style:none; padding:5px 10px; border:1px solid #d8dfea; background:#fff;}
+#searchlist_school:after { content:"."; display:block; height:0; line-height:0; clear:both; visibility:hidden;}
+#searchlist_school { *zoom:1;}
+#searchlist_school li { float:left; width:140px; border-bottom:1px solid #f4f4f4; line-height:23px;}
+#searchlist_school li.univ { width:112px;}
+#searchlist_school li a:hover { background:#3B5888; color:#fff; text-decoration:none;}
+#univlist .operation a { margin-right:180px;}
+
+/*Editor*/
+#upFile {margin-bottom:5px}
+#cmtbody {width:99%; margin-right:10px;}
+iframe#simplerte {height:160px; width:100%; margin:5px 0; border:none;}
+iframe#rte {height:390px; margin:5px 0; border:none; overflow:hidden;}
+
+/* Xiaonei UI Templates */
+.xui-t1 .stdcontainer, .xui-t1 .gnrcontainer { padding:10px 0 0 10px; border-top:1px solid #d8dfea; background:#f7f7f7;}
+
+.xui-t1 .xui-gf  { float:left; width:456px;}
+.xui-t1 .xui-g  { float:right; width:180px; margin-bottom:10px; position:relative;}
+
+.xui-u { margin-bottom:5px; padding:10px; border:1px solid #e0e0e0; background:#fff;}
+.xui-t1 .xui-gf .xui-u { width:434px;}
+.xui-t1 .page { margin:0; padding-top:10px;}
+.xui-t1 .boxcont ol, .xui-t1 .boxcont ul { list-style:none; line-height:20px;}
+.xui-t1 .more { line-height:20px;}
+
+.xui-t1 .xui-gf .box { margin:0 0 5px;}
+.xui-t1 .xui-gf h3 { height:20px; margin:0 0 5px; padding:0; border:0; border-bottom:1px solid #d8dfea; background:transparent; line-height:20px;}
+.xui-t1 .xui-gf h4 { font-weight:normal; line-height:20px;}
+.xui-t1 .xui-gf .more { right:0;}
+.xui-t1 .xui-gf .stat { color:#333;}
+
+.xui-t1 .xui-g h3 { height:20px; margin:0 0 5px; padding:0 5px; border:0; background:#e9e9e9; color:#333; font-size:12px; line-height:20px;}
+.xui-t1 .xui-g .boxcont { padding:0 5px; line-height:20px;}
+.xui-t1 .xui-g .more { right:5px;}
+
+.xui-t2 .gnrcontainer { padding:10px;}
+.xui-t2 .xui-gf  { float:left; width:449px;}
+.xui-t2 .xui-g  { float:right; width:177px;}
+.xui-t2 .xui-gf .boxcont { padding:0 10px;}
+.xui-t2 .xui-g .boxcont { padding:0 10px; line-height:20px;}
+
+.xui-t3 .gnrcontainer { padding:10px;}
+.xui-t3 .xui-gf  { float:left; width:504px;}
+.xui-t3 .xui-g  { float:right; width:122px;}
+.xui-t3 .xui-gf .box { width:472px; border:1px solid #d8dfea; background:#fff;}
+.xui-t3 .xui-gf .box h3 { margin:0; padding:0 10px; border:0; background:#fff;}
+
+.xui-t4 .xui-gf  { float:left; width:354px;}
+.xui-t4 .xui-g  { float:right; width:272px;}
+.xui-t4 .xui-gf .info { width:150px;}
+.xui-t4 .xui-g h3 { height:20px; padding:0; font-size:14px; line-height:20px;}
+.xui-t4 .xui-g .more { right:0; line-height:20px;}
+
+.xui-t5 .stdcontainer { padding:10px;}
+.xui-t5 .xui-gf  { float:left; width:426px;}
+.xui-t5 .xui-g  { float:right; width:200px;}
+.xui-t5 .xui-g .xp-n3 { margin:10px 0;}
+
+.xui-t6 .xui-gf  { float:left; width:216px;}
+.xui-t6 .xui-g  { float:right; width:380px;}
+
+
+/* LATEST STYLING GO HERE */
+
+/* im */
+.imstatus { padding:2px 0 2px 2px; font-weight:normal;}
+
+/* share */
+.act_share { position:absolute; top:3px; right:2px;}
+#content .act_share form { margin:0; padding:0;}
+
+/* status */
+.statusTime { color:#808080;}
+#doing1 { word-break:break-all;}
+#edit_sta { display:none; clear:both; height:22px; text-align:right;}
+#edit_sta .me { float:left; line-height:22px;}
+#edit_sta .statusEditor { float:left; position:relative; background:#fff; text-align:left;}
+#edit_sta .statusEditor p { height:20px; border:1px solid #777; overflow:hidden;}
+#edit_sta #mySta { height:16px; padding:2px; border:0; line-height:16px;}
+#edit_sta a.select { display:block; width:14px; height:20px; background:url(/images/act_select.gif) 0 0 no-repeat; text-indent:-999em; line-height:0; overflow:hidden; position:absolute; top:1px; right:1px;}
+#edit_sta a.select:hover { background-position:0 100%;}
+
+#preSta { display:none; list-style:none; border:1px solid #777; border-top:none; background:#fff; position:absolute; left:0; top:21px;}
+#preSta li { border-top:1px solid #eee; text-indent:10px;}
+#preSta li a { display:block; height:20px; line-height:20px; text-decoration:none;}
+#preSta li a:hover { background:#3B5888; color:#fff;}
+
+/* rules below this line are rarely used */
+
+/* Resizable text areas */
+.resizable-textarea { margin:10px 0; background:#fff;}
+.resizable-textarea .grippie { height:14px; background:#eee url(/images/grippie.png) 100% 100% no-repeat; border:1px solid #d8dfea;	border-top:0; cursor:s-resize;}
+.dragging { border:1px dotted #000; opacity:0.5; filter:Alpha(Opacity=50);}
+
+.floatRight { float:right;}
+div#dlgContainer { border:10px #d8dfea solid; padding:1px; background-color:#d8dfea;margin-left:auto; margin-right:auto;}
+	div#dlgContainerInner { border:1px #3B5888 solid; background:#FFF;padding:10px}
+.caution { color:#dd3c10;}
+
+/* #topmenu */
+#closepanbtn{float:right;margin:20px 10px 0 0}
+#topmenu { z-index:1000; display:none; position:absolute; width:636px; background:#f7f7f7; border-left:1px solid #fff; border-right:1px solid #aaa; border-bottom:1px solid #aaa;}
+#tabPan { width:487px;height:465px; overflow:auto; margin:0 0 10px 15px; text-align:center; float:left;}
+.provinces { text-align:center; padding:0; margin:0; float:left;}
+.provinces a:hover { background:#d8dfea; text-decoration:none;}
+.provinces div { display:block; padding:6px 0 4px 0;}
+.provinces a { margin:0px; padding:6px 4px 4px 4px; text-decoration:none;}
+.provinces .activetab a { color:white; background:#3B5888;}
+.provinces .activetab a:hover { text-decoration:none;}
+.provinces .inactivetab a:hover { background:#d8dfea; text-decoration:none;}
+div.school { width:114px; float:left; padding:7px 0 6px 0; margin-top:0; text-align:left; font-size:12px;}
+div#taiwan, div#aomen, div#xianggang { color:gray; padding:6px 4px 4px 4px;}
+
+/* dialog */
+#dialog { border-collapse:separate; margin:0px auto; border:solid 10px #d8dfea;}
+#dialog td.dialog { padding-top:10px; border:solid 1px #3B5888;}
+#dialog td td { border:none;}
+#dialog td .formtable { margin:5px 10px 0px;}
+#dialog p { margin:10px; text-align:left;}
+#dialog h4 { border-bottom:solid 1px #d8dfea; margin:5px 10px 5px; padding:0px 0px 2px; font-size:13px;}
+#dialog .buttons { padding:10px; text-align:right;}
+#dialog .buttons input { margin-left:10px;}
+#dialog small { color:gray;}
+
+.xui-g .boxcont{color: #333;}
+
+#section-header {
+    background-color: #FFFFFF;
+    padding: 0px 12px 5px 20px;
+    overflow:hidden;
+    zoom:1;
+}
+
+#section-header .section-avatar {
+    float:left;
+    height:50px;
+    margin-right:10px;
+    margin-top:18px;
+    overflow:hidden;
+    position:relative;
+    width:50px;
+    z-index:1;
+}
+
+#section-header .section-avatar a {
+    display: block;
+    height: 50px;
+    width: 50px;
+	background-position: 50% 50%;
+	background-repeat: no-repeat;
+}
+
+#section-header .section-info {
+    float:left;
+    padding-top:23px;
+    width: 566px;
+}
+
+#section-header .section-info .section-gray {
+    background:#F7F7F7;
+    border-bottom:1px solid #CCCCCC;
+    margin:-23px -12px 4px -80px;
+    padding:23px 12px 4px 80px;
+    z-index:0;
+    position:relative;
+    width: 566px;
+}
+#section-header .section-actions .share {
+	float:right;
+}
+#section-header h2 em {
+	font-weight: normal;
+	font-style: normal;
+}
+/* BRAND NEW */
+
+#new-event input {
+    margin-top: 5px;
+}
+
+/* Aux Position */
+.clear {
+    clear: both;
+}
+
+.no-float {
+    float: none !important;
+}
+
+.go-inline {
+	display: inline;
+}
+
+.go-block {
+	display: block;
+}
+
+.top-margin {
+    margin-top: 1.0em;
+}
+
+.bottom-margin {
+    margin-bottom: 1.0em;
+}
+
+.vertical-margin {
+    margin: 10px 0;
+}
+
+.float-right {
+    float: right;
+}
+
+.float-left {
+    float: left;
+}
+
+.center {
+    text-align: center !important;
+}
+
+.align-left {
+    text-align: left !important;
+}
+
+.align-right {
+    text-align: right !important;
+}
+
+.lh15 {line-height:1.5em; margin: 0.5em 0}
+
+/* Links */
+a.link-arrow {
+    background: url(/images/arrow.gif) no-repeat right center;
+    padding-right: 0.75em;
+}
+
+a.link-arrow-back {
+    background: url(/images/arrow_back.gif) no-repeat left center;
+    padding-left: 0.75em;
+}
+/* Titles */
+h2 {
+    font-size: 1.2em;
+    color: #000;
+}
+
+h2#page-title {
+    background: #FFF;
+    height: 3.0em;
+    line-height: 3.0em;
+    font-size: 1.0em;
+    color: #333;
+    text-indent: 1.0em;
+    border-bottom: 1px solid #CCC;
+}
+
+h2 img {
+	margin-right: 0.25em;
+}
+
+h3 {
+    color: #333;
+}
+
+h3 span {
+    font-weight: normal;
+}
+
+/* Oak */
+#oak {
+    zoom: 1;
+    overflow: hidden;
+}
+
+#oak.white {
+    background: #FFF;
+}
+
+#oak.gray {
+    background: #F7F7F7;
+}
+
+#oak.white-gray {
+    background: url(/images/white_gray_bg.gif) repeat-y right top;
+}
+
+#oak.gray-gray {
+    background: #F7F7F7 url(/images/white_gray_bg.gif) repeat-y right top;
+}
+
+*html .white {
+    background: #FFF;
+}
+
+*html .gray {
+    background: #F7F7F7;
+}
+
+*html .white-gray {
+    background: url(/images/white_gray_bg.gif) repeat-y right top;
+}
+
+*html .gray-gray {
+    background: #F7F7F7 url(/images/white_gray_bg.gif) repeat-y right top;
+}
+
+#single-column {
+    padding: 10px;
+	clear: both;
+}
+
+
+#single-column.multifriends{ padding:30px;}
+
+#wide-column {
+    width: 476px;
+    float: left;
+    padding: 10px;
+}
+
+#side-column {
+    width: 162px;
+    float: left;
+}
+
+#side-column .single-box {
+    padding: 10px;
+    background: #F0F0F0;
+    border-top: 1px solid #CCC;
+    border-bottom: 1px solid #CCC;
+    margin: 0.8em 10px 0.8em 0;
+    position: relative;
+}
+
+#side-column .top-box {
+    padding: 10px;
+    border-bottom: 1px solid #CCC;
+}
+
+#side-column .mid-box {
+    padding: 10px;
+    border-bottom: 1px solid #CCC;
+    border-top: 1px solid #FFF;
+}
+
+#side-column .bottom-box {
+    padding: 10px;
+    border-top: 1px solid #FFF;
+}
+
+#side-column .no-margin {
+    margin: 0;
+}
+
+#equal-left {
+    float: left;
+    width: 48.5%;
+}
+
+#equal-right {
+    float: right;
+    width: 48.5%;
+}
+
+.cube {
+    padding: 10px;
+}
+
+.gray .cube {
+    border: 1px solid #D8DFEA;
+    background: #FFF;
+    padding: 10px;
+}
+
+.gray-gray .cube {
+    border: 1px solid #D8DFEA;
+    background: #FFF;
+    padding: 10px;
+}
+
+.gray .side-cube {
+    padding: 0.5em;
+    margin-bottom: 1.0em;
+    line-height: 1.5em;
+}
+
+.gray .side-cube ul {
+    padding: 0.5em;
+    list-style: square inside;
+}
+
+.blocks {
+    padding: 12px;
+}
+
+.blocks h3 {
+    background:#D8DFEA none repeat scroll 0%;
+    border-top:1px solid #3B5888;
+    color:#3B5888;
+    height:2.0em;
+    line-height:2.0em;
+    text-indent: 1.0em;
+    margin-bottom: 0.6em;
+}
+/* lalalalalalal */
+
+#toggle_collapse, #toggle_expend {
+	position: absolute;
+	top: 6px;
+	right: 8px;
+}
+
+
+#toggle_collapse a, #toggle_expend a {
+	display: block;
+	height:16px;
+	width: 16px;
+	background: url(/images/expend_out.gif) no-repeat center center;
+	text-indent: -999em;
+	line-height: 0.1em;
+}
+
+#toggle_expend a {
+	background: url(/images/collapse_out.gif) no-repeat center center;
+}
+
+#toggle_collapse a:hover, #toggle_expend a:hover {
+	background: url(/images/expend_over.gif) no-repeat center center;
+}
+
+#toggle_expend a:hover {
+	background: url(/images/collapse_over.gif) no-repeat center center;
+}
+
+.tip-normal {
+	border: 1px solid #E0E0E0;
+}
+
+.tip-normal .tip {
+	border: none;
+	position: relative;
+}
+
+.tip-normal .compact p {
+	margin: 5px 0;
+}
+
+.highlight {
+	border: 10px solid #D8DFEA;
+	color: #333;
+}
+
+.highlight h2 {
+	height: 2.0em;
+	line-height: 2.0em;
+}
+
+.highlight h5 {
+    height: 2.0em;
+	line-height: 2.0em;
+	font-size: 1.2em;
+}
+
+.highlight h5 span {
+    padding-left: 1.2em;
+    background: url(/images/sigh.gif) no-repeat 0 50%;
+}
+
+/* .highlight.popup {
+    border: 6px solid #8D9CCF;
+    margin: 20px 40px;
+    padding: 0;
+} */
+
+.highlight.error {
+    border: 1px solid #DD3C10;
+    text-align: center;
+    background: #FFEBE8;
+}
+
+.white .highlight.yellow {
+	border: 1px solid #E0E0E0;
+	background: #FFFFE1;
+	text-align: center;
+}
+
+.gray .highlight.yellow {
+	border: 1px solid #E0E0E0;
+	background: #FFF;
+	text-align: center;
+}
+
+.highlight.narrow {
+    margin: 10px 30px;
+}
+
+.highlight .highlight-border {
+	display: block;
+	position: relative;
+	border: 1px solid #3B5888;
+	padding: 10px;
+}
+
+/* .highlight.popup .highlight-border {
+    border-color: #3B5888;
+    padding: 10px;
+    background: #FFF;
+} */
+
+.highlight.error .highlight-border {
+	border-color: #FFEBE8;
+	padding: 6px;
+}
+
+.highlight.yellow .highlight-border {
+	border: 0;
+	padding: 20px;
+}
+
+#userFriendUniv .highlight ul {
+	margin-left: 0.5em;
+}
+
+#userFriendUniv .highlight li {
+	width: auto;
+	float: none;
+	text-indent: 1.0em;
+	background: url(/images/arrow.gif) no-repeat 0 4px;
+}
+
+#module-title {
+	padding: 20px;
+}
+
+#module-title h2 {
+	text-indent: 2.0em;
+}
+
+#module-title p {
+	text-indent: 2.4em;
+	height: 2.0em;
+	line-height: 2.0em;
+}
+
+#module-title p strong {
+	color: #C30;
+}
+
+.no-data {
+    text-align: center;
+    color: gray;
+}
+
+.no-data.left {
+    text-align: left;
+}
+
+.no-data.tall {
+    height: 6.0em;
+    line-height: 6.0em;
+}
+
+.no-data.double-tall {
+    height: 12.0em;
+    line-height: 12.0em;
+}
+
+.timestamp, .time, .date {
+    font-size: 11px;
+    color: #808080;
+}
+
+.tip-normal #friendsNewsFeed{border-top: 1px solid #dedbe7; padding:3px 0 10px 0}
+.tip-normal #findmates{color: #292929;}
+.tip-normal #searchByName input.inputtext{width: 100px}
+.tip-normal #searchByName input.inputempty{color: #808080}
+.tip-normal .tip .box h3{border-bottom: none}
+.tip-normal .tip .box {padding: 10px 0}
+.tip-normal #myicon .boxcont .image{margin-right: 5px}
+.tip-normal #notes p{margin: 5px 0}
+.tip-normal #friendsNewsFeed{border-top: 1px solid #dedbe7; padding:5px 0 10px 0; color: #333}
+.tip-normal #notes.xui-g .box .more{padding:0; margin-top:0; top:0;}
+.tip-normal .tip .box .lower{top:12px;}
+
+
+.submit-form {position:relative}
+.submit-form h3 { border-bottom:1px solid #D8DFEA; line-height:1.75em;margin-bottom:5px;}
+.submit-form p { clear:left; padding:2px 0; line-height:1.5em;}
+.submit-form p.label { line-height:18px;margin-bottom:2.0em;}
+.submit-form p.operation {margin-top: 1.5em;}
+.submit-form p select {width: 10.0em;}
+.submit-form p em { color:#808080; font-style:normal; font-weight:bold; padding:2px 2px 0pt 0pt;}
+.submit-form label { float:left; position:relative; width:100px; margin:0 10px 0 0; color:#808080; font-weight:bold; text-align:right;}
+.submit-form label.empty {color:#FFF}
+.submit-form .errors_div {margin:0}
+.submit-form span {color:#808080;padding-left:1.0em;}
+
+/* Login Form */
+
+.form-login {
+    margin:10px 30px;
+}
+
+.form-login h3 {
+    font-size: 1.2em;
+    border-bottom: 1px solid #D8DFEA;
+    line-height: 1.5em;
+    margin-bottom: 2.0em;
+}
+
+.form-login p {
+    padding: 0.5em 0;
+    overflow: hidden;
+    zoom: 1;
+}
+
+.form-login p label {
+    float:left;
+    width:190px;
+    margin-right:10px;
+    color:#808080;
+    font-weight:bold;
+    text-align:right;
+    height: 1.8em;
+    line-height: 1.8em;
+}
+
+.form-login p .inputtext, .form-login p .inputpassword {
+    float: left;
+    border:1px solid #BDC7D8;
+    vertical-align: middle;
+    height: 18px;
+    line-height: 18px;
+    width: 194px;
+    padding: 2px;
+}
+
+.form-login p .labelCheckbox {
+    padding-left: 1.0em;
+}
+
+#joinHighschool #avatar-table p {
+    margin-top: 2.0em;
+}
+.pager-top {border-bottom: 1px solid #D8DFEA; padding:5px 10px 0; overflow:hidden; zoom:1;}
+.pager-top.moretopmargin{ margin-top:10px;}
+.pager-top span {float:left;padding-bottom:6px;}
+* html .pager-top span {padding-bottom:5px;}
+*+html .pager-top span {padding-bottom:4px;}
+.pager-top span.pipe {float:none;}
+.pager-bottom {border-top: 1px solid #D8DFEA; padding:0 10px 5px; overflow:hidden; zoom:1;}
+.pagerpro{float:right;list-style:none;margin:0;padding:0;}
+.pagerpro li{display:inline;float:left;}
+.pagerpro li a{font-size:11px;display:block;padding:3px;padding-bottom:2px;}
+.pager-bottom .pagerpro li a{border-top:2px solid white;border-bottom:0;padding-top:2px;padding-bottom:3px;}
+.pagerpro li a.chn{font-size:12px;}
+.pagerpro li a:hover{background:#3B5888;border-color:#D8DFEA;border-bottom:2px solid #3B5888;color:white;text-decoration:none;}
+.pagerpro li a.chn:hover{border-bottom:1px solid #3B5888;}
+.pager-bottom .pagerpro li a:hover{border-top:2px solid #3B5888;color:white;border-bottom:0;}
+.pager-bottom .pagerpro li a.chn:hover{border-top:1px solid #3B5888;}
+* html .pagerpro li a.chn:hover{border-bottom:0 solid #3B5888;}
+.pagerpro li.current a,
+.pagerpro li.current a:hover{background:transparent;border-color:#3B5888;border-bottom:2px solid #3B5888;color:#3B5888;font-weight:bold;padding-left:2px;padding-right:2px;}
+.pager-bottom .pagerpro li.current a,
+.pager-bottom .pagerpro li.current a:hover{border-bottom:none;border-top:2px solid #3B5888;}
+
+
+#xiaonei-welcome-u-guys {
+    border-left: 1px solid #B7B7B7;
+    /*border-bottom: 1px solid #3B5888;*/
+    border-bottom: none;
+    padding: 20px 30px 15px;
+    border-top: 1px solid #CCC;
+}
+
+#xiaonei-welcome-u-guys p {
+    margin-top: 15px;
+    color: #808080;
+}
+
+#xiaonei-welcome-u-guys.lessmargin p{ margin-top:0;}
+
+#xiaonei-welcome-u-guys p a {
+    /*font-weight: bold;*/
+}
+
+#xiaonei-welcome-u-guys span.sign-up-home {
+    float: right;
+    border-top: 1px solid #CCC;
+    border-bottom: 1px solid #CCC;
+    background: #F7F7F7;
+    text-align: center;
+    padding: 12px 0;
+    width: 240px;
+    text-decoration: none;
+}
+
+#xiaonei-welcome-u-guys span.sign-up-home strong {
+    font-size: 1.4em;
+    font-weight: bold;
+    color: #000;
+    display: block;
+}
+
+#xiaonei-welcome-u-guys span.sign-up-home em {
+    font-style: normal;
+    color: #808080;
+    display: block;
+    margin: 0.5em;
+}
+
+#xiaonei-welcome-u-guys span.sign-up-home a {
+    background: url(/images/reg.gif) no-repeat;
+    display: block;
+    width: 86px;
+    height: 25px;
+    margin: 0 auto;
+    cursor: hand;
+    text-indent: -999em;
+}
+
+* html #xiaonei-welcome-u-guys span.sign-up-home {margin:0}
+*+html #xiaonei-welcome-u-guys span.sign-up-home {margin:0}
+
+
+#xiaonei-welcome-u-guys div p {
+    color: #808080;
+    padding: 6px 0 10px;
+}
+
+#xiaonei-welcome-u-guys dt {
+    font-size: 1.2em;
+    font-weight: bold;
+    margin-bottom: 0.8em;
+}
+
+#xiaonei-welcome-u-guys dd {
+    background: url(/images/style_square.gif) no-repeat 5px 50%;
+    text-indent: 1.5em;
+    line-height: 1.5em;
+
+}
+
+* html #browsesociety #toc .snav select {
+    margin-top: 3px;
+}
+
+#errorPage .errors_div {
+    background: none;
+    border: none;
+    text-align: left;
+    margin: 0;
+    padding: 0;
+    font-weight: bold;
+    font-size: 1.2em;
+}
+
+#errorPage #content {
+    padding: 35px;
+}
+
+#errorPage #content p.notes {
+    margin: 1.0em 0;
+    color: #808080;
+}
+
+#errorPage #content ul {
+    list-style: square inside;
+    color: #3B5888;
+}
+
+#uploadDiv {line-height:2.0em}
+
+
+
+#pages-jump {
+    background: #F7F7F7;
+    clear: both;
+    height: 3.0em;
+    line-height: 3.0em;
+    position: relative;
+    text-align: center;
+    padding: 0 1.0em;
+	z-index: 10;
+}
+
+#pages-jump a {
+    background: #FFF;
+    border: 1px solid #D8DFEA;
+    color: #3B5888;
+    padding: 2px 6px;
+    text-decoration: none;
+}
+
+#pages-jump span a {
+    background: none;
+    border: none;
+    padding: 0;
+}
+
+#pages-jump span a:hover {
+    text-decoration: underline;
+}
+
+#pages-jump .this-page {
+    font-weight: bold;
+    padding: 2px 6px;
+}
+
+#pages-jump.top {
+    border-bottom: 1px solid #CCC;
+}
+
+#pages-jump.bottom {
+    border-top: 1px solid #CCC;
+    margin-top: 10px;
+}
+
+#pages-jump .right-line {
+    float: right;
+}
+
+#pages-jump .left-line {
+    float: left;
+}
+
+#pages-jump strong {
+    margin: 0 0.25em;
+}
+
+*html .bottom {
+    border-top: 1px solid #CCC;
+    margin-top: 10px;
+}
+
+.no-page {
+    height: 2.0em !important;
+    line-height: 2.0em !important;
+}
+
+.no-page.align-left {
+    text-align: left !important;
+}
+
+
+#uniList {
+    width: 612px;
+}
+
+.popup-wrapper {
+    border: 10px solid #D8DFEA;
+    position: absolute;
+    z-index: 9999;
+    overflow: hidden;
+}
+
+.popup-wrapper iframe {
+    position:absolute;
+	top:0;
+	left:0;
+	z-index:-1;
+	filter:mask();
+	width:3000px;
+	height:3000px;
+	display:hidden;
+}
+
+.popup-content {
+    border: 1px solid #3B5888;
+    background: #F7F7F7;
+    padding: 6px;
+    overflow: hidden;
+    zoom: 1;
+}
+
+#popup-country {
+    font: 13px sans-serif;
+    list-style: none;
+    overflow: hidden;
+    zoom: 1;
+}
+
+#popup-country li {
+    float: left;
+    line-height: 26px;
+    padding: 0 4px 0 5px;
+    background: url(/images/popup_country_separator.gif) no-repeat 0 50%;
+}
+
+* html #popup-country li {
+    background-position: 0 40%;
+}
+
+#popup-country li a {
+	word-break: keep-all;
+}
+
+#popup-country li#c_0, #popup-country li#c_13 {
+    background: none;
+}
+
+#popup-country li a {
+    display: block;
+}
+
+#popup-country li.active a {
+    font-weight: bold;
+    color: #000;
+}
+
+#popup-country li.active a:hover {
+    text-decoration: none;
+}
+
+#popup-province, #popup-province-hs {list-style: none;overflow: hidden;zoom: 1;border: 1px solid #C3C3C3;background: #FFF;padding: 3px;}
+#popup-province li, #popup-province-hs li {float: left;width: 33px;text-align: center;}
+#popup-province li a, #popup-province-hs li a {height: 18px;line-height: 18px;}
+#popup-province li.active a, #popup-province-hs li.active a {background: #3B5888;color: #FFF;}
+#popup-province li.active a:hover, #popup-province-hs li.active a:hover {text-decoration: none;}
+#popup-province li a, #popup-province-hs li a {display: block;}
+
+#popup-province li#p_0_3, #popup-province li#p_0_20, #popup-province li#p_0_26, #popup-province li#p_0_9 {width: 44px;}
+#popup-province-hs li#hsp_0_5, #popup-province-hs li#hsp_0_8, #popup-province-hs li#hsp_0_22, #popup-province-hs li#hsp_0_25 {width: 44px;}
+
+#popup-unis, #popup-unis-hs {list-style: none;overflow-x: hidden;overflow-y:auto;height:200px;zoom: 1;border: 1px solid #C3C3C3;background: #FFF;padding: 10px 0 10px 10px;margin: 5px 0;}
+#popup-unis li, #popup-unis-hs li {float: left;width: 160px;padding: 4px 12px;background: url(/images/school_list_dot.gif) no-repeat 0 9px;}
+#popup-unis li a:hover, #popup-unis-hs li a:hover {background: #3B5888;color: #FFF;text-decoration: none;}
+
+* html #popup-unis li {height: 1.3em;}
+
+#uniList .canbutton {
+    float: right;
+}
+
+
+ a.new-media { color:#777; }
+.new-media{display:block;float:left;color:#777;text-decoration:none;background:url(/images/new_media_button.gif) no-repeat;}
+.new-media .tr{background:url(/images/new_media_button.gif) no-repeat top right;}
+.new-media .bl{background:url(/images/new_media_button.gif) no-repeat bottom left;}
+.new-media .br{background:url(/images/new_media_button.gif) no-repeat bottom right;}
+.new-media span{background:url(/images/new_media_button_plus.gif) no-repeat 9px center;color:#333;font-weight:bold;display:block;padding:3px 9px 5px 22px;}
+*+html .new-media span{padding:5px 9px 4px 22px;}
+.new-media:hover{text-decoration:underline;color:#777;}
+.new-media:active,
+.new-media:active .tr,
+.new-media:active .bl,
+.new-media:active .br{background-image:url(/images/new_media_button_active.gif);}
+
+/* Clearfix Start */
+.clearfix:after {
+	content:".";
+	display:block;
+	height:0;
+	clear:both;
+	visibility:hidden;
+}
+.clearfix {
+	display:inline-block;
+}
+/* Hide from IE Mac */
+	.clearfix {display:block;}
+/* End hide from IE Mac */
+/* Clearfix End */
+
+.pager-bottom.clearfix {
+	overflow:visible;
+}
+
+/*index_right_state for IE6*/
+*html #havedoingdiv font#doing1{ float:left; width:100px; }
+
+
+/*clippage
+.crumbs, .snav, .status {  padding:0 10px; border-bottom:1px solid #D8DFEA;}
+.stdcontainer { padding:0 10px; border-top:1px solid #d8dfea; background:#f7f7f7;}
+.stdcontainer { border-top:0; overflow:hidden;}
+
+#content .pager-top{ overflow: hidden; clear:both;}
+#content .pager-bottom{ clear:both;}*/
+
+
+/*bindMSN*/
+.bindmsn .notes{ margin-bottom:15px;}
+.bindmsn .notes p{ width:auto; margin:0;}
+.bindmsn p.altbox1,.bindmsn p.altbox2{ padding:10px; margin-top:10px; border:1px #E2C821 solid; background-color:#FFFAD7; font-weight:bold; font-size:15px;}
+.bindmsn p.altbox2{ border:1px #DD3C0F solid; background-color:#FFF1E6;}
+.bindmsn p.altbox2 span{ font-weight:normal; display:block; margin-top:5px; font-size:12px; }
+
+.bindmsn h3{ padding-left:20px; height:1.5em; line-height:1.5em; background:url(/images/msnico.gif) left 50% no-repeat; border-bottom:1px #B9C4DA solid; margin-bottom:5px;}
+
+.bindmsn p{ margin:5px 0;}
+.bindmsn p label{ padding-right:0px !important;}
+.bindmsn p label.autosave{ float:none; font-weight:normal; color:#333;}
+.bindmsn p label.autosave input{ margin-right:5px; background:none;}
+
+
+.bindmsn p.required { margin:15px 0 5px 0;}
+.bindmsn p.required input.binded{ background-color:#eee; color:#666; border:1px #ccc solid; margin-right:20px;}
+
+.bindmsn p.btngroup{ padding-top:5px;}
+.bindmsn label.empty{ visibility:hidden; }
+
+
+/*for new comment*/
+/*.commentlist .even .info{background:#F7F7F7 none repeat scroll 0% 50%;border-top:1px solid #D8DFEA;line-height:20px;padding:0pt 5px;text-align:right;}
+.commentlist .even .info span.timestamp{ float:right !important;}
+.commentlist .even .info span.reply{ float:right !important;}
+.commentlist .even .info div.super-actions{ float:right !important; margin-left:4px;}
+
+#commentlist .content{ padding:5px;}*/
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+/* custom stylesheet */
+.fieldWithErrors {
+  border-bottom:1px solid #DD5555;
+  padding:0px!important;
+}
+
+
+#errorExplanation {
+  width: 400px;
+  padding: 7px; 
+  padding-bottom: 12px;
+  margin: 20px 40px;
+}
+
+#errorExplanation h2 { 
+  text-align: left;
+  font-weight: bold;
+  padding: 5px 5px 5px 15px;
+  font-size: 12px;
+  margin: -7px;
+  border-bottom:1px solid #aaa;
+  margin-bottom:10px;
+}
+
+#errorExplanation p {
+  margin-bottom: 0;
+  padding: 5px; 
+}
+
+#errorExplanation ul li { 
+  font-size: 12px;
+  list-style: disc;
+  margin-left:30px;
+}
+
+
+
+
+#notice {
+  font-size:13px;
+  text-align:left;
+  border:1px solid;
+  line-height:20px;
+  background:#FFFBE2 none repeat scroll 0% 0%;
+  border-color:#FFE222;
+  padding:8px;
+  margin:5px;
+}
+
+#error {
+  background:#FFEBE8 none repeat scroll 0% 0%;
+  border:1px solid #DD3C10;
+  padding:8px;
+  margin:5px;
+  text-align:center;
+}
+
+
+.lister {
+  background-color:#F8F9FC none repeat scroll 0% 0%;
+  width:98%;
+  margin:10px auto;
+}
+
+.lister tbody td {
+  padding:4px;
+  border-bottom:1px solid #EEE;
+}
+
+.lister thead th {
+  padding:5px 10px;
+}
+
+.lister thead td {
+  border-bottom:1px solid #D8DFEA;
+  border-top:1px solid #D8DFEA;
+  background-color:#EEE;
+  padding:3px 5px;
+}
+
+
+.lister thead th span {
+  float:right;
+  margin-top:-15px;
+  font-weight:normal;
+}
+
+
+form label {
+  color:#666666;
+  float:left;
+  font-weight:bold;
+  height:1.8em;
+  line-height:1.8em;
+  margin-right:10px;
+  text-align:right;
+  width:8em;
+}
+
+form p {
+  padding:5px;
+}
+
+form h3 {
+  border-bottom: 1px solid #BDC7D8;
+  font-size:14px;
+  margin:10px 20px;
+}
+
+form input {
+  border:1px solid #BDC7D8;
+  padding:2px;
+}
+
+h3.form-header {
+  border-top:1px solid #D8DFEA;
+  background-color:#F8F9FC;
+  padding:5px;
+  margin:10px 20px;
+}
+
+h3.form-header span {
+  float:right;
+  margin-top:-15px;
+}