0% found this document useful (0 votes)
12 views

Document

Uploaded by

oluchukwuobina92
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
12 views

Document

Uploaded by

oluchukwuobina92
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 5

ChatGPT 4 | Midjourney | Claude | Suno:

Sure\! Here is an example of how you can structure your website using Bootstrap for a
responsive design:

```html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>GRM Investment Group</title>
<link rel="stylesheet"
href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
</head>
<body>

<!-- Navbar -->


<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
<a class="navbar-brand" href="#">GRM Investment Group</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-
target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle
navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNav">
<ul class="navbar-nav ml-auto">
<li class="nav-item active">
<a class="nav-link" href="#about">About Us</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#services">Services</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#contact">Contact</a>
</li>
</ul>
</div>
</nav>

<!-- About Section -->


<section id="about" class="container py-5">
<div class="row">
<div class="col-md-6">
<h1>About GRM Investment Group</h1>
<p>Welcome to GRM Investment Group. We have a proven track record of delivering
consistent, reliable results for our clients. We stay ahead of market trends and leverage cutting-
edge technologies to optimize our investment strategies.</p>
</div>
<div class="col-md-6">
<h2>Our Commitment</h2>
<p>At GRM Investment Group, we are committed to excellence in all that we do. We
strive to build long-lasting relationships with our clients based on trust, transparency, and mutual
respect. Our dedication to providing superior service and achieving outstanding results is at the
core of our business.</p>
</div>
</div>
</section>

<!-- Services Section -->


<section id="services" class="container py-5">
<h2 class="text-center mb-4">Our Services</h2>
<div class="row">
<div class="col-md-4">
<div class="card">
<div class="card-body">
<h5 class="card-title">Investment Planning</h5>
<p class="card-text">We offer personalized investment planning services tailored to
your financial goals and risk tolerance.</p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card">
<div class="card-body">
<h5 class="card-title">Portfolio Management</h5>
<p class="card-text">Our experienced portfolio managers will help you optimize
your investments for maximum returns.</p>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card">
<div class="card-body">
<h5 class="card-title">Financial Consulting</h5>
<p class="card-text">Get expert financial advice and consulting services to secure
your financial future.</p>
</div>
</div>
</div>
</div>
</section>

<!-- Contact Section -->


<section id="contact" class="container py-5">
<h2 class="text-center mb-4">Contact Us</h2>
<p class="text-center">Have a question or want to learn more about our services? Cont

act us today!</p>
<form>
<div class="form-group">
<label for="name">Name:</label>
<input type="text" class="form-control" id="name" placeholder="Enter your name">
</div>
<div class="form-group">
<label for="email">Email:</label>
<input type="email" class="form-control" id="email" placeholder="Enter your email">
</div>
<button type="submit" class="btn btn-primary">Submit</button>
</form>
</section>

<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"></
script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>

</body>
</html>
```

This code includes a responsive navbar, sections for About, Services, and Contact with Bootstrap
styling and classes\. Feel free to customize the content and design further according to your
needs\. Let me know if you need any more assistance\!
Sure! Here is an example of CSS that you can add to style the elements in your Bootstrap
website:

/* Custom CSS for GRM Investment Group website */

/* Navbar */
.navbar {
background-color: #343a40;
}

.navbar-brand {
color: #ffffff;
font-weight: bold;
}

.navbar-nav .nav-link {
color: #ffffff;
}

/* About Section */
#about {
background-color: #f8f9fa;
padding: 50px 0;
}

#about h1 {
color: #343a40;
}

#about p {
color: #6c757d;
}

/* Services Section */
#services {
background-color: #e9ecef;
padding: 50px 0;
}

#services h2 {
color: #343a40;
}

.card {
margin-bottom: 20px;
}

.card-title {
color: #343a40;
}

.card-text {
color: #6c757d;
}
/* Contact Section */
#contact {
background-color: #f8f9fa;
padding: 50px 0;
}

#contact h2 {
color: #343a40;
}

.form-group label {
color: #343a40;
}

.form-control {
margin-bottom: 10px;
}

.btn-primary {
background-color: #007bff;
color: #ffffff;
}

You can add this CSS code to a separate stylesheet or within a


<style>
tag in the
<head>
section of your HTML document. This CSS will style the navbar, sections, cards, form elements,
and buttons on your website. Feel free to customize the styles further to match your design
preferences. Let me know if you need any more help with styling!

You might also like