Difference between revisions of "Team:Erlangen Nuremberg"

Revision as of 09:55, 28 June 2017

{

   border-sizing: border-box;
   /* makes boxes visible */
   /* border: 1px solid rgba(0,0,0,0.3); */

}

html, body {

   margin: 0;
   padding-bottom: 0 ;
   height: 100%;
   width: 100%;
   overflow: scroll;

}

/*removes underlines/color from links */ a {

   text-decoration: none;
   color: transparent;

}

/* Navbar Dropdown */ .sidebar-nav {

   padding: -9px 0;

}

.navbar {

   margin-top: 20px;
   background:

}

.nav li a {

   position:relative;
   display:block;
   border-radius: 0px 10px 10px 10px;

   background-color: rgba(110,14,26,1);
   text-transform: uppercase;
   letter-spacing: 1.5px;
   margin-left: 20px;
   border: 1px solid rgba(110,14,26,1);

}

.nav li a:hover {

   color: rgba(110,14,26,1);

} .nav li a {

   color:white;

}

.dropdown .dropdown-menu li a{

   color: white;

} .dropdown .dropdown-menu li a:hover{

   color: rgba(110,14,26,1);

}

.dropdown:hover .dropdown-menu {

   display: inline-block;

}

.dropdown .dropdown-menu {

   background-color: transparent;
   box-shadow: none;
   border:none;

}

.navbar-brand img {

   margin-top: -15px;
   height:50px;

}

.dropdown-menu li{

   margin-top: 5px;
   margin-right: 15px;

} /*navbar Ende */

/*team*/ .team-banner img{

   margin-top: 50px;
   width:100%;
   height:500px;

}

.background .team-banner img {

   margin-top: 100px;
   width:100%;

}

.teammembers1 img {

   width: 20%;
   margin-left: 5%;
   margin-top: 50px;
   margin-bottom:50px;
   float:left;

}

.teammembers1 p{

   margin-left: 40%;
   margin-right:20%;
   margin-top: 5%;
   color: gainsboro;

}

.teammembers2 img {

   width:20%;
   margin-right: 5%;
   margin-top: 50px;
   margin-bottom: 50px;
   float:right;

}

.teammembers2 p{

   margin-left: 20%;
   margin-right: 40%;
   margin-top: 5%;
   color: rgba(110,14,26,1);

}

.teammembers1 {

   margin-left:22%;
   margin-top: 30px;
   margin-bottom: 20px;
   margin-right: 30%;
   border-radius: 0px 10px 10px 10px;
   background-color: rgba(110,14,26,1) ;
   box-shadow: 10px 10px 26px 0px rgba(150,150,150,1);

}

.teammembers2{

   margin-left:30%;
   margin-top: 30px;
   margin-bottom: 20px;
   margin-right: 22%;
   border-radius: 10px 0px 10px 10px;
   background-color: gainsboro;
  box-shadow: -10px 10px 26px 0px rgba(150,150,150,1);

}

h2 {

   text-align: center;

}

.content {

   position: relative;
   top: 50px;
   width: 60%;
   border-radius: 10px 10px 10px 10px;
   margin: 0 auto;
   padding: 20px 20px;

}

.content img{

   float:left;

}

.background {

   height: 100%;
   width: 100%;

}

/* adds invisible element for right scrolling position */

.jumptarget:before {
   display: block;
   content: "";
   margin-top: -200px;
   height: 200px;
   visibility: hidden;

}

/* back to the top icon */ .backtop {

   position: fixed;

   left: 50%;

   margin-top: 90%;
   margin-bottom: 10%;

   z-index: 16;

   font-size: 50px;

   border: 2px solid rgba(110,14,26,1);
   border-radius: 50%;

   background-color:rgba(126,40,51,1);

   box-shadow:  4px 7px 40px -2px rgba(0,0,0,0.5);

}

.choose_timeline {

   position: relative;
   width: 60%;
   margin: 0 auto;
   margin-top: 10%;

}

erlangen_timeline a, #wuerzburg_timeline a {

   text-decoration: none;
   color: black;

}

erlangen_timeline {

   position: relative;
   float: left;

   background-color:rgba(126,40,51,1);

}

erlangen_timeline h2, #wuerzburg_timeline h2 {

   color: white;
   font-size: 1.8em;

}

erlangen_timeline, #wuerzburg_timeline {

   position: relative;

   background-color:rgba(126,40,51,1);
   color: white;

   display:inline-block;
   border-radius: 0px 10px 10px 10px;

   background-color: rgba(110,14,26,1);

   text-transform: uppercase;
   letter-spacing: 1.5px;

   margin-left: 20px;
   border: 1px solid rgba(110,14,26,1);

   box-shadow:  4px 7px 40px -2px rgba(0,0,0,0.5);

   padding: 0.1% 2%;

}

erlangen_timeline {

   float: left;

}

wuerzburg_timeline {

   float: right;

}

.backgroundimage {

       background-image: url("http://tracks.arte.tv/sites/default/files/styles/jscrop_1007x566/public/3028124-poster-p-dna.jpg?itok=i5F4fvCz");
       background-repeat: no-repeat;
       border: 1px solid rgba(0,0,0,0.3);
       position: relative;
       height: 70%;
       width: 100%;

}

.backgroundimage .content h2{

   position: relative;
   font-size: 70px;
   text-align: center;
   font-family: Verdana;
   color: black;

}

.project{

   height: 100%

} .project .content{

   font-family: Verdana;
   position: relative;
   top: 5%;
   left: 5%;
   right: 5%;
   bottom: 5%;

}

