+ <!--Compact Laptops-->
+ <div class="container">
+ <h3 class="title text-center">Convertible Laptops/Tablets</h3>
+ <div class="row is-table-row">
+ <div class="good col-md-6 col-sm-6">
+ <img src="//static.fsf.org/nosvn/images/technoethical-x200t.png" alt="Technoethical convertible tablet laptop" class="center-block" />
+ <h5 class="text-center">X200t with GNU/Linux</h5>
+
+ <!-- Buy/Download Button -->
+ <a id="get-item-convertible" class="btn get-item" role="button" data-toggle="collapse" href="#sellers-convertible" aria-expanded="false" aria-controls="sellers-convertible" style="display:none">
+ BUY
+ <!-- Begin Sale -->
+ <span class="sale" >sale</span>
+ <!-- End Sale -->
+ </a>
+ <div class="collapse" id="sellers-convertible">
+ <div class="center-block seller-group">
+ <p style="color: #6b6b6b">
+ <strong>Get it from</strong>
+ </p>
+
+ <a href="https://tehnoetic.com/tet-x200t" class="seller action-button">Technoethical</a>
+ <p class="sale-info links">
+ <a href="#technoethical-promotion">Sale details.</a>
+ </p>
+ </div>
+ </div>
+
+ <script>
+ document.getElementById('get-item-convertible').style.display = '';
+ </script>
+ <noscript>
+ <div class="center-block seller-group">
+ <p style="color: #6b6b6b">
+ <strong>Get it from</strong>
+ </p>
+
+ <a href="https://tehnoetic.com/tet-x200t" class="seller action-button">Technoethical</a>
+ <p class="sale-info links">
+ <a href="#technoethical-promotion">Sale details.</a>
+ </p> </div>
+ </noscript>
+ <!-- End Buy/Download button -->
+ <ul class="pros">
+ <li>Runs the <a href="https://www.gnu.org/distros/free-distros.en.html">FSF-endorsed</a> Trisquel operating system with libreboot firmware.</li>
+ <li>Durable hardware is meant to last and is easy to repair.</li>
+ <li>Created by a small business that replaces all restrictive components from a stock laptop.</li>
+ </ul>
+
+ </div>
+ <!--End Good-->
+
+ <div class="bad col-md-6 col-sm-6">
+ <img src="//static.fsf.org/nosvn/images/microsoft-surface-blocked.png" alt="lenovo" class="center-block" />
+ <h5 class="text-center">Microsoft Surface</h5>
+ <ul class="cons">
+ <li>Runs on proprietary software that profits from treating the user as a product -- <a href="https://edri.org/microsofts-new-small-print-how-your-personal-data-abused/">each account is assigned an advertising ID</a> to help Microsoft sell user
+ data.
+ </li>
+ <li>Mandatory Windows updates force users to test potentially unstable new versions. <a href="https://www.fsf.org/campaigns/windows">Read more about Windows's abuses.</a></li>
+ </ul>
+ </div>
+ <!--End Bad-->
+ </div>
+ <!--End Row-->
+ </div>
+ <!--End Container-->
+