Team:Valencia Biocampus/ArtAndMore
From 2014.igem.org
(→Art & More) |
|||
(5 intermediate revisions not shown) | |||
Line 14: | Line 14: | ||
} | } | ||
.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: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;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:#5a2c33;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} | + | .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> | ||
Line 39: | 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> | ||
Line 121: | Line 123: | ||
<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/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/5/55/Vbt_drawings8.jpg" alt="image08"/></div> | ||
- | <div class="bb-item"><img src="https://static.igem.org/mediawiki/2014/ | + | <div class="bb-item"><img src="https://static.igem.org/mediawiki/2014/b/b6/Vbt_drawings9.jpg" alt="image09"/></div> |
</div> | </div> | ||
<nav> | <nav> |
Latest revision as of 00:48, 18 October 2014
Art & More
Video
Drawings
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