Team:Calgary/Sandbox

From 2010.igem.org

(Difference between revisions)
 
(102 intermediate revisions not shown)
Line 1: Line 1:
-
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
+
<html>
-
<!--Colors Blue:4AC6F7, Yellow:F3F778, Green:9ECF3E, White:FFFFFF, Dark Brown:30251A-->
+
<head>
-
<head>
+
<title> iGEM Information Tabs </title>
-
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
+
-
</head>
+
-
+
<script type="text/javascript" src="http://www.wikiwikiwebworks.ca/script1.js"></script>
-
<style type="text/css">
+
-
body{
+
<style>
-
margin:0;
+
-
padding:0;
+
</style>
-
line-height: 1.5em;
+
-
}
+
 +
</head>
-
#maincontainer{
 
-
width: 840px; /*Width of main container*/
 
-
margin: 0 auto; /*Center container on page*/
 
-
}
 
-
#topsection{
 
-
background: #30251A;
 
-
height: 90px; /*Height of top section*/
 
-
}
 
-
#topsection h1{
+
<body>
-
margin: 0;
+
-
padding-top: 15px;
+
-
}
+
-
#contentwrapper{
 
-
float: left;
 
-
width: 100%;
 
-
}
 
-
#contentcolumn{
 
-
margin-right: 200px; /*Set right margin to RightColumnWidth*/
 
-
}
 
-
#sidebar{
+
<!-- text division -->
-
float: left;
+
-
width: 200px; /*Width of right column*/
+
<div style="margin-left:auto; margin-right:auto; background:url('http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Background.png'); width:556px; height:330px; padding-top:15px; ">
-
margin-left: -200px; /*Set left margin to -(RightColumnWidth) */
+
-
background: #FDE95E;
+
<div id="0" style=" background-color:white; width:510px; height:310px; margin-left:auto; margin-right:auto; display:block ">
-
}
+
-
#footer{
+
<div style="height:239px; border:1px solid #CCCCCC; margin-bottom:5px;">
-
clear: left;
+
-
width: 100%;
+
<img id="boximage1" src="http://www.army.forces.gc.ca/cfb_suffield/Images/CFB_Suffield1.gif"></img>
-
background: 30251A;
+
-
color: #FFF;
+
</div>
-
text-align: center;
+
-
padding: 4px 0;
+
-
}
+
-
#footer a{
 
-
color: #FFFF80;
 
-
}
 
-
.innertube{
+
<div style="height:75px; width:527px; background-image:url('http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Greyportion.png'); float:left; margin-left:-9px;">
-
margin: 10px; /*Margins for inner DIV inside each column (to provide padding)*/
+
-
margin-top: 0;
+
<p style="padding-left:10px;">On July 14th, 2010, iGEM Calgary visited the Defence Research and Development Canada (DRDC) facility in Suffield, Alberta.</p>
-
}
+
 +
</div>
 +
 +
