Team:Queens Canada/sandbox

From 2012.igem.org

(Difference between revisions)
Line 1: Line 1:
-
{{Template:Queens_Canada/Header}}
+
{{Template:Queens_Canada/Headernojs}}
<html>
<html>
<head>
<head>
<style type="text/css">
<style type="text/css">
 +
#pagecontent
 +
{
 +
background-color: blue;
 +
}
 +
.ca-container{
 +
position:relative;
 +
margin:25px auto 20px auto;
 +
width:990px;
 +
height:450px;
 +
}
 +
.ca-wrapper{
 +
width:100%;
 +
height:100%;
 +
position:relative;
 +
}
 +
.ca-item{
 +
position:relative;
 +
float:left;
 +
width:330px;
 +
height:100%;
 +
text-align:center;
 +
}
 +
.ca-more{
 +
position: absolute;
 +
bottom: 10px;
 +
right:0px;
 +
padding:4px 15px;
 +
font-weight:bold;
 +
background: #ccbda2;
 +
text-align:center;
 +
color: white;
 +
font-family: "Georgia","Times New Roman",serif;
 +
font-style:italic;
 +
text-shadow:1px 1px 1px #897c63;
 +
}
 +
.ca-close{
 +
position:absolute;
 +
top:10px;
 +
right:10px;
 +
background:#fff url(../images/cross.png) no-repeat center center;
 +
width:27px;
 +
height:27px;
 +
text-indent:-9000px;
 +
outline:none;
 +
-moz-box-shadow:1px 1px 2px rgba(0,0,0,0.2);
 +
-webkit-box-shadow:1px 1px 2px rgba(0,0,0,0.2);
 +
box-shadow:1px 1px 2px rgba(0,0,0,0.2);
 +
opacity:0.7;
 +
}
 +
.ca-close:hover{
 +
opacity:1.0;
 +
}
 +
.ca-item-main{
 +
padding:20px;
 +
position:absolute;
 +
top:5px;
 +
left:5px;
 +
right:5px;
 +
bottom:5px;
 +
background:#fff;
 +
overflow:hidden;
 +
-moz-box-shadow:1px 1px 2px rgba(0,0,0,0.2);
 +
-webkit-box-shadow:1px 1px 2px rgba(0,0,0,0.2);
 +
box-shadow:1px 1px 2px rgba(0,0,0,0.2);
 +
}
 +
.ca-icon{
 +
width:233px;
 +
height:189px;
 +
position:relative;
 +
margin:0 auto;
 +
background:transparent url(../images/animal1.png) no-repeat center center;
 +
}
 +
.ca-item-2 .ca-icon{
 +
background-image:url(../images/animal2.png);
 +
}
 +
.ca-item-3 .ca-icon{
 +
background-image:url(../images/animal3.png);
 +
}
 +
.ca-item-4 .ca-icon{
 +
background-image:url(../images/animal4.png);
 +
}
 +
.ca-item-5 .ca-icon{
 +
background-image:url(../images/animal5.png);
 +
}
 +
.ca-item-6 .ca-icon{
 +
background-image:url(../images/animal6.png);
 +
}
 +
.ca-item-7 .ca-icon{
 +
background-image:url(../images/animal7.png);
 +
}
 +
.ca-item-8 .ca-icon{
 +
background-image:url(../images/animal8.png);
 +
}
 +
.ca-item h3{
 +
font-family: 'Coustard', sans-serif;
 +
text-transform:uppercase;
 +
font-size:30px;
 +
color:#000;
 +
margin-bottom:20px;
 +
height:85px;
 +
text-align:center;
 +
text-shadow: 0px 1px 1px #e4ebe9;
 +
}
 +
.ca-item h4{
 +
font-family: "Georgia","Times New Roman",serif;
 +
font-style:italic;
 +
font-size:12px;
 +
text-align:left;
 +
border-left:10px solid #b0ccc6;
 +
padding-left:10px;
 +
line-height:24px;
 +
margin:10px;
 +
position:relative;
 +
}
 +
.ca-item h4 span{
 +
text-indent:40px;
 +
display:block;
 +
}
 +
.ca-item h4  span.ca-quote{
 +
color:#f4eee3;
 +
font-size:100px;
 +
position:absolute;
 +
top:20px;
 +
left:0px;
 +
text-indent:0px;
 +
}
 +
.ca-content-wrapper{
 +
background:#b0ccc6;
 +
position:absolute;
 +
width:0px; /* expands to width of the wrapper minus 1 element */
 +
height:440px;
 +
top:5px;
 +
text-align:left;
 +
z-index:10000;
 +
overflow:hidden;
 +
}
 +
.ca-content{
 +
width:660px;
 +
overflow:hidden;
 +
}
 +
