Multiple fixes, updated the Guidelines
authorReda Lazri <the.red.shortcut@gmail.com>
Sat, 10 Sep 2016 14:26:03 +0000 (15:26 +0100)
committerReda Lazri <the.red.shortcut@gmail.com>
Sat, 10 Sep 2016 14:26:03 +0000 (15:26 +0100)
19 files changed:
Guidelines.md
css/master.css
givingguide.html
img/charities/eff.png
img/favicons/android-icon-192x192.png [new file with mode: 0644]
img/favicons/apple-icon-114x114.png [new file with mode: 0644]
img/favicons/apple-icon-120x120.png [new file with mode: 0644]
img/favicons/apple-icon-144x144.png [new file with mode: 0644]
img/favicons/apple-icon-152x152.png [new file with mode: 0644]
img/favicons/apple-icon-180x180.png [new file with mode: 0644]
img/favicons/apple-icon-57x57.png [new file with mode: 0644]
img/favicons/apple-icon-60x60.png [new file with mode: 0644]
img/favicons/apple-icon-72x72.png [new file with mode: 0644]
img/favicons/apple-icon-76x76.png [new file with mode: 0644]
img/favicons/favicon-16x16.png [new file with mode: 0644]
img/favicons/favicon-32x32.png [new file with mode: 0644]
img/favicons/favicon-96x96.png [new file with mode: 0644]
img/favicons/ms-icon-144x144.png [new file with mode: 0644]
js/magic.js

index 0b2447b151d3ca999a8632d70526e9d9a9b7727c..4b43c6a6064c2781836b6ff8468093bc085d25de 100644 (file)
@@ -1,12 +1,20 @@
-#Guidelines for future use
+# Guidelines for future use
 ---
-##Images:
+## Images:
 
-* If it's a logo then ALWAYS export the images from its verctor source.
-* Do not put a logo next to a product or vice-versa. Always use images with the same nature (i.e. product versus product; logo versus logo)
-* Always export images and logos to a square, transparent PNG, preferably to 500px*500px. Otherwise put in in the template.png and export.
+* If it's a logo then ALWAYS export the images from its VECTOR (.svg, .eps, .pdf) source. If a vector source isn't available, use a very large image and scale it down.
 
+* Do not put a logo next to a product or vice-versa, Always use images with the same nature (i.e. product versus product; logo versus logo)
 
-##Text:
+* Charities' logos should be exported to 580px × 580px, transparent PNG
 
-* Be brief, people do not usually read long text.
+* Products' images, "good" or "naughty" should be put inside transparent, square PNG files at 350px × 350px, and a padding consistent with existing images.
+
+
+## General Best Practices
+
+* Resist the urge to add another list-element **li** to announce a SALE, a BONUS, or anything unrelated to being a PROS or CONS. Instead use the SALE triangle, and Bootstrap's *alert* (Check its documentation, or existing code if unsure)
+
+* Avoid using very long titles as they tend to wrap into multiple lines on mobile devices. Be concise.
+
+*
index 7f2eae2c85041099bc615cb6f16d434831aa5b20..7e34d77d26a8bddf3650b791f7fb781efe05e047 100644 (file)
@@ -1,6 +1,7 @@
 /*Bootstrap overrides*/
 .navbar {
   margin-bottom: 0;
+
   border: 0;
   border-radius: 0;
   background: #2caf8f;
@@ -23,6 +24,7 @@
 .navbar-default .navbar-toggle .icon-bar {
   width: 40px;
   height: 5px;
+
   border-radius: 6px;
   background-color: #ffd429;
 }
 }
 
 .alert-link {
-  border-bottom: 0;
+
 }
 
 .alert {
   border: 0;
+  margin-top: 20px;
+  max-width: 700px;
 }
 
 .alert-success {
-  background: #0AD778;
   color: #E8FBF2;
   color: rgba(255,255,255,0.9);
+  background: #dff0d9;
 }
 
 .alert-info {
-  background: #6eadf5;
   color: #F1F7FE;
   color: rgba(255,255,255,0.9);
+  background: #6eadf5;
 }
