Biomod/2012/TU Dresden/Nanosaurs: Difference between revisions

From OpenWetWare
Jump to navigationJump to search
No edit summary
No edit summary
 
(18 intermediate revisions by 3 users not shown)
Line 1: Line 1:
#column-content {
{{Biomod/2012/TU Dresden/Nanosaurs/Header}}
width: 100%;
<html>
float: right;
margin: 0 0 .6em -12.2em;
<script type="text/javascript" src="http://biomod-dresden-2012.googlecode.com/svn/trunk/js/jquery.tweet.js"></script> <!-- tweet import -->
padding: 0;
}
#content {
margin: auto;
width: 980px;
padding: 0 1em 1em 1em;
position: relative;
z-index: 2;
}
#column-one {
padding-top: 160px;
}
#content {
background: #F9F9F9;
color: black;
line-height: 1.5em;
}
/* the left column width is specified in class .portlet */
 
/* Font size:
** We take advantage of keyword scaling- browsers won't go below 9px
** More at http://www.w3.org/2003/07/30-font-size
** http://style.cleverchimp.com/font_size_intervals/altintervals.html
*/
 
body {
margin: 0;
padding: 0;
/* addition */
color: #777777;
font-family: Verdana;
font-size: 12px;
font-weight: lighter;
line-height: 22px;
background-color: #F9F9F9;
}
 
/* scale back up to a sane default */
#globalWrapper {
font-size: 127%;
width: 100%;
margin: 0;
padding: 0;
}
.visualClear {
clear: both;
}
 
/* general styles */
 
table {
font-size: 100%;
color: black;
/* we don't want the bottom borders of <h2>s to be visible through
  floated tables */
background-color: #F9F9F9;
}
fieldset table {
/* but keep table layouts in forms clean... */
background: none;
}
a {
text-decoration: none;
color: #555555;
background: none;
}
 
a, a:active, a:visited {
color: #607890;
}
a:hover {
color: #003366;
}
 
img {
border: none;
vertical-align: middle;
}
p {
color: #777777;
font-size: 12px;
font-weight: lighter;
line-height: 22px;
margin-bottom: 15px;
}
p img {
margin: 0;
}
 
hr {
height: 1px;
color: #aaa;
background-color: #aaa;
border: 0;
margin: .2em 0 .2em 0;
}
 
h1, h2, h3, h4, h5, h6 {
font-weight: 600;
font-family: 'Merriweather', serif;
margin: 0;
padding-top: .5em;
padding-bottom: .17em;
}
 
h1 {
font-size: 35px;
font-weight: normal;
line-height: 65px;
}
h2 {
font-size: 27px;
font-weight: normal;
line-height: 40px;
}
h3 {
font-size: 25px;
font-weight: normal;
line-height: 35px;
}
h4 {
font-size: 20px;
font-weight: normal;
line-height: 30px;
}
h5 {
font-size: 14px;
font-weight: normal;
line-height: 20px;
}
 
ul {
line-height: 1.5em;
list-style-type: square;
margin: .3em 0 0 1.5em;
padding: 0;
list-style-image: url(bullet.gif);
}
ol {
line-height: 1.5em;
margin: .3em 0 0 3.2em;
padding: 0;
list-style-image: none;
}
li {
margin-bottom: .1em;
}
dt {
font-weight: bold;
margin-bottom: .1em;
}
dl {
margin-top: .2em;
margin-bottom: .5em;
}
dd {
line-height: 1.5em;
margin-left: 2em;
margin-bottom: .1em;
}
 
fieldset {
border: 1px solid #2f6fab;
margin: 1em 0 1em 0;
padding: 0 1em 1em;
line-height: 1.5em;
}
fieldset.nested {
margin: 0 0 0.5em 0;
padding: 0 0.5em 0.5em;
}
legend {
padding: .5em;
font-size: 95%;
}
form {
border: none;
margin: 0;
}
 
textarea {
width: 100%;
padding: .1em;
}
 
input.historysubmit {
padding: 0 .3em .3em .3em !important;
font-size: 94%;
cursor: pointer;
height: 1.7em !important;
margin-left: 1.6em;
}
select {
vertical-align: top;
}
abbr, acronym, .explain {
border-bottom: 1px dotted black;
color: black;
background: none;
cursor: help;
}
q {
font-family: Times, "Times New Roman", serif;
font-style: italic;
}
/* disabled for now
blockquote {
font-family: Times, "Times New Roman", serif;
font-style: italic;
}*/
code {
background-color: #f9f9f9;
}
pre {
padding: 1em;
border: 1px dashed #2f6fab;
color: black;
background-color: #f9f9f9;
line-height: 1.1em;
}
 
/*
** the main content area
*/
 
#siteSub {
display: none;
}
#jump-to-nav {
display: none;
}
 
#contentSub, #contentSub2 {
font-size: 12px;
line-height: 1.5em;
color: #7d7d7d;
width: auto;
border-bottom: 1px solid #EEEEEE;
margin-bottom: 10px;
}
span.subpages {
display: block;
margin: 1em 0;
float: left;
padding-left: 5px;
}
 
/* Some space under the headers in the content area */
#bodyContent h1, #bodyContent h2 {
margin-bottom: .6em;
}
#bodyContent h3, #bodyContent h4, #bodyContent h5 {
margin-bottom: .3em;
}
.firstHeading {
color: #333333;
/* These two rules hack around bug 2013 (fix for more limited bug 11325).
  When bug 2013 is fixed properly, they should be removed. */
line-height: 1.2em;
}
 
/* user notification thing */
.usermessage {
background-color: #F9F9F9;
border: 1px solid #ffa500;
color: black;
font-weight: bold;
margin: 2em 0 1em;
padding: .5em 1em;
vertical-align: middle;
}
#siteNotice {
text-align: center;
font-size: 95%;
padding: 0 .9em;
}
#siteNotice p {
margin: 0;
padding: 0;
}
.success {
color: green;
font-size: larger;
}
.error {
color: red;
font-size: larger;
}
.errorbox, .successbox {
font-size: larger;
border: 2px solid;
padding: .5em 1em;
float: left;
margin-bottom: 2em;
color: #000;
}
.errorbox {
border-color: red;
background-color: #F9F9F9;
}
.successbox {
border-color: green;
background-color: #dfd;
}
.errorbox h2, .successbox h2 {
font-size: 1em;
font-weight: bold;
display: inline;
margin: 0 .5em 0 0;
border: none;
}
 
