Team:UCL/Humans

From 2014.igem.org

(Difference between revisions)
Line 2: Line 2:
<!--=================HTML===================-->
<!--=================HTML===================-->
<html>
<html>
-
 
-
<style>
 
-
 
-
.imageoverlay
 
-
{
 
-
  height:100%;
 
-
  width : 100%;
 
-
  background-color: rgba(0,0,0,0.25);
 
-
}
 
-
 
-
.fillerBox
 
-
{
 
-
  height:100%;
 
-
  width : 100%;
 
-
  background-color: rgba(0,0,0,0.25);
 
-
}
 
-
 
-
 
-
.textFloat h3
 
-
{
 
-
  color:white;
 
-
  background-color:black;
 
-
  border:solid 3px white;
 
-
  font-size:0.8em;
 
-
  text-transform: uppercase;
 
-
  padding-bottom:5px;
 
-
  padding-left:5px;
 
-
  padding-right:5px;
 
-
}
 
-
 
-
</style>
 
-
 
<div class="banner-image-special"></div>
<div class="banner-image-special"></div>
-
<div style="padding-top:300px;">
+
<div style="padding-top:500px;">
     <div id='grid'>
     <div id='grid'>
-
 
+
<div class='box' id='team-human'><a href="https://2014.igem.org/Team:UCL/Humans/Team"><span class="overlayx"></span></a></div>
-
<div class='box hover1'>
+
<div class='box' id='collaborations-human'><a href="https://2014.igem.org/Team:UCL/Humans/Collab"><span class="overlayx"></span></a></div>
-
          <a href="https://2014.igem.org/Team:UCL/Humans/Team">
+
<div class='box' id='risk-human'><a href="https://2014.igem.org/Team:UCL/Humans/Risk"><span class="overlayx"></span></a></div>
-
          <div class="image-location" id='team-human'>
+
<div class='box' id='soc-human'><a href="https://2014.igem.org/Team:UCL/Humans/Soci"><span class="overlayx"></span></a></div>
-
            <div class="imageoverlay">
+
<div class='box' id='sponsor-human'><a href="https://2014.igem.org/Team:UCL/Humans/Sponsor"><span class="overlayx"></span></a></div>
-
              <div class="textFloat"><h3>Team and Supervisors</h3></div>
+
         <div class='box' id='gallery-human'><a href="https://2014.igem.org/Team:UCL/Humans/Gallery"><span class="overlayx"></span></a></div>
-
            </div>
+
     <div id='fillers'>
-
          </div>
+
-
          </a>
+
-
        </div>
+
-
 
+
-
        <div class='box hover2'>
+
-
          <a href="https://2014.igem.org/Team:UCL/Humans/Collab">
+
-
          <div class="image-location" id='collaborations-human'>
+
-
            <div class="imageoverlay">
+
-
              <div class="textFloat"><h3>Collaborations</h3></div>
+
-
            </div>
+
-
          </div>
+
-
          </a>
+
-
        </div>
+
-
+
-
        <div class='box hover3'>
+
-
          <a href="https://2014.igem.org/Team:UCL/Humans/Risk">
+
-
          <div class="image-location" id='risk-human'>
+
-
            <div class="imageoverlay">
+
-
              <div class="textFloat"><h3>Risk Assessment</h3></div>
+
-
            </div>
+
-
          </div>         
+
-
          </a>
+
-
        </div>
+
-
 
+
-
<div class='box hover4'>
+
-
          <a href="https://2014.igem.org/Team:UCL/Humans/Soci">
+
-
          <div class="image-location" id='soc-human'>
+
-
            <div class="imageoverlay">
+
-
              <div class="textFloat"><h3>Sociological Imaginations</h3></div>
+
-
            </div>
+
-
          </div>
+
-
          </a>        
+
-
        </div>
+
-
+
-
        <div class='box hover5'>
+
-
          <a href="https://2014.igem.org/Team:UCL/Humans/Sponsor">
+
-
          <div class="image-location" id='sponsor-human'>
+
-
            <div class="imageoverlay">
+
-
              <div class="textFloat"><h3>Sponsorship</h3></div>
+
-
            </div>
+
-
          </div>
+
-
          </a>
+
-
        </div>
+
-
       
+
-
         <div class='box hover6'>
+
-
          <a href="https://2014.igem.org/Team:UCL/Humans/Gallery">
+
-
          <div class="image-location" id='gallery-human'>
+
-
            <div class="imageoverlay">
+
-
              <div class="textFloat"><h3>Gallery</h3></div>
+
-
            </div>
+
-
          </div>         
