Team:Heidelberg/testing/Project new

From 2014.igem.org

(Difference between revisions)
Line 14: Line 14:
background-repeat: no-repeat;
background-repeat: no-repeat;
background-size: 100% auto;
background-size: 100% auto;
 +
}
}
Line 35: Line 36:
/* Enlarge Icons on hover */
/* Enlarge Icons on hover */
.toolbox-icon:hover {
.toolbox-icon:hover {
-
  transform: scale(1.15);
+
transform: scale(1.15);
-
  -webkit-transform: scale(1.15);
+
-webkit-transform: scale(1.15);
-
  -moz-transform: scale(1.15);
+
-moz-transform: scale(1.15);
-
  -o-transform: scale(1.15);
+
-o-transform: scale(1.15);
-
  -ms-transform: scale(1.15);
+
-ms-transform: scale(1.15);
}
}
Line 73: Line 74:
.abstract-special img {
.abstract-special img {
height: 15px;
height: 15px;
-
}
 
-
 
-
.graphicalAbstract {
 
-
  background-image:url('/wiki/images/f/fa/Heidelberg_Project_Background.png');
 
-
  background-size: 100% auto;
 
-
  background-repeat: no-repeat;
 
-
  position:relative;
 
-
  z-index: 1;
 
-
}
 
-
 
-
#redOverlay {
 
-
  position:absolute;
 
-
  width:100%;
 
-
  height:100%;
 
-
  left:0;
 
-
  top:0;
 
-
  opacity:0;
 
-
  background-image:url('/wiki/images/5/51/Heidelberg_project_red_overlay.png');
 
-
  z-index:2;
 
}
}
Line 110: Line 92:
.block{
.block{
-
  display:block;
+
display:block;
-
  text-decoration:none;
+
text-decoration:none;
-
  color: white;
+
color: white;
}
}
.block:hover{
.block:hover{
-
  text-decoration: none;
+
text-decoration: none;
}
}
.box {
.box {
-
  background-color: rgba(81,81,81,0.7);
+
background-color: rgba(81,81,81,0.7);
-
  padding: 15px;
+
padding: 15px;
-
  position:relative;
+
position:relative;
}
}
.box:hover {
.box:hover {
-
  border:solid 2px #DE4230;
+
border:solid 2px #DE4230;
-
  padding: 13px;
+
padding: 13px;
}
}
Line 149: Line 131:
.descr-box span {
.descr-box span {
-
  margin-left: 40px;
+
margin-left: 40px;
-
  display: block;
+
display: block;
}
}
Line 182: Line 164:
}
}
</style>
</style>
-
  <div id="myContainer" class="container">
+
<div id="myContainer" class="container">
</html>
</html>
-
    {{:Team:Heidelberg/Templates/BootstrapNav|
+
{{:Team:Heidelberg/Templates/BootstrapNav|
-
      red=|
+
red=|
-
      white=true|
+
white=true|
-
      red-logo=true|
+
red-logo=true|
-
      white-logo=|
+
white-logo=|
-
      header-bg=|
+
header-bg=|
-
      header-img=|
+
header-img=|
-
      title=
+
title=
-
    }}
+
}}
-
    <html>
+
<html>
-
    <div class="container" style="color: white;">
+
<div class="container main" style="color: white;">
-
      <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 id="dropdownImg" 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>
-
        <div id="abstract-content" class="col-lg-12" >
+
<div id="abstract-content" class="col-lg-12" >
-
          Placeholder
+
Placeholder
-
        </div>
+
</div>
-
      </div>
+
</div>
-
    </div>
+
<div class="row">
-
    <div class="container grapicalAbstract">
+
<div class="ringbox">
-
    <div id="redOverlay"></div>
+
<img src="/wiki/images/d/dc/Ring_Project.png" id="ring-background" />
-
      <div style="z-index:3">
+
<div id="circ-box" class="descr-box">
-
        <div class="ringbox">
+
<a href="/Team:Heidelberg/Toolbox/Circularization">
-
          <img src="/wiki/images/d/dc/Ring_Project.png" id="ring-background" />
+
<img src="/wiki/images/5/58/Heidelberg_Toolbox_Circularization.png" id="circ-icon" class="toolbox-icon"/>
-
          <div id="circ-box" class="descr-box">
+
</a>
-
            <a href="/Team:Heidelberg/Toolbox/Circularization">
