Skip to content

Commit

Permalink
bestgiftadd
Browse files Browse the repository at this point in the history
  • Loading branch information
MimChowdhury66 committed Jan 9, 2024
1 parent 8e02786 commit d7477a3
Show file tree
Hide file tree
Showing 2 changed files with 216 additions and 82 deletions.
204 changes: 129 additions & 75 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -112,6 +112,61 @@ <h2 class="offer">

</section>

<!-- Best offer section -->
<section
class="best-offer-container">
<div
class="best-offer-text">
<h3>NEW BEST
OFFER</h3>
<h1>Coming
Soon</h1>
<p>In this
year of
2024, we
are about
to
<br>introduce
so many
items
within
your
budget.
<br> Also
there will
be so many
discount
with <br>
exciting
gift
and many
more. Just
keep <br>
an eye on
our
website
</p>
</div>
<div
class="best-offer-img">
<img src="images/Ellipse 1.png"
alt="">
</div>
<div
class="best-offer-year">
<h1>2024</h1>
<p>So without
any
further
due <br>
lets
shopping
with us.
</p>
<img src="images/Group 96.png" alt="">
</div>

</section>

<!-- portfolio section -->
<section
Expand Down Expand Up @@ -221,93 +276,92 @@ <h2 class="offer">
</div>
</section>

<footer>
<section
class="footer">
<div
class="footer-top">
<div
class="top-left">
<p>44,
Big
Building
Roosevelt
Street
<br>

Beach
Gardens
Florida
33410
</p>
</div>
<div
class="top-right">

<p><img src="images/Call.png"
alt=""
width="24px"
height="24px">+00
123
584
124
</p>

<p><img src="images/Website.png"
alt=""
width="24px"
height="24px">
www.website.com
</p>
</div>
</div>
<!-- hr tag -->

<hr
style="width: 1000px; background: rgba(255, 255, 255, 0.15);">

</main>

<!-- footer section -->
<footer>
<section
class="footer">
<div
class="footer-top">
<div
class="top-left">
<p>44,
Big
Building
Roosevelt
Street
<br>

Beach
Gardens
Florida
33410
</p>
</div>
<div
class="footer-middle">
<div
class="footer-img">
<img src="images/Facebook.png"
alt="">
<img src="images/Instagram.png"
alt="">
<img src="images/Twitter.png"
alt="">
<img src="images/Linkedin.png"
alt="">
</div>
class="top-right">

<p><img src="images/Call.png"
alt=""
width="24px"
height="24px">+00
123
584
124
</p>

<p><img src="images/Website.png"
alt=""
width="24px"
height="24px">
www.website.com
</p>
</div>
</div>
<!-- hr tag -->

<hr
style="width: 1000px; background: rgba(255, 255, 255, 0.15);">
<hr
style="width: 1000px; background: rgba(255, 255, 255, 0.15);">

<div
class="footer-middle">
<div
class="footer-bottom">
<div
class="bottom-left">
<p>2017,
All
Rights
Reserved.
</p>
</div>
<div
class="bottom-right">
<p>Unsubscribe
</p>
</div>
class="footer-img">
<img src="images/Facebook.png"
alt="">
<img src="images/Instagram.png"
alt="">
<img src="images/Twitter.png"
alt="">
<img src="images/Linkedin.png"
alt="">
</div>
</section>
</footer>

</main>
</div>

<footer>
<hr
style="width: 1000px; background: rgba(255, 255, 255, 0.15);">

<div
class="footer-bottom">
<div
class="bottom-left">
<p>2017,
All
Rights
Reserved.
</p>
</div>
<div
class="bottom-right">
<p>Unsubscribe
</p>
</div>
</div>
</section>
</footer>
</body>

Expand Down
94 changes: 87 additions & 7 deletions styles/style.css
Original file line number Diff line number Diff line change
@@ -1,8 +1,9 @@
body {
/* margin: auto; */
/* margin: 0 140px; */
/* max-width: 1250px;
margin: 0 auto; */
}


.header-container {

background-image: linear-gradient(180deg, #070211, rgba(7, 2, 17, 0.00)100%), url('../images/Banner\ Image.png');
Expand All @@ -23,7 +24,9 @@ body {

.banner-title {
padding-top: 177px;
color: blue;
color: #FFF;


text-align: center;
font-size: 32px;
font-weight: 400;
Expand All @@ -32,14 +35,90 @@ body {
.banner-topic {
/* padding-top: 5px; */
padding-bottom: 177px;
color: blue;
color: #FFF;


text-align: center;
font-size: 72px;
font-weight: 900;
line-height: 95px;
/* 131.944% */
}

.best-offer-text h3 {
color: #F00;
/* text-align: center; */
font-family: Inter;
font-size: 24px;
font-style: normal;
font-weight: 500;
line-height: normal;
}

.best-offer-text h1 {
color: #070211;
font-family: Merriweather;
font-size: 48px;
font-style: normal;
font-weight: 900;
line-height: normal;
text-transform: capitalize;
}

.best-offer-text p {
color: rgba(7, 2, 17, 0.60);
font-family: Inter;
font-size: 20px;
font-style: normal;
font-weight: 400;
line-height: 32px;
/* 160% */
}

.best-offer-img {
width: 364.844px;
height: 364.844px;
border-radius: 50%;
padding: 25px;
border: 15px solid #F00;
/* width: 463px;
height: 463px; */
flex-shrink: 0;
}


.best-offer-container {
padding-top: 120px;

display: flex;
justify-content: space-between;
}

.best-offer-year h1 {
color: #F00;
font-family: Inter;
font-size: 48px;
font-style: normal;
font-weight: 700;
line-height: normal;
}

.best-offer-year p {
color: rgba(7, 2, 17, 0.60);
font-family: Inter;
font-size: 20px;
font-style: normal;
font-weight: 400;
line-height: 32px;
/* 160% */
}

.best-offer-year img {
width: 140px;
height: 140px;
flex-shrink: 0;
}

.offer {
font-family: 'Inter', sans-serif;
color: #F00;
Expand Down Expand Up @@ -361,7 +440,7 @@ body {

.bottom-left {
padding-left: 140px;
padding-bottom: 120px;
padding-bottom: 120px;
color: #FFF;
font-family: Inter;
font-size: 24px;
Expand All @@ -372,15 +451,16 @@ padding-bottom: 120px;

.bottom-right {
padding-left: 140px;
padding-right: 140px;
padding-right: 140px;
color: #FFF;
font-family: Inter;
font-size: 24px;
font-style: normal;
font-weight: 500;
line-height: normal;
}
.footer-bottom{

.footer-bottom {
display: flex;
justify-content: space-between;
}

0 comments on commit d7477a3

Please sign in to comment.