Difference between revisions of "Team:Pasteur Paris/Meet-up"

Line 5: Line 5:
 
<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,300,700' rel='stylesheet' type='text/css'>
 
<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,300,700' rel='stylesheet' type='text/css'>
 
<style type="text/css">
 
<style type="text/css">
 
  
 
body{
 
body{
Line 21: Line 20:
 
         margin-left:10%;
 
         margin-left:10%;
 
}
 
}
 +
h2{
 +
  font-family: 'Oswald', Arial, sans-serif;
 +
  margin-top:2%;
 +
  font-size:30px;
 +
  color:#17A3B5 ;
 +
  text-align: center;
 +
}
 +
  
 
.demo-2 {
 
.demo-2 {
Line 122: Line 129:
 
     list-style-type: none;  
 
     list-style-type: none;  
 
}
 
}
 +
 +
 +
 +
 +
/*slide gallery OUR METHODOLOGY*/
 +
* {box-sizing: border-box; }
 +
 +
.app2{
 +
  display: flex;
 +
  flex-wrap: wrap;
 +
  position:relative;
 +
  width:90%;
 +
  height: 450px;
 +
  border: #FFFFFF  solid;
 +
  margin:0px 10px 0px 0px;
 +
  -moz-border-radius:10px 10px;
 +
  -webkit-border-radius:10px 10px;
 +
  border-radius:10px 10px;
 +
  display: -webkit-flex;
 +
  display: -ms-flexbox;
 +
  display: flex;
 +
  -webkit-flex-wrap: wrap;
 +
  -ms-flex-wrap: wrap;
 +
  flex-wrap: wrap;
 +
}
 +
a {
 +
  text-decoration: none;
 +
  color: inherit; }
 +
 +
.gallery {
 +
  position: relative;
 +
  height: 480px;
 +
  margin-left:22%;
 +
  margin-top:35%;
 +
  text-align : justify;
 +
 
 +
}
 +
  .gallery .item {
 +
    position: absolute;
 +
    top: 0;
 +
    left: 0;
 +
    width: 70%;
 +
    height: 550px;
 +
    background: #FFFFFF ;
 +
    opacity: 0;
 +
    transition: opacity 0.25s; }
 +
 +
.gallery .item:first-of-type {
 +
      opacity: 1;
 +
}
 +
 +
.gallery .controls {
 +
    color: whiteSmoke;
 +
    color: #A8D5D8;
 +
    left: 1%;
 +
    position: absolute;
 +
    bottom: 0%;
 +
    width: 80%;
 +
    font-size: 3.5em;
 +
    text-align: center;
 +
}
 +
 +
.gallery .controls a {
 +
      transition: color 0.25s;
 +
}
 +
 +
.gallery .controls a:hover {
 +
      color: #17A3B5 ;
 +
      color: #17A3B5 ;
 +
}
 +
 +
 +
@keyframes galleryAnimation {
 +
  0% {
 +
    opacity: 0; }
 +
 +
  9.5%, 33% {
 +
    opacity: 1; }
 +
 +
  42.9%, 100% {
 +
    opacity: 0; } }
 +
 +