+
+/*.label-info {
+  background: #2B81E3;
+}*/
+
 /*Typography*/
 @font-face {
+  font-family: "Open Sans";
   font-weight: 400;
   font-style: normal;
-  font-family: "Open Sans";
+
   src: url("../fonts/opensans-regular-webfont.eot");
   src: url("../fonts/opensans-regular-webfont.eot?#iefix") format('embedded-opentype'), url("../fonts/opensans-regular-webfont.woff2") format('woff2'), url("../fonts/opensans-regular-webfont.woff") format('woff'), url("../fonts/opensans-regular-webfont.ttf") format('truetype');
 }
 @font-face {
+  font-family: "Open Sans Bold";
   font-weight: 700;
   font-style: normal;
-  font-family: "Open Sans Bold";
+
   src: url("../fonts/opensans-bold-webfont.eot");
   src: url("../fonts/opensans-bold-webfont.eot?#iefix") format('embedded-opentype'), url("../fonts/opensans-bold-webfont.woff2") format('woff2'), url("../fonts/opensans-bold-webfont.woff") format('woff'), url("../fonts/opensans-bold-webfont.ttf") format('truetype');
 }
 @font-face {
+  font-family: "Signika Bold";
   font-weight: 600;
   font-style: normal;
-  font-family: "Signika Bold";
+
   src: url("../fonts/signika-bold-webfont.eot");
   src: url("../fonts/signika-bold-webfont.eot?#iefix") format('embedded-opentype'), url("../fonts/signika-bold-webfont.woff2") format('woff2'), url("../fonts/signika-bold-webfont.woff") format('woff'), url("../fonts/signika-bold-webfont.ttf") format('truetype');
 }
 @font-face {
+  font-family: "Signika Light";
   font-weight: 100;
   font-style: normal;
-  font-family: "Signika Light";
+
   src: url("../fonts/signika-light-webfont.eot");
   src: url("../fonts/signika-light-webfont.eot?#iefix") format('embedded-opentype'), url("../fonts/signika-light-webfont.woff2") format('woff2'), url("../fonts/signika-light-webfont.woff") format('woff'), url("../fonts/signika-light-webfont.ttf") format('truetype');
 }
 @font-face {
+  font-family: "Signika Regular";
   font-weight: 400;
   font-style: normal;
-  font-family: "Signika Regular";
+
   src: url("../fonts/signika-regular-webfont.eot");
   src: url("../fonts/signika-regular-webfont.eot?#iefix") format('embedded-opentype'), url("../fonts/signika-regular-webfont.woff2") format('woff2'), url("../fonts/signika-regular-webfont.woff") format('woff'), url("../fonts/signika-regular-webfont.ttf") format('truetype');
 }
 h1 {
   /*margin-top: 10px;*/
   margin-bottom: 20px;
+
   color: #4B423B;
-  font-size: 35px;
+
   font-family: "Signika Light";
+  font-size: 35px;
 }
 
 h2 {
   color: #4B423B;
-  font-size: 28px;
+
   font-family: "Signika Light";
+  font-size: 28px;
 }
 
 h3 {
   color: #333;
-  font-size: 25px;
+
   font-family: "Signika Regular";
+  font-size: 25px;
 }
 
 h4 {
   color: #9b9b9b;
-  font-size: 24px;
+
   font-family: "Signika Light";
+  font-size: 24px;
 }
 
 h5 {
   color: #4a4a4a;
-  font-size: 20px;
+
   font-family: "Signika Regular";
+  font-size: 20px;
 }
 
 li,
 p {
   margin-bottom: 20px;
-  color: #1c1c1c;
+
   list-style: outside;
-  font-size: 17px;
+
+  color: #1c1c1c;
+
   font-family: "Open Sans";
+  font-size: 17px;
   line-height: 30px;
 }
 
 li {
   margin-bottom: 20px;
+
   list-style-type: disc;
 }
 
 a {
-  border-bottom: 2px solid #ffd429;
-  color: #2caf8f;
-  text-decoration: none;
   -webkit-transition: .3s all ease;
-  -moz-transition: .3s all ease;
   transition: .3s all ease;
+  text-decoration: none;
+
+  color: #2caf8f;
+  border-bottom: 2px solid #ffd429;
 }
 
 a:hover {
-  color: #0f4639;
   text-decoration: none;
+
+  color: #0f4639;
 }
 
 section {
   padding-top: 30px;
   padding-bottom: 30px;
 }
