/* -----------------------------------------------------------------------

                               site_main.css

  This is the main style sheet for the VdGSA web site. There are also patch
  files for IE6 and IE7, and some pages have dedicated style cheets.

  Colour chart: 
     body background                : #f6f3f2  (almost white)
     body text                      : #333332  (a sort of gray )
     links                          : #b82025  (sort of red)
     yellow areas                   : #fcd431
     selected menu items background : #d6d2cf (light gray)
     menu hover background          : #e8e8e8 (lighter than selected menu item)
     menu borders                   : black
  
------------------------------------------------------------------------- */   


* {
  margin        : 0;
  padding       : 0;
}

body {
  background-color  : #F6F3F2;
  background-image  : url(/img/background.gif);
  font-family       : Helvetica, sans-serif;
  font-size         : 1em;
  line-height       : 1.2em;
  color             : #333332;
  background-repeat : repeat-x;
}

p {
  margin-top : 1.2em;
}

.clear_floats {
  clear : both;
}

a {
  color: #b82025; 
  text-decoration : none;
}

a:active {
  outline : none;  /* to prevent dotted outline in FireFox */
}

a:hover{
  text-decoration : underline;
}

a:focus {
-moz-outline-style: none;   /* to prevent dotted outline in FireFox */
}


#container {
  width : 860px;
}

/*                          - - -  Left side of pages : logo and menu  - - -                     */

#left_side {
  width            : 207px;
  background-color : #fcd431;
  float            : left;
}

#menu_area {
  width            : 207px;
  font-size        : 65%;
  line-height      : 0.9em;
  height           : 350px;
  margin-top       : 35px;
  color            : #333332;
}

#menu_area a:link{
  color            : #333332;
}

#menu_area a:visited {
  color            : #333332;
}
 

.mainmenu{
  width            : 96px;
  margin-left      : 7px;
  margin-bottom    : 20px;
  float            : left;
  border-bottom    : 1px solid black;
}


/* styling for main menu items */

.mmIdle, .mmSelected {
  width            : 84px;
  padding-left     : 5px;
  padding-right    : 5px;
  padding-top      : 5px;
  padding-bottom   : 5px;
  font-weight      : bold;
  overflow         : hidden;
  text-align       : right;
/*  border           : 1px solid #fcd431;*/
  border-top           : 1px solid black;
  border-right           : 1px solid black;
  border-left           : 1px solid black;
}


.mmSelected {
  background-color : #d6d2cf; 
/*  border           : 1px solid black; */

}

.mmIdle:hover {
  /*text-decoration  : underline;*/
  background-color : #e8e8e8; 

}


.submenu{
  width            : 96px;
  margin-left      : -1px;
  margin-bottom    : 20px;
  border-bottom    : 1px solid black;
  overflow         : hidden;
  float            : left;
}

/* styling for submenu items */

.smSelected, .smIdle {
  width            : 84px;
  padding-left     : 5px;
  padding-right    : 5px;
  padding-top      : 5px;
  padding-bottom   : 5px; 
  border-top       : 1px solid black;
  border-right     : 1px solid black;
  border-left      : 1px solid black;
  font-weight      : bold;
  overflow         : hidden;
  text-align       : left;
}



.smIdle:hover {
  background-color : #e8e8e8; 
}


/* styling for selected submenu item */

.smSelected {
  background-color : #d6d2cf;
}


/* styles for sub-menus */

#m1, #m2, #m3, #m4, #m5, #m6, #m7 {
  text-align : left;
  display    : none;
  position   : relative;
}

#m2{top: 21px;}

#m3{top: 43px;}

#m4{top: 64px;}

#m5{top: 95px;}

#m6{top: 115px;}

#m7{top: 135px;}

#copyright {
  width : 199px;
  padding-top : 20px;
  padding-left : 4px;
  padding-right : 4px;
  padding-bottom : 8px;
  text-align : center;
  font-size : 10px; 
}

/*                              --- Right side of pages : content ---                      */


#right_side {
  width      : 653px; 
  float      : left;
  margin-top : 60px; 
}

.main_title {
  position      : relative;
  right         : -118px;
  margin-bottom : 10px;
}


/* -- Styling for top menu -- */