.project .content p{

   font-family: Verdana;
   font-size: 15px;

}

.project .content h2{

   font-size: 30px;

}

.bottom{

  position: absolute;
  bottom: 0;
   left: 0;
   right: 0;
   margin-top: 10px;
   padding-top: 50px;

}

.bottom .contactus{

   text-align: center;
   background: black;
   width: 100%;

}

.contactus p{

   color: white;
   font-family: Verdana;
   line-height: 300%
   vertical-align: middle;
   left: 100%;
   padding-top: 5px;
   padding-bottom: 0;

}

.bottom .sponsors{

   background: white;
   text-align-last: center;
   height: 5px;
   padding-bottom: 80px;

}

.bottom .sponsors p{

   text-align-last: center;
   padding-bottom: 50px;

}

.contactus .logos{

   padding-top: 0;

} iGEM Erlangen Würzburg

Projektname

Projekt

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

@@ Line 1: / Line 1: @@
+{{Team:Erlangen_Nuremberg/CSS}}
 <html>
@@ Line 61: / Line 62: @@
                  <ul class="nav navbar-nav navbar-right collapse navbar-collapse" data-hover="dropdown" data-animations="zoomIn">
-                     <li class="home active"><a href="https://2017.igem.org/Team:Erlangen_Nuremberg"S>Home</a></li>
+                     <li class="home active"><a href="/igemwebsite/html/home.html"S>Home</a></li>
                      <li class="dropdown"><a class="dropdown-toggle" data-toggle="dropdown" data-hover="dropdown" href="notebook.html">Notebook</a>
                          <ul class="dropdown-menu">
@@ Line 110: / Line 111: @@
              </div>
          </nav>
-        <div class="background" >
+       <div class="backgroundimage" >
-            <div class ="content">
+        <div class ="content">
-                <h2 class="jumptarget" id="home1">Development of Novel Biocompatible Tissue for the
+            <h2>Projektname</h2>
+        </div>
+    </div>
-Application as Artificial Muscles in Robotics and Medicine</h2>
+    <div class= "project">
-                <pre>The development of artificial muscles attracts wide interest for industrial and medical
+        <div class = "content">
+            <h2> Projekt </h2>
+            <p> Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
+             <i class="fa fa-twitter-square" style="font-size:24px"></i>
+        </div>
-applications. Regarding manufacturing, robotic devices with synthetic muscles are able to
+    </div>
+    <div class = "bottom" >
-handle softer materials more precisely. Moreover, artificial musculatures in medical
+    <div class = "sponsors">
+        <p>SPONSORS</p>
+        <img href ="http://www.armon.de/fileadmin/_migrated/pics/igzlogo.gif">
+    </div>
+    <div class="contactus">
+        <p>@ iGem Franconia</p>
+        <div class = "Logo">
+        <a target = _blank/.self href = "https://de-de.facebook.com/igemErlangen/">
+        <img src = "http://www.platformers-days.de/assets/default/images/facebook_icon.png" alt = "facebookLogo" width = "17px" height = "17px"> </a>
-prostheses can improve the wearing comfort while conveying a rather natural feeling.
+        <a target = _blank/.self href = https://twitter.com/igem_v?langen>
+        <img src="https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcTeThjb-3xDVDkqpeSclNCpSEAy8vce1GCj5OeswZvk8Q1_RQ9b" alt = "TwitterLogo" width = "17px" height = "17px"> </a>
-Currently, muscle-like contractions can be obtained by capacitor systems or by molecular
-machines incorporating tissue. This project aims to replace the common materials in both
-branches by biological tissue. While increasing ecological friendliness and the compatibility
-with human tissue, those fabricated compositions can compete with human biological
-material.
-Like a capacitor, the dielectric elastomer actuator (DEA) comprises two lightweight and
-flexible electrodes separated by an insulating elastomeric layer. In a first set of experiments,
-the elastomer layers in the capacitor-based muscle need to be replaced by appropriate protein
-structures. P-Pili with their excellent elastic properties and proteins with high amounts of
-helical secondary architecture are to be tested for this approach. In a next step, the currently
-used light weighted graphene or carbon nanotube layers need to be replaced by the Pili to
-provide conductivity and flexibility comparable to the carbon nanotubes. Both fibril types can
-be easily expressed in Geobacter sulflurreducens and Escherichia coli in a large scale, which
-makes the overall system extremely feasible since one organism can provide the whole
-material.
-Another tissue with muscle-like contractions will be fabricated through polymers with
-integrated molecular machines. Herein, the latter are based on azo dyes capable of having
-their entire network contracted by light irradiation. The biopolymer matrix is fabricated by
-Escherichia coli and consists of catcher-tag systems modified with a biotin-accepting anchor.
-The molecular machines attach to the biopolymer tissue via biotin and biotin acceptor
-interactions. Due to the crosslinking of the single protein strains the stiffness of the resulting
-tissue can be adjusted accurately.
-In both cases, the achieved tissues are cell-free and can immediately be adapted to the system.
-Within the scope of the project, the construction of a DEA-prototype is planned, since the
-realization of electrical stimuli is more feasible than through photo-induced signals.
-                </pre>
-            </div>
          </div>
-        <a class="jumptarget" href="home.html#home1">
+    </div>
-                <span class="backtop glyphicon glyphicon-menu-up" style="color:white"></span>
-        </a>
-        <div id="impressum">
+          </div>
-        </div>
      </body>
 </html>