.ca-content-text{
 +
font-size: 14px;
 +
font-style: italic;
 +
font-family: "Georgia","Times New Roman",serif;
 +
margin:10px 20px;
 +
padding:10px 20px;
 +
line-height:24px;
 +
}
 +
.ca-content-text p{
 +
padding-bottom:5px;
 +
}
 +
.ca-content h6{
 +
margin:25px 20px 0px 35px;
 +
font-size:32px;
 +
padding-bottom:5px;
 +
color:#000;
 +
font-family: 'Coustard', sans-serif;
 +
color:#60817a;
 +
border-bottom:2px solid #99bcb4;
 +
text-shadow: 1px 1px 1px #99BCB4;
 +
}
 +
.ca-content ul{
 +
margin:20px 35px;
 +
height:30px;
 +
}
 +
.ca-content ul li{
 +
float:left;
 +
margin:0px 2px;
 +
}
 +
.ca-content ul li a{
 +
color:#fff;
 +
background:#000;
 +
padding:3px 6px;
 +
font-size:14px;
 +
font-family: "Georgia","Times New Roman",serif;
 +
font-style:italic;
 +
}
 +
.ca-content ul li a:hover{
 +
background:#fff;
 +
color:#000;
 +
text-shadow:none;
 +
}
 +
.ca-nav span{
 +
width:25px;
 +
height:38px;
 +
background:transparent url(../images/arrows.png) no-repeat top left;
 +
position:absolute;
 +
top:50%;
 +
margin-top:-19px;
 +
left:-40px;
 +
text-indent:-9000px;
 +
opacity:0.7;
 +
cursor:pointer;
 +
z-index:100;
 +
}
 +
.ca-nav span.ca-nav-next{
 +
background-position:top right;
 +
left:auto;
 +
right:-40px;
 +
        background-color:black
 +
}
 +
.ca-nav span:hover{
 +
opacity:1.0;
 +
}
</style>
</style>
 +
<link rel="stylesheet" type="text/css" href="http://dl.dropbox.com/u/46807995/jquery.jscrollpane.css" media="all" />
 +
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
 +
<script type="text/javascript" src="http://2012.igem.org/Team:Queens_Canada/Javascript/Smoothscroll?action=raw&ctype=text/js"> </script>
 +
<script type="text/javascript" src="http://2012.igem.org/Team:Queens_Canada/Javascript/easing?action=raw&ctype=text/js"> </script>
 +
 +
 +
 +
</script>
</head>
</head>
<div id="pagecontent">
<div id="pagecontent">
 +
<div id="ca-container" class="ca-container">
 +
<div class="ca-wrapper">
 +
<div class="ca-item ca-item-1">
 +
<div class="ca-item-main">
 +
<div class="ca-icon"></div>
 +
<h3>ChimeriQ</h3>
 +
<h4>
 +
<span class="ca-quote">&ldquo;</span>
 +
<span>fasdafdasfas</span>
 +
</h4>
 +
<a href="#" class="ca-more">more...</a>
 +
</div>
 +
<div class="ca-content-wrapper">
 +
<div class="ca-content">
 +
<h6>FliCing Bioremediation into action</h6>
 +
<a href="#" class="ca-close">close</a>
 +
<div class="ca-content-text">
 +
<p>test1 test 2 test3 </p>
 +
</div>
 +
<ul>
 +
<li><a href="#">Read more</a></li>
 +
 +
</ul>
 +
</div>
 +
</div>
 +
</div>
 +
<div class="ca-item ca-item-2">
 +
<div class="ca-item-main">
 +
<div class="ca-icon"></div>
 +
<h3>fas</h3>
 +
<h4>
 +
<span class="ca-quote">&ldquo;</span>
 +
<span>qeqewpuiqweroiu</span>
 +
</h4>
 +
<a href="#" class="ca-more">more...</a>
 +
</div>
 +
<div class="ca-content-wrapper">
 +
<div class="ca-content">
 +
<h6>af;dklasdfkl;asdf</h6>
 +
<a href="#" class="ca-close">close</a>
 +
<div class="ca-content-text">
 +
<p>asfdl;kjasdf;lkjasdflkj</p>
 +
</div>
 +
<ul>
 +
<li><a href="#">Read more</a></li>
 +
<li><a href="#">Share this</a></li>
 +
<li><a href="#">Become a member</a></li>
 +
<li><a href="#">Donate</a></li>
 +
</ul>
 +
</div>
 +
</div>
 +
</div>
 +
<div class="ca-item ca-item-3">
 +
<div class="ca-item-main">
 +
<div class="ca-icon"></div>
 +
<h3>fas</h3>
 +
<h4>
 +
