Difference between revisions of "Template:Toulouse France/menu"

Line 1: Line 1:
 
{{Toulouse_France}}
 
{{Toulouse_France}}
 +
{{Toulouse_France/menu}}
 
<html>
 
<html>
−
<!--- THIS IS WHERE THE HTML BEGINS --->
 
  
 +
<!-- Content wrapper permet de configurer le body, moi j'ai rien touché sur celui d'iGEM c'était propre et puis c'est facile à retenir ! -->
  
−
<!-- This tells the browser that your page is responsive -->
+
<div class="content_wrapper">
  
−
<head>
+
<div class="column full_size">
−
<meta name="viewport" content="width=device-width, initial-scale=1">
+
−
</head>
+
  
 +
<p align="justify" style="font-size:15px; padding: 15px 50px;">
 +
 +
<b style="font-size:16px;">Why did we choose this subject?</b>
 +
 +
<br>
 +
<br>
 +
 +
After months of intense brainstorming, we finally decided to work on the conservation of the Lascaux
  
 +
cave. We wanted to choose a project that was personal and original.
 +
 +
<br>
 +
<br>
  
−
<html>
+
The Lascaux cave then imposed itself. It is part of the French heritage, and was added to the UNESCO
  
−
<!-- Ca tu pourrais le mettre dans un template menu, il faut inclure le CSS du menu avec ton html de menu pour que la mise en page reste -->
+
World Heritage Sites list.
 +
 +
<br>
 +
It has been threatened of destruction since decades now, and organizations
  
−
<!-- ################################################################################################ -->
+
from all around the world have gathered to solve the Lascaux cave crisis.
−
<!-- ################################################################################################ -->
+
−
<!-- ########################  BARRE NOIRE ###################################################### -->
+
<br>
−
+
  
−
<div id="topbar" class="hoc clear">
+
The Lascaux cave is what traces us back to our humanity. The first men lived there and some of the first
−
<p>Follow us &#64;           
+
−
<a href="https://www.facebook.com/pages/iGEM-Toulouse-2015/1604834019761538?ref=aymt_homepage_panel"><img src="https://static.igem.org/mediawiki/2016/3/3a/Toulouse_France_fb.png" style="width:2%;"/></a>
+
−
<a href="https://twitter.com/igem_toulousefr"><img src="https://static.igem.org/mediawiki/2016/6/6a/Toulouse_France_twitter2.png" style="width:2%;"/></a>
+
−
<a href="https://fr.ulule.com/paleobtilis/"><img src="https://static.igem.org/mediawiki/2016/4/46/Toulouse_France_Ulule_logo.png" style="width:3%; background-color:rgba(255,255,255,0.3);"/></a>
+
−
</p>
+
−
</div>
+
  
−
+
pieces of art ever were created there.
−
<!-- ################################################################################################ -->
+
−
<!-- ################################################################################################ -->
+
<br>
−
<!-- #############################  NAVIGATEUR + PORTION EN DESSOUS  ################################################# -->
+
<br>
−
+
−
<!-- Top Background Image Wrapper -->
+
  
−
<style>
+
Combining art and science was an interesting idea, but we wanted a system that could be used in
  
−
/* Top Bar
+
other disciplines as well, like public health. There is always risks of fungal infection
−
--------------------------------------------------------------------------------------------------------------- */
+
−
#topbar{padding:2px 15px; font-size:.9rem; text-transform:uppercase;}
+
−
#topbar *{margin:0;}
+
−
#topbar ul li{display:initial; margin-right:10px; padding-right:10px; border-right:1px solid;}
+
−
#topbar ul li:last-child{margin-right:10px; padding-right:10px; border-right:none;}
+
−
#topbar i{margin:0px 5px 0px 0px; line-height:normal;}
+
−
+
−
/* Top Bar Colour */
+
−
#topbar{color:#CBCBCB; background-color:#000000;}
+
−
#topbar ul li{border-color:rgba(255,255,255,.2);}
+
−
#topbar > div:last-of-type li:first-child a{color:#66CCCC;}
+
  
