Team:Calgary/Sandbox

From 2010.igem.org

(Difference between revisions)
 
(5 intermediate revisions not shown)
Line 1: Line 1:
-
{{CalgaryMenu}}
 
-
 
<html>
<html>
 +
<head>
<head>
-
 
-
<style>
 
-
div.tabBox{
+
<title> iGEM Information Tabs </title>
-
float: left;
+
-
width: 530px;
+
-
height: 360px;
+
-
margin: 5px;
+
-
margin-top: 10px;
+
-
margin-right: 0;
+
-
margin-bottom: 20px;
+
-
}
+
-
div.miniBar{
+
<script type="text/javascript" src="http://www.wikiwikiwebworks.ca/script1.js"></script>
-
float: left;
+
-
height: 360px;
+
-
width: 400px;
+
-
margin-top: 11px;
+
-
margin-left: 15px;
+
-
}
+
-
div.countdown{
+
<style>
-
width: 356px;
+
-
margin-left: auto;
+
</style>
-
margin-right: auto;
+
-
border: 2px solid black;
+
-
}
+
-
div.miniContainer{
+
</head>
-
width: 360px;
+
-
margin-left: auto;
+
-
margin-right: auto;
+
-
}
+
-
img.galleryButton {
 
-
width: 360px;
 
-
height: 121px;
 
-
}
 
-
img.sponsorButton{
 
-
width: 360px;
 
-
height: 121px;
 
-
}
 
-
+
<body>
-
div.twitterTicker{
+
-
clear: left;
+
-
margin-top: 5px;
+
-
margin-left: 5px;
+
-
}
+
-
div.twitterTicker img{
 
-
float: left;
 
-
margin-bottom: 20px;
 
-
margin-left: 10px;
 
-
}
 
-
div.twitterTicker iframe, div.twitterTicker p{
 
-
margin-left: 10px;
 
-
}
 
-
div.twitterTicker a{
+
<!-- text division -->
-
color: #7ae722;
+
-
}
+
<div style="margin-left:auto; margin-right:auto; background:url('http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Background.png'); width:556px; height:330px; padding-top:15px; ">
 +
 +
<div id="0" style=" background-color:white; width:510px; height:310px; margin-left:auto; margin-right:auto; display:block ">
-
div.boxContainer{
+
<div style="height:239px; border:1px solid #CCCCCC; margin-bottom:5px;">
-
width: 920px;
+
-
height: 310px;
+
<img id="boximage1" src="http://www.army.forces.gc.ca/cfb_suffield/Images/CFB_Suffield1.gif"></img>
-
margin-right: auto;
+
-
margin-left: auto;
+
</div>
-
margin-top: 20px;
+
-
}
+
-
div.blueBox, div.greenBox, div.purpleBox{
 
-
float: left;
 
-
width: 300px;
 
-
height: 310px;
 
-
margin:0;
 
-
padding:0;
 
-
border: 0;
 
-
}
 
-
div.blueBox img, div.greenBox img, div.purpleBox img{
+
<div style="height:75px; width:527px; background-image:url('http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Greyportion.png'); float:left; margin-left:-9px;">
-
float: left;
+
-
margin-left: 5px;
+
<p style="padding-left:10px;">On July 14th, 2010, iGEM Calgary visited the Defence Research and Development Canada (DRDC) facility in Suffield, Alberta.</p>
-
margin-top: 5px;
+
-
}
+
</div>
 +
 +
</div>
-
div.blueBox p, div.greenBox p, div.purpleBox p{
+
-
clear: left;
+
-
padding-top: 30px;
+
-
margin-left: 5px;
+
-
font-size: 12px;
+
-
color: #FFF;
+
-
width: 300px;
+
-
height: 250px;
+
-
line-height: 15px;
+
-
}
+
-
div.blueBox{
+
<div id="1" style="background-color:white; width:510px; height:310px; margin-left:auto; margin-right:auto; display:none ">
-
background-color: #54bcf8;
+
-
}
+
<div style="height:239px; border:1px solid #CCCCCC; margin-bottom:5px;">
 +
 +
