File Manager

Editing File: /home/webrbaew/public_html/index-old.php

<!DOCTYPE html>
<html lang="en">
<head>
  
  <title>AB Web Solutions</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet" type="text/css">
  <link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet" type="text/css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
  <style>
  ::selection {
	background:#1dbf73;
	color:#fff;
  }
  body {
      font: 400 15px Lato, sans-serif;
      line-height: 1.8;
      color: #818181;
  }
  h2 {
      font-size: 24px;
      text-transform: uppercase;
      color: #1dbf73;
      font-weight: 600;
      margin-bottom: 30px;
  }
  h4 {
      font-size: 19px;
      line-height: 1.375em;
      color: #303030;
      font-weight: 400;
      margin-bottom: 30px;
  }
  .color-text {
	  color: #1dbf73;
  }  
  .jumbotron {
      background-color: #1dbf73;
      color: #fff;
      padding: 100px 25px;
      font-family: Montserrat, sans-serif;
	  text-shadow:2px 2px 8px black, -2px -2px 8px black;;
  }
  .jumbotron p {
	  font-size:22px;
  }
  .container-fluid {
      padding: 50px 50px;
  }
  .bg-grey {
      background-color: #f6f6f6;
  }
  .logo-small {
      color: #1dbf73;
      font-size: 50px;
  }
  .logo {
      color: #1dbf73;
      font-size: 200px;
  }
  .thumbnail {
      padding: 0 0 15px 0;
      border: none;
      border-radius: 0;
  }
  .thumbnail img {
      width: 100%;
      height: 100%;
      margin-bottom: 10px;
  }
  .carousel-control.right, .carousel-control.left {
      background-image: none;
      color: #1dbf73;
  }
  .carousel-indicators li {
      border-color: #1dbf73;
  }
  .carousel-indicators li.active {
      background-color: #1dbf73;
  }
  .item h4 {
      font-size: 19px;
      line-height: 1.375em;
      font-weight: 400;
      font-style: italic;
      margin: 70px 0;
  }
  .item span {
      font-style: normal;
  }
  .panel {
      border: 1px solid #1dbf73; 
      border-radius:0 !important;
      transition: box-shadow 0.5s;
  }
  .panel:hover {
      box-shadow: 5px 0px 40px rgba(0,0,0, .2);
  }
  .panel-footer .btn:hover {
      border: 1px solid #1dbf73;
      background-color: #fff !important;
      color: #1dbf73;
  }
  .panel-heading {
      color: #fff !important;
      background-color: #1dbf73 !important;
      padding: 4px;
	  font-size:19px;
      border-bottom: 1px solid transparent;
      border-top-left-radius: 0px;
      border-top-right-radius: 0px;
      border-bottom-left-radius: 0px;
      border-bottom-right-radius: 0px;
  }
  .panel-footer {
      background-color: white !important;
  }
  .panel-footer h3 {
      font-size: 25px;
	  color:#1dbf73;
  }
  .panel-body h4, .panel-footer h4 {
      font-size: 18px;
	  color:#1dbf73;
	  font-weight:bold;
  }
  .panel-footer .panel-table {
	width:100%;
  }
  .panel-footer .panel-table td {
	  width:50%;
	  vertical-align:top;
	  padding:0 3px;
  }
  .panel-footer.more-gigs h4 {
	  margin-bottom:4px;
	  color:#818181;
  }
  .panel-footer.more-gigs h4.more-gigs-heading {
	  color:#1dbf73;
  }
  .panel-price h3 {
	color:#818181;
  }
  .panel-footer .price {
	  color:#1dbf73;
	  font-weight:bold;
  }
  .panel-footer .glyphicon {
	  color:#1dbf73;
  }
  .panel-footer .btn {
      margin: 15px 0;
      background-color: #1dbf73;
      color: #fff;
  }
  .navbar {
      margin-bottom: 0;
      background-color: #1dbf73;
      z-index: 9999;
      border: 0;
      font-size: 12px !important;
      line-height: 1.42857143 !important;
      letter-spacing: 4px;
      border-radius: 0;
      font-family: Montserrat, sans-serif;
  }
  .navbar li a, .navbar .navbar-brand {
      color: #fff !important;
  }
  .navbar-nav li a:hover, .navbar-nav li.active a {
      color: #1dbf73 !important;
      background-color: #fff !important;
  }
  .navbar-default .navbar-toggle {
      border-color: transparent;
      color: #fff !important;
  }
  footer .glyphicon {
      font-size: 20px;
      margin-bottom: 20px;
      color: #1dbf73;
  }
  .slideanim {visibility:hidden;}
  .slide {
      animation-name: slide;
      -webkit-animation-name: slide;
      animation-duration: 1s;
      -webkit-animation-duration: 1s;
      visibility: visible;
  }
  @keyframes slide {
    0% {
      opacity: 0;
      transform: translateY(70%);
    } 
    100% {
      opacity: 1;
      transform: translateY(0%);
    }
  }
  @-webkit-keyframes slide {
    0% {
      opacity: 0;
      -webkit-transform: translateY(70%);
    } 
    100% {
      opacity: 1;
      -webkit-transform: translateY(0%);
    }
  }
  @media screen and (min-width: 767px) {
	.jumbotron {
		height:662px;
		padding-top:200px;
		background-attachment:fixed;
	}
  }
  @media screen and (max-width: 1200px) {
	 .panel-footer .panel-table {
		width:100%;
	 }
  }
  @media screen and (min-width:991px) and (max-width: 1199px) {
	.panel-price {
		padding-top:65px;
	}
  }
  @media screen and (max-width: 991px) {
	.container-fluid {
		padding-left:15px;
		padding-right:15px;
	}
  }
  @media screen and (max-width: 768px) {
    .col-sm-4 {
      text-align: center;
      margin: 25px 0;
    }
    .btn-lg {
        width: 100%;
        margin-bottom: 35px;
    }
	.panel-footer .panel-table {
		width:100%;
	}
  }
  @media screen and (max-width: 525px) {
	  .col-xs-full {
		 width:100%;
		 clear:both;
		 margin-left:0;
	  }
  }
  @media screen and (max-width: 480px) {
    .logo {
        font-size: 150px;
    }
  }
  </style>
