/* general */

body{
  background: #111 url('./pics/menu-bg.jpg') repeat-x top;
}

/* header */

#menu{



}

#menu ul{
  width: 910px;
  margin: auto;
}

#menu ul li{
  display: inline;
}

#menu ul li a{
  height: 20px;
  display: block;
  float: left;
  margin: 10px 15px 5px 15px;
  padding: 10px;
  color: white;
  width: 80px;
  text-align: center;

  color: #555;
  font-family: sans-serif;
}

#menu ul li a:hover{
  text-decoration: none;
  font-weight: bold;
}


#menu ul li a.active{
  margin-bottom: 0px;
  padding-bottom: 15px;
  font-weight: bold;
  
}

#menu ul li a.active:hover{
  text-decoration: none;
  cursor: default;
}

/* 2005 */

#menu.y2005{
  background: url('./pics/line-white.png') repeat-x bottom;
}

#menu ul li.y2005 a{
  background: url('./pics/button-white.png');
}

#menu ul li.y2005 a:hover{
  background: url('./pics/button-active-white.png');
  color: #FFF;

}

#menu ul li.y2005 a.active{
  background: url('./pics/button-active-white.png');
  color: #FFF;
}



/* 2006 */

#menu.y2006{
  background: url('./pics/line-blue.png') repeat-x bottom;
}

#menu ul li.y2006 a{
  background: url('./pics/button-blue.png');
}

#menu ul li.y2006 a:hover{
  background: url('./pics/button-active-blue.png');
  color: #1e90ff;
}

#menu ul li.y2006 a.active{
  background: url('./pics/button-active-blue.png');
  color: #1e90ff;
}

/* 2007 */

#menu.y2007{
  background: url('./pics/line-red.png') repeat-x bottom;
}

#menu ul li.y2007 a{
  background: url('./pics/button-red.png');
}

#menu ul li.y2007 a:hover{
  background: url('./pics/button-active-red.png');
  color: #F00;

}

#menu ul li.y2007 a.active{
  background: url('./pics/button-active-red.png');
  color: #F00;
}

/* 2008 */

#menu.y2008{
  background:  url('./pics/line-green.png') repeat-x bottom;
}

#menu ul li.y2008 a{
  background: url('./pics/button-green.png');
}

#menu ul li.y2008 a:hover{
  background: url('./pics/button-active-green.png');
  color: #0F0;
}

#menu ul li.y2008 a.active{
  background: url('./pics/button-active-green.png');
  color: #0F0;
}

/* 2009 */

#menu.y2009{
  background: url('./pics/line-yellow.png') repeat-x bottom;
}

#menu ul li.y2009 a{
  background: url('./pics/button-yellow.png');
}

#menu ul li.y2009 a:hover{
  background: url('./pics/button-active-yellow.png');
  color: yellow;
}

#menu ul li.y2009 a.active{
  background: url('./pics/button-active-yellow.png');
  color: yellow;
}

/* 2010 */

#menu.y2010{
  background: url('./pics/line-orange.png') repeat-x bottom;
}

#menu ul li.y2010 a{
  background: url('./pics/button-orange.png');
}

#menu ul li.y2010 a:hover{
  background: url('./pics/button-active-orange.png');
  color: #F60;

}

#menu ul li.y2010 a.active{
  background: url('./pics/button-active-orange.png');
  color: #F60;
}

/* 2011 */

#menu.y2011{
  background: url('./pics/line-white.png') repeat-x bottom;
}

#menu ul li.y2011 a{
  background: url('./pics/button-white.png');
}

#menu ul li.y2011 a:hover{
  background: url('./pics/button-active-white.png');
  color: #FFF;

}

#menu ul li.y2011 a.active{
  background: url('./pics/button-active-white.png');
  color: #FFF;
}

/* main */

#main{
  margin: auto;
  width: 900px;
}

#menu2{
  float: left;
  width: 180px;
  padding: 30px 10px;
}

#menu2 img{
  margin-bottom: 15px;
}

