[Solved] Ajax CalendarExtender displays below other controls in ASP.Net

i have created the responsive form.when i clicked on start date,calender box is not coming properly.why it is happening?

see below image:

code: 

                   <div class="row">
                       <div class="form-group">
                         <div class="col-sm-2"></div>
                          <label class="control-label col-sm-2" for="Start date">Start Date:</label>
                         <div class="col-sm-8">
                             <asp:TextBox ID="DateFromtxt" runat="server" Width="50px" MaxLength="10" CssClass="form-control" style="width:50%;"></asp:TextBox>
                             <ajaxToolkit:CalendarExtender ID="CalendarExtender1" runat="server" 
                                            TargetControlID="DateFromtxt" Format="yyyy-MM-dd">
                             </ajaxToolkit:CalendarExtender>
                             <asp:RequiredFieldValidator ID="RequiredFieldValidator17" runat="server" 
                                            ControlToValidate="DateFromtxt" ErrorMessage="* Start date Required" 
                                            Display="Dynamic"></asp:RequiredFieldValidator>
                             <asp:CustomValidator ID="CustomValidator1" runat="server" ErrorMessage="* Enter Valid Date"
                                        TargetControlID="DateFromtxt"
                                         Display="Dynamic"></asp:CustomValidator> 
                           <br />
                       </div>
                </div>
                  </div>

                   <div class="row">
                       <div class="form-group">
                         <div class="col-sm-2"></div>
                          <label class="control-label col-sm-2" for="End date">End Date:</label>
                         <div class="col-sm-8">
                             <asp:TextBox ID="DateTotxt" runat="server" Width="50px" MaxLength="10" CssClass="form-control" style="width:50%;"></asp:TextBox>
                             <ajaxToolkit:CalendarExtender ID="CalendarExtender2" runat="server" 
                                            TargetControlID="DateTotxt" Format="yyyy-MM-dd">
                             </ajaxToolkit:CalendarExtender>
                             <asp:RequiredFieldValidator ID="RequiredFieldValidator16" runat="server" 
                                            ControlToValidate="DateTotxt" ErrorMessage="* End Date Required" 
                                            Display="Dynamic"></asp:RequiredFieldValidator>
                            
                           <br />
                       </div>
                </div>
                  </div>

                   <div class="row">
                <div class="form-group">
                    <div class="col-sm-2"></div>
                    <label class="control-label col-sm-2" for="Description">Event Description:</label>
                    <div class="col-sm-8">
                      <asp:TextBox ID="desciptiontxt" runat="server" TextMode="MultiLine" CssClass="form-control" style="width:50%;"  Height="100px" MaxLength="500"></asp:TextBox>
                         <asp:RequiredFieldValidator ID="RequiredFieldValidator18" runat="server" 
                                            ControlToValidate="desciptiontxt" Display="Dynamic" 
                                            ErrorMessage="* Description Required"></asp:RequiredFieldValidator>
                        <br />
                  </div>
                </div>
            </div>