</head>
<body id="myPage" data-spy="scroll" data-target=".navbar" data-offset="60">

<nav class="navbar navbar-default navbar-fixed-top">
  <div class="container">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>                        
      </button>
      <a class="navbar-brand" href="#myPage">Logo</a>
    </div>
    <div class="collapse navbar-collapse" id="myNavbar">
      <ul class="nav navbar-nav navbar-right">
        <li><a href="#about">ABOUT</a></li>
        <li><a href="#services">SERVICES</a></li>
        <li><a href="#portfolio">PORTFOLIO</a></li>
        <li><a href="#gigs">GIGS</a></li>
        <li><a href="#contact">CONTACT</a></li>
      </ul>
    </div>
  </div>
</nav>

<div class="jumbotron text-center" style="background-image:url('images/bg-cover.jpg');background-position:center center; background-size:cover;background-repeat:no-repeat;">
	<div class="col-sm-10 col-sm-offset-1 col-md-8 col-md-offset-2">
		<div class="row">
			<div style="background:rgba(0,0,0,0.5);border-radius:32px">
				<br><br><br>
				<h1>AB Web Solutions</h1> 
				<p>Providing Web Services</p>
				<br><br><br>
			</div>
		</div>
	</div>
</div>

<div id="about" class="container-fluid">
  <div class="row">
    <div class="col-sm-8">
      <h2>About Us</h2><br>
      <h4><span class="color-text"><b>AB</b></span> Providing Website Development Services in Pakistan. We believe that we are on the face of the earth to make great products and that's not changing. We are constantly focusing on innovating. We believe in the simple not the complex. We believe in saying no to thousands of projects, so that we can really focus on the few that are truly important and meaningful to us.</h4><br>
    </div>
    <div class="col-sm-4">
      <span class="glyphicon glyphicon-signal logo"></span>
    </div>
  </div>
</div>

<div class="container-fluid bg-grey">
  <div class="row">
    <div class="col-sm-4">
      <span class="glyphicon glyphicon-globe logo slideanim"></span>
    </div>
    <div class="col-sm-8">
      <h2>Our Values</h2><br>
      <h4>
		<strong>MISSION:</strong> 
		Our mission is to make technology an asset for your business or organization not a problem. To be the providers of strategies and services, which deliver long term commercial benefits, based upon our clients key business requirements. The strategies evolved should be economical, efficient, durable, flexible and allow the organizations to respond rapidly to both market and customer needs, therefore, we will work hand in hand with you to support your growth.
	  </h4><br>
      <h4><strong>VISION:</strong> To become a prime performer in the global marketplace by providing highly innovative web designing, web development and other web solutions services that will drive our clients' business towards growth. Worldwide reputation is the dream of every company and we want to achieve it through our work.</h4>
    </div>
  </div>
