Difference between revisions of "Team:Virginia/Practices"

(Prototype team page)
 
Line 1: Line 1:
 
{{Virginia}}
 
{{Virginia}}
 
<html>
 
<html>
 +
<head>
 +
<!-- Bootstrap import -- Latest compiled and minified CSS -->
 +
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" type="text/css">
 +
</head>
 +
<body>
 +
<div id="top-part">
 +
<p id="above-nav">University of Virginia iGEM 2015</p>
 +
<div id="icon-box">
 +
<a href="https://twitter.com/Virginia_iGEM"><img id="twitter" src="/wiki/images/2/2c/Virginia_twitter_white.png"></img></a>
 +
<a href="https://www.facebook.com/uvaigem"><img id="facebook" src="/wiki/images/e/ed/Virginia_facebook.png"></img></a>
 +
</div>
 +
</div>
 +
<div class="nav" id="nav1">
 +
<div class="container">
 +
<ul class="pull-left">
 +
<li><a href="/Team:Virginia">Home</a></li>
 +
</ul>
 +
<ul class="pull-right">
 +
<li><a href="/Team:Virginia/Team">Team</a></li>
 +
<li><a href="/Team:Virginia/Project">Project</a></li>
 +
<li><a href="/Team:Virginia/Practices">Policy and Practices</a></li>
 +
<li><a href="/Team:Virginia/Attributions">Attributions</a></li>
 +
<li><a href="/Team:Virginia/Contact_us">Contact Us</a></li>
 +
</ul>
 +
</div>
 +
</div>
  
−
<h2> Human Practices </h2>
+
<!-- OTHER STRUCTURAL CODE GOES BELOW HERE -->
−
 
+
<div id="upper-div">
−
<p>iGEM teams are unique and leading the field because they "go beyond the lab" to imagine their projects in a social/environmental context, to better understand issues that might influence the design and use of their technologies.</p>
+
<h1>Policy & Practices</h1>
−
<p>Teams work with students and advisors from the humanities and social sciences to explore topics concerning ethical, legal, social, economic, safety or security issues related to their work. Consideration of these Human Practices is crucial for building safe and sustainable projects that serve the public interest. </p>
+
<p>(click a tab to reveal more information)</p>
−
<p>For more information, please see the <a href="https://2015.igem.org/Practices_Hub">Practices Hub</a>.</p>
+
−
 
+
−
<div class="highlightBox">
+
−
<h4>Note</h4>
+
−
<p>You must fill out this page in order to be considered for all <a href="https://2015.igem.org/Judging/Awards">awards</a> for Human Practices:</p>
+
−
<ul>
+
−
<li>Human Practices silver medal criterion</li>
+
−
<li>Human Practices gold medal criterion</li>
+
−
<li>Best Integrated Human Practices award</li>
+
−
<li>Best Education and Public Engagement award</li>
+
−
</ul>
+
 
</div>
 
</div>
 +
<div id="tabs-wrapper">
 +
<div class="container">
 +
<div class="tab" id="tab1">
 +
<p>Part I: Education Pamphlet</p>
 +
<img src="/wiki/images/7/7b/Virginia_arrow-down.png">
 +
</img>
 +
<div class="tab-content" id="tab-content1">
 +
<h1>CONTENT</h1>
 +
<p> Content and stuff, yo.</p>
 +
</div>
 +
</div>
 +
<script type="text/javascript">
 +
jQuery(document).ready(function(){
 +
$("#tab1").click(function(){
 +
$("#tab-content1").toggleClass("active-content");
 +
$("#tab1").toggleClass("active-tab");
 +
$("#tab1 > img").toggleClass("inactive-content");
 +
});
 +
});
 +
</script>
 +
<div class="tab" id="tab2">
 +
<p>Part II: Synthetic Biology Documentary</p>
 +
<img src="/wiki/images/7/7b/Virginia_arrow-down.png">
 +
</img>
 +
<div class="tab-content" id="tab-content2">
 +
<div><p>CONTENT</p></div>
 +
</div>
 +
