Download raw (11.6 KB)
<!DOCTYPE html>
<html>
<head>
<title>Balsamine | Billetterie / Réservation en ligne </title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="description" content="Réservation et paiement en ligne. ">
<meta http-equiv="Content-Style-Type" content="text/css">
<style>
@font-face {
font-family: 'UmeMinchoLatin';
src: url('fonts/UmeMinchoLatin/ume-mincho-latin-webfont.eot');
src: url('fonts/UmeMinchoLatin/ume-mincho-latin-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/UmeMinchoLatin/ume-mincho-latin-webfont.woff') format('woff'),
url('fonts/UmeMinchoLatin/ume-mincho-latin-webfont.ttf') format('truetype'),
url('fonts/UmeMinchoLatin/ume-mincho-latin-webfont.svg#UmePGothicBalsaRegular') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'UmePGothicBalsaRegular';
src: url('fonts/UmePGothicBalsaRegular/ume-p-gothic_balsa-webfont.eot');
src: url('fonts/UmePGothicBalsaRegular/ume-p-gothic_balsa-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/UmePGothicBalsaRegular/ume-p-gothic_balsa-webfont.woff') format('woff'),
url('fonts/UmePGothicBalsaRegular/ume-p-gothic_balsa-webfont.ttf') format('truetype'),
url('fonts/UmePGothicBalsaRegular/ume-p-gothic_balsa-webfont.svg#UmePGothicBalsaRegular') format('svg');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'UmePGothicVerticalRegular';
src: url('fonts/UmePGothicVerticalRegular/ume-p-gothic-vertical-webfont.eot');
src: url('fonts/UmePGothicVerticalRegular/ume-p-gothic-vertical-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/UmePGothicVerticalRegular/ume-p-gothic-vertical-webfont.woff') format('woff'),
url('fonts/UmePGothicVerticalRegular/ume-p-gothic-vertical-webfont.ttf') format('truetype'),
url('fonts/UmePGothicVerticalRegular/ume-p-gothic-vertical-webfont.svg#UmePGothicVerticalRegular') format('svg');
font-weight: normal;
font-style: normal;
}
body {
font-family: umepgothicverticalregular,arial,Helvetica,sans-serif;
background-color: white;
color: #002D36;
font-size: 75%;
line-height: 1.5;
text-rendering: optimizeLegibility;
margin: 19px;
width: 80em;
}
h1 {
line-height: 38px;
margin-bottom: 19px;
font-size: 38px;
font-family: umemincholatin,'andale Mono','Courier New',Courier,monospace;
text-transform: uppercase;
word-spacing: 7px;
font-weight: normal;
}
a {
color: inherit;
text-decoration: underline;
}
a:hover {
outline: 1px solid #002D36;
}
p {
font-size: 13px;
line-height: 19px;
top: 5px;
}
p {
word-spacing: 2px;
}
p + p {
margin-bottom: 19px;
}
b, strong {
outline: 1px solid #002D36;
padding: 0 6px;
font-weight: normal;
}
em, i {
font-style: normal;
font-family: umemincholatin,'andale Mono','Courier New',Courier,monospace;
font-size: 15px;
}
sup {
font-size: 8px;
line-height: 0;
vertical-align: 6px;
margin-left: 2px;
}
ul, ol {
margin-left: 1.5em;
}
ul {
list-style: none;
margin: 0;
}
ul ul {
margin-left: 19px;
}
ul li:before {
content: "— ";
}
ul li {
text-indent: -16px;
margin-left: 16px;
}
ol {
list-style: decimal outside;
}
form {
margin: 19px 0;
}
form, legend, label {
font-size: 13px;
line-height: 19px;
}
textarea {
border: 1px solid #002D36;
width: 100%;
}
input, select, button {
cursor: pointer;
max-width: 100%;
background: none;
border: 1px solid DarkSlateGrey;
font-family: umepgothicverticalregular,arial,Helvetica,sans-serif;
height: 17px;
margin-top: 7px;
color: #002D36;
}
input[type=submit] {
width: auto;
padding: 0 1px;
}
input[type=submit]:hover {
background-color: #002D36;
color: white;
}
h1#logo {
font-family: umepgothicbalsaregular,arial,Helvetica,sans-serif;
text-transform: none;
border-right: 1px solid DarkSlateGray;
display: inline;
}
h1#logo a {
text-decoration: none;
}
.page {
margin: 19px;
padding-bottom: 31px;
}
div.resa-item {
margin-bottom: 10px;
}
div.resa-item div {
}
div.resa-item div:first-child {
float: left;
height: 39px;
}
div.resa-item div:last-child {
position: relative;
top: -8px;
left: 8px;
}
input[type=submit] {
height: 22px;
padding: 0 1px 3px;
border: none;
text-transform: uppercase;
font-size: 16px;
}
.skew {
border: 1px solid DarkSlateGray;
-moz-transform:skewx(-10deg); -webkit-transform:skewx(-10deg); -o-transform:skewx(-10deg); transform:skewx(-10deg);
}
.skew-content {
-moz-transform:skewx(10deg); -webkit-transform:skewx(10deg); -o-transform:skewx(10deg); transform:skewx(10deg);
}
.losange {
border: 1px solid DarkSlateGrey;
width: 110px;
height: 110px;
-moz-transform: matrix(1.5, 0, 0, 0.5, 0, 0) rotate(45deg); -webkit-transform:matrix(1.5, 0, 0, 0.5, 0, 0) rotate(45deg); -o-transform:matrix(1.5, 0, 0, 0.5, 0, 0) rotate(45deg); transform:matrix(1.5, 0, 0, 0.5, 0, 0) rotate(45deg);
background-color: white;
z-indeX: 101;
position: relative;
}
.losange-content {
text-align: center;
width: 150px;
margin-left: -19px;
margin-top: 25px;
-moz-transform:rotate(-45deg) matrix(0.5, 0, 0, 1.75, 0, 0); -webkit-transform:rotate(-45deg) matrix(0.5, 0, 0, 1.75, 0, 0); -o-transform:rotate(-45deg) matrix(0.5, 0, 0, 1.75, 0, 0); transform:rotate(-45deg) matrix(0.5, 0, 0, 1.75, 0, 0);
}
</style>
</head>
<body>
<div class="page">
<div style="float: left; width: 150px; margin-top: 25px;">
<h1 id="logo"><a href='http://balsamine.be/'>bạlsa</a></h1>
<div class="skew" style="margin: 23px 10px 0 -10px;">
<div id="address" class="skew-content" style="text-align: center; letter-spacing: 1px; padding: 15px 10px; width: 130px; font-size: 12px;">
Théâtre la Balsamine<br />
Avenue Félix Marchal, 1<br />
1030 BRUXELLES<br />
02 735 64 68
</div>
</div>
</div>
<div style="float: left; width: 500px; margin-left: 19px;">
<h1>Réservation en ligne</h1>
<p>
Pour réserver vos places, veuillez remplir le formulaire ci-dessous (les
champs accompagnés d’une astérisque sont obligatoires) et cliquez sur
"confirmer". Vous recevrez ensuite un e-mail de confirmation.
</p>
<form name="reservation" method="post">
<div class="resa-item">
<div>Prénom*</div>
<div><input name="prenom" class="inputbox" type="text"></div>
</div>
<div class="resa-item">
<div>Nom*</div>
<div><input name="nom" class="inputbox" type="text"></div>
</div>
<div class="resa-item">
<div>E-mail*</div>
<div><input name="email" class="inputbox" type="text"></div>
</div>
<br />
<div class="resa-item">
<div>Rue, №</div>
<div><input name="adresse" class="inputbox" type="text"></div>
</div>
<div class="resa-item">
<div>Code postal</div>
<div><input name="codepostal" class="inputbox" type="text"></div>
</div>
<div class="resa-item">
<div>Ville</div>
<div><input name="ville" class="inputbox" type="text"></div>
</div>
<div class="resa-item">
<div>№ de téléphone</div>
<div><input name="telephone" class="inputbox" type="text"></div>
</div>
<br />
<div class="resa-item">
<div>Spectacle*</div>
<div><select name="spectacles" class="inputbox"><option selected="selected" value="Vision1">Vision1</option><option value="Effraction de l’oubli">Effraction de l’oubli</option><option value="Salon des refusés 1">Salon des refusés 1</option><option value="À Old Crow">À Old Crow</option><option value="Qu’est-ce que l’argent ? (performance)">Qu’est-ce que l’argent ? (performance)</option><option value="Exercices du play-back">Exercices du play-back</option><option value="Scum Manifesto">Scum Manifesto</option><option value="L’argent">L’argent</option><option value="Avis d’audition">Avis d’audition</option><option value="Au contraire">Au contraire</option><option value="L’indigène">L’indigène</option><option value="Quelqu’un va venir">Quelqu’un va venir</option><option value="Nœuds">Nœuds</option><option value="Le banquet dans les bois…">Le banquet dans les bois…</option><option value="Qu’est-ce que l’argent ? (la création)">Qu’est-ce que l’argent ? (la création)</option><option value="Hako Onna ou La femme-boîte">Hako Onna ou La femme-boîte</option><option value="Board on, on board">Board on, on board</option><option value="Les moutons">Les moutons</option><option value="Isabelle Nouzha, projection de ses films">Isabelle Nouzha, projection de ses films</option></select></div>
</div>
<div class="resa-item">
<div>Date*</div>
<div><select name="dates" class="inputbox"><option selected="selected" value="">(dates dynamiques)</option><option value="19/09/2011">19/09/2011</option><option value="20/09/2011">20/09/2011</option><option value="21/09/2011">21/09/2011</option><option value="22/09/2011">22/09/2011</option><option value="23/09/2011">23/09/2011</option><option value="24/09/2011">24/09/2011</option><option value="25/09/2011">25/09/2011</option></select></div>
</div>
<div class="resa-item">
<div>Nombre de places*</div>
<div><input name="places" class="inputbox" type="text"></div>
</div>
<div style="text-align: center;">
<div class="losange" style="margin: auto; height: 85px; width: 85px;">
<div class="losange-content" style="margin-top: 25px; margin-left: -32px;"><input class="inputbutton" type="submit" value="CONFIRMER"></div>
</div>
</div>
</form>
<p>Si vous désirez réserver pour un groupe (à partir de 10 personnes),
veuillez prendre contact avec nous, par téléphone au 02 735 64 68 ou par
mail <a class="urllink" href="mailto:reservation@balsamine.be" title="" rel="nofollow">reservation@balsamine.be</a>.
</p>
</div>
</div>
</body>
</html>