<img id="boximage2" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/ImageTBA-1.png"></img>
 +
</div>
-
div.greenBox{
+
-
background-color: #7ae722;
+
<div style="height:75px; width:527px; background-image:url('http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Greyportion.png'); float:left; margin-left:-9px;">
-
}
+
 +
<p style="padding-left:10px;"> I'm generic information about Lethbridge! </p>
 +
 +
</div>
 +
 +
</div>
-
div.purpleBox{
+
-
background-color: #7b54cc;
+
-
}
+
-
div.purpleBox iframe{
+
<div id="2" style=" background-color:white; width:510px; height:310px; margin-left:auto; margin-right:auto; display:none ">
-
margin-top: 5px;
+
-
margin-left: -7px;
+
<div style="height:239px; border:1px solid #CCCCCC; margin-bottom:5px;">
-
}
+
-
div.boxSpacer{
+
<img id="boximage3" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/bhsgrnsmall.png"></img>
-
float: left;
+
-
width: 10px;
+
</div>
-
height: 300px;
+
-
background-color: #FFFFFF;
+
-
}
+
-
div.projectDescContainer{
+
-
background-image:url("http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/ProjectDescriptionBox.png");
+
<div style="height:75px; width:527px; background-image:url('http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Greyportion.png'); float:left; margin-left:-9px;">
-
background-repeat: repeat-y;
+
-
width: 866px;
+
-
margin-left: auto;
+
-
margin-right: auto;
+
-
margin-top: 20px;
+
-
padding-bottom: 20px;
+
-
}
+
-
img.descTitle{
+
<p style="padding-left:10px;"> I'm like burning man but better! </p>
-
float: left;
+
-
margin-top: 20px;
+
</div>
-
margin-left: 20px;
+
-
margin-bottom: 10px;
+
</div>
-
}
+
-
div.projectDescContainer p{
+
-
clear: left;
+
-
padding-left: 20px;
+
-
padding-right: 20px;
+
-
}
+
-
div.projectDescContainer a{
+
<div id="3" style=" background-color:white; width:510px; height:310px; margin-left:auto; margin-right:auto; display:none ">
-
color: #7b54cc;
+
-
}
+
-
div.sponsorsContainer{
+
<div style="height:239px; border:1px solid #CCCCCC; margin-bottom:5px;">
-
width: 866px;
+
-
margin-left: auto;
+
<img id="boximage4" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/ProtocolIcon.png"></img>
-
margin-right: auto;
+
-
margin-top: 20px;
+
</div>
-
}
+
-
img.sponsTitle{
+
-
float: left;
+
<div style="height:75px; width:527px; background-image:url('http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Greyportion.png'); float:left; margin-left:-9px;">
-
margin-top: 20px;
+
-
margin-left: 10px;
+
-
}
+
-
div.sponsorsContainer table{
+
<p style="padding-left:10px;"> I'm a fan of cupcakes! </p>
-
clear: left;
+
-
width: 866px;
+
</div>
-
margin-left: auto;
+
-
margin-right: auto;
+
</div>
-
margin-top: -10px;
+
-
}
+
-
div.sponsorsContainer td{
+
-
padding: 10px;
+
-
}
+
 +
<div id="4" style=" background-color:white; width:510px; height:310px; margin-left:auto; margin-right:auto; display:none ">
-
</style>
+
<div style="height:239px; border:1px solid #CCCCCC; margin-bottom:5px;">
-
</head>
+
 +
<img id="boximage5" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Twitter.png"></img>
 +
 +
</div>
-
<body>
+
 +
<div style="height:75px; width:527px; background-image:url('http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Greyportion.png'); float:left; margin-left:-9px;">
-
<div class="tabBox">
+
<p style="padding-left:10px;"> I'm from Alberta and I'm awesome! </p>
-
<img src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/TabMenu2.png"></img>
+
-
</div>
+
</div>
 +
 +