+
<div><h3>CIRCULARIZATION</h3></div>
-
              <img src="/wiki/images/5/58/Heidelberg_Toolbox_Circularization.png" id="circ-icon" class="toolbox-icon"/>
+
<span>Create a linker with our crowd computing <a href="/Team:Heidelberg/Software/Linker-Software">software</a> and make your protein heat stable</span>
-
            </a>
+
</div>
-
            <div><h3>CIRCULARIZATION</h3></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>
-
            <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>
+
<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 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>
+
<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="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 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>
-
          <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 style="width:390px; float:left;">
-
          <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>
+
<span style="text-align: right; display:block; font-size: 2.5em;">
-
        </div>
+
<span class="grey-text">Modify</span> your protein<br />
-
        <div style="width:390px; float:left;">
+
<span class="grey-text">post-</span>translationally<br />
-
          <span style="text-align: right; display:block; font-size: 2.5em;">
+
<span class="grey-text">easy</span> and <span class="grey-text">standardized</span>
-
            <span class="grey-text">Modify</span> your protein<br />
+
<br /><br />
-
            <span class="grey-text">post-</span>translationally<br />
+
WITH THE POWER<br />
-
            <span class="grey-text">easy</span> and <span class="grey-text">standardized</span>
+
of <span class="red-text">INTEIN SPLICING</span>
-
            <br /><br />
+
<br /><br />
-
            WITH THE POWER<br />
+
</span>
-
            of <span class="red-text">INTEIN SPLICING</span>
+
<a href="#" class="block box">
-
            <br /><br />
+
<img style="position:absolute;height:330px; right: 15px;top: -35px;" src="/wiki/images/a/a6/Heidelberg_Project_Dnmt1.png" />
-
          </span>
+
<span style="width:40%;" class="block">
-
          <a href="#" class="block box">
+
<span style="font-size:1.5em;">
-
            <img style="position:absolute;height:330px; right: 15px;top: -35px;" src="/wiki/images/a/a6/Heidelberg_Project_Dnmt1.png" />
+
<span class="red-text">Heat-stable</span>  circular <span style="font-weight:bold;">DNMT&nbsp;I</span>
-
            <span style="width:40%;" class="block">
+
</span><br />
-
              <span style="font-size:1.5em;">
+
<span style="font-size:2.5em; text-align:right;">
-
                <span class="red-text">Heat-stable</span>  circular <span style="font-weight:bold;">DNMT&nbsp;I</span>
+
<span class="red-text">PCR</span><br />
-
              </span><br />
+
2.0
-
              <span style="font-size:2.5em; text-align:right;">
+
</span>
-
                <span class="red-text">PCR</span><br />
+
</span>
-
                2.0
+
</a>
-
              </span>
+
</div>
-
            </span>
+
</div>
-
          </a>
+
<div class="row" style="margin-top:60px;">
-
        </div>
+
<a href="#" class="col-lg-4 block grey-text" style="font-size:2em; text-align:right; position:relative; top: -50px;">
-
      <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 />
taking it to<br />
the next level:<br />
the next level:<br />
Inducable <br />
Inducable <br />
via <span class="red-text">light induction</span>
via <span class="red-text">light induction</span>
-
          </a>
+
</a>
-
          <a href="#" class="col-lg-7 col-lg-offset-1 block box">
+
<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" />
+
<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-8 col-lg-offset-4 block">
-
              <span class="col-lg-6" style="font-size:1.5em; display: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 class="red-text">Heat-stable</span>  circular <br /><span style="font-weight:bold;">Xylanase</span>
-
              </span>
+
</span>
-
              <span class="col-lg-6 block" style="font-size:2.5em; text-align:right;">
+
<span class="col-lg-6 block" style="font-size:2.5em; text-align:right;">
-
                <span class="red-text">PCR</span><br />
+
<span class="red-text">PCR</span><br />
-
                2.0
+
2.0
-
              </span>
+
</span>
-
            </span>
+
</span>
-
            <span class="clearfix block"></span>
+
<span class="clearfix block"></span>
-
          </a>
+
</a>
-
      </div>
+
</div>
-
      </div><!-- z-index wrapper -->
+
</div>
-
    </div>
+
</div>
</div>
<script type="text/javascript">
<script type="text/javascript">

Revision as of 21:19, 11 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_new"