</div>

<div id="services" class="container-fluid text-center">
  <h2>SERVICES</h2>
  <h4>What we offer</h4>
  <br>
  <div class="row slideanim">
    <div class="col-sm-3 col-xs-6" style="padding:15px;">
      <span class="fa fa-desktop logo-small"></span>
      <h4>WEBSITE DEVELOPMENT</h4>
      <p>We are specialized in <span class="color-text"><b>development and designing of E-commerce and dynamic sites</b></span>. Be a part of creative agency and establish the brands and businesses.</p>
    </div>
    <div class="col-sm-3 col-xs-6" style="padding:15px;">
      <span class="fa fa-check-square-o logo-small"></span>
      <h4>WEB ASSIGNMENTS</h4>
      <p>We are specialized in completing assignments in Web terms. Done your <span class="color-text"><b>PHP, JavaScript/Jquery, HTML/CSS, Bootstrap, OOP</b></span> assignments on time.</p>
    </div>
	<div class="visible-xs" style="clear:both"></div>
    <div class="col-sm-3 col-xs-6" style="padding:15px;">
      <span class="fa fa-database logo-small"></span>
      <h4>Database</h4>
      <p>Design and create normalized <span class="color-text"><b>MySQL Database</b></span> with <span class="color-text"><b>20+ Tables</b></span> and their relationships, write <span class="color-text"><b>queries</b></span> and <span class="color-text"><b>fix issues</b></span>.</p>
    </div>
    <div class="col-sm-3 col-xs-6" style="padding:15px;">
      <span class="glyphicon glyphicon-wrench logo-small"></span>
      <h4>FIXING ISSUES</h4>
      <p>Specialized in fixing web issues. Fix your <span class="color-text"><b>PHP bug issues, CSS responsive issues</b></span> within <span class="color-text"><b>12 hours</b></span>.</p>
    </div>
  </div>
  <br><br>
</div>

<div id="portfolio" class="container-fluid text-center bg-grey">
  <h2>Portfolio</h2><br>
  <h4>What we have created</h4>
  <div class="row text-center slideanim">
    <div class="col-sm-4">
      <div class="thumbnail">
        <img src="paris.jpg" alt="Paris" width="400" height="300">
        <p><strong>Paris</strong></p>
        <p>Yes, we built Paris</p>
      </div>
    </div>
    <div class="col-sm-4">
      <div class="thumbnail">
        <img src="newyork.jpg" alt="New York" width="400" height="300">
        <p><strong>New York</strong></p>
        <p>We built New York</p>
      </div>
    </div>
    <div class="col-sm-4">
      <div class="thumbnail">
        <img src="sanfran.jpg" alt="San Francisco" width="400" height="300">
        <p><strong>San Francisco</strong></p>
        <p>Yes, San Fran is ours</p>
      </div>
    </div>
  </div><br>
  
  <h2>Happy Clients</h2>
  <div id="myCarousel" class="carousel slide text-center" data-ride="carousel">
    
    <ol class="carousel-indicators">
      <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
      <li data-target="#myCarousel" data-slide-to="1"></li>
      <li data-target="#myCarousel" data-slide-to="2"></li>
    </ol>

<div class="carousel-inner" role="listbox">
      <div class="item active">
        <h4> <p style="margin:50px">"Efficient and effective interactions for the final product! Clear understanding of the work requested and prompt communication to work out any discrepencies."<br><span>Chancemd</span></p></h4>
      </div>
      <div class="item">
        <h4>"One word... WOW!!"<br><span>John Doe, Salesman, Rep Inc</span></h4>
      </div>
      <div class="item">
        <h4>"Could I... BE any more happy with this company?"<br><span>Chandler Bing, Actor, FriendsAlot</span></h4>
      </div>
    </div>

<a class="left carousel-control" href="#myCarousel" role="button" data-slide="prev">
      <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
      <span class="sr-only">Previous</span>
    </a>
    <a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">
      <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
      <span class="sr-only">Next</span>
    </a>
  </div>
</div>

