First-website-Design/index.html at master · SudeepPatra3/First-website-Design · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>SUDEEP</title>
    <link rel="stylesheet" href="./style.css">
    <link rel="stylesheet" href="./bootstrap-4.3.1-dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
    <link rel="stylesheet" href="./font-awesome-4.7.0/css/font-awesome.min.css">
</head>
<body>
    <section id="nav-bar">
        <nav class="navbar navbar-expand-lg navbar-light">
            <a class="navbar-brand" href="#"><h1><i class="fa fa-paw" aria-hidden="true"></i></h1></a>
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
                <i class="fa fa-bars" aria-hidden="true"></i>
            </button>
            <div class="collapse navbar-collapse" id="navbarNav">
              <ul class="navbar-nav ml-auto">
                <li class="nav-item active">
                  <a class="nav-link" href="#top">Home</a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" href="#services">Services</a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" href="#about-us">About us</a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" href="#testimonials">Testimony</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="#footer">Contact</a>
                  </li>
              </ul>
            </div>
          </nav>
    </section>
    <!--------------------------------menu bar over here-------------------------------------------------------------->
    <!-- -----------------------------BANNER SECTION HERE-------------------------------------------------------------->
    <section id="banner">
        <div class="container">
            <div class="row">
                <div class="col-md-6">
                    <p class="title">BEST DIGITAL AGENCY</p>
                    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Cumque suscipit, eius laboriosam ipsum iure optio. Excepturi enim voluptatum provident nostrum dolores, sapiente totam earum, ut error cumque minus fugit repellat.</p>
                    <a href="#"><i class="fa fa-play-circle" aria-hidden="true"></i>&nbsp;WATCH</a>
                </div>
                <div class="col-md-6">
                    <img class="img-fluid" src="./download.png" alt="yes">
                </div>
            </div>
        </div>
        <img class="bottom-img" src="./download.jpg" alt="yes">
    </section>
    <!---------------------------------------------------------SERVICES----------------------------------------------->
    <section id="services">
        <div class="container text-center">
            <h1 class="title text-center">What We Do ?</h1>
            <div class="row text-center">
                <div class="col-md-4 services">
                    <img src="./images.jpg" alt="yes" class="service-img">
                    <h4>Online Branding</h4>
                    <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Temporibus rem, explicabo excepturi eligendi quo quae ipsam dolores recusandae, quisquam ut dolor reiciendis ex molestiae, ullam laudantium at corrupti expedita. Rem.</p>
                </div>
                <div class="col-md-4 services">
                    <img src="./images.jpg" alt="yes" class="service-img">
                    <h4>Growth Marketing</h4>
                    <p>Lorem ipsum dolor sit amet consectetur, adipisicing elit. Odit natus, sapiente explicabo iure deleniti, quas animi, quis cum doloribus nobis et minima harum repudiandae at necessitatibus iusto accusamus pariatur possimus!</p>
                </div>
                <div class="col-md-4 services">
                    <img src="./images.jpg" alt="yes" class="service-img">
                    <h4>Animated Ads</h4>
                    <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Quas sit officiis repellat nobis tempore repellendus. Minima porro earum, deleniti illum illo repudiandae? Quam unde impedit, nobis animi minus similique eveniet?</p>
                </div>
            </div>
            <button type="button" class="btn btn-primary">All Services</button>
        </div>
    </section>

    <!---------------------------------------------------About Us-------------------------------------------------->

    <section id="about-us">
        <div class="container">
            <h1 class="title text-center">Why Choose Us ?</h1>
            <div class="row">
                <div class="col-md-6 about-us">
                    <p class="about-title">Why We Are Different</p>
                    <ul>
                        <li>Belive In Business</li>
                        <li>Belive In Business</li>
                        <li>Belive In Business</li>
                        <li>Belive In Business</li>
                        <li>Belive In Business</li>
                    </ul>
                </div>
                <div class="col-md-6">
                    <img src="./images.jpg" alt="yes" class="img-fluid">
                </div>
            </div>
        </div>
    </section>

    <!----------------------------------Testimonials---------------------------------------------------------->
    <section id="testimonials">
        <div class="container">
            <h1 class="title text-center">What Client Says</h1>
            <div class="row offset-1">
                <div class="col-md-5 testimonials">
                    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit.fugit quas eius eaque eveniet ad enim? Dolorem ullam laborum qui hic. Pariatur laudantium, aspernatur a facilis doloribus facere!</p>
                <img src="./IMG_20190817_172536.jpg" alt="yes">
                <p><b>Sudeep</b><br>Co-Founder</p>
                </div>
                <div class="col-md-5 testimonials">
                        <p>Lorem ipsum dolor sit amet consectetur adipisicingfugit quas eius eaque eveniet ad enim? Dolorem ullam laborum qui hic. Pariatur laudantium, aspernatur a facilis doloribus facere!</p>
                    <img src="./SAVE_20190707_101100.jpeg" alt="yes">
                    <p><b>Simun</b><br>Co-Founder</p>
                    </div>
            </div>
        </div>
    </section>
    <!------------------------------------------------footer------------------------------------------------------------>
    <section id="footer">

        <div class="container">
            <div class="row">
                <div class="col-md-4 footer-box">
                    <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTcEfyDtQFHVnOy9xXjTVwLj2A5nPitfGFANfomm7ZwyrYmZ26Qsw" alt="yes">
                    <p>Lorem ipsum dolor tur adipisicing elit. Quis est dolorum natus debitis deleniti earum accusamus eaque laborum nobis ob repellat, et assumenda, illo facilis dolores at.</p>
                </div>
            <div class="col-md-4 footer-box">
                <p><b>Contact Us </b></p>
                <p><i class="fa fa-map-marker"></i> Trade Centre,Bengaluru</p>
                <p><i class="fa fa-phone-square" aria-hidden="true"></i>&nbsp;9861219998</p>
                <p><i class="fa fa-envelope" aria-hidden="true"></i>&nbsp;sudeepkumar.patra3@gmail.com</p>
            </div>
            <div class="col-md-4 footer-box">
                <p><b>Subscribe Newsletter</b></p>
                <input type="email" class="form-control" placeholder="your email">
                <button type="button" class="btn btn-primary">Submit</button>
            </div>
        </div>
        <hr>
        <p class="copyright">Website Crafted By Sudeep</p>
        </div>
    </section>

    <script src="./smooth-scroll-master/dist/smooth-scroll.js"></script>
    <script>
            var scroll = new SmoothScroll('a[href*="#"]');
        </script>
</body>

</html>