#menu2 li{
  display: block;
  margin: 15px;
  list-style-type: none;
}

#menu2 li a{
  font-weight: bold;
  padding: 5px;
  display: block;
  margin-left: 5px;
}

#menu2 li a:hover{
  text-decoration: none;
  margin-left: 0px;
}

#menu2.y2005 li a{
  color: white;
}

#menu2.y2005 li a:hover{
  border-left: 5px solid white; 
}

#menu2.y2006 li a{
  color: #1e90ff;
}

#menu2.y2006 li a:hover{
  border-left: 5px solid #1e90ff; 
}

#menu2.y2007 li a{
  color: red;
}

#menu2.y2007 li a:hover{
  border-left: 5px solid red; 
}

#menu2.y2008 li a{
  color: #0F0;
}

#menu2.y2008 li a:hover{
  border-left: 5px solid #0F0; 
}

#menu2.y2009 li a{
  color: yellow;
}

#menu2.y2009 li a:hover{
  border-left: 5px solid yellow; 
}

#menu2.y2010 li a{
  color: #F60;
}

#menu2.y2010 li a:hover{
  border-left: 5px solid #F60;
}

#menu2.y2011 li a{
  color: white;
}

#menu2.y2011 li a:hover{
  border-left: 5px solid white; 
} 

#content{
  float: left;
  width: 700px;
  margin: 20px 0px;  
}

#content #middle{
  padding: 0px 30px;
}

#content #top, #content #bottom{
  height: 20px;
}

#content.y2005 #top{
  background: url('./pics/content-top-white.png') no-repeat top;  
}

#content.y2005 #middle{
  background: url('./pics/content-middle-white.png') repeat-y;
}

#content.y2005 #bottom{
  background: url('./pics/content-bottom-white.png') no-repeat bottom;
}

#content.y2006 #top{
  background: url('./pics/content-top-blue.png') no-repeat top;  
}

#content.y2006 #middle{
  background: url('./pics/content-middle-blue.png') repeat-y;
}

#content.y2006 #bottom{
  background: url('./pics/content-bottom-blue.png') no-repeat bottom;
}

#content.y2007 #top{
  background: url('./pics/content-top-red.png') no-repeat top;  
}

#content.y2007 #middle{
  background: url('./pics/content-middle-red.png') repeat-y;
}

#content.y2007 #bottom{
  background: url('./pics/content-bottom-red.png') no-repeat bottom;
}

#content.y2008 #top{
  background: url('./pics/content-top-green.png') no-repeat top;  
}

#content.y2008 #middle{
  background: url('./pics/content-middle-green.png') repeat-y;
}

#content.y2008 #bottom{
  background: url('./pics/content-bottom-green.png') no-repeat bottom;
}

#content.y2009 #top{
  background: url('./pics/content-top-yellow.png') no-repeat top;  
}

#content.y2009 #middle{
  background: url('./pics/content-middle-yellow.png') repeat-y;
}

#content.y2009 #bottom{
  background: url('./pics/content-bottom-yellow.png') no-repeat bottom;
}

#content.y2010 #top{
  background: url('./pics/content-top-orange.png') no-repeat top;  
}

#content.y2010 #middle{
  background: url('./pics/content-middle-orange.png') repeat-y;
}

#content.y2010 #bottom{
  background: url('./pics/content-bottom-orange.png') no-repeat bottom;
}

#content.y2011 #top{
  background: url('./pics/content-top-white.png') no-repeat top;  
}

#content.y2011 #middle{
  background: url('./pics/content-middle-white.png') repeat-y;
}

#content.y2011 #bottom{
  background: url('./pics/content-bottom-white.png') no-repeat bottom;
}

#footer{
  text-align: right;
  margin-bottom: 20px;
}

#footer.y2005{
  color: white;
}

#footer.y2006{
  color: #1e90ff;
}

#footer.y2007{
  color: red;
}

#footer.y2008{
  color: #0F0;
}

#footer.y2009{
  color: yellow;
}

#footer.y2010{
  color: #F60;
}

#footer.y2011{
  color: white;
}


