
body {
	font-family: Verdana,Arial,Helvetica,Geneva,sans-serif;
	font-size: 12px;
}

pre {
	font-family: Verdana,Arial,Helvetica,Geneva,sans-serif;
}


/* **** Things specifically related to offers. */
.offer_date {
	font-weight:normal;
}


/* **** Hints. Two classes, one to create a reference to a footnote, the other for the actual footnote */
.hint_ref {
 	font-size: 80%;
	font-weight: normal;
	vertical-align: top;
}

.hint {
	font-style:italic;
	width: 500px;
	text-align: left;
      text-indent:-2em;   
}



/* **** unobtrusive table ***
* A simple table, very little markup. 
<table cellspacing="3" class="uTable">
    <tr>
     <th class="uTableHeader" width="80%">Text header</th>
     <th class="uTableHeader"> &nbsp; </th>
     <th class="uTableHeader"> &nbsp; </th>
    </tr>

    <tr>
     <td width="80%">Text text</td>
     <td width="10%">edit</td>
     <td width="10%">Delete</td>
    </tr>
</table>
*/

.uTable {
	width: 600px;
	padding: 0px;
	margin: 0px;
}

.uTable td {
	border-color:#DDDDDD;
	border-style: solid;
	border-width: 0px 0px 1px 0px;
	text-align:left;
	padding-left:2px;	
}

.uTable th {
	border-color: #DDDDDD #DDDDDD #555555 #DDDDDD;
	border-style:solid;
      border-width:1px 1px 1px 1px;
	background-color:#DFDFDF;
}


/* **** formTable ***
* Text formatting for form tables
*/
.fTable td {
	font-weight:bold;
	text-align:left;
	vertical-align:center;
}

.fTable td.multi {
	vertical-align:top;
}

.fWarning {
	text-align:center;
	font-weight:bold;
      font-size:14px;
	color:red;
	padding:20px;
}

/* **** 'color'Box ***
* only the background color for boxes. */
.grayBox { background-color:#D5D5D5; }
.redBox { background-color:#FF9999; }


/* **** rBox *** 
* Box with rounded edges, any colour but white background. Example:
   <div style="width:400px; background-color:#FFF0F0;" class="rbox">
     <div class="rbox_T"><div></div></div>
     <div class="rbox_C">
         Content Content Content Content Content Contet
     </div>
     <div class="rbox_B"><div></div></div>
   </div>

*/
div.rbox { }

.rbox .rbox_T  { 
	background: url(edge_TR.gif) no-repeat top right; 
	height:18px; 
	width:100%;
}

.rbox .rbox_T div { 
	background: url(edge_TL.gif) no-repeat top left; 
	height:18px; 
	width:100%; 
}

.rbox .rbox_B { 
	background: url(edge_BR.gif) no-repeat bottom right; 
	height:18px; 
	width:100%
}

.rbox .rbox_B div { 
	background: url(edge_BL.gif) no-repeat bottom left; 
	height:18px; 
	width:100%
}

.rbox .rbox_C { 
	margin: 0 12px; 
}




/* **** Dot table *** 
* Table with dotted lines. Example:
    <table width="700" border="0" class="dotTable">
      <tr> 
        <td width="300" >Ihre Email Adresse:</td>
        <td width="400" > 
          <input type="text" name="email" value="" size="53"/>
        </td>
      </tr>
      <tr> 
        <td align="center" class="dotTableNoLine" colspan="2" >
	   <br/><input type="submit" value="Abschicken">
	</td>
       </tr>	
    </table>
*/

.dotTable {  
	border-color: black; 
	border-style: dotted; 
	border-width: 1px; 
 	border-spacing: 0px;
	padding: 5px;
	margin-bottom:10px;
}

.dotTable td {  
	border-color: #CCCCCC; 
	border-style: dotted; 
 	border-top-width: 0px; 
	border-right-width: 0px; 
	border-bottom-width: 1px; 
	border-left-width: 0px;
	vertical-align:top;
	padding: 2px;
}
 
td.dotTableTitle {
	font-weight: bold;
      font-size:large;
	padding: 0px;
}

td.dotTableNoLine { 
	border-bottom-width: 0px; 
}

td.dotTableFooter {
	text-align: right;
      border-bottom-width: 0px;
      font-weight: bold;
}

/* **** formCell ***
* Thin dotted line only on the bottom of the current element. Also sets valign to top. 
  <div class="formLine"> text </div>
*/
td.formLine {  
	border-color: #AAAAAA; 
	border-style: dotted; 
 	border-top-width: 0px; 
	border-right-width: 0px; 
	border-bottom-width: 1px; 
	border-left-width: 0px;
	vertical-align:top;
}