<div id="gigs" class="container-fluid">
  <div class="text-center">
    <h2>Gigs</h2>
    <h4>Choose a payment plan that works for you</h4>
  </div>
  <?php
	$panel_title[0] = 'Complete Website';
	$gig_title[0] = 'I Will Create Complete And Secure Website In PHP And Mysql';
	$gig_picture[0] = 'gig1.png';
	$gig_price[0] = 70;
	$gig_link[0] = 'https://www.fiverr.com/muhammadabub739/create-responsive-and-secure-website-in-php-with-mysql';
	$gig_features[0] = array(
						"Dynamic Website", 
						"Admin Panel", 
						"Users",
						"Database (MySQL)",
						"File Upload",
						"Email Integration",
						"Payment Methods",
						"Responsive Design",
						"Backend in PHP",
						"Source Code"
						);
	
	$panel_title[1] = 'Web Designing';
	$gig_title[1] = 'I Will Create Responsive Web Design, Landing Page etc';
	$gig_picture[1] = 'gig2.png';
	$gig_price[1] = 25;
	$gig_link[1] = 'https://www.fiverr.com/muhammadabub739/convert-your-website-to-responsive';
	$gig_features[1] = array(
						"Responsive Design",
						"Customized Design",
						"Landing Page",
						"Modern Look",
						"Parallax Scrolling",
						"Bootstrap",
						"Device Compatibility",
						"Browser Compatibility"
						);
	
	$panel_title[2] = 'Web Assignments';
	$gig_title[2] = 'I Will Do Web Assignments Tasks, PHP, JS, HTML CSS, Bootstrap, CI';
	$gig_picture[2] = 'gig3.png';
	$gig_price[2] = 25;
	$gig_link[2] = 'https://www.fiverr.com/muhammadabub739/do-web-assignments-tasks-php-js-html-css-bootstrap-ci';
	$gig_features[2] = array(
						"Custom Coding",
						"Documentation",
						"Proper Commenting",
						"Scripting",
						"Designing",
						"HTML & CSS",
						"Functions",
						"OOP Concepts"
						);
  ?>
  
<div class="row">
  <?php 
    $gig_count = 0;
	for ($i=0;$i<count($gig_title);$i++) { 
		$gig_count++;
  ?>
	<div class="col-lg-4 col-md-12">
	  <div class="panel panel-default slideanim">
		<div class="panel-heading text-center">
		  <?php echo $panel_title[$i] ?>
		</div>
		<div class="row">
			<div class="col-lg-12 col-md-4 col-sm-6 col-xs-8 col-xs-offset-2 col-sm-offset-0 col-xs-full">
				<div class="panel-body">
				  <img src="images/<?php echo $gig_picture[$i] ?>" class="img-responsive" width="100%">
				</div>
			</div>
			<div class="col-lg-12 col-md-5 col-sm-6 col-xs-12 col-xs-full">
				<div class="panel-footer">
				  <h4><?php echo $gig_title[$i] ?></h4>
					<table class="panel-table">
						<tr>
							<td>
								<?php for ($j=0;$j<count($gig_features[$i]);$j=$j+2) { ?>
									<p><span class="glyphicon glyphicon-check"></span> <?php echo $gig_features[$i][$j]; ?></p>
								<?php } ?>
							</td>
							<td>
								<?php for ($j=1;$j<count($gig_features[$i]);$j=$j+2) { ?>
									<p><span class="glyphicon glyphicon-check"></span> <?php echo $gig_features[$i][$j]; ?></p>
								<?php } ?>
							</td>
						</tr>
					</table>
				</div>
			</div>
			<div class="col-lg-12 col-md-3 col-sm-12 col-xs-12 col-xs-full">
				<div class="panel-footer text-center panel-price">
				  <h3>Starting At <b class="price">$<?php echo $gig_price[$i] ?></b></h3>
				  <a href="<?php echo $gig_link[$i]; ?>" target="_blank"><button class="btn btn-sm">CONTACT NOW</button></a>
				</div>
				
			</div> 
		</div> 
	  </div>
	</div>
	<?php if ($gig_count%3==0) echo '<div class="visible-lg" style="clear:both"></div>';  ?>
  <?php } ?>
