01/01: website: style: Fix responsive issues in action links.

[Luis Felipe López Acevedo]

felipelopez pushed a commit to branch master
in repository guix-artwork.

commit fd1bd6c4aa4c90488c7bad6155258f1db590b18c
Author: sirgazil <address@hidden>
Date:   Sun Nov 27 15:02:18 2016 -0500

    website: style: Fix responsive issues in action links.
    
    * website/static/base/css/index.css (.action)
    (.download): Adapt to small screens.
---
 website/static/base/css/index.css |   17 ++++++++++++-----
 1 file changed, 12 insertions(+), 5 deletions(-)

diff --git a/website/static/base/css/index.css 
b/website/static/base/css/index.css
index 28db440..ed8ff29 100644
--- a/website/static/base/css/index.css
+++ b/website/static/base/css/index.css
@@ -1,7 +1,7 @@
 /*
     Public domain 2015 Luis Felipe López Acevedo. All rights waived.
     <address@hidden>
-   
+
     NOTE  The default style is targeted at screens with a width less than
           1024 pixels.
 */
@@ -63,13 +63,13 @@ h3 {
     border-style: solid;
     border-width: thin;
     color: white;
-    display: inline-block;
+    display: block;
     font-size: 14px;
     height: 47px;
     line-height: 47px;
+    margin: 10px;
     text-align: center;
     vertical-align: middle;
-    width: 196px;
 }
 
 .action:active, .action:focus, .action:hover {
@@ -81,7 +81,6 @@ h3 {
     background-image: url("../img/download-btn-bg.png");
     background-position: bottom;
     background-repeat: repeat-x;
-    margin-right: 20px;
 }
 
 .contribute {
@@ -188,6 +187,14 @@ h3 {
 /* CONTACT BOX */
 
 
address@hidden screen and (min-width: 480px) {
+    .action, .action:link, .action:visited {
+       display: inline-block;
+       width: 196px;
+    }
+}
+
+
 @media screen and (min-width: 1024px) {
     .info-box {
         vertical-align: top;
@@ -208,7 +215,7 @@ h3 {
         margin: auto;
         width: 960px;
     }
-    
+
     .featured-actions {
         text-align: right;
     }