Team:Heidelberg/testing/Project

From 2014.igem.org

(Difference between revisions)
 
(52 intermediate revisions not shown)
Line 59: Line 59:
*/
*/
position: relative;
position: relative;
 +
float: left;
}
}
Line 79: Line 80:
position: absolute;
position: absolute;
top:-45px;
top:-45px;
-
left:-35px;
+
left:-33px;
}
}
Line 90: Line 91:
}
}
-
.descr-box {
+
.block{
-
width: 250px;
+
display:block;
-
height: 100px;
+
text-decoration:none;
-
position: absolute;
+
color: white;
}
}
-
.descr-box h3 {
+
.block:hover{
-
margin-top: 10px;
+
text-decoration: none;
-
margin-bottom: 0;
+
-
text-align: right;
+
}
}
-
.descr-box div {
+
.box {
-
border-left: solid white 2px;
+
background-color: rgba(81,81,81,0.7);
-
border-bottom: solid white 2px;
+
padding: 15px;
 +
position:relative;
}
}
-
.descr-box span {
+
.box:hover {
-
margin-left: 40px;
+
border:solid 2px #DE4230;
-
display: block;
+
padding: 13px;
}
}
-
#circ-box {
 
-
right: 0;
 
-
top: 80px;
 
-
}
 
-
 
-
#oligo-box {
 
-
right: 25px;
 
-
top: 200px;
 
-
}
 
-
 
-
#fusion-box {
 
-
right: 85px;
 
-
top: 300px;
 
-
}
 
-
 
-
#onoff-box {
 
-
right: 180px;
 
-
top: 390px;
 
-
}
 
-
 
-
#purification-box {
 
-
left: 190px;
 
-
top: 465px;
 
-
}
 
-
 
-
</style>
 
-
<div id="myContainer" class="container">
 
-
</html>
 
-
{{:Team:Heidelberg/Templates/BootstrapNav|
 
-
red=|
 
-
white=true|
 
-
red-logo=true|
 
-
white-logo=|
 
-
header-bg=|
 
-
header-img=|
 
-
title=
 
-
}}
 
-
<html>
 
-
<div class="container main" style="color: white;">
 
-
<div id="abstract-dropdown" class="row abstract-special dark-grey">
 
-
<div class="col-lg-offset-1 col-lg-2">
 
-
<h4><img src="/wiki/images/7/70/Heidelberg_Abstract-dropdown.png"/>&nbsp;Abstract</h4>
 
-
</div>
 
-
<div class="col-lg-9">
 
-
<span>Click to read full abstract</span>
 
-
</div>
 
-
</div>
 
-
<div class="row">
 
-
<div class="ringbox">
 
-
<img src="/wiki/images/d/dc/Ring_Project.png" id="ring-background" />
 
-
<div id="circ-box" class="descr-box"><img src="/wiki/images/5/58/Heidelberg_Toolbox_Circularization.png" id="circ-icon" class="toolbox-icon"/><div><h3>CIRCULARIZATION</h3></div><span>Create a linker with our crowd computing <a href="/Team:Heidelberg/Software/Linker-Software">software</a> and make your protein heat stable</span></div>
 
-
<div id="oligo-box" class="descr-box"><img src="/wiki/images/4/40/Oligomerization.png" id="oligo-icon" class="toolbox-icon"/><div><h3>OLIGOMERIZATION</h3></div><span>Fuse multiple Proteins or Domains using Inteins</span></div>
 
-
<div id="fusion-box" class="descr-box"><img src="/wiki/images/8/87/Heidelberg_Toolbox_Fusion.png" id="fusion-icon" class="toolbox-icon"/><div><h3>FUSION</h3></div><span>Fuse two Proteins or Domains together using Inteins</span></div>
 
-
<div id="onoff-box" class="descr-box"><img src="/wiki/images/c/c2/Heidelberg_Toolbox_On-Off.png" id="onoff-icon" class="toolbox-icon"/><div><h3>ON/OFF</h3></div><span>Activate or deactivate Proteins using Inteins</span></div>
 