.catlinks {
border: 1px solid #aaa;
background-color: #f9f9f9;
padding: 5px;
margin-top: 1em;
clear: both;
}
/* currently unused, intended to be used by a metadata box
in the bottom-right corner of the content area */
.documentDescription {
/* The summary text describing the document */
font-weight: bold;
display: block;
margin: 1em 0;
line-height: 1.5em;
}
.documentByLine {
text-align: right;
font-size: 90%;
clear: both;
font-weight: normal;
color: #76797c;
}
 
/* emulate center */
.center {
width: 100%;
text-align: center;
}
*.center * {
margin-left: auto;
margin-right: auto;
}
/* small for tables and similar */
.small, .small * {
font-size: 94%;
}
table.small {
font-size: 100%;
}
 
/*
** content styles
*/
 
#toc,
.toc,
.mw-warning {
border: 1px solid #aaa;
background-color: #f9f9f9;
padding: 5px;
font-size: 95%;
}
#toc h2,
.toc h2 {
display: inline;
border: none;
padding: 0;
font-size: 100%;
font-weight: bold;
}
#toc #toctitle,
.toc #toctitle,
#toc .toctitle,
.toc .toctitle {
text-align: center;
}
#toc ul,
.toc ul {
list-style-type: none;
list-style-image: none;
margin-left: 0;
padding-left: 0;
text-align: left;
}
#toc ul ul,
.toc ul ul {
margin: 0 0 0 2em;
}
#toc .toctoggle,
.toc .toctoggle {
font-size: 94%;
}
 
.mw-warning {
margin-left: 50px;
margin-right: 50px;
text-align: center;
}
 
/* images */
div.floatright, table.floatright {
clear: right;
float: right;
position: relative;
margin: 0 0 .5em .5em;
border: 0;
/*
border: .5em solid white;
border-width: .5em 0 .8em 1.4em;
*/
}
div.floatright p { font-style: italic; }
div.floatleft, table.floatleft {
float: left;
clear: left;
position: relative;
margin: 0 .5em .5em 0;
border: 0;
/*
margin: .3em .5em .5em 0;
border: .5em solid white;
border-width: .5em 1.4em .8em 0;
*/
}
div.floatleft p { font-style: italic; }
/* thumbnails */
div.thumb {
margin-bottom: .5em;
border-style: solid;
border-color: white;
width: auto;
}
div.thumbinner {
border: 1px solid #ccc;
padding: 3px !important;
background-color: #f9f9f9;
font-size: 94%;
text-align: center;
overflow: hidden;
}
html .thumbimage {
border: 1px solid #ccc;
}
html .thumbcaption {
border: none;
text-align: left;
line-height: 1.4em;
padding: 3px !important;
font-size: 94%;
}
div.magnify {
float: right;
border: none !important;
background: none !important;
}
div.magnify a, div.magnify img {
display: block;
border: none !important;
background: none !important;
}
div.tright {
clear: right;
float: right;
border-width: .5em 0 .8em 1.4em;
}
div.tleft {
float: left;
clear: left;
margin-right: .5em;
border-width: .5em 1.4em .8em 0;
}
img.thumbborder {
border: 1px solid #dddddd;
}
.hiddenStructure {
display: none;
}
 
/*
** classes for special content elements like town boxes
** intended to be referenced directly from the wiki src
*/
 
/*
** User styles
*/
/* table standards */
table.rimage {
float: right;
position: relative;
margin-left: 1em;
margin-bottom: 1em;
text-align: center;
}
.toccolours {
border: 1px solid #aaa;
background-color: #f9f9f9;
padding: 5px;
font-size: 95%;
}
 
/*
** edit views etc
*/
.special li {
line-height: 1.4em;
margin: 0;
padding: 0;
}
 
/*
** keep the whitespace in front of the ^=, hides rule from konqueror
** this is css3, the validator doesn't like it when validating as css2
*/
#bodyContent a.external,
#bodyContent a[href ^="gopher://"] {
background: url(external.png) center right no-repeat;
padding-right: 13px;
}
#bodyContent a[href ^="https://"],
.link-https {
background: url(lock_icon.gif) center right no-repeat;
padding-right: 16px;
}
#bodyContent a[href ^="mailto:"],
.link-mailto {
background: url(mail_icon.gif) center right no-repeat;
padding-right: 18px;
}
#bodyContent a[href ^="news://"] {
background: url(news_icon.png) center right no-repeat;
padding-right: 18px;
}
#bodyContent a[href ^="ftp://"],
.link-ftp {
background: url(file_icon.gif) center right no-repeat;
padding-right: 18px;
}
#bodyContent a[href ^="irc://"],
#bodyContent a.extiw[href ^="irc://"],
.link-irc {
background: url(discussionitem_icon.gif) center right no-repeat;
padding-right: 18px;
}
#bodyContent a.external[href $=".ogg"], #bodyContent a.external[href $=".OGG"],
#bodyContent a.external[href $=".mid"], #bodyContent a.external[href $=".MID"],
#bodyContent a.external[href $=".midi"], #bodyContent a.external[href $=".MIDI"],
#bodyContent a.external[href $=".mp3"], #bodyContent a.external[href $=".MP3"],
#bodyContent a.external[href $=".wav"], #bodyContent a.external[href $=".WAV"],
#bodyContent a.external[href $=".wma"], #bodyContent a.external[href $=".WMA"],
.link-audio {
background: url("audio.png") center right no-repeat;
padding-right: 13px;
}
#bodyContent a.external[href $=".ogm"], #bodyContent a.external[href $=".OGM"],
#bodyContent a.external[href $=".avi"], #bodyContent a.external[href $=".AVI"],
#bodyContent a.external[href $=".mpeg"], #bodyContent a.external[href $=".MPEG"],
#bodyContent a.external[href $=".mpg"], #bodyContent a.external[href $=".MPG"],
.link-video {
background: url("video.png") center right no-repeat;
padding-right: 13px;
}
#bodyContent a.external[href $=".pdf"], #bodyContent a.external[href $=".PDF"],
#bodyContent a.external[href *=".pdf#"], #bodyContent a.external[href *=".PDF#"],
#bodyContent a.external[href *=".pdf?"], #bodyContent a.external[href *=".PDF?"],
.link-document {
background: url("document.png") center right no-repeat;
padding-right: 12px;
}
 
/* disable interwiki styling */
#bodyContent a.extiw,
#bodyContent a.extiw:active {
color: #36b;
background: none;
padding: 0;
}
#bodyContent a.external {
color: #36b;
}
/* this can be used in the content area to switch off
special external link styling */
#bodyContent .plainlinks a {
background: none !important;
padding: 0 !important;
}
/*
** Structural Elements
*/
 