−
/* ------------------------------------------------------------------------------------------------------------ */
+
in health institutions, where the situation has some similarities with the Lascaux cave (biofilm of
−
/* ------------------------------------------------------------------------------------------------------------ */
+
  
 +
bacteria as a nutritive source for fungi). Our solution could be used to solve this problem.
 +
 +
</p>
  
−
/* Navigation
+
<!-- main body -->
−
--------------------------------------------------------------------------------------------------------------- */
+
<div style="width:80%; margin-left:auto; margin-right:auto; padding:20px 5px;">
−
nav ul, nav ol{margin:0; padding:0; list-style:none;}
+
<!-- ###################### 3 ENCADRES ########################################################### -->
 +
 +
<article class="one_third"><a href="#"><img src="https://static.igem.org/mediawiki/2016/0/0e/Toulouse_France_taureaux.jpg" alt=""></a>
 +
<h4 class="heading2">Our solution</h4>
 +
<p>We propose a biological solution&hellip;</p>
 +
<p class="nospace"><a href="https://2016.igem.org/Team:Toulouse_France/Project">Read More &raquo;</a></p>
 +
</article>
  
−
#mainav, #breadcrumb, .sidebar nav{line-height:normal;}
+
<article class="one_third"><a href="#"><img src="https://static.igem.org/mediawiki/2016/0/02/Toulouse_France_boiteChampi.jpg" alt=""></a>
 +
<h4 class="heading2">Our results</h4>
 +
<p>...</p>
 +
<footer><a class="nospace" href="">Read More &raquo;</a></footer>
 +
</article>
  
−
/* Top Navigation */
+
<article class="one_third"><a href="#"><img src="https://static.igem.org/mediawiki/2016/7/72/Toulouse_France_deviceTest1.png" alt=""></a>
−
#mainav{}
+
<h4 class="heading2">Our Device</h4>
−
#mainav ul.clear{margin-top:0px;}
+
<p>Our bacteria is confined in&hellip;</p>
−
#mainav ul{text-transform:uppercase}
+
<p class="nospace"><a href="https://2016.igem.org/Team:Toulouse_France/Project#Confinement">Read More &raquo;</a></p>
−
#mainav ul ul{z-index:9999; position:absolute; width:230px; text-transform:none;}
+
</article>
−
#mainav ul ul ul{left:180px; top:0;}
+
</div>
−
#mainav li{display:inline-block; position:relative; margin:0 8px 0 0; padding:0;}
+
−
#mainav li:last-child{margin-right:0;}
+
−
#mainav li li{width:100%; margin:0;}
+
−
#mainav li a{display:block; padding:10px 10px;}
+
−
#mainav li li a{border:solid; border-width:0 0 1px 0;}
+
−
#mainav li li a, #mainav li li .drop{display:block; margin:0; padding:10px 15px;}
+
−
#mainav li li .drop::after{top:15px; left:5px;}
+
−
#mainav ul ul{visibility:hidden; opacity:0;}
+
−
#mainav ul li:hover > ul{visibility:visible; opacity:1;}
+
  
−
#mainav form{display:none; margin:0; padding:0;}
 
−
#mainav form select, #mainav form select option{display:block; cursor:pointer; outline:none;}
 
−
#mainav form select{width:100%; padding:5px; border:none;}
 
−
#mainav form select option{margin:5px; padding:0; border:none;}
 
  
−
 
+
<!-- Ici ça marche pas, je ne sais pas où est le wrapper bgded overlay -->
−
/* Navigation Colour */
+
−
#mainav{color:#FFFFFF; background-color:rgba(255,255,255,.2);}
+
−
#mainav li a{color:inherit;}
+
−
#mainav .active a, #mainav a:hover, #mainav li:hover > a{color:#66CCCC; background-color:inherit;}
+
−
#mainav li li a, #mainav .active li a{color:#FFFFFF; background-color:rgba(0,0,0,.7); border-color:rgba(0,0,0,.8);}
+
−
#mainav li li:hover > a, #mainav .active .active > a{color:#FFFFFF; background-color:#66CCCC;}
+
−
#mainav form select{color:#FFFFFF; background-color:#000000;}
+
−
 
+
−
 
