body  {
background: #F4F4F4;
margin: 0;
}

#container { 
width: 780px;
margin: 0 auto;
background: #FFFFFF;
}

#header { 
padding: 45px 0 20px 40px;
} 

#header a {
color: #b88932;
text-decoration: none;
font-size: 35px; 
font-family: "Myriad Pro", "Arial Narrow";
}

#menu {
background-color: #b88932; 
padding: 6px 0 6px 40px;
}

#menu a {
color: #ffffff;
text-decoration: none; 
font-size: 14px; 
font-family: "Arial Narrow", "Myriad Pro";
}

#menu a:hover {
color: #ecf2f3;
}

#sidebar {
float: left;
width: 120px;
padding: 30px 0 0 40px;
margin: 0;
}

h1 {
margin: 0px;
color: #3b7687; 
font-size:24px; 
font-family: "Arial Narrow", "Myriad Pro"; 
font-weight: normal;
}

h2 {
color: #3b7687;
font-size: 15px; 
margin: 20px 0 5px 0;
}

#main { 
margin: 0 0 0 40px;
padding: 35px 40px 30px 0;
color: #333333;
font-family: "Calibri";
font-size: 18px; 
line-height: 24px;
text-align: justify;
} 

#main a {
color: #d18d23;
text-decoration: none;
}

#main a:hover {
color: #888888;
}

#footer {
padding: 6px 40px 6px 40px;
background: #b88932; 
font-family: "Lucida Sans Unicode";
color: #ffffff;
font-size: 11px;
text-align: right;
}

#footer a {
text-decoration: none; 
color: #ffffff;
}

#footer a:hover {
color: #ecf2f3;
}

.separator {
font-size:11px;
color:#FFFFFF;
}


.tooltip {
  position: relative;
  display: inline-block;
  border-bottom: 2px dotted black;
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 700px;
  background-color: #666;
  color: #fff;
  text-align: justify;
  border-radius: 6px;
  padding: 15px 15px;
  position: absolute;
  z-index: 1;
  top: 35px;
  left: -250px;
  margin-left: 10px;
  opacity: 0;
  transition: opacity 0.3s;
}

.tooltip .tooltiptext::after {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 50%;
  margin-left: -5px;
  border-width: 5px;
  border-style: solid;
  border-color: transparent transparent #555 transparent;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
  opacity: 1;
}