Difference between revisions of "Team:Technion Israel/Collaborations"

Line 11: Line 11:
 
<style>/* inline page CSS */
 
<style>/* inline page CSS */
 
 
/* ========== general CSS ========== */
 
/* Body */
 
 
body {
 
body {
/* font-size: 14px; */  /* optional settings */
 
 
}
 
}
/* ========== END: general CSS ========== */
 
 
  
 
/* ==========Background and effects ========== */
 
/* ==========Background and effects ========== */
Line 36: Line 31:
  
  
 +
/*
 +
Object in external CSS sheet:
  
/* ========== fonts: ========== */
+
nav-tabs, cont_tabs:
 
+
Open diffrent tabs, we uses imgs.
/*corecting wiki css */
+
#HQ_page h1, h2, h3, h4, h5, h6{
+
font-family: "Century Gothic", "CenturyGothic", "AppleGothic", sans-serif;
+
}
+
 
+
#HQ_page p {
+
font-family: "Candara", "Calibri", "Segoe", "Segoe UI", "Optima", Arial, sans-serif;
+
 
+
font-size: 18px;
+
font-style: normal;
+
font-variant: normal;
+
font-weight: 400;
+
line-height: 27px;
+
}
+
 
+
/*setting our wiki's css */
+
h1, h2, h3, h4, h5, h6{
+
font-family: "Century Gothic", "CenturyGothic", "AppleGothic", sans-serif;
+
color: black;
+
}
+
 
+
p {
+
font-family: "Candara", "Calibri", "Segoe", "Segoe UI", "Optima", Arial, sans-serif;
+
 
+
font-size: 18px;
+
font-style: normal;
+
font-variant: normal;
+
font-weight: 400;
+
line-height: 27px;
+
}
+
 
+
/* ========== END: fonts ========== */
+
 
+
 
+
 
+
/* ==========Containers  ========== */
+
+
/* Upper section */
+
.collaboration_logo{
+
/*-webkit-filter: grayscale(0.75);*/
+
cursor: pointer;
+
transition: all .5s ease;
+
box-shadow: 5px 5px 3px grey;
+
margin: 0 auto;
+
/* border: 2px solid #bbb;
+
padding: 15px; */
+
}
+
 
+
.collaboration_logo:hover{
+
-webkit-filter: grayscale(0);
+
transform: scale(1.2,1.2);
+
box-shadow: 5px 5px 3px grey;
+
margin: 0 auto;
+
/*border: 2px solid #000; */
+
}
+
 
+
/* Content section */
+
/* The containers which hold the texts and imgs */
+
.coll_par{
+
padding-top: 30px;
+
padding-right: 30px;
+
padding-bottom: 30px;
+
padding-left: 30px;
+
border-radius:10px;
+
/* border-radius:5px;
+
background-color: #fff;
+
border: 1px solid #000;
+
box-shadow: 10px 10px 5px #f4f4f4; */
+
}
+
 
+
/* ==========END: containers  ========== */
+
 
+
/* ========== Images CSS  ========== */
+
+
.img-peshawar {
+
margin: auto;
+
padding: 15px;
+
border-radius:25px;
+
}
+
+
.no-title-col {
+
padding-top: 70px;
+
vertical-align: middle;
+
}
+
 
+
/* ========== End: Images CSS  ========== */
+
  
 +
back-to-top:
 +
go back to top. Apears only when going down the page.
  
