#chartContainer 
{
    width: 300px;
    margin: 20px 0 0 10px;
}  

.chart-container.article620 {
    float:left;
    height: 280px;
    width: 300px; 
    margin-bottom: 5px;    
}

.chart-container.article300 {
    height: 280px;
    width: 300px;
    margin-bottom: 5px;
    float:left;
}      
/* 36 pixel padding added onto 620px to allow for the padding of the charts */
@media screen and (min-width: 656px)
{
    #chartContainer {
        width: 620px;
    }                 
    .chart-container.article620 {
        height: 560px;
        width: 620px;
    }
    .chart-container.article300 {
        float: left;
    }      
}  
        
@media screen and (min-width: 976px)
{
    #chartContainer {
        width: 940px;
    }        

    .chart-container.article620 {
        height: 560px;
        width: 620px;
    }
    .chart-container.article300 {
        float: right;
    }       
}  