<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title>SocialStitch</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css">
<link rel="stylesheet" href="style1.css">
<link rel="shortcut icon" type="img/jpeg" href="img/logo1.jpeg">
<link href="https://fonts.googleapis.com/css?family=Josefin+Sans" rel="stylesheet">
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js"></script>
</head>
<body>
<div class= "navbar navbar-expand-lg navbar-dark bg-dark-black" id="navigation">
<img src="img/logo1.jpeg" alt="" width="7%">
<img src="img/logo2.jpeg" alt="" width="20%" class="logotext">
<!-- <h1 class="text-center text-md-left" style="color: #fff;font-size: 120 px; " id ="h1ss">SocialStitch.com</h1>
-->
<ul class = "nav navbar-nav navbar nav-item">
<button class="navbar-toggler" data-toggler="collapse" data-target="#navbarMenu">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarMenu">
<ul class="navbar-nav">
<li class="nav-item">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" id="log">Login </a>
<ul class="dropdown-menu">
<li><a href="#">Owner Login</a></li>
<li><a href="#">Customer Login</a></li>
</ul>
</li>
</ul>
</div>
</ul>
</div>
</div>
<!--<h2 style="font-size:80px;background-color:black;color:white;"><center>SOCIALSTITCH</center></h2>-->
<!--<nav class="navbar navbar-expand-lg navbar-dark bg-dark" id="navbarMenu">
<button class="navbar-toggler" data-toggler="collapse" data-target="#navbarMenu">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarMenu">
<ul class="navbar-nav">
<div><a href="#">About Us</a></div>
<div><a href="#">Services</a></div>
<li class="nav-item">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Login </a>
<ul class="dropdown-menu">
<li><a href="#">Owner Login</a></li>
<li><a href="#">Customer Login</a></li>
</ul>
</li>
</ul>
</div>
</nav>-->
<div id="demo1">
<div id="demo" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ul class="carousel-indicators">
<li data-target="#demo" data-slide-to="0" class="active"></li>
<li data-target="#demo" data-slide-to="1"></li>
<li data-target="#demo" data-slide-to="2"></li>
<li data-target="#demo" data-slide-to="3"></li>
<li data-target="#demo" data-slide-to="4"></li>
<li data-target="#demo" data-slide-to="5"></li>
<li data-target="#demo" data-slide-to="6"></li>
<li data-target="#demo" data-slide-to="7"></li>
</ul>
<!-- The slideshow -->
<div class="carousel-inner">
<div class="carousel-item active">
<img src="img/b12.jpg" width="1600px" height="100%" alt="Los Angeles">
</div>
<div class="carousel-item">
<img src="img/b11.jpg" width="1700px" height="620px" alt="Chicago">
</div>
<div class="carousel-item">
<img src="img/b3.jpg" width="1535px" height="620px" alt="New York">
</div>
<div class="carousel-item">
<img src="img/b5.jpg" width="1535px" height="620px" alt="New York">
</div>
<div class="carousel-item">
<img src="img/b9.jpg" width="1535px" height="100%" alt="New York">
</div>
<div class="carousel-item">
<img src="img/b17.jpeg" width="1510px" height="620px" alt="New York">
</div>
<div class="carousel-item">
<img src="img/b18.jpg" width="1510px" height="620px" alt="New York">
</div>
</div>
<!-- Left and right controls -->
<a class="carousel-control-prev" href="#demo" data-slide="prev">
<span class="carousel-control-prev-icon"></span>
</a>
<a class="carousel-control-next" href="#demo" data-slide="next">
<span class="carousel-control-next-icon"></span>
</a>
</div>
<div>
<!-- Footer -->
<section id="footer">
<div class="container">
<div class="row text-center text-xs-center text-sm-left text-md-left">
<div class="col-xs-4 col-sm-4 col-md-4">
<h5>Quick links</h5>
<ul class="list-unstyled quick-links">
<li><a href="#"><i class="fa fa-angle-double-right"></i>Home</a></li>
<li><a href="#"><i class="fa fa-angle-double-right"></i>About</a></li>
<li><a href="#"><i class="fa fa-angle-double-right"></i>Contact Us</a></li>
<li><a href="#"><i class="fa fa-angle-double-right"></i>FAQ</a></li>
</ul>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-12 mt-2 mt-sm-5">
<ul class="list-unstyled list-inline social text-center">
<li class="list-inline-item"><a href="#"><i class="fa fa-facebook"></i></a></li>
<li class="list-inline-item"><a href="#"><i class="fa fa-twitter"></i></a></li>
<li class="list-inline-item"><a href="#"><i class="fa fa-instagram"></i></a></li>
<li class="list-inline-item"><a href="#"><i class="fa fa-google-plus"></i></a></li>
<li class="list-inline-item"><a href="#" target="_blank"><i class="fa fa-envelope"></i></a></li>
</ul>
</div>
</hr>
</div>
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-12 mt-2 mt-sm-2 text-center text-white">
<p class="h6">© All right Reversed.<a class="text-green ml-2" href="#" target="_blank">SocialStitch</a></p>
</div>
</hr>
</div>
</div>
</div>
</div>
</body>
</html>
