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>