-
<div id="purification-box" class="descr-box"><img src="/wiki/images/0/04/Heidelberg_Toolbox_Purification.png" id="purification-icon" class="toolbox-icon"/><div><h3>PURIFICATION</h3></div><span></span></div>
 
-
</div>
 
-
</div>
 
-
 
-
 
-
</div>
 
-
</div>
 
-
</html>
 
-
{{:Team:Heidelberg/Templates/MainTemplate}}
 
-
{{:Team:Heidelberg/Templates/IncludeCSS|:Team:Heidelberg/css/bootstrapcss}}
 
-
{{:Team:Heidelberg/Templates/IncludeCSS|:Team:Heidelberg/css/bootstraptheme}}
 
-
{{:Team:Heidelberg/Templates/IncludeCSS|:Team:Heidelberg/css/overrides}}
 
-
{{:Team:Heidelberg/Templates/IncludeJS|:Team:Heidelberg/js/jquery}}
 
-
{{:Team:Heidelberg/Templates/IncludeJS|:Team:Heidelberg/js/bootstrapjs}}
 
-
{{:Team:Heidelberg/Templates/IncludeJS|:Team:Heidelberg/js/wikipage}}
 
-
<html>
 
-
<style type="text/css">
 
-
#myContainer {
 
-
padding:0;
 
-
background-color: black;
 
-
background-image: url(/wiki/images/6/6a/Heidelberg_epic_background.jpg);
 
-
background-repeat: no-repeat;
 
-
background-size: 100% auto;
 
-
 
-
}
 
-
 
-
#light:hover {
 
-
color: #FF7E25;
 
-
}
 
-
 
-
.main {
 
-
margin-top: 25px;
 
-
}
 
-
 
-
.middle {
 
-
font-size: 3em;
 
-
}
 
-
 
-
.large {
 
-
font-size: 5em;
 
-
font-weight: bold;
 
-
}
 
-
 
-
/* Enlarge Icons on hover */
 
-
.toolbox-icon:hover {
 
-
transform: scale(1.15);
 
-
-webkit-transform: scale(1.15);
 
-
-moz-transform: scale(1.15);
 
-
-o-transform: scale(1.15);
 
-
-ms-transform: scale(1.15);
 
-
}
 
-
 
-
.toolbox-icon {
 
-
transition:transform 0.15s ease;
 
-
-webkit-transition:-webkit-transform 0.15s ease;
 
-
-moz-transition:-moz-transform 0.15s ease;
 
-
-o-transition:-o-transform 0.15s ease;
 
-
}
 
-
 
-
.ringbox{
 
-
width: 750px;
 
-
height: 600px;
 
-
/*
 
-
background-image:url('/wiki/images/d/dc/Ring_Project.png');
 
-
background-size: 550px;
 
-
background-repeat: no-repeat;
 
-
*/
 
-
position: relative;
 
-
}
 
-
 
-
.abstract-special {
 
-
color: white;
 
-
}
 
-
 
-
.abstract-special span {
 
-
margin-top: 10px;
 
-
margin-bottom: 10px;
 
-
display: block;
 
-
}
 
-
 
-
.abstract-special img {
 
-
height: 15px;
 
-
}
 
-
 
-
.toolbox-icon {
 
-
height: 70px;
 
-
position: absolute;
 
-
top:-45px;
 
-
left:-33px;
 
-
}
 
-
 
-
#ring-background {
 
-
position:absolute;
 
-
top:0;
 
-
left:0;
 
-
width: 450px;
 
-
height: auto;
 
-
}
 
.descr-box {
.descr-box {
Line 312: Line 160:
}
}
 +
#abstract-content {
 +
display:none;
 +
}
</style>
</style>
<div id="myContainer" class="container">
<div id="myContainer" class="container">
Line 328: Line 179:
<div id="abstract-dropdown" class="row abstract-special dark-grey">
<div id="abstract-dropdown" class="row abstract-special dark-grey">
<div class="col-lg-offset-1 col-lg-2">
<div class="col-lg-offset-1 col-lg-2">
-
<h4><img src="/wiki/images/7/70/Heidelberg_Abstract-dropdown.png"/>&nbsp;Abstract</h4>
+
<h4><img id="dropdownImg" src="/wiki/images/7/70/Heidelberg_Abstract-dropdown.png"/>&nbsp;Abstract</h4>
</div>
</div>
<div class="col-lg-9">
<div class="col-lg-9">
<span>Click to read full abstract</span>
<span>Click to read full abstract</span>
 +
