Add yota logo to site + refactor users to flexbox

closes gh-129

Author: bigbes

_theme/tarantool/_less/page-base.less

@@ -8,7 +8,7 @@
 @icon-project:  data-uri("data:image/png;base64", "icons/icon-project.png");
 @icon-download: data-uri("data:image/png;base64", "icons/icon-download.png");
 
-@logo-mobile:   data-uri("data:image/svg+xml;charset=UTF-8", "logo/logo-mobile.svg");
+@logo-mobile:   data-uri("data:image/svg+xml;base64", "logo/logo-mobile.svg");
 
 .i-boxdown {
     width:12px;

_theme/tarantool/_less/page-index.less

@@ -6,7 +6,6 @@
     width:  @width;
     height: @height;
     &:after, &:before {
-        /* background-image: data-uri("data:image/png;base64", @imgpath); */
         background-image: url(@imgpath)
     }
 }
@@ -189,18 +188,36 @@
     }
 }
 
+.b-customers-bar {
+    display:         flex;
+    flex-flow:       row wrap;
+    justify-content: space-around;
+    align-items:     stretch;
+}
+
+.i-avito    { .customer-icon(132px, 37px, "images/logo_avito.png");    }
+.i-badoo    { .customer-icon(130px, 37px, "images/logo_badoo.png");    }
+.i-mailru   { .customer-icon(126px, 39px, "images/logo_mailru.png");   }
+.i-sberbank { .customer-icon(153px, 29px, "images/logo_sberbank.png"); }
+.i-qiwi     { .customer-icon(120px, 60px, "images/logo_qiwi.png");     }
+.i-wallarm  { .customer-icon(130px, 63px, "images/logo_wallarm.png");  }
+.i-yota     { .customer-icon(130px, 63px, "images/logo_yota.png");     }
+
 .b-customers {
     .b-block-wrapper {
         padding-bottom: 41px;
     }
     .b-section-title {
-        margin-bottom: 53px;
+        margin-bottom:  1em;
     }
-    .b-cols-item {
-        width:          1%;
+    .b-customers-bar-item {
         vertical-align: middle;
+        flex:        1 0 200px;
+        padding-top:      20px;
+        padding-bottom:   20px;
+        text-align:     center;
     }
-    .b-cust_logo {
+    .b-customer_logo {
         .transition-ease();
         display:inline-block;
         position:relative;
@@ -312,14 +329,6 @@
     height: 393px;
 }
 
-.i-mailru   { .customer-icon(126px, 39px, "images/logo_mailru.png");   }
-.i-badoo    { .customer-icon(130px, 37px, "images/logo_badoo.png");    }
-.i-sberbank { .customer-icon(153px, 29px, "images/logo_sberbank.png"); }
-.i-avito    { .customer-icon(132px, 37px, "images/logo_avito.png");    }
-.i-qiwi     { .customer-icon(120px, 60px, "images/logo_qiwi.png");     }
-.i-wallarm  { .customer-icon(130px, 63px, "images/logo_wallarm.png");
-    margin-bottom: 36px;
-}
 
 @media screen and (max-width: 992px) {
     .b-mainhead {

_theme/tarantool/static/design.css

@@ -231,26 +231,13 @@ Tarantool - Index
 
     .. raw:: html
 
-        <div class="b-cols">
-            <div class="b-cols-item">
-                <a href="http://mail.ru" class="b-cust_logo i-mailru"></a>
-            </div>
-            <div class="b-cols-item-empty">&nbsp;</div>
-            <div class="b-cols-item">
-                <a href="http://badoo.com" class="b-cust_logo i-badoo"></a>
-            </div>
-            <div class="b-cols-item-empty">&nbsp;</div>
-            <div class="b-cols-item">
-                <a href="http://avito.ru" class="b-cust_logo i-avito"></a>
-            </div>
-            <div class="b-cols-item-empty">&nbsp;</div>
-            <div class="b-cols-item">
-                <a href="http://qiwi.ru" class="b-cust_logo i-qiwi"></a>
-            </div>
-            <div class="b-cols-item-empty">&nbsp;</div>
-            <div class="b-cols-item">
-                <a href="http://wallarm.com" class="b-cust_logo i-wallarm"></a>
-            </div>
+        <div class="b-customers-bar">
+            <div class="b-customers-bar-item"> <a href="http://mail.ru"     class="b-customer_logo i-mailru" ></a> </div>
+            <div class="b-customers-bar-item"> <a href="http://badoo.com"   class="b-customer_logo i-badoo"  ></a> </div>
+            <div class="b-customers-bar-item"> <a href="http://avito.ru"    class="b-customer_logo i-avito"  ></a> </div>
+            <div class="b-customers-bar-item"> <a href="http://qiwi.ru"     class="b-customer_logo i-qiwi"   ></a> </div>
+            <div class="b-customers-bar-item"> <a href="http://wallarm.com" class="b-customer_logo i-wallarm"></a> </div>
+            <div class="b-customers-bar-item"> <a href="http://yota.com"    class="b-customer_logo i-yota"   ></a> </div>
         </div>
 
 .. _secondary indexes: doc/book/box/box_index.html