// show mobile menu onclick

document.getElementById("icon").addEventListener("click", function menu() {
    var x = document.getElementById("md");
    if (x.style.display === "none") {
        x.style.display = "flex";}
        else {
            x.style.display ="none";
        }
    }
)

// show experiments submenu

document.getElementById("chevron_1").addEventListener("click", function menu() {
    var x= document.getElementById("down_1");
    if (x.style.display === "none") {
        x.style.display = "flex";}
        else {
            x.style.display ="none";
        }
    }
)

// permaculture submenu

document.getElementById("chevron_2").addEventListener("click", function menu() {
    var x= document.getElementById("down_2");
    if (x.style.display === "none") {
        x.style.display = "flex";}
        else {
            x.style.display ="none";
        }
    }
)

// greentech submenu

document.getElementById("chevron_3").addEventListener("click", function menu() {
    var x= document.getElementById("down_3");
    if (x.style.display === "none") {
        x.style.display = "flex";}
        else {
            x.style.display ="none";
        }
    }
)

// spiderpi submenu

document.getElementById("chevron_4").addEventListener("click", function menu() {
    var x= document.getElementById("down_4");
    if (x.style.display === "none") {
        x.style.display = "flex";}
        else {
            x.style.display ="none";
        }
    }
)

// about submenu

document.getElementById("chevron_5").addEventListener("click", function menu() {
    var x= document.getElementById("down_5");
    if (x.style.display === "none") {
        x.style.display = "flex";}
        else {
            x.style.display ="none";
        }
    }
)




















  
// this function shows an element by id

function show() {
    var x= document.getElementById("information");
    if (x.style.display === "none") {
        x.style.display = "flex"; }
        else {
            x.style.display ="none";
        }
    }
//this function shows element2 by id -to be generalized

function display() {
    var x= document.getElementById("footer-links");
    if (x.style.display === "none") {
        x.style.display = "flex";}
        else {
            x.style.display ="none";
        }
    }