/* ========== Hover over the tabs underline effect ========== */
+
cont_box:
.nav-tabs { border-bottom: 2px solid #DDD; }
+
The containers (box) which hold the texts and imgs in the page.
.nav-tabs > li.active > a, .nav-tabs > li.active > a:focus, .nav-tabs > li.active > a:hover { border-width: 0; }
+
.nav-tabs > li > a { border: none; color: #666; }
+
.nav-tabs > li.active > a, .nav-tabs > li > a:hover { border: none; color: #4285F4 !important; background: transparent; }
+
.nav-tabs > li > a::after { content: ""; background: #4285F4; height: 2px; position: absolute; width: 100%; left: 0px; bottom: -1px; transition: all 250ms ease 0s; transform: scale(0); }
+
.nav-tabs > li.active > a::after, .nav-tabs > li:hover > a::after { transform: scale(1); }
+
.tab-nav > li > a::after { background: #21527d none repeat scroll 0% 0%; color: #fff; }
+
.tab-pane { padding: 15px 0; }
+
/* ========== End  ========== */
+
  
 +
img_cont:
 +
Every in-content-page img needs to have this class of img.
  
/* ========== Go up arrow  ========== */
+
no-title-col:
.back-to-top {
+
Every in-content-page img needs to have this class of col.
cursor: pointer;
+
*/
position: fixed;
+
bottom: 20px;
+
right: 20px;
+
display:none;
+
}
+
/* ========== END: Go up arrow  ========== */
+
  
  
Line 188: Line 89:
 
 
 
<!-- ===== One overall container (wrapper) ===== -->
 
<!-- ===== One overall container (wrapper) ===== -->
<div class="collaborations_wrapper">
+
<div class="collaboration_wrapper">
  
  
Line 195: Line 96:
 
<div class="row">
 
<div class="row">
 
<div class="col-xs-12">
 
<div class="col-xs-12">
<img src="https://static.igem.org/mediawiki/2016/b/b0/T--Technion_Israel--collaboration_cover.jpg" class="img-responsive img-center collaboration_cover" width="100%">
+
<img src="https://static.igem.org/mediawiki/2016/b/b0/T--Technion_Israel--collaboration_cover.jpg" class="img-responsive img-center cont_cover" width="100%">
 
</div>
 
</div>
 
</div>
 
</div>
Line 214: Line 115:
 
<li role="presentation" class="col-sm-3 col-xs-6">
 
<li role="presentation" class="col-sm-3 col-xs-6">
 
<a href="#Peshawar" aria-controls="Peshawar" role="tab" data-toggle="tab">
 
<a href="#Peshawar" aria-controls="Peshawar" role="tab" data-toggle="tab">
<img src="https://static.igem.org/mediawiki/2016/b/b2/T--Technion_Israel--peshawar350x250.jpg" class="img-responsive img-center collaboration_logo" width="175" height="125">
+
<img src="https://static.igem.org/mediawiki/2016/b/b2/T--Technion_Israel--peshawar350x250.jpg" class="img-responsive img-center cont_tabs" width="175" height="125">
 
<br><h4 class="text-center"><b>iGEM Peshawar</b></h4>
 
<br><h4 class="text-center"><b>iGEM Peshawar</b></h4>
 
</a>
 
</a>
Line 221: Line 122:
 
<li role="presentation" class="col-sm-3 col-xs-6">
 
<li role="presentation" class="col-sm-3 col-xs-6">
 
<a href="#Aachen" aria-controls="Aachen" role="tab" data-toggle="tab">
 
<a href="#Aachen" aria-controls="Aachen" role="tab" data-toggle="tab">
<img src="https://static.igem.org/mediawiki/2016/8/8f/T--Technion_Israel--Aachen350x250.jpg" class="img-responsive img-center collaboration_logo" width="175" height="125">
+
<img src="https://static.igem.org/mediawiki/2016/8/8f/T--Technion_Israel--Aachen350x250.jpg" class="img-responsive img-center cont_tabs" width="175" height="125">
 
<br><h4 class="text-center"><b>iGEM Aachen</b></h4>
 
<br><h4 class="text-center"><b>iGEM Aachen</b></h4>
 
</a>
 
</a>
Line 228: Line 129:
 
<li role="presentation" class="col-sm-3 col-xs-6">
 
<li role="presentation" class="col-sm-3 col-xs-6">
 
<a href="#BGU" aria-controls="BGU" role="tab" data-toggle="tab">
 
<a href="#BGU" aria-controls="BGU" role="tab" data-toggle="tab">
<img src="https://static.igem.org/mediawiki/2016/2/20/T--Technion_Israel--BGU350x250.jpg" class="img-responsive img-center collaboration_logo" width="175" height="125">
+
<img src="https://static.igem.org/mediawiki/2016/2/20/T--Technion_Israel--BGU350x250.jpg" class="img-responsive img-center cont_tabs" width="175" height="125">
 
<br><h4 class="text-center"><b>iGEM BGU</b></h4>
 
<br><h4 class="text-center"><b>iGEM BGU</b></h4>
 
</a>
 
</a>
Line 235: Line 136:
 
<li role="presentation" class="col-sm-3 col-xs-6">
 
<li role="presentation" class="col-sm-3 col-xs-6">
 
<a href="#Eindhoven" aria-controls="Eindhoven" role="tab" data-toggle="tab">
 
<a href="#Eindhoven" aria-controls="Eindhoven" role="tab" data-toggle="tab">
<img src="https://static.igem.org/mediawiki/2016/c/c0/T--Technion_Israel--Eindhoven350x250.jpg" class="img-responsive img-center collaboration_logo" width="175" height="125">
+
<img src="https://static.igem.org/mediawiki/2016/c/c0/T--Technion_Israel--Eindhoven350x250.jpg" class="img-responsive img-center cont_tabs" width="175" height="125">
 
<br><h4 class="text-center"><b>iGEM Eindhoven</b></h4>
 
<br><h4 class="text-center"><b>iGEM Eindhoven</b></h4>
 
</a>
 
</a>
Line 265: Line 166:
 
<div class="row"><!-- #1 row -->
 
<div class="row"><!-- #1 row -->
 
<div class="col-sm-10 col-sm-offset-1">
 
<div class="col-sm-10 col-sm-offset-1">
<div class="coll_par">
+
<div class="cont_box">
 
<div class="row">
 
<div class="row">
 
<a id="guidance"></a>
 
<a id="guidance"></a>
Line 282: Line 183:
  
 
<div class="col-md-6 col-sm-12 no-title-col">
 
<div class="col-md-6 col-sm-12 no-title-col">
<img src="http://freshdirtdesigns.com/blog/wp-content/uploads/2011/12/image_350x200_placeholder.png" class="img-responsive img-center img-peshawar">
+
<img src="http://freshdirtdesigns.com/blog/wp-content/uploads/2011/12/image_350x200_placeholder.png" class="img-responsive img-center img-cont">
 
</div>
 
</div>
  
Line 295: Line 196:
 
<div class="row"><!-- #2 row -->
 
<div class="row"><!-- #2 row -->
 
<div class="col-sm-10 col-sm-offset-1">
 
<div class="col-sm-10 col-sm-offset-1">
<div class="coll_par">
+
<div class="cont_box">
 
<div class="row">
 
<div class="row">
 
<a id="modeling"></a>
 
<a id="modeling"></a>
Line 301: Line 202:
  
 
<div class="col-md-6 col-sm-12 new-row no-title-col">
 
<div class="col-md-6 col-sm-12 new-row no-title-col">
<img src="http://freshdirtdesigns.com/blog/wp-content/uploads/2011/12/image_350x200_placeholder.png" class="img-responsive img-center img-peshawar">
+
<img src="http://freshdirtdesigns.com/blog/wp-content/uploads/2011/12/image_350x200_placeholder.png" class="img-responsive img-center img-cont">
 
</div>
 
</div>
  
Line 323: Line 224:
 
<div class="row"><!-- #3 row -->
 
<div class="row"><!-- #3 row -->
 
<div class="col-sm-10 col-sm-offset-1">
 
<div class="col-sm-10 col-sm-offset-1">
<div class="coll_par">
+
<div class="cont_box">
 
<div class="row">
 
<div class="row">
 
<a id="human"></a>
 
<a id="human"></a>
Line 338: Line 239:
  
 
<div class="col-md-6 col-sm-12 no-title-col">
 
<div class="col-md-6 col-sm-12 no-title-col">
<img src="http://freshdirtdesigns.com/blog/wp-content/uploads/2011/12/image_350x200_placeholder.png" class="img-responsive img-center img-peshawar">
+
<img src="http://freshdirtdesigns.com/blog/wp-content/uploads/2011/12/image_350x200_placeholder.png" class="img-responsive img-center img-cont">
 
</div>
 
</div>
  
Line 351: Line 252:
 
<div class="row"><!-- #4 row -->
 
<div class="row"><!-- #4 row -->
 
<div class="col-sm-10 col-sm-offset-1">
 
<div class="col-sm-10 col-sm-offset-1">
<div class="coll_par">
+
<div class="cont_box">
 
<div class="row">
 
<div class="row">
 
<a id="cloning"></a>
 
<a id="cloning"></a>
Line 357: Line 258:
  
 
<div class="col-md-6 col-sm12 new-row no-title-col">
 
<div class="col-md-6 col-sm12 new-row no-title-col">
<img src="http://freshdirtdesigns.com/blog/wp-content/uploads/2011/12/image_350x200_placeholder.png" class="img-responsive img-center img-peshawar">
+
<img src="http://freshdirtdesigns.com/blog/wp-content/uploads/2011/12/image_350x200_placeholder.png" class="img-responsive img-center img-cont">
 
</div>
 
</div>
  

Revision as of 09:11, 8 October 2016

S.tar, by iGEM Technion 2016

S.tar, by iGEM Technion 2016


iGEM - Peshawar

Guidance

At the beginning we contacted Peshawar iGEM group because we discovered that both projects deal with detection. When we realized that the Peshawar group is the first team to represent Pakistan in iGEM we decided to share with them the knowledge that was accumulated from past Technion iGEM teams. The first step was to open a joint Facebook group, so each team member from every group would be able to find his colleague on the opposite team. Later, we had Skype sessions regarding mathematical modeling, Human practices and Cloning.


Mathematical modeling

We modeled Peshawar iGEM group's system using differential equations and logic gates. The aim of the work was to predict the expression of the reporter protein when the concentration of the inducer is given. צריך לבקש מנופר שתעבור על זה


Human prctices

We shared with Peshawar iGEM group the layout of our educational program. In addition, we gave the team advices regarding an appeal to the government with a request to promote the education in the field of Synthetic Biology.


Cloning

Peshawar had issues with the transformation of plasmids into competent cells. They elaborated on the exact steps they did in the lab and we tried to debug their procedure.
We also shared with team Peshawar our protocol for chemical transformation(3) and the protocol for producing competent cells(4).
After following our instructions the Peshawar team managed to perform a successful transformation.

1











1











1











1
333 1











1











1











1
444 1











1











1











1
S.tar, by iGEM Technion 2016