Services #12

<!-- Services #12 -->
<section id="tab-interface">
  <div class="container">
    <div class="row">
      <div class="col-md-6 col-md-offset-3 col-sm-6 col-sm-offset-3 p-b-20 text-center">
        <h2 class="section-heading">Our <span>Services</span></h2>
        <hr class="hr-small hr-color">
        <p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium.</p>
      </div>
    </div><!-- /.row -->
    <div class="row">
      <div class="col-md-12">
        <div class="tabs-1">
          <!-- Nav tabs -->
          <ul class="nav nav-tabs gnx-nav-tabs centered m-b-40" role="tablist">
            <li role="presentation" class="active">
              <a href="#Section1" aria-controls="home" role="tab" data-toggle="tab">
              <div class="icon-box m-b-0">
                <div class="icon-default icon-md">
                  <span><i class="icon-browser" aria-hidden="true"></i></span>
                </div>
                <div class="box-content">
                  <div class="box-title">Web Design</div>
                </div>
              </div>
              </a>
            </li>
            <li role="presentation">
              <a href="#Section2" aria-controls="profile" role="tab" data-toggle="tab">
                <div class="icon-box m-b-0">
                <div class="icon-default icon-md">
                  <span><i class="icon-mobile" aria-hidden="true"></i></span>
                </div>
                <div class="box-content">
                  <div class="box-title">App Design</div>
                </div>
              </div>
              </a>
            </li>
            <li role="presentation">
              <a href="#Section3" aria-controls="messages" role="tab" data-toggle="tab">
                <div class="icon-box m-b-0">
                <div class="icon-default icon-md">
                  <span><i class="icon-basket" aria-hidden="true"></i></span>
                </div>
                <div class="box-content">
                  <div class="box-title">E-Commerce</div>
                </div>
              </div>
              </a>
            </li>
          </ul>
          <!-- Tab panes -->
          <div class="tab-content p-t-15">
            <div role="tabpanel" class="tab-pane fade in active" id="Section1">
              <div class="col-md-4 col-sm-4">
                <img src="assets/images/demo-img/gnx-500x300.jpg" data-rjs="2" class="img-responsive bg-gray m-b-40" alt="image">
              </div>
              <div class="col-md-4 col-sm-4 sm-text-center xs-text-center">
                <div class="icon-box m-b-40">
                  <div class="box-content">
                    <div class="box-title">
                      <h4>Branding</h4>
                    </div>
                    <p class="m-b-15">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt</p>
                    <a href="#" class="txt-btn">Read More</a>
                  </div>
                </div>
              </div>
              <div class="col-md-4 col-sm-4 sm-text-center xs-text-center">
                <div class="icon-box m-b-40">
                  <div class="box-content">
                    <div class="box-title">
                      <h4>User Experience</h4>
                    </div>
                    <p class="m-b-15">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt</p>
                    <a href="#" class="txt-btn">Read More</a>
                  </div>
                </div>
              </div>
            </div>
            <div role="tabpanel" class="tab-pane fade" id="Section2">
              <div class="col-md-4 col-sm-4">
                <img src="assets/images/demo-img/gnx-500x300.jpg" class="img-responsive m-b-40" data-rjs="2" alt="image">
              </div>
              <div class="col-md-4 col-sm-4 sm-text-center xs-text-center">
                <div class="icon-box m-b-40">
                  <div class="box-content">
                    <div class="box-title">
                      <h4>App Ios</h4>
                    </div>
                    <p class="m-b-15">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt</p>
                    <a href="#" class="txt-btn">Read More</a>
                  </div>
                </div>
              </div>
              <div class="col-md-4 col-sm-4 sm-text-center xs-text-center">
                <div class="icon-box m-b-40">
                  <div class="box-content">
                    <div class="box-title">
                      <h4>App Android</h4>
                    </div>
                    <p class="m-b-15">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt</p>
                    <a href="#" class="txt-btn">Read More</a>
                  </div>
                </div>
              </div>
            </div>
            <div role="tabpanel" class="tab-pane fade" id="Section3">
              <div class="col-md-4 col-sm-4">
                <img src="assets/images/demo-img/gnx-500x300.jpg" class="img-responsive m-b-40" data-rjs="2" alt="image">
              </div>
              <div class="col-md-4 col-sm-4 sm-text-center xs-text-center">
                <div class="icon-box m-b-40">
                  <div class="box-content">
                    <div class="box-title">
                      <h4>Business Strategy</h4>
                    </div>
                    <p class="m-b-15">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt</p>
                    <a href="#" class="txt-btn">Read More</a>
                  </div>
                </div>
              </div>
              <div class="col-md-4 col-sm-4 sm-text-center xs-text-center">
                <div class="icon-box m-b-40">
                  <div class="box-content">
                    <div class="box-title">
                      <h4>Web Marketing</h4>
                    </div>
                    <p class="m-b-15">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt</p>
                    <a href="#" class="txt-btn">Read More</a>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div><!-- /.row -->
  </div><!-- /.container -->
</section>
<!--/ Services #12 -->