language bar added/mobile issue fixed/auto fill form fixed

src/assets/js/main.js

@@ -52,10 +52,14 @@ $(document).ready(function() {
         }, 600);
     });
 
-
     $('.overview-column ').hoverdir({
         speed: 500,
     });
+    $('header .login>a.button').click(function(e) {
+        e.preventDefault();
+        $(this).toggleClass('active');
+        $('header .form-wrap').slideToggle();
+    });
 
     function mobileMenuAdj() {
         $(window).scroll(function() {

src/assets/scss/_responsive.scss

@@ -183,8 +183,11 @@
     nav.off-canvas.is-open {
         transform: translate(0, 0)
     }
+    .navigation-wrap>div {
+        margin: 0 0 0 20px;
+    }
     header .login {
-        margin: 0 30px 0 20px;
+        margin: 0 0 0 20px;
     }
     header .logo img {
         max-width: 180px;
@@ -265,10 +268,7 @@
     #search-block {
         display: none;
         position: absolute;
-        right: 210px;
-    }
-    header .form-wrap {
-        left: 0;
+        right: 187px;
     }
     .demo-account {
         h2 {
@@ -500,22 +500,35 @@
             width: 100%;
             margin: 0;
             text-align: right;
-            margin: 0 0 10px;
+            margin: 0 0 20px;
+            >div {
+                margin: 0 0 0 35px;
+            }
+            .login {
+                position: absolute;
+                bottom: 13px;
+                right: 60px;
+            }
+            .language-bar {
+                flex: 0;
+                order: 3;
+                top: 0;
+            }
         }
         .logo {
             order: 2;
             position: relative;
             top: -20px;
             img {
-                width: 70%;
+                width: 60%;
             }
         }
         .login {
             margin: 0 0 0 20px;
         }
         #search-block {
-            right: 120px;
-            top: -2px;
+            right: 126px;
+            top: -8px;
             bottom: inherit;
         }
         .top-block {

src/pages/index.html

@@ -33,7 +33,7 @@
                                 <h2>Most easy and scalable software to conduct exams at schools, colleges, universities and companies in 3 easy steps</h2>
                                 <strong><span class="red">3</span>Easy Steps</strong>
                                 <ul class="number-list">
-                                    <li>
+                                    <li class="active">
                                         <a href="#pricing" class="smooth-scroll">
                                             <i class="icon-lock"></i> Sign Up
                                         </a>

src/partials/header.html

@@ -7,6 +7,12 @@
                 </a>
             </div>
             <div class="navigation-wrap">
+                <div class="language-bar">
+                    <ul>
+                        <li class="active"><a href="">English</a></li>
+                        <li class="ar"><a href="">العربية</a></li>
+                    </ul>
+                </div>
                 <div class="search">
                     <span class="search-top">
                         <i class="icon-search"></i>