Team:NU Kazakhstan

From 2013.igem.org

(Difference between revisions)
 
(50 intermediate revisions not shown)
Line 1: Line 1:
-
 
 
-
 
-
<html>
 
-
<img src="http://s11.postimg.org/yo0r6q8c3/logon.jpg" width="900" height="200"></html>
 
-
<div id="head">
 
-
    <div class="logo">
 
-
http://registrar.nu.edu.kz/sites/all/themes/registrar/images/univer.png" 
 
-
 
-
</div>
 
-
 
<html>
<html>
 +
<img src="http://s16.postimg.org/a91ecg67p/image.gif" width="965" height="378">
<head>
<head>
-
<style>
+
<title>NU_Kazakhstan</title>
-
/*---- CROSS BROWSER DROPDOWN MENU ----*/
+
<style type="text/css">
-
ul#nav {margin: 0 0 0 10px;}
+
ul {
-
ul.drop a { display:block; color: #fff; font-family: Times New Roman; font-size: 20px; text-decoration: none;}
+
    font-family: Arial, Verdana;
-
ul.drop, ul.drop li, ul.drop ul { list-style: none; margin: 0; padding: 0; border: 1px solid #000;; background: #0c6; color: #fff;}
+
    font-size: 14px;
-
ul.drop { position: center; z-index: 100; float: left; }
+
    margin: 0;
-
ul.drop li { float: left; line-height: 1.3em; vertical-align: middle; zoom: 1; padding: 5px 10px; }
+
    padding: 0;
-
ul.drop li.hover, ul.drop li:hover { position: relative; z-index: 100; cursor: default; background: #1e7c9a; }
+
    list-style: none;
-
ul.drop ul { visibility: hidden; position: absolute; top: 100%; left: 0; z-index: 100; width: 195px; background: #555; border: 1px solid #fff; }
+
}
-
ul.drop ul li { float: none; }
+
ul li {
-
ul.drop ul ul { top: -2px; left: 100%; }
+
    display: block;
-
ul.drop li:hover > ul { visibility: visible }
+
    position: relative;
-
</style>
+
    float: left;
 +
}
 +
li ul {
 +
    display: none;
 +
}
 +
ul li a {
 +
    display: block;
 +
    text-decoration: none;
 +
    color: black;
 +
    border-top: 1px solid #ffffff;
 +
  padding: 5px 45px 5px 45px;
 +
    background:  #90EE90;
 +
    margin-left: 1px;
 +
    white-space: nowrap;
 +
}
 +
ul li a:hover {
 +
background: cyan;
 +
}
 +
li:hover ul {
 +
    display: block;
 +
    position: absolute;
 +
}
 +
li:hover li {
 +
    float: none;
 +
    font-size: 15px;
 +
}
 +
li:hover a { background:  #90EE90; }
 +
li:hover li a:hover {
 +
    background:  #90EE90;
 +
}
 +
 +
#top-section{
 +
position:static !important;
 +
height:0;
 +
}
 +
#content{
 +
position:static !important;
 +
}
 +
#p-logo{display:none;}
 +
 +
   
 +
</style>
</head>
</head>
 +
<body>
<body>
-
<ul id="nav" class="drop">
+
<br/>
-
  <li><a href="https://2013.igem.org/Team:NU_Kazakhstan"><h3>Home</h3></a></li>
+
<br/>
-
<li><a href="https://2013.igem.org/Team:NU_Kazakhstan/Team"><h3>Team</h3></a></li>
+
<ul id="menu">
-
<li><a href="https://igem.org/Team.cgi?year=2013"><h3>Official Team Profile</h3></a></li>
+
<li><a href="https://2013.igem.org/Team:NU_Kazakhstan">Home</a></li>
 +
<li><a href="https://2013.igem.org/Team:NU_Kazakhstan/Team">Team</a></li>
 +
<li><a href="https://igem.org/Team.cgi?year=2013">Official team profile</a></li>
 +
<li><a>Project</a>
 +
<ul>
 +
<li><a href="https://2013.igem.org/Team:NU_Kazakhstan/Modeling">Overview</a></li>
 +
<li><a href="https://2013.igem.org/wiki/index.php?title=Team:NU_Kazakhstan/E.Coli&action=edit&redlink=1">E. Coli expression system</a></li>
 +
<li><a href="https://2013.igem.org/wiki/index.php?title=Team:NU_Kazakhstan/Yeast&action=edit&redlink=1">Yeast expression system</a></li>
 +
<li><a href="https://2013.igem.org/wiki/index.php?title=Team:NU_Kazakhstan/Aptamers&action=edit&redlink=1">Selection of aptamers</a></li>
 +
</ul>
 +
</li>
 +
<li><a>Lab Notebook</a>
 +
<ul>
 +
<li><a href="https://2013.igem.org/wiki/index.php?title=Team:NU_Kazakhstan/Protocols&action=edit&redlink=1">Protocols</a></li>
 +
<li><a href="https://2013.igem.org/Team:NU_Kazakhstan/Notebook">Calendar</a></li>
 +
</ul>
 +
</li>
 +
<li><a>Considerations</a>
 +
<ul>
 +
<li><a href="https://2013.igem.org/Team:NU_Kazakhstan/Safety">Safety</a></li>
 +
<li><a href="https://2013.igem.org/wiki/index.php?title=Team:NU_Kazakhstan/Human_practices&action=edit&redlink=1">Human practices</a></li>
 +
<li><a href="https://2013.igem.org/Team:NU_Kazakhstan/Attributions">Attributions</a></li>
 +
</ul>
 +
</li>
 +
</ul>
-
<li><h3>Project</h3>
+
<br/>
-
    <ul>
+
<br/>
-
      <li><a href="https://2013.igem.org/Team:NU_Kazakhstan/Modeling">Overview</a></li>
+
<br/>
-
      <li><a href="https://2013.igem.org/wiki/index.php?title=Team:NU_Kazakhstan/E.Coli&action=edit&redlink=1">E.Coli expression system</a></li>
+
<br/>
-
      <li><a href="https://2013.igem.org/wiki/index.php?title=Team:NU_Kazakhstan/Yeast&action=edit&redlink=1">Yeast expression system</a></li>
+
<br/>
-
      <li><a href="https://2013.igem.org/wiki/index.php?title=Team:NU_Kazakhstan/Aptamers&action=edit&redlink=1">Selection of aptamers</a>
+
<br/>
-
     </ul>
+
<br/>
-
  </li>
+
<br/>
-
  <li><h3>Lab Notebook</h3>
+
<style type="text/css">
-
     <ul>
+
 
-
      <li><a href="https://2013.igem.org/wiki/index.php?title=Team:NU_Kazakhstan/Protocols&action=edit&redlink=1">Protocols</a></li>
+
/*--Slideshow Begins Here--*/
-
      <li><a href="https://2013.igem.org/Team:NU_Kazakhstan/Notebook">Calendar</a></li>
+
#slideshow {
-
    </ul>
+
display: block;
-
  </li>
+
vertical-align: middle;
-
    <li><h3>Considerations</h3>
+
position: relative;
-
    <ul>
+
}
-
      <li><a href="https://2013.igem.org/Team:NU_Kazakhstan/Safety">Safety</a></li>
+
/*--Main Container--*/
-
      <li><a href="https://2013.igem.org/wiki/index.php?title=Team:NU_Kazakhstan/Human_practices&action=edit&redlink=1">Human practices</a></li>
+
#main_view {
-
     </ul>
+
margin-left:auto;
-
  </li>
+
margin-right:auto;
 +
position: relative;
 +
height:500px; width: 800px;
 +
}
 +
.window {
 +
height:500px; width: 800px;
 +
overflow: hidden; /*--Hides anything outside of the set width/height--*/
 +
position: absolute;
 +
display: block;
 +
top:49%;
 +
left:49%;
 +
margin: -220px 0 0 -380px;
 +
}
 +
.image_reel {
 +
position: absolute;
 +
top: 0; left: 0;
 +
}
 +
.image_reel img {float: left;}
 +
.paging {
 +
position: absolute;
 +
bottom: -1px; right: 50px;
 +
width: 300px; height:47px;
 +
z-index: 100; /*--Assures the paging stays on the top layer--*/
 +
text-align: right;
 +
line-height: 40px;
 +
font-weight: bold;
 +
background: url(paging_bg2.png) no-repeat;
 +
display: none; /*--Hidden by default, will be later shown with jQuery--*/
 +
}
 +
.paging a {
 +
padding: 5px;
 +
text-decoration: none;
 +
color: #fff; text-shadow: #333 1px 1px 1px;
 +
}
 +
.pause {
 +
position: absolute;
 +
bottom: -1px; right: 20px;
 +
width: 25px; height:47px;
 +
z-index: 200; /*--Assures the paging stays on the top layer--*/
 +
text-align: center;
 +
line-height: 40px;
 +
font-weight: bold;
 +
display: block; /*--Hidden by default, will be later shown with jQuery--*/
 +
}
 +
.pause a {
 +
padding: 5px;
 +
text-decoration: none;
 +
letter-spacing:1px;
 +
font-weight: thick;
 +
color: #f0f0f0; text-shadow: #333 1px 1px 1px;
 +
border: 2px solid #ccc;
 +
-moz-border-radius: 3px;
 +
-khtml-border-radius: 3px;
 +
-webkit-border-radius: 3px;
 +
}
 +
.paging a.active {
 +
font-weight: bold;
 +
border: 2px solid #fff;
 +
-moz-border-radius: 3px;
 +
-khtml-border-radius: 3px;
 +
-webkit-border-radius: 3px;
 +
}
 +
.paging a:hover {font-weight: bold;}
 +
/*--Slideshow Ends Here--*/
 +
 
 +
/*--Spotlight Stuff Begins Here--*/
 +
#spotlight {
 +
margin-left:0px;
 +
margin-right:auto;
 +
width: 800px;
 +
height: 500px;
 +
}
 +
