-
Notifications
You must be signed in to change notification settings - Fork 0
/
brand.html
154 lines (154 loc) · 9.78 KB
/
brand.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
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Avenue - The Brand</title>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css" integrity="sha384-B4dIYHKNBt8Bc12p+WXckhzcICo0wtJAoU8YZTY5qE0Id1GSseTk6S+L3BlXeVIU" crossorigin="anonymous">
<link rel="stylesheet" href="style.css">
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Montserrat:300,400,700" rel="stylesheet">
</head>
<body>
<header class="header">
<div class="container header__container">
<div class="header__left">
<p class="header__price">Currency <span>:</span> GBP <i class="fas fa-angle-down"></i></p>
</div>
<div class="header__right">
<a href="#" class="header__link">Register</a>
<a href="#" class="header__link">Sign In</a>
<a href="#" class="header__shopping-cart"><i class="fas fa-shopping-cart"></i><span>empty</span><i class="fas fa-angle-down"></i></a>
</div>
</div>
</header>
<div class="nav">
<div class="container container__nav">
<div class="nav__left">
<h3 class="nav__logo" ><span>AVENUE </span>FASHION</h3>
</div>
<div class="nav__right">
<nav class="nav__menu">
<a href="#" class="nav__link">MENS</a>
<a href="#" class="nav__link">WOMENS</a>
<a href="brand.html" class="nav__link">THE BRAND</a>
<a href="#" class="nav__link">LOCAL STORES</a>
<a href="#" class="nav__link">LOOK BOOK</a>
</nav>
<div class="nav__search search">
<input type="text" class="search__input" placeholder="Search...">
<button class="search__button"><i class="fas fa-search"></i></button>
</div>
</div>
</div>
</div>
<div class="content">
<main class="brand">
<section class="image">
<h1 class="image__heading"><span>THE</span> BRAND</h1>
<h3 class="image__slogan">COMPANY SLOGAN GOES HERE</h3>
</section>
<div class="brand__description">
<div class="container brand__container">
<img class="brand__picture1" src="img/brand1.jpg" alt="Male Designer near laptop">
<h4 class="brand__heading brand__heading_size_m brand__heading_padding_60">HAND DESIGNED CLOTHING</h4>
<h5 class="brand__heading brand__heading_size_s">established in 2013, avenue fashion Sed dictum elit vel sapien luctus eras</h5>
<p class="brand__text brand__text_margin_60">Praesent feugiat malesuada tristique maecenas rhoncus diam eget quam vestibulim consectetur, id condimentum leo porttitor. Cum sociis natoque penatibus eta magnis disut parturient montes, nascetur ridiculus mus. Donec sem lorem laoreet tempor un risus vitae, rutrum sodales nibh suspendisse congue metus nunc, id viverra elit loreti rhoncus quis consecteur es. Donec pulvinar tempor lorem a pretium justo interdum.</p>
<img class="brand__picture2" src="img/brand2.jpg" class="brand__" alt="Indian Woman looking at clothes">
<img class="brand__picture3" src="img/brand3.jpg" alt="Designer taking scales">
<h4 class="brand__heading brand__heading_size_m">ETHICAL TRADING</h4>
<h5 class="brand__heading brand__heading_size_s">we oversee the working conditions of the people in the supply chain</h5>
<p class="brand__text">Nullam dapibus consectetur neque, faucibus porttitor purus iaculis sed. Aenean eras dapibus augue, eget dignissim dui maecenas et rhoncus mim, vel semper arcu lorem
Pellentesque congue justo esteir pellentesque aliquet massa eget posuere tincidunt. Cras viverra ullamcorper nunc accumsan hendrerit. <a href="#">A link<i class="fas fa-long-arrow-alt-right"></i></a></p>
<h4 class="brand__heading brand__heading_size_m">OUR VALUES, VISION AND STRATEGY</h4>
<h5 class="brand__heading brand__heading_size_s">The above image would be a great place for an advertising video</h5>
<p class="brand__text brand__text_last">Cras maximus venenatis malesuada. Nulla sagittis elit felis, ac facilisis quam ornare aliquam. Etiam cursus odio vitae dui dignissim, sed tempus lacus tincidunt et donec sapien velit, rhoncus eu nulla a, molestie tempus mi maecenas sagittis ornare.
Pellentesque sapien mi, <a href="#">tincidunt nec magna vitae</a>, volutpat elementum odioni lorem Aliquam tempor massa vitae augue mattis tempor id in ante ut augue erat, luctus eil.
</p>
<div class="brand__awards">
<img src="img/award1.png" alt="Britain Fashion Award">
<img src="img/award2.png" alt="UK Fashion and textile Award">
<img src="img/award3.png" alt="Drapers Awards 2014 finalist">
</div>
</div>
</div>
</main>
</div>
<footer class="footer">
<div class="footer__top">
<div class="container footer__container_top">
<div class="footer__links">
<nav class="footer__nav">
<ul class="footer__ul">
<h5 class="footer__heading">INFORMATION</h5>
<li class="footer__li"><a href="" class="footer__link">The brand</a></li>
<li class="footer__li"><a href="" class="footer__link">Local stores</a></li>
<li class="footer__li"><a href="" class="footer__link">Customer service</a></li>
<li class="footer__li"><a href="" class="footer__link">Privacy & cookies</a></li>
<li class="footer__li"><a href="" class="footer__link">Site map</a></li>
</ul>
<ul class="footer__ul">
<h5 class="footer__heading">WHY BUY FROM US</h5>
<li class="footer__li"><a href="" class="footer__link">Shipping & returns</a></li>
<li class="footer__li"><a href="" class="footer__link">Secure shopping</a></li>
<li class="footer__li"><a href="" class="footer__link">Testimonials</a></li>
<li class="footer__li"><a href="" class="footer__link">Award winning</a></li>
<li class="footer__li"><a href="" class="footer__link">Ethical trading</a></li>
</ul>
<ul class="footer__ul">
<h5 class="footer__heading">YOUR ACCOUNT</h5>
<li class="footer__li"><a href="" class="footer__link">Sign in</a></li>
<li class="footer__li"><a href="" class="footer__link">Register</a></li>
<li class="footer__li"><a href="" class="footer__link">View cart</a></li>
<li class="footer__li"><a href="" class="footer__link">View your lookbook</a></li>
<li class="footer__li"><a href="" class="footer__link">Track an order</a></li>
<li class="footer__li"><a href="" class="footer__link">Update information</a></li>
</ul>
<ul class="footer__ul">
<h5 class="footer__heading">LOOKBOOK</h5>
<li class="footer__li"><a href="" class="footer__link">Men's lookbook</a></li>
<li class="footer__li"><a href="" class="footer__link">Women's lookbook</a></li>
<li class="footer__li"><a href="" class="footer__link">Loobooks RSS feed</a></li>
<li class="footer__li"><a href="" class="footer__link">View your lookbook</a></li>
<li class="footer__li"><a href="" class="footer__link">Delete your lookbook</a></li>
</ul>
<ul class="footer__ul">
<h5 class="footer__heading">CONTACT DETAILS</h5>
<li class="footer__li">
<p class="footer__p">Head Office: Avenue Fashion, </br>
180-182 Regent Street, London</p>
</li>
<li class="footer__li">
<p class="footer__p">Telephone: 0123-456-789</p>
</li>
<li class="footer__li">
<p class="footer__p">Email: support@yourwebsite.com</p>
</li>
</ul>
</nav>
</div>
<div class="footer__blocks">
<div class="footer__awards">
<h3>AWARD WINNER</h3>
<h3>FASHION AWARDS 2016</h3>
</div>
<div class="footer__external">
<a href="" class="footer__external-link"><i class="fab fa-facebook-f"></i></a>
<a href="" class="footer__external-link"><i class="fab fa-twitter"></i></a>
<a href="" class="footer__external-link"><i class="fab fa-instagram"></i></a>
<a href="" class="footer__external-link"><i class="fab fa-pinterest-p"></i></a>
</div>
</div>
</div>
</div>
<div class="footer__bottom">
<div class="container footer__container_bottom">
<p class="footer__copyright">© 2016 Avenue Fashion™</p>
<div class="footer__creators">
<p class="footer__creator">Design by RobbyDesigns.com</p>
<p class="footer__creator">Dev by Loremipsum.com</p>
</div>
</div>
</div>
</footer>
</body>
</html>