/* elements */
  img       { font-size: 3px; }
a img       { border: none; }
    a       { text-decoration:none;}
    a:hover { text-decoration:underline;}

/* emulation */
.hand       { cursor: pointer; }
.hand:hover { background-image: url(../images/toggle.png); background-repeat: no-repeat; background-position: center right; }
.button     { padding: 2px 10px 2px 10px; font-size: 1em; font-weight: bold;  }

/* floats */
.fl    { float: left; }
.fr    { float: right; }
.fldi  { float: left; display: inline;}
.frcb  { float: right; clear: both; }
.flcb  { float: left; clear: both; }
.frcr  { float: right; clear: right; }
.flcl  { float: left; clear: left; }
.clear { border: none; clear: both; margin: 0; padding: 2px 0px 0px 0px; line-height: normal; }

/* use it with cleared blocks */
.block { display:block; overflow:hidden; }
/* text */
.tl { text-align: left; }
.tr { text-align: right; }
.tc { text-align: center; }
.tj { text-align: justify; }

.b  { font-weight: bold; }
.i  { font-style: italic; }
.u  { border-bottom: 1px solid; }
.s  { text-decoration: line-through;}

.small  { font-size: 0.6em; }
.normal { font-size: 1em; }
.big    { font-size: 2em; }
.huge   { font-size: 3em; }

/* position */

/* containers */
.c          {margin: 0 auto; } /* horizontal centering */  
/* vertical centering */
/*
<div id="outer">
  <div id="middle">
    <div id="inner">
      any text
      any height
      any content, for example generated from DB
      everything is vertically centered
    </div>
  </div>
</div>
*/
#outer      {height: 400px; overflow: hidden; position: relative;}
#outer[id]  {display: table; position: static;}
#middle     {position: absolute; top: 50%;} /* for explorer only*/
#middle[id] {display: table-cell; vertical-align: middle; position: static;}
#inner      {position: relative; top: -50%} /* for explorer only */
/* optional: #inner[id] {position: static;} */

.ib     { float: left; display: inline;} /* inline block */

/* images */
.il     {float: left; clear: left; margin: 4px 10px 4px 0;}
.ir     {float: right; clear: right; margin: 4px 0 4px 10px;}

.ifl	  {float: left;}
.ifr	  {float: right;}
/* kill stuff */
.nopadding {padding: 0;}
.nomargin  {margin: 0;}
.nooutline {outline: 0;}
.noindent  {margin-left: 0; padding-left: 0;}
.nobullet  {list-style: none; list-style-image: none;}

/* visibility */
.show    {display: block; visibility: visible; }
.hide    {display: none; visibility: hidden; }
.visible {visibility: visible; }
.hidden  {visibility: hidden; }
.di      {display: inline; }
.db      {display: block; }
.dn      {display: none; }

/* corners positioning */
.cbl {position: absolute; bottom: 5px; left: 5px;}
.cbr {position: absolute; bottom: 5px; right: 5px;}
.ctl {position: absolute; left: 5px; top: 5px;}
.ctr {position: absolute; right: 5px; top: 5px;}

/* messages */
.alert     { background: #FFEEEE; border: 1px solid #FF9999; color: #800000; margin: 2px 0px 2px 0px; padding: 1px; text-align: center; 
				 }
.success   { background: #EEFFEE; border: 1px solid #99FF99; color: #008000; margin: 2px 0px 2px 0px; padding: 1px; text-align: center; 
				}
.notice    { background: #EEEEFF; border: 1px solid #9999FF; color: #0000FF; margin: 2px 0px 2px 0px; padding: 1px; text-align: center; 
				}
