add new help section

index.html

@@ -113,7 +113,7 @@ <h2>Compatibility</h2>
         </div>
       </div>
       <div class="info" id="faq">
-        <h2>FAQ</h2>
+        <h2>FAQ and common problems</h2>
         <div class="card text-card">
           <div>
             <button class="collapsible-toggle">I purchased BrightIntosh, but it keeps asking me to sign in with my Apple
@@ -124,6 +124,27 @@ <h2>FAQ</h2>
               </p>
             </div>
           </div>
+          <div>
+            <button class="collapsible-toggle">The increased brightness stops working immediatly</button>
+            <div class="collapsible-content">
+              <p>There might be multiple reasons for this issue. Please check the following:</p>
+              <ul>
+                <li><strong>Are you using <a
+                      href="https://justgetflux.com/news/pages/macquickstart/">f.lux</a>?</strong> BrightIntosh
+                  and f.lux
+                  cannot run simultaneously because they override each other's adjusted display settings.</li>
+                <li>
+                  <strong>Is your device compatible?</strong> Please check the <a
+                    href="#compatibility">compatibility</a> section.
+                </li>
+                <li>
+                  <strong>Did your free trial expire?</strong> Please purchase BrightIntosh from the App Store to unlock
+                  the unrestricted
+                  version.
+                </li>
+              </ul>
+            </div>
+          </div>
           <div>
             <button class="collapsible-toggle">The store in the settings window loads forever</button>
             <div class="collapsible-content">