</div>
-
<div class="miniBar">
 
-
<div class="countdown"><object type="application/x-shockwave-flash" data="http://www.oneplusyou.com/bb/files/countdown/countdown.swf?co=000000&bgcolor=FFFFFF&date_month=11&date_day=05&date_year=0&un=THE IGEM JAMBOREE&size=normal&mo=11&da=05&yr=2010" width="356" height="115"><param name="movie" value="http://www.oneplusyou.com/bb/files/countdown/countdown.swf?co=000000&bgcolor=FFFFFF&date_month=11&date_day=05&date_year=0&un=THE IGEM JAMBOREE&size=normal&mo=11&da=05&yr=2010" /><param name="bgcolor" value="#FFFFFF" /></object><img src="http://www.oneplusyou.com/q/img/bb_badges/countdown.jpg" alt="" style="display: none;" height="1" width="1" /></div>
 
-
<div class="miniContainer">
 
-
<img src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/RecentPhotosTab.png" class="galleryButton"></img>
 
-
<img src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/SponsoroftheMonthButton.png" class="sponsorButton"></img>
 
-
</div>
 
</div>
</div>
-
<div class="twitterTicker">
 
-
<img src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Twitter.png"></img>
 
-
<iframe src="http://s1.rsspump.com/rss.aspx?s=a65f65cb-5561-4e09-ab23-1b518cb1b35e&amp;speed=1&amp;t=0&amp;d=1&amp;u=0&amp;p=0&amp;b=0&amp;ic=5&amp;font=Verdana&amp;fontsize=12px&amp;bgcolor=&amp;color=000000&amp;type=typewriter&amp;su=0&amp;sub=0&amp;sw=0" frameborder="0" width="100%" height="16" scrolling="no" allowtransparency="true"></iframe><noframes><div style="background-color: none transparent;"><a href="http://www.rsspump.com/?web_widget/rss_widget/twitter_widget" title="web widget">Twitter Widget</a></div></noframes>
 
-
<p><a href="http://twitter.com/iGEMCalgary">Follow us on Twitter!</a></p>
 
-
</div>
 
 +
<!-- menu bar -->
 +
 +
<div style="width:524px; height:35px; margin-right:auto; margin-left:auto; margin-top:-10px; padding-left:10px; ">
-
<div class="boxContainer">
+
-
<div class="blueBox">
+
<div onmouseover="imgHover(1);" onmouseout="imgOff(1);" onclick="changeTab(0);" style="margin-left:2.4; margin-right:2.4; float:left; width:98px; height:35px; "> <img id="suffield" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/SuffieldWhite.png" title="suffield" /> </div>
-
<img src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Modellingtxt.png"></img>
+
-
<p>Our modelling project description will arrive soon! Keep checking back!</p>
+
-
</div>
+
 +
 +
<div onmouseover="imgHover(2);" onmouseout="imgOff(2);" onclick="changeTab(1);" style="margin-left:2.4; margin-right:2.4; float:left; width:98px; height:35px; "> <img id="lethbridge" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/LethbridgeGrey.png" title="lethbridge" /> </div>
-
<div class="boxSpacer"></div>
+
 +
<div onmouseover="imgHover(3);" onmouseout="imgOff(3);" onclick="changeTab(2);" style="margin-left:2.4; margin-right:2.4; float:left; width:98px; height:35px; "> <img id="proteinman" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/ProteinManGrey.png" title="protein man" /> </div>
-
<div class="greenBox">
+
<div onmouseover="imgHover(4);" onmouseout="imgOff(4);" onclick="changeTab(3);" style="margin-left:2.4; margin-right:2.4; float:left; width:98px; height:35px; "> <img id="community" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/CommunityGrey.png" title="bake sale" /> </div>
-
<img src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Circuit1.png"></img>
+
-
<p></p>
+
-
</div>
+
 +
 +
