Difference between revisions of "Team:Elan Vital Korea/Design"

 
Line 1: Line 1:
{{Elan_Vital_Korea/Templates/Header}}
+
{{ElanVitalKoreaMWlook}}
 +
{{ElanVitalKorea}}
 +
 
 
<html>
 
<html>
 +
 +
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
 +
<script>
 +
$(document).ready(function(){
 +
    // Cache the Window object
 +
    $window = $(window);
 +
               
 +
  $('section[data-type="background"]').each(function(){
 +
    var $bgobj = $(this); // assigning the object
 +
                   
 +
      $(window).scroll(function() {
 +
                   
 +
        // Scroll the background at var speed
 +
        // the yPos is a negative value because we're scrolling it UP!                               
 +
        var yPos = -($window.scrollTop() / $bgobj.data('speed'));
 +
       
 +
        // Put together our final background position
 +
        var coords = '50% '+ yPos + 'px';
 +
 +
        // Move the background
 +
        $bgobj.css({ backgroundPosition: coords });
 +
       
 +
}); // window scroll Ends
 +
 +
});   
 +
 +
});
 +
/*
 +
* Create HTML5 elements for IE's sake
 +
*/
 +
 +
document.createElement("article");
 +
document.createElement("section");
 +
</script>
 +
<style>
 +
 +