</div>
 +
<script type="text/javascript">
 +
jQuery(document).ready(function(){
 +
$("#tab2").click(function(){
 +
$("#tab-content2").toggleClass("active-content");
 +
$("#tab2").toggleClass("active-tab");
 +
$("#tab2 > img").toggleClass("inactive-content");
 +
});
 +
});
 +
</script>
 +
<div class="tab" id="tab3">
 +
<p>Part III: Software</p>
 +
<img src="/wiki/images/7/7b/Virginia_arrow-down.png">
 +
</img>
 +
<div class="tab-content" id="tab-content3">
 +
<div><p>CONTENT</p></div>
 +
</div>
 +
</div>
 +
<script type="text/javascript">
 +
jQuery(document).ready(function(){
 +
$("#tab3").click(function(){
 +
$("#tab-content3").toggleClass("active-content");
 +
$("#tab3").toggleClass("active-tab");
 +
$("#tab3 > img").toggleClass("inactive-content");
 +
});
 +
});
 +
</script>
 +
<div class="tab" id="tab4">
 +
<p>Part IV: iGEM Collaboration</p>
 +
<img src="/wiki/images/7/7b/Virginia_arrow-down.png">
 +
</img>
 +
<div class="tab-content" id="tab-content4">
 +
<div><p>CONTENT</p></div>
 +
</div>
 +
</div>
 +
<script type="text/javascript">
 +
jQuery(document).ready(function(){
 +
$("#tab4").click(function(){
 +
$("#tab-content4").toggleClass("active-content");
 +
$("#tab4").toggleClass("active-tab");
 +
$("#tab4 > img").toggleClass("inactive-content");
 +
});
 +
});
 +
</script>
 +
</div>
 +
</div>
 +
<!-- SPECIFIC STRUCTURAL CODE ENDS HERE -->
  
−
 
+
<footer>
−
<h5>Some Human Practices topic areas </h5>
+
<div id="foot-img">
−
<ul>
+
<img src="https://static.igem.org/mediawiki/2015/d/d1/Virginia_logo4.png"></img>
−
<li>Philosophy</li>
+
</div>
−
<li>Public Engagement / Dialogue</li>
+
<div id="foot-text">
−
<li>Education</li>
+
<p>University of Virginia iGEM</p>
−
<li>Product Design</li>
+
<p>148 Gilmer Hall</p>
−
<li>Scale-Up and Deployment Issues</li>
+
<p>485 McCormick Road</p>
−
<li>Environmental Impact</li>
+
<p>Charlottesville, Virginia 22904</p>
−
<li>Ethics</li>
+
<p>United States of America</p>
−
<li>Safety</li>
+
<p><a href="mailto:virginia.igem@gmail.com">
−
<li>Security</li>
+
virginia.igem@gmail.com</a>
−
<li>Public Policy</li>
+
</p>
−
<li>Law and Regulation</li>
+
</div>
−
<li>Risk Assessment</li>
+
</footer>
−
</ul>
+
<style type="text/css">
−
 
+
footer div img {
−
<h5>What should we write about on this page?</h5>
+
width:auto;
−
<p>On this page, you should write about the Human Practices topics you considered in your project, and document any special activities you did (such as visiting experts, talking to lawmakers, or doing public engagement).</p>
+
height:200px;
−
 
+
}
−
 