</div>
 +
<div id="abstract-content" class="col-lg-12" >
 +
Placeholder
</div>
</div>
</div>
</div>
Line 337: Line 191:
<div class="ringbox">
<div class="ringbox">
<img src="/wiki/images/d/dc/Ring_Project.png" id="ring-background" />
<img src="/wiki/images/d/dc/Ring_Project.png" id="ring-background" />
-
<div id="circ-box" class="descr-box"><img src="/wiki/images/5/58/Heidelberg_Toolbox_Circularization.png" id="circ-icon" class="toolbox-icon"/><div><h3>CIRCULARIZATION</h3></div><span>Create a linker with our crowd computing <a href="/Team:Heidelberg/Software/Linker-Software">software</a> and make your protein heat stable</span></div>
+
<div id="circ-box" class="descr-box">
-
<div id="oligo-box" class="descr-box"><img src="/wiki/images/4/40/Oligomerization.png" id="oligo-icon" class="toolbox-icon"/><div><h3>OLIGOMERIZATION</h3></div><span>Fuse multiple Proteins or Domains using Inteins</span></div>
+
<a href="/Team:Heidelberg/Toolbox/Circularization">
-
<div id="fusion-box" class="descr-box"><img src="/wiki/images/8/87/Heidelberg_Toolbox_Fusion.png" id="fusion-icon" class="toolbox-icon"/><div><h3>FUSION</h3></div><span>Fuse two Proteins or Domains together using Inteins</span></div>
+
<img src="/wiki/images/5/58/Heidelberg_Toolbox_Circularization.png" id="circ-icon" class="toolbox-icon"/>
-
<div id="onoff-box" class="descr-box"><img src="/wiki/images/c/c2/Heidelberg_Toolbox_On-Off.png" id="onoff-icon" class="toolbox-icon"/><div><h3>ON/OFF</h3></div><span>Activate or deactivate Proteins using Inteins</span></div>
+
</a>
-
<div id="purification-box" class="descr-box"><img src="/wiki/images/0/04/Heidelberg_Toolbox_Purification.png" id="purification-icon" class="toolbox-icon"/><div><h3>PURIFICATION</h3></div><span></span></div>
+
<div><h3>CIRCULARIZATION</h3></div>
 +
<span>Create a linker with our crowd computing <a href="/Team:Heidelberg/Software/Linker-Software">software</a> and make your protein heat stable</span>
 +
</div>
 +
<div id="oligo-box" class="descr-box"><a href="/Team:Heidelberg/Toolbox/Oligomerization"><img src="/wiki/images/4/40/Oligomerization.png" id="oligo-icon" class="toolbox-icon"/></a><div><h3>OLIGOMERIZATION</h3></div><span>Fuse multiple Proteins or Domains using Inteins</span>
 +
</div>
 +
<div id="fusion-box" class="descr-box"><a href="/Team:Heidelberg/Toolbox/Fusion"><img src="/wiki/images/8/87/Heidelberg_Toolbox_Fusion.png" id="fusion-icon" class="toolbox-icon"/></a><div><h3>FUSION</h3></div><span>Fuse two Proteins or Domains together using Inteins</span>
 +
</div>
 +
<div id="onoff-box" class="descr-box"><a href="/Team:Heidelberg/Toolbox/OnOff"><img src="/wiki/images/c/c2/Heidelberg_Toolbox_On-Off.png" id="onoff-icon" class="toolbox-icon"/></a><div><h3>ON/OFF</h3></div><span>Activate or deactivate Proteins using Inteins</span></div>
 +
<div id="purification-box" class="descr-box"><a href="/Team:Heidelberg/Toolbox/Purification"><img src="/wiki/images/0/04/Heidelberg_Toolbox_Purification.png" id="purification-icon" class="toolbox-icon"/></a><div><h3>PURIFICATION</h3></div><span></span></div>
 +
