Move the Twitter and Facebook "tabs" up so they don't take an entire line. Add...

Move the Twitter and Facebook "tabs" up so they don't take an entire line. Add a glow around the selected tab.

css/gobigred.css

@@ -204,22 +204,39 @@ Big Ten Video Slide
     margin-bottom:24px;
 }
 
+#maincontent #socialFeeds {
+    position:relative;
+}
 /* Tab Overrides - turn these into buttons*/
 #maincontent #socialFeeds ul.wdn_tabs {
     border-bottom:none;
     margin:10px 0;
+    display:inline-block;
+    position:absolute;
+    right:0;
+    top:0;
 }
 #maincontent .wdn_tabs #tabFacebook, #maincontent .wdn_tabs #tabTwitter {
     padding:0;
     margin:0;
     height:auto;
     border-radius:1em;
-    margin-right:14px;
+    margin-right:7px;
+}
+#maincontent .wdn_tabs #tabFacebook.selected, #maincontent .wdn_tabs #tabTwitter.selected {
+    -webkit-box-shadow: 0px 0px 10px 0px #5aabc6;
+    -moz-box-shadow: 0px 0px 10px 0px #5aabc6;
+    box-shadow: 0px 0px 10px 0px #5aabc6;
 }
 #maincontent .wdn_tabs #tabFacebook:hover, #maincontent .wdn_tabs #tabTwitter:hover {
     -webkit-box-shadow: inset 0px 1px 1px 0px rgba(0, 0, 0, 0.4);
--moz-box-shadow: inset 0px 1px 1px 0px rgba(0, 0, 0, 0.4);
-box-shadow: inset 0px 1px 1px 0px rgba(0, 0, 0, 0.4);
+    -moz-box-shadow: inset 0px 1px 1px 0px rgba(0, 0, 0, 0.4);
+    box-shadow: inset 0px 1px 1px 0px rgba(0, 0, 0, 0.4);
+}
+#maincontent .wdn_tabs #tabFacebook.selected:hover, #maincontent .wdn_tabs #tabTwitter.selected:hover {
+    -webkit-box-shadow: 0px 0px 10px 0px #5aabc6, inset 0px 1px 1px 0px rgba(0, 0, 0, 0.4);
+    -moz-box-shadow: 0px 0px 10px 0px #5aabc6, inset 0px 1px 1px 0px rgba(0, 0, 0, 0.4);
+    box-shadow: 0px 0px 10px 0px #5aabc6, inset 0px 1px 1px 0px rgba(0, 0, 0, 0.4);
 }
 #maincontent .wdn_tabs #tabFacebook {
     background: #3b5998; /* Old browsers */
@@ -259,7 +276,7 @@ background: linear-gradient(top, #4099ff 0%,#3479c9 100%); /* W3C */
     font-weight:bold;
     font-size:0.8em;
     margin:0;
-    padding:3px 8px;
+    padding:1px 8px;
 }
 #twitterFeed ul {
     padding:0;  

index.php

@@ -164,7 +164,7 @@
                 </div>
               
             <div class="grid5" id="socialFeeds">
-            <h3>Conversations with UNL</h3>
+            <h3>Conversations</h3>
             <ul class="wdn_tabs">
 			   <li id="tabTwitter"><a href="#twitter">Twitter</a></li>
 			   <li id="tabFacebook"><a href="#facebook">Facebook</a></li>