Difference between revisions of "Team:UNIK Copenhagen"

 
(41 intermediate revisions by 2 users not shown)
Line 11: Line 11:
  
 
#mainPart{
 
#mainPart{
−
float:left;
+
float: left;
−
margin:10px;
+
margin:0px -200px 0px 0px;
 
height:auto;
 
height:auto;
−
width:800px;
+
width:900px;
 
         border: none;
 
         border: none;
 
         background:white;
 
         background:white;
Line 20: Line 20:
  
  
−
/*---------------------------*/
 
−
/*        Slideshow        */
 
−
/*---------------------------*/
 
−
/**
 
−
* BxSlider v4.0 - Fully loaded, responsive content slider
 
−
* http://bxslider.com
 
−
*
 
−
* Written by: Steven Wanderski, 2012
 
−
* http://stevenwanderski.com
 
−
* (while drinking Belgian ales and listening to jazz)
 
−
*
 
−
* CEO and founder of bxCreative, LTD
 
−
* http://bxcreative.com
 
−
*/
 
  
 +
/*  Illustration  */
  
−
/** RESET AND LAYOUT
+
div.container {
−
===================================*/
+
       display:inline-block;
−
ul.bxslider {
+
      clear: left;
−
       margin: 0;
+
      width:270px;
−
}
+
margin: -1000px 2px 0px 2px;
−
 
+
    }
−
 
+
−
div#wikicontent ul.bxslider, div#wikicontent ul.bxgallery {
+
−
    margin: 0;
+
−
    padding: 0;
+
−
}
+
−
 
+
−
.bx-wrapper {
+
−
position: relative;
+
−
margin: 0 0;
+
−
padding: 0;
+
−
*zoom: 1;
+
−
left:1px;
+
−
}
+
  
−
.bx-wrapper .bxslider img {
+
.flip-container {
−
width: 480px;
+
    float: left;
−
height: 300px;
+
    position: relative;
−
display: block;
+
    perspective: 1000px;
−
        display: inline;
+
    -webkit-perspective: 1000px;  
 
}
 
}
  
−
.bx-wrapper .bxslider li {
+
.flip-container,
−
        background: #FFFFFF;
+
.flip-container .front-side,
−
        text-align: center;
+
.flip-container .back-side {
−
        vertical-align: center;
+
    width: 270px;
 +
    height: 400px;
 +
margin: 0px 2px 0px 2px;
 
}
 
}
  
−
.bx-wrapper .bxgallery img {
+
.flip-container .front-side,
−
width: 960px;
+
.flip-container .back-side {
−
height: 500px;
+
−
display: block;
+
−
margin: auto;
+
 
     position: absolute;
 
     position: absolute;
 
     top: 0;
 
     top: 0;
 
     left: 0;
 
     left: 0;
−
     right: 0;
+
     backface-visibility: hidden;
−
     bottom: 0;
+
     -webkit-backface-visibility: hidden;
 +
    transition: 1.2s;
 +
    -webkit-transition: 1.2s;
 +
    color: #fff;
 +
    font-size: 12px;
 +
    text-align: center;
 +
    padding-top: 0px;
 
}
 
}
  
−
/** THEME
+
.flip-container .back-side {
−
===================================*/
+
    z-index: 1;
−
 
+
    transform: rotateY(180deg);
−
 
+
    -webkit-transform: rotateY(180deg);
−
.bx-wrapper .bx-viewport {
+
−
background: #FFF;
+
−
        border: none;
+
−
        left: -1px;
+
 
}
 
}
  
−
.box-center .bx-wrapper .bx-viewport {
+
.flip-container .front-side {
−
background: #ded6ca;
+
    z-index: 2;
 +
    transform: rotateY(0deg);
 +
    -webkit-transform: rotateY(0deg);
 
}
 
}
  
−
.bx-wrapper .bx-pager,
+
.flip-container:hover .front-side {
−
.bx-wrapper .bx-controls-auto {
+
    transform: rotateY(-180deg);
−
position: absolute;
+
    -webkit-transform: rotateY(-180deg);
−
bottom: 30px;
+
−
width: 480px;
+
 
}
 
}
  