#spotlightcontainer {
 +
display: block;
 +
position: relative;
 +
width: 800px;
 +
}
 +
.main_image {
 +
width: 800px;
 +
height: 500px;
 +
background: #f0f0f0;
 +
position: relative;
 +
overflow: hidden; /*--Overflow hidden allows the description to toggle/tuck away as it slides down--*/
 +
color: #fff;
 +
border: 0px solid #006633;
 +
float: left;
 +
}
 +
.main_image .spottab {
 +
font-size: 1.2em;
 +
font-weight: normal;
 +
padding: 5px;
 +
color: #fff;
 +
}
 +
.main_image p {
 +
font-size: 1em;
 +
line-height:100%;
 +
padding: 0px 10px 5px 10px;
 +
margin-top: 0;
 +
}
 +
.main_image .desc{
 +
position: absolute;
 +
bottom: 0;
 +
left: 0; /*--Stick the desc class to the bottom of our main image container--*/
 +
width: 150%;
 +
display: none; /*--Hide description by default, if js is enabled, we will show this--*/
 +
}
 +
.main_image .block{
 +
width: 150%;
 +
background: #111;
 +
position: absolute;
 +
bottom: 0;
 +
}
 +
.main_image a.show {background-position: left bottom;}
 +
.image_thumb {
 +
float: left;
 +
width: 800px;
 +
background: #f0f0f0;
 +
}
 +
