Inside header image is responsive. main nav no hover effect

diff --git a/styles.css b/styles.css
index fb78322..4f2faed 100644 (file)
--- a/styles.css
+++ b/styles.css
@@ -70,6 +70,9 @@ body {
     font-size: 1rem;
     font-weight: bold;
     }
+.top-bar-section li:not(.has-form) a:not(.button) {
+    background: none !important;
+    }
 .top-bar-section li:not(.has-form) a:not(.button) {
     /* background: #065892; */
     }
@@ -162,13 +165,23 @@ body {
     margin: 1em 0;
     }
 /* Inside header image and text */
+/* Inside header image section */
+#insideHeader {
+    border-top-left-radius: 5px;
+    border-top-right-radius: 5px;
+    max-width: 720px;
+    overflow: hidden;
+    background-size: cover;
+    padding-top: 34.72222222222222%;
+    }
+
 #insideHeader {
     position: relative;
     }
 #insideHeader section {
     position: absolute;
     bottom: 0;
-    width: 720px;
+    width: 100%;
     background: rgba(6,88,146, .75);
     color: rgba(255, 255, 255, .9);
     padding: 0 20px;
@@ -220,14 +233,6 @@ body {
     margin: 2em auto;
     display: block;
     }
-/* Inside header image section */
-#insideHeader {
-    border-top-left-radius: 5px;
-    border-top-right-radius: 5px;
-    width: 720px;
-    height: 250px;
-    overflow: hidden;
-    }
 /* Toolbox */
 #toolbox h1,
 #toolbox h2 {

diff --git a/templates/template.html b/templates/template.html
index 1590327..7c50a8f 100644 (file)
--- a/templates/template.html
+++ b/templates/template.html
@@ -56,23 +56,6 @@
             </div>
                 <div class="row">
                     <div class="large-12 columns">
-                        <!-- <ul id="nav" class="reset-list">
-                            <li>
-                                <a href="#">Home</a>
-                            </li>
-                            <li>
-                                <a href="#">Tours &amp; Cruises</a>
-                            </li>
-                            <li>
-                                <a href="#">Tickets, Packages &amp; Coupons</a>
-                            </li>
-                            <li>
-                                <a href="#">Groups &amp; School Rates</a>
-                            </li>
-                            <li>
-                                <a href="#">About</a>
-                            </li>
-                        </ul>-->
                         <nav class="top-bar" data-topbar>
                             <section class="top-bar-section">
                                 <ul class="right" id="sm">