/*
** general portlet styles (elements in the quickbar)
*/
.portlet {
border: none;
margin: 0 0 .5em;
padding: 0;
float: none;
width: 11.6em;
overflow: hidden;
}
.portlet h4 {
font-size: 95%;
font-weight: normal;
white-space: nowrap;
}
.portlet h5 {
background: transparent;
padding: 0 1em 0 .5em;
display: inline;
height: 1em;
text-transform: lowercase;
font-size: 91%;
font-weight: normal;
white-space: nowrap;
}
.portlet h6 {
background: #F9F9F9;
border: 1px solid #2f6fab;
border-style: solid solid none solid;
padding: 0 1em 0 1em;
text-transform: lowercase;
display: block;
font-size: 1em;
height: 1.2em;
font-weight: normal;
white-space: nowrap;
}
.pBody {
font-size: 95%;
background-color: white;
color: black;
border-collapse: collapse;
border: 1px solid #aaa;
padding: 0 .8em .3em .5em;
}
.portlet h1,
.portlet h2,
.portlet h3,
.portlet h4 {
margin: 0;
padding: 0;
}
.portlet ul {
line-height: 1.5em;
list-style-type: square;
list-style-image: url(bullet.gif);
font-size: 95%;
}
.portlet li {
padding: 0;
margin: 0;
}
 
/*
** Logo properties
*/
 
#p-logo {
top: 0;
left: 0;
position: absolute; /*needed to use z-index */
z-index: 3;
height: 155px;
width: 12em;
overflow: visible;
}
#p-logo h5 {
display: none;
}
#p-logo a,
#p-logo a:hover {
display: block;
height: 155px;
width: 12.2em;
background-repeat: no-repeat;
background-position: 35% 50% !important;
text-decoration: none;
}
 
/*
** Search portlet
*/
#p-search {
position: relative;
z-index: 3;
}
input.searchButton {
margin-top: 1px;
font-size: 95%;
}
#searchGoButton {
padding-left: .5em;
padding-right: .5em;
font-weight: bold;
}
#searchInput {
width: 10.9em;
margin: 0;
font-size: 95%;
}
#p-search .pBody {
padding: .5em .4em .4em .4em;
text-align: center;
}
 
/*
** the personal toolbar
*/
#p-personal {
position: absolute;
left: 0;
top: 0;
z-index: 0;
}
#p-personal {
width: 100%;
white-space: nowrap;
padding: 0;
margin: 0;
border: none;
background: none;
overflow: visible;
line-height: 1.2em;
}
#p-personal h5 {
display: none;
}
#p-personal .portlet,
#p-personal .pBody {
z-index: 0;
padding: 0;
margin: 0;
border: none;
overflow: visible;
background: none;
}
/* this is the ul contained in the portlet */
#p-personal ul {
border: none;
line-height: 1.4em;
color: #2f6fab;
padding: 0 2em 0 3em;
margin: 0;
text-align: right;
list-style: none;
z-index: 0;
background: none;
cursor: default;
}
#p-personal li {
z-index: 0;
border: none;
padding: 0;
display: inline;
color: #2f6fab;
margin-left: 1em;
line-height: 1.2em;
background: none;
}
#p-personal li a {
text-decoration: none;
color: #005896;
padding-bottom: .2em;
background: none;
}
#p-personal li a:hover {
background-color: white;
padding-bottom: .2em;
text-decoration: none;
}
#p-personal li.active a:hover {
background-color: transparent;
}
/* the icon in front of the user name, single quotes
in bg url to hide it from iemac */
li#pt-userpage,
li#pt-anonuserpage,
li#pt-login {
background: url(user.gif) top left no-repeat;
padding-left: 20px;
text-transform: none;
}
#p-personal ul {
text-transform: lowercase;
}
#p-personal li.active {
font-weight: bold;
}
/*
** the page-related actions- page/talk, edit etc
*/
#p-cactions {
position: absolute;
top: 1.3em;
left: 11.5em;
margin: 0;
white-space: nowrap;
width: 76%;
line-height: 1.1em;
overflow: visible;
background: none;
border-collapse: collapse;
padding-left: 1em;
list-style: none;
font-size: 95%;
}
#p-cactions ul {
list-style: none;
}
#p-cactions li {
display: inline;
border: 1px solid #aaa;
border-bottom: none;
padding: 0 0 .1em 0;
margin: 0 .3em 0 0;
overflow: visible;
background: white;
}
#p-cactions li.selected {
border-color: #fabd23;
padding: 0 0 .2em 0;
font-weight: bold;
}
#p-cactions li a {
background-color: #fbfbfb;
border: none;
padding: 0 .8em .3em;
position: relative;
z-index: 0;
margin: 0;
text-decoration: none;
}
#p-cactions li.selected a {
z-index: 3;
padding: 0 1em .2em!important;
background-color: white;
}
#p-cactions .new a {
color: #ba0000;
}
#p-cactions li a:hover {
z-index: 3;
text-decoration: none;
background-color: white;
}
#p-cactions h5 {
display: none;
}
#p-cactions li.istalk {
margin-right: 0;
}
#p-cactions li.istalk a {
padding-right: .5em;
}
#p-cactions #ca-addsection a {
padding-left: .4em;
padding-right: .4em;
}
/* offsets to distinguish the tab groups */
li#ca-talk {
margin-right: 1.6em;
}
li#ca-watch, li#ca-unwatch, li#ca-varlang-0, li#ca-print {
margin-left: 1.6em;
}
#p-cactions .pBody {
font-size: 1em;
background-color: transparent;
color: inherit;
border-collapse: inherit;
border: 0;
padding: 0;
}
#p-cactions .hiddenStructure {
display: none;
}
#p-cactions li a {
text-transform: lowercase;
}
 
/*
** the remaining portlets
*/
#p-tbx,
#p-lang {
position: relative;
z-index: 3;
}
 
/* TODO: #t-iscite is only used by the Cite extension, come up with some
* system which allows extensions to add to this file on the fly
*/
#t-ispermalink, #t-iscite {
color: #999;
}
/*
** footer
*/
#footer {
background-color: #F9F9F9;
border-top: 1px solid #EEEEEE;
border-bottom: 1px solid #EEEEEE;
margin: 2em auto 0;
padding: .4em 0 1.2em 0;
text-align: center;
font-size: 70%;
width: 980px;
}
 
#footer li {
display: inline;
margin: 0 1.3em;
}
#f-poweredbyico, #f-copyrightico {
margin: 0 8px;
position: relative;
top: 7px; /* Bump it up just a tad */
opacity: 0.3;
}
#f-poweredbyico {
float: right;
height: 1%;
}
#f-copyrightico {
float: left;
height: 1%;
}
 