.mandatory { color: #FF0000; }
.highlight { background: #ffc; border: 1px solid #EECE6F; color: #333 !important; margin: 2px 0px 2px 0px; padding: 1px; text-align: center; }

/* margins */
.m1  { margin: 1px; }
.m2  { margin: 2px; }
.m3  { margin: 3px; }
.m4  { margin: 4px; }
.m5  { margin: 5px; }
.m10 { margin: 10px; }

/* paddings */
.p1  { padding: 1px; }
.p2  { padding: 2px; }
.p3  { padding: 3px; }
.p5  { padding: 5px; }
.p7  { padding: 7px; }
.p10 { padding: 10px; }

/* borders */
.b1  { border: 1px solid #EEE; }
.b2  { border: 2px solid #EEE; }
.b3  { border: 3px solid #EEE; }
.b4  { border: 4px solid #EEE; }
.b5  { border: 5px solid #EEE; }
.b10 { border: 10px solid #EEE; }

/* widths */
.w10  { width: 10%; }
.w20  { width: 20%; }
.w25  { width: 25%; }
.w33  { width: 33%; }
.w34  { width: 34%; }
.w40  { width: 40%; }
.w50  { width: 50%; }
.w60  { width: 60%; }
.w66  { width: 66%; }
.w70  { width: 70%; }
.w80  { width: 80%; }
.w96  { width: 96%; }
.w100 { width: 100%; }

/* heights */
.h20  {height: 20px;}
.h30  {height: 30px;}
.h50  {height: 50px;}
.h100 {height:100px;}
.h150 {height:150px;}
.h200 {height:200px;}
.h250 {height:250px;}
.h300 {height:300px;}

/* corners 
.c2  { -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; }
.c3  { -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; }
.c4  { -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; }
.c5  { -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }
.c10 { -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; }
.c20 { -moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px; }*/

/* counters */	
.first    { margin-left: 0 !important; }
.last     { margin-right: 0 !important; }
.odd      { }
.even     { background-color: #FAFAFA;  }

/* link with background change on hover */

a.hover       { background-image: url(hover.gif); background-position: top left; background-repeat: no-repeat;}
a.hover:hover { background-image: url(hover.gif); background-position: bottom left; background-repeat: no-repeat;}						  
a.hover img   { width: 90px; height: 20px; }

/* inline list */
ul.inline li { display: inline; list-style:none; margin:0; padding:0; }

/* no bullets lists */
ul.nobullets { list-style:none; margin:0; padding:0; }

/* ADDED By Madalin */

/* margins percentage */
.mp1 { margin:1%; }
.mp2 { margin:2%; }
.mp3 { margin:3%; }
.mp4 { margin:4%; }
.mp5 { margin:5%; }
.mp6 { margin:6%; }
.mp7 { margin:7%; }
.mp8 { margin:8%; }
.mp9 { margin:9%; }
.mp10 { margin:10%; }

/* margin right percentage */
.mrp2 { margin-right:2%; }
.mrp4 { margin-right:4%; }
.mrp5 { margin-right:5%; }
.mrp6 { margin-right:6%; }
.mrp8 { margin-right:8%; }
.mrp10 { margin-right:10%; }

/* margin left percentage */
.mlp2 { margin-left:2%; }
.mlp4 { margin-left:4%; }
.mlp6 { margin-left:6%; }
.mlp8 { margin-left:8%; }
.mlp10 { margin-left:10%; }

/* margins button */

.mb5 { margin-bottom:5px; }
.mb10 { margin-bottom:10px; }
.mb15 { margin-bottom:15px; }
.mb20 { margin-bottom:20px; }
.mb25 { margin-bottom:25px; }
.mb30 { margin-bottom:30px; }

/* paddings percentage */
.pp1 { padding:1%; }
.pp2 { padding:2%; }
.pp3 { padding:3%; }
.pp4 { padding:4%; }
.pp5 { padding:5%; }
.pp6 { padding:6%; }
.pp7 { padding:7%; }
.pp8 { padding:8%; }
.pp9 { padding:9%; }
.pp10 { padding:10%; }

.overflow, .of, .oh { overflow:hidden; }

.rel { position: relative;}
.abs { position: absolute;}

.row { display: table-row; }
.col { display: table-cell; }


table.simpleTable { width:98%; padding:1%; border:1px solid #fff; background-color:#eee}
table.simpleTable thead td { background-color:#777; font-size:15px; text-transform:capitalize; color:#fff; font-weight:bold;}
table.simpleTable td { padding:10px; font-size:12px;}
table.simpleTable tfoot { background-color:#eee; font-weight:bold; font-size:13px;}
table.simpleTable tfoot td { border-top:2px solid #777}
table.simpleTable td.border { border:1px solid #ccc; }
table.simpleTable td.bgView { background-color:#f9f9f9; }
table.simpleTable .bold { font-weight:bold; }
table.simpleTable tbody tr:hover {background-color:#FCF8D8; color:#555;}
table.simpleTable tbody td:hover { background-color:#F9F1AE; }

/* paralel image and paragraph */

img.ilp { float:left; clear:left; display:table-cell; }
img.irp { float:right; clear:right; display:table-cell; }
div.pp  { display: table-cell; }

/* equal height columns */

div.cc  { display: table-row; }
div.col { display: table-cell; }

img.wp-smiley { float: none !important; display: inline !important; margin: 0 5px !important;}