Web-ready content and new styles for Sessions.
[libreplanet-static.git] / 2015 / assets / css / custom.css
CommitLineData
da24cbe6
DT
1body {
2 font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
3 font-size: 14px;
4 line-height: 1.428571429;
5 color: #333333;
6}
7
93a0a5e1 8h3 {
4df3d3d6 9 color: rgb(88, 208, 121);
10}
11
abc3c8c3 12h2 small, h2 .small, h3 small, h3 .small {
13 color: rgb(60, 142, 83);
4df3d3d6 14}
15
16
da24cbe6
DT
17h3 {
18 font-size: 20px;
19}
20
21.lp-banner {
22 box-shadow: 0px 1px 5px rgba(255, 255, 255, 0.7);
23 margin-bottom: 20px;
24 text-shadow: 0px 1px 0px #ffffff;
25 background-image: url(/2014/assets/img/l-noise.png);
26}
27
28.lp-head img {
4c57fab0 29 margin: 0.5em 0 0.001em -1.5em;
da24cbe6
DT
30}
31
32.lp-head p {
6360d6a8 33 margin: -0.79em 0 0.001em -4em;
da24cbe6
DT
34}
35
36#lp-panel {
37 max-width: 32%;
38 margin-left: 0.3em;
39 float: right;
40}
41
42#lp-panel ul {
43 list-style: square;
44 padding-left: 0.4em;
45}
46
47#lp-panel li {
48 margin-bottom: 0.5em;
49}
50
a6b43cb0 51#lp-updates {
52 max-width: 35%;
53 margin-left: 0.3em;
54}
55
5d95f538 56@media (max-width:551px) {
57 .lp-head p {
58 margin: 0 0 0.2em 0;
59 text-align: center;
60 }
61 .lp-head img {
62 margin: 1.5em auto 0.5em auto;
63 }
0811611a 64
65 #lp-panel {
66 max-width: 100%;
67 margin-left: 0;
68 float: none;
69 }
70
5d95f538 71}
72
73@media (min-width: 552px) and (max-width:767px) {
74
da24cbe6 75 .lp-head img {
5d95f538 76 margin: 1.5em auto 0.5em auto;
da24cbe6
DT
77 }
78 .lp-head p {
6360d6a8 79 margin: 0.27em 0 0.001em -3.6em;
da24cbe6 80 }
5d95f538 81
da24cbe6
DT
82 #lp-panel {
83 max-width: 100%;
84 margin-left: 0;
85 float: none;
86 }
675bb371 87
a6b43cb0 88 #lp-updates {
89 max-width: 100%;
90 margin-left: 0;
91 }
da24cbe6
DT
92}
93
94.lp-thumbnail {
95 float: right;
96 margin-left: 0.5em;
97}
98
99
100@media (max-width: 635px) {
101 .lp-thumbnail {
102 float: none;
103 margin-left: 0;
104 }
105}
106
107
108@media (min-width: 768px) and (max-width:991px) {
109 .lp-head img {
4c57fab0 110 margin-top: 1.0em;
da24cbe6
DT
111 }
112 .lp-head p {
6360d6a8 113 margin: -0.45em 0 0.001em -3.6em;
da24cbe6
DT
114 }
115}
116
117@media (min-width:1200px) {
118 .lp-head p {
6360d6a8 119 margin: -0.79em 0 0.001em -7em;
da24cbe6
DT
120 }
121}
122
123.lp-signup {
124 margin-right: 10px;
125 margin-left: 10px;
126}
127
128.lp-banner .container {
129 padding-right: 5px;
130 padding-left: 5px;
131 margin-right: auto;
132 margin-left: auto;
133}
134
135
136.btn-register-lp14 {
4c57fab0 137 margin-top: 0.5em;
da24cbe6
DT
138 margin-bottom: 0.3em;
139 color: #ffffff;
140 text-shadow: 0px 0px 0px #ffffff;
07756ed6
ZR
141 background-color: rgba(58, 208, 61, 0.6);
142 background-color: rgba(58, 208, 61, 0.6);
da24cbe6
DT
143}
144
145.btn-register-lp14:hover,
146.btn-register-lp14:focus,
147.btn-register-lp14:active,
148.btn-register-lp14.active,
149.open .dropdown-toggle.btn-register-lp14 {
150 color: #ffffff;
151 background-color: rgba(74, 161, 74, 0.9);
152 border-color: rgba(57, 132, 57, 0.2);
153}
154
155.btn-register-lp14:active,
156.btn-register-lp14.active,
157.open .dropdown-toggle.btn-register-lp14 {
158 background-image: none;
159}
160
161
162@media (min-width:1280px) {
163 .btn-block {
164 display: block;
165 margin-right:auto;
166 margin-left:auto;
167 width: 85%;
168 padding-right: 0;
169 padding-left: 0;
170 }
171}
172
173
174.fsf-donate-button {
175 margin-left: 24%;
176 margin-top: 5px;
177 margin-bottom: 10px;
178 width:56%;
179}
180
181@media (max-width:768px) {
182 .fsf-donate-button {
183 margin-left: 38%;
184 margin-top: 5px;
185 margin-bottom: 10px;
186 width:22%;
187 }
188}
189
190@media (min-width:320px) and (max-width:360px) {
191 .fsf-donate-button {
192 margin-left: 28%;
193 margin-top: 5px;
194 margin-bottom: 10px;
195 width:46%;
196 }
197}
198
199.page-header {
200 padding-bottom: 9px;
201 margin: 40px 0 20px;
202 border-bottom: none;
203}
204
205
206.form-control:-moz-placeholder {
207 color: #777777;
208}
209
210.form-control::-moz-placeholder {
211 color: #777777;
212}
213
214.form-control:-ms-input-placeholder {
215 color: #777777;
216}
217
218.form-control::-webkit-input-placeholder {
219 color: #777777;
220}
221
222.form-control {
223 display: block;
224 width: 100%;
225 height: 34px;
226 padding: 6px 12px;
227 font-size: 14px;
228 line-height: 1.428571429;
229 color: #555555;
230 vertical-align: middle;
231 background-color: rgba(250, 250, 250, 0.7);
232 border: 1px solid #cccccc;
233 border-radius: 4px;
234 -webkit-box-shadow: none;
235 box-shadow: none;
236 -webkit-transition: border-color ease-in-out 0.15s;
237 transition: border-color ease-in-out 0.15s;
238}
239
240.form-control:focus {
9967b03c 241 border-color: rgb(88, 208, 121);
da24cbe6
DT
242 outline: 0;
243 -webkit-box-shadow: none;
244 box-shadow: none;
245}
246
247.scholarship-input-annotation {
248 margin-bottom: -0.6em;
249}
250
251.lp-signup .form-group {
252 margin-bottom: 2px;
253}
254
255.lp-label-news {
256 display: inline-block;
257}
258
259.checkbox .help-block {
260 display: inline-block;
261 margin-top: 0;
262 margin-bottom: 10px;
263 color: #737373;
264}
265
266.form-group .lp-left-form-checkbox-text {
267 text-align:right;
268 font-weight: bold;
269}
270
271@media screen and (min-width: 320px) and (max-width: 768px){
272 .form-group .lp-left-form-checkbox-text {
273 text-align: left;
274 font-weight: bold;
275 }
276}
277
278.field-required {
279 color: rgba(128, 0, 0, 0.6);
280}
281
282.radio-inline,
283.checkbox-inline {
284 display: inline-block;
285 padding-left: 30px;
286 margin-bottom: 0;
287 font-weight: normal;
288 vertical-align: middle;
289 cursor: pointer;
290}
291
292.radio-clear-link {
293 display: inline-block;
294 padding-left: 5px;
295 margin-bottom: 0;
296 margin-top: 5px;
297 font-weight: normal;
298 vertical-align: middle;
299 cursor: pointer;
300}
301
302.btn-default {
303 color: #ffffff;
4df3d3d6 304 background-color: rgba(88, 208, 121, 0.8);
305 border-color: rgba(88, 208, 121, 0.5);
da24cbe6
DT
306}
307
308.btn-default:hover,
309.btn-default:focus,
310.btn-default:active,
311.btn-default.active,
312.open .dropdown-toggle.btn-default {
313 color: #ffffff;
4df3d3d6 314 background-color: rgba(88, 208, 121, 1.0);
315 border-color: rgba(88, 208, 121, 0.2);
da24cbe6
DT
316}
317
318@media (min-width:768px) {
319 .nav {
320 padding-left: 0;
321 margin-bottom: 0;
322 list-style: none;
323 padding-top: 1.0em;
324 }
325 .lp-home {
326 padding-top: 2.0em;
04915224 327 padding-bottom: 1.0em;
da24cbe6
DT
328 }
329 .nav-padding-top {
330 margin-top: 4.12em;
331 }
332}
333
334.nav > li {
335 position: relative;
336 display: block;
337 color: #ffffff;
338 text-shadow: 0px 0px 0px #dadada;
339 text-align: center;
340 margin-bottom: 0.4em;
341 border: none;
342 border-radius: 5px;
343}
344
345.nav > li > a {
346 position: relative;
347 display: block;
348 padding: 10px 15px;
349 background-color: rgba(145, 145, 145, 0.8);
350 transition: background-color 1s;
351}
352
353.nav > li.fsf-donate > a {
4df3d3d6 354 background-color: rgba(58, 208, 61, 0.6);
da24cbe6
DT
355 margin-top: 20px;
356}
357
358.nav > li > a:hover,
359.nav > li > a:focus {
360 text-decoration: none;
4df3d3d6 361 background-color: rgba(88, 208, 121, 1.0);
da24cbe6
DT
362}
363
364.nav-pills > li > a {
365 border-radius: 5px;
366 color: inherit;
367}
368
369.nav-pills > li.active > a,
370.nav-pills > li.active > a:hover,
371.nav-pills > li.active > a:focus {
372 color: #ffffff;
4df3d3d6 373 background-color: rgba(88, 208, 121, 1.0);
da24cbe6
DT
374}
375
376.btn-carousel {
377 font-size: 1.15em;
378 font-weight: 100;
379}
380
381.carousel-control .icon-prev,
382.carousel-control .icon-next,
383.carousel-control .glyphicon-chevron-left,
384.carousel-control .glyphicon-chevron-right {
385 position: absolute;
386 top: 50%;
387 left: 50%;
388 z-index: 5;
389 display: none;
390}
391
392.carousel-caption-tr {
393 position: absolute;
394 font-size: 1.1em;
395 top: 5%;
396 bottom: auto;
397 right: 1.5%;
398 left: 38%;
399 z-index: 10;
400 padding-top: 10px;
401 padding-bottom: 10px;
402 color: #ffffff;
403 text-align: center;
60678eee 404 background-color: rgba(0, 0, 0,0.6);
da24cbe6
DT
405 border-radius: 8px;
406}
407
da24cbe6
DT
408.carousel-caption-bl {
409 position: absolute;
410 font-size: 1.1em;
411 top: auto;
412 bottom: 5%;
413 right: 45%;
414 left: 2%;
415 z-index: 10;
416 padding-top: 10px;
417 padding-bottom: 10px;
418 padding-left: 10px;
419 padding-right: 10px;
420 color: #ffffff;
421 text-align: center;
60678eee 422 background-color: rgba(0, 0, 0,0.6);
da24cbe6
DT
423 border-radius: 8px;
424}
425
426.carousel-caption-tl {
427 position: absolute;
428 font-size: 1.1em;
429 top: 5%;
430 bottom: auto;
431 right: 34%;
432 left: 2%;
433 z-index: 10;
434 padding-top: 10px;
435 padding-bottom: 10px;
436 color: #ffffff;
437 text-align: center;
60678eee 438 background-color: rgba(0, 0, 0,0.6);
da24cbe6
DT
439 border-radius: 8px;
440}
441
e1cd6657 442.carousel-caption-center {
507b61ce
ZR
443 position: absolute;
444 font-size: 1.1em;
445 top: 50%;
446 bottom: auto;
72d368d7 447 right: auto;
eb47f340 448 left: 35%;
507b61ce 449 z-index: 10;
e7695f45
ZR
450 padding-right: 10px;
451 padding-left: 10px;
507b61ce
ZR
452 padding-top: 10px;
453 padding-bottom: 10px;
454 color: #ffffff;
455 text-align: center;
456 background-color: rgba(0, 0, 0,0.6);
457 border-radius: 8px;
458}
459
da24cbe6
DT
460@media screen and (min-width: 1280px) {
461 .carousel-caption-tr {
462 padding-bottom: 10px;
463 margin-left: 65px;
464 margin-right: auto;
465 }
466
467 .carousel-caption-bl {
468 padding-bottom: 10px;
469 margin-left: auto;
470 margin-right: 65px;
471 }
472
473}
474
475@media screen and (min-width: 600px) and (max-width: 980px){
476 .btn-carousel {
477 font-size: 0.9em;
478 font-weight: 200;
479 }
480}
481
482@media screen and (min-width: 320px) and (max-width: 480px){
483 .carousel-caption-tl {
484 right: 2%;
485 }
486
487 .btn-carousel {
488 font-size: 0.85em;
489 font-weight: 200;
490 }
491 .carousel-caption-tr {
492 left: 1%;
493 }
494}
495
496a {
9967b03c 497 color: rgb(88, 208, 121);
da24cbe6
DT
498 text-decoration: none;
499}
500
501a:hover,
502a:focus {
4df3d3d6 503 color: rgb(38, 208, 61);
da24cbe6
DT
504 text-decoration: none;
505}
506
507hr {
508 margin-top: 20px;
509 margin-bottom: 20px;
510 border: 0;
511 border-top: 1px solid #bababa;
512}
513
514.margin-top {
515 margin-top: 22px;
516}
517
518.speaker {
519 vertical-align:top;
520}
521
522.session-speaker h3 {
523 margin-top: 0em;
524}
525
526.session-speaker {
675bb371 527 margin-top: 1.8em;
da24cbe6
DT
528}
529
530.speaker-photo {
531 padding-top:23px;
532 padding-right:15px;
533}
534
535.lp-video {
536 width: 100%;
537}
538
e11ecb4a 539.word-break {
540 word-break: break-all;
541}
542
6ffb8f16
ZR
543/* Program */
544
545.session {
546 margin-bottom: 30px;
547}
548
549.session h4 {
550 margin-bottom: 5px;
551}
552
553.session .room {
554 font-weight: bold;
555}
556
557.session .speakers {
558 font-style: italic;
559}
560
da24cbe6
DT
561/* Footer - adapted from <http://getbootstrap.com/examples/sticky-footer/>
562-------------------------------------------------- */
563
564html,
565body {
566 height: 100%;
567}
568
569#wrapper {
570 min-height: 100%;
571 height: auto !important;
572 height: 100%;
573 margin: 0 auto -60px;
574 padding: 0 0 60px;
575}
576
577#footer {
578 height: auto;
579 border-top: 2px solid #dadada;
580 box-shadow: 0px 1px 9px rgba(255, 255, 255, 0.7);
581 background-color: rgb(255, 255, 255);
582 margin-top: 1.5em;
583}
584
585#footer .container p {
586 margin: 1.4em 0;
587}