@import url(http://fonts.googleapis.com/css?family=Open+Sans);
 +
 +
body{
 +
    margin:0;
 +
    padding:0;
 +
font-family: 'Open Sans', sans-serif;
 +
background-color:      #F8F8F8;
 +
}
 +
 +
 +
#home {
 +
    background: url(https://static.igem.org/mediawiki/2015/8/87/ElanVitalKorea_bg_3.png) 50% 0 no-repeat fixed;
 +
min-height:1000px;
 +
    height: 1000px; 
 +
    margin: 0 auto;
 +
    width: 100%;
 +
    max-width: 1920px;
 +
    position: relative;
 +
    box-shadow: 0 0 50px rgba(0,0,0,0.8);
 +
}
 +
#about {
 +
    background: url(https://static.igem.org/mediawiki/2015/8/86/Blackbg.png) 50% 0 no-repeat fixed;
 +
    min-height:1000px;
 +
height: 1000px;
 +
    margin: 0 auto;
 +
    width: 100%;
 +
    max-width: 1920px;
 +
    position: relative;
 +
    box-shadow: 0 0 50px rgba(0,0,0,0.8);
 +
}
 +
#maintext {
 +
    background: url(https://static.igem.org/mediawiki/2015/9/9c/Lightbg_copy.jpg) 50% 0 no-repeat fixed;
 +
    height: 1000px;
 +
min-height:1000px;
 +
    margin: 0 auto;
 +
    width: 100%;
 +
    max-width: 1920px;
 +
    position: relative;
 +
    box-shadow: 0 0 50px rgba(0,0,0,0.8);
 +
}
 +
 +
#maintext2 {
 +
    background: url(https://static.igem.org/mediawiki/2015/8/86/Blackbg.png) 50% 0 no-repeat fixed;
 +
    height: 1000px;
 +
min-height:1000px;
 +
    margin: 0 auto;
 +
    width: 100%;
 +
    max-width: 1920px;
 +
    position: relative;
 +
    box-shadow: 0 0 50px rgba(0,0,0,0.8);
 +
}
 +
 +
 +
 +
 +
 +
/* Introduction */
 +
 +
#home article { background: url("#") no-repeat scroll center top transparent; height: 458px; position: absolute; text-indent: -9999px; top: 291px; width: 100%; }
 +
 +
#about article { background: url("#") no-repeat scroll center top transparent; height: 458px; position: absolute; text-indent: -9999px; top: 291px; width: 100%; }
 +
 +
#maintext article { background: url("#") no-repeat scroll center top transparent; height: 458px; position: absolute; text-indent: -9999px; top: 291px; width: 100%; }
 +
 +
 +
#maintext2 article { background: url("#") no-repeat scroll center top transparent; height: 458px; position: absolute; text-indent: -9999px; top: 291px; width: 100%; }
 +
 +
 +
.galleryItem {
 +
    color: #797478;
 +
    font: 10px/1.5 Verdana, Helvetica, sans-serif;
 +
    float: left;   
 +
    width: 16%;
 +
    margin:  2% 2% 50px 2%;
 +
}
 +
 +
.galleryItem h2 {
 +
    text-transform: uppercase;
 +
}
 +
 +
.galleryItem img {
 +
    max-width: 100%;
 +
    -webkit-border-radius: 5px;
 +
    -moz-border-radius: 5px;
 +
    border-radius: 5px;
 +
}
 +
 +
 +
 +
.center {
 +
  position: absolute;
 +
  margin: auto;
 +
  top: 0;
 +
  right: 0;
 +
  bottom: 0;
 +
  left: 0;
 +
  width: 100px;
 +
  height: 100px;
 +
  border-radius: 3px;
 +
}
 +
 +
IMG.displayed {
 +
    display: block;
 +
    margin-left: auto;
 +
    margin-right: auto; }
 +
 +
IMG.igem {
 +
float:right;
 +
width:5%;
 +
margin:20px;
 +
}
 +
 +
h4 {
 +
color:white;
 +
font-size: 24px;
 +
letter-spacing:1px;
 +
line-height:25px;
 +
}
 +
 +
h5{
 +
text-decoration:none;
 +
font-size: 24px;
 +
letter-spacing:1px;
 +
line-height:25px;
 +
color:white;
 +
}
 +
 +
 +
p {
 +
font-size:18px;
 +
line-height:160%;
 +
}
 +
 +
h6{
 +
text-decoration:none;
 +
font-size: 12px;
 +
letter-spacing:1px;
 +
}
 +
 +
 +
/**
 +
* Media queries for responsive design.
 +
*
 +
* These follow after primary styles so they will successfully override.
 +
*/
 +
 +
@media all and (orientation:portrait) {
 +
  /* Style adjustments for portrait mode goes here */
 +
 +
}
 +
 +
@media all and (orientation:landscape) {
 +
  /* Style adjustments for landscape mode goes here */
 +
 +
}
 +
 +
/* Grade-A Mobile Browsers (Opera Mobile, Mobile Safari, Android Chrome)
 +
  consider this: www.cloudfour.com/css-media-query-for-mobile-is-fools-gold/ */
 +
@media screen and (max-device-width: 480px) {
 +
 +
 +
  /* Uncomment if you don't want iOS and WinMobile to mobile-optimize the text for you: j.mp/textsizeadjust */
 +
  /* html { -webkit-text-size-adjust:none; -ms-text-size-adjust:none; } */
 +
}
 +
 +
 +
 +
</style>
 +
 +
</head>
 +
 
<body>
 
<body>
<!--****************WETLAB***********-->  
+
    <!-- Section #1 -->
<div class="subnav" style="padding-left:70px;">
+
        <section id="home" data-speed="10" data-type="background">
    <ul>
+
            <a name="top" id="top"></a>
        <a href="https://2015.igem.org/Team:Elan_Vital_Korea/Description"><li>Description</li></a>
+
            <a href="#">
<a href="https://2015.igem.org/Team:Elan_Vital_Korea/Parts"><li>Parts</li></a>
+
                <img class="igem" src="https://static.igem.org/mediawiki/2015/7/70/IGEM_Logo.gif">
             <a href="https://2015.igem.org/Team:Elan_Vital_Korea/Results"><li>Results</li></a>
+
            </a>
<a href="https://2015.igem.org/Team:Elan_Vital_Korea/Design"><li style="color:#5ab9cc;
+
                        <br><br><br><br><br><br><br>
">Design</li></a>
+
                    <div class="center;">
        </ul>
+
             <a href="https://2015.igem.org/Team:Elan_Vital_Korea">
    </div>
+
                <img class="displayed" src="https://static.igem.org/mediawiki/2015/d/d5/ElanVital_Logo.png">
<div class="sub-top"><p class="sub-top-title3 mar-c">Design</p></div>
+
            </a>
<!--****************safety***********-->  
+
                <h4 style="text-align:center;">
<div id="PARTS"></div>
+
                    PROJECT <br> -Design-
<div style="position:inherit; width:1100px; margin:0 auto;">
+
                </h4>
    <div class="PARTS"><p class="align-l f-size30">BBa_K1584017<span style="margin-left:160px;">&amp;</span><span style="margin-left:130px;">BBa K1584026</span> </p></div>
+
                    <a href="#myAnchor" rel="" id="anchor1" class="anchorLink"><img class="displayed" src="https://static.igem.org/mediawiki/2015/d/d2/Scroll_arrow.png"></a>
    <div class="part_sub"><p class="align-l ml10">LuxR controlled by constitutive promoter<span style="margin-left:130px;">Constitutive LuxR with AHL-inducible GFP</span></p></div>
+
          </div>
    <div class="humanwrap">
+
    </section>
        <ul>
+
 
            <li><img src="https://static.igem.org/mediawiki/2015/1/15/NC_partimg_01.jpg" /></li>
+
 
            </ul>
+
 
             <p class="link" style="position:absolute; margin:-345px 0 0 200px;"><a href="http://parts.igem.org/wiki/index.php/Part:BBa_K1584017">http://BBa_K1584017<span class="f-size12 txt-i"> (click!)</p></a></p>
+
 
            <p class="link" style="text-align:center; margin-left:180px;"><a href="http://parts.igem.org/wiki/index.php/Part:BBa_K1584026">http://BBa_K1584026<span class="f-size12 txt-i"> (click!)</p></a></p>
+
 
        </div>
+
 
        <div class="partsLine"></div>
+
<br>
        <div class="PARTS"><p class="align-l f-size30">BBa_K1584008</p></div>
+
<br>
    <div class="part_sub"><p class="align-l ml10">AiiA controlled by constitutive promoter</p></div>
+
<br>
    <div class="humanwrap">
+
<br>
        <ul>
+
            <h5 style="text-align:center;">
            <li><img src="https://static.igem.org/mediawiki/2015/2/21/NC_partimg_03.jpg" /></li>
+
                <a name="myAnchor" id="myAnchor"></a>
            </ul>
+
                    <font color="black">BBa_K1584017 & BBa K1584026</font>
             <p class="link" style="text-align:center; margin-left:180px;"><a href="http://parts.igem.org/wiki/index.php/Part:BBa_K1584008">http://BBa_K1584008<span class="f-size12 txt-i"> (click!)</p></a></p>
+
            </h5>
        </div>
+
                        <br>
        <div class="partsLine"></div>
+
<P style="text-align:center;">
        <div class="PARTS"><p class="align-l f-size30">BBa_K1584035</p></div>
+
<font color:black>
    <div class="part_sub"><p class="align-l ml10">Constitutive LuxR plus AHL-inducible LacZ </p></div>
+
LuxR controlled by constitutive promoterAHL-required LuxR-Producing Reporter part
    <div class="humanwrap">
+
</font>
        <ul>
+
</p>
            <li><img src="https://static.igem.org/mediawiki/2015/7/78/NC_partimg_04.jpg" /></li>
+
<br><br>       
            </ul>
+
<img class="displayed" src="https://static.igem.org/mediawiki/2015/1/15/NC_partimg_01.jpg">
            <p class="link" style="position:absolute; margin:-375px 0 0 700px;"><a href="http://parts.igem.org/wiki/index.php/Part:BBa_K1584036">http://BBa_K1584036<span class="f-size12 txt-i"> (click!)</p></a></p>
+
<br><br>
            <p class="link" style="text-align:center; margin-left:160px;"><a href="http://parts.igem.org/wiki/index.php/Part:BBa_K1584035">http://BBa_K1584035<span class="f-size12 txt-i"> (click!)</p></a></p>
+
 
        </div>              
+
 
     </div>
+
 
 +
 
 +
 
 +
             <h5 style="text-align:center;">
 +
                <a name="myAnchor" id="myAnchor"></a>
 +
                    <font color="black">BBa_K1584008</font>
 +
            </h5>
 +
                        <br>
 +
<P style="text-align:center;">
 +
<font color:black>
 +
AiiA controlled by constitutive promoter
 +
</font>
 +
</p>
 +
<br><br>              
 +
<img class="displayed" src="https://static.igem.org/mediawiki/2015/2/21/NC_partimg_03.jpg">
 +
<br><br>
 +
 
 +
 
 +
 
 +
 
 +
             <h5 style="text-align:center;">
 +
                <a name="myAnchor" id="myAnchor"></a>
 +
                    <font color="black">BBa_K1584035</font>
 +
            </h5>
 +
                        <br>
 +
<P style="text-align:center;">
 +
<font color:black>
 +
AHL- responsive LacZ reporter
 +
</font>
 +
</p>
 +
    <br><br>          
 +
<img class="displayed" src="https://static.igem.org/mediawiki/2015/7/78/NC_partimg_04.jpg">
 +
<br><br>
 +
 
 +
       
 +
 
 +
 
 +
<a href="#top" rel="" id="top" class="anchorLink"><img class="displayed" src="https://static.igem.org/mediawiki/2015/5/5b/Scroll_arrow_top_Black.png"></a>
 +
<h6 style="text-align:center;"> <font color="black">
 +
                  To The Top
 +
              </font> </h6>
 +
     
 +
        </section>
 +
 
 +
<script>
 +
$('a').click(function(){
 +
     $('html, body').animate({
 +
        scrollTop: $( $(this).attr('href') ).offset().top
 +
    }, 500);
 +
    return false;
 +
});
 +
</script>
 +
 
 
</body>
 
</body>
 +
 
</html>
 
</html>
{{Elan_Vital_Korea/Templates/Footer}}
 

Latest revision as of 23:23, 18 September 2015








PROJECT
-Design-





BBa_K1584017 & BBa K1584026

LuxR controlled by constitutive promoterAHL-required LuxR-Producing Reporter part





BBa_K1584008

AiiA controlled by constitutive promoter





BBa_K1584035

AHL- responsive LacZ reporter





To The Top