</div>
  
  <div class="panel panel-default slideanim">
	<div class="panel-heading text-center">
	  More Gigs
	</div>
	<div class="row">
		<div class="col-sm-4">
			<div class="panel-body">
			  <img src="images/gig4.png" class="img-responsive" width="100%">
			</div>
			<div class="panel-footer text-center more-gigs">
			  <h4 class="more-gigs-heading">I Will Fix CSS, PHP, Responsive, HTML Issues</h4>
			  <h4>Starting At <b class="price">$5</b></h4>
			  <a href="https://www.fiverr.com/muhammadabub739/fix-css-php-responsive-html-issues" target="_blank"><button class="btn btn-sm">CONTACT NOW</button></a>
			</div>
		</div>
		<div class="col-sm-4">
			<div class="panel-body">
			  <img src="images/gig5.png" class="img-responsive" width="100%">
			</div>
			<div class="panel-footer text-center more-gigs">
			  <h4 class="more-gigs-heading">I Will Create Dashboard Or Admin Panel In PHP Or In Code Igniter</h4>
			  <h4>Starting At <b class="price">$70</b></h4>
			  <a href="https://www.fiverr.com/muhammadabub739/create-dashboard-or-admin-panel-in-php-mysql-or-code-igniter" target="_blank"><button class="btn btn-sm">CONTACT NOW</button></a>
			</div>
		</div>
		<div class="col-sm-4">
			<div class="panel-body">
			  <img src="images/gig6.png" class="img-responsive" width="100%">
			</div>
			<div class="panel-footer text-center more-gigs">
			  <h4 class="more-gigs-heading">I Will Convert PSD To Html</h4>
			  <h4>Starting At <b class="price">$20</b></h4>
			  <a href="https://www.fiverr.com/muhammadabub739/convert-psd-to-html" target="_blank"><button class="btn btn-sm">CONTACT NOW</button></a>
			</div>
		</div>
	</div> 
  </div> 
</div>

<div id="contact" class="container-fluid bg-grey">
  <h2 class="text-center">CONTACT</h2>
  <div class="row">
    <div class="col-sm-5">
      <p>Contact us and we'll get back to you within 24 hours.</p>
      <p><span class="glyphicon glyphicon-map-marker"></span> <b>Multan, Pakistan</b></p>
      <p><span class="glyphicon glyphicon-phone"></span> <b>+92 304 5357 190</b></p>
      <p><span class="glyphicon glyphicon-envelope"></span> <b>abubakr123.ch@gmail.com</b></p>
    </div>
    <div class="col-sm-7 slideanim">
      <div class="row">
        <div class="col-sm-6 form-group">
          <input class="form-control" id="name" name="name" placeholder="Name" type="text" required>
        </div>
        <div class="col-sm-6 form-group">
          <input class="form-control" id="email" name="email" placeholder="Email" type="email" required>
        </div>
      </div>
      <textarea class="form-control" id="comments" name="comments" placeholder="Comment" rows="5"></textarea><br>
      <div class="row">
        <div class="col-sm-12 form-group">
          <button class="btn btn-default pull-right" type="submit">Send</button>
        </div>
      </div>
    </div>
  </div>
</div>

<div id="" style="height:400px;width:100%;">
	<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d27592.50517634972!2d71.38132603245718!3d30.17819008734793!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x393b33d4cc95dbb3%3A0xc5dc139a9b62ab2!2sMultan%20Cantonment%2C%20Multan%2C%20Punjab%2C%20Pakistan!5e0!3m2!1sen!2s!4v1596913867179!5m2!1sen!2s" width="100%" height="450" frameborder="0" style="border:0;" allowfullscreen="" aria-hidden="false" tabindex="0"></iframe>
</div>

<footer class="container-fluid text-center">
  <a href="#myPage" title="To Top">
    <span class="glyphicon glyphicon-chevron-up"></span>
  </a>
  <p>Copyright <?php echo date('Y')?> | All Rights Reserved. AB IT Solutions</p>
</footer>

// Store hash
      var hash = this.hash;

// Using jQuery's animate() method to add smooth page scroll
      // The optional number (900) specifies the number of milliseconds it takes to scroll to the specified area
      $('html, body').animate({
        scrollTop: $(hash).offset().top
      }, 900, function(){
   
        // Add hash (#) to URL when done scrolling (default click behavior)
        window.location.hash = hash;
      });
    } // End if
  });
  
  $(window).scroll(function() {
    $(".slideanim").each(function(){
      var pos = $(this).offset().top;

var winTop = $(window).scrollTop();
        if (pos < winTop + 600) {
          $(this).addClass("slide");
        }
    });
  });
  
  $(window).scrollTop(1);
})
</script>

</body>
</html>

Back to Directory File Manager