<div onmouseover="imgHover(5);" onmouseout="imgOff(5);" onclick="changeTab(4);" style="margin-left:2.4; margin-right:2.4; float:left; width:98px; height:35px; "> <img id="agem" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/aGEMGrey.png" title="aGEM" /> </div>
 +
 +
</div>
-
<div class="boxSpacer"></div>
 
-
<div class="purpleBox">
 
-
<img src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/NewsFeed.png"></img>
 
-
<iframe width="400" height="300" style="border:none;" src="http://output17.rssinclude.com/output?type=iframe&id=138298&hash=53e22a9f7ec86cf9adb1e136f5752fef"></iframe>
 
-
</div>
 
-
 
-
</div>
 
 +
</body>
-
<div class="projectDescContainer">
 
-
<img class="descTitle" title="Project Description" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/ProjectDescription.png"></img>
 
-
<p>Many synthetic biology projects involve the expression of recombinant proteins in microorganisms such as E. coli. The problems encountered with many synthetic biology projects often involve problems with protein expression. It is often very difficult to recognize the problem and pinpoint where it lies. The goal of the University of Calgary 2010 iGEM team is to build a protein expression "troubleshooting kit". This kit will contain two systems with which target genes can be inserted. In the resulting cell growth, fluorescent protein production will be used to determine whether there is a problem with protein expression as well as indicate where the protein expression is failing.</p>
 
-
<p>Protein expression happens in three steps: the transcription of the DNA to mRNA, the translation of mRNA into an amino acid sequence, and the folding of that amino acid sequence into a protein. Our system detects possible errors in these three steps using two circuits. The first circuit has a fluorescent reporter that is produced when DNA is transcribed into mRNA and another that is produced when mRNA is translated into a functional protein. When both reporter proteins are expressed in the cell, it indicates both transcription and translation are successful. The second circuit involves reporter systems that are activated as a result of protein misfolding. Two native stress-activated promoters from E. coli were engineered upstream to fluorescent reporters that will respond to periplasmic and cytoplasmic protein misfolding. If the protein of interest misfolds in either area of the cell, one of the promoters will be activated and the corresponding fluorescence will be observed.</p>
 
-
<p><a href="https://2010.igem.org/Team:Calgary/Project">Read more...</a></p>
 
-
</div>
 
-
 
-
 
-
<div class="sponsorsContainer">
 
-
<img class="sponsTitle" title="Sponsors" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Sponsors.png"></img>
 
-
 
-
<table>
 
-
<tr>
 
-
<td><a href="#"><img src="http://www.sciencemediacentre.ca/smc/images/stories/logos/AI%20Tech_RGB.jpg"></img></a></td>
 
-
<td><a href="#"><img src="http://enel.ucalgary.ca/mitacs/MITACS/images/Logo_UofC.jpg"></img></a></td>
 
-
<td><a href="#"><img src="https://static.igem.org/mediawiki/2008/7/7b/Bioalberta.jpeg"></img></a></td>
 
-
</tr>
 
-
<tr>
 
-
<td><a href="#"><img src="http://www.innolution.com/img/autodesk_logo.jpg"></img></a></td>
 
-
<td><a href="#"><img src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/NEB_logoSmall2.png"></img></a></td>
 
-
<td><a href="#"><img src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/VWRLogoCallBlue-HIGHREScopy2.png"></img></a></td>
 
-
</tr>
 
-
<tr>
 
-
<td><a href="#"><img src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/bhsgrnsmall.png"></img></a></td>
 
-
</tr>
 
-
</table>
 
-
</div>
 
-
 
-
 
-
</body>
 
</html>
</html>

Latest revision as of 06:48, 25 October 2010

iGEM Information Tabs

On July 14th, 2010, iGEM Calgary visited the Defence Research and Development Canada (DRDC) facility in Suffield, Alberta.

I'm generic information about Lethbridge!

I'm like burning man but better!

I'm a fan of cupcakes!

I'm from Alberta and I'm awesome!