.image_thumb ul {
 +
margin: 0;
 +
padding: 0;
 +
list-style: none;
 +
}
 +
.image_thumb ul li{
 +
margin: 0;
 +
padding: 0px 0px;
 +
width: 800px;
 +
height: 300px;
 +
float: left;
 +
background: #f0f0f0;
 +
border-bottom: 3px solid #006633;
 +
}
 +
.image_thumb ul li.hover { /*--Hover State--*/
 +
background: #fff;
 +
cursor: pointer;
 +
border-bottom: 3px solid #F37321;
 +
}
 +
.image_thumb ul li.active { /*--Active State--*/
 +
background: #fff;
 +
cursor: default;
 +
border-bottom: 3px solid #F37321;
 +
}
 +
.image_thumb ul li .spottab {
 +
font-size: .9em;
 +
color: #333;
 +
margin: 0px 0;
 +
padding: 5px;
 +
text-decoration:none;
 +
font-weight:bold;
 +
}
 +
.image_thumb ul li .block {
 +
float:left;
 +
}
 +
.image_thumb ul li p{display: none;}/*--Hide the description on the list items--*/
 +
/*--Spotlight Stuff Ends Here--*/
 +
 
 +
 
 +
</style>
 +
 
 +
        <!--Subnav Starts Here-->
 +
       
 +
 
 +
 
 +
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
 +
