-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
153 lines (150 loc) · 6.86 KB
/
index.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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="....">
<meta name="keywords" content="....">
<meta name="author" content="...">
<title>Concrete houses</title>
<link rel="stylesheet" href="./assets/styles/index_style.css">
</head>
<body>
<header>
<div id="logo">
<a href="./index.html" aria-label="Name of the site">
<h1>concrete houses</h1>
</a>
</div>
<nav id="navbar">
<ul>
<a href="./index.html" aria-label="Home page">
<li class="nav-button-active">Home</li>
</a>
<a href="./gallery.html" aria-label="Photos page">
<li>Gallery</li>
</a>
<a href="./form.html" aria-label="Form page">
<li>Form</li>
</a>
</ul>
</nav>
</header>
<main>
<section id="main_image">
<div id="main_image_box">
<div id="main_image_text">
<h2 id="text2-one">a Fresh Look</h2>
<h2 id="text2-two">at Modern Living</h2>
</div>
</div>
</section>
<section id="feathures-description">
<div class="feathures">
<h2>Energy efficient houses</h2>
<div class="feathures_line">
<span class="fa-stack">
<i class="fa-solid fa-bolt fa-stack-1x" style="color: #f2ff00;"></i>
</span>
<p>The high thermal mass of the tightly sealed concrete walls, together with the insulation,
prevents
drafts and creates an airtight, highly efficient and energy efficient home.</p>
</div>
</div>
<div class="feathures">
<h2>Creates low maintenance homes</h2>
<div class="feathures_line">
<span class="fa-stack">
<i class="fa-solid fa-euro-sign fa-stack-1x"></i>
</span>
<p>Concrete construction creates low-maintenance homes with wall systems that retain their shape and
integrity for decades. The appearance of a concrete wall resists damage from wind and heavy
rains
more effectively than a timber-framed wall.</p>
</div>
</div>
<div class="feathures">
<h2>Fire Resistance</h2>
<div class="feathures_line">
<span class="fa-stack">
<i class="fa-solid fa-fire fa-stack-1x" style="color: #ff0000;"></i>
<i class="fa-solid fa-slash fa-stack-1x" style="color:rgb(0, 0, 0)"></i>
</span>
<p>Fire-resistant concrete walls more effectively resist damage from fire and limit the spread of
flames, compared to wood and steel. During a fire, steel can melt, and wood can burn.</p>
</div>
</div>
<div class="feathures">
<h2>Earthquake Resistance</h2>
<div class="feathures_line">
<span class="fa-stack">
<i class="fa-solid fa-house-chimney-crack fa-stack-1x" style="color: #b1b1b1;"></i>
<i class="fa-solid fa-slash fa-stack-1x" style="color:rgb(0, 0, 0)"></i>
</span>
<p>Homes built with steel-reinforced concrete walls provide the stiffness, strength, and ductility
to
withstand the destructive forces of earthquakes. Reinforced concrete walls resist the
compression
and tensile forces produced by an earthquake.</p>
</div>
</div>
</section>
<section id="photo_examples">
<h2>Photos</h2>
<div id="photo_examples_set">
<div id="block111" class="block"></div>
<div id="block222" class="block"></div>
<div id="block333" class="block"></div>
</div>
</section>
<section id="peopleopinion">
<h2>People Opinion</h2>
<div id="peopleopinion_set">
<div class="avatar_block">
<div id="ava1" class="avatar"></div>
<p>My house is poured concrete, done off-site with insulation installed as well as ducting. Ready
for
painting inside and outside was basically scratchcoated finish. No issues at all with mortgage,
insurance etc.</p>
</div>
<div class="avatar_block">
<div id="ava2" class="avatar"></div>
<p>Well, my house is single wall poured concrete and it dates to 1936. There's literally never been
a
single crack in any of the walls, ever. It sure would benefit from external wall insulation
though.
</p>
</div>
</div>
</section>
<section id="form_place">
<h2>Are you interested in building a concrete house? Then click the button below and fill out the form</h2>
<div id="contact_us_button">
<a href="./form.html" aria-label="Contact us page">Contact us</a>
</div>
</section>
</main>
<footer>
<ul class="social-networks">
<li>
<a href="https://facebook.com" target="_blank" rel="noopener" aria-label="Visit our facebook">
<i class="fa-brands fa-facebook"></i></a>
</li>
<li>
<a href="https://twitter.com" target="_blank" rel="noopener" aria-label="Visit our twitter">
<i class="fa-brands fa-twitter"></i></a>
</li>
<li>
<a href="https://youtube.com" target="_blank" rel="noopener" aria-label="Visit our youtube">
<i class="fa-brands fa-youtube"></i></a>
</li>
<li>
<a href="https://instagram.com" target="_blank" rel="noopener" aria-label="Visit our instagram">
<i class="fa-brands fa-instagram"></i></a>
</li>
</ul>
</footer>
<script src="https://kit.fontawesome.com/8a966a517d.js" crossorigin="anonymous"></script>
</body>
</html>