−
.box-center .bx-wrapper .bx-pager,
+
.flip-container:hover .back-side {
−
.box-center .bx-wrapper .bx-controls-auto {
+
    transform: rotateY(0deg);
−
bottom: 2px;
+
    -webkit-transform: rotateY(0deg);
 
}
 
}
  
−
/* LOADER */
 
  
−
.bx-wrapper .bx-loading {
+
/*   Logo  */
−
min-height: 50px;
+
#logo{
−
background: url('https://static.igem.org/mediawiki/2013/8/8d/TUM13_slider_bx_loader.gif') center center no-repeat #fff;
+
margin:0px 0px 0px 100px;
−
height: 100%;
+
−
width: 480px;
+
−
position: absolute;
+
−
top: 0;
+
−
left: 0;
+
−
z-index: 2000;
+
−
}
+
−
 
+
−
/* PAGER */
+
−
 
+
−
.bx-wrapper .bx-pager {
+
−
text-align: center;
+
−
font-size: .85em;
+
−
font-family: Arial;
+
−
font-weight: bold;
+
−
color: #666;
+
−
padding-top: 20px;
+
−
left:20px;
+
−
}
+
−
 
+
−
.bx-wrapper .bx-pager .bx-pager-item,
+
−
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
+
−
display: inline-block;
+
−
*zoom: 1;
+
−
*display: inline;
+
−
}
+
−
 
+
−
.bx-wrapper .bx-pager.bx-default-pager a {
+
−
background: #666;
+
−
text-indent: -9999px;
+
−
display: block;
+
−
width: 10px;
+
−
height: 10px;
+
−
margin: 0 5px;
+
−
outline: 0;
+
−
-moz-border-radius: 5px;
+
−
-webkit-border-radius: 5px;
+
−
border-radius: 5px;
+
−
}
+
−
 
+
−
.bx-wrapper .bx-pager.bx-default-pager a:hover,
+
−
.bx-wrapper .bx-pager.bx-default-pager a.active {
+
−
background: #000;
+
−
}
+
−
 
+
−
/* DIRECTION CONTROLS (NEXT / PREV) */
+
−
 
+
−
.bx-wrapper .bx-prev {
+
−
left: 20px;
+
−
background: url('https://static.igem.org/mediawiki/2013/1/14/TUM13_slider_controls.png') no-repeat 0 -32px;
+
−
}
+
−
 
+
−
.bx-wrapper .bx-next {
+
−
right: 20px;
+
−
background: url('https://static.igem.org/mediawiki/2013/1/14/TUM13_slider_controls.png') no-repeat -43px -32px;
+
−
}
+
−
 
+
−
.bx-wrapper .bx-prev:hover {
+
−
background-position: 0 0;
+
−
}
+
−
 
+
−
.bx-wrapper .bx-next:hover {
+
−
background-position: -43px 0;
+
−
}
+
−
 
+
−
.bx-wrapper .bx-controls-direction a {
+
−
position: absolute;
+
−
top: 50%;
+
−
margin-top: -16px;
+
−
outline: 0;
+
−
width: 32px;
+
−
height: 32px;
+
−
text-indent: -9999px;
+
−
z-index: 9995;
+
−
}
+
−
 
+
−
.bx-wrapper .bx-controls-direction a.disabled {
+
−
display: none;
+
−
}
+
−
 
+
−
/* AUTO CONTROLS (START / STOP) */
+
−
 
+
−
.bx-wrapper .bx-controls-auto {
+
−
text-align: center;
+
−
}
+
−
 
+
−
.bx-wrapper .bx-controls-auto .bx-start {
+
−
display: block;
+
−
text-indent: -9999px;
+
−
width: 10px;
+
−
height: 11px;
+
−
outline: 0;
+
−
background: url('https://static.igem.org/mediawiki/2013/1/14/TUM13_slider_controls.png') -86px -11px no-repeat;
+
−
margin: 0 3px;
+
−
}
+
−
 
+
−
.bx-wrapper .bx-controls-auto .bx-start:hover,
+
−
.bx-wrapper .bx-controls-auto .bx-start.active {
+
−
background-position: -86px 0;
+
−
}
+
−
 
