<p dir="auto">here are the files<br>
INDEX.HTML</p>


  
    
    
    
    &lt;title&gt;Bootstrap 101 Template&lt;/title&gt;
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="&lt;!-- Bootstrap --&gt;
&lt;link href=&quot;css/bootstrap.min.css&quot; rel=&quot;stylesheet&quot;&gt;

&lt;link href=&quot;font-awesome/css/font-awesome.css&quot; rel=&quot;stylesheet&quot;&gt;
&lt;script src=&quot;//code.jquery.com/jquery-1.10.2.js&quot;&gt;&lt;/script&gt;
 &lt;style&gt;
        body { padding-bottom: 70px; }
  &lt;/style&gt;

&lt;!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries --&gt;
&lt;!-- WARNING: Respond.js doesn't work if you view the page via file:// --&gt;
&lt;!--[if lt IE 9]&gt;
  &lt;script src=&quot;https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js&quot;&gt;&lt;/script&gt;
  &lt;script src=&quot;https://oss.maxcdn.com/respond/1.4.2/respond.min.js&quot;&gt;&lt;/script&gt;
&lt;![endif]--&gt;
    &lt;script&gt;
        $(function(){
        $(&quot;#header&quot;).load(&quot;header.html&quot;); 
        $(&quot;#footer&quot;).load(&quot;footer.html&quot;); 
                    });
    &lt;/script&gt;"><pre class="notranslate"><code class="notranslate">&lt;!-- Bootstrap --&gt;
&lt;link href="css/bootstrap.min.css" rel="stylesheet"&gt;

&lt;link href="font-awesome/css/font-awesome.css" rel="stylesheet"&gt;
&lt;script src="//code.jquery.com/jquery-1.10.2.js"&gt;&lt;/script&gt;
 &lt;style&gt;
        body { padding-bottom: 70px; }
  &lt;/style&gt;

&lt;!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries --&gt;
&lt;!-- WARNING: Respond.js doesn't work if you view the page via file:// --&gt;
&lt;!--[if lt IE 9]&gt;
  &lt;script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"&gt;&lt;/script&gt;
&lt;![endif]--&gt;
    &lt;script&gt;
        $(function(){
        $("#header").load("header.html"); 
        $("#footer").load("footer.html"); 
                    });
    &lt;/script&gt;
</code></pre></div>
  
  
   <div id="user-content-header" dir="auto"></div>
   
   <div id="user-content-carousel-example-generic" dir="auto">
      
            <ol dir="auto">
                    <li></li>
                    <li></li>
                    <li></li>
            </ol>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="  &lt;!-- Wrapper for slides --&gt;
&lt;div class=&quot;carousel-inner&quot;&gt;
        &lt;div class=&quot;item active&quot;&gt;
            &lt;img src=&quot;img/tumblr_nb1uhrRrge1st5lhmo1_1280.jpg&quot; alt=&quot;jelifish&quot;&gt;
                &lt;div class=&quot;carousel-caption&quot;&gt;
                    first one
                &lt;/div&gt;
            &lt;/div&gt;
        &lt;div class=&quot;item&quot;&gt;
            &lt;img src=&quot;img/YzgdnQ4TTumS8xR9YRKJ_IMG_2761%20(1).jpg&quot; alt=&quot;crysanth&quot;&gt;
                &lt;div class=&quot;carousel-caption&quot;&gt;
                    second one     
                &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class=&quot;item&quot;&gt;
            &lt;img src=&quot;img/tumblr_nb1uhrRrge1st5lhmo1_1280.jpg&quot; alt=&quot;koala&quot;&gt;
                &lt;div class=&quot;carousel-caption&quot;&gt;
                    &lt;a&gt;&lt;h3&gt;mcloud ...&lt;/h3&gt;   &lt;/a&gt;
                &lt;/div&gt;
        &lt;/div&gt;
&lt;/div&gt;"><pre class="notranslate"><code class="notranslate">  &lt;!-- Wrapper for slides --&gt;
&lt;div class="carousel-inner"&gt;
        &lt;div class="item active"&gt;
            &lt;img src="img/tumblr_nb1uhrRrge1st5lhmo1_1280.jpg" alt="jelifish"&gt;
                &lt;div class="carousel-caption"&gt;
                    first one
                &lt;/div&gt;
            &lt;/div&gt;
        &lt;div class="item"&gt;
            &lt;img src="img/YzgdnQ4TTumS8xR9YRKJ_IMG_2761%20(1).jpg" alt="crysanth"&gt;
                &lt;div class="carousel-caption"&gt;
                    second one     
                &lt;/div&gt;
        &lt;/div&gt;
        &lt;div class="item"&gt;
            &lt;img src="img/tumblr_nb1uhrRrge1st5lhmo1_1280.jpg" alt="koala"&gt;
                &lt;div class="carousel-caption"&gt;
                    &lt;a&gt;&lt;h3&gt;mcloud ...&lt;/h3&gt;   &lt;/a&gt;
                &lt;/div&gt;
        &lt;/div&gt;
&lt;/div&gt;
</code></pre></div>
  
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="        &lt;a class=&quot;left carousel-control&quot; href=&quot;#carousel-example-generic&quot; role=&quot;button&quot; data-slide=&quot;prev&quot;&gt;&lt;span class=&quot;glyphicon glyphicon-chevron-left&quot;&gt;&lt;/span&gt;&lt;/a&gt;
        &lt;a class=&quot;right carousel-control&quot; href=&quot;#carousel-example-generic&quot; role=&quot;button&quot; data-slide=&quot;next&quot;&gt;&lt;span class=&quot;glyphicon glyphicon-chevron-right&quot;&gt;&lt;/span&gt;&lt;/a&gt;
&lt;/div&gt;
&lt;!- corosel ends--&gt;
&lt;!-- thumbnail starts here--&gt;
&lt;div class=&quot;container&quot;&gt;"><pre class="notranslate"><code class="notranslate">        &lt;a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev"&gt;&lt;span class="glyphicon glyphicon-chevron-left"&gt;&lt;/span&gt;&lt;/a&gt;
        &lt;a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next"&gt;&lt;span class="glyphicon glyphicon-chevron-right"&gt;&lt;/span&gt;&lt;/a&gt;
&lt;/div&gt;
&lt;!- corosel ends--&gt;
&lt;!-- thumbnail starts here--&gt;
&lt;div class="container"&gt;
</code></pre></div>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="        &lt;div class=&quot;row&quot;&gt;

            &lt;div class=&quot;col-md-4&quot;&gt;
                &lt;h3&gt;&lt;a href=&quot;#&quot;&gt;WI-FI&lt;/a&gt;&lt;/h3&gt;
                &lt;img src=&quot;img/quickpay.jpg&quot; alt=&quot;&quot;&gt;
                &lt;p&gt;Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.&lt;/p&gt;
                &lt;a href=&quot;#&quot; class=&quot;btn btn-default&quot;&gt; read more&lt;/a&gt;
            &lt;/div&gt;

            &lt;div class=&quot;col-md-4&quot;&gt;
                &lt;h3&gt;&lt;a href=&quot;#&quot;&gt;WI-FI&lt;/a&gt;&lt;/h3&gt;
                &lt;img src=&quot;img/quickpay.jpg&quot; alt=&quot;&quot;&gt;
                    &lt;p&gt;Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.&lt;/p&gt;
                &lt;a href=&quot;#&quot; class=&quot;btn btn-default&quot;&gt; read more&lt;/a&gt;
            &lt;/div&gt;

            &lt;div class=&quot;col-md-4&quot;&gt;
                &lt;h3&gt;&lt;a href=&quot;#&quot;&gt;WI-FI&lt;/a&gt;&lt;/h3&gt;
                &lt;img src=&quot;img/quickpay.jpg&quot; alt=&quot;&quot;&gt;
                &lt;p&gt;Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.&lt;/p&gt;
                &lt;a href=&quot;#&quot; class=&quot;btn btn-default&quot;&gt; read more&lt;/a&gt;
            &lt;/div&gt;

        &lt;/div&gt;

&lt;/div&gt;





&lt;!-- jQuery (necessary for Bootstrap's JavaScript plugins) --&gt;
&lt;div id=&quot;footer&quot;&gt;&lt;/div&gt;
&lt;script src=&quot;https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js&quot;&gt;&lt;/script&gt;
&lt;!-- Include all compiled plugins (below), or include individual files as needed --&gt;
&lt;script src=&quot;js/bootstrap.min.js&quot;&gt;&lt;/script&gt;"><pre class="notranslate"><code class="notranslate">        &lt;div class="row"&gt;

            &lt;div class="col-md-4"&gt;
                &lt;h3&gt;&lt;a href="#"&gt;WI-FI&lt;/a&gt;&lt;/h3&gt;
                &lt;img src="img/quickpay.jpg" alt=""&gt;
                &lt;p&gt;Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.&lt;/p&gt;
                &lt;a href="#" class="btn btn-default"&gt; read more&lt;/a&gt;
            &lt;/div&gt;

            &lt;div class="col-md-4"&gt;
                &lt;h3&gt;&lt;a href="#"&gt;WI-FI&lt;/a&gt;&lt;/h3&gt;
                &lt;img src="img/quickpay.jpg" alt=""&gt;
                    &lt;p&gt;Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.&lt;/p&gt;
                &lt;a href="#" class="btn btn-default"&gt; read more&lt;/a&gt;
            &lt;/div&gt;

            &lt;div class="col-md-4"&gt;
                &lt;h3&gt;&lt;a href="#"&gt;WI-FI&lt;/a&gt;&lt;/h3&gt;
                &lt;img src="img/quickpay.jpg" alt=""&gt;
                &lt;p&gt;Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.&lt;/p&gt;
                &lt;a href="#" class="btn btn-default"&gt; read more&lt;/a&gt;
            &lt;/div&gt;

        &lt;/div&gt;

&lt;/div&gt;





&lt;!-- jQuery (necessary for Bootstrap's JavaScript plugins) --&gt;
&lt;div id="footer"&gt;&lt;/div&gt;
&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"&gt;&lt;/script&gt;
&lt;!-- Include all compiled plugins (below), or include individual files as needed --&gt;
&lt;script src="js/bootstrap.min.js"&gt;&lt;/script&gt;
</code></pre></div>
  

<p dir="auto">AND HEADER.HTML</p>


  
    
    
    
    &lt;title&gt;Bootstrap 101 Template&lt;/title&gt;
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="&lt;!-- Bootstrap --&gt;
&lt;link href=&quot;css/bootstrap.min.css&quot; rel=&quot;stylesheet&quot;&gt;

&lt;link href=&quot;font-awesome/css/font-awesome.css&quot; rel=&quot;stylesheet&quot;&gt;
&lt;script src=&quot;//code.jquery.com/jquery-1.10.2.js&quot;&gt;&lt;/script&gt;

&lt;!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries --&gt;
&lt;!-- WARNING: Respond.js doesn't work if you view the page via file:// --&gt;
&lt;!--[if lt IE 9]&gt;
  &lt;script src=&quot;https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js&quot;&gt;&lt;/script&gt;
  &lt;script src=&quot;https://oss.maxcdn.com/respond/1.4.2/respond.min.js&quot;&gt;&lt;/script&gt;
&lt;![endif]--&gt;"><pre class="notranslate"><code class="notranslate">&lt;!-- Bootstrap --&gt;
&lt;link href="css/bootstrap.min.css" rel="stylesheet"&gt;

&lt;link href="font-awesome/css/font-awesome.css" rel="stylesheet"&gt;
&lt;script src="//code.jquery.com/jquery-1.10.2.js"&gt;&lt;/script&gt;

&lt;!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries --&gt;
&lt;!-- WARNING: Respond.js doesn't work if you view the page via file:// --&gt;
&lt;!--[if lt IE 9]&gt;
  &lt;script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"&gt;&lt;/script&gt;
&lt;![endif]--&gt;
</code></pre></div>
  
  
    <div dir="auto">
        <div dir="auto">
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="        &lt;a href=&quot;#&quot; class=&quot;navbar-brand&quot; style=&quot;color:red&quot;&gt;MCLOUD&lt;/a&gt;

        &lt;button class=&quot;navbar-toggle&quot; data-toggle=&quot;collapse&quot; data-target=&quot;.navHeaderCollapse&quot;&gt;
            &lt;span class=&quot;icon-bar&quot;&gt;&lt;/span&gt;
            &lt;span class=&quot;icon-bar&quot;&gt;&lt;/span&gt;
            &lt;span class=&quot;icon-bar&quot;&gt;&lt;/span&gt;
        &lt;/button&gt;

        &lt;div class=&quot;collapse navbar-collapse navHeaderCollapse&quot;&gt;
        &lt;ul class=&quot;nav navbar-nav navbar-right&quot;&gt;

             &lt;li&gt;&lt;a href=&quot;#&quot; style=&quot;color:red&quot; class=&quot;active&quot;&gt;home&lt;/a&gt;&lt;/li&gt;
            &lt;li class=&quot;dropdown&quot;&gt;
                &lt;a  href=&quot;#&quot; class=&quot;dropdown-toggle&quot; data-toggle=&quot;dropdown&quot; style=&quot;color:red&quot;&gt;Dropdown &lt;span class=&quot;caret&quot;&gt;&lt;/span&gt;&lt;/a&gt;
                 &lt;ul class=&quot;dropdown-menu&quot; &gt;
                    &lt;li &gt;&lt;a href=&quot;#apply&quot; data-toggle=&quot;modal&quot; &gt;Apply for new Connection&lt;/a&gt;&lt;/li&gt;
                    &lt;li &gt;&lt;a href=&quot;#quick&quot; data-toggle=&quot;modal&quot;&gt;Quick Pay&lt;/a&gt;&lt;/li&gt;
                    &lt;li role=&quot;presentation&quot; class=&quot;divider&quot;&gt;&lt;/li&gt;
                    &lt;li &gt;&lt;a href=&quot;#account&quot; data-toggle=&quot;modal&quot;&gt;MyAccount&lt;/a&gt;&lt;/li&gt;
                &lt;/ul&gt;
            &lt;/li&gt;
            &lt;li&gt;&lt;a href=&quot;#&quot; style=&quot;color:red&quot;&gt;home&lt;/a&gt;&lt;/li&gt;                
        &lt;/ul&gt;

        &lt;/div&gt;
    &lt;/div&gt;

&lt;/div&gt;
&lt;!-- apply for new connection form--&gt;

&lt;div class=&quot;modal fade&quot; id=&quot;apply&quot; role=&quot;dialog&quot;&gt;
    &lt;div class=&quot;modal-dialog&quot;&gt;
        &lt;div class=&quot;modal-content&quot;&gt;
               &lt;form class=&quot;form-horizontal&quot;&gt;
                    &lt;div class=&quot;modal-header&quot;&gt;
                        &lt;h4&gt;Apply for new connection&lt;/h4&gt;
                    &lt;/div&gt;

                    &lt;div class=&quot;modal-body&quot;&gt;

                        &lt;div class=&quot;form-group&quot;&gt;
                            &lt;label for = &quot;contact-name&quot; class=&quot;col-lg-2 control-lable&quot;&gt;Name:&lt;/label&gt;
                            &lt;div class=&quot;col-lg-10&quot;&gt;

                                &lt;input type=&quot;text&quot; class=&quot;form-control&quot; id=&quot;contact-name&quot; placeholder=&quot;Full name&quot;&gt;

                            &lt;/div&gt;

                        &lt;/div&gt;

                         &lt;div class=&quot;form-group&quot;&gt;
                            &lt;label for = &quot;contact-email&quot; class=&quot;col-lg-2 control-lable&quot;&gt;email:&lt;/label&gt;
                            &lt;div class=&quot;col-lg-10&quot;&gt;

                                &lt;input type=&quot;email&quot; class=&quot;form-control&quot; id=&quot;contact-email&quot; placeholder=&quot;you@example.com&quot;&gt;

                            &lt;/div&gt;

                        &lt;/div&gt;

                         &lt;div class=&quot;form-group&quot;&gt;
                            &lt;label for = &quot;contact-mobileNo.&quot; class=&quot;col-lg-2 control-lable&quot;&gt;Mobile NO.&lt;/label&gt;
                            &lt;div class=&quot;col-lg-10&quot;&gt;

                                &lt;input type=&quot;mobileNo.&quot; class=&quot;form-control&quot; id=&quot;contact-mobileNo.&quot; placeholder=&quot;+910000000000&quot;&gt;

                            &lt;/div&gt;

                        &lt;/div&gt;

                        &lt;div class=&quot;form-group&quot;&gt;
                            &lt;label for = &quot;contact-city&quot; class=&quot;col-lg-2 control-lable&quot;&gt;City:&lt;/label&gt;
                            &lt;div class=&quot;col-lg-10&quot;&gt;

                                &lt;input type=&quot;city&quot; class=&quot;form-control&quot; id=&quot;contact-mobileNo.&quot; placeholder=&quot;pune west,east or center&quot;&gt;

                            &lt;/div&gt;

                        &lt;/div&gt;

                        &lt;div class=&quot;form-group&quot;&gt;
                            &lt;label for = &quot;contact-area&quot; class=&quot;col-lg-2 control-lable&quot;&gt;Area:&lt;/label&gt;
                            &lt;div class=&quot;col-lg-10&quot;&gt;

                                &lt;input type=&quot;area&quot; class=&quot;form-control&quot; id=&quot;contact-area&quot; placeholder=&quot;Area&quot;&gt;

                            &lt;/div&gt;

                        &lt;/div&gt;

                        &lt;div class=&quot;form-group&quot;&gt;
                            &lt;label for = &quot;contact-building&quot; class=&quot;col-lg-2 control-lable&quot;&gt;Building:&lt;/label&gt;
                            &lt;div class=&quot;col-lg-10&quot;&gt;

                                &lt;input type=&quot;building&quot; class=&quot;form-control&quot; id=&quot;contact-building&quot; placeholder=&quot;Building&quot;&gt;

                            &lt;/div&gt;

                        &lt;/div&gt;

                        &lt;div class=&quot;form-group&quot;&gt;
                            &lt;label for = &quot;contact-address&quot; class=&quot;col-lg-2 control-lable&quot;&gt;Address:&lt;/label&gt;
                            &lt;div class=&quot;col-lg-10&quot;&gt;

                                &lt;input type=&quot;address&quot; class=&quot;form-control&quot; id=&quot;contact-address&quot; placeholder=&quot;address&quot;&gt;

                            &lt;/div&gt;

                        &lt;/div&gt;

                        &lt;div class=&quot;form-group&quot;&gt;
                            &lt;label for = &quot;contact-address&quot; class=&quot;col-lg-2 control-lable&quot;&gt;&lt;/label&gt;
                            &lt;div class=&quot;col-lg-10&quot;&gt;

                                &lt;div class=&quot;checkbox&quot;&gt;
                                        &lt;label&gt;
                                              &lt;input type=&quot;checkbox&quot;&gt; Mcloud Broadband can call with details!&lt;span class=&quot;glyphicon glyphicon-     warning-sign&quot;&gt;&lt;/span&gt;
                                        &lt;/label&gt;
                                &lt;/div&gt;

                            &lt;/div&gt;

                        &lt;/div&gt;



                    &lt;/div&gt;

                    &lt;div class=&quot;modal-footer&quot;&gt;

                        &lt;a class=&quot;btn btn-primary&quot; data-dismiss=&quot;modal&quot;&gt;Close&lt;/a&gt;
                        &lt;a class=&quot;btn btn-success&quot; type=&quot;submit&quot; &gt;Submit&lt;/a&gt;

                    &lt;/div&gt;
                &lt;/form&gt;

        &lt;/div&gt;
    &lt;/div&gt;
&lt;/div&gt;    
&lt;!--apply for new connection ends here --&gt;
&lt;!-- quick pay --&gt;

 &lt;div class=&quot;modal fade&quot; id=&quot;quick&quot; role=&quot;dialog&quot;&gt;
    &lt;div class=&quot;modal-dialog&quot;&gt;
        &lt;div class=&quot;modal-content&quot;&gt; 
            &lt;form class=&quot;form-horizontal&quot;&gt;
                &lt;div class=&quot;modal-header&quot;&gt;
                    &lt;h4&gt;Quick Pay&lt;/h4&gt;
                &lt;/div&gt;
                &lt;div class=&quot;modal-body&quot;&gt;

                    &lt;div class=&quot;form-group&quot;&gt;
                            &lt;label for = &quot;Username&quot; class=&quot;col-lg-2 control-lable&quot;&gt;Username:&lt;/label&gt;
                        &lt;div class=&quot;col-lg-10&quot;&gt;

                                &lt;input type=&quot;text&quot; class=&quot;form-control&quot; id=&quot;Username&quot; &gt;&lt;p&gt;&lt;br&gt;OR&lt;/p&gt;

                        &lt;/div&gt;

                    &lt;/div&gt;

                    &lt;div class=&quot;form-group&quot;&gt;
                            &lt;label for = &quot;accountno&quot; class=&quot;col-lg-2 control-lable&quot;&gt;Account NO.&lt;/label&gt;
                        &lt;div class=&quot;col-lg-10&quot;&gt;

                                &lt;input type=&quot;text&quot; class=&quot;form-control&quot; id=&quot;accountno&quot; &gt;

                        &lt;/div&gt;

                    &lt;/div&gt;   

                &lt;/div&gt;
                &lt;div class=&quot;modal-footer&quot;&gt;
                    &lt;a class=&quot;btn btn-primary&quot; data-dismiss=&quot;modal&quot;&gt;Close&lt;/a&gt;
                    &lt;a class=&quot;btn btn-success&quot;&gt;submit&lt;/a&gt;
                &lt;/div&gt;
            &lt;/form&gt;
        &lt;/div&gt;
    &lt;/div&gt;
&lt;/div&gt;
&lt;!-- quick pay --&gt;
&lt;!-- my account --&gt;

 &lt;div class=&quot;modal fade&quot; id=&quot;account&quot; role=&quot;dialog&quot;&gt;
    &lt;div class=&quot;modal-dialog&quot;&gt;
        &lt;div class=&quot;modal-content&quot;&gt; 
            &lt;form class=&quot;form-horizontal&quot;&gt;
                &lt;div class=&quot;modal-header&quot;&gt;
                    &lt;h4&gt;Log In or&lt;a style=&quot;color:blue&quot;&gt; Sign Up&lt;/a&gt;&lt;/h4&gt;
                &lt;/div&gt;
                &lt;div class=&quot;modal-body&quot;&gt;

                    &lt;div class=&quot;form-group&quot;&gt;
                            &lt;label for = &quot;Username&quot; class=&quot;col-lg-2 control-lable&quot;&gt;Username:&lt;/label&gt;
                        &lt;div class=&quot;col-lg-10&quot;&gt;

                                &lt;input type=&quot;text&quot; class=&quot;form-control&quot; id=&quot;Username&quot; &gt;&lt;p&gt;

                        &lt;/div&gt;

                    &lt;/div&gt;

                    &lt;div class=&quot;form-group&quot;&gt;
                            &lt;label for = &quot;password&quot; class=&quot;col-lg-2 control-lable&quot;&gt;Password:&lt;/label&gt;
                        &lt;div class=&quot;col-lg-10&quot;&gt;

                                &lt;input type=&quot;text&quot; class=&quot;form-control&quot; id=&quot;password&quot; &gt;

                        &lt;/div&gt;

                    &lt;/div&gt;  

                    &lt;div class=&quot;form-group&quot;&gt;
                        &lt;div class=&quot;checkbox&quot;&gt;
                                &lt;label for = &quot;password&quot; class=&quot;col-lg-2 control-lable&quot;&gt;&lt;/label&gt;
                                    &lt;div class=&quot;col-lg-10&quot;&gt;
                                        &lt;label&gt;
                                              &lt;input type=&quot;checkbox&quot;&gt; Remember Password!&lt;span class=&quot;glyphicon glyphicon-     warning-sign&quot;&gt;&lt;/span&gt;
                                        &lt;/label&gt;
                                    &lt;/div&gt;                                
                                &lt;/div&gt;
                        &lt;/div&gt;

                &lt;/div&gt;
                &lt;div class=&quot;modal-footer&quot;&gt;
                    &lt;a class=&quot;btn btn-primary&quot; data-dismiss=&quot;modal&quot;&gt;Close&lt;/a&gt;
                    &lt;a class=&quot;btn btn-success&quot;&gt;submit&lt;/a&gt;
                &lt;/div&gt;
            &lt;/form&gt;
        &lt;/div&gt;
    &lt;/div&gt;
&lt;/div&gt;
&lt;!-- my account  ends here--&gt;

&lt;!-- jQuery (necessary for Bootstrap's JavaScript plugins) --&gt;
&lt;script src=&quot;https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js&quot;&gt;&lt;/script&gt;
&lt;!-- Include all compiled plugins (below), or include individual files as needed --&gt;
&lt;script src=&quot;js/bootstrap.min.js&quot;&gt;&lt;/script&gt;"><pre class="notranslate"><code class="notranslate">        &lt;a href="#" class="navbar-brand" style="color:red"&gt;MCLOUD&lt;/a&gt;

        &lt;button class="navbar-toggle" data-toggle="collapse" data-target=".navHeaderCollapse"&gt;
            &lt;span class="icon-bar"&gt;&lt;/span&gt;
            &lt;span class="icon-bar"&gt;&lt;/span&gt;
            &lt;span class="icon-bar"&gt;&lt;/span&gt;
        &lt;/button&gt;

        &lt;div class="collapse navbar-collapse navHeaderCollapse"&gt;
        &lt;ul class="nav navbar-nav navbar-right"&gt;

             &lt;li&gt;&lt;a href="#" style="color:red" class="active"&gt;home&lt;/a&gt;&lt;/li&gt;
            &lt;li class="dropdown"&gt;
                &lt;a  href="#" class="dropdown-toggle" data-toggle="dropdown" style="color:red"&gt;Dropdown &lt;span class="caret"&gt;&lt;/span&gt;&lt;/a&gt;
                 &lt;ul class="dropdown-menu" &gt;
                    &lt;li &gt;&lt;a href="#apply" data-toggle="modal" &gt;Apply for new Connection&lt;/a&gt;&lt;/li&gt;
                    &lt;li &gt;&lt;a href="#quick" data-toggle="modal"&gt;Quick Pay&lt;/a&gt;&lt;/li&gt;
                    &lt;li role="presentation" class="divider"&gt;&lt;/li&gt;
                    &lt;li &gt;&lt;a href="#account" data-toggle="modal"&gt;MyAccount&lt;/a&gt;&lt;/li&gt;
                &lt;/ul&gt;
            &lt;/li&gt;
            &lt;li&gt;&lt;a href="#" style="color:red"&gt;home&lt;/a&gt;&lt;/li&gt;                
        &lt;/ul&gt;

        &lt;/div&gt;
    &lt;/div&gt;

&lt;/div&gt;
&lt;!-- apply for new connection form--&gt;

&lt;div class="modal fade" id="apply" role="dialog"&gt;
    &lt;div class="modal-dialog"&gt;
        &lt;div class="modal-content"&gt;
               &lt;form class="form-horizontal"&gt;
                    &lt;div class="modal-header"&gt;
                        &lt;h4&gt;Apply for new connection&lt;/h4&gt;
                    &lt;/div&gt;

                    &lt;div class="modal-body"&gt;

                        &lt;div class="form-group"&gt;
                            &lt;label for = "contact-name" class="col-lg-2 control-lable"&gt;Name:&lt;/label&gt;
                            &lt;div class="col-lg-10"&gt;

                                &lt;input type="text" class="form-control" id="contact-name" placeholder="Full name"&gt;

                            &lt;/div&gt;

                        &lt;/div&gt;

                         &lt;div class="form-group"&gt;
                            &lt;label for = "contact-email" class="col-lg-2 control-lable"&gt;email:&lt;/label&gt;
                            &lt;div class="col-lg-10"&gt;

                                &lt;input type="email" class="form-control" id="contact-email" placeholder="you@example.com"&gt;

                            &lt;/div&gt;

                        &lt;/div&gt;

                         &lt;div class="form-group"&gt;
                            &lt;label for = "contact-mobileNo." class="col-lg-2 control-lable"&gt;Mobile NO.&lt;/label&gt;
                            &lt;div class="col-lg-10"&gt;

                                &lt;input type="mobileNo." class="form-control" id="contact-mobileNo." placeholder="+910000000000"&gt;

                            &lt;/div&gt;

                        &lt;/div&gt;

                        &lt;div class="form-group"&gt;
                            &lt;label for = "contact-city" class="col-lg-2 control-lable"&gt;City:&lt;/label&gt;
                            &lt;div class="col-lg-10"&gt;

                                &lt;input type="city" class="form-control" id="contact-mobileNo." placeholder="pune west,east or center"&gt;

                            &lt;/div&gt;

                        &lt;/div&gt;

                        &lt;div class="form-group"&gt;
                            &lt;label for = "contact-area" class="col-lg-2 control-lable"&gt;Area:&lt;/label&gt;
                            &lt;div class="col-lg-10"&gt;

                                &lt;input type="area" class="form-control" id="contact-area" placeholder="Area"&gt;

                            &lt;/div&gt;

                        &lt;/div&gt;

                        &lt;div class="form-group"&gt;
                            &lt;label for = "contact-building" class="col-lg-2 control-lable"&gt;Building:&lt;/label&gt;
                            &lt;div class="col-lg-10"&gt;

                                &lt;input type="building" class="form-control" id="contact-building" placeholder="Building"&gt;

                            &lt;/div&gt;

                        &lt;/div&gt;

                        &lt;div class="form-group"&gt;
                            &lt;label for = "contact-address" class="col-lg-2 control-lable"&gt;Address:&lt;/label&gt;
                            &lt;div class="col-lg-10"&gt;

                                &lt;input type="address" class="form-control" id="contact-address" placeholder="address"&gt;

                            &lt;/div&gt;

                        &lt;/div&gt;

                        &lt;div class="form-group"&gt;
                            &lt;label for = "contact-address" class="col-lg-2 control-lable"&gt;&lt;/label&gt;
                            &lt;div class="col-lg-10"&gt;

                                &lt;div class="checkbox"&gt;
                                        &lt;label&gt;
                                              &lt;input type="checkbox"&gt; Mcloud Broadband can call with details!&lt;span class="glyphicon glyphicon-     warning-sign"&gt;&lt;/span&gt;
                                        &lt;/label&gt;
                                &lt;/div&gt;

                            &lt;/div&gt;

                        &lt;/div&gt;



                    &lt;/div&gt;

                    &lt;div class="modal-footer"&gt;

                        &lt;a class="btn btn-primary" data-dismiss="modal"&gt;Close&lt;/a&gt;
                        &lt;a class="btn btn-success" type="submit" &gt;Submit&lt;/a&gt;

                    &lt;/div&gt;
                &lt;/form&gt;

        &lt;/div&gt;
    &lt;/div&gt;
&lt;/div&gt;    
&lt;!--apply for new connection ends here --&gt;
&lt;!-- quick pay --&gt;

 &lt;div class="modal fade" id="quick" role="dialog"&gt;
    &lt;div class="modal-dialog"&gt;
        &lt;div class="modal-content"&gt; 
            &lt;form class="form-horizontal"&gt;
                &lt;div class="modal-header"&gt;
                    &lt;h4&gt;Quick Pay&lt;/h4&gt;
                &lt;/div&gt;
                &lt;div class="modal-body"&gt;

                    &lt;div class="form-group"&gt;
                            &lt;label for = "Username" class="col-lg-2 control-lable"&gt;Username:&lt;/label&gt;
                        &lt;div class="col-lg-10"&gt;

                                &lt;input type="text" class="form-control" id="Username" &gt;&lt;p&gt;&lt;br&gt;OR&lt;/p&gt;

                        &lt;/div&gt;

                    &lt;/div&gt;

                    &lt;div class="form-group"&gt;
                            &lt;label for = "accountno" class="col-lg-2 control-lable"&gt;Account NO.&lt;/label&gt;
                        &lt;div class="col-lg-10"&gt;

                                &lt;input type="text" class="form-control" id="accountno" &gt;

                        &lt;/div&gt;

                    &lt;/div&gt;   

                &lt;/div&gt;
                &lt;div class="modal-footer"&gt;
                    &lt;a class="btn btn-primary" data-dismiss="modal"&gt;Close&lt;/a&gt;
                    &lt;a class="btn btn-success"&gt;submit&lt;/a&gt;
                &lt;/div&gt;
            &lt;/form&gt;
        &lt;/div&gt;
    &lt;/div&gt;
&lt;/div&gt;
&lt;!-- quick pay --&gt;
&lt;!-- my account --&gt;

 &lt;div class="modal fade" id="account" role="dialog"&gt;
    &lt;div class="modal-dialog"&gt;
        &lt;div class="modal-content"&gt; 
            &lt;form class="form-horizontal"&gt;
                &lt;div class="modal-header"&gt;
                    &lt;h4&gt;Log In or&lt;a style="color:blue"&gt; Sign Up&lt;/a&gt;&lt;/h4&gt;
                &lt;/div&gt;
                &lt;div class="modal-body"&gt;

                    &lt;div class="form-group"&gt;
                            &lt;label for = "Username" class="col-lg-2 control-lable"&gt;Username:&lt;/label&gt;
                        &lt;div class="col-lg-10"&gt;

                                &lt;input type="text" class="form-control" id="Username" &gt;&lt;p&gt;

                        &lt;/div&gt;

                    &lt;/div&gt;

                    &lt;div class="form-group"&gt;
                            &lt;label for = "password" class="col-lg-2 control-lable"&gt;Password:&lt;/label&gt;
                        &lt;div class="col-lg-10"&gt;

                                &lt;input type="text" class="form-control" id="password" &gt;

                        &lt;/div&gt;

                    &lt;/div&gt;  

                    &lt;div class="form-group"&gt;
                        &lt;div class="checkbox"&gt;
                                &lt;label for = "password" class="col-lg-2 control-lable"&gt;&lt;/label&gt;
                                    &lt;div class="col-lg-10"&gt;
                                        &lt;label&gt;
                                              &lt;input type="checkbox"&gt; Remember Password!&lt;span class="glyphicon glyphicon-     warning-sign"&gt;&lt;/span&gt;
                                        &lt;/label&gt;
                                    &lt;/div&gt;                                
                                &lt;/div&gt;
                        &lt;/div&gt;

                &lt;/div&gt;
                &lt;div class="modal-footer"&gt;
                    &lt;a class="btn btn-primary" data-dismiss="modal"&gt;Close&lt;/a&gt;
                    &lt;a class="btn btn-success"&gt;submit&lt;/a&gt;
                &lt;/div&gt;
            &lt;/form&gt;
        &lt;/div&gt;
    &lt;/div&gt;
&lt;/div&gt;
&lt;!-- my account  ends here--&gt;

&lt;!-- jQuery (necessary for Bootstrap's JavaScript plugins) --&gt;
&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"&gt;&lt;/script&gt;
&lt;!-- Include all compiled plugins (below), or include individual files as needed --&gt;
&lt;script src="js/bootstrap.min.js"&gt;&lt;/script&gt;
</code></pre></div>
  

<p dir="auto">WHAT THE HELL IT IS NOT WORKING???</p></div></div></div>