Team:Valencia Biocampus/ArtAndMore

From 2014.igem.org

(Difference between revisions)
(Art & More)
 
(32 intermediate revisions not shown)
Line 11: Line 11:
margin:3px;
margin:3px;
display:inline-block;
display:inline-block;
 +
float:none;
}
}
-
.bb-bookblock{width:400px;height:300px;margin:0 auto;position:relative;z-index:100;-webkit-perspective:1300px;-moz-perspective:1300px;perspective:1300px;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;backface-visibility:hidden}.bb-page{position:absolute;-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-transition-property:-webkit-transform;-moz-transition-property:-moz-transform;transition-property:transform}.bb-vertical .bb-page{width:50%;height:100%;left:50%;-webkit-transform-origin:left center;-moz-transform-origin:left center;transform-origin:left center}.bb-horizontal .bb-page{width:100%;height:50%;top:50%;-webkit-transform-origin:center top;-moz-transform-origin:center top;transform-origin:center top}.bb-content,.bb-inner,.bb-outer,.bb-page>div{position:absolute;height:100%;width:100%;top:0;left:0;background:#fff}.bb-outer{-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;backface-visibility:hidden}.bb-vertical .bb-content{width:200%}.bb-horizontal .bb-content{height:200%}.bb-page>div{width:100%;-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;transform-style:preserve-3d}.bb-page>div:not(:only-child){-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;backface-visibility:hidden}.bb-vertical .bb-back{-webkit-transform:rotateY(-180deg);-moz-transform:rotateY(-180deg);transform:rotateY(-180deg)}.bb-horizontal .bb-back{-webkit-transform:rotateX(-180deg);-moz-transform:rotateX(-180deg);transform:rotateX(-180deg)}.bb-outer{width:100%;overflow:hidden;z-index:999}.bb-flipoverlay,.bb-overlay{background-color:rgba(0,0,0,.7);position:absolute;top:0;left:0;width:100%;height:100%;opacity:0}.bb-flipoverlay{background-color:rgba(0,0,0,.2)}.bb-bookblock.bb-vertical>div.bb-page:first-child,.bb-bookblock.bb-vertical>div.bb-page:first-child .bb-back{-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg);transform:rotateY(180deg)}.bb-bookblock.bb-horizontal>div.bb-page:first-child,.bb-bookblock.bb-horizontal>div.bb-page:first-child .bb-back{-webkit-transform:rotateX(180deg);-moz-transform:rotateX(180deg);transform:rotateX(180deg)}.bb-vertical .bb-front .bb-content{left:-100%}.bb-horizontal .bb-front .bb-content{top:-100%}.bb-vertical .bb-flip-initial,.bb-vertical .bb-flip-next{-webkit-transform:rotateY(-180deg);-moz-transform:rotateY(-180deg);transform:rotateY(-180deg)}.bb-vertical .bb-flip-prev{-webkit-transform:rotateY(0deg);-moz-transform:rotateY(0deg);transform:rotateY(0deg)}.bb-horizontal .bb-flip-initial,.bb-horizontal .bb-flip-next{-webkit-transform:rotateX(180deg);-moz-transform:rotateX(180deg);transform:rotateX(180deg)}.bb-horizontal .bb-flip-prev{-webkit-transform:rotateX(0deg);-moz-transform:rotateX(0deg);transform:rotateX(0deg)}.bb-vertical .bb-flip-next-end{-webkit-transform:rotateY(-15deg);-moz-transform:rotateY(-15deg);transform:rotateY(-15deg)}.bb-vertical .bb-flip-prev-end{-webkit-transform:rotateY(-165deg);-moz-transform:rotateY(-165deg);transform:rotateY(-165deg)}.bb-horizontal .bb-flip-next-end{-webkit-transform:rotateX(15deg);-moz-transform:rotateX(15deg);transform:rotateX(15deg)}.bb-horizontal .bb-flip-prev-end{-webkit-transform:rotateX(165deg);-moz-transform:rotateX(165deg);transform:rotateX(165deg)}.bb-item{width:100%;height:100%;position:absolute;top:0;left:0;display:none;background:#fff}.no-js .bb-bookblock,.no-js ul.bb-custom-grid li{width:auto;height:auto}.no-js .bb-item{display:block;position:relative}
+
.bb-bookblock{width:400px;height:300px;margin:0 auto;position:relative;z-index:100;-webkit-perspective:1300px;-moz-perspective:1300px;perspective:1300px;-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;backface-visibility:hidden}.bb-page{position:absolute;-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-transition-property:-webkit-transform;-moz-transition-property:-moz-transform;transition-property:transform}.bb-vertical .bb-page{width:50%;height:100%;left:50%;-webkit-transform-origin:left center;-moz-transform-origin:left center;transform-origin:left center}.bb-horizontal .bb-page{width:100%;height:50%;top:50%;-webkit-transform-origin:center top;-moz-transform-origin:center top;transform-origin:center top}.bb-content,.bb-inner,.bb-outer,.bb-page>div{position:absolute;height:100%;width:100%;top:0;left:0;background:#5a2c33}.bb-outer{-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;backface-visibility:hidden}.bb-vertical .bb-content{width:200%}.bb-horizontal .bb-content{height:200%}.bb-page>div{width:100%;-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;transform-style:preserve-3d}.bb-page>div:not(:only-child){-webkit-backface-visibility:hidden;-moz-backface-visibility:hidden;backface-visibility:hidden}.bb-vertical .bb-back{-webkit-transform:rotateY(-180deg);-moz-transform:rotateY(-180deg);transform:rotateY(-180deg)}.bb-horizontal .bb-back{-webkit-transform:rotateX(-180deg);-moz-transform:rotateX(-180deg);transform:rotateX(-180deg)}.bb-outer{width:100%;overflow:hidden;z-index:999}.bb-flipoverlay,.bb-overlay{background-color:rgba(0,0,0,.7);position:absolute;top:0;left:0;width:100%;height:100%;opacity:0}.bb-flipoverlay{background-color:rgba(0,0,0,.2)}.bb-bookblock.bb-vertical>div.bb-page:first-child,.bb-bookblock.bb-vertical>div.bb-page:first-child .bb-back{-webkit-transform:rotateY(180deg);-moz-transform:rotateY(180deg);transform:rotateY(180deg)}.bb-bookblock.bb-horizontal>div.bb-page:first-child,.bb-bookblock.bb-horizontal>div.bb-page:first-child .bb-back{-webkit-transform:rotateX(180deg);-moz-transform:rotateX(180deg);transform:rotateX(180deg)}.bb-vertical .bb-front .bb-content{left:-100%}.bb-horizontal .bb-front .bb-content{top:-100%}.bb-vertical .bb-flip-initial,.bb-vertical .bb-flip-next{-webkit-transform:rotateY(-180deg);-moz-transform:rotateY(-180deg);transform:rotateY(-180deg)}.bb-vertical .bb-flip-prev{-webkit-transform:rotateY(0deg);-moz-transform:rotateY(0deg);transform:rotateY(0deg)}.bb-horizontal .bb-flip-initial,.bb-horizontal .bb-flip-next{-webkit-transform:rotateX(180deg);-moz-transform:rotateX(180deg);transform:rotateX(180deg)}.bb-horizontal .bb-flip-prev{-webkit-transform:rotateX(0deg);-moz-transform:rotateX(0deg);transform:rotateX(0deg)}.bb-vertical .bb-flip-next-end{-webkit-transform:rotateY(-15deg);-moz-transform:rotateY(-15deg);transform:rotateY(-15deg)}.bb-vertical .bb-flip-prev-end{-webkit-transform:rotateY(-165deg);-moz-transform:rotateY(-165deg);transform:rotateY(-165deg)}.bb-horizontal .bb-flip-next-end{-webkit-transform:rotateX(15deg);-moz-transform:rotateX(15deg);transform:rotateX(15deg)}.bb-horizontal .bb-flip-prev-end{-webkit-transform:rotateX(165deg);-moz-transform:rotateX(165deg);transform:rotateX(165deg)}.bb-item{width:100%;height:100%;position:absolute;top:0;left:0;display:none;background:#5a2c33}.no-js .bb-bookblock,.no-js ul.bb-custom-grid li{width:auto;height:auto}.no-js .bb-item{display:block;position:relative}
-
.bb-bookblock{width:700px;height:450px}ul.bb-custom-grid{list-style:none;margin:0 auto 30px;padding:0}ul.bb-custom-grid:after,ul.bb-custom-grid:before{content:" ";display:table}ul.bb-custom-grid:after{clear:both}ul.bb-custom-grid li{float:left;width:700px;height:480px;padding:10px 20px 50px;background:#fff;position:relative;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;margin-bottom:20px;box-shadow:0 1px 2px rgba(0,0,0,.2)}ul.bb-custom-grid li:nth-child(odd){margin-right:20px}ul.bb-custom-grid li:after,ul.bb-custom-grid li:before{content:'';position:absolute;z-index:-2;bottom:15px;left:10px;width:50%;height:20%;box-shadow:0 15px 10px rgba(0,0,0,.7);-webkit-transform:rotate(-3deg);-moz-transform:rotate(-3deg);-ms-transform:rotate(-3deg);-o-transform:rotate(-3deg);transform:rotate(-3deg)}ul.bb-custom-grid li:after{right:10px;left:auto;-webkit-transform:rotate(3deg);-moz-transform:rotate(3deg);-ms-transform:rotate(3deg);-o-transform:rotate(3deg);transform:rotate(3deg)}ul.bb-custom-grid li a{display:block}ul.bb-custom-grid li h3{color:#9a9b92;margin:0;padding:0;text-transform:uppercase;font-weight:700;font-size:14px;line-height:35px;letter-spacing:1px}ul.bb-custom-grid nav{text-align:center;margin-top:12px;padding-bottom:5px}ul.bb-custom-grid nav span{display:inline-block;width:12px;height:12px;border-radius:50%;background:#f0f0f0;margin:3px;cursor:pointer;box-shadow:inset 0 1px 1px rgba(0,0,0,.2),0 2px 1px rgba(255,255,255,.9)}ul.bb-custom-grid nav span.bb-current{background:#ecb700}
+
.bb-bookblock{width:700px;height:450px}ul.bb-custom-grid{list-style:none;margin:0 auto 30px;padding:0;width:740px;}ul.bb-custom-grid:after,ul.bb-custom-grid:before{content:" ";display:table}ul.bb-custom-grid:after{clear:both}ul.bb-custom-grid li{float:left;width:700px;height:480px;padding:10px 20px 50px;background:url('https://static.igem.org/mediawiki/2014/7/78/VBT_loadingIcon.gif') #5a2c33 no-repeat center center; position:relative;-webkit-box-sizing:content-box;-moz-box-sizing:content-box;box-sizing:content-box;margin-bottom:20px;box-shadow:0 1px 2px rgba(0,0,0,.2)}ul.bb-custom-grid li:nth-child(odd){margin-right:20px}ul.bb-custom-grid li:after,ul.bb-custom-grid li:before{content:'';position:absolute;z-index:-2;bottom:15px;left:10px;width:50%;height:20%;box-shadow:0 15px 10px rgba(0,0,0,.7);-webkit-transform:rotate(-3deg);-moz-transform:rotate(-3deg);-ms-transform:rotate(-3deg);-o-transform:rotate(-3deg);transform:rotate(-3deg)}ul.bb-custom-grid li:after{right:10px;left:auto;-webkit-transform:rotate(3deg);-moz-transform:rotate(3deg);-ms-transform:rotate(3deg);-o-transform:rotate(3deg);transform:rotate(3deg)}ul.bb-custom-grid li a{display:block}ul.bb-custom-grid li h3{color:#9a9b92;margin:0;padding:0;text-transform:uppercase;font-weight:700;font-size:14px;line-height:35px;letter-spacing:1px}ul.bb-custom-grid nav{text-align:center;margin-top:12px;padding-bottom:5px}ul.bb-custom-grid nav span{display:inline-block;width:12px;height:12px;border-radius:50%;background:#f0f0f0;margin:3px;cursor:pointer;box-shadow:inset 0 1px 1px rgba(0,0,0,.2),0 2px 1px rgba(255,255,255,.9)}ul.bb-custom-grid nav span.bb-current{background:#6EFF6E}
</style>
</style>
-
<script type="text/javascript" src="https://2013.igem.org/wiki/index.php?title=Template:Team:Valencia_Biocampus/Templates/js/bookblock&action=raw&ctype=text/javascript"></script>
+
<script type="text/javascript" src="https://2014.igem.org/wiki/index.php?title=Template:Team:Valencia_Biocampus/Templates/js/bookblock&action=raw&ctype=text/javascript"></script>
-
<script type="text/javascript">
+
-
var Page = (function() {
+
-
var $grid = $( '#bb-custom-grid' );
+
   <div class="container withBackground">
-
 
+
-
return {
+
-
init : function() {
+
-
$grid.find( 'div.bb-bookblock' ).each( function( i ) {
+
-
+
-
var $bookBlock = $( this ),
+
-
$nav = $bookBlock.next().children( 'span' ),
+
-
bb = $bookBlock.bookblock( {
+
-
speed : 600,
+
-
shadows : false
+
-
} );
+
-
+
-
// add navigation events
+
-
$nav.each( function( i ) {
+
-
$( this ).on( 'click touchstart', function( event ) {
+
-
var $dot = $( this );
+
-
$nav.removeClass( 'bb-current' );
+
-
$dot.addClass( 'bb-current' );
+
-
$bookBlock.bookblock( 'jump', i + 1 );
+
-
return false;
+
-
} );
+
-
} );
+
-
+
-
// add swipe events
+
-
$bookBlock.children().on( {
+
-
'swipeleft' : function( event ) {
+
-
$bookBlock.bookblock( 'next' );
+
-
return false;
+
-
},
+
-
'swiperight' : function( event ) {
+
-
$bookBlock.bookblock( 'prev' );
+
-
return false;
+
-
}
+
-
 
+
-
} );
+
-
+
-
} );
+
-
}
+
-
};
+
-
 
+
-
})();
+
-
</script>
+
-
   <div class="container">
+
</html>
</html>
= Art & More=
= Art & More=
Line 83: Line 39:
             <h2>Photo</h2>
             <h2>Photo</h2>
             <div style="text-align:center">
             <div style="text-align:center">
 +
<a href="https://static.igem.org/mediawiki/2014/a/aa/1381961_664044267035783_8751816581880977398_n.jpg" rel="lightbox-pics" title="The Team!" class="thumbnail col-sm-2">
 +
<img src="https://static.igem.org/mediawiki/2014/a/aa/1381961_664044267035783_8751816581880977398_n.jpg" alt="Photo 19"/></a> 
-
<a href="https://static.igem.org/mediawiki/2014/6/60/Vbt_Art%26More%281%29.jpg" rel="lightbox-pics" title="Overview" class="thumbnail col-sm-2">
+
<a href="https://static.igem.org/mediawiki/2014/6/60/Vbt_Art%26More%281%29.jpg" rel="lightbox-pics" title="Paula's collection of brushes" class="thumbnail col-sm-2">
<img src="https://static.igem.org/mediawiki/2014/6/60/Vbt_Art%26More%281%29.jpg" alt="Photo 1"/></a>
<img src="https://static.igem.org/mediawiki/2014/6/60/Vbt_Art%26More%281%29.jpg" alt="Photo 1"/></a>
-
<a href="https://static.igem.org/mediawiki/2014/0/0b/Vbt_Art%26More%282%29.jpg" rel="lightbox-pics" title="Overview" class="thumbnail col-sm-2">
+
<a href="https://static.igem.org/mediawiki/2014/0/0b/Vbt_Art%26More%282%29.jpg" rel="lightbox-pics" title="Standard teddy bears" class="thumbnail col-sm-2">
<img src="https://static.igem.org/mediawiki/2014/0/0b/Vbt_Art%26More%282%29.jpg" alt="Photo 2"/></a>
<img src="https://static.igem.org/mediawiki/2014/0/0b/Vbt_Art%26More%282%29.jpg" alt="Photo 2"/></a>
-
<a href="https://static.igem.org/mediawiki/2014/a/a4/Vbt_Art%26More%283%29.jpg" rel="lightbox-pics" title="Overview" class="thumbnail col-sm-2">
+
<a href="https://static.igem.org/mediawiki/2014/a/a4/Vbt_Art%26More%283%29.jpg" rel="lightbox-pics" title="Watercolor Stool" class="thumbnail col-sm-2">
<img src="https://static.igem.org/mediawiki/2014/a/a4/Vbt_Art%26More%283%29.jpg" alt="Photo 3"/></a>
<img src="https://static.igem.org/mediawiki/2014/a/a4/Vbt_Art%26More%283%29.jpg" alt="Photo 3"/></a>
-
<a href="https://static.igem.org/mediawiki/2014/d/dc/Vbt_Art%26More%284%29.jpg" rel="lightbox-pics" title="Overview" class="thumbnail col-sm-2">
+
<a href="https://static.igem.org/mediawiki/2014/d/dc/Vbt_Art%26More%284%29.jpg" rel="lightbox-pics" title="Watercolors" class="thumbnail col-sm-2">
<img src="https://static.igem.org/mediawiki/2014/d/dc/Vbt_Art%26More%284%29.jpg" alt="Photo 4"/></a>
<img src="https://static.igem.org/mediawiki/2014/d/dc/Vbt_Art%26More%284%29.jpg" alt="Photo 4"/></a>
-
<a href="https://static.igem.org/mediawiki/2014/4/40/Vbt_Art%26More%285%29.jpg" rel="lightbox-pics" title="Overview" class="thumbnail col-sm-2">
+
<a href="https://static.igem.org/mediawiki/2014/4/40/Vbt_Art%26More%285%29.jpg" rel="lightbox-pics" title="First draft of the child - Paula Bonet Style" class="thumbnail col-sm-2">
<img src="https://static.igem.org/mediawiki/2014/4/40/Vbt_Art%26More%285%29.jpg" alt="Photo 5"/></a>
<img src="https://static.igem.org/mediawiki/2014/4/40/Vbt_Art%26More%285%29.jpg" alt="Photo 5"/></a>
-
<a href="https://static.igem.org/mediawiki/2014/9/93/Vbt_Art%26More%286%29.jpg" rel="lightbox-pics" title="Overview" class="thumbnail col-sm-2">
+
<a href="https://static.igem.org/mediawiki/2014/9/93/Vbt_Art%26More%286%29.jpg" rel="lightbox-pics" title="Engineering, Wetlab and Art" class="thumbnail col-sm-2">
<img src="https://static.igem.org/mediawiki/2014/9/93/Vbt_Art%26More%286%29.jpg" alt="Photo 6"/></a>
<img src="https://static.igem.org/mediawiki/2014/9/93/Vbt_Art%26More%286%29.jpg" alt="Photo 6"/></a>
-
<a href="https://static.igem.org/mediawiki/2014/e/ec/Vbt_Art%26More%287%29.jpg" rel="lightbox-pics" title="Overview" class="thumbnail col-sm-2">
+
<a href="https://static.igem.org/mediawiki/2014/e/ec/Vbt_Art%26More%287%29.jpg" rel="lightbox-pics" title="Miniature stools on a Petri dish" class="thumbnail col-sm-2">
<img src="https://static.igem.org/mediawiki/2014/e/ec/Vbt_Art%26More%287%29.jpg" alt="Photo 7"/></a>
<img src="https://static.igem.org/mediawiki/2014/e/ec/Vbt_Art%26More%287%29.jpg" alt="Photo 7"/></a>
-
<a href="https://static.igem.org/mediawiki/2014/a/a6/Vbt_Art%26More%288%29.jpg" rel="lightbox-pics" title="Overview" class="thumbnail col-sm-2">
+
<a href="https://static.igem.org/mediawiki/2014/a/a6/Vbt_Art%26More%288%29.jpg" rel="lightbox-pics" title="Growing stools" class="thumbnail col-sm-2">
<img src="https://static.igem.org/mediawiki/2014/a/a6/Vbt_Art%26More%288%29.jpg" alt="Photo 8"/></a>   
<img src="https://static.igem.org/mediawiki/2014/a/a6/Vbt_Art%26More%288%29.jpg" alt="Photo 8"/></a>   
-
<a href="https://static.igem.org/mediawiki/2014/b/b9/Vbt_Art%26More%289%29.jpg" rel="lightbox-pics" title="Overview" class="thumbnail col-sm-2">
+
<a href="https://static.igem.org/mediawiki/2014/b/b9/Vbt_Art%26More%289%29.jpg" rel="lightbox-pics" title="Untidy" class="thumbnail col-sm-2">
<img src="https://static.igem.org/mediawiki/2014/b/b9/Vbt_Art%26More%289%29.jpg" alt="Photo 9"/></a>   
<img src="https://static.igem.org/mediawiki/2014/b/b9/Vbt_Art%26More%289%29.jpg" alt="Photo 9"/></a>   
-
<a href="https://static.igem.org/mediawiki/2014/a/af/Vbt_Art%26More%2810%29.jpg" rel="lightbox-pics" title="Overview" class="thumbnail col-sm-2">
+
<a href="https://static.igem.org/mediawiki/2014/a/af/Vbt_Art%26More%2810%29.jpg" rel="lightbox-pics" title="3D printer" class="thumbnail col-sm-2">
<img src="https://static.igem.org/mediawiki/2014/a/af/Vbt_Art%26More%2810%29.jpg" alt="Photo 10"/></a>   
<img src="https://static.igem.org/mediawiki/2014/a/af/Vbt_Art%26More%2810%29.jpg" alt="Photo 10"/></a>   
-
<a href="https://static.igem.org/mediawiki/2014/4/4a/Vbt_Art%26More%2811%29.jpg" rel="lightbox-pics" title="Overview" class="thumbnail col-sm-2">
+
<a href="https://static.igem.org/mediawiki/2014/4/4a/Vbt_Art%26More%2811%29.jpg" rel="lightbox-pics" title="Printing our stools" class="thumbnail col-sm-2">
<img src="https://static.igem.org/mediawiki/2014/4/4a/Vbt_Art%26More%2811%29.jpg" alt="Photo 11"/></a>   
<img src="https://static.igem.org/mediawiki/2014/4/4a/Vbt_Art%26More%2811%29.jpg" alt="Photo 11"/></a>   
-
<a href="https://static.igem.org/mediawiki/2014/3/3c/Vbt_Art%26More%2812%29.jpg" rel="lightbox-pics" title="Overview" class="thumbnail col-sm-2">
+
<a href="https://static.igem.org/mediawiki/2014/3/3c/Vbt_Art%26More%2812%29.jpg" rel="lightbox-pics" title="In detail" class="thumbnail col-sm-2">
<img src="https://static.igem.org/mediawiki/2014/3/3c/Vbt_Art%26More%2812%29.jpg" alt="Photo 12"/></a>   
<img src="https://static.igem.org/mediawiki/2014/3/3c/Vbt_Art%26More%2812%29.jpg" alt="Photo 12"/></a>   
-
<a href="https://static.igem.org/mediawiki/2014/f/f9/Vbt_Art%26More%2813%29.jpg" rel="lightbox-pics" title="Overview" class="thumbnail col-sm-2">
+
<a href="https://static.igem.org/mediawiki/2014/f/f9/Vbt_Art%26More%2813%29.jpg" rel="lightbox-pics" title="Designing the stools" class="thumbnail col-sm-2">
<img src="https://static.igem.org/mediawiki/2014/f/f9/Vbt_Art%26More%2813%29.jpg" alt="Photo 13"/></a>   
<img src="https://static.igem.org/mediawiki/2014/f/f9/Vbt_Art%26More%2813%29.jpg" alt="Photo 13"/></a>   
-
<a href="https://static.igem.org/mediawiki/2014/2/23/Vbt_Art%26More%2814%29.jpg" rel="lightbox-pics" title="Overview" class="thumbnail col-sm-2">
+
<a href="https://static.igem.org/mediawiki/2014/2/23/Vbt_Art%26More%2814%29.jpg" rel="lightbox-pics" title="Science, art and music" class="thumbnail col-sm-2">
<img src="https://static.igem.org/mediawiki/2014/1/1a/Vbt_Art%26More%2815%292.jpg" alt="Photo 14"/></a>   
<img src="https://static.igem.org/mediawiki/2014/1/1a/Vbt_Art%26More%2815%292.jpg" alt="Photo 14"/></a>   
-
<a href="https://static.igem.org/mediawiki/2014/4/49/Vbt_Art%26More%2815%29.jpg" rel="lightbox-pics" title="Overview" class="thumbnail col-sm-2">
+
<a href="https://static.igem.org/mediawiki/2014/4/49/Vbt_Art%26More%2815%29.jpg" rel="lightbox-pics" title="The legs are almost finished" class="thumbnail col-sm-2">
<img src="https://static.igem.org/mediawiki/2014/4/49/Vbt_Art%26More%2815%29.jpg" alt="Photo 15"/></a>   
<img src="https://static.igem.org/mediawiki/2014/4/49/Vbt_Art%26More%2815%29.jpg" alt="Photo 15"/></a>   
-
<a href="https://static.igem.org/mediawiki/2014/d/d3/Vbt_Art%26More%2816%29.jpg" rel="lightbox-pics" title="Overview" class="thumbnail col-sm-2">
+
<a href="https://static.igem.org/mediawiki/2014/d/d3/Vbt_Art%26More%2816%29.jpg" rel="lightbox-pics" title="This is not an alien, it is our tool robot!" class="thumbnail col-sm-2">
<img src="https://static.igem.org/mediawiki/2014/d/d3/Vbt_Art%26More%2816%29.jpg" alt="Photo 16"/></a>   
<img src="https://static.igem.org/mediawiki/2014/d/d3/Vbt_Art%26More%2816%29.jpg" alt="Photo 16"/></a>   
-
<a href="https://static.igem.org/mediawiki/2014/6/64/Vbt_Art%26More%2817%29.jpg" rel="lightbox-pics" title="Overview" class="thumbnail col-sm-2">
+
<a href="https://static.igem.org/mediawiki/2014/6/64/Vbt_Art%26More%2817%29.jpg" rel="lightbox-pics" title="Too many cables" class="thumbnail col-sm-2">
<img src="https://static.igem.org/mediawiki/2014/6/64/Vbt_Art%26More%2817%29.jpg" alt="Photo 17"/></a>   
<img src="https://static.igem.org/mediawiki/2014/6/64/Vbt_Art%26More%2817%29.jpg" alt="Photo 17"/></a>   
-
<a href="https://static.igem.org/mediawiki/2014/1/1a/Vbt_Art%26More%2818%29.jpg" rel="lightbox-pics" title="Overview" class="thumbnail col-sm-2">
+
<a href="https://static.igem.org/mediawiki/2014/1/1a/Vbt_Art%26More%2818%29.jpg" rel="lightbox-pics" title="Serial injectors" class="thumbnail col-sm-2">
<img src="https://static.igem.org/mediawiki/2014/1/1a/Vbt_Art%26More%2818%29.jpg" alt="Photo 18"/></a>   
<img src="https://static.igem.org/mediawiki/2014/1/1a/Vbt_Art%26More%2818%29.jpg" alt="Photo 18"/></a>   
-
<a href="https://static.igem.org/mediawiki/2014/3/33/Vbt_Art%26More%2819%29.jpg" rel="lightbox-pics" title="Overview" class="thumbnail col-sm-2">
+
<a href="https://static.igem.org/mediawiki/2014/3/33/Vbt_Art%26More%2819%29.jpg" rel="lightbox-pics" title="Servos resting" class="thumbnail col-sm-2">
<img src="https://static.igem.org/mediawiki/2014/3/33/Vbt_Art%26More%2819%29.jpg" alt="Photo 19"/></a>   
<img src="https://static.igem.org/mediawiki/2014/3/33/Vbt_Art%26More%2819%29.jpg" alt="Photo 19"/></a>   
Line 154: Line 112:
         <div class="tab-pane fade" id="Drawings">
         <div class="tab-pane fade" id="Drawings">
             <h2>Drawings</h2>
             <h2>Drawings</h2>
-
            <p>A compilation of all our drawings</p>
+
<ul class="bb-custom-grid center-block" id="bb-custom-grid">
-
<ul class="bb-custom-grid" id="bb-custom-grid">
+
<li>
<li>
<div class="bb-bookblock">
<div class="bb-bookblock">
-
<div class="bb-item"><a href=""><img src="https://static.igem.org/mediawiki/2014/7/77/Vbt_drawings1.jpg" alt="image01" /></a></div>
+
<div class="bb-item"><img src="https://static.igem.org/mediawiki/2014/7/77/Vbt_drawings1.jpg" alt="image01" /></div>
-
<div class="bb-item"><a href=""><img src="https://static.igem.org/mediawiki/2014/7/77/Vbt_drawings1.jpg" alt="image02"/></a></div>
+
<div class="bb-item"><img src="https://static.igem.org/mediawiki/2014/b/b4/Vbt_drawings2.jpg" alt="image02"/></div>
-
<div class="bb-item"><a href=""><img src="https://static.igem.org/mediawiki/2014/7/77/Vbt_drawings1.jpg" alt="image03"/></a></div>
+
<div class="bb-item"><img src="https://static.igem.org/mediawiki/2014/2/27/Vbt_drawings3.jpg" alt="image03"/></div>
-
<div class="bb-item"><a href=""><img src="https://static.igem.org/mediawiki/2014/7/77/Vbt_drawings1.jpg" alt="image04"/></a></div>
+
<div class="bb-item"><img src="https://static.igem.org/mediawiki/2014/4/41/Vbt_drawings4.jpg" alt="image04"/></div>
-
<div class="bb-item"><a href=""><img src="https://static.igem.org/mediawiki/2014/7/77/Vbt_drawings1.jpg" alt="image05"/></a></div>
+
<div class="bb-item"><img src="https://static.igem.org/mediawiki/2014/9/9f/Vbt_drawings5.jpg" alt="image05"/></div>
-
<div class="bb-item"><a href=""><img src="https://static.igem.org/mediawiki/2014/7/77/Vbt_drawings1.jpg" alt="image06"/></a></div>
+
<div class="bb-item"><img src="https://static.igem.org/mediawiki/2014/d/d5/Vbt_drawings6.jpg" alt="image06"/></div>
-
<div class="bb-item"><a href=""><img src="https://static.igem.org/mediawiki/2014/7/77/Vbt_drawings1.jpg" alt="image07"/></a></div>
+
<div class="bb-item"><img src="https://static.igem.org/mediawiki/2014/3/30/Vbt_drawings7.jpg" alt="image07"/></div>
 +
<div class="bb-item"><img src="https://static.igem.org/mediawiki/2014/5/55/Vbt_drawings8.jpg" alt="image08"/></div>
 +
<div class="bb-item"><img src="https://static.igem.org/mediawiki/2014/b/b6/Vbt_drawings9.jpg" alt="image09"/></div>
</div>
</div>
<nav>
<nav>
<span class="bb-current"></span>
<span class="bb-current"></span>
 +
<span></span>
 +
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
Line 179: Line 140:
<script type="text/javascript">
<script type="text/javascript">
-
$(function() {
+
var Page = (function() {
-
    Page.init();
+
 
 +
var $grid = $( '#bb-custom-grid' );
 +
 
 +
return {
 +
init : function() {
 +
$grid.find( 'div.bb-bookblock' ).each( function( i ) {
 +
 +
var $bookBlock = $( this ),
 +
$nav = $bookBlock.next().children( 'span' ),
 +
bb = $bookBlock.bookblock( {
 +
speed : 600,
 +
shadows : false
 +
} );
 +
 +
// add navigation events
 +
$nav.each( function( i ) {
 +
$( this ).on( 'click touchstart', function( event ) {
 +
var $dot = $( this );
 +
$nav.removeClass( 'bb-current' );
 +
$dot.addClass( 'bb-current' );
 +
$bookBlock.bookblock( 'jump', i + 1 );
 +
return false;
 +
} );
 +
} );
 +
 +
// add swipe events
 +
$bookBlock.children().on( {
 +
'swipeleft' : function( event ) {
 +
$bookBlock.bookblock( 'next' );
 +
return false;
 +
},
 +
'swiperight' : function( event ) {
 +
$bookBlock.bookblock( 'prev' );
 +
return false;
 +
}
 +
 
 +
} );
 +
 +
} );
 +
}
 +
};
 +
 
 +
})();
 +
 
 +
 
 +
$(window).load(function() {
 +
Page.init();
});
});
 +
</script>
</script>
         </div>
         </div>
Line 188: Line 196:
==Epigenetic Music==
==Epigenetic Music==
<html>
<html>
 +
<iframe width="560" height="315" class="center-block" style="margin-bottom:20px"src="//www.youtube.com/embed/ZyuC0JNW8mw?rel=0&amp;showinfo=0" frameborder="0" allowfullscreen></iframe>
<p>
<p>
     The term <strong>epigenetic </strong>refers to heritable changes in gene expression, and therefore, in the phenotype of a cell, that don’t imply
     The term <strong>epigenetic </strong>refers to heritable changes in gene expression, and therefore, in the phenotype of a cell, that don’t imply
Line 222: Line 231:
</p>
</p>
<p>
<p>
-
“Without music, life would be a mistake.” - Friedrich Nietzsche, Twilight of the Idols, Or, How to Philosophize With the Hammer  
+
“<em>Without music, life would be a mistake.</em>” - Friedrich Nietzsche, Twilight of the Idols, Or, How to Philosophize With the Hammer  
</p>
</p>
         </div>
         </div>

Latest revision as of 00:48, 18 October 2014

Art & More

Video

Drawings

  • image01
    image02
    image03
    image04
    image05
    image06
    image07
    image08
    image09

Epigenetic Music

The term epigenetic refers to heritable changes in gene expression, and therefore, in the phenotype of a cell, that don’t imply modifications in the DNA sequence. Like many eukaryotic cells, bacteria also use epigenetic DNA modifications to control gene expression (i.e. methylation).

LacZ has been “translated” without modification in to music, but the melody makes little sense. That is why we are going to apply the epigenetic concept to music, by translating to the musical realm the modifications that occur in bacteria in order to regulate gene expression. That way, correct expression of the melody will be achieved by regulating notes the following way:

- Metilation. Represses gene expression, as it represses the expression of a musical note by reducing the original length.

- Hypermetilation. Silences promoters, and therefore, silences a musical note.

Finally, we will use a post-transcriptional control mechanism by sRNA that is used in certain bacteria to activate gene expression. In music, this mechanism can increase the length of a note.

Integral serialism is a musical current that arose mid-twentieth century in Europe and United States. It emerged as a novel type of musical annotation that can be considered a variation of Schönberg’s 12-tone music (an attempt to erase the system of tonality). The 12-tone music annotation system stipulates that a note cannot be used again until all other 11 notes of the chromatic scale are used. Serialism can be applied to the use of fewer than 12 tones, and the result is a musical piece comprising ordered sets. Before starting to compose, everything is set by default, yielding a musical composition far from traditional.

We could consider our musical composition as a variation of integral serialism, as it is also set by default, following a conserved DNA sequence: the LacZ gene. Therefore, we could call this annotation system: genomic serialism.

Without music, life would be a mistake.” - Friedrich Nietzsche, Twilight of the Idols, Or, How to Philosophize With the Hammer