/***
Met deze css wordt de menubar, die in de html NA de main komt links van de main gezet.
Het correct positioneren gebeurd in 4 stappen. Om de breedtes aan te passen, begin bij stap één en doorloop de css stap voor stap.
Om het menu aan de rechterkant te plaatsen, gebruik de menuright.css. Doe dit door de pagina's te baseren op de menuright.master masterpage.*/

/*
1. laat de menubar en de main naar links floaten
*/
#twocol-menubar, #twocol-main
{
  float:left;
}

/*
2. bepaal de breedte van de menubar en van de main
*/
#twocol-menubar
{
  width : 184px;
}

#twocol-main
{
  width : 696px;
}

/*
3.  reserveer aan de linkerkant van de main ruimte voor de menubar. Doe dit met de margin-left.
    Gebruik hier de volgende formule voor:
      
      #main{margin-left} = #menubar{width} + #main{gewenste margin-left}
    
    Waarbij de #main{gewenste margin-left} de spacing tussen de menubar en de main is.
*/
#twocol-main
{
  margin-left : 214px;  /*184px + 30px*/
}

/*
4.  Verplaats de menubar nu zover naar links, dat hij in de zojuist gecreerde ruimte terecht komt.
    Ook dit doe je met margin-left, gebruik hier de volgende formule voor:
    
      #menubar{margin-left} = 0 - #main{margin-left} - #main{width}
    
    Waarbij #main{margin-left} de zojuist (bij punt 3) opgegeven margin-left is.
*/
#twocol-menubar
{
  margin-left       : -910px; /*0 - 214px - 696px*/
}