<!
DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Simple Questionnaire</title>
<style>
body {
font-family: Arial, sans-serif;
padding: 20px;
background: #F4F0FF; /* light lavender */
color: #3A2A5F; /* deep purple */
h2 {
color: #6A4BC3; /* main purple */
text-align: center;
margin-bottom: 30px;
.container {
display: flex;
gap: 30px;
align-items: flex-start;
justify-content: center;
.column {
width: 45%;
background: #FFFFFF; /* clean white */
padding: 20px;
border-radius: 12px;
border: 2px solid #C7B6FF; /* soft purple border */
box-shadow: 0 3px 8px rgba(0,0,0,0.08);
.question {
margin-bottom: 18px;
.question label {
font-weight: bold;
color: #5B3EA6; /* medium purple */
input[type="text"], textarea {
width: 90%;
border: 1px solid #B9A5F5;
background: #F7F4FF;
border-radius: 6px;
padding: 6px;
margin-top: 5px;
button {
background-color: #7D5BDE; /* bright purple */
color: white;
padding: 12px 25px;
border: none;
border-radius: 8px;
cursor: pointer;
font-size: 16px;
display: block;
margin: 25px auto;
button:hover {
background-color: #6B4BC8;
</style>
</head>
<body>
<h2>Flavoris Questionnaire</h2>
<form>
<!-- Name & Age Section -->
<div style="margin-bottom:20px; display:flex; justify-content:center; gap:20px;">
<div>
<label style="font-weight:bold; color:#5B3EA6;">Name:</label><br>
<input type="text" name="username" style="border:1px solid #B9A5F5; background:#F7F4FF;
border-radius:6px; padding:6px; width:180px;">
</div>
<div>
<label style="font-weight:bold; color:#5B3EA6;">Age:</label><br>
<input type="text" name="age" style="border:1px solid #B9A5F5; background:#F7F4FF; border-
radius:6px; padding:6px; width:80px;">
</div>
</div>
<div class="container">
<!-- LEFT COLUMN (Questions 1–4) -->
<div class="column">
<!-- Q1 -->
<div class="question">
<label>1. How excited are you to try a straw that instantly flavors your milk or drink?</label><br>
<input type="radio" name="q1" value="very"> Very excited<br>
<input type="radio" name="q1" value="excited"> Excited<br>
<input type="radio" name="q1" value="neutral"> Neutral<br>
<input type="radio" name="q1" value="notexcited"> Not excited<br>
<input type="radio" name="q1" value="notatall"> Not at all
</div>
<!-- Q2 -->
<div class="question">
<label>2. Which flavors would you love to try?</label><br>
<input type="checkbox" name="q2" value="strawberry"> Strawberry<br>
<input type="checkbox" name="q2" value="orange"> Orange<br>
<input type="checkbox" name="q2" value="chocolate"> Chocolate<br>
<input type="checkbox" name="q2" value="seasonal"> Seasonal / Limited Edition<br>
✏ Other: <input type="text" name="q2_other">
</div>
<!-- Q3 -->
<div class="question">
<label>3. How much would you pay for a pack of 5–10 Flavoris straws?</label><br>
<input type="radio" name="q3" value="under50"> Less than 50 EGP<br>
<input type="radio" name="q3" value="50-100"> 50–100 EGP<br>
<input type="radio" name="q3" value="100-150"> 100–150 EGP<br>
<input type="radio" name="q3" value="150-200"> 150–200 EGP<br>
<input type="radio" name="q3" value="200plus"> More than 200 EGP
</div>
<!-- Q4 -->
<div class="question">
<label>4. Where would you most like to buy Flavoris?</label><br>
<input type="checkbox" name="q4" value="supermarkets"> Supermarkets<br>
<input type="checkbox" name="q4" value="convenience"> Convenience stores<br>
<input type="checkbox" name="q4" value="online"> Online<br>
<input type="checkbox" name="q4" value="cafes"> Cafés / Milkshake shops<br>
<input type="checkbox" name="q4" value="school"> School / College shops<br>
✏ Other: <input type="text" name="q4_other">
</div>
</div>
<!-- RIGHT COLUMN (Questions 5–8) -->
<div class="column">
<!-- Q5 -->
<div class="question">
<label>5. Which promotions would make you try Flavoris?</label><br>
<input type="checkbox" name="q5" value="social"> Social media campaigns<br>
<input type="checkbox" name="q5" value="discounts"> Discounts / bundle offers<br>
<input type="checkbox" name="q5" value="influencers"> Celebrity / influencer
endorsements<br>
<input type="checkbox" name="q5" value="sampling"> In-store sampling / demos<br>
<input type="checkbox" name="q5" value="ads"> TV / online ads
</div>
<!-- Q6 -->
<div class="question">
<label>6. How likely are you to recommend Flavoris to friends?</label><br>
<input type="radio" name="q6" value="verylikely"> Very likely<br>
<input type="radio" name="q6" value="likely"> ⭐ Likely<br>
<input type="radio" name="q6" value="neutral"> ⚪ Neutral<br>
<input type="radio" name="q6" value="unlikely"> ❌ Unlikely<br>
<input type="radio" name="q6" value="veryunlikely"> ❌ Very unlikely
</div>
<!-- Q7 -->
<div class="question">
<label>7. What do you like most about Flavoris?</label><br>
<input type="checkbox" name="q7" value="instant"> ✨ Instant flavor<br>
<input type="checkbox" name="q7" value="variety"> Variety of flavors<br>
<input type="checkbox" name="q7" value="fun"> Fun experience<br>
<input type="checkbox" name="q7" value="eco"> Eco-friendly / reusable<br>
✏ Other: <input type="text" name="q7_other">
</div>
<!-- Q8 -->
<div class="question">
<label>8. What could make Flavoris better or more appealing to you?</label><br>
<input type="checkbox" name="q8" value="moreflavors"> More flavor options<br>
<input type="checkbox" name="q8" value="cheaper"> Cheaper price<br>
<input type="checkbox" name="q8" value="availability"> Easier availability<br>
<input type="checkbox" name="q8" value="packaging"> Premium packaging<br>
✏ Other: <input type="text" name="q8_other">
</div>
</div>
</div>
<button type="submit">Submit</button>
</form>
</body>
</html>