#top_menu_background_1 {
  margin-top       : -6px;
  margin-left      : 0px;
  width            : 544px;
  padding          : 0px;
  background-color : #fcd431;
}

#top_menu_background_2 {
  margin-top       : 2px;
  margin-left      : 0px;
  width            : 544px;
  padding          : 0px;
  background-color : #fcd431;
}

.top_menu_left {
  margin-top       : 0px;
  list-style       : none;
}

.top_menu_left li {
   display          : inline; /* needed for IE6 */
   list-style-type  : none;
}

.top_menu_left li a {
   background-color : #FCD431;
   color            : #231F20;
   padding-left     : 6px;
   padding-right    : 6px;
   padding-top      : 5px;
   padding-bottom   : 5px;
   float            : left;
   border-top       : 0;
   border-right     : 2px solid #231F20;
   font-size        : 80%; 
   line-height      : 0.9em; 
 }


.top_menu_left li a:hover {
  background-color : #ebebeb;
  text-decoration  : underline;
  cursor           : pointer;
}   

.top_menu_right {
  margin-top       : 0px;
  float            : right;
  list-style       : none;
}

.top_menu_right li {
   display          : inline; /* needed for IE6 */
   list-style-type  : none;
}

.top_menu_right li a {
   background-color : #FCD431;
   color            : #231F20;
   padding-left     : 6px;
   padding-right    : 6px;
   padding-top      : 5px;
   padding-bottom   : 5px;
   float            : right;
   border-top       : 0;
   border-right     : 2px solid #231F20;
   font-size        : 80%; 
   line-height      : 0.9em; 
 }


.top_menu_right li a:hover {
  background-color  : #ebebeb;
  text-decoration   : underline;
  cursor            : pointer;
}   

.top_menu_right .rmi a {
  border-right      : 0px;
}

 .top_menu_right .tmSelected a {
  background-color : #d6d2cf;
}

 .top_menu_left .tmSelected a {
  background-color : #d6d2cf;
}


/* -- end of top menu styling -- */   


#content_top_spacer {
  margin-top : 4em;
}


#content {
  position    : relative;
  margin      : 0px;
  border-top  : 6px solid #fcd431;
  width       : 544px;
  right       : -40px;
  text-align  : justify;
  font-size   : 90%; 
}


.on_page_links {
  text-align    : right;
  margin-top    : 15px;
  margin-bottom : 20px;
  font-size     : 120%;
  line-height   : 160%;
  font-weight   : bold;
}

h1 {
  font-size     : 130%;
  font-weight   : normal;
}

h2 {
  font-size     : 100%;
  font-weight   : bold;
}

h60 {
  font-size     : 60%;
  font-weight   : normal;
}

.table0 {
  border-collapse : collapse;
}

.table0 th {
  background-color : #d6d2cf;
  border           : 1px solid #d5c890;
  color            : #333332;
  padding          : 0.3em;
  font-weight      : normal;
}

.table0 td {
  background-color : #e8deb3;
  border           : 1px solid #d5c890;
  text-align       : left;
  padding          : 0.3em;
}

.table1 {
  border-collapse : collapse;
}

.table1 th {
  background-color : #fcd431;
  border           : 1px solid #222222;
  color            : #333332;
  padding          : 0.3em;
  font-weight      : normal;
}

.table1 td {
  background-color : #d6d2cf;
  border           : 1px solid #222222;
  text-align       : left;
  padding          : 0.3em;
}

.on_page_links a:link {color : #b82025;}
.on_page_links a:visited {color : #b82025;}
.on_page_links a:active {color : #b82025;}
.on_page_links a:hover {color : #b82025;}


/*                              --- Rooting-bars : gold and black at bottom of page ---                      */

#bottom_gold {
  position       : relative;
  margin         : 0px;
  border-bottom  : 6px solid #fcd431;
  width          : 544px;
  left           : 248px;
  height         : 75px;
}

#bottom_black {
  height         : 100px;
  width          : 980px;
  border-top     : 2px solid black;
}

#popup_bottom_gold {
  position       : relative;
  margin         : 0px;
  border-bottom  : 6px solid #fcd431;
  width          : 544px;
  left           : 40px;
  height         : 75px;
}

#popup_bottom_black {
  height         : 100px;
  width          : 653px;
  border-top     : 2px solid black;
}

