|
1
|
<!doctype html>
|
|
2
|
|
|
3
|
<html>
|
|
4
|
|
|
5
|
<head>
|
|
6
|
<title>CUNY Academic Commons SOPA Blackout</title>
|
|
7
|
<meta charset="utf-8" />
|
|
8
|
|
|
9
|
<link href='http://fonts.googleapis.com/css?family=Magra:400,700' rel='stylesheet' type='text/css'>
|
|
10
|
|
|
11
|
<style type="text/css">
|
|
12
|
body{
|
|
13
|
background-color:#000;
|
|
14
|
}
|
|
15
|
#sopa{
|
|
16
|
background-color:#000;
|
|
17
|
width:950px;
|
|
18
|
color:#FFF;
|
|
19
|
margin:0 auto;
|
|
20
|
font-family:"Helvetica Neue", Helvetica, Arial;
|
|
21
|
}
|
|
22
|
|
|
23
|
#sopa h2{
|
|
24
|
font-family:Magra, "Helvetica Neue", Helvetica, Arial;
|
|
25
|
background-color:#3FC2F3;
|
|
26
|
padding:5px;
|
|
27
|
margin-top:40px;
|
|
28
|
}
|
|
29
|
#sopa p{
|
|
30
|
margin-bottom:1em;
|
|
31
|
font-size:16px;
|
|
32
|
line-height:22px;
|
|
33
|
}
|
|
34
|
|
|
35
|
#sopa a, #sopa a:visited, #sopa a:link{
|
|
36
|
color:#2F90B4;
|
|
37
|
text-decoration:none;
|
|
38
|
border-bottom:1px solid #2F90B4;
|
|
39
|
}
|
|
40
|
|
|
41
|
|
|
42
|
|
|
43
|
#sopa #header h1{
|
|
44
|
background:url(images/bg-header.gif) no-repeat;
|
|
45
|
width:500px;
|
|
46
|
height:70px;
|
|
47
|
line-height:80px;
|
|
48
|
text-indent:-10000px;
|
|
49
|
float:left;
|
|
50
|
}
|
|
51
|
|
|
52
|
#sopa #header p{
|
|
53
|
width:300px;
|
|
54
|
float:right;
|
|
55
|
line-height:70px;
|
|
56
|
text-align:right;
|
|
57
|
vertical-align:center;
|
|
58
|
}
|
|
59
|
|
|
60
|
#sopa-head{
|
|
61
|
clear:both;
|
|
62
|
overflow:hidden;
|
|
63
|
}
|
|
64
|
|
|
65
|
#sopa-head h2{
|
|
66
|
text-align:center;
|
|
67
|
font-size:42px;
|
|
68
|
background-color:#000;
|
|
69
|
margin:60px 0;
|
|
70
|
|
|
71
|
}
|
|
72
|
|
|
73
|
#learn{
|
|
74
|
|
|
75
|
}
|
|
76
|
|
|
77
|
.section{
|
|
78
|
width:290px;
|
|
79
|
margin-right:40px;
|
|
80
|
float:left;
|
|
81
|
}
|
|
82
|
|
|
83
|
#spread{
|
|
84
|
margin-right:0px;
|
|
85
|
}
|
|
86
|
|
|
87
|
/* -----------------------------------
|
|
88
|
the rest is for the speech bubble things
|
|
89
|
----------------------------------- */
|
|
90
|
|
|
91
|
.triangle-left, .triangle-right {
|
|
92
|
position:relative;
|
|
93
|
padding:15px;
|
|
94
|
/*margin:1em 0 3em;*/
|
|
95
|
margin-bottom:30px;
|
|
96
|
color:#fff;
|
|
97
|
background:#3FC2F3;
|
|
98
|
}
|
|
99
|
|
|
100
|
.triangle-left:before{
|
|
101
|
content: "";
|
|
102
|
position: absolute;
|
|
103
|
bottom: -20px;
|
|
104
|
left: 60px;
|
|
105
|
border: 0;
|
|
106
|
border-right-width: 30px;
|
|
107
|
border-bottom-width: 20px;
|
|
108
|
display: block;
|
|
109
|
width: 0;
|
|
110
|
border-image: initial;
|
|
111
|
border-style: solid;
|
|
112
|
border-color: transparent #3FC2F3;
|
|
113
|
}
|
|
114
|
|
|
115
|
.triangle-left:after {
|
|
116
|
content: "";
|
|
117
|
position: absolute;
|
|
118
|
bottom: -20px;
|
|
119
|
left: 80px;
|
|
120
|
border: 0;
|
|
121
|
border-right-width: 10px;
|
|
122
|
border-bottom-width: 20px;
|
|
123
|
display: block;
|
|
124
|
width: 0;
|
|
125
|
border-image: initial;
|
|
126
|
border-style: solid;
|
|
127
|
border-color: transparent #000;
|
|
128
|
}
|
|
129
|
|
|
130
|
.triangle-right:before{
|
|
131
|
content: "";
|
|
132
|
position: absolute;
|
|
133
|
bottom: -20px;
|
|
134
|
right: 30px;
|
|
135
|
border-width: 0 0 25px 50px;
|
|
136
|
border-style: solid;
|
|
137
|
border-color: transparent #3FC2F3;
|
|
138
|
display: block;
|
|
139
|
width: 0;
|
|
140
|
}
|
|
141
|
|
|
142
|
.triangle-right:after{
|
|
143
|
content: "";
|
|
144
|
position: absolute;
|
|
145
|
bottom: -20px;
|
|
146
|
right: 60px;
|
|
147
|
border-width: 0 0 20px 20px;
|
|
148
|
border-style: solid;
|
|
149
|
border-color: transparent #000;
|
|
150
|
display: block;
|
|
151
|
width: 0;
|
|
152
|
}
|
|
153
|
|
|
154
|
|
|
155
|
</style>
|
|
156
|
|
|
157
|
|
|
158
|
</head>
|
|
159
|
|
|
160
|
<body>
|
|
161
|
|
|
162
|
<div id="sopa">
|
|
163
|
<div id="header">
|
|
164
|
<h1>CUNY ACADEMIC COMMONS</h1>
|
|
165
|
<p><a href="#">Continue to the Commons</a></p>
|
|
166
|
</div>
|
|
167
|
|
|
168
|
<div id="sopa-head">
|
|
169
|
<h2>SAVE THE INTERNET. STOP SOPA / PIPA</h2>
|
|
170
|
</div>
|
|
171
|
|
|
172
|
<div id="learn" class="section">
|
|
173
|
<h2 class="triangle-left">Learn More About SOPA / PIPA</h2>
|
|
174
|
<p>Current Bills in the House, Stop Online Piracy Act (SOPA), and Senate Protect IP Act (PIPA), threaten the existence of sites like the CUNY Academic Commons and any site that allows people to share information on the Internet. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.
|
|
175
|
</p>
|
|
176
|
</div>
|
|
177
|
|
|
178
|
<div id="action" class="section">
|
|
179
|
<h2 class="triangle-left">Take Action! Contact Your Representative</h2>
|
|
180
|
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.</p>
|
|
181
|
|
|
182
|
<h2 class="triangle-right" >Join in. Blackout Your Commons Blog</h2>
|
|
183
|
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.</p>
|
|
184
|
|
|
185
|
</div>
|
|
186
|
|
|
187
|
<div id="spread" class="section">
|
|
188
|
<h2 class="triangle-right">Spread the Word</h2>
|
|
189
|
<p>Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vestibulum tortor quam, feugiat vitae, ultricies eget, tempor sit amet, ante. Donec eu libero sit amet quam egestas semper. Aenean ultricies mi vitae est. Mauris placerat eleifend leo.</p>
|
|
190
|
</div>
|
|
191
|
</div>
|
|
192
|
</body>
|
|
193
|
|
|
194
|
</html>
|
