Made header sticky and increased accessibility

Author: AdityaPatil22

src/components/blog/SecurityHelpSection.vue

@@ -3,7 +3,11 @@
     <h1>Secrity help and learning</h1>
     <div class="security-dropdown-container">
       <h2>Security Guides</h2>
-      <pf-select id="security-dropdown" placeholder="Select a product">
+      <pf-select
+        id="security-dropdown"
+        placeholder="Select a product"
+        accessible-label="Red Hat Enterprise Linux"
+      >
         <pf-option-group key="group1" label="Red Hat Enterprise Linux">
           <pf-option><a>Hardening Guide</a></pf-option>
           <pf-option><a>SELinux Guide</a></pf-option>

src/components/header/HamburgerMenuModal.vue

@@ -47,4 +47,10 @@
   pf-button {
     --pf-c-button--m-primary--BackgroundColor: transparent;
   }
+
+  @media screen and (max-width: 767px) {
+    pf-modal::part(dialog) {
+      margin-top: 70px;
+    }
+  }
 </style>

src/components/header/SecurityLandingHeader.vue

@@ -90,6 +90,9 @@
     height: 120px;
     padding: 0 32px;
     align-items: center;
+    position: sticky;
+    top: 0;
+    z-index: 2;
   }
 
   .header-container hr {