#f-poweredbyico:hover {
opacity: 0.8;
}
#f-copyrightico:hover {
opacity: 0.8;
}
/* js pref toc */
#preftoc {
margin: 0;
padding: 0;
width: 100%;
clear: both;
}
#preftoc li {
background-color: #F9F9F9;
color: #000;
}
#preftoc li {
margin: 1px -2px 1px 2px;
float: left;
padding: 2px 0 3px 0;
border: 1px solid #fff;
border-right-color: #716f64;
border-bottom: 0;
position: relative;
white-space: nowrap;
list-style-type: none;
list-style-image: none;
z-index: 3;
}
#preftoc li.selected {
font-weight: bold;
background-color: #f9f9f9;
border: 1px solid #aaa;
border-bottom: none;
cursor: default;
top: 1px;
padding-top: 2px;
margin-right: -3px;
}
#preftoc > li.selected {
top: 2px;
}
#preftoc a,
#preftoc a:active {
display: block;
color: #000;
padding: 0 .7em;
position: relative;
text-decoration: none;
}
#preftoc li.selected a {
cursor: default;
text-decoration: none;
}
#prefcontrol {
padding-top: 2em;
clear: both;
}
#preferences {
margin: 0;
border: 1px solid #aaa;
clear: both;
padding: 1.5em;
background-color: #F9F9F9;
}
.prefsection {
border: none;
padding: 0;
margin: 0;
}
.prefsection fieldset {
border: 1px solid #aaa;
float: left;
margin-right: 2em;
}
.prefsection legend {
font-weight: bold; 
}
.prefsection table, .prefsection legend {
background-color: #F9F9F9;
}
.mainLegend {
display: none;
}
div.prefsectiontip {
font-size: x-small;
padding: .2em 2em;
color: #666;
}
.btnSavePrefs {
font-weight: bold;
padding-left: .3em;
padding-right: .3em;
}
 
.preferences-login {
clear: both;
margin-bottom: 1.5em;
}
 
.prefcache {
font-size: 90%;
margin-top: 2em;
}
 
div#userloginForm form,
div#userlogin form#userlogin2 {
margin: 0 3em 1em 0;
border: 1px solid #aaa;
clear: both;
padding: 1.5em 2em;
background-color: #f9f9f9;
float: left;
}
.rtl div#userloginForm form,
.rtl div#userlogin form#userlogin2 {
float: right;
}
 
div#userloginForm table,
div#userlogin form#userlogin2 table {
background-color: #f9f9f9;
}
 
div#userloginForm h2,
div#userlogin form#userlogin2 h2 {
padding-top: 0;
}
 
div#userlogin .captcha,
div#userloginForm .captcha {
border: 1px solid #bbb;
padding: 1.5em 2em;
background-color: #F9F9F9;
}
 
#loginend, #signupend {
clear: both;
}
 
#userloginprompt, #languagelinks {
font-size: 85%;
}
 
#login-sectiontip {
font-size: 85%;
line-height: 1.2;
padding-top: 2em;
}
 
#userlogin .loginText, #userlogin .loginPassword {
width: 12em;
}
 
#userloginlink a, #wpLoginattempt, #wpCreateaccount {
font-weight: bold;
}
 
/*
** IE/Mac fixes, hope to find a validating way to move this
** to a separate stylesheet. This would work but doesn't validate:
** @import("IEMacFixes.css");
*/
/* tabs: border on the a, not the div */
* > html #p-cactions li { border: none; }
* > html #p-cactions li a {
border: 1px solid #aaa;
border-bottom: none;
}
* > html #p-cactions li.selected a { border-color: #fabd23; }
/* footer icons need a fixed width */
* > html #f-poweredbyico,
* > html #f-copyrightico { width: 88px; }
* > html #bodyContent,
* > html #bodyContent pre {
overflow-x: auto;
width: 100%;
padding-bottom: 25px;
}
 
/* more IE fixes */
/* float/negative margin brokenness */
* html #footer {margin-top: 0;}
* html #column-content {
display: inline;
margin-bottom: 0;
}
* html div.editsection { font-size: smaller; }
#pagehistory li.selected { position: relative; }
 
/* Mac IE 5.0 fix; floated content turns invisible */
* > html #column-content {
float: none;
}
* > html #column-one {
position: absolute;
left: 0;
top: 0;
}
* > html #footer {
margin-left: 13.2em;
}
.redirectText {
font-size: 150%;
margin: 5px;
}
 
.printfooter {
display: none;
}
 
.not-patrolled {
background-color: #ffa;
}
div.patrollink {
clear: both;
font-size: 75%;
text-align: right;
}
span.newpage, span.minor, span.bot {
font-weight: bold;
}
span.unpatrolled {
font-weight: bold;
color: red;
}
 
.sharedUploadNotice {
font-style: italic;
}
 
span.updatedmarker {
color: black;
background-color: #0f0;
}
 
table.gallery {
border: 1px solid #ccc;
margin: 2px;
padding: 2px;
background-color: white;
}
 
table.gallery tr {
vertical-align: top;
}
 
table.gallery td {
vertical-align: top;
background-color: #f9f9f9;
border: solid 2px white;
}
/* Keep this temporarily so that cached pages will display right */
table.gallery td.galleryheader {
text-align: center;
font-weight: bold;
}
table.gallery caption {
font-weight: bold;
}
 
div.gallerybox {
margin: 2px;
}
 
div.gallerybox div.thumb {
text-align: center;
border: 1px solid #ccc;
margin: 2px;
}
 
div.gallerytext {
overflow: hidden;
font-size: 94%;
padding: 2px 4px;
}
 
span.comment {
font-style: italic;
}
 
span.changedby {
font-size: 95%;
}
 
.previewnote {
text-indent: 3em;
color: #c00;
border-bottom: 1px solid #aaa;
padding-bottom: 1em;
margin-bottom: 1em;
}
 
.previewnote p {
margin: 0;
padding: 0;
}
 
.editExternally {
border: 1px solid gray;
background-color: #F9F9F9;
padding: 3px;
margin-top: 0.5em;
float: left;
font-size: small;
text-align: center;
}
.editExternallyHelp {
font-style: italic;
color: gray;
}
 
.toggle {
margin-left: 2em;
text-indent: -2em;
}
 
/* Classes for EXIF data display */
table.mw_metadata {
font-size: 0.8em;
margin-left: 0.5em;
margin-bottom: 0.5em;
width: 300px;
}
 