</div>
 +
<div style="width:390px; float:left;">
 +
<span style="text-align: right; display:block; font-size: 2.5em;">
 +
<span class="grey-text">Modify</span> your protein<br />
 +
<span class="grey-text">post-</span>translationally<br />
 +
<span class="grey-text">easy</span> and <span class="grey-text">standardized</span>
 +
<br /><br />
 +
WITH THE POWER<br />
 +
of <span class="red-text">INTEIN SPLICING</span>
 +
<br /><br />
 +
</span>
 +
<a href="#" class="block box">
 +
<img style="position:absolute;height:330px; right: 15px;top: -35px;" src="/wiki/images/a/a6/Heidelberg_Project_Dnmt1.png" />
 +
<span style="width:40%;" class="block">
 +
<span style="font-size:1.5em;">
 +
<span class="red-text">Heat-stable</span>  circular <span style="font-weight:bold;">DNMT&nbsp;I</span>
 +
</span><br />
 +
<span style="font-size:2.5em; text-align:right;">
 +
<span class="red-text">PCR</span><br />
 +
2.0
 +
</span>
 +
</span>
 +
</a>
</div>
</div>
</div>
</div>
-
 
+
<div class="row" style="margin-top:60px;">
-
+
<a href="#" class="col-lg-4 block grey-text" style="font-size:2em; text-align:right; position:relative; top: -50px;">
 +
taking it to<br />
 +
the next level:<br />
 +
Inducable <br />
 +
via <span class="red-text">light induction</span>
 +
</a>
 +
<a href="#" class="col-lg-7 col-lg-offset-1 block box">
 +
<img style="position:absolute;height: 165px; left: 15px;top: -50px;" src="/wiki/images/8/82/Heidelberg_Project_Xylanase.png" />
 +
<span class="col-lg-8 col-lg-offset-4 block">
 +
<span class="col-lg-6" style="font-size:1.5em; display:block;">
 +
<span class="red-text">Heat-stable</span>  circular <br /><span style="font-weight:bold;">Xylanase</span>
 +
</span>
 +
<span class="col-lg-6 block" style="font-size:2.5em; text-align:right;">
 +
<span class="red-text">PCR</span><br />
 +
2.0
 +
</span>
 +
</span>
 +
<span class="clearfix block"></span>
 +
</a>
 +
</div>
</div>
</div>
</div>
</div>
 +
<script type="text/javascript">
 +
$(document).ready(function(){
 +
if(window.location.hash) {
 +
  var hash = window.location.hash.substring(1); //Puts hash in variable, and removes the # character
 +
  if(hash == "Abstract")
 +
      $('#abstract-content').slideDown(400, function() {$('#dropdownImg').attr("src", "/wiki/images/f/f2/Heidelberg-Abstract-dropup.png");});
 +
}
 +
$('#abstract-dropdown').click(function() {
 +
if($('#abstract-content').css("display") == 'none'){
 +
$('#abstract-content').slideDown(400, function() {$('#dropdownImg').attr("src", "/wiki/images/f/f2/Heidelberg-Abstract-dropup.png");});
 +
}
 +
else{
 +
$('#abstract-content').slideUp(400, function() {$('#dropdownImg').attr("src", "/wiki/images/7/70/Heidelberg_Abstract-dropdown.png");});
 +
}
 +
});
 +
 +
});
 +
</script>
</html>
</html>

Latest revision as of 21:12, 9 October 2014

 Abstract

Click to read full abstract
Placeholder

CIRCULARIZATION

Create a linker with our crowd computing software and make your protein heat stable

OLIGOMERIZATION

Fuse multiple Proteins or Domains using Inteins

FUSION

Fuse two Proteins or Domains together using Inteins

ON/OFF

Activate or deactivate Proteins using Inteins

PURIFICATION

Modify your protein
post-translationally
easy and standardized

WITH THE POWER
of INTEIN SPLICING

Heat-stable circular DNMT I
PCR
2.0
taking it to
the next level:
Inducable
via light induction Heat-stable circular
Xylanase PCR
2.0

Retrieved from "http://2014.igem.org/Team:Heidelberg/testing/Project"