Team:UIUC Illinois

From 2014.igem.org

(Difference between revisions)
Line 5: Line 5:
<style>
<style>
/*Coffee Art Banner*/
/*Coffee Art Banner*/
-
/*
 
#topheader{  
#topheader{  
     display:block;
     display:block;
Line 13: Line 12:
     position:relative;
     position:relative;
}
}
-
*/
 
-
</style>
 
-
<!--
+
/* Panels */
-
<div id="topheader">
+
.panel {
-
  <img style="margin-top:-1px" src="https://static.igem.org/mediawiki/2014/8/8c/Dummyimage.jpg" width="1100px" height="632"/>
+
    width:1100px;
-
-->
+
    height:528px;
 +
    margin:0;
 +
    margin-bottom:0px;
 +
    color: rgb(30,39,43);
 +
    font-family: 'Yanone Kaffeesatz', sans-serif;
 +
}
 +
.panel a {
 +
    color: rgb(46,43,52);
 +
    text-decoration:none;
 +
}
 +
/* Subpanels */
 +
.narrowimg {/* Subpanels background*/
 +
    z-index:2;
 +
    opacity:0.3;
 +
    filter: alpha(opacity=30);
 +
}
 +
.titlebox {/* Subpanels Title*/
 +
    z-index:1;
 +
    position:relative;
 +
    bottom:480px;
 +
    background:transparent;
 +
}
 +
/* Project Panels*/
 +
.subpanel1 { /* Infographics */
 +
    float:left;
 +
    width:535px;
 +
    height:200px;
 +
    font-size:22px;
 +
    text-align:center;
 +
    margin-top:0;
 +
    margin-right:11px;
 +
    border-radius:7px;
 +
    overflow:hidden;
 +
}
 +
.subpanel1:hover{
 +
    font-weight:bold;
 +
}
 +
.subpanel1:hover .narrowimg {
 +
    opacity:0.8;
 +
    filter: alpha(opacity=80);
 +
}
 +
.subpanel2 { /* Our Story Divider */
 +
    /*float:left;*/
 +
    width:1070px;
 +
    height:50px;
 +
    text-align:center;
 +
    line-height:50px;
 +
    background-color:#80776C;
 +
    color:#FFEDD7;
 +
    border-radius:7px;
 +
    position:relative;
 +
    bottom:50px;
 +
    font-family: /*'Great Vibes'*/, cursive;
 +
    font-size: 35px;
 +
}
 +
/* Highlights */
 +
.subpanel3 { /* divide page in 3 */
 +
    float:left;
 +
    width:354px;
 +
    height:492px;
 +
    font-size:22px;
 +
    margin-top:0;
 +
    margin-right:18px;
 +
}
 +
.subpanel5 { /* Columns 1 and 2*/
 +
    float:left;
 +
    width:354px;
 +
    height:450px;
 +
    font-size:22px;
 +
    background:rgb(255,255,255);
 +
    color:black;
 +
    border-radius:7px;
 +
    overflow:hidden;
 +
    text-align:center;
 +
}
 +
.subpanel5:hover{
 +
    font-weight:bold;
 +
}
 +
.subpanel5:hover .narrowimg {
 +
    opacity:0.8;
 +
    filter: alpha(opacity=80);
 +
}
 +
.subpanel4 { /* Column 3 */
 +
    height:450px;
 +
    margin:0;
 +
    margin-bottom:11px;
 +
    border-radius:7px;
 +
    overflow:hidden;
 +
    background:rgb(255,255,255);
 +
    color:Black;
 +
    text-align:center;
 +
}
 +
.subpanel4:hover{
 +
    font-weight:bold;
 +
}
 +
.subpanel4:hover .narrowimg {
 +
    opacity:0.8;
 +
    filter: alpha(opacity=80);
 +
}
 +
 +
/* Panels at the bottom */
 +