table.mw_metadata caption {
font-weight: bold;
}
 
table.mw_metadata th {
font-weight: normal;
}
 
table.mw_metadata td {
padding: 0.1em;
}
 
table.mw_metadata {
border: none;
border-collapse: collapse;
}
 
table.mw_metadata td, table.mw_metadata th {
text-align: center;
border: 1px solid #aaaaaa;
padding-left: 0.1em;
padding-right: 0.1em;
}
 
table.mw_metadata th {
background-color: #f9f9f9;
}
 
table.mw_metadata td {
background-color: #fcfcfc;
}
 
table.collapsed tr.collapsable {
display: none;
}
 
 
/* filetoc */
ul#filetoc {
text-align: center;
border: 1px solid #aaaaaa;
background-color: #f9f9f9;
padding: 5px;
font-size: 95%;
margin-bottom: 0.5em;
margin-left: 0;
margin-right: 0;
}
 
#filetoc li {
display: inline;
list-style-type: none;
padding-right: 2em;
}
 
input#wpSummary {
width: 80%;
}
 
/* @bug 1714 */
input#wpSave, input#wpDiff {
margin-right: 0.33em;
}
 
#wpSave {
font-weight: bold;
}
 
/* Classes for article validation */
 
table.revisionform_default {
border: 1px solid #000000;
}
 
table.revisionform_focus {
border: 1px solid #000000;
background-color:#00BBFF;
}
 
tr.revision_tr_default {
background-color:#EEEEEE;
}
 
tr.revision_tr_first {
background-color:#DDDDDD;
}
 
p.revision_saved {
color: green;
font-weight:bold;
}
 
#mw_trackbacks {
border: solid 1px #bbbbff;
background-color: #eeeeff;
padding: 0.2em;
}
 
 
/* Allmessages table */
 
#allmessagestable th {
background-color: #b2b2ff;
}
 
#allmessagestable tr.orig {
background-color: #ffe2e2;
}
 
#allmessagestable tr.new {
background-color: #e2ffe2;
}
 
#allmessagestable tr.def {
background-color: #f0f0ff;
}
 
 
/* noarticletext */
div.noarticletext {
border: 1px solid #ccc;
background: #F9F9F9;
padding: .2em 1em;
color: #000;
}
 
div#searchTargetContainer {
left:      10px;
top:        10px;
width:      90%;
background: #F9F9F9;
}
 
div#searchTarget {
padding:    3px;
margin:    5px;
background: #F9F9F9;
border:    solid 1px blue;
}
 
div#searchTarget ul li {
list-style: none;
}
 
div#searchTarget ul li:before {
color: orange;
content: "\00BB \0020";
}
 
div#searchTargetHide {
float:right;
border:solid 1px black;
background:#DCDCDC;
padding:2px;
}
 
div.multipageimagenavbox {
  border: solid 1px silver;
  padding: 4px;
  margin: 1em;
  background: #f0f0f0;
}
 
div.multipageimagenavbox div.thumb {
  border: none;
  margin-left: 2em;
  margin-right: 2em;
}
 
div.multipageimagenavbox hr {
  margin: 6px;
}
 
table.multipageimage td {
  text-align: center;
}
 
/** Special:Version */
 
table#sv-ext, table#sv-hooks, table#sv-software {
margin: 1em;
padding:0em;
}
 
#sv-ext td, #sv-hooks td, #sv-software td,
#sv-ext th, #sv-hooks th, #sv-software th {
border: 1px solid #A0A0A0;
padding: 0 0.15em 0 0.15em;
}
#sv-ext th, #sv-hooks th, #sv-software th {
background-color: #F9F9F9;
color: black;
padding: 0 0.15em 0 0.15em;
}
tr.sv-space{
height: 0.8em;
border:none;
}
tr.sv-space td { display: none; }
 
/*
  Table pager (e.g. Special:Imagelist)
  - remove underlines from the navigation link
  - collapse borders
  - set the borders to outsets (similar to Special:Allmessages)
  - remove line wrapping for all td and th, set background color
  - restore line wrapping for the last two table cells (description and size)
*/
.TablePager_nav a { text-decoration: none; }
.TablePager { border-collapse: collapse; }
.TablePager, .TablePager td, .TablePager th {
border: 1px solid #aaaaaa;
padding: 0 0.15em 0 0.15em;
}
.TablePager th { background-color: #F9F9F9 }
.TablePager td { background-color: #F9F9F9 }
.TablePager tr:hover td { background-color: #eeeeff }
 
.imagelist td, .imagelist th { white-space: nowrap }
.imagelist .TablePager_col_links { background-color: #eeeeff }
.imagelist .TablePager_col_img_description { white-space: normal }
.imagelist th.TablePager_sort { background-color: #ccccff }
 
.templatesUsed { margin-top: 1.5em; }
 
.mw-summary-preview {
margin: 0.1em 0;
}
 
/* Friendlier slave lag warnings */
div.mw-lag-warn-normal,
div.mw-lag-warn-high {
padding: 3px;
text-align: center;
margin: 3px auto;
}
div.mw-lag-warn-normal {
border: 1px solid #FFCC66;
background-color: ##F9F9F9;
}
div.mw-lag-warn-high {
font-weight: bold;
border: 2px solid #FF0033;
background-color: #F9F9F9;
}
 
/* Recreating-deleted-page/reupload file warning and log entries */
div#mw-upload-deleted-warn,
div#mw-recreate-deleted-warn {
padding: 3px;
margin-bottom: 3px;
border: 2px solid #2F6FAB;
}
div#mw-upload-deleted-warn ul li,
div#mw-recreate-deleted-warn ul li {
font-size: 90%;
}
.MediaTransformError {
background-color: #ccc;
padding: 0.1em;
}
.MediaTransformError td {
text-align: center;
vertical-align: middle;
font-size: 90%;
}
 
/** Special:Search stuff */
div#mw-search-interwiki-caption {
text-align: center;
font-weight: bold;
font-size: 95%;
}
 
.mw-search-interwiki-project {
font-size: 97%;
text-align: left;
padding-left: 0.2em;
padding-right: 0.15em;
padding-bottom: 0.2em;
padding-top: 0.15em;
background: #cae8ff;
}
 
span.searchmatch {
font-weight: bold;
color: red;
}
 
/* God-damned hack for the crappy layout */
.os-suggest {
font-size: 127%;
}
 
div.formbody,
.form_format,
.form_button {
font-family: Arial, Helvetica, sans-serif !important;
}
div.testing {
text-align: left;
}
 
div#sidebar-main {
width: 150px;
}
 
div.error-container {
background-color: #FFEBE8;
border: 1px solid #CC0000;
color: black;
padding: 12px;
font-weight: bold;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
margin-bottom: 1em;
}
 
form#registration td.style2 {
width: 200px;
}
 
