-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
123 lines (113 loc) · 3.68 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
<!doctype html>
<!--[if lt IE 7 ]> <html class="no-js ie6" lang="en"> <![endif]-->
<!--[if IE 7 ]> <html class="no-js ie7" lang="en"> <![endif]-->
<!--[if IE 8 ]> <html class="no-js ie8" lang="en"> <![endif]-->
<!--[if (gte IE 9)|!(IE)]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Roomorama is offline</title>
<link rel="shortcut icon" type="image/x-icon" href="favicon.ico">
<link href='//fonts.googleapis.com/css?family=Droid+Serif:400,700,400italic,700italic' rel='stylesheet' type='text/css'>
<style>
html {
background: url(office.jpg) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
body {
font-family: 'Droid Serif', sans-serif;
font-style: italic;
overflow: hidden;
line-height: 135%;
}
.container {
width: 100%;
background-color: rgba(255,255,255,.8);
box-sizing:border-box;
-moz-box-sizing:border-box; /* Firefox */
position: absolute;
bottom: 0;
left: 0;
padding: 5% 10%;
}
.container img {
position: fixed;
top: 10%;
right: 10%;
}
.container h1 {
font-size: 2.3em;
}
.container h3 {
margin-bottom: 5px;
}
.container p {
margin-top: 3px;
}
#play {
border: 1px solid #222;
padding: 0px 30px 5px 19px;
border-radius: 100%;
font-size: 50px;
text-decoration: none;
color: #222;
margin-left: 30px;
}
.audio {
margin-top: 50px;
text-align: right;
}
.hidden {
display: none;
}
.audio p {width: 300px; display: inline;}
#play.active {
background-color: rgba(204, 204, 204, 0.7);
}
#play:hover {
background-color: rgba(204, 204, 204, 0.8);
}
</style>
</head>
<body>
<div class="container">
<h3>
Dear all,
<br><br>
After many years of connecting travelers and hosts, Roomorama.com will be ceasing to accept any new bookings, while we decide our future from here.
<br><br>
Increasing competition and regulatory headwinds have made it ever more challenging to operate in this industry, and Roomorama would like to thank all our customers and hosts who have supported us over the years.
<br><br>
All existing bookings will be honored - please email <a href="mailto:info@roomorama.com">info@roomorama.com</a> if you need assistance.
<br><br>
We would like to thank everyone who has been part of this incredible journey, as we paved the way in the sharing economy as one community.
<br><br>
Yours sincerely, the Roomorama team
</h3>
<section class="audio hidden">
<p>If you feel sad about it, please play this music</p> <a href="#" onclick="toggleAudio(); return false" id="play">𝄞</a>
<audio id="audio" src="http://content2.audionetwork.com/Preview/tracks/mp3/v5res/ANW1573/02.mp3"></audio>
<script type="text/javascript">
var container = document.getElementsByClassName('audio')[0]
if (location.search.includes('with_music')) {
container.classList.remove('hidden')
}
var player = document.getElementById('audio')
var playButton = document.getElementById('play')
function toggleAudio() {
if (player.paused) {
player.play()
playButton.className += ' active'
} else {
player.pause()
playButton.classList.remove('active')
}
}
</script>
</section>
</div>
</body>
</html>