+
−
.container .sidebar nav a{color:inherit; border-color:#D7D7D7;}
+
−
.container .sidebar nav a:hover{color:#66CCCC;}
+
−
 
+
−
/* Ici faut que tu mettes le code dessus dans ton template CSS */
+
−
 
+
−
+
−
+
−
+
−
/* Page Intro
+
−
--------------------------------------------------------------------------------------------------------------- */
+
−
#pageintro{padding:180px 0;}
+
−
 
+
−
#pageintro article{max-width:100%;}
+
−
#pageintro article *{text-transform:uppercase;}
+
−
#pageintro article .heading{margin:0 0 50px 0; padding:0; line-height:1; font-size:32px;}
+
−
#pageintro article p{margin:0;}
+
−
#pageintro article h2{font-size:28px;}
+
−
#pageintro article p:first-of-type{margin-bottom:35px; font-size:32px; letter-spacing:5px;}
+
−
#pageintro article footer{margin-top:60px;}
+
−
+
−
/* Page Intro Colour
+
−
---------------------------------------------------------------------------------------------------------------*/
+
−
#pageintro{color:#FFFFFF;}
+
−
#pageintro article h2{color:#FFFFFF;}
+
−
 
+
−
/* Sonsor */
+
−
.sponsor{margin:20px 0px;}
+
−
.sponsor, .sponsor a{color:#FFFFFF; background-color:#FFFFFF;}
+
−
 
+
−
 
+
−
/* Header */
+
−
#header #logo h1 a{color:inherit;}
+
−
 
+
−
 
+
−
/* Content Area */
+
−
.excerpt .excerpttxt{color:inherit; background-color:#FFFFFF;}
+
−
 
+
−
 
+
−
/* Footer */
+
−
#footer .title{color:#FFFFFF;}
+
−
#footer .linklist li{border-color:rgba(255,255,255,.4);}  /* couleur des barres séparatrices */
+
−
#footer .footertxt{background-color:rgba(255,255,255,.3);}
+
−
 
+
−
/* back to top */
+
−
+
−
.anchor {
+
−
height: 30px;
+
−
position: fixed;
+
−
bottom: 20px;
+
−
right: 30px;
+
−
z-index: 1000;
+
−
cursor: pointer;
+
−
-webkit-transition: all ease 0.4s;
+
−
-moz-transition: all ease 0.4s;
+
−
-ms-transition: all ease 0.4s;
+
−
-o-transition: all ease 0.4s;
+
−
transition: all ease 0.4s;
+
−
}
+
−
 
+
−
 
+
−
+
−
/* ------------------------------------------------------------------------------------------------------------ */
+
−
/* ------------------------------------------------------------------------------------------------------------ */
+
−
/* ------------------------------------------------------------------------------------------------------------ */
+
−
/* ------------------------------------------------------------------------------------------------------------ */
+
−
/* ------------------------------------------------------------------------------------------------------------ */
+
−
 
+
−
 
+
−
/* Media Queries
+
−
--------------------------------------------------------------------------------------------------------------- */
+
−
@-ms-viewport{width:device-width;}
+
−
 
+
−
 
+
−
/* Max Wrapper Width - Laptop, Desktop etc.
+
−
--------------------------------------------------------------------------------------------------------------- */
+
−
@media screen and (min-width:100%){
+
−
.hoc{max-width:100%;}
+
−
}
+
−
 
+
−
 
+
−
/* Mobile Devices
+
−
--------------------------------------------------------------------------------------------------------------- */
+
−
@media screen and (max-width:100%){
+
−
.hoc{max-width:100%;}
+
−
 
+
−
#topbar{}
+
−
 
+
−
#header{padding:30px 0;}
+
−
#header #logo{margin:0;}
+
−
 
+
−
#mainav{}
+
−
#mainav ul{display:none;}
+
−
#mainav form{display:block; margin-top:8px;}
+
−
 
+
−
 
+
−
.container{}
+
−
#comments input[type="reset"]{margin-top:10px;}
+
−
+
−
 
+
−
#footer{}
+
−
 
+
−
#copyright{}
+
−
#copyright p:first-of-type{margin-bottom:8px;}
+
−
}
+
−
 
+
−
 
+
−
@media screen and (max-width:100%){
+
−
.imgl, .imgr{display:inline-block; float:none; margin:0 0 10px 0;}
+
−
.fl_left, .fl_right{display:block; float:none;}
+
−
.one_half, .one_third, .two_third, .one_quarter, .two_quarter, .three_quarter{display:block; float:none; width:auto; margin:0 0 30px 0; padding:0;}
+
−
 
+
−
#topbar{padding-top:5px; text-align:center;}
+
−
#topbar ul{margin:0 0 2px 0; line-height:normal;}
+
−
 
+
−
#header{text-align:center;}
+
−
#header #logo{margin:0 0 30px 0;}
+
−
 
+
−
#mainav form{margin-top:0;}
+
−
 
+
−
#pageintro article{max-width:none;}
+
−
}
+
−
 
+
−
 
+
−
@media screen and (max-width:100%){
+
−
#topbar ul li{margin-bottom:2px; padding-right:0; border-right:none;}
+
−
}
+
−
 
+
−
 
+
−
/* Other
+
−
--------------------------------------------------------------------------------------------------------------- */
+
−
@media screen and (max-width:100%){
+
−
.scrollable{display:block; width:100%; margin:0 0 30px 0; padding:0 0 15px 0; overflow:auto; overflow-x:scroll;}
+
−
.scrollable table{margin:0; padding:0; white-space:nowrap;}
+
−
 
+
−
.inline li{display:block; margin-bottom:10px;}
+
−
.pushright li{margin-right:0;}
+
−
 
+
−
.font-x2{font-size:1.4rem;}
+
−
.font-x3{font-size:1.6rem;}
+
−
}
+
−
 
+
−
/* Social Icons
+
−
---------------------------------------------------------------------------------------------------------------*/
+
−
.faico{margin:0px; padding:0; list-style:none;}
+
−
.faico li{display:inline-block; margin:0 2px 0 0; padding:0; line-height:10px;}
+
−
.faico li:last-child{margin-right:0;}
+
−
.faico a{display:inline-block; width:auto; height:auto; line-height:20px; border-radius:5px; font-size:16px; text-align:center;}
+
−
.faico img{width: 2%;}
+
−
+
−
.faico a{color:inherit; }
+
−
.faico a:hover{color:#FFFFFF;}
+
−
+
−
.faico2{margin:0px; padding:0; list-style:none;}
+
−
.faico2 li{display:inline-block; margin:0 2px 0 0; padding:0; line-height:10px;}
+
−
.faico2 li:last-child{margin-right:0;}
+
−
.faico2 a{display:inline-block; width:auto; height:auto; line-height:20px; border-radius:5px; font-size:16px; text-align:center;}
+
−
.faico2 img{width: 20%; margin:15px;}
+
−
+
−
.faico2 a{color:inherit; }
+
−
.faico2 a:hover{color:#FFFFFF;}
+
−
 
+
−
 
+
−
 
+
−
</style>
+
−
 
+
−
<div class="page" style="background-image:url('https://static.igem.org/mediawiki/2016/4/43/Toulouse_France_PanneauEmpreinte.jpg');">
+
−
 
+
−
<header id="header" class="hoc clear">
+
−
<!-- POURQUOI ICI ? MathJax is a JavaScript library for displaying mathematical equations. A copy of MathJax 2.5 is installed on 2015.igem.org -->
+
−
<script src="https://2015.igem.org/common/MathJax-2.5-latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
+
−
 
+
−
<nav id="mainav">
+
−
<ul class="clear">
+
−
<li class="active"><a href="https://2016.igem.org/Team:Toulouse_France">Home</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Team">Team</a>
+
−
<ul>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Team#Presentation">Presentation</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Team#FunFacts">Fun Facts</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Team#Gallery">Gallery</a></li>
+
−
</ul>
+
−
</li>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Project">Project</a>
+
−
<ul>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Description">Description</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Design#Predation">Design : Predation</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Design#Antifungals">Design : Antifungals</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Design#Confinement">Design : Confinement</a></li>
+
−
</ul>
+
−
</li>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Results">Results</a>
+
−
<ul>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Results#Predation">Module : Predation</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Results#Antifungals">Module : Antifungals</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Results#Confinement">Module : Confinement</a></li>
+
−
</ul>
+
−
</li>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Model">Modeling</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Application">Application</a>
+
−
<ul>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Application#LaboratoryCave">Laboratory Cave</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Application#LegalIssues">Legal Issues</a></li>
+
−
</ul>
+
−
</li>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Wetlab">Wet Lab</a>
+
−
<ul>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Notebook">Notebook</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Protocols">Protocols</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Safety">Safety</a></li>
+
−
</ul>
+
−
</li>  
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Parts">Parts</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Ethics">Ethics</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Human_Practices">Human Practice</a>
+
−
<ul>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Human_Practices#Meetups">Meet ups</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Collaborations">Collaboration</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Human_Practices#Education">Education</a></li>
+
−
</ul>
+
−
</li>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Attributions">Attributions</a>
+
−
<ul>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Attributions#Aknowledgements">Aknowledgements</a></li>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Attributions#Supports">Supports</a></li>
+
−
</ul>
+
−
</li>
+
−
<li><a href="https://2016.igem.org/Team:Toulouse_France/Contact">Contacts</a></li>
+
−
</ul>
+
−
</nav>
+
−
</header>
+
  
 
<!-- ################################################################################################ -->
 
<!-- ################################################################################################ -->
 
<!-- ################################################################################################ -->
 
<!-- ################################################################################################ -->
−
<!-- ################################################################################################ -->
+
<!-- #############################  CITATIONS  ########################################## -->
−
<div id="pageintro" class="hoc clear">  
+
−
<article align="justify">
+
<div class="wrapper bgded overlay" style="background-image:url('https://static.igem.org/mediawiki/2016/4/4b/Toulouse_France_LascauxFresqueTaureaux.png');">
−
<center>
+
<article class="hoc container">
−
<p class="heading">iGEM Toulouse Team presents<br><br><i>Paleotilis, a shield for the Lascaux cave</i></p>
+
<!-- ################################################################################################ -->
−
<h2>Back to the origins<br><br></h2>
+
<div class="group btmspace-30">
−
<center><img src="https://static.igem.org/mediawiki/2016/1/19/Toulouse_France_logo2.png" style="width:20%;"></center>
+
<div class="fl_left" style="margin-right:20px;"><img src="" style="width:10%;" alt=""></div>
−
</center>
+
<div class="fl_left">
 +
<p class="nospace font-xs"></p>
 +
<h3 class="heading"></h3>
 +
</div>
 +
</div>
 +
<p style="font-size:70px">&#x275d; </p>
 +
<blockquote>"..."</blockquote>
 +
<p></p>
 +
<footer><a class="btn inverse" href="#">View More &raquo;</a></footer>
 +
<!-- ################################################################################################ -->
 
</article>
 
</article>
 
</div>
 
</div>
  
−
</div>
+
</html>
  
−
 
+
{{Toulouse_France/Footer}}
−
</html>
+

Revision as of 08:27, 25 August 2016

iGEM Toulouse 2016

Why did we choose this subject?

After months of intense brainstorming, we finally decided to work on the conservation of the Lascaux cave. We wanted to choose a project that was personal and original.

The Lascaux cave then imposed itself. It is part of the French heritage, and was added to the UNESCO World Heritage Sites list.
It has been threatened of destruction since decades now, and organizations from all around the world have gathered to solve the Lascaux cave crisis.
The Lascaux cave is what traces us back to our humanity. The first men lived there and some of the first pieces of art ever were created there.

Combining art and science was an interesting idea, but we wanted a system that could be used in other disciplines as well, like public health. There is always risks of fungal infection in health institutions, where the situation has some similarities with the Lascaux cave (biofilm of bacteria as a nutritive source for fungi). Our solution could be used to solve this problem.

Our solution

We propose a biological solution…

Read More »


Contacts
    🏠 INSA Toulouse
    135, Avenue de Rangueil
    31077 TOULOUSE Cedex 4
    France
  • ☎ +00 (33) 6 13 64 89 40
  • ✉ igemtoulouse2016@gmail.com