<script type="text/javascript">
 +
$(document).ready(function() {
 +
//Show the paging and activate its first link
 +
$(".paging").show();
 +
$(".paging a:first").addClass("active");
 +
 
 +
//Get size of the image, how many images there are, then determin the size of the image reel.
 +
var imageWidth = $(".window").width();
 +
var imageSum = $(".image_reel img").size();
 +
var imageReelWidth = imageWidth * imageSum;
 +
 
 +
//Adjust the image reel to its new size
 +
$(".image_reel").css({'width' : imageReelWidth});
 +
 
 +
//Paging  and Slider Function
 +
rotate = function(){
 +
var triggerID = $active.attr("rel") - 1; //Get number of times to slide
 +
var image_reelPosition = triggerID * imageWidth; //Determines the distance the image reel needs to slide
 +
$(".paging a").removeClass('active'); //Remove all active class
 +
$active.addClass('active'); //Add active class (the $active is declared in the rotateSwitch function)
 +
 
 +
//Slider Animation
 +
$(".image_reel").animate({
 +
left: -image_reelPosition
 +
}, 500 );
 +
};
 +
 
 +
//Rotation  and Timing Event
 +
rotateSwitch = function(){
 +
play = setInterval(function(){ //Set timer - this will repeat itself every 7 seconds
 +
$active = $('.paging a.active').next(); //Move to the next paging
 +
if ( $active.length === 0) { //If paging reaches the end...
 +
$active = $('.paging a:first'); //go back to first
 +
}
 +
rotate(); //Trigger the paging and slider function
 +
}, 6000); //Timer speed in milliseconds (6 seconds)
 +
};
 +
 
 +
rotateSwitch(); //Run function on launch
 +
 
 +
//On Hover
 +
//$(".image_reel a").hover(function() {
 +
//clearInterval(play); //Stop the rotation
 +
//}, function() {
 +
//rotateSwitch(); //Resume rotation timer
 +
//});
 +
 
 +
//On Click
 +
$(".pause a").click(function() {
 +
clearInterval(play); //Stop the rotation
 +
});
 +
 
 +
 
 +
//On Click
 +
$(".paging a").click(function() {
 +
$active = $(this); //Activate the clicked paging
 +
//Reset Timer
 +
clearInterval(play); //Stop the rotation
 +
rotate(); //Trigger rotation immediately
 +
rotateSwitch(); // Resume rotation timer
 +
return false; //Prevent browser jump to link anchor
 +
});
 +
});
 +
</script>
 +
 
 +
<script type="text/javascript">
 +