+
−
.bx-wrapper .bx-controls-auto .bx-stop {
+
−
display: block;
+
−
text-indent: -9999px;
+
−
width: 9px;
+
−
height: 11px;
+
−
outline: 0;
+
−
background: url('https://static.igem.org/mediawiki/2013/1/14/TUM13_slider_controls.png') -86px -44px no-repeat;
+
−
margin: 0 3px;
+
−
}
+
−
 
+
−
.bx-wrapper .bx-controls-auto .bx-stop:hover,
+
−
.bx-wrapper .bx-controls-auto .bx-stop.active {
+
−
background-position: -86px -33px;
+
−
}
+
−
 
+
−
/* PAGER WITH AUTO-CONTROLS HYBRID LAYOUT */
+
−
 
+
−
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-pager {
+
−
text-align: left;
+
−
width: 80%;
+
−
}
+
−
 
+
−
.bx-wrapper .bx-controls.bx-has-controls-auto.bx-has-pager .bx-controls-auto {
+
−
right: 20px;
+
−
width: 35px;
+
−
}
+
−
 
+
−
/* IMAGE CAPTIONS */
+
−
 
+
−
.bx-wrapper .bx-caption {
+
−
position: absolute;
+
−
bottom: 0;
+
−
left: 0;
+
−
background: #666\9;
+
−
background: rgba(80, 80, 80, 0.75);
+
−
width: 100%;
+
−
}
+
−
 
+
−
.bx-wrapper .bx-caption span {
+
−
color: #fff;
+
−
font-family: Arial;
+
−
display: block;
+
−
font-size: .85em;
+
−
padding: 0px;
+
−
}
+
−
 
+
−
/* Slideshow box */
+
−
.slideshowholder{
+
−
float: left;
+
−
width: 480px;
+
−
margin: 0px 10px 0px 150px;
+
−
}
+
−
/*  Slideshow end  */
+
−
 
+
−
/*-------------------------------------*/
+
−
/*        Two parts        */
+
−
/*-------------------------------------*/
+
−
 
+
−
#twoParts{
+
−
float:left;
+
−
margin:0px;
+
 
height:auto;
 
height:auto;
−
width:920px;
+
width:900px;
 
         border: none;
 
         border: none;
 
         background:white;
 
         background:white;
 +
      display:inline-block;
 +
      clear: center;
 
}
 
}
−
.one{
+
.logo img{
−
margin: 10px 0px;
+
margin: 10px 5px 10px 25px;
−
padding:10px 10px 10px 10px;
+
−
height:auto;
+
−
width:400px;
+
−
float:left;
+
−
}
+
−
.two{
+
−
margin: 10px 0px;
+
−
padding:10px 10px 10px 10px;
+
−
height:auto;
+
−
width:400px;
+
−
float:right;
+
−
}
+
−
#twoParts h1{
+
−
font-family: "Lucida sans unicode", sans-serif;
+
−
font-size: 20px;
+
 
}
 
}
  
−
.one p{
+
.logo img:hover{
−
font-family:'Lato', sans-serif;
+
opacity: 0.7;
−
font-size:10.5pt;
+
−
line-height:18px;
+
−
text-align:justify;
+
−
}
+
−
 
+
−
/* Two parts end */
+
−
 
+
−
 
+
−
/*  Logo  */
+
−
.logo img{
+
−
margin: 10px 5px 10px 25px;
+
 
}
 
}
  
Line 316: Line 104:
 
/*  E-mail  */
 
/*  E-mail  */
 
#footer{
 
#footer{
−
width: 810px;
+
width: 814px;
 
bottom:0;
 
bottom:0;
 
}
 
}
Line 322: Line 110:
 
</style>
 
</style>
  
−
<!--Twitter box-->
 
−
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
 
  
 
</head>
 
</head>
  
 
<!--Top front page-->
 
<!--Top front page-->
−
<div id="twoParts">
 
  
−
<div class="one">
 
−
                            <h1>Project SpaceMoss</h1>
 
  
−
<p>SpaceMoss is an interdisciplinary team of students, including biologists, physicists, and business students, who are working on bringing us one step closer to a human presence on Mars.
 