+
+/*Colorful Sections*/
+
+.smartphones  {
+  /*background-color: #80D4C9;*/
+}
+
+
 /*Header*/
 /*Navbar*/
 .icon-bar {
@@ -195,10 +228,13 @@ section {
 
 .navbar li {
   padding-top: 20px;
-  color: #9b9b9b;
+
   text-align: center;
-  font-size: 30px;
+
+  color: #9b9b9b;
+
   font-family: "Signika Regular";
+  font-size: 30px;
 }
 
 .navbar-brand {
@@ -213,6 +249,7 @@ section {
 .intro-text {
   padding-top: 20px;
   padding-bottom: 0;
+
   background: #2caf8f;
 }
 
@@ -226,6 +263,7 @@ section {
 
 .intro-text {
   padding-bottom: 40px;
+
   background: #fff;
 }
 /*Actions*/
@@ -240,76 +278,94 @@ section {
 .action-button {
   position: relative;
   bottom: 10px;
+
   margin-bottom: 30px;
   padding: 6px 35px;
+
+  color: #4B423B;
   border: 0;
   border-bottom: 0;
   border-radius: 100px;
   background: #FFD429;
-  color: #4B423B;
-  font-size: 22px;
+
   font-family: "Signika Regular";
+  font-size: 22px;
 }
 
 .action-button:hover {
-  background: #2caf8f;
   color: white;
+  background: #2caf8f;
 }
 /*Comparisons*/
 .title {
   margin-top: 40px;
   padding-bottom: 8px;
+
   background-image: url("../img/underline.svg");
-  background-position: center bottom;
   background-repeat: no-repeat;
+  background-position: center bottom;
 }
 
 .sale {
+
+  display: none; /* Remove when using*/
   position: absolute;
   top: 0;
   left: 0;
+
   width: 0;
   height: 0;
-  border-width: 113px 113px 0 0;
+
+  color: #fff;
+  border-width: 100px 100px 0 0;
   border-style: solid;
   border-color: #0AD778 transparent transparent transparent;
-  color: #fff;
 }
 
 .sale-text {
   position: absolute;
-  top: -93px;
+  top: -81px;
   left: 4px;
-  color: white;
-  text-transform: uppercase;
-  font-weight: bold;
-  font-size: 20px;
+
   -webkit-transform: rotate(-45deg);
   transform: rotate(-45deg);
+  text-transform: uppercase;
+
+  color: white;
+
+  font-size: 20px;
+  font-weight: bold;
 }
 
 .rfy {
-  position: absolute;
-  top: 44px;
-  left: -71px;
-  padding: 10px 0;
-  width: 266px;
-  border-bottom: 0;
-  background: #2B81E3;
-  color: #fff;
-  text-align: center;
+  /*text-align: center;*/
   text-decoration: underline;
   text-transform: uppercase;
-  font-weight: 700;
+  /*background: #2B81E3;*/
+
+  color: #fff;
+  /*position: absolute;*/
+  /*top: 44px;*/
+  /*left: -71px;*/
+  /*padding: 10px 0;*/
+  /*width: 266px;*/
+  border-bottom: 0;
+
   font-size: 14px;
-  -webkit-transform: rotate(-45deg);
-  -moz-transform: rotate(-45deg);
-  transform: rotate(-45deg);
+  font-weight: 700;
+  /*-webkit-transform: rotate(-45deg);*/
+  /*-moz-transform: rotate(-45deg);*/
+  /*transform: rotate(-45deg);*/
+}
+
+.rfy-line {
+  background-image: none !important;
 }
 
 .bad,
 .good {
   overflow: hidden;
+
   margin-top: 30px;
   padding-top: 30px;
   padding-bottom: 30px;
@@ -318,8 +374,8 @@ section {
 .bad {
   background-color: transparent;
   background-image: url("../img/bad-pattern.png");
-  background-size: 40px;
   background-repeat: repeat;
+  background-size: 40px;
 }
 
 .pros li {
@@ -342,29 +398,41 @@ li.neutral {
 .cons li,
 .pros li {
   padding-left: 30px;
-  background-repeat: no-repeat;
+
   list-style: none;
+
+  background-repeat: no-repeat;
 }
 
 .bad img,
 .good img {
-  margin-bottom: 20px;
   width: 250px;
   height: 250px;
+  margin-bottom: 20px;
 }
 
 .get-item {
-  margin: 0 auto 13px;
-  padding: 4px 35px;
-  width: 140px;
-  border-bottom: 0;
-  border-radius: 100px;
-  background: #2B81E3;
-  color: white;
+  position: absolute;
+  right: 20px;
+  bottom: 6px;
+
+  width: 60px;
+  height: 60px;
+  /*margin: 0 auto 5px;*/
+  padding: 15px 11px;
+
   text-align: center;
+  vertical-align: middle;
   text-decoration: none;
-  font-size: 24px;
+
+  color: white;
+  border-bottom: 0;
+  border-radius: 50%;
+  background: #2B81E3;
+  box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.25);
+
   font-family: "Signika Regular";
+  font-size: 21px;
 }
 
 .get-item:active,
@@ -373,9 +441,10 @@ li.neutral {
 .rfy:active,
 .rfy:focus,
 .rfy:hover {
-  background: #6eadf5;
-  color: white;
   text-decoration: none;
+
+  color: white;
+  background: #6eadf5;
 }
 
 .get-item:active {
@@ -383,12 +452,22 @@ li.neutral {
 }
 
 .seller-group {
-  padding: 10px;
+  position: absolute;
+  right: 20px;
+  bottom: 70px;
+
+  -webkit-transition: all 0.3s ease;
+  transition: all 0.3s ease;
+  /*padding: 10px;*/
   text-align: center;
 }
 
 .seller {
-  display: inline-block;
+  display: block;
+
+  /*width: 50px;*/
+  /*height: 50px;*/
+
   text-align: center;
 }
 /*Recommended Lines*/
@@ -405,36 +484,37 @@ li.neutral {
 .recommended-section {
   padding-top: 30px;
   padding-bottom: 30px;
+
   background: #fffae5;
 }
 /*Charities*/
 .charities {
   margin-bottom: 0;
-  background-color: #FFD429;
+
+  background-color: #F5FFF7;
 }
 
 .charities img {
-  -webkit-filter: brightness(0.4) opacity(0.8) sepia(1);
-  filter: brightness(0.4) opacity(0.8) sepia(1);
   -webkit-transition: .3s all ease;
-  -moz-transition: .3s all ease;
   transition: .3s all ease;
 
-  -moz-filter: brightness(0.4) opacity(0.8) sepia(1);
+  -webkit-filter: brightness(0.8) opacity(0.8) grayscale(1);
+  filter: brightness(0.8) opacity(0.8) grayscale(1);
+  -moz-filter: brightness(0.8) opacity(0.8) grayscale(1);
 }
 
 .charities img:hover {
-  -webkit-filter: brightness(1) opacity(1) sepia(0);
-  filter: brightness(1) opacity(1) sepia(0);
   -webkit-transform: scale(1.1);
-  -moz-transform: scale(1.1);
   transform: scale(1.1);
 
-  -moz-filter: brightness(1) opacity(1) sepia(0);
+  -webkit-filter: brightness(1) opacity(1) grayscale(0);
+  filter: brightness(1) opacity(1) grayscale(0);
+  -moz-filter: brightness(1) opacity(1) grayscale(0);
 }
 /*Licenses*/
 .licenses {
   margin-bottom: 0;
+
   background-color: #fffae5;
 }
 
@@ -451,6 +531,7 @@ li.neutral {
 footer {
   padding-top: 30px;
   /*padding-bottom: 30px;*/
+
   background-color: #4B423B;
 }
 
@@ -461,6 +542,7 @@ footer p {
 
 footer a {
   color: #FFD429;
+
   font-weight: 700;
 }
 
@@ -469,13 +551,15 @@ footer a:hover {
 }
 
 .footer-logo {
-  margin-bottom: 15px;
   max-height: 220px;
+  margin-bottom: 15px;
 }
 
 .ornament {
-  margin-top: 20px;
   height: 5px;
+  margin-top: 20px;
+
+  background: -webkit-linear-gradient(left, #FFD429 15%, #2B81E3 15%, #2B81E3 30%,#2CAF8F 30%, #2CAF8F 45%, #F3FAFF 45%, #F3FAFF 60%, #0AD778 60%, #0AD778 75%, #D70A0A 75%, #D70A0A 85%);
   background: linear-gradient(90deg, #FFD429 15%, #2B81E3 15%, #2B81E3 30%,#2CAF8F 30%, #2CAF8F 45%, #F3FAFF 45%, #F3FAFF 60%, #0AD778 60%, #0AD778 75%, #D70A0A 75%, #D70A0A 85%);
 }
 /* Media Queries */
@@ -484,25 +568,30 @@ footer a:hover {
   /*Navbar*/
   .navbar-nav {
     float: right;
+
     margin: 10px;
     /*margin-left: 100px;*/
   }
 
   .navbar-default .navbar-nav > li > a {
     padding: 7px;
+
     color: #2caf8f;
   }
 
   .navbar li {
     padding: 0 25px;
-    border-right: 1px #9BD2BF solid;
-    background-color: white;
+
     list-style-type: none;
-    font-size: 1.1em;
-    font-family: "Signika Regular";
+
     -webkit-transition: .3s all ease;
-    -moz-transition: .3s all ease;
     transition: .3s all ease;
+
+    border-right: 1px #9BD2BF solid;
+    background-color: white;
+
+    font-family: "Signika Regular";
+    font-size: 1.1em;
   }
 
   .navbar li:first-child {
@@ -520,10 +609,10 @@ footer a:hover {
 
   .navbar li a {
     display: block;
-    text-decoration: none;
+
     -webkit-transition: .3s all ease;
-    -moz-transition: .3s all ease;
     transition: .3s all ease;
+    text-decoration: none;
   }
 
   .navbar li a:hover {
@@ -542,13 +631,15 @@ footer a:hover {
        display: table;
    }
   .is-table-row [class*="col-"] {
-       float: none;
        display: table-cell;
+       float: none;
+
        vertical-align: top;
    }
 
   .recommended-section h5 {
     padding-left: 46px;
+
     text-align: left;
   }
   /*Footer*/
@@ -569,19 +660,23 @@ footer a:hover {
 
   .navbar-default .navbar-nav > li > a {
     padding: 7px;
+
     color: #2caf8f;
   }
 
   .navbar li {
     padding: 0 30px;
-    border-right: 1px #9BD2BF solid;
-    background-color: white;
+
     list-style-type: none;
-    font-size: 1em;
-    font-family: "Signika Regular";
+
     -webkit-transition: .3s all ease;
-    -moz-transition: .3s all ease;
     transition: .3s all ease;
+
+    border-right: 1px #9BD2BF solid;
+    background-color: white;
+
+    font-family: "Signika Regular";
+    font-size: 1.2em;
   }
 
   .navbar li:first-child {
@@ -599,10 +694,10 @@ footer a:hover {
 
   .navbar li a {
     display: block;
-    text-decoration: none;
+
     -webkit-transition: .3s all ease;
-    -moz-transition: .3s all ease;
     transition: .3s all ease;
+    text-decoration: none;
   }
 
   .navbar li:hover a {
@@ -614,8 +709,8 @@ footer a:hover {
   }
 
   .join img {
-    margin: 10px;
     width: 200px;
+    margin: 10px;
   }
   /*Intro*/
   .intro {
@@ -628,6 +723,7 @@ footer a:hover {
 
   .intro-text h1 {
     margin-top: 0;
+
     color: white;
     color: rgba(255, 255, 255, 0.95);
   }
@@ -638,12 +734,13 @@ footer a:hover {
 
   .intro-text h4 {
     color: #FFDD55;
+
     font-family: "Signika Light";
   }
 
   .illustration img {
-    margin-top: 30px;
     width: 90%;
+    margin-top: 30px;
   }
   /*Footer*/
   .footer-logo img {
@@ -653,7 +750,7 @@ footer a:hover {
 /* Large devices (large desktops, 1200px and up) */
 @media (min-width: 1200px) {
   .illustration img {
-    margin-top: 10px;
     width: 70%;
+    margin-top: 10px;
   }
 }
index eef8a3ed06393042fc40ca8ab99db8822205da6f..f03f2db33c8b9a70363a9f33fa49c73c1d7db0d3 100644 (file)
@@ -9,6 +9,22 @@
   <title>Ethical Tech | Giving Guide</title>
   <meta name="description" content="This is the Free Software Foundation (FSF) guide to smarter gifts, compared with their restrictive counterparts.">
 
+  <link rel="apple-touch-icon" sizes="57x57" href="img/favicons/apple-icon-57x57.png">
+  <link rel="apple-touch-icon" sizes="60x60" href="img/favicons/apple-icon-60x60.png">
+  <link rel="apple-touch-icon" sizes="72x72" href="img/favicons/apple-icon-72x72.png">
+  <link rel="apple-touch-icon" sizes="76x76" href="img/favicons/apple-icon-76x76.png">
+  <link rel="apple-touch-icon" sizes="114x114" href="img/favicons/apple-icon-114x114.png">
+  <link rel="apple-touch-icon" sizes="120x120" href="img/favicons/apple-icon-120x120.png">
+  <link rel="apple-touch-icon" sizes="144x144" href="img/favicons/apple-icon-144x144.png">
+  <link rel="apple-touch-icon" sizes="152x152" href="img/favicons/apple-icon-152x152.png">
+  <link rel="apple-touch-icon" sizes="180x180" href="img/favicons/apple-icon-180x180.png">
+  <link rel="icon" type="image/png" sizes="192x192" href="img/favicons/android-icon-192x192.png">
+  <link rel="icon" type="image/png" sizes="32x32" href="img/favicons/favicon-32x32.png">
+  <link rel="icon" type="image/png" sizes="96x96" href="img/favicons/favicon-96x96.png">
+  <link rel="icon" type="image/png" sizes="16x16" href="img/favicons/favicon-16x16.png">
+  <meta name="msapplication-TileColor" content="#2caf8f">
+  <meta name="msapplication-TileImage" content="img/favicons/ms-icon-144x144.png">
+  <meta name="theme-color" content="#2caf8f">
 
   <!-- Bootstrap -->
   <link rel="stylesheet" href="css/bootstrap.min.css">
@@ -19,6 +35,7 @@
   <!-- Our CSS -->
   <link rel="stylesheet" href="css/master.css">
 
+
   <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
   <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
   <!--[if lt IE 9]>
   <section class="comparisons">
 
     <!--Smartphones-->
-    <div class="container">
+    <div class="container smartphones">
       <h3 class="title text-center">Smartphones</h3>
       <div class="row is-table-row">
-        <div class="good col-md-6 col-sm-6">
+        <div class="good col-md-6 col-sm-6" style="display:relative">
 
           <!-- Begin Sale -->
           <div class="sale">
           <!-- End Sale -->
 
           <!-- Begin RFY -->
-          <a class="rfy" href="https://www.fsf.org/resources/hw/endorsement/respects-your-freedom">RFY-Certified</a>
+          <!-- <a class="rfy" href="https://www.fsf.org/resources/hw/endorsement/respects-your-freedom">RFY-Certified</a> -->
           <!-- End RFY -->
 
           <img src="img/products/replicant.png" alt="replicant phone" class="center-block" />
 
           <!-- Buy/Download Button   -->
 
-          <a id="get-item" class="get-item center-block" role="button" data-toggle="collapse" href="#sellers" aria-expanded="false" aria-controls="sellers" style="display:none">
+          <a id="get-item" class=" btn get-item" role="button" data-toggle="collapse" href="#sellers" aria-expanded="false" aria-controls="sellers" style="display:none">
           BUY
           </a>
           <div class="collapse" id="sellers">
             <li>Fully free software, based on Android.</li>
             <li><a href="http://redmine.replicant.us/projects/replicant/wiki/ReplicantStatus#Replicant-42">Supported devices</a> include both phones and tablets.</li>
             <li>Works on used devices, so your dollars won't go to proprietary OS companies. (All commercially available Android devices ship with some proprietary software.)</li>
+            <!-- <li class="rfy-line"><span class="label label-default"><a class="rfy" href="https://www.fsf.org/resources/hw/endorsement/respects-your-freedom">RFY-Certified</a></span>
+            </li> -->
           </ul>
 
         </div>
         <!--End Bad-->
       </div>
       <!--End Row-->
+      <div class="alert alert-success ryf center-block">
+        <p>
+          All the items recommended by the Free Software Foundation are <a href="https://www.fsf.org/resources/hw/endorsement/respects-your-freedom" class="alert-link">RYF-Certified</a>
+        </p>
+      </div>
     </div>
     <!--End Container-->
   </section>
   <!--Begin Actions-->
   <section class="actions">
     <div class="container">
-      <div class="row">
+      <div class="row is-table-row">
         <!-- Begin Share -->
         <div class="action col-md-4 col-sm-4 text-center">
           <h2>Share</h2>
index 318665900935243ce52d9d32955fc12007bc5cd1..685566c42119778dfcc28e76839b3e50205ea462 100644 (file)
Binary files a/img/charities/eff.png and b/img/charities/eff.png differ
diff --git a/img/favicons/android-icon-192x192.png b/img/favicons/android-icon-192x192.png
new file mode 100644 (file)
index 0000000..0784de1
Binary files /dev/null and b/img/favicons/android-icon-192x192.png differ
diff --git a/img/favicons/apple-icon-114x114.png b/img/favicons/apple-icon-114x114.png
new file mode 100644 (file)
index 0000000..195585a
Binary files /dev/null and b/img/favicons/apple-icon-114x114.png differ
diff --git a/img/favicons/apple-icon-120x120.png b/img/favicons/apple-icon-120x120.png
new file mode 100644 (file)
index 0000000..5668ae0
Binary files /dev/null and b/img/favicons/apple-icon-120x120.png differ
diff --git a/img/favicons/apple-icon-144x144.png b/img/favicons/apple-icon-144x144.png
new file mode 100644 (file)
index 0000000..5b7be2d
Binary files /dev/null and b/img/favicons/apple-icon-144x144.png differ
diff --git a/img/favicons/apple-icon-152x152.png b/img/favicons/apple-icon-152x152.png
new file mode 100644 (file)
index 0000000..ad106b3
Binary files /dev/null and b/img/favicons/apple-icon-152x152.png differ
diff --git a/img/favicons/apple-icon-180x180.png b/img/favicons/apple-icon-180x180.png
new file mode 100644 (file)
index 0000000..b146325
Binary files /dev/null and b/img/favicons/apple-icon-180x180.png differ
diff --git a/img/favicons/apple-icon-57x57.png b/img/favicons/apple-icon-57x57.png
new file mode 100644 (file)
index 0000000..d7d284f
Binary files /dev/null and b/img/favicons/apple-icon-57x57.png differ
diff --git a/img/favicons/apple-icon-60x60.png b/img/favicons/apple-icon-60x60.png
new file mode 100644 (file)
index 0000000..88ce969
Binary files /dev/null and b/img/favicons/apple-icon-60x60.png differ
diff --git a/img/favicons/apple-icon-72x72.png b/img/favicons/apple-icon-72x72.png
new file mode 100644 (file)
index 0000000..f624f7d
Binary files /dev/null and b/img/favicons/apple-icon-72x72.png differ
diff --git a/img/favicons/apple-icon-76x76.png b/img/favicons/apple-icon-76x76.png
new file mode 100644 (file)
index 0000000..601a870
Binary files /dev/null and b/img/favicons/apple-icon-76x76.png differ
diff --git a/img/favicons/favicon-16x16.png b/img/favicons/favicon-16x16.png
new file mode 100644 (file)
index 0000000..4f09e19
Binary files /dev/null and b/img/favicons/favicon-16x16.png differ
diff --git a/img/favicons/favicon-32x32.png b/img/favicons/favicon-32x32.png
new file mode 100644 (file)
index 0000000..6ee2e2d
Binary files /dev/null and b/img/favicons/favicon-32x32.png differ
diff --git a/img/favicons/favicon-96x96.png b/img/favicons/favicon-96x96.png
new file mode 100644 (file)
index 0000000..b52255e
Binary files /dev/null and b/img/favicons/favicon-96x96.png differ
diff --git a/img/favicons/ms-icon-144x144.png b/img/favicons/ms-icon-144x144.png
new file mode 100644 (file)
index 0000000..db15a6a
Binary files /dev/null and b/img/favicons/ms-icon-144x144.png differ
index 4a9025a2378a3f0cfcdd98f26fa7abf4d50cab2e..ee265a4427e93aafafa9f21de89424049030d908 100644 (file)
@@ -1,3 +1,9 @@
 $(document).ready(function() {
 
+  // Instructs the browser to release the focus from buttons. Could // be a Bootstrap bug.
+
+  $(".btn").mouseup(function(){
+      $(this).blur();
+  })
+
 });