+
-
          </a>
+
-
        </div>
+
-
 
+
-
     </div>
+
-
 
+
-
<!--    <div id='fillers'>
+
         <div class='fillerBox' id='redd'></div>
         <div class='fillerBox' id='redd'></div>
<div class='fillerBox' id='bluee'></div>
<div class='fillerBox' id='bluee'></div>
<div class='fillerBox' id='yelloww'></div>
<div class='fillerBox' id='yelloww'></div>
-
    </div> -->
 
-
 
-
    <div id='fillers'>
 
-
        <div class='fillerBox'></div>
 
-
<div class='fillerBox'></div>
 
-
<div class='fillerBox'></div>
 
     </div>
     </div>
-
 
</div>
</div>
-
 
<!--=================CSS===================-->
<!--=================CSS===================-->
<style>
<style>
-
/*This styles the span which makes each block a link, the gif is for IE*/
 
.overlayx {
.overlayx {
   position:absolute;  
   position:absolute;  
Line 128: Line 30:
   background-image: url('empty.gif');
   background-image: url('empty.gif');
}
}
-
/*Standard for blocks*/
 
#grid{
#grid{
-
  width: 100%;  
+
width: 100%;  
-
  position: relative;
+
position: relative;
-
  font-size: 25px;
+
font-size: 25px;
-
  font-family: 'Helvetica';
+
font-family: 'Helvetica';
-
  color: #eaeaea;
+
color: #eaeaea;
-
}
+
}
-
.box {
+
.box {
-
  background-clip: border-box;
+
background-color: #c23822;
-
  background-color: white;
+
box-shadow: 0px 0px 1px #222;
-
  opacity:0.95;
+
float: left;
-
  background-image: none;
+
position: relative;
-
  background-origin: padding-box;
+
}
-
  background-size: auto;
+
#fillers{
-
  box-sizing: border-box;
+
display: none;
-
  color: rgb(167, 160, 162);
+
}
-
  display: block;
+
.fillerBox {
-
  font-family: Lato, Arial, sans-serif;
+
background-color: #751e11;
-
  font-size: 16px;
+
box-shadow: 0px 0px 1px #222;
-
  font-weight: normal;
+
float: left;
-
  box-shadow: 0px 0px 1px #222;
+
position: relative;
-
  float: left;
+
}
-
  position: relative;
+
-
  margin:0;
+
-
  text-align: center;
+
-
}
+
-
 
+
-
#fillers{
+
-
  display: none;
+
-
}
+
-
/*Banner*/
 
.banner-image-special {
.banner-image-special {
     background: url('https://static.igem.org/mediawiki/2014/6/6f/Human_Elements.png') center no-repeat;
     background: url('https://static.igem.org/mediawiki/2014/6/6f/Human_Elements.png') center no-repeat;
     width:100%;
     width:100%;
     margin-top: 1%;
     margin-top: 1%;
-
background-size:100%;
+
    background-size:100%;
     max-width:850px;
     max-width:850px;
-
     height:100px;
+
     height:270px;
     position:fixed;
     position:fixed;
-
     padding-top:170px;
+
     padding-top:150px;
}
}
@media (min-width: 1140px) {
@media (min-width: 1140px) {
     .banner-image-special {
     .banner-image-special {
-
     margin-left:-425px;
+
     max-width: none;
-
     left:50%;
+
     width:100%;
-
     padding-top:250px;
+
     margin-top:70px;
     }
     }
}
}
-
.image-location {
 
-
    /*margin-left:12.5%;
 
-
    margin-right:12.5%;
 
-
    margin-top:7%;*/
 
-
    height:100%;
 
-
    width:100%;
 
-
    position:absolute;
 
-
    background-color:transparent;
 
-
}
 
-
.textFloat {
 
-
z-index:3;
 
-
float:center;
 
-
position:absolute;
 
-
width:50%;
 
-
margin:0 25%;
 
-
top:35%;
 
-
}
 
-
 
-
 
-
/* Individual Blocks */
 
#team-human {
#team-human {
-
    background: url('https://static.igem.org/mediawiki/2014/f/f4/TeamissupersexyLine.png') center no-repeat;
+
     background: url('https://static.igem.org/mediawiki/2014/7/75/Team_and_SupervisorsUCL.png') center no-repeat;  
-
    background-size:100%;
+
     background-size:56%;
-
    color:black;
+
}
-
}
+
-
.hover1:hover #team-human {
+
-
     background: url('https://static.igem.org/mediawiki/2014/7/73/Teamissupersexy.png') center no-repeat;  