+
footer div {
−
<h5>Inspiration</h5>
+
overflow:hidden;
−
<p>Read what other teams have done:</p>
+
display:inline-block;
−
<ul>
+
float:none;
−
<li><a href="https://2014.igem.org/Team:Dundee/policypractice/experts">2014 Dundee </a></li>
+
}
−
<li><a href="https://2014.igem.org/Team:UC_Davis/Policy_Practices_Overview">2014 UC Davis </a></li>
+
footer div:first-child {
−
<li><a href="https://2013.igem.org/Team:Manchester/HumanPractices">2013 Manchester </a></li>
+
background-image:url(‘https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcQUA5CF2C_kOVnWjyl62TA17VNs6RSsPIkrCejlLbtZ7rAVgzQxOQ’);
−
<li><a href="https://2013.igem.org/Team:Cornell/outreach">2013 Cornell </a></li>
+
float:right;
−
</ul>
+
top:10px;
−
 
+
height:90%;
−
<h3>Integrated Human Practices</h3>
+
width:25%
−
 
+
margin: 1%;
−
<p>Do you want to be considered for the <a href="https://2015.igem.org/Judging/Awards#SpecialPrizes">Best Integrated Human Practices award</a>? Make it easy for the judges to find any wiki content that is relevant to this prize. Highlight this content with a header or separate section.</p>
+
display:inline;
−
 
+
overflow:hidden;
−
<h3>Education and Public Engagement</h3>
+
}
−
 
+
#nav1 {
−
<p>Do you want to be considered for the <a href="https://2015.igem.org/Judging/Awards#SpecialPrizes">Best Education and Public Outreach award</a>? Make it easy for the judges to find any wiki content that is relevant to this prize. Highlight this content with a header or separate section.</p>
+
background-color: #003F87;
−
 
+
width:100%;
−
</div>
+
float:top; 
 +
position:fixed;
 +
top:70px;
 +
z-index:10;
 +
//opacity:0.85;
 +
border-bottom:5px;
 +
border-top:0px;
 +
border-left:0px;
 +
border-right:0px;
 +
border-color:#007bb6;
 +
border-style:solid;
 +
}
 +
#nav1 a {
 +
color: rgb(256, 256, 256);
 +
font-size: 16px;
 +
font-weight: bold;
 +
padding: 14px 10px;
 +
text-transform: uppercase;
 +
border-radius:5px;
 +
}
 +
#nav1 a:hover{
 +
color:#fff;
 +
background-color:#007bb6;
 +
text-decoration:none;
 +
}
 +
#nav1 li {
 +
display: inline;
 +
font-family: Arial;
 +
}
 +
#nav1 .container {
 +
padding-top:5px;
 +
padding-bottom:5px;
 +
}
 +
.row {
 +
width:100%;
 +
}
 +
#content h1.firstHeading {
 +
visibility:hidden;
 +
}
 +
#content {
 +
margin: 0px 0px 0px 0px;
 +
padding:0px 0px 0px 0px;
 +
width:100%;
 +
height:auto;
 +
background-color: rgb(0,0,0);
 +
}
 +
html {
 +
background-color:#191919;
 +
color: #fff
 +
font-family: Century Gothic, sans-serif;
 +
}
 +
#top_menu_14 {
 +
/*BORDER ATTRIBUTES*/
 +
border-top:5px solid #007bb6;
 +
background-color: #003F87;
 +
border-color:#003F87;
 +
}
 +
#top_menu_14 li.has_submenu:hover {
 +
opacity:1.0;
 +
background-color:#007bb6;
 +
text-decoration:none;
 +
}
 +
#top_menu_14 li:hover {
 +
opacity:1.0;
 +
background-color:#007bb6;
 +
text-decoration:none;
 +
}
 +
footer {
 +
width:100%
 +
height:300px;
 +
padding:25px 25px 25px 25px;
 +
background:#000000;
 +
clear:both;
 +
}
 +
footer p:first-child {
 +
font-weight:bold;
 +
font-family:Arial;
 +
font-size:18px;
 +
text-decoration:underline;
 +
}
 +
footer a {
 +
color:#fff;
 +
}
 +
footer p {
 +
width:auto;
 +
}
 +
p {
 +
color:white;
 +
font-family: serif;
 +
float:center;
 +
clear:both;
 +
}
 +
#bolded {
 +
font-weight:bold;
 +
}
 +
#above-nav {
 +
margin-bottom:10px;
 +
float:left;
 +
font-size:30px;
 +
text-align:center;
 +
font-family:Helvetica;
 +
text-shadow: 2px 2px #007bb6;
 +
padding-left:30%;
 +
}
 +
#top-part a {
 +
width:auto;
 +
height:auto;
 +