<span class="ca-quote">&ldquo;</span>
 +
<span>das</span>
 +
</h4>
 +
<a href="#" class="ca-more">more...</a>
 +
</div>
 +
<div class="ca-content-wrapper">
 +
<div class="ca-content">
 +
<h6>afas</h6>
 +
<a href="#" class="ca-close">close</a>
 +
<div class="ca-content-text">
 +
<p>fas</p>
 +
<p>fas</p>
 +
</div>
 +
<ul>
 +
<li><a href="#">Read more</a></li>
 +
<li><a href="#">Share this</a></li>
 +
<li><a href="#">Become a member</a></li>
 +
<li><a href="#">Donate</a></li>
 +
</ul>
 +
</div>
 +
</div>
 +
</div>
 +
<div class="ca-item ca-item-4">
 +
<div class="ca-item-main">
 +
<div class="ca-icon"></div>
 +
<h3>asdfasdf</h3>
 +
<h4>
 +
<span class="ca-quote">&ldquo;</span>
 +
<span>fas</span>
 +
</h4>
 +
<a href="#" class="ca-more">more...</a>
 +
</div>
 +
<div class="ca-content-wrapper">
 +
<div class="ca-content">
 +
<h6>asdf</h6>
 +
<a href="#" class="ca-close">close</a>
 +
<div class="ca-content-text">
 +
<p>das.</p>
 +
</div>
 +
<ul>
 +
<li><a href="#">Read more</a></li>
 +
<li><a href="#">Share this</a></li>
 +
<li><a href="#">Become a member</a></li>
 +
<li><a href="#">Donate</a></li>
 +
</ul>
 +
</div>
 +
</div>
 +
</div>
 +
<div class="ca-item ca-item-5">
 +
<div class="ca-item-main">
 +
<div class="ca-icon"></div>
 +
<h3>asdf</h3>
 +
<h4>
 +
<span class="ca-quote">&ldquo;</span>
 +
<span>sa;dklfjas;dlfkj;asldkfja;slkdjfas;ldf</span>
 +
</h4>
 +
<a href="#" class="ca-more">more...</a>
 +
</div>
 +
<div class="ca-content-wrapper">
 +
<div class="ca-content">
 +
<h6>asdflkjasdf;lkjasdflkajsdf</h6>
 +
<a href="#" class="ca-close">close</a>
 +
<div class="ca-content-text">
 +
<p>sadfksaf;lkasfd;kljsdafjk;lsjk;lsfdakjlsad</p>
 +
</div>
 +
<ul>
 +
<li><a href="#">Read more</a></li>
 +
<li><a href="#">Share this</a></li>
 +
<li><a href="#">Become a member</a></li>
 +
<li><a href="#">Donate</a></li>
 +
</ul>
 +
</div>
 +
</div>
 +
</div>
 +
<div class="ca-item ca-item-6">
 +
<div class="ca-item-main">
 +
<div class="ca-icon"></div>
 +
<h3>sadfk;asldkfjaslkd</h3>
 +
<h4>
 +
<span class="ca-quote">&ldquo;</span>
 +
<span>asdfksafl;kjasdf;lkj</span>
 +
</h4>
 +
<a href="#" class="ca-more">more...</a>
 +
</div>
 +
<div class="ca-content-wrapper">
 +
<div class="ca-content">
 +
<h6>asdfasdf</h6>
 +
<a href="#" class="ca-close">close</a>
 +
<div class="ca-content-text">
 +
<p>asdfasf</p>
 +
</div>
 +
<ul>
 +
<li><a href="#">Read more</a></li>
 +
<li><a href="#">Share this</a></li>
 +
<li><a href="#">Become a member</a></li>
 +
<li><a href="#">Donate</a></li>
 +
</ul>
 +
</div>
 +
</div>
 +
</div>
 +
<div class="ca-item ca-item-7">
 +
<div class="ca-item-main">
 +
<div class="ca-icon"></div>
 +
<h3>asdfasdf</h3>
 +
<h4>
 +
<span class="ca-quote">&ldquo;</span>
 +
<span>asdf</span>
 +
</h4>
 +
<a href="#" class="ca-more">more...</a>
 +
</div>
 +
<div class="ca-content-wrapper">
 +
<div class="ca-content">
 +
<h6>Collateral damage?</h6>
 +
<a href="#" class="ca-close">close</a>
 +
<div class="ca-content-text">
 +
<p>asdf</p>
 +
</div>
 +
<ul>
 +
<li><a href="#">Read more</a></li>
 +
<li><a href="#">Share this</a></li>
 +
<li><a href="#">Become a member</a></li>
 +
<li><a href="#">Donate</a></li>
 +
</ul>
 +
