window.addEvent('domready', function() {
  
   // Toggle Grid
  var grid = new Fx.Slide('grid').hide(); //creates new Fx.Slide object from grid div
  $('toggle-grid').addEvent('click', function(e) { //Adds an onClick event to toggle-grid div
    e = new Event(e);
      grid.toggle(); //toggles the div
    if ($('toggle-grid').hasClass('hidden')){
      $('toggle-grid').removeClass('hidden').addClass('visible');
    }
    else {
      $('toggle-grid').removeClass('visible').addClass('hidden');
    }
    e.stop(); //this makes sure that the user wont be sent to given url (or that the page refreshes when using dummy url like "#") if the clicked element was a link 
  });

   // Toggle List Items thai
  var listitems = new Fx.Slide('list-items-thai');
  $('toggle-list-items-thai').addEvent('click', function(e) {
    e = new Event(e);
      listitems.toggle();
    if ($('toggle-list-items-thai').hasClass('hidden')){
      $('toggle-list-items-thai').removeClass('hidden').addClass('visible');
    }
    else {
      $('toggle-list-items-thai').removeClass('visible').addClass('hidden');
    }
    e.stop(); 
  });
  // Toggle List Items viet
  var listitemsviet = new Fx.Slide('list-items-viet');
  $('toggle-list-items-viet').addEvent('click', function(e) {
    e = new Event(e);
      listitemsviet.toggle();
    if ($('toggle-list-items-viet').hasClass('hidden')){
      $('toggle-list-items-viet').removeClass('hidden').addClass('visible');
    }
    else {
      $('toggle-list-items-viet').removeClass('visible').addClass('hidden');
    }
    e.stop(); 
  });
  // Toggle List Items guad
  var listitemsguad = new Fx.Slide('list-items-guad');
  $('toggle-list-items-guad').addEvent('click', function(e) {
    e = new Event(e);
      listitemsguad.toggle();
    if ($('toggle-list-items-guad').hasClass('hidden')){
      $('toggle-list-items-guad').removeClass('hidden').addClass('visible');
    }
    else {
      $('toggle-list-items-guad').removeClass('visible').addClass('hidden');
    }
    e.stop(); 
  });
    // Toggle List Items mart
  var listitemsmart = new Fx.Slide('list-items-mart');
  $('toggle-list-items-mart').addEvent('click', function(e) {
    e = new Event(e);
      listitemsmart.toggle();
    if ($('toggle-list-items-mart').hasClass('hidden')){
      $('toggle-list-items-mart').removeClass('hidden').addClass('visible');
    }
    else {
      $('toggle-list-items-mart').removeClass('visible').addClass('hidden');
    }
    e.stop(); 
  });

});