html, body
{ 
margin:0; 
padding:0; 
border:0;
}

body
{
margin:10px 0;
text-align:left; 
font-family:Trebuchet MS, Verdana, arial, sans-serif; 
font-size:14px; 
color:#000; 
background:#F2F2F2; 
}

p
{
margin:2px 20px;
padding-top:5px;
font-style:normal;
}

h1
{
color:navy;
font-family:Trebuchet MS, Verdana, arial, sans-serif; 
font-size:20x;
margin;4px 30px;
text-align:left;
padding:10px 0 0 20px;
font-weight:bold;
}

h2, h3, h4, h5
{
margin;4px 30px;
text-align:center;
padding:0;
font-weight:bold;
}

a, a:visited
{
text-decoration:underline;
color: navy;
}

a:hover
{
text-decoration:underline;
color:red;
} 

#wrapper
{ 
background:#fff;
width:780px;
border-top:1px solid #000;
border-right:1px solid #000;
border-bottom:1px solid #000;
border-left:1px solid #000;
text-align:left;  
margin-left:auto; 
margin-right:auto;  
} 

#header
{
display:block; 
height:151px; 
background:url(../images/header_webconference.jpg) #fff;
background-position:top center;
background-repeat:no-repeat;
margin:0 auto;
margin-top:5px;
margin-bottom:5px;
}

* html #header
{margin-top:10px;}

#header h1
{
color:navy;
font-family:georgia, times new roman, times, courier, serif;
font-size:30px;
text-align:center;
padding:30px 0 0 30px;
}

#articlelist
{
margin:2px 20px;
padding-top:5px;
font-style:normal;
}

#keywordmenu A {
  font-weight: bold;
  font-size: 9px;
  color: #282824;
  text-decoration: none;  
}

#keywordmenu A:hover {
  color: #FF0000;
  text-decoration: underline;
}

#maincol
{
background-color:#fff;
border-right:2px solid #fff;  
float:left; 
display:inline; 
position:relative; 
width:580px; 
}

#maincolgooglead
{
background-color:#fff;
float:right; 
position:relative; 
width:340px; 
}

#rightcol
{
background-color:#fff;
width:198px;
float:right; 
position:relative; 
}

#menu ul
{
margin:20;
padding:0;
font-weight:bold;
list-style-image:url('../images/c1.jpg');
list-style-position: outside
}

#menu li
{
margin:20;
padding:10;
font-weight:bold;
border-top:10px solid #fff;
}

#menu a, #menu a:visited
{
text-decoration:none;
text-align:center;
font-weight:bold;
color:#282824;
margin:2;
font-size:11px;
padding:10;
}

#menu a:hover
{
color:#FF0000;
text-decoration:underline;
}

#sidemenu a, #sidemenu a:visited 
{
  position:relative;
  font-size: 12px;
  text-decoration:none; 
  text-align:left; 
  background-color:#fff; 
  color:navy; 
  font-weight:bold;
  display:block; 
  width:95%; 
  border-bottom:1px solid #000; /* add a 1px black border around items */ 
  padding:15px 0;
  margin:0 0;
}

#sidemenu a:hover 
{
color:#ff0000; 
background:#fff;
text-decoration:underline;
}


#footer
{
padding-top:5px;
height:25px;
background:navy;
clear:both;
color:#fff;
font-size:11px;
font-weight:bold;
text-align:center;
}

#footer a, #footer a:visited
{
text-decoration:underline;
color:#fff;
}

#footer a:hover
{
text-decoration:underline;
color:red;
}

.center
{
text-align:center;
}

.clear
{clear:both;}

/* fixes clearing of the floating elements on maincol and leftcol */ 

.clearfix:after /* :after is a pseudo-element that inserts something after an element.  So, after content: which is defined as "." it will clear the columns by displaying a "block of text that has a height of 0", clears any content that is floating, and is effectively hidden from view */
{
content: "."; 
display:block; 
height:0; 
clear:both; 
visibility:hidden;
}
 
.clearfix
{display:inline-table;}

/* Hides from IE-mac \*/
* html .clearfix
{height:1%;}

.clearfix
{display:block;}
/* End hide from IE-mac */  

.breadcrumb
{
font-family:Trebuchet MS, Verdana, Helvetica, sans-serif;
font-size:14px;
font-weight:bold;
}

.breadcrumb a{
background: transparent url(breadcrumb.gif) no-repeat center right;
text-decoration: none;
padding-right: 18px; /*adjust bullet image padding*/
color: navy;
}

.breadcrumb a:visited, .breadcrumb a:active{
color: navy;
}

.breadcrumb a:hover{
text-decoration: underline;
color:red
}