$(document).ready(function() {
 +
 
 +
$(".main_image .desc").show(); //Show Banner
 +
$(".main_image .block").animate({ opacity: 0.85 }, 1 ); //Set Opacity
 +
$(".image_thumb ul li:first").addClass('active'); //Add the active class (highlights the very first list item by default)
 +
$(".image_thumb ul li").click(function(){
 +
    //Set Variables
 +
    var imgAlt = $(this).find('img').attr("alt"); //Get Alt Tag of Image
 +
    var imgTitle = $(this).find('a').attr("href"); //Get Main Image URL
 +
    var imgDesc = $(this).find('.block').html();  //Get HTML of the "block" container
 +
    var imgDescHeight = $(".main_image").find('.block').height(); //Find the height of the "block"
 +
 
 +
    if ($(this).is(".active")) {  //If the list item is active/selected, then...
 +
        return false; // Don't click through - Prevents repetitive animations on active/selected list-item
 +
    } else { //If not active then...
 +
        //Animate the Description
 +
        $(".main_image .block").animate({ opacity: 0, marginBottom: -imgDescHeight }, 250 , function() { //Pull the block down (negative bottom margin of its own height)
 +
            $(".main_image .block").html(imgDesc).animate({ opacity: 0.85,  marginBottom: "0" }, 250 ); //swap the html of the block, then pull the block container back up and set opacity
 +
            $(".main_image img").attr({ src: imgTitle , alt: imgAlt}); //Switch the main image (URL + alt tag)
 +
        });
 +
    }
 +
    //Show active list-item
 +
    $(".image_thumb ul li").removeClass('active'); //Remove class of 'active' on all list-items
 +
    $(this).addClass('active');  //Add class of 'active' on the selected list
 +
    return false;
 +
 
 +
}) .hover(function(){ //Hover effects on list-item
 +
    $(this).addClass('hover'); //Add class "hover" on hover
 +
    }, function() {
 +
    $(this).removeClass('hover'); //Remove class "hover" on hover out
 +
});
 +
$("a.collapse").click(function(){
 +
     $(".main_banner .block").slideToggle(); //Toggle the description (slide up and down)
 +
    $("a.collapse").toggleClass("show"); //Toggle the class name of "show" (the hide/show tab)
 +
});
 +
});//Close Function
 +
</script>
 +
 
 +
 
 +
</td>
 +
</tr>
 +
<tr>
 +
<td colspan="2" style="height: 500px;">
 +
<div id="slideshow"> <!--???-->
 +
<div class="textboxes" id="main_view"> <!--???-->
 +
     <div class="window"> <!--???-->
 +
        <div class="image_reel"> <!--Slideshow Pics go here - 800x300px -->
 +
           
 +
            <a href="https://2013.igem.org/Team:NU_Kazakhstan/Aptamers"><img src="https://static.igem.org/mediawiki/2013/thumb/b/b2/NU_KZ.jpg/710px-NU_KZ.jpg" alt="" width="800" height="500" /></a>
 +
            <a href="https://2013.igem.org/Team:NU_Kazakhstan/Yeast"><img src="https://static.igem.org/mediawiki/2013/thumb/2/26/NU_KZ1.jpg/800px-NU_KZ1.jpg" alt="" width="800" height="500" /></a>
 +
            <a href="https://2013.igem.org/Team:NU_Kazakhstan/E.Coli"><img src="https://static.igem.org/mediawiki/2013/thumb/0/00/NU_KZ2.jpg/629px-NU_KZ2.jpg" alt="" width="800" height="500" /></a>
 +
          <a href="https://2013.igem.org/Team:NU_Kazakhstan/Team"><img src="https://static.igem.org/mediawiki/2013/2/22/NU_Kazakhstan.JPG" alt="" width="800" height="500" /></a>
 +
 
 +
           
 +
 +
        </div>
 +
    </div>
 +
    <div class="paging">
 +
        <a href="#" rel="1">1</a>
 +
        <a href="#" rel="2">2</a>
 +
        <a href="#" rel="3">3</a>
 +
        <a href="#" rel="4">4</a>
 +
     
 +
     </div>
 +
<div class="pause"><a href="#">II</a></div>
 +
</div>
 +
</div>
 +
 
 +
</td>
-
<li><a href="https://2013.igem.org/Team:NU_Kazakhstan/Attributions"><h3>Attributions</h3></a></li>
+
</body>
 +
<br/>
 +
<br/>
 +
<br/>
 +
<div><center><h3>Detection of Carcinoembryonic antigen with sandwich-biosensor
 +
</h3></center></div>
 +
<div id = "center">
 +
<div style="text-align:justify">
 +
<p style="line-height:200%" padding-top:10px>
 +
