/* css bar graph */
    .bargraph_act_subj {     
          height: 148px;/*height of actual papergrid_2.jpg*/ 
          position: relative; 
          background:  url(images_ogt/supporting/papergrid_2.jpg) repeat-x; 
          filter:alpha(opacity=100);		  
          border-left: 1px solid #d4d4d4;
          margin: 5px auto 0px;
    }

    .bargraph_act_subj ul.bars {
        margin: 0; 
        padding: 0; 
        /* getting rid of bullets */
        list-style-type: none;
    }

    .bargraph_act_subj ul.olympic-watermark {
        background: url(http://pics.cssbakery.com/pics/orings.png) no-repeat;
        background-position: 50% 50%;
        height: 122px; /* IE fix */
        z-index: 98; 
    }

    .bargraph_act_subj ul.euro-watermark {
        background: url(http://pics.cssbakery.com/pics/sapphire5.png) no-repeat;
        height: 201px; /* IE fix was 164*/
        background-position: 0 0;
    }
   
    .bargraph_act_subj ul.stars-watermark {
        background: url(images_ogt/supporting/ga_ogt_v1.fw.png) no-repeat;
        background-position:right bottom;
        height: 104px; /* IE fix */
    }
	
	.bargraph_act_subj ul.stars-watermark-small {
        background: url(images_ogt/supporting/ga_ogt_v2.fw.png) no-repeat;
        background-position:right bottom;
        height: 104px; /* IE fix */
    }

    div.bargraph_act_subj div.colorfilter {
        position: absolute;
        top: 0; left: 0;
        height: 201px;/*201*/
        background-color: black;
        opacity:0.2;  filter:alpha(opacity=20);
        z-index: 97;
    
    }

    div.bargraph_act_subj div.colorfilter2 {
        position: absolute;
        top: 0; left: 0;
        height: 201px;/* 201 */
        background-color: black;
        opacity:0.4;  filter:alpha(opacity=40);
        z-index: 97;
    
    }

    .bargraph_act_subj ul.bars li {  
        position: absolute; 
        width: 40px; 
        height: 160px; 
        /*move it up from bottom label*/
        bottom: 18px; 
        padding: 0; 
        margin: 0; 
        background: url(images_ogt/supporting/bars300.jpg) no-repeat;
		filter:alpha(opacity=100);
        text-align: center; 
        font-weight: bold; 
        color: black; 
        line-height: 2.5em;
        font-family: "Trebuchet MS",Verdana,Arial,Helvetica,sans-serif;
        font-size: 9.5px; /* font on graphs */ /* prior to 4/3 9.5px */
        z-index: 99;
    }

   
    .bargraph_act_subj ul.bars li span {
        position: relative;
        top: -20px;
        color: black;
     }
    .bargraph_act_subj ul.bars li img {        
           margin: 0; padding: 0;
           position: relative;
           top: -71px;
           left: 0;
    }

    .bargraph_act_subj ul.bars li span.darkpen {
        color: #515151;
        position: static;
    }
    .bargraph_act_subj ul.bars li span.whitepen {
        color: white;
        top: 0px;
    }

    .bargraph_act_subj ul.bars li.bar1 { left: 1px;  }  
    .bargraph_act_subj ul.bars li.bar2 { left: 30px; }  
    .bargraph_act_subj ul.bars li.bar3 { left: 50px; }    
    .bargraph_act_subj ul.bars li.bar4 { left: 87px; }
    .bargraph_act_subj ul.bars li.bar5 { left: 100px; }
    .bargraph_act_subj ul.bars li.bar6 { left: 376px; }
    .bargraph_act_subj ul.bars li.bar7 { left: 449px; }
    .bargraph_act_subj ul.bars li.bar8 { left: 522px; }
    .bargraph_act_subj ul.bars li.bar9 { left: 605px; }
	
	/*  prior to 4/3
    .bargraph_act_subj ul.bars li.bar1 { left: 1px;  }  
    .bargraph_act_subj ul.bars li.bar2 { left: 30px; }  
    .bargraph_act_subj ul.bars li.bar3 { left: 59px; }    
    .bargraph_act_subj ul.bars li.bar4 { left: 87px; }
    .bargraph_act_subj ul.bars li.bar5 { left: 116px; }
    .bargraph_act_subj ul.bars li.bar6 { left: 376px; }
    .bargraph_act_subj ul.bars li.bar7 { left: 449px; }
    .bargraph_act_subj ul.bars li.bar8 { left: 522px; }
    .bargraph_act_subj ul.bars li.bar9 { left: 605px; }	
	*/
	

    /* bottom means 100% in background-position */
    .bargraph_act_subj ul.bars li.bluebar  { background-position: 0px bottom; }
    .bargraph_act_subj ul.bars li.redbar   { background-position: -30px bottom; }  
    .bargraph_act_subj ul.bars li.greenbar { background-position: -60px bottom; }
    .bargraph_act_subj ul.bars li.orangebar  {  background-position: -90px bottom; }
    .bargraph_act_subj ul.bars li.grapebar   {  background-position: -120px bottom; }
    .bargraph_act_subj ul.bars li.purplebar  {  background-position: -150px bottom; }
    .bargraph_act_subj ul.bars li.crimsonbar {  background-position: -180px bottom; }
    .bargraph_act_subj ul.bars li.navybar    {  background-position: -210px bottom; }
    .bargraph_act_subj ul.bars li.goldbar    {  background-position: -240px bottom; }
    .bargraph_act_subj ul.bars li.tealbar    {  background-position: -270px bottom; }

    .label_m { list-style-type: none; 
             position: absolute; bottom: 3px; 
             margin: 0; padding: 0; }
    .label_m li { 
        color: white; 
        text-transform: uppercase; 
        letter-spacing: 0.1em;
        font-size: 11px; 
		/* changed from 25px to 40px to increase the space between years */
        width: 48px; 
       
        float: left;
        text-align: center;

       /*safeguard against a label that is too long - if they type
          that in from the HTML
        */
        overflow: hidden;

        font-family: "Trebuchet MS",Verdana,Arial,Helvetica,sans-serif;
        line-height: 1em;
    }


    ul.y-axis_m {
	list-style-type: none;
	position: absolute;
	/*
                  positioning the ul box - the box that goes 
                  around the list, 100, 75,... */
	left: -45px;
	/*  changed from 40px to 60px   */
	width: 40px;
	text-align: right;
	bottom: 4px; /* positions the y axis labels higher on the graph */
	margin: 0;
	padding: 0;
    }

    ul.y-axis_m li:first-child {
         height: 20px;
         line-height: 8px; /* positions the top l */
    }

    ul.y-axis_m li { 
        color: #aba8a8;  
        font-size: 8px;
        height: 31px;
        line-height: 25px;
        text-align: right;
    }

    ul.y-axis_m li.units {
        position: absolute;
        bottom: 110px;
        right: 20px;
        line-height: 1.2em;
        height: auto;
    }
  /*labeling of the graph*/
  .bargraph_act_subj  p { 
                position: absolute; 
                left: 0; 
                top: 149px; /*236 */
                
                padding: 0; 
                margin:0; 
                text-align: left; 
     
                width: 100%;
                font-family: Verdana, sans-serif;
                font-size: 10px; color: black;
                line-height: 1.3em;
                
              }
   .bargraph_act_subj p.centered { text-align: center; }

   /* end of css bar graph */