-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathproject-1.html
119 lines (99 loc) · 7.76 KB
/
project-1.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Innovative Almaty based architecture and design studio that turns your dreams into reality. Share your vision with us and let us make your space unique.">
<meta name="keywords" content="architecture, design, studio, Marina Maslatsova, Almaty, office, home, planning, supervision">
<meta name="theme-color" content="#808080">
<meta name="author" content="Ante Budimir">
<!-- Img preview for sharing -->
<meta property="og:image" content="./img/full/third.jpg">
<meta property="og:title" content="MASLATSOVA Design & Architecture"/>
<meta property="og:description" content="Innovative architecture and design studio that turns your dreams into reality. Share your vision with us and let us make your space unique."/>
<title>MASLATSOVA Design & Architecture | Project #1</title>
<!-- Stylesheet -->
<link rel="preload" href="./css/main.css" as="style">
<link rel="stylesheet" href="./css/main.css">
<!-- Browser tab icon -->
<link rel="shortcut icon" href="./img/icon.png" type="image/x-icon" />
</head>
<body>
<!-- Header -->
<header id="header">
<h1 class="hidden-visually">Marina Maslatsova, Design & Architecture</h1>
<a class="logo" href="index.html" title="Go back to the front page">
<div class="title-big">MASLATSOVA</div>
<div class="title-small">Design & Architecture</div>
</a>
<!-- Menu -->
<nav id="nav">
<div class="hamburger">
<i id="menu-icon" class="icon-menu"></i>
</div>
<ul class="menu">
<li class="menu-item"><a class="menu-link" href="index.html" title="Go back to the front page">Home</a></li>
<li class="menu-item"><a class="menu-link" href="projects.html" title="Have a look at our portfolio">Projects</a></li>
<li class="menu-item"><a class="menu-link" href="services.html" title="Find out about the services we provide">Services</a></li>
<li class="menu-item"><a class="menu-link" href="about.html" title="Find out who we are & get in touch">About</a></li>
</ul>
</nav>
</header>
<main id="project-1">
<section id="project-gallery">
<h2 class="project-title">Project #1</h2>
<div class="slider-wrapper">
<div id='slider-1'>
<img src='./img/full/first.jpg' alt="Photo #1">
<img src='./img/full/second.jpg' alt="Photo #2">
<img src='./img/full/third.jpg' alt="Photo #3">
<img src='./img/full/fourth.jpg' alt="Photo #4">
</div>
</div>
</section>
<section id="project-details">
<h2 class="hidden-visually">Project details</h2>
<!-- <div class="text-container"> -->
<h3>Project name:</h3>
<p>Lorem ipsum dolor, sit amet consectetur adipisicing elit</p>
<h3>Location:</h3>
<p>Almaty downtown</p>
<h3>Size:</h3>
<p>500m<sup>2</sup></p>
<h3>Details:</h3>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Ipsum saepe quo nulla quod iure reiciendis tenetur sit ducimus eos iste? Ducimus, aliquam et ipsum nostrum esse delectus magni, laborum numquam maxime sapiente corrupti illum assumenda! Voluptatum harum aperiam nemo laborum vero! Officiis nobis architecto tempora nihil praesentium fuga, dolor, eveniet nesciunt consectetur in maxime expedita error, id amet vitae ipsa facere rem? Ut sed reiciendis corrupti in molestiae vel quisquam magnam quis iusto aspernatur! Nihil quos aperiam architecto, quaerat expedita in porro enim error alias, illum eius qui iusto consequatur ad fuga id numquam placeat velit impedit dolores. Odio, inventore?</p>
<!-- </div> -->
</section>
</main>
<!-- Other projects -->
<section id="projects">
<h4>Other projects</h4>
<section id="gallery" class="grid-container">
<h5 class="hidden-visually">Links to other projects from our portfolio</h5>
<div class="placeholder"><a class="placeholder-link" href="project-1.html" title="Project #1"><img class="placeholder-img" src="./img/thumb/bar-with-stools.jpg" alt="bar with stools">Project #1</a></div>
<div class="placeholder"><a class="placeholder-link" href="project-1.html" title="Project #2"><img class="placeholder-img" src="./img/thumb/bathroom.jpg" alt="bathroom">Project #2</a></div>
<div class="placeholder"><a class="placeholder-link" href="project-1.html" title="Project #3"><img class="placeholder-img" src="./img/thumb/bedroom.jpg" alt="bedroom">Project #3</a></div>
<div class="placeholder"><a class="placeholder-link" href="project-1.html" title="Project #4"><img class="placeholder-img" src="./img/thumb/coffee-shop.jpg" alt="coffee shop">Project #4</a></div>
<div class="placeholder"><a class="placeholder-link" href="project-1.html" title="Project #5"><img class="placeholder-img" src="./img/thumb/conference-room.jpg" alt="conference room">Project #5</a></div>
<div class="placeholder"><a class="placeholder-link" href="project-1.html" title="Project #6"><img class="placeholder-img" src="./img/thumb/hotel-room.jpg" alt="hotel room">Project #6</a></div>
<div class="placeholder"><a class="placeholder-link" href="project-1.html" title="Project #7"><img class="placeholder-img" src="./img/thumb/living-room.jpg" alt="living room">Project #7</a></div>
<div class="placeholder"><a class="placeholder-link" href="project-1.html" title="Project #8"><img class="placeholder-img" src="./img/thumb/bar-with-stools.jpg" alt="bar with stools">Project #8</a></div>
<div class="placeholder"><a class="placeholder-link" href="project-1.html" title="Project #9"><img class="placeholder-img" src="./img/thumb/bathroom.jpg" alt="bathroom">Project #9</a></div>
<div class="placeholder"><a class="placeholder-link" href="project-1.html" title="Project #10"><img class="placeholder-img" src="./img/thumb/bedroom.jpg" alt="bedroom">Project #10</a></div>
<div class="placeholder"><a class="placeholder-link" href="project-1.html" title="Project #11"><img class="placeholder-img" src="./img/thumb/coffee-shop.jpg" alt="coffee shop">Project #11</a></div>
<div class="placeholder"><a class="placeholder-link" href="project-1.html" title="Project #12"><img class="placeholder-img" src="./img/thumb/conference-room.jpg" alt="conference room">Project #12</a></div>
<div class="placeholder"><a class="placeholder-link" href="project-1.html" title="Project #13"><img class="placeholder-img" src="./img/thumb/hotel-room.jpg" alt="hotel room">Project #13</a></div>
<div class="placeholder"><a class="placeholder-link" href="project-1.html" title="Project #14"><img class="placeholder-img" src="./img/thumb/living-room.jpg" alt="living room">Project #14</a></div>
<div class="placeholder"><a class="placeholder-link" href="project-1.html" title="Project #15"><img class="placeholder-img" src="./img/thumb/bar-with-stools.jpg" alt="bar with stools">Project #15</a></div>
</section>
</section>
<!-- Footer -->
<footer id="footer">
<p>MASLATSOVA Design & Architecture, <br class="hide-on-desktop"> ©2020 - <span id="currentYear"></span></p>
</footer>
<!-- JS -->
<script src="./js/vanilla-slider.min.js"></script>
<script src="./js/carousel_init.js"></script>
<script src="./js/main.js"></script>
</body>
</html>