form#registration input.form_format {
padding: 0.2em;
font-size: 100%;
}
 
form#registration textarea {
width: 500px;
height: 5em;
padding: 0.2em;
font-family: Arial, Helvetica, sans-serif;
color: #333333;
font-size: 100%;
}
 
form#registration div.style1 {
line-height: 140%;
margin-top: 0.4em;
}
 
form#registration {
margin-bottom: 1em;
}
 
form#registration .form_button {
background-color: #0455B0;
color: white;
-moz-border-radius: 14px;
-webkit-border-radius: 14px;
border-radius: 14px;
padding: 0.4em 1.2em;
font-weight: bold;
cursor: pointer;
font-size: 1em;
}
 
form#registration .form_button:hover {
background-color: #309;
}
 
div.formbody {
font-size: 100%;
}
 
form#registration td.td_label {
width: 220px;
padding-top: 6px;
}
/*** menu ***/
<script type"text/javascript">
.sf-menu, .sf-menu * {
$(document).ready(function(){
margin: 0;
window.scrollTo(0, 155);
padding: 0;
$(".tweet").tweet({
list-style: none;
  count: 6,
}
  query: "from:nanosaurs",
.sf-menu {
  loading_text: "searching twitter..."
line-height: 1.0;
});
}
.sf-menu ul {
position: absolute;
top: -999em;
width: 10em; /* left offset of submenus need to match (see below) */
}
.sf-menu ul li {
width: 100%;
}
.sf-menu li:hover {
visibility: inherit; /* fixes IE7 'sticky bug' */
}
.sf-menu li {
float: left;
position: relative;
}
.sf-menu a {
display: block;
position: relative;
}
.sf-menu li:hover ul,
.sf-menu li.sfHover ul {
left: 0;
top: 2.5em; /* match top ul list item height */
z-index: 99;
}
ul.sf-menu li:hover li ul,
ul.sf-menu li.sfHover li ul {
top: -999em;
}
ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
left: 10em; /* match ul width */
top: 0;
}
ul.sf-menu li li:hover li ul,
ul.sf-menu li li.sfHover li ul {
top: -999em;
}
ul.sf-menu li li li:hover ul,
ul.sf-menu li li li.sfHover ul {
left: 10em; /* match ul width */
top: 0;
}
 
/*** DEMO SKIN ***/
.sf-menu {
float: left;
margin-bottom: 1em;
}
.sf-menu a {
padding: .75em 1em;
text-decoration:none;
font-size: 16px;
}
.sf-menu a, .sf-menu a:visited  { /* visited pseudo selector so IE6 applies text colour*/
color: #999999;
}
.sf-menu li {
background: #F9F9F9;
}
.sf-menu li li {
background: #F9F9F9;
}
.sf-menu li li li {
background: #F9F9F9;
}
.sf-menu li:hover, .sf-menu li.sfHover,
.sf-menu a:focus, .sf-menu a:hover, .sf-menu a:active {
background: #373737;
color: #fff;
outline: 0;
}
 
/*** arrows **/
.sf-menu a.sf-with-ul {
padding-right: 2.25em;
min-width: 1px; /* trigger IE7 hasLayout so spans position accurately */
}
.sf-sub-indicator {
position: absolute;
display: block;
right: .75em;
top: 1.05em; /* IE6 only */
width: 10px;
height: 10px;
text-indent: -999em;
overflow: hidden;
}
    });
a > .sf-sub-indicator {  /* give all except IE6 the correct values */
</script>
top: .8em;
background-position: 0 -100px; /* use translucent arrow for modern browsers*/
<body>
}
/* apply hovers to modern browsers */
a:focus > .sf-sub-indicator,
a:hover > .sf-sub-indicator,
a:active > .sf-sub-indicator,
li:hover > a > .sf-sub-indicator,
li.sfHover > a > .sf-sub-indicator {
background-position: -10px -100px; /* arrow hovers for modern browsers*/
}


/* point right for anchors in subs */
<div id="main_saurs">
.sf-menu ul .sf-sub-indicator { background-position:  -10px 0; }
.sf-menu ul a > .sf-sub-indicator { background-position:  0 0; }
/* apply hovers to modern browsers */
.sf-menu ul a:focus > .sf-sub-indicator,
.sf-menu ul a:hover > .sf-sub-indicator,
.sf-menu ul a:active > .sf-sub-indicator,
.sf-menu ul li:hover > a > .sf-sub-indicator,
.sf-menu ul li.sfHover > a > .sf-sub-indicator {
background-position: -10px 0; /* arrow hovers for modern browsers*/
}


/*** shadows for all but IE6 ***/
<h2>Welcome</h2>
.sf-shadow ul {
<p>We, the Dresden Nanosaurs from Germany, invite you to a ride through our quest to design a stunning nano-biomolecular system for the <a href="http://biomod.net/">BIOMOD</a> competition 2012. We propose a novel biological tethering system based on the technologies of DNA origami and vesicular transport. The illustration below describes the principle of our system.
border-left: 1px solid #EEEEEE;
</p>
border-right: 1px solid #EEEEEE;
<h2>Signal-driven tethering system</h2>
margin-top: 15px;
<div class="big_img"><a rel="lightbox" href="http://openwetware.org/images/7/7b/BM12_nanosaurs_Comic_all.jpg">
}
<img src="http://openwetware.org/images/b/bd/BM12_nanosaurs_Comic_all_m.jpg"></a>
.sf-shadow ul.sf-shadow-off {
<div id="mini_pics">
background: transparent;
<a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Project/DNA%20origami"><img src="http://openwetware.org/images/d/dd/BM12_nanosaursOrigami.png"></a>
}
<a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Project/DNA%20origami"><img src="http://openwetware.org/images/4/47/BM12_nanosaursReceiver-strands.png"></a>
 
