<script type="text/javascript" src="js/bonaquiz.js"></script>
</head>
<body>
-<!--<div id="background" data-section="home">-->
-<!-- <div id="projector">-->
-<!---->
-<!-- </div>-->
-<!--</div>-->
-<!--<section class="home">-->
-<!-- <h1>The Bona 100‑year</h1>-->
-<!-- <h2>anniversary quiz</h2>-->
-<!-- <h3>Think you know Bona?<br>Put it to the test by taking part in our short quiz.</h3>-->
-<!-- <a href="#" class="button">Start</a>-->
-<!-- <img src="images/logohome.svg" class="logo"/>-->
-<!--</section>-->
+<div id="background" data-section="home"style="display: none">
+ <div id="projector">
+
+ </div>
+</div>
+<section class="home"style="display: none">
+ <h1>The Bona 100‑year</h1>
+ <h2>anniversary quiz</h2>
+ <h3>Think you know Bona?<br>Put it to the test by taking part in our short quiz.</h3>
+ <a href="#" class="button">Start</a>
+ <img src="images/logohome.svg" class="logo"/>
+</section>
<!-- **************************************** SECTION QUESTION 1 *******************************-------------->
-<!--<div id="background" class="backgroundQuestion" >-->
-<!-- <div id="projector">-->
-<!---->
-<!-- </div>-->
-<!--</div>-->
-<!--<section class="home questions">-->
-<!-- <h4 id="questionNumber">Question 1/10</h4>-->
-<!---->
-<!-- <h4 id="questionAsk">What kind of business was Bona founder Wilhelm Edner <br>-->
-<!-- running when he started to sell floor wax ?</h4>-->
-<!-- <ul>-->
-<!-- <li class="questions__list"><div class="questions__list--circle">-->
-<!-- <span class="questions__list--letter">A</span>-->
-<!-- </div>-->
-<!-- <span class="questions__list--text">Pharmacy</span>-->
-<!-- </li>-->
-<!-- <li class="questions__list">-->
-<!-- <div class="questions__list--circle">-->
-<!-- <span class="questions__list--letter">B</span>-->
-<!-- </div>-->
-<!-- <span class="questions__list--text">Coffee and grocer</span>-->
-<!-- </li>-->
-<!-- <li class="questions__list">-->
-<!-- <div class="questions__list--circle">-->
-<!-- <span class="questions__list--letter">C</span>-->
-<!-- </div>-->
-<!-- <span class="questions__list--text">Shoe shop</span>-->
-<!-- </li>-->
-<!-- </ul>-->
-<!---->
-<!-- <div class="progressbar"></div>-->
-<!--</section>-->
+<div id="background" class="backgroundQuestion"style="display: none" >
+ <div id="projector">
+
+ </div>
+</div>
+<section class="home questions"style="display: none">
+ <h4 id="questionNumber">Question 1/10</h4>
+
+ <h4 id="questionAsk">What kind of business was Bona founder Wilhelm Edner <br>
+ running when he started to sell floor wax ?</h4>
+ <ul>
+ <li class="questions__list"><div class="questions__list--circle">
+ <span class="questions__list--letter">A</span>
+ </div>
+ <span class="questions__list--text">Pharmacy</span>
+ </li>
+ <li class="questions__list">
+ <div class="questions__list--circle">
+ <span class="questions__list--letter">B</span>
+ </div>
+ <span class="questions__list--text">Coffee and grocer</span>
+ </li>
+ <li class="questions__list">
+ <div class="questions__list--circle">
+ <span class="questions__list--letter">C</span>
+ </div>
+ <span class="questions__list--text">Shoe shop</span>
+ </li>
+ </ul>
+
+ <div class="progressbar"></div>
+</section>
<!-- **************************** SECTION 2 QUESTION1 REPONSE ********************-->
-<!--<div id="background" class="backgroundQuestion" >-->
-<!-- <div id="projector">-->
-<!---->
-<!-- </div>-->
-<!--</div>-->
-<!--<section class="home questions">-->
-<!-- <h4 id="questionNumber">Question 1/10</h4>-->
-<!---->
-<!-- <h4 id="questionAsk">What kind of business was Bona founder Wilhelm Edner <br>-->
-<!-- running when he started to sell floor wax ?</h4>-->
-<!---->
-<!-- <span class="correctInfo">Correct answer : </span>-->
-<!---->
-<!-- <ul>-->
-<!-- <li class="questions__list correctAnswer">-->
-<!-- <div class="questions__list--circle">-->
-<!-- <span class="questions__list--letter">B</span>-->
-<!-- </div>-->
-<!-- <span class="questions__list--text">Coffee and grocer</span>-->
-<!-- </li>-->
-<!-- </ul>-->
-<!---->
-<!-- <p class="response"> Wilhelm had a passion for coffee, which had been hard to come by during the previous war years.-->
-<!-- Floor wax was part of a wide range of products he offered through his general grocer business.</p>-->
-<!---->
-<!-- <a href="#" class="button next">Next</a>-->
-<!---->
-<!-- <div class="progressbar"></div>-->
-<!--</section>-->
+<div id="background" class="backgroundQuestion" style="display: none">
+ <div id="projector">
+
+ </div>
+</div>
+<section class="home questions"style="display: none">
+ <h4 id="questionNumber">Question 1/10</h4>
+
+ <h4 id="questionAsk">What kind of business was Bona founder Wilhelm Edner <br>
+ running when he started to sell floor wax ?</h4>
+
+ <span class="correctInfo">Correct answer : </span>
+
+ <ul>
+ <li class="questions__list correctAnswer">
+ <div class="questions__list--circle">
+ <span class="questions__list--letter">B</span>
+ </div>
+ <span class="questions__list--text">Coffee and grocer</span>
+ </li>
+ </ul>
+
+ <p class="response"> Wilhelm had a passion for coffee, which had been hard to come by during the previous war years.
+ Floor wax was part of a wide range of products he offered through his general grocer business.</p>
+
+ <a href="#" class="button next">Next</a>
+
+ <div class="progressbar"></div>
+</section>
<!-- ********************************* SECTION 3 QUESTION 2 **********************************-->
<!---->
-<!--<div id="background" class="backgroundQuestion" >-->
-<!-- <div id="projector">-->
-<!---->
-<!-- </div>-->
-<!--</div>-->
-<!--<section class=" questions">-->
-<!-- <h4 id="questionNumber">Question 2/10</h4>-->
-<!---->
-<!-- <h4 id="questionAsk">Which photo is the Austrian Chancellor's Office, Vienna, where-->
-<!-- we had the opportunity to bring out the beauty in the floor?</h4>-->
-<!-- <ul class="circleContainer">-->
-<!-- <span>-->
-<!-- <li class="questionsCircle " style="background-image: url('images/1-min.jpg')">-->
-<!-- <div class="questionsCircle__container">-->
-<!-- <span class="questionsCircle__container--letter">A</span>-->
-<!-- </div>-->
-<!-- </li>-->
-<!---->
-<!-- <li class="questionsCircle " style="background-image: url('images/2-min.jpg')">-->
-<!-- <div class="questionsCircle__container">-->
-<!-- <span class="questionsCircle__container--letter">B</span>-->
-<!-- </div>-->
-<!-- </li>-->
-<!-- </span>-->
-<!-- <span>-->
-<!-- <li class="questionsCircle " style="background-image: url('images/3-min.jpg')">-->
-<!-- <div class="questionsCircle__container">-->
-<!-- <span class="questionsCircle__container--letter">C</span>-->
-<!-- </div>-->
-<!-- </li>-->
-<!---->
-<!-- <li class="questionsCircle " style="background-image: url('images/4-min.jpg')">-->
-<!-- <div class="questionsCircle__container">-->
-<!-- <span class="questionsCircle__container--letter">D</span>-->
-<!-- </div>-->
-<!-- </li>-->
-<!-- </span>-->
-<!-- </ul>-->
-<!---->
-<!-- <div class="progressbar"></div>-->
-<!--</section>-->
+<div id="background" class="backgroundQuestion" style="display: none">
+ <div id="projector">
+
+ </div>
+</div>
+<section class=" questions"style="display: none">
+ <h4 id="questionNumber">Question 2/10</h4>
+
+ <h4 id="questionAsk">Which photo is the Austrian Chancellor's Office, Vienna, where
+ we had the opportunity to bring out the beauty in the floor?</h4>
+ <ul class="circleContainer">
+ <span>
+ <li class="questionsCircle " style="background-image: url('images/1-min.jpg')">
+ <div class="questionsCircle__container">
+ <span class="questionsCircle__container--letter">A</span>
+ </div>
+ </li>
+
+ <li class="questionsCircle " style="background-image: url('images/2-min.jpg')">
+ <div class="questionsCircle__container">
+ <span class="questionsCircle__container--letter">B</span>
+ </div>
+ </li>
+ </span>
+ <span>
+ <li class="questionsCircle " style="background-image: url('images/3-min.jpg')">
+ <div class="questionsCircle__container">
+ <span class="questionsCircle__container--letter">C</span>
+ </div>
+ </li>
+
+ <li class="questionsCircle " style="background-image: url('images/4-min.jpg')">
+ <div class="questionsCircle__container">
+ <span class="questionsCircle__container--letter">D</span>
+ </div>
+ </li>
+ </span>
+ </ul>
+
+ <div class="progressbar"></div>
+</section>
<!-- ************************* SECTION 4 QUESTION 2 REPONSE *****************************-->
<!---->
-<!--<div id="background" class="backgroundQuestion" >-->
-<!-- <div id="projector">-->
-<!---->
-<!-- </div>-->
-<!--</div>-->
-<!--<section class=" questions">-->
-<!-- <h4 id="questionNumber">Question 2/10</h4>-->
-<!---->
-<!-- <h4 id="questionAsk">Which photo is the Austrian Chancellor's Office, Vienna, where-->
-<!-- we had the opportunity to bring out the beauty in the floor?</h4>-->
-<!---->
-<!-- <span class="correctInfo">Correct answer : </span>-->
-<!---->
-<!-- <ul class="circleContainer">-->
-<!-- <span>-->
-<!-- <li class="questionsCircle answerCircle" style="background-image: url('images/4-min.jpg')">-->
-<!-- <div class="questionsCircle__container">-->
-<!-- <span class="questionsCircle__container--letter">D</span>-->
-<!-- </div>-->
-<!-- </li>-->
-<!-- </span>-->
-<!-- </ul>-->
-<!-- <a href="#" class="button next">Next</a>-->
-<!-- <div class="progressbar"></div>-->
-<!--</section>-->
+<div id="background" class="backgroundQuestion" style="display: none">
+ <div id="projector">
+
+ </div>
+</div>
+<section class=" questions" style="display: none">
+ <h4 id="questionNumber">Question 2/10</h4>
+
+ <h4 id="questionAsk">Which photo is the Austrian Chancellor's Office, Vienna, where
+ we had the opportunity to bring out the beauty in the floor?</h4>
+
+ <span class="correctInfo">Correct answer : </span>
+
+ <ul class="circleContainer">
+ <span>
+ <li class="questionsCircle answerCircle" style="background-image: url('images/4-min.jpg')">
+ <div class="questionsCircle__container">
+ <span class="questionsCircle__container--letter">D</span>
+ </div>
+ </li>
+ </span>
+ </ul>
+ <a href="#" class="button next">Next</a>
+ <div class="progressbar"></div>
+</section>
<!-- *************************************** SECTION 5 RESULTS **********************************-->
projects / bonaquiz.git / commitdiff