// intro
document.querySelector('#btn-action-menu').addEventListener ('click', function () {
  document.querySelector('#action-menu').className = 'current';
  document.querySelector('[data-position="current"]').className = 'left';

});

document.querySelector('#btn-buttons-backs').addEventListener ('click', function () {
  document.querySelector('#action-menu').className = 'right';
  document.querySelector('[data-position="current"]').className = 'current';
});

//defntions

document.querySelector('#btn-buttons').addEventListener ('click', function () {
   document.querySelector('#buttons').className = 'current';
  document.querySelector('[data-position="current"]').className = 'left';

});
document.querySelector('#btn-buttons-back').addEventListener ('click', function () {
  document.querySelector('#buttons').className = 'right';
  document.querySelector('[data-position="current"]').className = 'current';
});



//cause
document.querySelector('#cause').addEventListener ('click', function () {
   document.querySelector('#cause-note').className = 'current';
  document.querySelector('[data-position="current"]').className = 'left';

});

document.querySelector('#cause-back').addEventListener ('click', function () {
  document.querySelector('#cause-note').className = 'right';
  document.querySelector('[data-position="current"]').className = 'current';
});

//symptom
document.querySelector('#symp-buttons').addEventListener ('click', function () {
   document.querySelector('#symp-notes').className = 'current';
  document.querySelector('[data-position="current"]').className = 'left';

});
document.querySelector('#symp-buttons-back').addEventListener ('click', function () {
  document.querySelector('#symp-notes').className = 'right';
  document.querySelector('[data-position="current"]').className = 'current';
});

//remedy
document.querySelector('#rem-buttons').addEventListener ('click', function () {
   document.querySelector('#rem-notes').className = 'current';
  document.querySelector('[data-position="current"]').className = 'left';

});
document.querySelector('#rem-buttons-back').addEventListener ('click', function () {
  document.querySelector('#rem-notes').className = 'right';
  document.querySelector('[data-position="current"]').className = 'current';
});

//diet
document.querySelector('#diet-buttons').addEventListener ('click', function () {
   document.querySelector('#diet-notes').className = 'current';
  document.querySelector('[data-position="current"]').className = 'left';

});
document.querySelector('#diet-buttons-back').addEventListener ('click', function () {
  document.querySelector('#diet-notes').className = 'right';
  document.querySelector('[data-position="current"]').className = 'current';
});

//food
document.querySelector('#food-buttons').addEventListener ('click', function () {
   document.querySelector('#food-notes').className = 'current';
  document.querySelector('[data-position="current"]').className = 'left';

});
document.querySelector('#food-buttons-back').addEventListener ('click', function () {
  document.querySelector('#food-notes').className = 'right';
  document.querySelector('[data-position="current"]').className = 'current';
});

//Exercise
document.querySelector('#exe-buttons').addEventListener ('click', function () {
   document.querySelector('#exe-notes').className = 'current';
  document.querySelector('[data-position="current"]').className = 'left';

});
document.querySelector('#exe-buttons-back').addEventListener ('click', function () {
  document.querySelector('#exe-notes').className = 'right';
  document.querySelector('[data-position="current"]').className = 'current';
});

//color
document.querySelector('#mycolors-buttons').addEventListener ('click', function () {
   document.querySelector('#mycolors-notes').className = 'current';
  document.querySelector('[data-position="current"]').className = 'left';

});
document.querySelector('#mycolors-button-back').addEventListener ('click', function () {
  document.querySelector('#mycolors-notes').className = 'right';
  document.querySelector('[data-position="current"]').className = 'current';
});

//note
document.querySelector('#notes-buttons').addEventListener ('click', function () {
   document.querySelector('#note-notes').className = 'current';
  document.querySelector('[data-position="current"]').className = 'left';

});
document.querySelector('#note-buttons-back').addEventListener ('click', function () {
  document.querySelector('#note-notes').className = 'right';
  document.querySelector('[data-position="current"]').className = 'current';
});