<a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Project/Aptamer_lock"><img src="http://openwetware.org/images/1/1c/BM12_nanosaursLock.png"></a>
/*** twitter ***/
<a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Project/Aptamer_lock"><img src="http://openwetware.org/images/5/5b/BM12_nanosaursKey.png"></a>
#twitter{
<a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Project/Vesicles"><img src="http://openwetware.org/images/e/e0/BM12_nanosaursCatcher-strands.png"></a>
border: 5px solid white;
<a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Project/Vesicles"><img src="http://openwetware.org/images/d/d7/BM12_nanosaursGUV.png"></a>
box-shadow: 0 0 10px #888888;
</div>
float: right;
</div>
margin-top: 20px;
}
.tweet, .query {
color: #777777;
font: 80% sans-serif;
width: 200px;
}
.tweet_list {
background-color: #F9F9F9;
border-radius: 0.5em 0.5em 0.5em 0.5em;
list-style: none outside none;
margin: 0;
overflow-y: hidden;
padding: 0;
}
.tweet_list li {
list-style-type: none;
overflow-x: hidden;
overflow-y: auto;
padding: 0.5em;
}
.tweet_list li a {
color: #505050 ;
}
.tweet_list .tweet_even {
background-color: #EBEBEB;
}
.tweet_list .tweet_avatar {
float: left;
padding-right: 0.5em;
}
.tweet_list .tweet_avatar img {
vertical-align: middle;
}
#video{
border: 5px solid white;
box-shadow: 0 0 10px #888888;
float: right;
margin-top: 20px;
width: 200px;
height: 50px;
}
#share{
border: 5px solid white;
box-shadow: 0 0 10px #888888;
float: right;
margin-top: 20px;
width: 200px;
height: 200px;
}
/*** lucas stuff ***/
#header {
height: 425px;
}
#inner_header {
<p>
background: url("http://openwetware.org/images/2/2a/BM12_nanosaurs_Header.jpg") no-repeat scroll 0 0 transparent;
On a central giant vesicle, illustrated as a large yellow sphere, switchable DNA origami boxes are attached on its surface. In the presence of certain signal proteins, the closed DNA origami boxes get unlocked and open up. DNA single strands that were shielded before are now accessible. Therefore they can specifically hybridize with complementary strands on smaller vesicles. Hence multiple smaller vesicles can be specifically attracted to the central giant vesicle.<br/>
height: 425px;
To better understand the different components, you may click on the images below the panel.  
margin: auto;
</p>
width: auto;
border-bottom: 1px solid #EEEEEE;
}
#title_con {
        <h2>Highlights</h2>
float: left;
        <p>Below you can see some of our most appealing results: an image of the tethering of vesicles taken with LSM (Laser Scanning Microscopy) and an AFM (Atomic Force Microscopy) image of the correct folding of the open DNA origami structure.
position: relative;
        </p>
top: 347px;
 
padding-left: 5px;
<div class="big_img"><a rel="lightbox" href="http://openwetware.org/images/0/02/BM12_nanosaurs_Main_Page_Result_Picture_Final.jpg">
}
<img src="http://openwetware.org/images/0/02/BM12_nanosaurs_Main_Page_Result_Picture_Final.jpg"></a>
.clear {
</div>
clear: both;
</div>
display: block;
<div id="video"><iframe width="200" height="200" src="http://www.youtube.com/embed/HcMopZIc1Mg" frameborder="0" allowfullscreen></iframe></div>
height: 0;
<div id="twitter">
overflow: hidden;
<div id="follow"><a href="http://twitter.com/nanosaurs">follow us<img id="logo_twitter" src="http://openwetware.org/images/6/6b/BM12_nanosaurs_Twitter.png"></a></div>
visibility: hidden;
<div class="tweet"></div>
width: 0;
</div>
}
<div id="share"><div class="addthis_toolbox addthis_default_style"><a class="addthis_button_facebook"><img src="http://openwetware.org/images/a/a7/BM12_nanosaurs_Facebook.png"></a><a class="addthis_button_google_plusone_share"><img src="http://openwetware.org/images/c/c9/BM12_nanosaurs_Google.png"></a><a class="addthis_button_compact"><img src="http://openwetware.org/images/1/14/BM12_nanosaurs_Plus.png"></a></div></div>
#nav {
<div class="clear"></div>
float: right;
</body>
position: relative;
</html>
top: 177px;
}
#main_saurs{
padding: 0px 5px 0px;
float: left;
position: relative;
width: 700px;
text-align: justify;
}
#follow {
background-color: #9AE4E8;
}
#follow a {
padding-left: 10px;
color: #fff;
}
#logo_twitter {
padding-left: 80px;
position: relative;
top: -2px;
}
div.img_left{
border: 5px solid white;
box-shadow: 0 0 10px #888888;
float: left;
margin: 1em 2em 1em 0;
}
div.img_right{
border: 5px solid white;
box-shadow: 0 0 10px #888888;
float: right;
margin: 1em 0 1em 2em;
}
div .img_link:hover{
box-shadow: 0 0 10px #484848;
}
.addthis_toolbox{
float: right;
padding-left: 0;
padding-right: 5px;
padding-top: 5px;
width: auto;
}
.addthis_toolbox img:hover {
box-shadow: 0 0 10px #888;
border-radius: 35px;
}

Latest revision as of 21:52, 27 October 2012

<html> <!--import jquery libraries--> <script src="http://biomod-dresden-2012.googlecode.com/svn/trunk/js/jquery-1.8.2.min.js"></script> <script src="http://biomod-dresden-2012.googlecode.com/svn/trunk/js/jquery-ui-1.9.1.custom.min.js"></script> <script src="http://biomod-dresden-2012.googlecode.com/svn/trunk/js/jquery.smooth-scroll.min.js"></script> <script src="http://biomod-dresden-2012.googlecode.com/svn/trunk/js/lightbox.js"></script> <script type="text/javascript" src="http://biomod-dresden-2012.googlecode.com/svn/trunk/js/jquery.queryloader2.js"></script> <!-- progress preloading--> <script type="text/javascript" src="http://biomod-dresden-2012.googlecode.com/svn/trunk/js/superfish.js"></script> <!-- menu bar--> <script type="text/javascript" src="http://biomod-dresden-2012.googlecode.com/svn/trunk/js/jquery.hoverIntent.minified.js"></script> <!-- replaces hover for navigation--> <script type="text/javascript" src="http://biomod-dresden-2012.googlecode.com/svn/trunk/js/jquery.scrollTo-1.4.3.1-min.js"></script> <script type="text/javascript" src="http://biomod-dresden-2012.googlecode.com/svn/trunk/js/jquery.localscroll-1.2.7-min.js"></script> <!--import webfonts--> <link href='http://fonts.googleapis.com/css?family=Merriweather:400,700' rel='stylesheet' type='text/css'> <link href='http://biomod-dresden-2012.googlecode.com/svn/trunk/css/superfish.css' rel='stylesheet' type='text/css'> <link rel="stylesheet" href="http://biomod-dresden-2012.googlecode.com/svn/trunk/css/lightbox.css" type="text/css" media="screen" /> <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.0/themes/base/jquery-ui.css" /> <script type"text/javascript"> // Main function that waits for the browser to be ready $(document).ready(function(){ //make css accesible, please change the alter_css to chnage the style var alter_css = $("#alter_css").html(); $("style").remove(); $('head').append('<link rel="stylesheet" href="/skins/monobook/shared.css?164" type="text/css" />'); $('head').append('<link rel="stylesheet" href="http://biomod-dresden-2012.googlecode.com/svn/trunk/nanos.css" type="text/css" />'); //additional divs $(".firstHeading").wrap('<div id="header"></div>'); $(".firstHeading").wrap('<div id="inner_header"></div>'); $(".firstHeading").wrap('<div id="title_con"></div>'); var nav = $("#nav").html(); $('#inner_header').append(nav); $('#inner_header').append('<div class="clear"></div>'); //clean up wiki framework $("#sidebar-main").remove(); $(".portlet").remove(); //fix breadcrumbs $('#contentSub').remove(); //fix heading var h1 = $(".firstHeading").text().split("/"); $(".firstHeading").text(h1[h1.length-1]); //start plugins for navigation $("ul.sf-menu").superfish({ delay: 800, // one second delay on mouseout animation: {opacity:'show',height:'show'}, // fade-in and slide-down animation speed: 'normal', // faster animation speed }); $('#main_saurs').localScroll(); $("tr:odd").addClass("odd");

}); </script>

