html, body {
  /* background-color: #aab; */
  background: url('../img/bg2.jpg') repeat;
  margin: 0px;
  padding: 0px;
}

.ctr {
  text-align: center;
}

#container {
  background-color: transparent;
  width: 750px;
  margin: auto;
  padding: 0;
  position: relative;
}



#title img {
  text-decoration: none;
  border: outset 4px #ffa ;
}

#footer {
  background-color: #248;
  bottom: 2px;
  color: white;
  font: 0.7em/1em sans-serif;
  margin: 20px 0 10px 0;
  padding: 14px;
  text-align: center;
}


.clearfix {
  display: block;
  clear: both;
  font-size: 0;
  height: 0;
}



/* ARTICLE AND MAIN SECTIONS */

#article_section {
  background-color: transparent;
  display: block;
  float: left;
  margin: 40px 0;
  position: relative;
  left: 0;
  width: 530px;
}

#main {
  background: transparent;
  background-color: rgba(255, 255, 255, 0.6);
  border: 6px ridge #ffa;
  display: block;
  margin: 60px 0;
  position: relative;
  width: 750px;
  filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=1, StartColorStr='#99ffffff', EndColorStr='#99ffffff');
}

.article {
  background: transparent;
  border: 6px ridge #ffa;
  display: block;
  background-color: rgba(255, 255, 255, 0.6);
  filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=1, StartColorStr='#99ffffff', EndColorStr='#99ffffff');  
  margin: 0 auto 20px;
}

.article p, .article table, .article ul,
#main p, #main table, #main ul {
  font: 1em/1.4em Tahoma, Geneva, sans-serif;
  color: #224;
  padding: 10px 20px;
  text-align: justify;
}  

.article td, #main td {
  border-bottom: 1px dotted #a8a;
}

.article li, #main li {
  border-bottom: 1px dotted #a8a;
  list-style: none; 
}

.article h1, #main h1 {
  border-bottom: 3px dotted #612;
  font: bold 1.2em/1.6em Tahoma, Geneva, sans-serif;
  color: #614;
  margin: 20px 20px 20px 20px;
  padding-bottom: 5px;
  text-align: left;
  text-shadow: 2px 2px 2px #aaa;
}

.article h2, #main h2 {
  border-bottom: 2px dotted #446;
  display: inline;
  font: bold 1.1em/1.6em Tahoma, Geneva, sans-serif;
  color: #44b;
  margin: 20px 20px 0 20px;
  text-shadow: 2px 2px 2px #aaa;
}

.article img {
  float: left;
  margin: 25px 20px 15px 20px;
}

#article_section a, #main a {
  font: bold 1em/1.4em Tahoma, Geneva, sans-serif;
  color: inherit;
  text-decoration: none;
  border-bottom: 1px dotted #00f;
}

/* SPONSOR SECTION */

#sponsor_section {
  background-color: transparent;
  display: block;
  float: right;
  margin: 10px 0;
  position: relative;
  right: 0;
  width: 190px;
}

#sponsor_section p {
  margin: 5px auto;
  color: #fff;
  font: bold 0.8em "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Helvetica, sans-serif;
  text-align: center;
}

#sponsor_section p.group {
  color: #22d;
  font-size: 1.4em;
  margin-top: 30px;
}

.sponsor {
  border: 6px ridge #248;
  display: block;
  height: 140px;
  width: 180px;
  /* background-color: rgba(128, 128, 160, 0.5); */
  background-color: rgba(128, 140, 160, 0.5);
  filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=1, StartColorStr='#888892a0', EndColorStr='#888892a0');  
  overflow: hidden; 
  margin: 0 auto 15px;
}

.sponsor a:hover {
  display: block;
  background-color: rgba(108, 108, 144, 0.5);
}


/* EFFECTS */

.shadow {
  -moz-box-shadow: 5px 5px 5px #444;
  -webkit-box-shadow: 5px 5px 5px #444;
  -o-box-shadow: 5px 5px 5px #444;
  box-shadow: 5px 5px 5px #444;
}  

.radius {
  border-radius: 12px;
  -moz-border-radius: 12px;
  -webkit-border-radius: 12px;
}

.alpha {
  opacity: 0.7;
  filter:Alpha(opacity=70);
}


/* NAVIGATION  */

#nav {
  position: relative;
  top: 10px;
  display: inline;/
  width: 750px;
  z-index: 1;
}


#nav ul {
  font-family: Verdana, Geneva, sans-serif;
  font-size: 14px;
  margin: 0 0 0 10px;
  padding: 0;
  list-style: none;
  text-align: center;
}

#nav ul li {
  background: #435;
  border-radius: 4px;
  box-shadow: 3px 3px 3px #888;
  display: block;
  float: left;
  margin: 0 0 1px 2px;
  position: relative;
  width: 90px;
}

#nav li ul { 
  display: none; 
}

#nav ul li a {
  border-radius: 4px;
  box-shadow: 3px 3px 3px #888; 
  color: #ffffff;
  display: block;
  padding: 5px;
  text-decoration: none;
  white-space: nowrap;
}

#nav ul li a:hover { 
  background: #46a; 
}

#nav li:hover ul { 
  border-top: 1px solid transparent;
  display: block; 
  left: -12px;
  position: absolute;
}

#nav li:hover li { 
  float: none;
  font-size: 12px;
}

#nav li:hover a { 
  background: #46a;
 }

#nav li:hover li a:hover { 
   background: #789; 
}

