-
Notifications
You must be signed in to change notification settings - Fork 0
/
About_us.html
117 lines (116 loc) · 7.93 KB
/
About_us.html
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
<!DOCTYPE html>
<html lang="en">
<head>
<title>About_us</title>
<style>
.s1, .s2, .s3, .s4, .s5, .s6, .s7{
margin-left:50px;
}
.spinner{
text-align: center;
margin-top:20px;
}
</style>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="css\style.css">
<!-- Bootstrap CSS -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<!-- Option 1: Bootstrap Bundle with Popper -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
<script>
var tooltipTriggerList = [].slice.call(document.querySelectorAll('[data-bs-toggle="tooltip"]'))
var tooltipList = tooltipTriggerList.map(function (tooltipTriggerEl) {
return new bootstrap.Tooltip(tooltipTriggerEl)
})
</script>
<!--font-->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Pacifico&display=swap" rel="stylesheet">
</head>
<body>
<!--Navbar-->
<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<div class="container-fluid">
<a class="navbar-brand" href="#">Bootstrap Website</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse NVB" id="navbarSupportedContent">
<ul class="navbar-nav me-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link active" aria-current="page" href="index.html">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="About_us.html">About Us</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
Services
</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item" href="images.html">Images</a></li>
<li><a class="dropdown-item" href="more_info.html">More information</a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="contact_us.html">contact us</a></li>
</ul>
</li>
</ul>
</div>
</div>
</nav>
<!--About Us-->
<section class="Main head my-4">
<div class="text-center">
<h1 class="display-4">about me</h1>
<hr class="w-25 mx-auto"></hr>
</div>
<!--spinners-->
<div class="spinner">
<div class="spinner-grow text-primary s1" role="status">
<span class="visually-hidden">Loading...</span>
</div>
<div class="spinner-grow text-secondary s2" role="status">
<span class="visually-hidden">Loading...</span>
</div>
<div class="spinner-grow text-success s3" role="status">
<span class="visually-hidden">Loading...</span>
</div>
<div class="spinner-grow text-danger s4" role="status">
<span class="visually-hidden">Loading...</span>
</div>
<div class="spinner-grow text-warning s5" role="status">
<span class="visually-hidden">Loading...</span>
</div>
<div class="spinner-grow text-info s6" role="status">
<span class="visually-hidden">Loading...</span>
</div>
<div class="spinner-grow text-light s7" role="status">
<span class="visually-hidden">Loading...</span>
</div>
</div>
<div class="container">
<div class="row my-5">
<div class="col lg-6 col-md-6 col-12 col-xxl-6">
<figure>
<img src="images\img16.jpg "class="img-fluid about-img">
</figure>
</div>
<div class="col-lg-6 col-md-6 col-12 col-xxl-6 d-flex justify-content align-items-start flex-column">
<h1>my journey</h1>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Tempore cupiditate, fugiat, nulla molestiae sunt enim assumenda, reprehenderit hic consequuntur dolor ullam quam excepturi? Numquam facilis deserunt expedita aut, cumque tempore?
Lorem ipsum dolor sit amet consectetur adipisicing elit. Tempore cupiditate.Lorem ipsum dolor sit amet consectetur adipisicing elit. Tempore cupiditate, fugiat, nulla molestiae sunt enim assumenda, reprehenderit hic consequuntur dolor ullam quam excepturi? Numquam facilis deserunt expedita aut, cumque tempore?
Lorem ipsum dolor sit amet consectetur adipisicing elit. Tempore cupiditate.Lorem ipsum dolor sit amet consectetur adipisicing elit. Tempore cupiditate, fugiat, nulla molestiae sunt enim assumenda, reprehenderit hic consequuntur dolor ullam quam excepturi? Numquam facilis deserunt expedita aut, cumque tempor0e
</p>
</div>
<div class="col-xxl-12 col-12 justify-content-center align-items-start"><p><div class="col-xxl-12 col-12 justify-content-center"><p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Nulla voluptate totam saepe harum fugit sed itaque voluptates, minus laudantium dolorem doloremque aliquid, unde maxime earum nobis quasi. Culpa, esse Lorem ipsum dolor sit amet consectetur adipisicing elit. Nulla voluptate totam saepe harum fugit sed itaque voluptates, minus laudantium dolorem doloremque aliquid, unde maxime earum nobis quasi. Culpa, esse Lorem ipsum dolor sit amet consectetur adipisicing elit. Nulla voluptate totam saepe harum fugit sed itaque voluptates, minus laudantium dolorem doloremque aliquid, unde maxime earum nobis quasi. Culpa, esse Lorem ipsum dolor sit amet consectetur adipisicing elit. Nulla voluptate totam saepe harum fugit sed itaque voluptates, minus laudantium dolorem doloremque aliquid, unde maxime earum nobis quasi. Culpa, esse Lorem ipsum dolor sit amet consectetur adipisicing elit. Nulla voluptate totam saepe harum fugit sed itaque voluptates, minus laudantium dolorem doloremque aliquid, unde maxime earum nobis quasi. Culpa, esse Lorem ipsum dolor sit amet consectetur adipisicing elit. Nulla voluptate totam saepe harum fugit sed itaque voluptates, minus laudantium dolorem doloremque aliquid, unde maxime earum nobis quasi. Culpa, esse
Lorem ipsum dolor sit amet consectetur adipisicing elit. Nulla voluptate totam saepe harum fugit sed itaque voluptates, minus laudantium dolorem doloremque aliquid, unde maxime earum nobis quasi. Culpa, esse Lorem ipsum dolor sit amet consectetur adipisicing elit. Nulla voluptate totam saepe harum fugit sed itaque voluptates, minus laudantium dolorem doloremque aliquid, unde maxime earum nobis quasi. Culpa, esse Lorem ipsum dolor sit amet consectetur adipisicing elit. Nulla voluptate totam saepe harum fugit sed itaque voluptates, minus laudantium dolorem doloremque aliquid, unde maxime earum nobis quasi. Culpa, esse Lorem ipsum dolor sit amet consectetur adipisicing elit. Nulla voluptate totam saepe harum fugit sed itaque voluptates, minus laudantium dolorem doloremque aliquid, unde maxime earum nobis quasi. Culpa, esse Lorem ipsum dolor sit amet consectetur adipisicing elit. Nulla voluptate totam saepe harum fugit sed itaque voluptates, minus laudantium dolorem doloremque aliquid, unde maxime earum nobis quasi. Culpa, esse Lorem ipsum dolor sit amet consectetur adipisicing elit. Nulla voluptate totam saepe harum fugit sed itaque voluptates, minus laudantium dolorem doloremque aliquid, unde maxime earum nobis quasi. Culpa, esse
</div>
</div>
</section>
<!--footer-->
<footer class="bg-secondary text-center text-white">
<p>copyright Anu</p>
</footer>