.subpanel6 {
 +
    float:left;
 +
    height:96px;
 +
    width:261.5px;
 +
    margin-right:18px;
 +
    border-radius:7px;
 +
    overflow:hidden;
 +
    background-color:#CCA36F;
 +
    color:white;
 +
}
 +
.subpanel6 img {
 +
    margin-top:16px;
 +
    background:white;
 +
}
 +
.subpanel6 img:hover {
 +
    background:rgb(252,250,229);
 +
}
 +
 +
 +
</style>
 +
 +
<!--Top Banner-->
 +
<div id="topheader">
 +
<img style="margin-top:-1px" src="https://static.igem.org/mediawiki/2014/8/8c/Dummyimage.jpg" width="1100px" height="632"/>
 +
</div>
 +
<!--Space between banner and Our Story-->
 +
<div style="clear: both;"></div>
 +
<!--Importing jquery library-->
 +
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
 +
<div id="page">
 +
<div class="panel">
 +
 +
<!--Infographics-->
 +
<a href="https://2014.igem.org/Team:UIUC_Illinois/Project/LactoBROcillus" title="Lactobrocillus">
 +
<div id="pspanel" class="subpanel1"  onmouseover="chgtrans(this)">
 +
<img class="narrowimg" src="https://static.igem.org/mediawiki/2014/8/8c/Dummyimage.jpg"/>
 +
<div class="titlebox">
 +
<center><img src="#" style="height:60px;margin-bottom:20px;"/></center>
 +
<div style="width:60%;margin-left:20%;margin-bottom:20px;"><hr></div>
 +
Dog Probiotic
 +
</div>
 +
</div>
 +
</a>
 +
<a href="https://2013.igem.org/Team:UIUC_Illinois/Project/Caffeine" title="Caffeine_Dehydrogenase">
 +
<div id="dspanel" class="subpanel1">
 +
<img class="narrowimg" src="https://static.igem.org/mediawiki/2014/8/8c/Dummyimage.jpg"/>
 +
<div class="titlebox">
 +
<center><img src="#" style="height:60px;margin-bottom:20px;"/></center>
 +
<div style="width:60%;margin-left:20%;margin-bottom:20px;"><hr></div>
 +
Treating Caffeine Waste-Water
 +
</div>
 +
</div>
 +
</a>
 +
 +
