Repositioning header celebration graphic in medium view

diff --git a/header.php b/header.php
index 8d7a54a..4d5cfa1 100644 (file)
--- a/header.php
+++ b/header.php
@@ -10,8 +10,8 @@
 <header class="container">\r
     <div class="row">\r
         <a href="<?php bloginfo('url'); ?>" title="<?php bloginfo('name'); ?>"><img src="<?php bloginfo('template_url'); ?>/images/logo.png" alt="<?php bloginfo('name'); ?>" width="500" height="98" id="logo"></a>\r
+        <img id="anniversary-image" src="<?php bloginfo('template_url');?>/images/125-years.png" alt="125 Years!">\r
         <p style="position: relative;">\r
-            <img src="<?php bloginfo('template_url');?>/images/125-years.png" alt="125 Years!">\r
             <span>Call:</span> (231) 526-2111\r
             <a target="_blank" href="https://www.facebook.com/hotelharborsprings/"><img id="facebook-icon" src="<?php bloginfo('template_url'); ?>/images/FB-1.png" height="24" width="24"></a>\r
         </p>\r

diff --git a/style.css b/style.css
index 6395cee..b0ab1a6 100644 (file)
--- a/style.css
+++ b/style.css
@@ -25,6 +25,20 @@ fieldset{padding:0;margin:0;border:0;min-width:0}legend{display:block;width:100%
 .clearfix:before,.clearfix:after,.container:before,.container:after,.container-fluid:before,.container-fluid:after,.row:before,.row:after,.form-horizontal .form-group:before,.form-horizontal .form-group:after,.nav:before,.nav:after,.navbar:before,.navbar:after,.navbar-header:before,.navbar-header:after,.navbar-collapse:before,.navbar-collapse:after{content:" ";display:table}.clearfix:after,.container:after,.container-fluid:after,.row:after,.form-horizontal .form-group:after,.nav:after,.navbar:after,.navbar-header:after,.navbar-collapse:after{clear:both}.center-block{display:block;margin-left:auto;margin-right:auto}.pull-right{float:right !important}.pull-left{float:left !important}.hide{display:none !important}.show{display:block !important}.invisible{visibility:hidden}.text-hide{font:0/0 a;color:transparent;text-shadow:none;background-color:transparent;border:0}.hidden{display:none !important}.affix{position:fixed}\r
 @-ms-viewport{width:device-width}.visible-xs,.visible-sm,.visible-md,.visible-lg{display:none !important}.visible-xs-block,.visible-xs-inline,.visible-xs-inline-block,.visible-sm-block,.visible-sm-inline,.visible-sm-inline-block,.visible-md-block,.visible-md-inline,.visible-md-inline-block,.visible-lg-block,.visible-lg-inline,.visible-lg-inline-block{display:none !important}@media (max-width:767px){.visible-xs{display:block !important}table.visible-xs{display:table !important}tr.visible-xs{display:table-row !important}th.visible-xs,td.visible-xs{display:table-cell !important}}@media (max-width:767px){.visible-xs-block{display:block !important}}@media (max-width:767px){.visible-xs-inline{display:inline !important}}@media (max-width:767px){.visible-xs-inline-block{display:inline-block !important}}@media (min-width:768px) and (max-width:991px){.visible-sm{display:block !important}table.visible-sm{display:table !important}tr.visible-sm{display:table-row !important}th.visible-sm,td.visible-sm{display:table-cell !important}}@media (min-width:768px) and (max-width:991px){.visible-sm-block{display:block !important}}@media (min-width:768px) and (max-width:991px){.visible-sm-inline{display:inline !important}}@media (min-width:768px) and (max-width:991px){.visible-sm-inline-block{display:inline-block !important}}@media (min-width:992px) and (max-width:1199px){.visible-md{display:block !important}table.visible-md{display:table !important}tr.visible-md{display:table-row !important}th.visible-md,td.visible-md{display:table-cell !important}}@media (min-width:992px) and (max-width:1199px){.visible-md-block{display:block !important}}@media (min-width:992px) and (max-width:1199px){.visible-md-inline{display:inline !important}}@media (min-width:992px) and (max-width:1199px){.visible-md-inline-block{display:inline-block !important}}@media (min-width:1200px){.visible-lg{display:block !important}table.visible-lg{display:table !important}tr.visible-lg{display:table-row !important}th.visible-lg,td.visible-lg{display:table-cell !important}}@media (min-width:1200px){.visible-lg-block{display:block !important}}@media (min-width:1200px){.visible-lg-inline{display:inline !important}}@media (min-width:1200px){.visible-lg-inline-block{display:inline-block !important}}@media (max-width:767px){.hidden-xs{display:none !important}}@media (min-width:768px) and (max-width:991px){.hidden-sm{display:none !important}}@media (min-width:992px) and (max-width:1199px){.hidden-md{display:none !important}}@media (min-width:1200px){.hidden-lg{display:none !important}}\r
 \r
+@media (max-width:998px) {\r
+#anniversary-image {\r
+    margin: 0 auto 20px;\r
+}\r
+}\r
+    \r
+#anniversary-image {\r
+    float: right;\r
+    margin-top: 20px;\r
+}\r
+body header.container p {\r
+    margin: 15px 10px 0px;\r
+}\r
+\r
 /* Yamm!3 - megamenu for Bootstrap */\r
 .yamm .nav, .yamm .collapse, .yamm .dropup, .yamm .dropdown { position:static; }\r
 .yamm .container { position:relative; }\r