|
|
| Line 1: |
Line 1: |
| | {{UCLouvain}} | | {{UCLouvain}} |
| | + | {{UCLouvainHeaderSecond}} |
| | <html> | | <html> |
| − | <head>
| + | <div class="site-hero_2"> |
| − | <title>iGEM UCLouvain Team</title> | + | <div class="page-title"> |
| − | | + | <div class="big-title montserrat-text uppercase">our project</div> |
| − | <style>
| + | <div class="small-title montserrat-text uppercase">overview</div> |
| − | .igem_2017_content_wrapper html,
| + | </div> |
| − | .igem_2017_content_wrapper body,
| + | </div> |
| − | .igem_2017_content_wrapper div,
| + | <section class="services"> |
| − | .igem_2017_content_wrapper span, | + | <div class="container"> |
| − | .igem_2017_content_wrapper p,
| + | <div class="col-md-7 col-sm-12 services-left wow fadeInUp"> |
| − | .igem_2017_content_wrapper a,
| + | <div class="row" style="margin-bottom:50px"> |
| − | .igem_2017_content_wrapper img,
| + | <div class="col-md-6 col-sm-12"> |
| − | .igem_2017_content_wrapper ul,
| + | <div class="row"> |
| − | .igem_2017_content_wrapper li,
| + | <a href="" style="color:#60606e;"><i class="icon ion-arrow-graph-up-right"></i> |
| − | .igem_2017_content_wrapper footer,
| + | <span class="montserrat-text uppercase service-title">Global issue</span> |
| − | .igem_2017_content_wrapper header,
| + | <p style="padding-right: 30px;">For several years, our exposition to UV rays has <b>increased</b> and scientists noticed an <b>upward trend</b> in risks of developing skin cancers.</p></a> |
| − | .igem_2017_content_wrapper nav,
| + | </div> |
| − | .igem_2017_content_wrapper section {
| + | </div> |
| − | box-sizing: border-box !important;
| + | <div class="col-md-6 col-sm-12"> |
| − | margin: 0 !important; | + | <div class="row"> |
| − | padding: 0 !important;
| + | <a href="" style="color:#60606e;"><i class="icon ion-ios-glasses"></i> |
| − | border: 0 !important;
| + | <span class="montserrat-text uppercase service-title">Protection exists</span> |
| − | font-size: 100% !important;
| + | <p style="padding-right: 30px;">Although protections exist to avoid this issue, <b>we can’t feel the UV rays</b>, or too late.</p></a> |
| − | font: inherit !important;
| + | </div> |
| − | font-family: 'Roboto', 'Arial' !important;
| + | </div> |
| − | vertical-align: baseline !important;
| + | </div> |
| − | }
| + | <div class="row"> |
| − | .igem_2017_content_wrapper h2,
| + | <div class="col-md-6 col-sm-12"> |
| − | .igem_2017_content_wrapper h3 {
| + | <div class="row"> |
| − | box-sizing: border-box !important;
| + | <a href="" style="color:#60606e;"><i class="icon ion-android-watch"></i> |
| − | margin: 0 !important;
| + | <span class="montserrat-text uppercase service-title">Badge design</span> |
| − | padding: 10px 0 10px 0 !important;
| + | <p style="padding-right: 30px;">For that reason, we developed a <b>wearable UV-sensitive badge</b> so that people can be warned <b>anytime and anywhere</b> of their UV exposition. The badge turns red when exposed to UVs.</p></a> |
| − | border: 0 !important; | + | </div> |
| − | font-size: 100% !important; | + | </div> |
| − | font: inherit !important;
| + | <div class="col-md-6 col-sm-12"> |
| − | font-family: 'Roboto', 'Arial' !important;
| + | <div class="row"> |
| − | vertical-align: baseline !important;
| + | <a href="" style="color:#60606e;"><i class="icon ion-erlenmeyer-flask"></i> |
| − | }
| + | <span class="montserrat-text uppercase service-title">Culture design</span> |
| − | .igem_2017_content_wrapper footer,
| + | <p style="padding-right: 30px;">This badge contains a <b>liquid cell culture</b>. The cells are engineered so that they can produce a red fluorescent protein. They only produce it when the badge is exposed to UV rays, thanks to a <b>photocaged amino acid</b>.</p></a> |
| − | .igem_2017_content_wrapper header,
| + | </div> |
| − | .igem_2017_content_wrapper nav,
| + | </div> |
| − | .igem_2017_content_wrapper section {
| + | </div> |
| − | display: block !important;
| + | </div> |
| − | }
| + | |
| − | .igem_2017_content_wrapper body {
| + | |
| − | line-height: 1 !important;
| + | |
| − | }
| + | |
| − | .igem_2017_content_wrapper ul {
| + | |
| − | list-style: none !important; | + | |
| − | } | + | |
| | | | |
| − | /* | + | <div class="col-md-5 col-sm-12 services-right wow fadeInUp" data-wow-delay=".1s"> |
| − | Our styles | + | <div class="row"> |
| − | */ | + | <img src="assets/img/serv.jpg" alt="image"> |
| | + | </div> |
| | + | </div> |
| | | | |
| − | /* Import Roboto */
| + | </div> |
| − | @import url('https://fonts.googleapis.com/css?family=Roboto:300,400,700');
| + | </section> |
| − | | + | |
| − | .igem_2017_content_wrapper h1 {
| + | |
| − | display: none !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | .igem_2017_content_wrapper h2, .igem_2017_content_wrapper h3 {
| + | |
| − | font-weight: normal !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | .igem_2017_content_wrapper h2 {
| + | |
| − | font-size: 34px !important;
| + | |
| − | margin-bottom: 20px !important;
| + | |
| − | color: #222222 !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | .igem_2017_content_wrapper h2.smallclear {
| + | |
| − | margin-bottom: 5px !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | .igem_2017_content_wrapper h3 {
| + | |
| − | font-size: 28px !important;
| + | |
| − | margin-bottom: 20px !important;
| + | |
| − | color: #222222 !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | .igem_2017_content_wrapper ul {
| + | |
| − | margin: 0 !important;
| + | |
| − | padding: 0 !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | .igem_2017_content_wrapper p {
| + | |
| − | font-size: 18px !important;
| + | |
| − | line-height: 32px !important;
| + | |
| − | color: #222222 !important;
| + | |
| − | margin-bottom: 1em !important;
| + | |
| − | text-align: justify !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | .igem_2017_content_wrapper img {
| + | |
| − | max-width: 100% !important;
| + | |
| − | height: auto !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | .igem_2017_content_wrapper a {
| + | |
| − | text-decoration: none !important;
| + | |
| − | color: #000000 !important;
| + | |
| − | font-weight: normal !important;
| + | |
| − | font-size: 18px !important;
| + | |
| − | transition: all 0.2s ease-in !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | .igem_2017_content_wrapper a:hover {
| + | |
| − | color: #0f6fc6 !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | #header {
| + | |
| − | position: relative !important;
| + | |
| − | z-index: 999 !important;
| + | |
| − | padding: 0 20px 0 20px !important;
| + | |
| − | box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23) !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | #logo, #logo a {
| + | |
| − | height: 150px !important;
| + | |
| − | line-height: 150px !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | #logo, #logo a, #nav, #nav ul, #nav ul li {
| + | |
| − | display: inline-block !important;
| + | |
| − | position: relative !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | #logo img {
| + | |
| − | height: 125px !important;
| + | |
| − | vertical-align: middle !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | .igem_2017_content_wrapper {
| + | |
| − | width: 100% !important;
| + | |
| − | padding: 0 !important;
| + | |
| − | margin: 0 !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | .igem_2017_menu_wrapper {
| + | |
| − | display: none !important; /* Hide this badass menu */
| + | |
| − | }
| + | |
| − | | + | |
| − | #nav {
| + | |
| − | font-size: 18px !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | #nav > ul > li {
| + | |
| − | margin-left: 50px !important;
| + | |
| − | height: 30px !important;
| + | |
| − | line-height: 30px !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | #nav ul li ul {
| + | |
| − | display: block !important;
| + | |
| − | opacity: 0 !important;
| + | |
| − | max-height: 0 !important;
| + | |
| − | overflow: hidden !important;
| + | |
| − | position: absolute !important;
| + | |
| − | top: 30px !important;
| + | |
| − | left: 0px !important;
| + | |
| − | width: 180px !important;
| + | |
| − | background-color: #FFFFFF !important;
| + | |
| − | border-left: 3px solid #0f6fc6 !important;
| + | |
| − | box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23) !important;
| + | |
| − | transition: all 0.2s ease-in !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | #nav ul li:hover ul {
| + | |
| − | opacity: 1 !important;
| + | |
| − | max-height: 1000px !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | #nav ul li ul li {
| + | |
| − | display: block !important;
| + | |
| − | transition: all 0.2s ease-in !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | #nav ul li ul li:hover {
| + | |
| − | background-color: #eee !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | #nav ul li ul li a {
| + | |
| − | padding-left: 15px !important;
| + | |
| − | line-height: 50px !important;
| + | |
| − | height: 50px !important;
| + | |
| − | width: 175px !important;
| + | |
| − | display: inline-block !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | #presentation img {
| + | |
| − | width: 100% !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | #page {
| + | |
| − | padding: 60px 90px 0 90px !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | #page:after {
| + | |
| − | content: "" !important;
| + | |
| − | display: table !important;
| + | |
| − | clear: both !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | #page .text, #page .illustration {
| + | |
| − | width: 50% !important;
| + | |
| − | float: left !important;
| + | |
| − | vertical-align: top !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | #page .text {
| + | |
| − | padding-right: 30px !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | #page .illustration {
| + | |
| − | padding-left: 30px !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | #page .illustration img {
| + | |
| − | border: 15px solid #FFFFFF !important;
| + | |
| − | box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23) !important;
| + | |
| − | filter: opacity(90%) grayscale(30%) !important;
| + | |
| − | }
| + | |
| − |
| + | |
| − | #footer {
| + | |
| − | padding: 60px 90px 60px 90px !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | #footer ul {
| + | |
| − | text-align: center !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | #footer ul li {
| + | |
| − | display: inline-block !important;
| + | |
| − | width: auto !important;
| + | |
| − | max-width: 12.5% !important;
| + | |
| − | height: 200px !important;
| + | |
| − | line-height: 200px !important;
| + | |
| − | padding: 20px !important;
| + | |
| − | vertical-align: middle !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | #footer ul li img {
| + | |
| − | max-width: 100% !important;
| + | |
| − | width: auto !important;
| + | |
| − | height: auto !important;
| + | |
| − | max-height: 400px !important;
| + | |
| − | vertical-align: middle !important;
| + | |
| − | }
| + | |
| − | | + | |
| − | @media (max-width: 1000px) {
| + | |
| − | #page .text, #page .illustration {
| + | |
| − | width: 100% !important;
| + | |
| − | float: left !important;
| + | |
| − | padding: 0 !important;
| + | |
| − | }
| + | |
| − | }
| + | |
| − | </style> | + | |
| − | </head>
| + | |
| − | <body>
| + | |
| − | <header id="header">
| + | |
| − | <div id="logo">
| + | |
| − | <a href="./Team:UCLouvain"><img src="https://static.igem.org/mediawiki/2017/3/3d/UCLouvain_igem_logo.png" alt="IGem UCLouvain Team"></a>
| + | |
| − | </div>
| + | |
| − | <nav id="nav">
| + | |
| − | <ul>
| + | |
| − | <li>
| + | |
| − | <a href="./Team:UCLouvain/OurProject">Our Project</a>
| + | |
| − | <ul>
| + | |
| − | <li><a href="./Team:UCLouvain/OurProject/Overview">Overview</a></li>
| + | |
| − | <li><a href="./Team:UCLouvain/Approach1">Approach 1</a></li>
| + | |
| − | <li><a href="./Team:UCLouvain/Approach2">Approach 2</a></li>
| + | |
| − | <li><a href="./Team:UCLouvain/Badge">Badge</a></li>
| + | |
| − | </ul>
| + | |
| − | </li>
| + | |
| − | <li>
| + | |
| − | <a href="./Team:UCLouvain/InTheLab">In The Lab</a>
| + | |
| − | <ul>
| + | |
| − | <li><a href="./Team:UCLouvain/Parts">Parts</a></li>
| + | |
| − | <li><a href="./Team:UCLouvain/Protocols">Protocols</a></li>
| + | |
| − | <li><a href="./Team:UCLouvain/InTheLab/Lab_Notebook">Lab Notebook</a></li>
| + | |
| − | | + | |
| − | </ul>
| + | |
| − | </li>
| + | |
| − | <li><a href="https://2017.igem.org/Team:UCLouvain/HP/Silver">Human Practices</a>
| + | |
| − | <ul>
| + | |
| − | <li><a href="./Team:UCLouvain/Safety">Safety</a></li>
| + | |
| − | <li><a href="./Team:UCLouvain/PE">Public Engagement</a></li>
| + | |
| − | </ul>
| + | |
| − | </li>
| + | |
| − | <li>
| + | |
| − | <a href="./Team:UCLouvain/AU">About Us</a>
| + | |
| − | <ul>
| + | |
| − | <li><a href="./Team:UCLouvain/Team">Team</a></li>
| + | |
| − | <li><a href="./Team:UCLouvain/Ak">Aknowledgement</a></li>
| + | |
| − | <li><a href="./Team:UCLouvain/Events">Events</a></li>
| + | |
| − | <li><a href="./Team:UCLouvain/Attributions">Attributions</a></li>
| + | |
| − | </ul>
| + | |
| − | </li>
| + | |
| − | <li><a href="https://igem.org/2017_Judging_Form?team=UCLouvain">Judging form</a></li>
| + | |
| − | </ul>
| + | |
| − | </nav>
| + | |
| − | </header>
| + | |
| − | <section id="content">
| + | |
| − | <div id="presentation">
| + | |
| − | <img src="https://static.igem.org/mediawiki/2017/8/8b/HEADER-LLN_PLAGE.png" alt="IGem UCLouvain Team">
| + | |
| − | </div>
| + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | <footer id="footer">
| + | |
| − | <h2>Our sponsors</h2>
| + | |
| − | <ul><!--
| + | |
| − | --><li><a href="https://uclouvain.be/en/index.html" target="_blank"><img src="https://static.igem.org/mediawiki/2017/8/87/Logo-UCL.jpg" alt="UCL"></a></li><!--
| + | |
| − | --><li><a href="http://www.federation-wallonie-bruxelles.be/index.php?id=39" target="_blank"><img src="https://static.igem.org/mediawiki/2017/a/a1/Logo-FWB.png" alt="Fédération Wallonie Bruxelles"></a></li><!--
| + | |
| − | --><li><a href="https://uclouvain.be/fr/chercher/fondation-louvain" target="_blank"><img src="https://static.igem.org/mediawiki/2017/3/39/Logo-Fondation_Louvain.png" alt="Fondation Louvain"></a></li><!--
| + | |
| − | --><li><a href="https://www.neb.com/" target="_blank"><img src="https://static.igem.org/mediawiki/2017/c/cd/Logo-Imperial_College.png" alt="Imperial College"></a></li><!--
| + | |
| − | --><li><a href="http://www.agilent.com/home" target="_blank"><img src="https://static.igem.org/mediawiki/2017/8/88/Logo-Agilent_Technologies.png" alt="Agilent Technologies"></a></li><!--
| + | |
| − | --><li><a href="https://www.aglouvain.be/site2/" target="_blank"><img src="https://static.igem.org/mediawiki/2017/5/5d/Logo-AGL.png" alt="AGL"></a></li><!--
| + | |
| − | --><li><a href="https://uclouvain.be/en/research-institutes/isv" target="_blank"><img src="https://static.igem.org/mediawiki/2017/1/13/Logo-ISV.png" alt="ISV"></a></li><!--
| + | |
| − | --><li><a href="https://uclouvain.be/en/faculties/sc" target="_blank"><img src="https://static.igem.org/mediawiki/2017/0/01/Logo-UCL_Sciences.jpg" alt="UCL faculté des Sciences"></a></li><!--
| + | |
| − | --></ul>
| + | |
| − | </footer>
| + | |
| − | </body>
| + | |
| | </html> | | </html> |
| | + | {{UCLouvainFooter}} |
