make box-shadows line up on all screen resolutions

groups/home/LibAnswers-4-js-css.html

@@ -273,6 +273,14 @@ a.no-underline { text-decoration: none; }
 
 @media only screen and (min-width: 768px) {
         .zero-margin { margin: -2px; }
+
+        /* add flex so that blue box-shadows line up */
+        #flex-search-form {
+                display: flex;
+                flex-direction: row;
+                justify-content: center;
+        }
+ 
         #blue-border1 {
                 box-shadow: 0px 5px 0 var(--kbccblue), 0px -5px 0 var(--kbccblue), -5px -5px 0 var(--kbccblue), -5px 5px 0 var(--kbccblue);
         }

groups/home/LibAnswers-SlideOutChat-4.html

@@ -253,7 +253,7 @@
                                                                  <img class="image-fail onesearchsubmit" src="https://libapps.s3.amazonaws.com/accounts/16298/images/onesearch_logo.png" alt="OneSearch" />
                                                          </a>
                                                  </h1>
-                                                 <div class="form-group">
+                                                 <div class="form-group" id="flex-search-form">
                                                          <div class="dropdown input-group zero-margin" id="blue-border1">
                                                                  <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
                                                                          Define Your Search <span class="caret"></span>