[Mihalis]

And here is my final code for this example:



Not what i want 100% but i like it.

Like I said, i made this only for vbadvanced CMPS so i have tweaked only the appropriate templates. If you find this useful and want to try in forum templates, be my guest and drop a note how you did it. Corrections in code is also appreciate.

$mods[formcode]

<div style="padding-bottom:$vba_style[portal_vspace]px">
	<table class="bord" align="center" border="0"width="100%" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]">
		 				
<div class="class1" colspan="$mods[colspan]">
  <b class="spiffy">
  <b class="spiffy1"><b></b></b>
  <b class="spiffy2"><b></b></b>
  <b class="spiffy3"></b>
  <b class="spiffy4"></b>
  <b class="spiffy5"></b></b>

  <div class="spiffyfg">
				<if condition="$vba_style['portal_collapsemods']">
					<a href="#top" onclick="return toggle_collapse('module_$mods[collapse]')" style="float:$stylevar[right]"><img alt="" border="0" id="collapseimg_module_$mods[collapse]" src="$stylevar[imgdir_button]/collapse_tcat$modimgcollapse.gif" /></a>
				</if>
				<div class="tex"><strong>$vba_style[portal_blockbullet] <if condition="$mods['link']"><a href="$mods[link]">$mods[title]</a><else />$mods[title]</if></strong></div>			
		
		<tbody id="collapseobj_module_$mods[collapse]" style="$modcollapse">
			<if condition="$show['tablerow']">
				<tr>
					<td class="$bgclass">
						$modulehtml
					</td>
				</tr>
			<else />
				$modulehtml
			</if>
		</tbody>

	</table>
<b class="spiffya">
  <b class="spiffya5"></b>
  <b class="spiffya4"></b>
  <b class="spiffya3"></b>
  <b class="spiffya2"><b></b></b>
  <b class="spiffya1"><b></b></b></b>
</div>

  </div></div>

<if condition="$mods['formcode']"></form></if>

And the additional CSS code:

.bigfont {
font-size: 13px;
}
.spiffy{display:block}
.spiffy *{
  display:block;
  height:1px;
  overflow:hidden;
  font-size:.01em;
  background:#94A3B3}
.spiffy1{
  margin-left:3px;
  margin-right:3px;
  padding-left:1px;
  padding-right:1px;
  border-left:1px solid #d0d7de;
  border-right:1px solid #d0d7de;
  background:#aebac6}
.spiffy2{
  margin-left:1px;
  margin-right:1px;
  padding-right:1px;
  padding-left:1px;
  border-left:1px solid #f4f5f7;
  border-right:1px solid #f4f5f7;
  background:#a8b4c1}
.spiffy3{
  margin-left:1px;
  margin-right:1px;
  border-left:1px solid #a8b4c1;
  border-right:1px solid #a8b4c1;}
.spiffy4{
  border-left:1px solid #d0d7de;
  border-right:1px solid #d0d7de}
.spiffy5{
  border-left:1px solid #aebac6;
  border-right:1px solid #aebac6}
.spiffyfg{
  background:#94A3B3}
.tex{
padding-left:10px;
font-size:13px;
color: #ffffff;
padding-bottom: 5px;
link
}
.class1 A:link {text-decoration: none; color: #ffffff;}
.class1 A:visited {text-decoration: none; color: #ffffff;}
.class1 A:active {text-decoration: none; color: #ffffff;}
.class1 A:hover {text-decoration: underline; color: #ffff66;}
.bord{
border-left: 1px solid #dadada;
border-right: 1px solid #dadada;
border-bottom: 1px solid #dadada;
}
.tex1{
padding-left:10px;
font-size:11px;
color: #ffffff;
font-color: #ffffff;
padding-bottom:4px;
}
.spiffy{display:block}
.spiffya *{
  display:block;
  height:1px;
  overflow:hidden;
  font-size:.01em;
  background:#DADADA}
.spiffya1{
  margin-left:3px;
  margin-right:3px;
  padding-left:1px;
  padding-right:1px;
  border-left:1px solid #efefef;
  border-right:1px solid #efefef;
  background:#e3e3e3}
.spiffya2{
  margin-left:1px;
  margin-right:1px;
  padding-right:1px;
  padding-left:1px;
  border-left:1px solid #fbfbfb;
  border-right:1px solid #fbfbfb;
  background:#e1e1e1}
.spiffya3{
  margin-left:1px;
  margin-right:1px;
  border-left:1px solid #e1e1e1;
  border-right:1px solid #e1e1e1;}
.spiffya4{
  border-left:1px solid #efefef;
  border-right:1px solid #efefef}
.spiffya5{
  border-left:1px solid #e3e3e3;
  border-right:1px solid #e3e3e3}

I have used this tutorial to make the spiffy class colors. If I could eliminate somehow the bottom grey color but keep the border, it would be perfect.