Difference between revisions of "Team:UNIK Copenhagen"

 
(144 intermediate revisions by 3 users not shown)
Line 1: Line 1:
−
{{UNIK_Copenhagen}}
+
{{UNIK_Copenhagen2}}
  
 
<html>
 
<html>
Line 6: Line 6:
 
<style>
 
<style>
  
−
/*---------------------------*/
+
/*-------------------------------------*/
−
/*        Slideshow         */
+
/*        Main part         */
−
/*---------------------------*/
+
/*-------------------------------------*/
−
/**
+
−
* 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
+
−
*/
+
  
−
 
+
#mainPart{
−
/** RESET AND LAYOUT
+
float: left;
−
===================================*/
+
margin:0px -200px 0px 0px;
−
ul.bxslider {
+
height:auto;
−
      margin: 0;
+
width:900px;
 +
        border: none;
 +
        background:white;
 
}
 
}
  
  
−
div#wikicontent ul.bxslider, div#wikicontent ul.bxgallery {
 
−
    margin: 0;
 
−
    padding: 0;
 
−
}
 
  
−
.bx-wrapper {
+
/*  Illustration  */
−
position: relative;
+
 
−
margin: 0 0;
+
div.container {
−
padding: 0;
+
      display:inline-block;
−
*zoom: 1;
+
      clear: left;
−
left:1px;
+
      width:270px;
−
}
+
margin: -1000px 2px 0px 2px;
 +
    }
  
−
.bx-wrapper .bxslider img {
+
.flip-container {
−
width: 938px;
+
    float: left;
−
height: 250px;
+
    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: 938px;
+
.flip-container .back-side {
−
height: 250px;
+
−
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: 938px;
+
 
}
 
}
  
−
.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%;
+
height:auto;
−
width: 938px;
+
width:900px;
−
position: absolute;
+
        border: none;
−
top: 0;
+
        background:white;
−
left: 0;
+
      display:inline-block;
−
z-index: 2000;
+
      clear: center;
 
}
 
}
−
 
+
.logo img{
−
/* PAGER */
+
margin: 10px 5px 10px 25px;
−
 
+
−
.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,
+
.logo img:hover{
−
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
+
opacity: 0.7;
−
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,
+
/*  E-mail  */
−
.bx-wrapper .bx-pager.bx-default-pager a.active {
+
#footer{
−
background: #000;
+
width: 814px;
 +
bottom:0;
 
}
 
}
  
−
/* DIRECTION CONTROLS (NEXT / PREV) */
+
</style>
  
−
.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 {
+
</head>
−
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 {
+
<!--Top front page-->
−
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 {
+
<div class="flip-container">
−
display: none;
+
  <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>
  
−
/* AUTO CONTROLS (START / STOP) */
+
<div class="flip-container">
 +
  <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>
  
−
.bx-wrapper .bx-controls-auto {
+
<div class="flip-container" style="margin: 0px 0px 0px 8px">
−
text-align: center;
+
  <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>
  
−
.bx-wrapper .bx-controls-auto .bx-start {
+
<div class="container">
−
display: block;
+
<img src="https://static.igem.org/mediawiki/2015/e/eb/UNIK_Copenhagen_Homepage_box1.png" width=266px style="margin: -356px 0px 0px 0px">
−
text-indent: -9999px;
+
</div>
−
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,
+
<div class="container">
−
.bx-wrapper .bx-controls-auto .bx-start.active {
+
<img src="https://static.igem.org/mediawiki/2015/2/2f/UNIK_Copenhagen_Homepage_box2.png" width=266px style="margin: -356px 0px 0px 0px">
−
background-position: -86px 0;
+
</div>
−
}
+
  
−
.bx-wrapper .bx-controls-auto .bx-stop {
+
<div class="container">
−
display: block;
+
<img src="https://static.igem.org/mediawiki/2015/a/a2/UNIK_Copenhagen_Homepage_box3.png" width=266px style="margin: -356px 0px 0px 0px">
−
text-indent: -9999px;
+
</div>
−
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 */
+
<div id=logo>
 +
<br><br>
 +
<div class="logo">
 +
<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>
 +
<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 class="logo">
 +
<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>
 +
<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>
 +
</div>
 +
<br><br>
 +
</div>
  
−
.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 {
+
<div id="footer" style="bottom:0;">
−
right: 20px;
+
<hr><br>
−
width: 35px;
+
<p>SpaceMoss <br> Team UNIK Copenhagen <br> <b>e-mail:</b> igemcph@gmail.com<p>
−
}
+
</div>
 +
</div>
  
−
/* 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 end  */
 
−
 
−
</style>
 
−
</head>
 
−
 
−
<!--Slideshow-->
 
−
 
−
<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://2014.igem.org/Team:DTU-Denmark/imageslide.js?action=raw&ctype=text/javascript" type="text/javascript"></script>
 
−
 
−
<ul class="bxslider">
 
−
  <li><img src="https://static.igem.org/mediawiki/2015/d/df/UNIK_Copenhagen_Team_picture_310315.jpg"></li>
 
−
  <li><img src="https://static.igem.org/mediawiki/2015/e/e2/UNIK_Copenhagen_Team_picture2_310315.jpg"></li>
 
−
</ul>
 
  
−
<h2> Welcome to iGEM 2015! </h2>
 
−
<p>Your team has been approved and you are ready to start the iGEM season! </p>
 
  
 +
<!--iGEM stuff
 
<h4>Before you start: </h4>
 
<h4>Before you start: </h4>
 
<p> Please read the following pages:</p>
 
<p> Please read the following pages:</p>
Line 299: Line 215:
 
</ul>  
 
</ul>  
  
−
 
+
<br>
 
<h4>Inspiration</h4>
 
<h4>Inspiration</h4>
 
<p> You can also view other team wikis for inspiration! Here are some examples:</p>
 
<p> You can also view other team wikis for inspiration! Here are some examples:</p>
Line 316: Line 232:
  
 
<a href="https://2015.igem.org/Special:Upload">CLICK HERE TO UPLOAD FILES</a>
 
<a href="https://2015.igem.org/Special:Upload">CLICK HERE TO UPLOAD FILES</a>
−
 
+
-->
  
  

Latest revision as of 13:37, 31 August 2015