You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

302 lines
7.5 KiB
HTML

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, user-scalable=no" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>A bed, a chair and a table Special Issue 4</title>
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
7 years ago
<script src="jquery.ui.touch-punch.min.js"></script>
<style>
@font-face {
7 years ago
font-family: 'LibreBaskerville-Regular';
7 years ago
src: url('LibreBaskerville-Regular.eot?#iefix') format('embedded-opentype'), url('LibreBaskerville-Regular.woff') format('woff'), url('LibreBaskerville-Regular.ttf') format('truetype'), url('LibreBaskerville-Regular.svg#LibreBaskerville-Regular') format('svg');
font-weight: normal;
font-style: normal;
7 years ago
}
@font-face {
7 years ago
font-family: 'LibreBaskerville-Italic';
7 years ago
src: url('LibreBaskerville-Italic.eot?#iefix') format('embedded-opentype'), url('LibreBaskerville-Italic.woff') format('woff'), url('LibreBaskerville-Italic.ttf') format('truetype'), url('LibreBaskerville-Italic.svg#LibreBaskerville-Italic') format('svg');
font-weight: normal;
font-style: normal;
}
* { box-sizing: border-box; }
::selection {
background: black;
color: #FFF;
}
/* und hiermit der Firefox >=1 */
::-moz-selection {
background: black;
color: #FFF;
}
7 years ago
body{
background: #FFFFFF;
padding: 0px;
margin: 0px;
font-weight: normal;
}
7 years ago
h1{
margin-top: 10px;
7 years ago
font-family: LibreBaskerville-Regular,serif;
font-size: 85px;
text-transform:uppercase;
font-weight: normal;
letter-spacing: 15px;
7 years ago
}
h2{
7 years ago
font-family: LibreBaskerville-Regular,serif;
font-size: 30px;
font-weight: normal;
margin-top: -40px;
}
p{
7 years ago
font-family: LibreBaskerville-Regular,serif;
font-size: 14px;
line-height: 24px;
}
italic{
7 years ago
font-family: LibreBaskerville-Italic,serif;
}
#textcontainer{
margin-left: 20px;
margin-right: 20px;
margin-bottom: 50px;
}
#textcontainer p{
column-count: 3;
column-gap: 40px;
text-align: justify;
}
#imagecontainer img{
margin-top: -10px;
}
#sidenote{
position: fixed;
right:-60px;
top:85px;
-ms-transform: rotate(-90deg); /* IE 9 */
-webkit-transform: rotate(-90deg); /* Chrome, Safari, Opera */
transform: rotate(-90deg);
}
#infocontainer{
cursor: move;
position: fixed;
margin-top: 4%;
margin-left: 4%;
width:85%;
height:85vh;
background: black;
overflow: scroll;
}
7 years ago
#infocontainer::-webkit-scrollbar {
display: none;
}
#infocontainer p{
color: white;
margin-left: 20px;
margin-right: 20px;
column-count: 1;
column-gap: 40px;
text-align: justify;
}
#infocontainer .flowtext{
color: white;
margin-left: 20px;
margin-right: 20px;
margin-bottom: 40px;
column-count: 3;
column-gap: 40px;
text-align: justify;
}
#infocontainer .flowtext a{
color: white;
}
#infocontainer strong{
text-transform: uppercase;
letter-spacing: 2px;
}
#containment-wrapper{
position: fixed;
top:-80vh;
left:-80%;
width:260%;
height: 250vh;
}
@media screen and (max-width: 980px) {
#infocontainer .flowtext{
column-count: 2;
}
}
@media screen and (max-width: 680px) {
h1{
margin-top: 10px;
font-family: LibreBaskerville-Regular,serif;
font-size: 65px;
text-transform:uppercase;
font-weight: normal;
letter-spacing: 15px;
}
h2{
font-family: LibreBaskerville-Regular,serif;
font-size: 20px;
font-weight: normal;
margin-top: -40px;
}
7 years ago
#textcontainer p{
column-count: 1;
column-gap: 40px;
text-align: justify;
}
#infocontainer{
cursor: move;
position: fixed;
margin-top: 4%;
margin-left: 4%;
width:85%;
height:auto;
background: black;
overflow: scroll;
}
#containment-wrapper{
position: fixed;
7 years ago
top:-2000vh;
left:-2000%;
width:5000%;
height: 5000vh;
}
#infocontainer .flowtext{
column-count: 1;
}
}
</style>
</head>
<body>
<div id="containment-wrapper">
</div>
<div id="infocontainer">
<p>
<p class="flowtext">
7 years ago
<strong style="text-align:left;">A bed, a chair and a table </br> Booklaunch on the 7th of December 2017, 18:00 </br> Poortgebouw, Rotterdam</strong></br></br></br></br></br></br></br>
<p>
<p>
<strong>Schedule</strong></br>
</p>
<p>
Doors open: 18:00 </br>
Book Presentation: 18:30</br>
Dinner (on donation): 19:30</br>
Plus music by DJs Naam and Post-Toast!</br>
</br>
<p>
<strong>About</strong></br>
</p>
<p class="flowtext">
A Bed, A Chair and a Table is a publication about the Poortgebouw, a former squat and vibrant living community located in the South of Rotterdam. In this book, oral histories from inside and outside the Poortgebouw are interlaced with material from various institutional and personal archives. By bringing together these tales of resilience, political struggle, frustration and friendship with historical documents, this book brings forward new perspectives about the Poortgebouw's unique history and its importance in the contemporary city. The starting point of the book was the Autonomous Archive, a local archiving machine built from parts of different computers by the inhabitants of the Poortgebouw and a group of students from XPUB.
</br>
A Bed, A Chair and a Table is the fourth 'Special Issue' conceptualised, developed and produced by the students from the Experimental Publishing course (XPUB) of the Piet Zwart Institute Media Design Master. It provides a trigger for the reader to further explore the Poortgebouws past and to see this building, meet its community, and discuss a potential future amidst all of its complexities. It is a testament to the archive as not the end, but the beginning of a debate. Join us!
</br></br>
Get your copy of A Bed, A Chair and a Table at the launch on Thursday December 7, at 18:00 at the Poortgebouw, Stieltjesstraat 38 Rotterdam.
</br></br></br>
<italic> This publication is brought to you by Delphine Bedel, Natasha Berting, André Castro, Elisa Chaudet, Angeliki Diakrousi, Max Franklin, Giulia de Giovanelli, Francisco González, Joca van der Horst, Aymeric Mansoux, Michael Murtaugh, Alexander Roidl, Steve Rushton, Alice Strete, Zalán Szakács and the Autonomous Archive. XPUB is a two-year Media Design Master course that prepares students to critically engage with societal issues within the fast changing field of art, design and cultural production.</italic>
</br></br>
For more information about the work, visit XPUB (https://xpub.nl) and the Poortgebouw (https://poortgebouw.org).
Contact: Leslie Robbins l.j.drost-robbins@hr.nl
</p>
<p>
<strong>Links</strong></br>
</p>
<p class="flowtext">
<a href="http://www.pzwart.nl" target="_blank">www.pzwart.nl</a></br>
<a href="http://www.poortgebouw.org" target="_blank">www.poortgebouw.org</a></br>
<!--<a href="https://aa.xpub.nl" target="_blank">https://aa.xpub.nl</a>-->
</p>
</p>
</div>
<p id="sidenote">XPUB: <italic>SPECIAL ISSUE 4 </italic> </p>
<div id="textcontainer">
<h1>A bed, a chair and a table </h1>
<h2>Book launch Thursday 7th of December 2017, 18:00 at Poortgebouw, Rotterdam.</h2>
<p> </p>
</div>
<div id="imagecontainer">
<img src="img/01.jpeg" width="100%"/>
<img src="img/02.jpeg" width="100%"/>
<img src="img/03.jpeg" width="100%"/>
<img src="img/04.jpeg" width="100%"/>
<img src="img/05.jpeg" width="100%"/>
<img src="img/06.jpeg" width="100%"/>
<img src="img/07.jpeg" width="100%"/>
</div>
<script>
$( function() {
$( "#infocontainer" ).draggable({containment: "#containment-wrapper"});
} );
$( function() {
$( "#infocontainer" ).resizable();
} );
</script>
</body>
</html>