Make footer responsive

website/static/css/style.css

@@ -88,7 +88,8 @@ ul.ui-autocomplete {
 .gmu-brand {
 	padding: 0px 5px 0px 12px;
 	margin: none;
-	float: right;
+	display: block;
+	text-align: center;
 }
 .gmu-logo {
 	width: 150px;
@@ -113,6 +114,9 @@ ul.ui-autocomplete {
 	text-align:center;
 	margin-top: 12px;
 }
+#footer-line {
+	display: none;
+}
 /* Custom Responsive Classes */
 /* xs */
 @media (min-width: 480px) {
@@ -124,7 +128,13 @@ ul.ui-autocomplete {
 }
 /* md */
 @media (min-width: 992px) {
-
+	#footer-line {
+		display: inline;
+	}
+	.gmu-brand {
+		position: absolute;
+		right: 15px;
+	}
 }
 /* lg */
 @media (min-width: 1200px) {

whats_open/templates/base.html

@@ -62,12 +62,10 @@
             </div>  
             <div id="footer">
                 <div class="footer-row">
+	                <a class="gmu-brand" href="http://www.gmu.edu"><img src="{{ STATIC_URL }}img/gmurgb.png" class="gmu-logo"></a>
 	                <div class="col-md-8 col-md-offset-2">
-                		<p class="footer-text">A project of <a href="http://srct.gmu.edu">GMU SRCT</a>. <a href="http://opensource.org/licenses/MIT/">Some rights reserved</a>. &nbsp; &nbsp; | &nbsp; &nbsp;  George Mason University <a href="http://dining.gmu.edu/">Dining Services</a> &nbsp; &nbsp; &nbsp; &nbsp;</p>
+                		<p class="footer-text">A project of <a href="http://srct.gmu.edu">GMU SRCT</a>. <a href="http://opensource.org/licenses/MIT/">Some rights reserved</a>.<span id="footer-line">&nbsp;&nbsp;|&nbsp;&nbsp;</span><br class="visible-xs visible-sm"/> George Mason University <a href="http://dining.gmu.edu/">Dining Services</a>&nbsp;&nbsp;&nbsp; &nbsp;</p>
                 	</div>
-                    <div class="col-md-2">
-	                    <a class="gmu-brand" href="http://www.gmu.edu"><img src="{{ STATIC_URL }}img/gmurgb.png" class="gmu-logo"></a>
-	                </div>
                 </div>
             </div>
         </div>