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.

118 lines
3.4 KiB
HTML

8 years ago
<!DOCTYPE html>
8 years ago
<html>
<head>
8 years ago
<meta name="viewport" content="width=device-width, initial-scale=1.0">
8 years ago
<link rel="stylesheet" type="text/css" href="style.css">
<link href="https://fonts.googleapis.com/css?family=Lato:300,400,700" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Playfair+Display" rel="stylesheet">
</head>
<style>
body {
margin: 0;
/*font-family: 'Lato', sans-serif;*/
font-family: 'Playfair Display', serif;
text-align: center;
display: block;
margin: auto;
8 years ago
width: 60%;
8 years ago
background: red; /* For browsers that do not support gradients */
background: -webkit-linear-gradient(right,rgba(51,51,153,0),rgba(51,51,153,1)); /*Safari 5.1-6*/
background: -o-linear-gradient(left,rgba(51,51,153,0),rgba(51,51,153,1)); /*Opera 11.1-12*/
background: -moz-linear-gradient(left,rgba(51,51,153,0),rgba(51,51,153,1)); /*Fx 3.6-15*/
background: linear-gradient(to left, rgba(51,51,153,0),rgba(51,51,153,1)); /*Standard*/
}
8 years ago
.overlay {
height: 0%;
width: 100%;
position: fixed;
z-index: 1;
top: 0;
left: 0;
background-color: rgb(0,0,0);
background-color: rgba(0,0,0, 0.9);
overflow-y: hidden;
transition: 0.5s;
}
.overlay-content {
position: relative;
top: 25%;
width: 100%;
text-align: center;
margin-top: 30px;
}
.overlay a {
padding: 8px;
text-decoration: none;
font-size: 36px;
color: #818181;
display: block;
transition: 0.3s;
}
.overlay a:hover, .overlay a:focus {
color: #f1f1f1;
}
.overlay .closebtn {
position: absolute;
top: 20px;
right: 45px;
font-size: 60px;
}
@media screen and (max-height: 450px), screen and (max-width: 500px) {
p {
font-size: 12px;
font-size: 3.5vw;
}
8 years ago
.overlay {overflow-y: auto;}
.overlay a {font-size: 20px}
.overlay .closebtn {
8 years ago
font-size: 30px;
8 years ago
top: 15px;
right: 35px;
}
8 years ago
</style>
<body>
<div id="myNav" class="overlay">
<a href="javascript:void(0)" class="closebtn" onclick="closeNav()">&times;</a>
<div class="overlay-content">
<a href="https://pzwiki.wdka.nl/mediadesign/Interfacing_the_law" target="_blank">Interfacing The Law</a>
<a href="https://issue.xpub.nl/" target="_blank">Special Issue Archive</a>
<a href="https://xpub.nl/" target="_blank">XPUB</a>
<a href="http://www.pzwart.nl/" target="_blank">Piet Zwart Institute</a>
</div>
</div>
<h2>Interfacing The Law</h2>
8 years ago
<p>
How can the right to access to knowledge be held up against claims of copyright? How can we battle the terror of the mind produced by the current intellectual property regime?
</p>
<p>
Interfacing the law is an attempt to build a series of platforms, both in the sense of on-line interfaces and of public discourse, that allow us to experiment with, to openly discuss and to reflect while the next wave of court cases is waiting to happen.
</p>
<p>
It is urgent that we find ways to make the public debate transcend the juridical binary of illegal vs. legal, and claim political legitimacy for acting out the potential of digital publishing, and the possibility of sharing digital books.
</p>
8 years ago
<span style="font-size:30px;cursor:pointer" onclick="openNav()">&#9776; More Info...</span>
<script>
function openNav() {
document.getElementById("myNav").style.height = "100%";
}
function closeNav() {
document.getElementById("myNav").style.height = "0%";
}
</script>
</body>
</html>