<script type="text/javascript"> var _gaq = _gaq || []; _gaq.push(['_setAccount', 'UA-35720700-1']); _gaq.push(['_trackPageview']);

(function() { var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); })(); </script> <script type="text/javascript">var addthis_config = {"data_track_addressbar":false};</script> <script type="text/javascript" src="http://s7.addthis.com/js/300/addthis_widget.js#pubid=ra-508414b242f27ceb"></script> <script id="nav"> <div id="nav"> <ul id="nav" class="sf-menu"> <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs">home</a></li> <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Team">team</a></li> <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Project">project</a> <ul> <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Project">overview</a></li> <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Project/DNA origami">dna origami</a></li> <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Project/Vesicles">vesicles</a></li> <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Project/Aptamer_lock">aptamer lock</a></li> <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Project/Future_work">future work</a></li> </ul> </li> <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Lab_book">lab book</a> <ul> <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Lab_book#recipes">recipes</a></li> <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Lab_book#protocols">protocols</a></li> <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Lab_book#downloads">downloads</a></li> </ul> </li> <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Gallery">gallery</a></li> <li><a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Sponsors">sponsors</a></li> </ul> </div> </script>

</html> <html>

<script type="text/javascript" src="http://biomod-dresden-2012.googlecode.com/svn/trunk/js/jquery.tweet.js"></script> <!-- tweet import -->

<script type"text/javascript"> $(document).ready(function(){ window.scrollTo(0, 155); $(".tweet").tweet({ count: 6, query: "from:nanosaurs", loading_text: "searching twitter..." });

   });

</script>

<body>

<div id="main_saurs">

<h2>Welcome</h2> <p>We, the Dresden Nanosaurs from Germany, invite you to a ride through our quest to design a stunning nano-biomolecular system for the <a href="http://biomod.net/">BIOMOD</a> competition 2012. We propose a novel biological tethering system based on the technologies of DNA origami and vesicular transport. The illustration below describes the principle of our system. </p> <h2>Signal-driven tethering system</h2> <div class="big_img"><a rel="lightbox" href="http://openwetware.org/images/7/7b/BM12_nanosaurs_Comic_all.jpg"> <img src="http://openwetware.org/images/b/bd/BM12_nanosaurs_Comic_all_m.jpg"></a> <div id="mini_pics"> <a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Project/DNA%20origami"><img src="http://openwetware.org/images/d/dd/BM12_nanosaursOrigami.png"></a> <a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Project/DNA%20origami"><img src="http://openwetware.org/images/4/47/BM12_nanosaursReceiver-strands.png"></a> <a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Project/Aptamer_lock"><img src="http://openwetware.org/images/1/1c/BM12_nanosaursLock.png"></a> <a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Project/Aptamer_lock"><img src="http://openwetware.org/images/5/5b/BM12_nanosaursKey.png"></a> <a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Project/Vesicles"><img src="http://openwetware.org/images/e/e0/BM12_nanosaursCatcher-strands.png"></a> <a href="http://openwetware.org/wiki/Biomod/2012/TU_Dresden/Nanosaurs/Project/Vesicles"><img src="http://openwetware.org/images/d/d7/BM12_nanosaursGUV.png"></a> </div> </div>

<p> On a central giant vesicle, illustrated as a large yellow sphere, switchable DNA origami boxes are attached on its surface. In the presence of certain signal proteins, the closed DNA origami boxes get unlocked and open up. DNA single strands that were shielded before are now accessible. Therefore they can specifically hybridize with complementary strands on smaller vesicles. Hence multiple smaller vesicles can be specifically attracted to the central giant vesicle.<br/> To better understand the different components, you may click on the images below the panel. </p>

       <h2>Highlights</h2>
       <p>Below you can see some of our most appealing results: an image of the tethering of vesicles taken with LSM (Laser Scanning Microscopy) and an AFM (Atomic Force Microscopy) image of the correct folding of the open DNA origami structure.
       </p>

<div class="big_img"><a rel="lightbox" href="http://openwetware.org/images/0/02/BM12_nanosaurs_Main_Page_Result_Picture_Final.jpg"> <img src="http://openwetware.org/images/0/02/BM12_nanosaurs_Main_Page_Result_Picture_Final.jpg"></a> </div> </div> <div id="video"><iframe width="200" height="200" src="http://www.youtube.com/embed/HcMopZIc1Mg" frameborder="0" allowfullscreen></iframe></div> <div id="twitter"> <div id="follow"><a href="http://twitter.com/nanosaurs">follow us<img id="logo_twitter" src="http://openwetware.org/images/6/6b/BM12_nanosaurs_Twitter.png"></a></div> <div class="tweet"></div> </div> <div id="share"><div class="addthis_toolbox addthis_default_style"><a class="addthis_button_facebook"><img src="http://openwetware.org/images/a/a7/BM12_nanosaurs_Facebook.png"></a><a class="addthis_button_google_plusone_share"><img src="http://openwetware.org/images/c/c9/BM12_nanosaurs_Google.png"></a><a class="addthis_button_compact"><img src="http://openwetware.org/images/1/14/BM12_nanosaurs_Plus.png"></a></div></div> <div class="clear"></div> </body> </html>