<!--Our Story Banner (Use book instead of hand-->
 +
<1--Current anchor debatable and placeholder-->
 +
<a href="https://2014.igem.org/Team:UIUC_Illinois/Team" title="Our Story">
 +
<div class="subpanel2" >
 +
<img width="70px" style="margin-left:80px;margin-right:15px;position:relative;bottom:1px" src="https://static.igem.org/mediawiki/2013/d/d5/PB_handresults.gif"/>Our Story
 +
</div>
 +
</a>
 +
</div>
 +
 +
<!--Separates Infographics from Image Banners-->
 +
<div style="clear: both;"></div>
 +
 +
<div class="panel" style="background:white;">
 +
 +
<!--Column 1-->
 +
<div class="subpanel3">
 +
<a href="https://2014.igem.org/Team:UIUC_Illinois/Software/Overview" title="sOverview">
 +
<div class="subpanel5">
 +
<img class="narrowimg" src="https://static.igem.org/mediawiki/2014/8/8c/Dummyimage.jpg" width="354px" height="156px"/>
 +
<div style="position:relative;bottom:148px">
 +
<center><img src="#" style="height:50px;margin-top:10px;margin-bottom:20px;"/></center>
 +
<div style="width:60%;margin-left:20%;margin-bottom:20px;"><hr></div>
 +
Software
 +
</div>
 +
</div>
 +
</a>     
 +
</div>
 +
 +
<!--Column 2-->
 +
<div class="subpanel3">
 +
<a href="https://2014.igem.org/Team:UIUC_Illinois/Human_Practice/Overview" title="hOverview">
 +
<div class="subpanel5">
 +
<img class="narrowimg" src="https://static.igem.org/mediawiki/2014/8/8c/Dummyimage.jpg" width="354px" height="283px"/>
 +
<div style="position:relative;bottom:258px">
 +
<center><img src="#" style="height:60px;margin-top:10px;margin-bottom:10px;"/></center>
 +
<div style="width:60%;margin-left:20%;margin-bottom:20px;"><hr></div>
 +
Human Practices
 +
</div>
 +
</div>
 +
</a>
 +
</div>
 +
 +
<!--Column 3-->
 +
<div class="subpanel3" style="margin-right:0px">
 +
<div style="margin-right:0;width:356px">
 +
<a href="https://2013.igem.org/Team:Paris_Bettencourt/Results" title="Achievements">
 +
<div class="subpanel4">
 +
<img class="narrowimg" src="https://static.igem.org/mediawiki/2014/8/8c/Dummyimage.jpg" width="354px" height="283px"/>
 +
<div style="position:relative;bottom:258px">
 +
<center><img src="#" style="height:50px;margin-top:15px;margin-bottom:15px;"/></center>
 +
<div style="width:60%;margin-left:20%;margin-bottom:20px;"><hr></div>
 +
Collaboration
 +
</div>
 +
</div>
 +
</a>
 +
</div>
 +
</div>
 +
 +
</div>
 +
 +
<!--Space between Image Banners and Small Buttons-->
 +
<div style="clear: both;"></div>
 +
 +
 +
<!--Small Buttons-->
 +
<div>
 +
<div class="subpanel6">
 +
<a href="https://2014.igem.org/Team:UIUC_Illinois/Team" title="Team">
 +
<center><img src="#" height="64px"/></center>
 +
</a>
 +
</div>
 +
<div class="subpanel6">
 +
<a href="https://2014.igem.org/Team:UIUC_Illinois/Notes" title="Notebook">
 +
<center><img src="#" height="64px"/></center> 
 +
</a>
 +
</div>
 +
<div class="subpanel6">
 +
<a href="https://2014.igem.org/Team:UIUC_Illinois/Parts" title="Parts">
 +
<center><img src="#" height="64px"/></center>
 +
</a>
 +
</div>
 +
<div class="subpanel6" style="margin-right:0">
 +
<a href="https://2014.igem.org/Team:UIUC_Illinois/Medal_Fulfillment" title="Medal Fulfillment">
 +
<center><img src="#" height="64px"/></center>
 +
</a>
 +
</div>
 +
</div>
 +
 +
<!--Space between Small Buttons and Footer-->
 +
<div style="clear: both;"></div>
 +
 +
<script>
 +
$(document).ready(function(){$('div .igemlogo').mouseover(function(){div = $('.left-menu'); div.fadeIn(1);}).mouseout(function(){div.fadeOut(100);});});
 +
$(document).ready(function(){$('div #pspanel').mouseover(function(){div = $('#psdesc');div.fadeIn(1);}).mouseout(function(){div.fadeOut(1);});});
 +
$(document).ready(function(){$('div #dspanel').mouseover(function(){div = $('#dsdesc');div.fadeIn(1);}).mouseout(function(){div.fadeOut(1);});});
 +
$(document).ready(function(){$('div #thpanel').mouseover(function(){div = $('#thdesc');div.fadeIn(1);}).mouseout(function(){div.fadeOut(1);});});
 +
$(document).ready(function(){$('div #tcpanel').mouseover(function(){div = $('#tcdesc');div.fadeIn(1);}).mouseout(function(){div.fadeOut(1);});});
 +
</script>
 +
</div>
</html>
</html>
{{:Team:UIUC_Illinois/Footer}}
{{:Team:UIUC_Illinois/Footer}}

Revision as of 00:52, 1 September 2014


Dog Probiotic

Treating Caffeine Waste-Water
<1--Current anchor debatable and placeholder-->
Our Story