Skip to content

Commit

Permalink
m
Browse files Browse the repository at this point in the history
  • Loading branch information
Khadijah-11 committed Jun 4, 2024
1 parent bfa600a commit 0754d36
Show file tree
Hide file tree
Showing 2 changed files with 111 additions and 12 deletions.
62 changes: 61 additions & 1 deletion css/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -300,4 +300,64 @@ nav ul li a {
.social-media img {
max-height: 35px;

}
}
.our-services {
width: 100%;
text-align: center;
padding: 4em 2em;
background-color: #ffffff;
box-sizing: border-box;
}

.section-heading h5 {
font-size: 1.2em;
color: #64CCC5;
margin-bottom: 0.5em;
}

.section-heading h2 {
font-size: 2.5em;
margin-bottom: 2em;
font-family: 'Times New Roman', Times, serif;
}

.services-grid {
display: grid;
grid-template-columns: repeat(3, 1fr); /* 3 columns grid */
gap: 2em; /* Gap between grid items */
}
.service-box-1 {
background-color: #000000 !important;
color: #ffffff !important;
}
.service-box-1 h4,
.service-box-1 p {
color: #ffffff !important;
}

.service-box {
background-color: #f7f7f7; /* Optional background color for boxes */
padding: 2em;
border-radius: 8px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
text-align: left; /* Align text to the left inside boxes */
font-family: 'Times New Roman', Times, serif

}

.service-box img {
max-width: 40px;
margin-bottom: 1em;
}

.service-box h4 {
font-size: 1.4em;
margin-bottom: 0.5em;
color: #141414;
}

.service-box p {
font-size: 0.8em;
color: #242323;
font-family: DM Sans, sans-serif;
}
61 changes: 50 additions & 11 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -9,12 +9,12 @@

</head>
<body class="home-page">
<img src="images\Ornament.png" alt="Centered Image" class="centered-left-image">
<img src="images/Ornament.png" alt="Centered Image" class="centered-left-image">
<div class="wrapper">
<header class="main-header">
<div class="container">
<div class="logo">
<img src="images\logo.png" alt="Logo">
<img src="images/logo.png" alt="Logo">
<span class="company-name">Canvix</span>
</div>
<nav>
Expand All @@ -40,17 +40,56 @@ <h1>Ready to take your <span class="highlight">Business Growth</span> to the nex
</a>
<h2>Trusted by Leading Brands</h2>
<div class="image-grid">
<img src="images\brand1.png" alt="Image 1">
<img src="images\brand2.png" alt="Image 2">
<img src="images\brand3.png" alt="Image 3">
<img src="images\brand4.png" alt="Image 4">
<img src="images/brand1.png" alt="Image 1">
<img src="images/brand2.png" alt="Image 2">
<img src="images/brand3.png" alt="Image 3">
<img src="images/brand4.png" alt="Image 4">
</div>
</div>
<div class="right-homecontent">
<img src="images\Image.png" alt="Big Image" class="big-image">
<img src="images/Image.png" alt="Big Image" class="big-image">
</div>

</section>
<section class="our-services">
<div class="section-heading">
<h5>Our Services</h5>
<h2>High-impact services<br> for your business</h2>
</div>
<div class="services-grid">
<div class="service-box service-box-1">
<img src="images/content-writing.svg" alt="Service Icon">
<h4>Content Marketing</h4>
<p>Our team creates engaging and shareable content that resonates with your audience, drives organic traffic</p>
</div>
<div class="service-box">
<img src="images/graphic.svg" alt="Service Icon">
<h4>Graphic Design</h4>
<p>Unlock the power of visual storytelling with our expert graphic design services tailored to elevate your brand and captivate.</p>
</div>
<div class="service-box">
<img src="images/digital-marketing.svg" alt="Service Icon">
<h4>Digital Marketing</h4>
<p>Elevate your brand's online presence with our data-driven digital marketing strategies. From SEO and content marketing</p>
</div>
<div class="service-box">
<img src="images/webdesign.svg" alt="Service Icon">
<h4>Web Design</h4>
<p>We specialize in creating visually stunning, user-friendly websites that align with your brand identity and deliver an exceptional.</p>
</div>
<div class="service-box">
<img src="images/itconsulting.svg" alt="Service Icon">
<h4>IT Consulting</h4>
<p>IT consulting, or information technology consulting, refers to the practice of providing advisory and implementation services</p>
</div>
<div class="service-box">
<img src="images/brandidentity.svg" alt="Service Icon">
<h4>Brand Identity</h4>
<p>It involves creating a unique and recognizable identity that sets the brand apart from competitors and resonates with the target audience.</p>
</div>
</div>
</section>


</main>
<footer class="footer">
<div class="footer-top">
Expand Down Expand Up @@ -108,9 +147,9 @@ <h4>Subscribe</h4>
<p>123 Main Street, City, Country</p>
</div>
<div class="social-media">
<a href="#"><img src="images\facebook.svg" alt="Facebook"></a>
<a href="#"><img src="images\instagram.svg" alt="Instagram"></a>
<a href="#"><img src="images\linkedin.svg" alt="LinkedIn"></a>
<a href="#"><img src="images/facebook.svg" alt="Facebook"></a>
<a href="#"><img src="images/instagram.svg" alt="Instagram"></a>
<a href="#"><img src="images/linkedin.svg" alt="LinkedIn"></a>
</div>
</div>

Expand Down

0 comments on commit 0754d36

Please sign in to comment.