< PennState | Project(Difference between revisions)
|
|
| (3 intermediate revisions not shown) |
| Line 1: |
Line 1: |
| - | <html>
| |
| - | <!-- START CSS: the following css needs to be on the page to style the podcast divs properly. Diagonal span background based on www.mezzoblue.com/zengarden/alldesigns/ -->
| |
| - | <style type="text/css">
| |
| - | .column {
| |
| - | width: 400px;
| |
| - | position: relative;
| |
| - | display: block;
| |
| - | float: left;
| |
| - | clear: none;
| |
| - | margin-right: 20px;
| |
| - | }
| |
| - | .podcast{
| |
| - | position: relative;
| |
| - | float: none;
| |
| - | border: 1px dotted #c7cbce;
| |
| - | height: 110px;
| |
| - | background-color: #f1f1f1;
| |
| - | clear: both;
| |
| - | margin-bottom: 42px;
| |
| - | font: 12px/1.4em "Lucida Grande", "Lucida Sans Unicode", Verdana, Tahoma, Arial, sans-serif;
| |
| - | padding: 0;
| |
| - | width: 400px;
| |
| - | }
| |
| - | .podcast h3{
| |
| - | color: #3d3d3d;
| |
| - | margin: .2em 0 .5em;
| |
| - | padding: 0 0 0 4px;
| |
| - | font-family: Verdana, sans-serif;
| |
| - | font-size: 100%;
| |
| - | }
| |
| - | .podcast a:link, .podcast a:visited{
| |
| - | text-decoration: none;
| |
| - | color: #3d3d3d;
| |
| - | }
| |
| - | .podcast a:hover {
| |
| - | color: #aaaaff;
| |
| - | }
| |
| - | a:hover.screenshot {
| |
| - | }
| |
| - | .podcast .screenshot {
| |
| - | float: left;
| |
| - | position: relative;
| |
| - | clear: none;
| |
| - | display: block;
| |
| - | margin: 0px 0px 0px 16px;
| |
| - | }
| |
| - | .podcast .screenshot img {
| |
| - | background: #ffffff;
| |
| - | border: 1px solid #c7cbce;
| |
| - | padding: 4px;
| |
| - | }
| |
| - | .podcast .screenshot span {
| |
| - | position: absolute;
| |
| - | bottom:0px;
| |
| - | right: 1px;
| |
| - | padding: 4px 20px 4px 26px;
| |
| - | background: url(https://static.igem.org/mediawiki/2007/0/09/Podcast-download-bg.gif) no-repeat;
| |
| - | font-size: 0.8em;
| |
| - | line-height: 1;
| |
| - | }
| |
| - | .podcast .screenshot span a{
| |
| - | padding: 0 0 0 0.5em;
| |
| - | }
| |
| - | .podcast .description {
| |
| - | display: block;
| |
| - | position: relative;
| |
| - | float: left;
| |
| - | width: 220px;
| |
| - | margin-left: 3px;
| |
| - | padding-left: 1.2em;
| |
| - | }
| |
| - | .podcast .description a{
| |
| - | border-bottom: 1px dotted #aaaaff;
| |
| - | }
| |
| - | .podcast .description a:hover{
| |
| - | border-bottom: 1px dotted #aaaaff;
| |
| - | }
| |
| - | .screenshot img:hover {
| |
| - | border: 1px solid #aaaaff;
| |
| - | }
| |
| - | </style></html>
| |
| | | | |
| - | <html>
| |
| - | <!-- PODCAST HTML: the following html structures the information for each podcast. Each podcast entry is contained in its own podcast div, which are arranged into two columns by two column divs. The last column must be cleared.-->
| |
| - | <div class="column">
| |
| - |
| |
| - | <div class="podcast">
| |
| - | <h3><a rel="enclosure" href="http://openwetware.org/images/c/c9/XylRdimer1.png" onclick="window.popup_player_258600 = window.open('http://blip.tv/file/254077/?skin=popup&file_type=flv','post_258600','toolbar=no,scrollbars=no,directories=no,resizable=yes,width=360,height=305,top=20,left=20,location=no,menubar=no,status=yes,'); return false;">
| |
| - | Drew Endy: Defining Synthetic Biology
| |
| - | </a></h3>
| |
| - | <div class="screenshot">
| |
| - | <!-- little white box thing --> <a rel="enclosure" href="http://blip.tv/file/get/IgemLabs-iGEMExplainer01DrewEndyDefiningSyntheticBiology399.flv"
| |
| - | <img src="http://openwetware.org/images/c/c9/XylRdimer1.png" width="133" height="100" alt="" />
| |
| - | </a>
| |
| - | <span class="download">
| |
| - | <a href="http://igem.blip.tv/file/get/IgemLabs-iGEMExplainer01DrewEndyDefiningSyntheticBiology399.mov">screen</a>
| |
| - | <a href="http://igem.blip.tv/file/get/IgemLabs-iGEMExplainer01DrewEndyDefiningSyntheticBiology948.mp4">ipod</a>
| |
| - | </span>
| |
| - | </div>
| |
| - | <div class="description">
| |
| - | "Make it easier to build things. Define the things you are building with by using standards. Hide biological complexity with abstraction." </div>
| |
| - | </div>
| |
| - | <div style="clear:both"></div>
| |
| - | </html>
| |
