givingguide.html

   1 <!DOCTYPE html>
   2 <html>
   3         <head>
   4
   5                 <title> 2014 Holiday Giving Guide | Free Software Foundation | Working together for free software </title>
   6
   7                 <meta charset="UTF-8">
   8
   9                 <!--FIXME: Is this necessary?-->
  10                 <link rel="copyright" title="Copyright information" href="http://creativecommons.org/licenses/by-nd/3.0/rdf">
  11                 <link rel="author" title="Author information" href="http://www.fsf.org/about/staff">
  12
  13                 <!--Stylesheets-->
  14                 <link rel="stylesheet" type="text/css" href="reset.css">
  15                 <link rel="stylesheet" type="text/css" href="stylesheet.css">
  16
  17         </head>
  18
  19         <body>
  20                 <div class="header">
  21                         <div class="header_wrapper">
  22                                         <div class="navbar_wrapper">
  23                                                 <span class="logo_wrapper">
  24                                                         <a href="https://www.fsf.org/"><img class="logo" src="images/logo.png" alt="logo" /></a>
  25                                                 </span>
  26
  27                                                 <div class="navbar">
  28                                                         <ul>
  29                                                                 <li><a href="https://www.fsf.org/about/">About the FSF</a></li>
  30                                                                 <li><a href="https://www.fsf.org/campaigns/">Campaigns</a></li>
  31                                                                 <li><a href="https://www.fsf.org/licensing/">Software Licensing</a></li>
  32                                                                 <li><a href="http://shop.fsf.org/">Shop</a></li>
  33                                                         </ul>
  34                                                 </div>
  35
  36                                                 <span class="share_wrapper">
  37                                                         <a href="https://fsf.org/share"><img class="share" src="images/share.png" alt="share" /></a>
  38                                                 </span>
  39
  40                                                 <span class="join_wrapper">
  41                                                         <a href="http://fsf.org/jfb"><img class="join" src="images/join.png" alt="join" /></a>
  42                                                 </span>
  43                                         </div>
  44
  45                                 <div class="intro">
  46
  47                                         <div class="intro_img">
  48                                                 <img src="images/banner.png" alt="Giving Guide" />
  49                                         </div>
  50                                         <div class="intro_wrapper">
  51                                                 <h2>Are you giving your loved ones holiday gifts they can use freely?</h2>
  52                                                 <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In vitae nisl
  53                                                         et lacus vestibulum scelerisque. Fusce vitae vestibulum mauris, quis
  54                                                         eleifend turpis. Mauris placerat laoreet nisi, nec pellentesque magna
  55                                                         gravida id. Nulla nisi est, auctor in arcu eu, sodales condimentum elit.
  56                                                         Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam vel
  57                                                         gravida risus, non porttitor nibh. Suspendisse mattis maximus mauris,
  58                                                         ut ullamcorper turpis commodo non. Aenean a condimentum quam, ac finibus
  59                                                         erat. Duis iaculis iaculis diam, sit amet rutrum nisl lobortis ut.
  60                                                         Sed accumsan dolor id lectus pretium, at semper tellus dictum. Proin
  61                                                         fringilla efficitur justo, et posuere metus aliquam vestibulum.
  62                                                         Vivamus ullamcorper nulla in urna mollis, a bibendum erat tempus.
  63                                                         Integer luctus neque non magna aliquam congue. Nullam gravida
  64                                                         lectus urna, ut vulputate elit lobortis non.
  65                                                 </p>
  66
  67                                                 </div>
  68                                 </div>
  69                         </div>
  70                 </div>
  71
  72                 <!--We compare different products from here-->
  73
  74                                 <div class="comparisons">
  75                                                 <div class="section_wrapper">
  76                                                         <h3 class="main_title">Operating System: Give the gift of free, flexible, and ethical computing</h3>
  77
  78                                                         <div class="free">
  79                                                                 <div class="product">
  80                                                                         <img class="good" src="images/good.png" alt="good"/>
  81                                                                         <img class="product_img" src="images/linux.png" alt="Linux"/>
  82                                                                 </div>
  83
  84                                                                 <h4 class="title">Fedora</h4>
  85                                                                 <ul>
  86                                                                         <li>Completely free operating system: transparent and modifiable</li>
  87                                                                         <li>Break the cycle of forced upgrades and planned obsolescence</li>
  88                                                                         <li>Comes with all the software you need and an easy software manager to find more.</li>
  89                                                                 </ul>
  90
  91                                                                 <div class="buy">
  92
  93                                                                         <a href="http://fedoraproject.org/"><img src="images/download.png" alt="Download" /></a>
  94
  95                                                                 </div>
  96
  97                                                         </div>
  98
  99                                                         <div class="proprietary">
 100                                                                 <div class="product">
 101                                                                         <img class="bad" src="images/bad.png" alt="bad"/>
 102                                                                         <img class="product_img" src="images/windows.png" alt="Windows"/>
 103                                                                 </div>
 104
 105                                                                 <h4 class="title">Windows</h4>
 106                                                                 <ul>
 107                                                                         <li>Proprietary software that profits from controlling how you use your computer</li>
 108                                                                         <li>Invades privacy and exposes personal data to Microsoft, <a href="http://www.theguardian.com/world/2013/sep/05/nsa-how-to-remain-secure-surveillance">the NSA</a>, and other malicious attackers</li>
 109                                                                         <li>Dependent on mandatory upgrades and devices that don't support older versions of Windows</li>
 110                                                                 </ul>
 111
 112                                                                 <div class="avoid">
 113
 114                                                                         <img src="images/avoid.png" alt="avoid" />
 115
 116                                                                 </div>
 117                                                         </div>
 118                                                 </div>
 119                                         </div>
 120
 121                                         <div class="comparisons">
 122                                                 <div class="section_wrapper">
 123                                                         <h3 class="main_title">Operating System: Give the gift of free, flexible, and ethical computing</h3>
 124
 125                                                         <div class="free">
 126                                                                 <div class="product">
 127                                                                         <img class="good" src="images/good.png" alt="good"/>
 128                                                                         <img class="product_img" src="images/linux.png" alt="Linux"/>
 129                                                                 </div>
 130
 131                                                                 <h4 class="title">Fedora</h4>
 132                                                                 <ul>
 133                                                                         <li>Completely free operating system: transparent and modifiable</li>
 134                                                                         <li>Break the cycle of forced upgrades and planned obsolescence</li>
 135                                                                         <li>Comes with all the software you need and an easy software manager to find more.</li>
 136                                                                 </ul>
 137
 138                                                                 <div class="buy">
 139
 140                                                                         <a href="http://fedoraproject.org/"><img src="images/buy.png" alt="Buy" /></a>
 141
 142                                                                 </div>
 143
 144                                                         </div>
 145
 146                                                         <div class="proprietary">
 147                                                                 <div class="product">
 148                                                                         <img class="bad" src="images/bad.png" alt="bad"/>
 149                                                                         <img class="product_img" src="images/windows.png" alt="Windows"/>
 150                                                                 </div>
 151
 152                                                                 <h4 class="title">Windows</h4>
 153                                                                 <ul>
 154                                                                         <li>Proprietary software that profits from controlling how you use your computer</li>
 155                                                                         <li>Invades privacy and exposes personal data to Microsoft, <a href="http://www.theguardian.com/world/2013/sep/05/nsa-how-to-remain-secure-surveillance">the NSA</a>, and other malicious attackers</li>
 156                                                                         <li>Dependent on mandatory upgrades and devices that don't support older versions of Windows</li>
 157                                                                 </ul>
 158
 159                                                                 <div class="avoid">
 160
 161                                                                         <img src="images/avoid.png" alt="avoid" />
 162
 163                                                                 </div>
 164                                                         </div>
 165                                                 </div>
 166                                 </div>
 167
 168                                 <div class="comparisons">
 169                                         <div class="section_wrapper">
 170                                                 <h3 class="main_title">Operating System: Give the gift of free, flexible, and ethical computing</h3>
 171
 172                                                 <div class="free">
 173                                                         <div class="product">
 174                                                                 <img class="good" src="images/good.png" alt="good"/>
 175                                                                 <img class="product_img" src="images/linux.png" alt="Linux"/>
 176                                                         </div>
 177
 178                                                         <h4 class="title">Fedora</h4>
 179                                                         <ul>
 180                                                                 <li>Completely free operating system: transparent and modifiable</li>
 181                                                                 <li>Break the cycle of forced upgrades and planned obsolescence</li>
 182                                                                 <li>Comes with all the software you need and an easy software manager to find more.</li>
 183                                                         </ul>
 184
 185                                                         <div class="buy">
 186
 187                                                                 <a href="http://fedoraproject.org/"><img src="images/download.png" alt="Download" /></a>
 188
 189                                                         </div>
 190
 191                                                 </div>
 192
 193                                                 <div class="proprietary">
 194                                                         <div class="product">
 195                                                                 <img class="bad" src="images/bad.png" alt="bad"/>
 196                                                                 <img class="product_img" src="images/windows.png" alt="Windows"/>
 197                                                         </div>
 198
 199                                                         <h4 class="title">Windows</h4>
 200                                                         <ul>
 201                                                                 <li>Proprietary software that profits from controlling how you use your computer</li>
 202                                                                 <li>Invades privacy and exposes personal data to Microsoft, <a href="http://www.theguardian.com/world/2013/sep/05/nsa-how-to-remain-secure-surveillance">the NSA</a>, and other malicious attackers</li>
 203                                                                 <li>Dependent on mandatory upgrades and devices that don't support older versions of Windows</li>
 204                                                         </ul>
 205
 206                                                         <div class="avoid">
 207
 208                                                                 <img src="images/avoid.png" alt="avoid" />
 209
 210                                                         </div>
 211                                                 </div>
 212                                         </div>
 213                         </div>
 214
 215                         <div class="recommended">
 216                                 <h3 class="recommend_title">Recomended Products</h3>
 217
 218                                 <div class="recommend_wrapper">
 219                                         <div class="recommended_product">
 220                                                 <img class="recommended_product_img" src="images/Linux.png" alt="Linux"/>
 221                                                 <h4 class="title">Fedora</h4>
 222                                                 <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
 223                                                 <div class="buy">
 224                                                         <a href="http://fedoraproject.org/"><img src="images/buy.png" alt="Buy" /></a>
 225                                                 </div>
 226                                         </div>
 227
 228                                         <div class="recommended_product">
 229                                                 <img class="recommended_product_img" src="images/Linux.png" alt="Linux"/>
 230                                                 <h4 class="title">Fedora</h4>
 231                                                 <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
 232                                                 <div class="buy">
 233                                                         <a href="http://fedoraproject.org/"><img src="images/download.png" alt="Download" /></a>
 234                                                 </div>
 235                                         </div>
 236
 237                                         <div class="recommended_product">
 238                                                 <img class="recommended_product_img" src="images/Linux.png" alt="Linux"/>
 239                                                 <h4 class="title">Fedora</h4>
 240                                                 <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
 241                                                 <div class="buy">
 242                                                         <a href="http://fedoraproject.org/"><img src="images/buy.png" alt="Buy" /></a>
 243                                                 </div>
 244                                         </div>
 245                                 </div>
 246
 247                                 <div class="recommend_wrapper">
 248                                         <div class="recommended_product">
 249                                                 <img class="recommended_product_img" src="images/Linux.png" alt="Linux"/>
 250                                                 <h4 class="title">Fedora</h4>
 251                                                 <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
 252                                                 <div class="buy">
 253                                                         <a href="http://fedoraproject.org/"><img src="images/buy.png" alt="Buy" /></a>
 254                                                 </div>
 255                                         </div>
 256
 257                                         <div class="recommended_product">
 258                                                 <img class="recommended_product_img" src="images/Linux.png" alt="Linux"/>
 259                                                 <h4 class="title">Fedora</h4>
 260                                                 <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
 261                                                 <div class="buy">
 262                                                         <a href="http://fedoraproject.org/"><img src="images/download.png" alt="Download" /></a>
 263                                                 </div>
 264                                         </div>
 265
 266                                         <div class="recommended_product">
 267                                                 <img class="recommended_product_img" src="images/Linux.png" alt="Linux"/>
 268                                                 <h4 class="title">Fedora</h4>
 269                                                 <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
 270                                                 <div class="buy">
 271                                                         <a href="http://fedoraproject.org/"><img src="images/buy.png" alt="Buy" /></a>
 272                                                 </div>
 273                                         </div>
 274                                 </div>
 275                         </div>
 276
 277         </body>
 278
 279         <footer>
 280
 281
 282         </footer>
 283 </html>