1 files changed, 54 insertions, 63 deletions

diff --git a/mediagoblin/static/css/base.css b/mediagoblin/static/css/base.css
index ae4c42fc..c6ecb1d3 100644
--- a/mediagoblin/static/css/base.css
+++ b/mediagoblin/static/css/base.css
@@ -167,29 +167,21 @@ footer {
   clear: both;
 }
 
-.media_pane {
-  width: 640px;
-  margin-left: 0px;
+.thumb_gallery {
+  margin-left: 10px;
   margin-right: 10px;
-  float: left;
 }
 
-.media_sidebar {
-  width: 280px;
-  margin-left: 10px;
-  float: left;
+.profile_showcase .thumb_gallery {
+  margin-left: 0;
+  margin-right: 0;
 }
 
-.profile_sidebar {
-  width: 340px;
-  margin-right: 10px;
-  float: left;
-}
-
-.profile_showcase {
-  width: 580px;
-  margin-left: 10px;
-  float: left;
+.media_image {
+  max-width: 100%;
+  margin-left:auto;
+  margin-right:auto;
+  display:block;
 }
 
 /* common website elements */
@@ -243,6 +235,17 @@ text-align: center;
   float: right;
 }
 
+.left_align {
+  float: right;
+}
+
+.pull-right {
+  float: right !important;
+}
+.pull-left {
+  float: left !important;
+}
+
 .clear {
   clear: both;
   display: block;
@@ -595,11 +598,10 @@ img.media_icon {
 /* navigation */
 
 .navigation {
-	float: right;
 }
 
 .navigation_button {
-  width: 135px;
+  width: 48%;
   display: inline-block;
   text-align: center;
   background-color: #1d1d1d;
@@ -612,7 +614,7 @@ img.media_icon {
 }
 
 .navigation_left {
-  margin-right: 6px;
+  margin-right: 3px;
 }
 
 /* messages */
@@ -761,20 +763,12 @@ pre {
 }
 
 /* Media queries and other responsivisivity */
-@media screen and (max-width: 940px) {
-  .media_pane {
-    width: 100%;
-    margin: 0px;
-  }
-  
-  .media_sidebar {
-	  width: 100%;
-	  margin: 0px;
-	}
-	
+/* initial GMG max 940 */
+@media screen and (max-width: 960px) {
+
   img.media_image {
-    width: 100%;
-    display: inline;
+    max-width: 100%;
+/*    display: inline;*/
   }
 
   .media_thumbnail {
@@ -791,26 +785,11 @@ pre {
     margin: 0px;
   }
 
-	.navigation {
-	  float: none;
-	}
-
-	.navigation_button {
-	  width: 49%;
-		float: right;
-	}
-
-	.navigation_left {
-	  margin-right: 0;
-	  float: left;
-  }
-  
   .navigation {
     float: none;
   }
   
   .navigation_button {
-    width: 49%;
     float: right;
     padding: 10px 0 14px;
   }
@@ -825,48 +804,60 @@ pre {
   }
   
   header {
-    text-align: center;
+/*    text-align: center;*/
   }
 
   .header_right {
-    margin-right: 2%;
-    float: none;
+/*    margin-right: 2%;*/
+/*    float: none;*/
   }
   
   a.logo {
-    margin-left: 2%;
+/*    margin-left: 2%;*/
   }
   
 }
+/* desktop resolutions */
 @media screen and (min-width: 960px) {
-  .container .three.columns {
+  .container .three.columns { /* this needs to be more specific - inplace for the gallery... */
     width:180px;
     margin-left:3px;
     margin-right:3px;
   }
 }
+/* Tablet Portrait size to standard 960 (devices and browsers) */
 @media only screen and (min-width: 768px) and (max-width: 959px) {
-  .container .three.columns {
+  .container .three.columns { /* this needs to be more specific - inplace for the gallery... */
     width:147px;
     margin-left:2px;
     margin-right:2px;
   }
+  .thumb_gallery {
+    margin-left: 0;
+    margin-right: 0;
+  }
+  .navigation_button {
+  }
 }
+/* All Mobile Sizes (devices and browser) */
 @media screen and (max-width: 767px) {
   .thumb_row {
     margin-bottom: 0;
   }
-}
-@media screen and (max-width: 570px) {
-  .media_thumbnail {
-    width: 29%;
+  .thumb_gallery {
+    margin-left: 0;
+    margin-right: 0;
+  }
+  h1,h2,h3,p {
+    margin-bottom: 10px !important;
   }
 
-}
+  header {
+    text-align: center;
+  }
 
-@media screen and (max-width: 380px) {
-  .media_thumbnail {
-    width: 46%;
+  .header_right {
+    float: none;
   }
 }