</div>
-
</style>
+
-
<body>
+
<div id="1" style="background-color:white; width:510px; height:310px; margin-left:auto; margin-right:auto; display:none ">
-
<div id="maincontainer">
+
-
<div id="topsection">
+
<div style="height:239px; border:1px solid #CCCCCC; margin-bottom:5px;">
-
<div class="innertube">
+
-
<h1>University of Calgary</h1>
+
<img id="boximage2" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/ImageTBA-1.png"></img>
-
</div>
+
</div>
</div>
-
<div id="contentwrapper">
+
-
<div id="contentcolumn">
+
<div style="height:75px; width:527px; background-image:url('http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Greyportion.png'); float:left; margin-left:-9px;">
-
<div class="innertube">
+
-
<b>Content Column:</b><br/>
+
<p style="padding-left:10px;"> I'm generic information about Lethbridge! </p>
-
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec quis augue eget arcu euismod rhoncus adipiscing at dui. Etiam sit amet sapien a diam pulvinar mattis. Nullam id mauris sed orci laoreet imperdiet. Duis pellentesque nulla at neque ornare malesuada. Aliquam varius facilisis facilisis. Sed sapien libero, viverra vel tincidunt at, pretium vitae odio. Donec sagittis euismod feugiat. Phasellus ultrices mattis interdum. Aliquam molestie ornare ultricies. Nunc vehicula tempus tellus id volutpat. Curabitur molestie imperdiet eros, quis facilisis massa feugiat et. Suspendisse sit amet laoreet ligula. Nunc viverra, mauris ut tristique interdum, leo quam mollis nisi, eget sagittis arcu turpis eget ligula. Proin eget ante leo, vel lobortis felis. Donec ut nibh mi. Etiam vulputate dui nec est vehicula non tempus ligula porttitor. Etiam iaculis egestas magna at rutrum. Vestibulum eget mauris sit amet erat pulvinar venenatis eu vitae sapien. Sed ut mi quis lectus sagittis mollis. Duis est nunc, dignissi m et lobortis vel, vulputate vel est. Nullam neque neque, consectetur quis vulputate quis, adipiscing ut massa. Duis nec metus sed quam facilisis laoreet quis non risus. Mauris ac ante quam, id varius augue. Phasellus vel ligula nulla. Sed interdum velit ac ligula ullamcorper lacinia non et tellus. Integer nec dolor lectus. Phasellus nec augue justo, a aliquet nisi. Aliquam rhoncus, nisi sed mattis sagittis, purus quam sagittis leo, nec malesuada sapien arcu ut mi. Nam sit amet odio dui. Curabitur orci nisi, hendrerit in gravida ut, dignissim et odio. Nulla eu magna justo, eget luctus magna. Sed fermentum leo nec ante interdum at condimentum leo ultricies. Curabitur sodales egestas turpis sed cursus. Aliquam erat volutpat. Praesent nisi felis, aliquam non tristique at, accumsan nec tortor. Quisque viverra urna in neque imperdiet ut vehicula felis convallis. In ac quam in eros luctus adipiscing et eu augue. Nulla vitae diam nisi, non eleifend leo. In pretium feugiat eros vitae dictum. Nam faucibus turpis commodo nisl vulputate at tincidunt tortor accumsan. Mauris et ante sit amet erat mollis vestibulum quis in lectus. Aliquam sollicitudin, felis et sagittis tincidunt, justo massa vestibulum justo, in tristique ante ipsum in arcu. Donec neque lectus, auctor eu adipiscing non, cursus condimentum lacus. Aenean aliquam iaculis ipsum at mattis. Sed leo massa, egestas ac auctor sit amet, aliquet pretium ipsum. Mauris hendrerit massa id velit eleifend dapibus. Ut in dui leo. Aenean volutpat imperdiet volutpat. Etiam fermentum nibh id orci placerat a accumsan magna gravida. Donec porttitor tristique justo, in congue nunc consequat vitae. Integer et velit augue, et dignissim purus. Donec condimentum feugiat tellus porttitor pulvinar.
+
-
</p>
+
</div>
-
</div>
+
-
</div>
+
</div>
-
</div>
+
-
<div id="sidebar">
+
-
<div class="innertube">
+
-
<b>Right Column:</b><br/>
+
-
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec quis augue eget arcu euismod rhoncus adipiscing at dui. Etiam sit amet sapien a diam pulvinar mattis. Nullam id mauris sed orci laoreet imperdiet. Duis pellentesque nulla at neque ornare malesuada. Aliquam varius facilisis facilisis. Sed sapien libero, viverra vel tincidunt at, pretium vitae odio. Donec sagittis euismod feugiat. Phasellus ultrices mattis interdum. Aliquam molestie ornare ultricies. Nunc vehicula tempus tellus id volutpat. Curabitur molestie imperdiet eros, quis facilisis massa feugiat et. Suspendisse sit amet laoreet ligula. Nunc viverra, mauris ut tristique interdum, leo quam mollis nisi, eget sagittis arcu turpis eget ligula.</p>
+
-
</div>
+
-
</div>
+
<div id="2" style=" background-color:white; width:510px; height:310px; margin-left:auto; margin-right:auto; display:none ">
 +
 +
<div style="height:239px; border:1px solid #CCCCCC; margin-bottom:5px;">
-
<div id="footer">
+
<img id="boximage3" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/bhsgrnsmall.png"></img>
-
<a href="http://www.dynamicdrive.com/style/">Dynamic Drive CSS Library</a>
+
-
</div>
+
</div>
 +
 
 +
 +
