|
|
| Line 1: |
Line 1: |
| | {{UCLouvain}} | | {{UCLouvain}} |
| | <html> | | <html> |
| − | <header class="main-header"> | + | <head> |
| − | <div class="container"> | + | <title>iGEM UCLouvain Team</title> |
| − | <div class="logo">
| + | |
| − | <a href=". /Team:UCLouvain"><img src="https: //static. igem. org/mediawiki/2017/3/3d/UCLouvain_igem_logo. png" alt="logo"></a> | + | <style> |
| − | </div> | + | .igem_2017_content_wrapper html, |
| | + | .igem_2017_content_wrapper body, |
| | + | .igem_2017_content_wrapper div, |
| | + | .igem_2017_content_wrapper span, |
| | + | .igem_2017_content_wrapper p, |
| | + | .igem_2017_content_wrapper a, |
| | + | .igem_2017_content_wrapper img, |
| | + | .igem_2017_content_wrapper ul, |
| | + | .igem_2017_content_wrapper li, |
| | + | .igem_2017_content_wrapper footer, |
| | + | .igem_2017_content_wrapper header, |
| | + | .igem_2017_content_wrapper nav, |
| | + | .igem_2017_content_wrapper section { |
| | + | box-sizing: border-box !important; |
| | + | margin: 0 !important; |
| | + | padding: 0 !important; |
| | + | border: 0 !important; |
| | + | font-size: 100% !important; |
| | + | font: inherit !important; |
| | + | font-family: 'Roboto', 'Arial' !important; |
| | + | vertical-align: baseline !important; |
| | + | } |
| | + | .igem_2017_content_wrapper h2, |
| | + | .igem_2017_content_wrapper h3 { |
| | + | box-sizing: border-box !important; |
| | + | margin: 0 !important; |
| | + | padding: 10px 0 10px 0 !important; |
| | + | border: 0 !important; |
| | + | font-size: 100% !important; |
| | + | font: inherit !important; |
| | + | font-family: 'Roboto', 'Arial' !important; |
| | + | vertical-align: baseline !important; |
| | + | } |
| | + | .igem_2017_content_wrapper footer, |
| | + | .igem_2017_content_wrapper header, |
| | + | .igem_2017_content_wrapper nav, |
| | + | .igem_2017_content_wrapper section { |
| | + | display: block !important; |
| | + | } |
| | + | .igem_2017_content_wrapper body { |
| | + | line-height: 1 !important; |
| | + | } |
| | + | .igem_2017_content_wrapper ul { |
| | + | list-style: none !important; |
| | + | } |
| | | | |
| − | <div class="menu"> | + | /* |
| − | <nav class="desktop-nav">
| + | Our styles |
| − | <ul class="first-level">
| + | */ |
| − | <li><a href="./Team:UCLouvain" class="animsition-link">Home</a></li>
| + | |
| − | <li><a href="./Team:UCLouvain/OurProject/Overview">our project</a>
| + | |
| − | <ul class="second-level">
| + | |
| − | <li><a href="/Team:UCLouvain/OurProject/Overview" class="animsition-link">overview</a></li>
| + | |
| − | <li><a href="/Team:UCLouvain/Approach1" class="animsition-link">auxotrophs</a></li>
| + | |
| − | <li><a href="/Team:UCLouvain/Approach2" class="animsition-link">comR/S</a></li>
| + | |
| − | <li><a href="/Team:UCLouvain/Badge" class="animsition-link">badge</a></li>
| + | |
| − | </ul>
| + | |
| − | </li>
| + | |
| − | <li><a href="/Team:UCLouvain/InTheLab/Overview">in the lab</a>
| + | |
| − | <ul class="second-level">
| + | |
| − | <li><a href="/Team:UCLouvain/InterLab" class="animsition-link">interlab</a></li>
| + | |
| − | <li><a href="/Team:UCLouvain/Protocols" class="animsition-link">protocols</a></li>
| + | |
| − | <li><a href="/Team:UCLouvain/Parts" class="animsition-link">parts</a></li>
| + | |
| − | </ul>
| + | |
| − | </li>
| + | |
| − | <li><a href="/Team:UCLouvain/HP/Silver" class="animsition-link">human practices</a></li>
| + | |
| − | <li><a href="/Team:UCLouvain/Collaboration">collaboration</a></li>
| + | |
| − | <li><a href="/Team:UCLouvain/AboutUs">about us</a>
| + | |
| − | <ul class="second-level">
| + | |
| − | <li><a href="/Team:UCLouvain/Team" class="animsition-link">team</a></li>
| + | |
| − | <li><a href="/Team:UCLouvain/Aknowledgement" class="animsition-link">aknowledgement</a></li>
| + | |
| − | <li><a href="/Team:UCLouvain/OurUniversity" class="animsition-link">our university</a></li>
| + | |
| − | <li><a href="/Team:UCLouvain/OurEvents" class="animsition-link">our events</a></li>
| + | |
| − | <li><a href="/Team:UCLouvain/Attributions" class="animsition-link">attributions</a></li>
| + | |
| − | </ul>
| + | |
| − | </li>
| + | |
| − | <li><a href="/2017_Judging_Form?team=UCLouvain">judging form</a></li>
| + | |
| − | </ul>
| + | |
| − | </nav> | + | |
| − | <nav class="mobile-nav"></nav>
| + | |
| − | <div class="menu-icon">
| + | |
| − | <div class="line"></div>
| + | |
| − | <div class="line"></div>
| + | |
| − | <div class="line"></div>
| + | |
| − | </div>
| + | |
| − | </div> | + | |
| − | </div>
| + | |
| − | </header>
| + | |
| | | | |
| − | <div class="site-hero">
| + | /* Import Roboto */ |
| − | <ul class="slides">
| + | @import url('https://fonts.googleapis.com/css?family=Roboto:300,400,700'); |
| − | <li> | + | |
| − | <div><span class="small-title uppercase montserrat-text">we are</span></div>
| + | |
| − | <div class="big-title uppercase montserrat-text"><span style="text-transform:none;">i</span>GEM UCLouvain Team</div>
| + | |
| − | </li>
| + | |
| − | </ul>
| + | |
| − | </div>
| + | |
| | | | |
| − | <div class="container">
| + | .igem_2017_content_wrapper h1 { |
| − | <div class="project">
| + | display: none !important; |
| − | <div class="col-md-5 col-sm-12"> | + | } |
| − | <div class="row">
| + | |
| − | <img src="assets/img/project.jpg" alt="image">
| + | |
| − | </div> | + | |
| − | </div>
| + | |
| − | <div class="col-md-offset-1 col-md-6 col-sm-12">
| + | |
| − | <div class="row">
| + | |
| − | <div class="section-title">
| + | |
| − | <span>the project</span>
| + | |
| − | </div>
| + | |
| − | <p>
| + | |
| − | Although melanoma accounts for less than one percent of skin cancer cases, they are responsible for the vast majority of skin cancer deaths. More than 80% of melanomas are caused by the exposure to ultraviolet (UV) radiation from the sun.
| + | |
| − | </p>
| + | |
| − | <p>
| + | |
| − | <b>Our project:</b> <b style="font-family:'Brush Script MT';font-size:21px;">BactaSun</b>, a bio-badge changing color when exposed to sunlight.
| + | |
| − | </p>
| + | |
| − | <a href="#" class="btn blue" style="float:right;margin-top:30px"><span>read more</span></a>
| + | |
| − | </div>
| + | |
| − | </div> | + | |
| − | </div>
| + | |
| − | </div>
| + | |
| | | | |
| − | <section class="services">
| + | .igem_2017_content_wrapper h2, .igem_2017_content_wrapper h3 { |
| − | <div class="container">
| + | font-weight: normal !important; |
| − | <div class="col-md-7 col-sm-12 services-left wow fadeInUp"> | + | } |
| − | <div class="row" style="margin-bottom:50px">
| + | |
| − | <div class="col-md-6 col-sm-12">
| + | |
| − | <div class="row">
| + | |
| − | <a href="" style="color:#60606e !important;"><i class="icon ion-arrow-graph-up-right"></i>
| + | |
| − | <span class="montserrat-text uppercase service-title">Global issue</span>
| + | |
| − | <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>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − | <div class="col-md-6 col-sm-12">
| + | |
| − | <div class="row">
| + | |
| − | <a href="" style="color:#60606e !important;"><i class="icon ion-ios-glasses"></i>
| + | |
| − | <span class="montserrat-text uppercase service-title">Protection exists</span>
| + | |
| − | <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>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − | </div> | + | |
| − | <div class="row">
| + | |
| − | <div class="col-md-6 col-sm-12">
| + | |
| − | <div class="row">
| + | |
| − | <a href="" style="color:#60606e !important;"><i class="icon ion-android-watch"></i>
| + | |
| − | <span class="montserrat-text uppercase service-title">Badge design</span>
| + | |
| − | <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>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − | <div class="col-md-6 col-sm-12">
| + | |
| − | <div class="row">
| + | |
| − | <a href="" style="color:#60606e !important;"><i class="icon ion-erlenmeyer-flask"></i>
| + | |
| − | <span class="montserrat-text uppercase service-title">Culture design</span>
| + | |
| − | <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>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| − | </div> | + | |
| | | | |
| − | <div class="col-md-5 col-sm-12 services-right wow fadeInUp" data-wow-delay=".1s"> | + | .igem_2017_content_wrapper h2 { |
| − | <div class="row"> | + | font-size: 34px !important; |
| − | <img src="assets/img/serv.jpg" alt="image">
| + | margin-bottom: 20px !important; |
| − | </div> | + | color: #222222 !important; |
| − | </div> | + | } |
| | | | |
| − | </div>
| + | .igem_2017_content_wrapper h2.smallclear { |
| − | </section>
| + | margin-bottom: 5px !important; |
| | + | } |
| | | | |
| − | <section class="blue-section wow fadeInUp" style="padding:50px 0">
| + | .igem_2017_content_wrapper h3 { |
| − | <div class="container">
| + | font-size: 28px !important; |
| − | <div class="col-md-12 col-sm-12"> | + | margin-bottom: 20px !important; |
| − | <div class="row"> | + | color: #222222 !important; |
| − | <span class="white-text montserrat-text uppercase" style="font-size:30px;display:block;">
| + | } |
| − | you think we're cool? so are your sponsors!
| + | |
| − | </span>
| + | |
| − | <ul class="sponsors"><!--
| + | |
| − | --><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>
| + | |
| − | </div>
| + | |
| − | </div> | + | |
| − | </div>
| + | |
| − | </section>
| + | |
| | | | |
| − | <footer class="main-footer wow fadeInUp">
| + | .igem_2017_content_wrapper ul { |
| − | <div class="container">
| + | margin: 0 !important; |
| − | <div class="col-md-8 col-sm-12"> | + | padding: 0 !important; |
| − | <div class="row"> | + | } |
| − | <nav class="footer-nav">
| + | |
| − | <ul>
| + | |
| − | <li><a href="#" class="animsition-link">Home</a></li>
| + | |
| − | <li><a href="">our project</a></li>
| + | |
| − | <li><a href="">in the lab</a></li>
| + | |
| − | <li><a href="#" class="animsition-link">human practices</a></li>
| + | |
| − | <li><a href="">awards</a></li>
| + | |
| − | <li><a href="">about us</a></li>
| + | |
| − | </ul>
| + | |
| − | </nav>
| + | |
| − | </div> | + | |
| − | </div> | + | |
| − | </div>
| + | |
| − | </footer>
| + | |
| | | | |
| − | <script type="text/javascript" src="https://2017.igem.org/Template:Jquery-2.1.4.min.js?
| + | .igem_2017_content_wrapper p { |
| − | action=raw&ctype=text/javascript"></script>
| + | font-size: 18px !important; |
| − | <script>
| + | line-height: 32px !important; |
| − | /*!
| + | color: #222222 !important; |
| − | * animsition v3.4.3
| + | margin-bottom: 1em !important; |
| − | * http://blivesta.github.io/animsition/
| + | text-align: justify !important; |
| − | * Licensed under MIT
| + | } |
| − | * Author : blivesta
| + | |
| − | * http://blivesta.com/
| + | |
| − | */
| + | |
| − | !function(a){"use strict";var b="animsition",c={init:function(d){d=a.extend({inClass:"fade-in",outClass:"fade-out",inDuration:1500,outDuration:800,linkElement:".animsition-link",loading:!0,loadingParentElement:"body",loadingClass:"animsition-loading",unSupportCss:["animation-duration","-webkit-animation-duration","-o-animation-duration"],overlay:!1,overlayClass:"animsition-overlay-slide",overlayParentElement:"body"},d);var e=c.supportCheck.call(this,d);if(!e)return"console"in window||(window.console={},window.console.log=function(a){return a}),console.log("Animsition does not support this browser."),c.destroy.call(this);var f=c.optionCheck.call(this,d);return f&&c.addOverlay.call(this,d),d.loading&&c.addLoading.call(this,d),this.each(function(){var e=this,f=a(this),g=a(window),h=f.data(b);h||(d=a.extend({},d),f.data(b,{options:d}),g.on("load."+b+" pageshow."+b,function(){c.pageIn.call(e)}),g.on("unload."+b,function(){}),a(d.linkElement).on("click."+b,function(b){b.preventDefault();var d=a(this),f=d.attr("href");2===b.which||b.metaKey||b.shiftKey||-1!==navigator.platform.toUpperCase().indexOf("WIN")&&b.ctrlKey?window.open(f,"_blank"):c.pageOut.call(e,d,f)}))})},addOverlay:function(b){a(b.overlayParentElement).prepend('<div class="'+b.overlayClass+'"></div>')},addLoading:function(b){a(b.loadingParentElement).append('<div class="'+b.loadingClass+'"></div>')},removeLoading:function(){var c=a(this),d=c.data(b).options,e=a(d.loadingParentElement).children("."+d.loadingClass);e.fadeOut().remove()},supportCheck:function(b){var c=a(this),d=b.unSupportCss,e=d.length,f=!1;0===e&&(f=!0);for(var g=0;e>g;g++)if("string"==typeof c.css(d[g])){f=!0;break}return f},optionCheck:function(b){var c,d=a(this);return c=b.overlay||d.data("animsition-overlay")?!0:!1},animationCheck:function(c,d,e){var f=a(this),g=f.data(b).options,h=typeof c,i=!d&&"number"===h,j=d&&"string"===h&&c.length>0;return i||j?c=c:d&&e?c=g.inClass:!d&&e?c=g.inDuration:d&&!e?c=g.outClass:d||e||(c=g.outDuration),c},pageIn:function(){var d=this,e=a(this),f=e.data(b).options,g=e.data("animsition-in-duration"),h=e.data("animsition-in"),i=c.animationCheck.call(d,g,!1,!0),j=c.animationCheck.call(d,h,!0,!0),k=c.optionCheck.call(d,f);f.loading&&c.removeLoading.call(d),k?c.pageInOverlay.call(d,j,i):c.pageInBasic.call(d,j,i)},pageInBasic:function(b,c){var d=a(this);d.css({"animation-duration":c/1e3+"s"}).addClass(b).animateCallback(function(){d.removeClass(b).css({opacity:1})})},pageInOverlay:function(c,d){var e=a(this),f=e.data(b).options;e.css({opacity:1}),a(f.overlayParentElement).children("."+f.overlayClass).css({"animation-duration":d/1e3+"s"}).addClass(c)},pageOut:function(d,e){var f=this,g=a(this),h=g.data(b).options,i=d.data("animsition-out"),j=g.data("animsition-out"),k=d.data("animsition-out-duration"),l=g.data("animsition-out-duration"),m=i?i:j,n=k?k:l,o=c.animationCheck.call(f,m,!0,!1),p=c.animationCheck.call(f,n,!1,!1),q=c.optionCheck.call(f,h);q?c.pageOutOverlay.call(f,o,p,e):c.pageOutBasic.call(f,o,p,e)},pageOutBasic:function(b,c,d){var e=a(this);e.css({"animation-duration":c/1e3+"s"}).addClass(b).animateCallback(function(){location.href=d})},pageOutOverlay:function(d,e,f){var g=this,h=a(this),i=h.data(b).options,j=h.data("animsition-in"),k=c.animationCheck.call(g,j,!0,!0);a(i.overlayParentElement).children("."+i.overlayClass).css({"animation-duration":e/1e3+"s"}).removeClass(k).addClass(d).animateCallback(function(){h.css({opacity:0}),location.href=f})},destroy:function(){return this.each(function(){var c=a(this);a(window).unbind("."+b),c.css({opacity:1}).removeData(b)})}};a.fn.animateCallback=function(b){var c="animationend webkitAnimationEnd mozAnimationEnd oAnimationEnd MSAnimationEnd";return this.each(function(){a(this).bind(c,function(){return a(this).unbind(c),b.call(this)})})},a.fn.animsition=function(d){return c[d]?c[d].apply(this,Array.prototype.slice.call(arguments,1)):"object"!=typeof d&&d?void a.error("Method "+d+" does not exist on jQuery."+b):c.init.apply(this,arguments)}}(jQuery);
| + | |
| − | /*! WOW - v1.0.2 - 2014-10-28
| + | |
| − | * Copyright (c) 2014 Matthieu Aussaguel; Licensed MIT */(function(){var a,b,c,d,e,f=function(a,b){return function(){return a.apply(b,arguments)}},g=[].indexOf||function(a){for(var b=0,c=this.length;c>b;b++)if(b in this&&this[b]===a)return b;return-1};b=function(){function a(){}return a.prototype.extend=function(a,b){var c,d;for(c in b)d=b[c],null==a[c]&&(a[c]=d);return a},a.prototype.isMobile=function(a){return/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(a)},a.prototype.addEvent=function(a,b,c){return null!=a.addEventListener?a.addEventListener(b,c,!1):null!=a.attachEvent?a.attachEvent("on"+b,c):a[b]=c},a.prototype.removeEvent=function(a,b,c){return null!=a.removeEventListener?a.removeEventListener(b,c,!1):null!=a.detachEvent?a.detachEvent("on"+b,c):delete a[b]},a.prototype.innerHeight=function(){return"innerHeight"in window?window.innerHeight:document.documentElement.clientHeight},a}(),c=this.WeakMap||this.MozWeakMap||(c=function(){function a(){this.keys=[],this.values=[]}return a.prototype.get=function(a){var b,c,d,e,f;for(f=this.keys,b=d=0,e=f.length;e>d;b=++d)if(c=f[b],c===a)return this.values[b]},a.prototype.set=function(a,b){var c,d,e,f,g;for(g=this.keys,c=e=0,f=g.length;f>e;c=++e)if(d=g[c],d===a)return void(this.values[c]=b);return this.keys.push(a),this.values.push(b)},a}()),a=this.MutationObserver||this.WebkitMutationObserver||this.MozMutationObserver||(a=function(){function a(){"undefined"!=typeof console&&null!==console&&console.warn("MutationObserver is not supported by your browser."),"undefined"!=typeof console&&null!==console&&console.warn("WOW.js cannot detect dom mutations, please call .sync() after loading new content.")}return a.notSupported=!0,a.prototype.observe=function(){},a}()),d=this.getComputedStyle||function(a){return this.getPropertyValue=function(b){var c;return"float"===b&&(b="styleFloat"),e.test(b)&&b.replace(e,function(a,b){return b.toUpperCase()}),(null!=(c=a.currentStyle)?c[b]:void 0)||null},this},e=/(\-([a-z]){1})/g,this.WOW=function(){function e(a){null==a&&(a={}),this.scrollCallback=f(this.scrollCallback,this),this.scrollHandler=f(this.scrollHandler,this),this.start=f(this.start,this),this.scrolled=!0,this.config=this.util().extend(a,this.defaults),this.animationNameCache=new c}return e.prototype.defaults={boxClass:"wow",animateClass:"animated",offset:0,mobile:!0,live:!0},e.prototype.init=function(){var a;return this.element=window.document.documentElement,"interactive"===(a=document.readyState)||"complete"===a?this.start():this.util().addEvent(document,"DOMContentLoaded",this.start),this.finished=[]},e.prototype.start=function(){var b,c,d,e;if(this.stopped=!1,this.boxes=function(){var a,c,d,e;for(d=this.element.querySelectorAll("."+this.config.boxClass),e=[],a=0,c=d.length;c>a;a++)b=d[a],e.push(b);return e}.call(this),this.all=function(){var a,c,d,e;for(d=this.boxes,e=[],a=0,c=d.length;c>a;a++)b=d[a],e.push(b);return e}.call(this),this.boxes.length)if(this.disabled())this.resetStyle();else for(e=this.boxes,c=0,d=e.length;d>c;c++)b=e[c],this.applyStyle(b,!0);return this.disabled()||(this.util().addEvent(window,"scroll",this.scrollHandler),this.util().addEvent(window,"resize",this.scrollHandler),this.interval=setInterval(this.scrollCallback,50)),this.config.live?new a(function(a){return function(b){var c,d,e,f,g;for(g=[],e=0,f=b.length;f>e;e++)d=b[e],g.push(function(){var a,b,e,f;for(e=d.addedNodes||[],f=[],a=0,b=e.length;b>a;a++)c=e[a],f.push(this.doSync(c));return f}.call(a));return g}}(this)).observe(document.body,{childList:!0,subtree:!0}):void 0},e.prototype.stop=function(){return this.stopped=!0,this.util().removeEvent(window,"scroll",this.scrollHandler),this.util().removeEvent(window,"resize",this.scrollHandler),null!=this.interval?clearInterval(this.interval):void 0},e.prototype.sync=function(){return a.notSupported?this.doSync(this.element):void 0},e.prototype.doSync=function(a){var b,c,d,e,f;if(null==a&&(a=this.element),1===a.nodeType){for(a=a.parentNode||a,e=a.querySelectorAll("."+this.config.boxClass),f=[],c=0,d=e.length;d>c;c++)b=e[c],g.call(this.all,b)<0?(this.boxes.push(b),this.all.push(b),this.stopped||this.disabled()?this.resetStyle():this.applyStyle(b,!0),f.push(this.scrolled=!0)):f.push(void 0);return f}},e.prototype.show=function(a){return this.applyStyle(a),a.className=""+a.className+" "+this.config.animateClass},e.prototype.applyStyle=function(a,b){var c,d,e;return d=a.getAttribute("data-wow-duration"),c=a.getAttribute("data-wow-delay"),e=a.getAttribute("data-wow-iteration"),this.animate(function(f){return function(){return f.customStyle(a,b,d,c,e)}}(this))},e.prototype.animate=function(){return"requestAnimationFrame"in window?function(a){return window.requestAnimationFrame(a)}:function(a){return a()}}(),e.prototype.resetStyle=function(){var a,b,c,d,e;for(d=this.boxes,e=[],b=0,c=d.length;c>b;b++)a=d[b],e.push(a.style.visibility="visible");return e},e.prototype.customStyle=function(a,b,c,d,e){return b&&this.cacheAnimationName(a),a.style.visibility=b?"hidden":"visible",c&&this.vendorSet(a.style,{animationDuration:c}),d&&this.vendorSet(a.style,{animationDelay:d}),e&&this.vendorSet(a.style,{animationIterationCount:e}),this.vendorSet(a.style,{animationName:b?"none":this.cachedAnimationName(a)}),a},e.prototype.vendors=["moz","webkit"],e.prototype.vendorSet=function(a,b){var c,d,e,f;f=[];for(c in b)d=b[c],a[""+c]=d,f.push(function(){var b,f,g,h;for(g=this.vendors,h=[],b=0,f=g.length;f>b;b++)e=g[b],h.push(a[""+e+c.charAt(0).toUpperCase()+c.substr(1)]=d);return h}.call(this));return f},e.prototype.vendorCSS=function(a,b){var c,e,f,g,h,i;for(e=d(a),c=e.getPropertyCSSValue(b),i=this.vendors,g=0,h=i.length;h>g;g++)f=i[g],c=c||e.getPropertyCSSValue("-"+f+"-"+b);return c},e.prototype.animationName=function(a){var b;try{b=this.vendorCSS(a,"animation-name").cssText}catch(c){b=d(a).getPropertyValue("animation-name")}return"none"===b?"":b},e.prototype.cacheAnimationName=function(a){return this.animationNameCache.set(a,this.animationName(a))},e.prototype.cachedAnimationName=function(a){return this.animationNameCache.get(a)},e.prototype.scrollHandler=function(){return this.scrolled=!0},e.prototype.scrollCallback=function(){var a;return!this.scrolled||(this.scrolled=!1,this.boxes=function(){var b,c,d,e;for(d=this.boxes,e=[],b=0,c=d.length;c>b;b++)a=d[b],a&&(this.isVisible(a)?this.show(a):e.push(a));return e}.call(this),this.boxes.length||this.config.live)?void 0:this.stop()},e.prototype.offsetTop=function(a){for(var b;void 0===a.offsetTop;)a=a.parentNode;for(b=a.offsetTop;a=a.offsetParent;)b+=a.offsetTop;return b},e.prototype.isVisible=function(a){var b,c,d,e,f;return c=a.getAttribute("data-wow-offset")||this.config.offset,f=window.pageYOffset,e=f+Math.min(this.element.clientHeight,this.util().innerHeight())-c,d=this.offsetTop(a),b=d+a.clientHeight,e>=d&&b>=f},e.prototype.util=function(){return null!=this._util?this._util:this._util=new b},e.prototype.disabled=function(){return!this.config.mobile&&this.util().isMobile(navigator.userAgent)},e}()}).call(this);
| + | |
| − | (function($){
| + | |
| − | $(window).load(function(){
| + | |
| − | if($(".animsition").length){
| + | |
| − | $(".animsition").animsition({ | + | |
| − | inClass : 'fade-in-up-sm',
| + | |
| − | outClass : 'fade-out-up-sm',
| + | |
| − | inDuration : 1100,
| + | |
| − | outDuration : 800,
| + | |
| − | linkElement : '.animsition-link',
| + | |
| − | loading : true,
| + | |
| − | loadingParentElement : 'body',
| + | |
| − | unSupportCss : [ 'animation-duration',
| + | |
| − | '-webkit-animation-duration',
| + | |
| − | '-o-animation-duration'
| + | |
| − | ],
| + | |
| − | overlay : false,
| + | |
| − | overlayClass : 'animsition-overlay-slie',
| + | |
| − | overlayParentElement : 'body'
| + | |
| − | });
| + | |
| − | }
| + | |
| | | | |
| − | var _link = $("nav.desktop-nav ul.first-level").children("li");
| + | .igem_2017_content_wrapper img { |
| − | var shown = false;
| + | max-width: 100% !important; |
| − | $(".menu-icon").click(function(){
| + | height: auto !important; |
| − | var _this = $(this);
| + | |
| − | $("nav.mobile-nav").slideToggle(200); | + | |
| − | if(!shown){
| + | |
| − | _this.children("div").css("width","30px"); | + | |
| − | shown = true; | + | |
| − | }else{
| + | |
| − | _this.children("div").first().css("width","30px");
| + | |
| − | _this.children("div").eq(1).css("width","15px");
| + | |
| − | _this.children("div").eq(2).css("width","20px");
| + | |
| − | shown = false;
| + | |
| | } | | } |
| − | });
| |
| | | | |
| − | _link.hover(function(e){
| + | .igem_2017_content_wrapper a { |
| − | e.preventDefault();
| + | text-decoration: none !important; |
| − | var _this = $(this);
| + | color: #000000 !important; |
| − | if(_this.children("ul.second-level").html() !== undefined){
| + | font-weight: normal !important; |
| − | if(e.type === "mouseenter"){ | + | font-size: 18px !important; |
| − | _this.children("ul.second-level").slideDown(200);
| + | transition: all 0.2s ease-in !important; |
| − | }else{ | + | |
| − | _this.children("ul.second-level").slideUp(200);
| + | |
| − | }
| + | |
| | } | | } |
| − | });
| |
| | | | |
| − | $("nav.mobile-nav").html($("nav.desktop-nav").html()); // set navbar
| + | .igem_2017_content_wrapper a:hover { |
| | + | color: #0f6fc6 !important; |
| | + | } |
| | | | |
| − | var mobile_link = $("nav.mobile-nav ul.first-level").children("li");
| + | #header { |
| − | mobile_link.children("a").click(function(e){
| + | position: relative !important; |
| − | var _this = $(this); | + | z-index: 999 !important; |
| − | var submenu_exists = (_this.next("ul.second-level").html() === undefined) ? false : true; | + | padding: 0 20px 0 20px !important; |
| − | if(submenu_exists){ | + | box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23) !important; |
| − | e.preventDefault(); | + | } |
| − | $(".down").slideUp(200); | + | |
| − | if(_this.next("ul.second-level").hasClass("down")){ | + | #logo, #logo a { |
| − | _this.next("ul.second-level").removeClass("down");
| + | height: 150px !important; |
| − | }else{ | + | line-height: 150px !important; |
| − | $(".down").removeClass("down");
| + | } |
| − | _this.next("ul.second-level").slideDown(200);
| + | |
| − | _this.next("ul.second-level").addClass("down");
| + | #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: 100px !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/Attributions">Attributions</a></li> |
| | + | <li><a href="./Team:UCLouvain/InterLab">InterLab</a></li> |
| | + | </ul> |
| | + | </li> |
| | + | <li> |
| | + | <a href="./Team:UCLouvain/InTheLab">In The Lab</a> |
| | + | <ul> |
| | + | <li><a href="./Team:UCLouvain/InTheLab/Overview">Overview</a></li> |
| | + | <li><a href="./Team:UCLouvain/Protocols">Protocols</a></li> |
| | + | <li><a href="./Team:UCLouvain/Parts">Parts</a></li> |
| | + | </ul> |
| | + | </li> |
| | + | <li><a href="https://2017.igem.org/Team:UCLouvain/HP/Silver">Human Practices</a></li> |
| | + | <li> |
| | + | <a href="./Team:UCLouvain/AboutUs">About us</a> |
| | + | <ul> |
| | + | <li><a href="./Team:UCLouvain/Team">Team</a></li> |
| | + | <li><a href="./Team:UCLouvain/Aknowledgement">Aknowledgement</a></li> |
| | + | <li><a href="./Team:UCLouvain/OurUniversity">Our University</a></li> |
| | + | </ul> |
| | + | </li> |
| | + | <li> |
| | + | <a href="./Team:UCLouvain/Awards">Awards</a> |
| | + | <ul> |
| | + | <li><a href="./Team:UCLouvain/Design">Design</a></li> |
| | + | <li><a href="./Team:UCLouvain/Model">Model</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> |
| | + | <div id="page"> |
| | + | <h2 class="smallclear">UCLouvain team @ iGEM 2017</h2> |
| | + | <h3>BactaSun: on the road for summer!</h3><!-- |
| | + | --><div class="text"> |
| | + | <p>Nowadays, exposition to harmful UV rays has led to an ever growing number of skin cancer cases, among other sun-related diseases. While efficient sunscreens do exist, we do not always think it necessary or forget to reapply it as often as we should. With our project called BactaSun, we propose to design a biobadge which would detect excessive UV exposure and therefore warn us to seek sun protection should it become necessary.</p> |
| | + | |
| | + | <p>This badge would work as a capsule holding an E. Coli strain, changing colors as the UV dose and intensity increases. The capsule would also work as a safe and reliable containment, destroying the engineered microorganisms once the biobadge is discarded.</p> |
| | + | |
| | + | <p>Starting with a tyrosine auxotroph E. coli, a gene coding for a colored protein which contains tyrosine will be constitutively expressed. Only photocaged tyrosine will be available in the media, and linked to a specific tRNA. The reporter protein will be synthetise but in the wrong conformation due to the cage presence. Once the bacterium is exposed to direct sunlight, the cage will be cleaved, inducing the good conformation of the protein and its coloration.</p> |
| | + | |
| | + | <p>Besides the biotechnological side of this project, the design of the badge capsule itself is going to represent a great challenge. We will need to find a specific plastic which lets the UV pass trough and design a way to kill the microorganisms once the badge has been used.</p> |
| | | | |
| − | });
| + | <p>Our team has also started an effort to educate the public on biotechnologies and synthetic biology. We are motivated to raise interest among scientist and others around iGEM and project like ours. The academic year 2016-2017 at UCL will unfold under the theme "Scientific Adventures". Under these circumstances, we already have been asked to lead panels and participate in debates and discussions. We hope to associate the UCLouvain iGEM project with many more initiative of this kind in the future.</p> |
| − | })(jQuery);
| + | </div><!-- |
| − | $(window).load(function() { | + | --><div class="illustration"> |
| − | new WOW().init(); | + | <img src="https://static.igem.org/mediawiki/2017/d/d9/UCLouvain_iGEM_Team_2017.jpeg" alt="IGem UCLouvain Team"> |
| − | }); | + | </div><!-- |
| − | </script></html>
| + | --></div> |
| | + | </section> |
| | + | <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> |
