<!DOCTYPE html>
<html lang="en">
<head>
        <meta charset="utf-8">
        <title>Just Enough Browsing</title>
        <style type="text/css">
        html {
                background-color: fuchsia;
                font-size: 72pt;
                color: white;
        }
        p.texts {
                font-size: 36pt;
        }
        </style>
        <script type="text/javascript">
        var showing = true;
        function togglePhrase() {
                var phrase = document.getElementById("phrase");
                if (showing) {
                        phrase.style.visibility = "hidden";
                } else {
                        phrase.style.visibility = "visible";
                }
                showing = !showing;
        }
        
        console.log("*=*=*=*=*=*=*=*=*= just enough browsing");
        setInterval(togglePhrase, 1000);
        var useFuchsia = false;
        function clickedItem(mouseEvent) {
          if (mouseEvent.target.id == "click_me") {
            var body = document.body;
            if (useFuchsia) {
              body.style.backgroundColor = "fuchsia";
            } else {
              body.style.backgroundColor = "turquoise";
            }
            useFuchsia = !useFuchsia;
          }
        }
        window.addEventListener("click", clickedItem, false);
        </script>
</head>
<body>
        <div>
        Just Enough Browsing
        <div>
        <img src="IMG_6285.jpg" alt="raz">
        <input type="button" name="click_me" value="Click Me" id="click_me">
        <div id="phrase">
        Is starting to live...
        <div>
</body>
</html>