margin-right:20px;
 +
}
 +
#facebook {
 +
height:30px;
 +
width:30px;
 +
}
 +
#twitter {
 +
height:40px;
 +
width:40px;
 +
}
 +
#facebook:hover {
 +
opacity:0.5;
 +
}
 +
#twitter:hover {
 +
opacity:0.5;
 +
}
 +
#icon-box {
 +
display:inline;
 +
float:right;
 +
}
 +
#top-part {
 +
display:inline;
 +
height:56px;
 +
position:fixed;
 +
top:14px;
 +
float:center;
 +
background:#003F87;
 +
width:100%;
 +
z-index:10;
 +
font-weight:bold;
 +
padding-top:15px;
 +
}
 +
/* OTHER STYLE CODE GOES BELOW HERE */
 +
h1 {
 +
color:#CAE1FF;
 +
font-size:60px;
 +
text-align:center;
 +
font-weight:bold;
 +
text-shadow: 2px 2px 3px #007bb6;
 +
}
 +
#tabs-wrapper {
 +
width:99%;
 +
margin-left:.5%;
 +
background:#afafaf;
 +
border-radius:1px;
 +
padding-bottom:50px;
 +
}
 +
.tab {
 +
width:100%;
 +
height:160px;
 +
border-radius:10px;
 +
background:#007bb6;
 +
margin-top:25px;
 +
box-shadow: 2px 2px 4px black;
 +
overflow:hidden;
 +
}
 +
.tab p {
 +
font-size:40px;
 +
font-family:Arial;
 +
font-weight:bold;
 +
text-align:center;
 +
margin-top:25px;
 +
margin-bottom:0px;
 +
padding-top:15px;
 +
}
 +
.tab img {
 +
width:8%;
 +
margin-left:46%;
 +
height:auto;
 +
clear:both;
 +
}
 +
.tab-content {
 +
display:none;
 +
font-size:15px;
 +
color:white;
 +
text-align:left;
 +
}
 +
.hidden-div {
 +
/*display:none;*/
 +
font-size: 14px;
 +
font-family:Arial;
 +
background:#fff;
 +
width:90%;
 +
margin-left:5%;
 +
padding:15px;
 +
border-radius:10px;
 +
}
 +
#upper-div p {
 +
font-size:12px;
 +
color:white;
 +
text-align:center;
 +
}
 +
.active-tab {
 +
height:auto;
 +
padding-bottom:30px;
 +
box-shadow: 5px 5px 10px black;
 +
display:block;
 +
}
 +
.active-tab > p {
 +
opacity:.5;
 +
font-size:20px;
 +
padding-bottom:15px;
 +
}
 +
.active-content {
 +
display:block;
 +
}
 +
.tab-content h1 {
 +
margin-bottom:0px;
 +
border-bottom:0px;
 +
color:#fff;
 +
padding:0px;
 +
text-shadow:1px 1px 2px black;
 +
}
 +
.tab-content p {
 +
margin-top:18px;
 +
padding-top:0px;
 +
margin-left:2.5%;
 +
font-size:18px;
 +
color:white;
 +
font-family:Arial;
 +
font-weight:normal;
 +
padding-right:40px;
 +
display:inline-block;
 +
text-align:left;
 +
}
 +
.tab-content p:first-child {
 +
margin-top:0px;
 +
}
 +
.inactive-content {
 +
display:none;
 +
}
 +
/* SPECIFIC STYLE CODE ENDS HERE */
 +
</style>
 +
</body>
 
</html>
 
</html>

Revision as of 14:46, 16 July 2015

University of Virginia iGEM 2015

Policy & Practices

(click a tab to reveal more information)

Part I: Education Pamphlet

CONTENT

Content and stuff, yo.

Part II: Synthetic Biology Documentary

CONTENT

Part III: Software

CONTENT

Part IV: iGEM Collaboration

CONTENT

University of Virginia iGEM

148 Gilmer Hall

485 McCormick Road

Charlottesville, Virginia 22904

United States of America

virginia.igem@gmail.com