<div style="height:75px; width:527px; background-image:url('http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Greyportion.png'); float:left; margin-left:-9px;">
 +
 
 +
<p style="padding-left:10px;"> I'm like burning man but better! </p>
 +
 +
</div>
 +
 +
</div>
 +
 
 +
 +
 
 +
<div id="3" style=" background-color:white; width:510px; height:310px; margin-left:auto; margin-right:auto; display:none ">
 +
 
 +
<div style="height:239px; border:1px solid #CCCCCC; margin-bottom:5px;">
 +
 +
<img id="boximage4" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/ProtocolIcon.png"></img>
 +
 +
</div>
 +
 
 +
 +
<div style="height:75px; width:527px; background-image:url('http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Greyportion.png'); float:left; margin-left:-9px;">
 +
 
 +
<p style="padding-left:10px;"> I'm a fan of cupcakes! </p>
 +
 +
</div>
 +
 +
</div>
 +
 
 +
 +
 
 +
<div id="4" style=" background-color:white; width:510px; height:310px; margin-left:auto; margin-right:auto; display:none ">
 +
 
 +
<div style="height:239px; border:1px solid #CCCCCC; margin-bottom:5px;">
 +
 
 +
<img id="boximage5" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Twitter.png"></img>
 +
 +
</div>
 +
 
 +
 +
<div style="height:75px; width:527px; background-image:url('http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/Greyportion.png'); float:left; margin-left:-9px;">
 +
 
 +
<p style="padding-left:10px;"> I'm from Alberta and I'm awesome! </p>
 +
 +
</div>
 +
 +
</div>
 +
 
 +
 
 +
</div>
 +
 
 +
 
 +
 
 +
<!-- menu bar -->
 +
 +
<div style="width:524px; height:35px; margin-right:auto; margin-left:auto; margin-top:-10px; padding-left:10px; ">
 +
 
 +
 +
<div onmouseover="imgHover(1);" onmouseout="imgOff(1);" onclick="changeTab(0);" style="margin-left:2.4; margin-right:2.4; float:left; width:98px; height:35px; "> <img id="suffield" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/SuffieldWhite.png" title="suffield" /> </div>
 +
 
 +
 +
<div onmouseover="imgHover(2);" onmouseout="imgOff(2);" onclick="changeTab(1);" style="margin-left:2.4; margin-right:2.4; float:left; width:98px; height:35px; "> <img id="lethbridge" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/LethbridgeGrey.png" title="lethbridge" /> </div>
 +
 
 +
 +
<div onmouseover="imgHover(3);" onmouseout="imgOff(3);" onclick="changeTab(2);" style="margin-left:2.4; margin-right:2.4; float:left; width:98px; height:35px; "> <img id="proteinman" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/ProteinManGrey.png" title="protein man" /> </div>
 +
 
 +
 
 +
<div onmouseover="imgHover(4);" onmouseout="imgOff(4);" onclick="changeTab(3);" style="margin-left:2.4; margin-right:2.4; float:left; width:98px; height:35px; "> <img id="community" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/CommunityGrey.png" title="bake sale" /> </div>
 +
 
 +
 +
<div onmouseover="imgHover(5);" onmouseout="imgOff(5);" onclick="changeTab(4);" style="margin-left:2.4; margin-right:2.4; float:left; width:98px; height:35px; "> <img id="agem" src="http://i872.photobucket.com/albums/ab287/iGEMCalgary_2010/aGEMGrey.png" title="aGEM" /> </div>
 +
 +
</div>
 +
 
 +
 
 +
 
 +
 
 +
</body>
-
</div>
 
-
</body>
 
</html>
</html>

Latest revision as of 06:48, 25 October 2010

iGEM Information Tabs

On July 14th, 2010, iGEM Calgary visited the Defence Research and Development Canada (DRDC) facility in Suffield, Alberta.

I'm generic information about Lethbridge!

I'm like burning man but better!

I'm a fan of cupcakes!

I'm from Alberta and I'm awesome!

Retrieved from "http://2010.igem.org/Team:Calgary/Sandbox"