−
<br></br>
 
  
−
Specifically, SpaceMoss is working on a new breed of moss designed to survive on the red planet. Moss can be engineered to produce an almost limitless variety of compounds, and the implications are enormous. If we can get designed moss to grow on Mars, it could potentially provide pharmaceuticals for the first colonists, plastics for use in 3D printers on the first Mars outpost, or even long term terraforming of the entire planet.
+
<div class="flip-container">
−
<br></br>
+
  <div class="front-side">
 +
  <img src="https://static.igem.org/mediawiki/2015/e/e0/UNIK_Copenhagen_SpaceMoss_logo_small.png" width=65%></div>
 +
  <div class="back-side">
 +
  <img src="https://static.igem.org/mediawiki/2015/e/e0/UNIK_Copenhagen_SpaceMoss_logo_small.png" width=65%>
 +
  </div>
 +
</div>
  
−
But creating moss capable of surviving the harsh Martian conditions is no trivial task. One challenge for our moss, and the one we’ve decided to tackle first, is the violent temperature fluctuations on Mars. Therefore, our <a href="https://2015.igem.org/team:UNIK_Copenhagen/Green_Lab"><font color="green">Green</font> <font color="black">Lab</font></a> is currently hard at work creating freeze-resistant moss, while our <a href="https://2015.igem.org/Team:UNIK_Copenhagen/Red_Lab"><font color="red">Red</font> <font color="black">Lab</font></a> is busy setting up experiments to simulate the conditions on the surface of Mars, in order to test the viability of our Moss.
+
<div class="flip-container">
−
<br></br>
+
  <div class="front-side">
 +
  <img src="https://static.igem.org/mediawiki/2015/a/af/IGEM_logo_small.png" width=65%></div>
 +
  <div class="back-side">
 +
  <img src="https://static.igem.org/mediawiki/2015/a/af/IGEM_logo_small.png" width=65%>
 +
  </div>
 +
</div>
  
 +
<div class="flip-container" style="margin: 0px 0px 0px 8px">
 +
  <div class="front-side">
 +
  <img src="https://static.igem.org/mediawiki/2015/2/22/UNIK_Copenhagen_Moss_in_hand_small.png" width=65%></div>
 +
  <div class="back-side">
 +
  <img src="https://static.igem.org/mediawiki/2015/2/22/UNIK_Copenhagen_Moss_in_hand_small.png" width=65%>
 +
  </div>
 +
</div>
  
 +
<div class="container">
 +
<img src="https://static.igem.org/mediawiki/2015/e/eb/UNIK_Copenhagen_Homepage_box1.png" width=266px style="margin: -356px 0px 0px 0px">
 +
</div>
  
−
Our webpage is still under construction, but you can already go <a href="https://2015.igem.org/team:UNIK_Copenhagen/Team">Meet the Team</a>, or <a href="https://2015.igem.org/team:UNIK_Copenhagen/Description">read more about our project</a>.
+
<div class="container">
−
More information, photos etc. will come as our work proceeds, so stay tuned, and make sure to follow us on <a href="https://twitter.com/SpaceMossUCPH">Twitter</a> and <a href="https://www.facebook.com/pages/SpaceMoss/807231196020265?fref=ts">Facebook</a> for the latest news!</p><br>
+
<img src="https://static.igem.org/mediawiki/2015/2/2f/UNIK_Copenhagen_Homepage_box2.png" width=266px style="margin: -356px 0px 0px 0px">
−
</div>
+
</div>
  
−
 
+
<div class="container">
−
<div class="two">
+
<img src="https://static.igem.org/mediawiki/2015/a/a2/UNIK_Copenhagen_Homepage_box3.png" width=266px style="margin: -356px 0px 0px 0px">
−
 
+
−
 
+
−
<script type="text/javascript">
+
−
today = new Date();
+
−
BigDay = new Date("September 24, 2015");
+
−
msPerDay = 24 * 60 * 60 * 1000 ;
+
−
timeLeft = (BigDay.getTime() - today.getTime());
+
−
e_daysLeft = timeLeft / msPerDay;
+
−
daysLeft = Math.floor(e_daysLeft);
+
−
e_hrsLeft = (e_daysLeft - daysLeft)*24;
+
−
hrsLeft = Math.floor(e_hrsLeft);
+
−
minsLeft = Math.floor((e_hrsLeft - hrsLeft)*60);
+
−
document.write("<H4>" + daysLeft + " days " + hrsLeft +" hours and " + minsLeft + " minutes left </H4> Until the Giant Jamboree in Boston<P>");
+
−
</script>
+
−
 