</div>
 +
</div>
 +
</div>
 +
<div class="ca-item ca-item-8">
 +
<div class="ca-item-main">
 +
<div class="ca-icon"></div>
 +
<h3>asdf</h3>
 +
<h4>
 +
<span class="ca-quote">&ldquo;</span>
 +
<span>asdf</span>
 +
</h4>
 +
<a href="#" class="ca-more">more...</a>
 +
</div>
 +
<div class="ca-content-wrapper">
 +
<div class="ca-content">
 +
<h6>dasdfasdf</h6>
 +
<a href="#" class="ca-close">close</a>
 +
<div class="ca-content-text">
 +
<p>asdf</p>
 +
</div>
 +
<ul>
 +
<li><a href="#">Read more</a></li>
 +
<li><a href="#">Share this</a></li>
 +
<li><a href="#">Become a member</a></li>
 +
<li><a href="#">Donate</a></li>
 +
</ul>
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
</div>
 +
 +
<script type="text/javascript" src="http://dl.dropbox.com/u/46807995/jquery.contentcarousel.js">
 +
</script>
 +
<script type="text/javascript">
 +
$('#ca-container').contentcarousel();
 +
</script>
<div id="contentmain">
<div id="contentmain">
<i>Our wiki is still under construction! Stay tuned for updates!</i>
<i>Our wiki is still under construction! Stay tuned for updates!</i>
Line 76: Line 505:
}).render().setUser('iGEMQueens').start();
}).render().setUser('iGEMQueens').start();
</script>
</script>
 +
<script type="text/javascript">
 +
  $.noConflict();
 +
  // Code that uses other library's $ can follow here.
 +
$.getScript("http://2012.igem.org/Team:Queens_Canada/Javascript/Init?action=raw&ctype=text/js");
 +
 +
</script>
 +
</div>
</div>
</div>
</div>
</div>
</div>
</html>
</html>

Revision as of 15:13, 25 July 2012

Control

ChimeriQ

fasdafdasfas

more...
FliCing Bioremediation into action
close

test1 test 2 test3

fas

qeqewpuiqweroiu

more...
af;dklasdfkl;asdf
close

asfdl;kjasdf;lkjasdflkj

asdf

sa;dklfjas;dlfkj;asldkfja;slkdjfas;ldf

more...
asdflkjasdf;lkjasdflkajsdf
close

sadfksaf;lkasfd;kljsdafjk;lsjk;lsfdakjlsad

sadfk;asldkfjaslkd

asdfksafl;kjasdf;lkj

more...

asdfasdf

asdf

more...
Collateral damage?
close

asdf

asdf

asdf

more...
Our wiki is still under construction! Stay tuned for updates!

ChimeriQ

This year, our team is investigating new methods of increasing the efficiency of bioremediation and biosynthesis using modified bacteria. The development of the oil sands in Alberta, has resulted in the build up of toxic byproducts stored in massive tailings ponds. To help resolve these issues, our goals can be divided up into three main categories: the binding of pollutants, adhesion and aggregation of bacteria, and catalysis.

Most bacteria possess tail-like appendages called flagella, which can be genetically altered for novel functions. Each flagella is made up of a number of polymerizing proteins, often called flagellin. By making chimeric insertions in the variable domain of the flagellin, we can incorporate metal binding proteins, enzymes, adhesive proteins as well as scaffolding proteins to further extend the possible applications. To accomplish this, we can summarize the majority of our work into three main tasks:

  • clone and modify the constant domains of the flagellin protein for making insertions using Biobricks and parts obtained from the wild.
  • design a flexible, compatible cloning method for efficientlymaking chimeric insertions using Biobricks and other parts
  • introduce binding and catalysis to the length of the flagella.

Check out our article in Kingston This Week!

SynthetiQ Experimental Dance

As part of the human practices component of our project, we will be creating a new and unique group devoted to developing dance as a means of teaching, learning, and explaining scientific concepts.

Today, scientists and teachers, of any subject, everywhere around the world are working hard to explain their ideas to their students, investors, friends, family and other scientists. Often, we end up in situations where our ideas are so incredible, they are difficult to explain or someone else's explanation of their idea fails to help with your understanding.

Inspired by Dr. John Bohannon and the Dance Your PhD Contest, SynthetiQ's primary goal is to provide a new, unique alternative for explaining scientific concepts. By using dance as a means of demonstrating concepts and ideas, we can make complex, or straight-forward, scientific research easier to understand, while leaving a lasting impact on the audience, be it in a classroom, lecture hall, conference or for a panel of investors. An excellent demonstration of this idea can be found in Dr. John Bohannon's talk at TedxBrussels from 2011.


How can you reach us?

info@qgemteam.com