+
-
     background-size:100%;
+
-
    color:black;
+
-
}
+
-
 
+
#collaborations-human {
#collaborations-human {
-
     background: url('https://static.igem.org/mediawiki/2014/2/21/CollabLineUCL.png') center no-repeat;  
+
     background: url('https://static.igem.org/mediawiki/2014/0/0c/CollaborationsUCL.png') center no-repeat;  
-
     background-size:100%;
+
     background-size:56%;
-
    color:black;
+
-
}
+
-
.hover2:hover #collaborations-human {
+
-
    background: url('https://static.igem.org/mediawiki/2014/3/3d/10491123_10204437153717396_7991059471759774917_n.jpg') center no-repeat;
+
-
    background-size:100%;
+
-
    color:black;
+
}
}
#risk-human {
#risk-human {
-
     background: url('https://static.igem.org/mediawiki/2014/f/f3/UCL_clipboard_Line.png') center no-repeat;  
+
     background: url('https://static.igem.org/mediawiki/2014/b/be/Risk_AssessmentUCL.png') center no-repeat;  
-
     background-size:100%;
+
     background-size:56%;
-
    color:black;
+
}
}
-
.hover3:hover #risk-human {
 
-
    background: url('https://static.igem.org/mediawiki/2014/d/d1/UCL_clipboard.png') center no-repeat;
 
-
    background-size:100%;
 
-
    color:black;
 
-
}
 
-
 
#soc-human {
#soc-human {
-
     background: url('https://static.igem.org/mediawiki/2014/d/d5/Group_Social_UCL_Line.png') center no-repeat;  
+
     background: url('https://static.igem.org/mediawiki/2014/e/eb/SociologicalImagUCL.png') center no-repeat;  
-
     background-size:100%;
+
     background-size:56%;
-
    color:black;
+
}
}
-
.hover4:hover #soc-human {
 
-
    background: url('https://static.igem.org/mediawiki/2014/8/83/Group_social_350x450.png') center no-repeat;
 
-
    background-size:100%;
 
-
    color:black;
 
-
}
 
-
 
#sponsor-human {
#sponsor-human {
-
     background: url('https://static.igem.org/mediawiki/2014/d/df/UCL_Eng_Logo_Line.png') center no-repeat;  
+
     background: url('https://static.igem.org/mediawiki/2014/3/32/SponsorshipUCL.png') center no-repeat;  
-
     background-size:100%;
+
     background-size:56%;
-
    color:black;
+
}
}
-
.hover5:hover #sponsor-human {
 
-
    background: url('https://static.igem.org/mediawiki/2014/1/1a/UCL_Eng_logo_2.png') center no-repeat;
 
-
    background-size:100%;
 
-
    color:black;
 
-
}
 
-
 
#gallery-human {
#gallery-human {
-
     background: url('https://static.igem.org/mediawiki/2014/3/32/UCL_Pile_of_Polariods_Line.png') center no-repeat;  
+
     background: url('https://static.igem.org/mediawiki/2014/5/55/GalleryUCL.png') center no-repeat;  
-
     background-size:100%;
+
     background-size:56%;
-
    color:black;
+
}
}
-
.hover6:hover #gallery-human {
 
-
        background: url('https://static.igem.org/mediawiki/2014/f/f7/UCL_Pile_of_Polaroids.png') center no-repeat;
 
-
        background-size:100%;
 
-
        color:black; 
 
-
}
 
-
 
-
 
-
/*Filler Blocks*/
 
#redd {
#redd {
     background: red center no-repeat;  
     background: red center no-repeat;  
     background-size:100%;
     background-size:100%;
-
     opacity:0.6;
+
     opacity:0.5;
}
}
#bluee {
#bluee {
     background: blue center no-repeat;  
     background: blue center no-repeat;  
     background-size:100%;
     background-size:100%;
-
     opacity:0.6;
+
     opacity:0.5;
}
}
#yelloww {
#yelloww {
     background: yellow center no-repeat;  
     background: yellow center no-repeat;  
     background-size:100%;
     background-size:100%;
-
     opacity:0.6;
+
     opacity:0.5;
}
}
Line 296: Line 125:
sizes: [
sizes: [
[1,1],
[1,1],
-
[1,2],
 
                                         [2,2]
                                         [2,2]
],
],

Revision as of 23:44, 23 September 2014

Goodbye Azodye UCL iGEM 2014

Contact Us

University College London
Gower Street - London
WC1E 6BT
Biochemical Engineering Department
Phone: +44 (0)20 7679 2000
Email: ucligem2014@gmail.com

Follow Us