+
−
<br>
+
−
 
+
−
 
+
−
<div class="tweetbar">
+
−
<a class="twitter-timeline" href="https://twitter.com/SpaceMossUCPH" width="300" height="260" data-widget-id="499917303987720193" data-tweet-limit="">Tweets by @SpaceMossUCPH</a></div>
+
−
</div>
+
 
</div>
 
</div>
  
−
<div class="slideshowholder">
 
−
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
 
−
<script src="/js/jquery.bxslider.min.js"></script>
 
−
<script src="https://2015.igem.org/Team:UNIK_Copenhagen/imageslide.js?action=raw&ctype=text/javascript=edit" type="text/javascript"></script>
 
  
−
<ul class="bxslider">
+
<div id=logo>
−
  <li><img src="https://static.igem.org/mediawiki/2015/d/df/UNIK_Copenhagen_Team_picture_310315.jpg" width="400px"></li>
+
<br><br>
−
  <li><img src="https://static.igem.org/mediawiki/2015/e/e2/UNIK_Copenhagen_Team_picture2_310315.jpg" width="400px"></li>
+
<div class="logo">
−
  <li><img src="https://static.igem.org/mediawiki/2015/1/15/WP_20150513_001.jpg" width="400px"></li>
+
<a href="http://www.tycho-bio.com/"><img src="https://static.igem.org/mediawiki/2015/e/e3/UNIK_Copenhagen_TychoBio_logo.png" width=160px title="Click to go to TychoBio's webpage"></a>
−
</ul>
+
<a href="http://www.ku.dk/english"><img src="https://static.igem.org/mediawiki/2015/3/30/UNIK_Copenhagen_Ku_logo.jpg" width=160px title="Click to go to University of Copenhagen's webpage"></a>
 +
<a href="http://www.idtdna.com/site"><img src="https://static.igem.org/mediawiki/2015/c/cc/UNIK_Copenhagen_IDT-Logo.jpg" width=160px title="Click to go to IDT's webpage"></a>
 
</div>
 
</div>
−
 
−
<hr>
 
−
 
−
 
−
 
−
 
−
<hr>
 
−
 
 
<div class="logo">
 
<div class="logo">
−
<img src="https://static.igem.org/mediawiki/2015/e/e3/UNIK_Copenhagen_TychoBio_logo.png" width=160px>
+
<a href="http://www.lundbeckfoundation.com/"><img src="https://static.igem.org/mediawiki/2015/4/48/UNIK_copenhagen_Lundbeckfonden.jpg" width=160px style="margin:0px 0px 0px 100px" title="Click to go to Lundbeckfonden's webpage"></a>
−
<img src="https://static.igem.org/mediawiki/2015/3/30/UNIK_Copenhagen_Ku_logo.jpg" width=160px>
+
<a href="http://www.bachberry.eu/"><img src="https://static.igem.org/mediawiki/2015/b/b8/UNIK_Copenhagen_Backberrylogo.png" width=220px title="Click to go to Bachberry's webpage"></a>
−
<img src="https://static.igem.org/mediawiki/2015/c/cc/UNIK_Copenhagen_IDT-Logo.jpg" width=160px>
+
</div>
−
<img src="https://static.igem.org/mediawiki/2015/4/48/UNIK_copenhagen_Lundbeckfonden.jpg" width=160px>
+
<br><br>
 
</div>
 
</div>
  
Line 404: Line 173:
 
<p>SpaceMoss <br> Team UNIK Copenhagen <br> <b>e-mail:</b> igemcph@gmail.com<p>
 
<p>SpaceMoss <br> Team UNIK Copenhagen <br> <b>e-mail:</b> igemcph@gmail.com<p>
 
</div>
 
</div>
−
 
+
</div>
−
 
+
  
  

Latest revision as of 13:37, 31 August 2015