Diagnosis of certain types of cancer at early stages is still challenging issue. Therefore, many biomarkers for early cancer detection have been investigated. Carcinoembryonic antigen (CEA) is one of the examples of the biomarker which appears at early stages of such types of cancer as colorectal, gastric, pancreatic, lung, and breast carcinoma. In this study, it is planned to develop a biosensor which will be used to detect the presence of CEA. The first part of the study is about selection of ssDNA aptamers, which have strong affinity for CEA, during 12 cycles of SELEX (Systematic Evolution of Ligands by Exponential Enrichment) procedure, followed by characterization of them using dot-blot analysis, ELONA (Enzyme Linked Oligonucleotide Assay) and SPR (Surface Plasmon Resonance) methods. In the last part, it is planned to clone the genes that will assist in expression of streptavidin on the surface of membrane of the model organisms. The model organisms for creating the biosensor are Escherichia coli and Saccharomyces cerevisiae. E. coli will express the streptavidin through Lpp-Omp expression system, while S. cerevisiae will express this protein through Aga1 – Aga2 system. Since streptavidin has strong affinity to biotin, biotinylated aptamers will be used to make a sandwich biosensor for CEA detection. Twelve cycles of SELEX for CEA have been already finished. </p>
 +
</div>
</body>
</body>
-
</html>  
+
<head>
-
{|align="justify"
 
-
|<div>Our team consists of five enthusiastic undergraduate students, who manifest genuine interest in the sphere of ''Synthetic Biology''. We became familiar with '''IGEM''' competition in summer 2012 and asked our faculty to organize special Synthetic Biology course in order to learn more about this exciting sphere of biology. Fortunately, our professors also became interested in this competition and were glad to organize two wonderful courses of Synthetic Biology. These courses gave us a great background in many different topics, but the most interesting topic for us was the ''application of aptamers'' in diagnosis, treatment and research. Then, in April 2013 we asked Dr. Damira, our mentor, who has been working with aptamers in our University research center, to join her team in lab.</div> <div>After working with aptamers more closely we started discussing our ideas for the IGEM project. After long discussions we came with the idea of the development of biosensor for detecting cancer at early stages using aptamers. We are planning to construct the system which will be similar to sandwich assay. In this system, aptamers will bind the target protein present in a patient’s serum, and the binding will be detected using aptamers conjugated to quantum dots.</div>
 
-
|-
 
-
|
 
-
''Tell us more about your project.  Give us background.  Use this as the abstract of your project.  Be descriptive but concise (1-2 paragraphs)''
 
-
|
 
-
|-
 
-
|
 
-
|align="center"|[[Team:NU_Kazakhstan | Team NU_Kazakhstan]]
 
-
|}
 
-
<!--- The Mission, Experiments --->
+
</html>

Latest revision as of 16:06, 27 September 2013

NU_Kazakhstan









1 2 3 4



Detection of Carcinoembryonic antigen with sandwich-biosensor

Diagnosis of certain types of cancer at early stages is still challenging issue. Therefore, many biomarkers for early cancer detection have been investigated. Carcinoembryonic antigen (CEA) is one of the examples of the biomarker which appears at early stages of such types of cancer as colorectal, gastric, pancreatic, lung, and breast carcinoma. In this study, it is planned to develop a biosensor which will be used to detect the presence of CEA. The first part of the study is about selection of ssDNA aptamers, which have strong affinity for CEA, during 12 cycles of SELEX (Systematic Evolution of Ligands by Exponential Enrichment) procedure, followed by characterization of them using dot-blot analysis, ELONA (Enzyme Linked Oligonucleotide Assay) and SPR (Surface Plasmon Resonance) methods. In the last part, it is planned to clone the genes that will assist in expression of streptavidin on the surface of membrane of the model organisms. The model organisms for creating the biosensor are Escherichia coli and Saccharomyces cerevisiae. E. coli will express the streptavidin through Lpp-Omp expression system, while S. cerevisiae will express this protein through Aga1 – Aga2 system. Since streptavidin has strong affinity to biotin, biotinylated aptamers will be used to make a sandwich biosensor for CEA detection. Twelve cycles of SELEX for CEA have been already finished.