@keyframes controlAnimation {
 +
  0% {
 +
    color: whiteSmoke;
 +
    color:  #A8D5D8; }
 +
 +
  9.5%, 33% {
 +
    color: #17A3B5 ;
 +
    color: #17A3B5 ; }
 +
 +
  42.9%, 100% {
 +
    color: whiteSmoke;
 +
    color:  #A8D5D8; } }
 +
 +
 +
.gallery .control-operator {
 +
  display: none;
 +
}
 +
.gallery .control-operator:target ~ .item {
 +
  animation: none;
 +
}
 +
.gallery .control-operator:target ~ .controls .control-item {
 +
  color: whiteSmoke;
 +
  color:  #A8D5D8;
 +
  animation: none;
 +
}
 +
.gallery .control-operator:nth-of-type(1):target ~ .item:nth-of-type(1) {
 +
  opacity: 1;
 +
}
 +
.gallery .control-operator:nth-of-type(1):target ~ .controls .control-item:nth-of-type(1) {
 +
  color: #17A3B5 ;
 +
  color: #17A3B5 ;
 +
}
 +
 +
.gallery .control-operator:nth-of-type(2):target ~ .item:nth-of-type(2) {
 +
  opacity: 1;
 +
}
 +
.gallery .control-operator:nth-of-type(2):target ~ .controls .control-item:nth-of-type(2) {
 +
  color: #17A3B5 ;
 +
  color: #17A3B5 ;
 +
}
 +
 +
.gallery .control-operator:nth-of-type(3):target ~ .item:nth-of-type(3) {
 +
  opacity: 1;
 +
}
 +
.gallery .control-operator:nth-of-type(3):target ~ .controls .control-item:nth-of-type(3) {
 +
  color: #17A3B5 ;
 +
  color: #17A3B5 ;
 +
}
 +
 +
.gallery .control-operator:nth-of-type(4):target ~ .item:nth-of-type(4) {
 +
  opacity: 1;
 +
}
 +
.gallery .control-operator:nth-of-type(4):target ~ .controls .control-item:nth-of-type(4) {
 +
  color: #17A3B5 ;
 +
  color: #17A3B5 ;
 +
}
 +
 +
 +
#text2 {
 +
  position: relative; /* on positionne le conteneur */
 +
  margin-right: auto;
 +
  margin-left:25%;
 +
  width:58%;
 +
  text-align : justify;
 +
  margin-top:3%;
 +
  font-size: 16px
 +
}
 +
 +
table {
 +
background: #fafaf;
 +
border-collapse: separate;
 +
box-shadow: inset 0 1px 0 #fff;
 +
font-size: 15px;
 +
line-height: 25px;
 +
margin: 30px auto;
 +
text-align: center;
 +
width: 60%;
 +
}
 +
     
 +
 +
th:after {
 +
background: linear-gradient(rgba(255,255,255,0), rgba(255,255,255,.08));
 +
content: '';
 +
display: block;
 +
height: 25%;
 +
left: 0;
 +
margin: 1px 0 0 0;
 +
position: absolute;
 +
top: 25%;
 +
width: 100%;
 +
}
 +
 +
th:first-child {
 +
border-left: 1px solid #777;
 +
box-shadow: inset 1px 1px 0 #999;
 +
}
 +
 +
th:last-child {
 +
box-shadow: inset -1px 1px 0 #999;
 +
}
 +
 +
td {
 +
border-right: 1px solid #fff;
 +
border-left: 1px solid #e8e8e8;
 +
border-top: 1px solid #fff;
 +
border-bottom: 1px solid #e8e8e8;
 +
padding: 10px 15px;
 +
position: relative;
 +
transition: all 300ms;
 +
}
 +
 +
td:first-child {
 +
box-shadow: inset 1px 0 0 #fff;
 +
}
 +
 +
td:last-child {
 +
border-right: 1px solid #e8e8e8;
 +
box-shadow: inset -1px 0 0 #fff;
 +
}
 +
 +
  
 
</style>
 
</style>
Line 128: Line 338:
 
<h1><B>Meet-up</B></h1>
 
<h1><B>Meet-up</B></h1>
 
   
 
   
 +
 +
 +
<h1><B>Meet-up</B></h1>
 +
<div>
 
<ul class="demo-2 effect">
 
<ul class="demo-2 effect">
 
     <li>
 
     <li>
Line 143: Line 357:
 
    
 
    
 
</ul>
 
</ul>
 +
</div>
 +
 +
<div id="IDF">
 +
<div class="gallery">
 +
 +
    <div id="class="control-item" " class="control-operator"></div>
 +
    <div id="item-2" class="control-operator"></div>
 +
    <div id="item-3" class="control-operator"></div>
 +
    <div id="item-4" class="control-operator"></div>
 +
 +
    <figure class="item">   
 +
      <p><div><center><a href="#"><img class="app2" src="https://static.igem.org/mediawiki/2016/c/cd/IDF_groupe_Pasteur.jpg"  alt="" /></a></center></div> 
 +
    </p>
 +
    </figure>
 +
 +
    <figure class="item">
 +
      <p><div><center><a href="#"><img class="app2" src="https://static.igem.org/mediawiki/2016/e/e4/IDF_Intellectual_proprety.jpg"  alt="" /></a></center></div>
 +
    </figure>
 +
 +
    <figure class="item">
 +
      <p><div><center><a href="#"><img class="app2" src="https://static.igem.org/mediawiki/2016/e/e8/IDF_PASTEUR.jpg"  alt="" /></a></center></div>
 +
    </figure>
 +
 +
<figure class="item">
 +
      <p><div><center><a href="#"><img class="app2" src="https://static.igem.org/mediawiki/2016/4/41/IDF_some_fun_Pasteur.jpg"  alt="" /></a></center></div>
 +
    </figure>
 +
 +
    <div class="controls">
 +
      <a class="control-item" href="#item-1">•</a>
 +
      <a class="control-item" href="#item-2">•</a>
 +
      <a class="control-item" href="#item-3">•</a>
 +
      <a class="control-item" href="#item-4">•</a>
 +
    </div>
 +
  </div>
 +
 +
<div id="text2"><p><h2><B>Meet-up Ile-de-France</B></h2>
 +
We brought ideas generations tools and methods that are proper to the design discipline. </br>
 +
For exemple, several brainstorming sessions allowed us to unleash the creativity of the team : a first one focus on the « idea generation » to choose the topic of our project, a second one to elaborate the scenarios, and a third to develop the technical devices specifications.</br></br>
 +
These working sessions allowed us to collect a lot of different ideas in a fun way, then had to organize it in the better way to reuse it.</br></br>
 +
 +
 +
<table>
 +
  <tbody>
 +
    <tr>
 +
      <td><strong><p>Deshmukh GOPAUL</p></strong></td>
 +
      <td>Institut Pasteur</td>
 +
      <td>PI iGEM Pasteur</td>
 +
    </tr>
 +
    <tr>
 +
      <td><strong><p>Fabio MASCHI</p></strong></td>
 +
      <td>Universite Paris Sud</td>
 +
      <td>Advisor iGEM Paris-Saclay</td>
 +
    </tr>
 +
    <tr>
 +
      <td><strong><p>Guillian GRAVES</p></strong></td>
 +
      <td>ENSCI</td>
 +
      <td>Instructor iGEM Pasteur</td>
 +
    </tr>
 +
    <tr>
 +
      <td><strong><p>Mathis FUNK</p></strong></td>
 +
      <td>Institut de Cancerologie Gustave Roussy</td>
 +
      <td>PhD student (Identification and characterization of endogenous retroviral envelope genes implicated in establishment and persistence of epitheliochorial placentas)</td>
 +
    </tr>       
 +
    <tr>
 +
      <td><strong><p>Matthieu FRITZ</p></strong></td>
 +
      <td>Institut Pasteur</td>
 +
      <td>PhD student (molecular genetics of RNA viruses)</td>
 +
    </tr>
 +
  </tbody>
 +
</table></br></br>
 +
 +
The cherry on top of the Meetup was the quick demonstration of a drone given by a start-up company from Montreuil named ’Civic drone’ during the lunch break, but also the picnic in the hidden garden of the Pasteur Institute where all the teams gathered and bonded over wine and sandwiches.
 +
 +
 +
 +
 +
</p></div>
 +
 +
</div>
 +
 +
 +
<h2><B>The European experience</B></h2>
 +
<div class="gallery">
 +
    <div id="class="control-item" " class="control-operator"></div>
 +
    <div id="item-6" class="control-operator"></div>
 +
    <div id="item-7" class="control-operator"></div>
 +
 +
    <figure class="item2">   
 +
      <p><div><center><a href="#"><img class="app2" src="https://static.igem.org/mediawiki/2016/d/d7/Initiation_1_Pasteur.jpg"  alt="" /></a></center></div> 
 +
    </p>
 +
    </figure>
 +
 +
    <figure class="item2">
 +
      <p><div><center><a href="#"><img class="app2" src="https://static.igem.org/mediawiki/2016/c/c5/Initiation_2_Pasteur.jpg"  alt="" /></a></center></div>
 +
    </figure>
 +
 +
    <figure class="item2">
 +
      <p><div><center><a href="#"><img class="app2" src="https://static.igem.org/mediawiki/2016/3/33/Initiation_3_Pasteur.jpg"  alt="" /></a></center></div>
 +
    </figure>
 +
 +
    <div class="controls2">
 +
      <a class="control-item2" href="#item-5">•</a>
 +
      <a class="control-item2" href="#item-6">•</a>
 +
      <a class="control-item2" href="#item-7">•</a>
 +
    </div>
 +
  </div>
 +
 +
 +
<div id="text2"><p>As the project progresses, we realized that it was necessary for the team members to discover and learn the communications tools. So we decided to organise two introductory sessions to discover the Photoshop software (photo retouching) and Indesign (layout and impress). Students in science and law appropriate these tools to help in the creation of the communication media.</br></br>
 +
Moreover, Hanifa was able to reuse these knowledge to code this beautiful wiki! It's all about sharing knowledge!
 +
</br></br>
 +
 +
  
  

Revision as of 00:12, 5 October 2016