Difference between revisions of "Team:USNA Annapolis/HP/Gold Integrated"

(Prototype team page)
 
Line 1: Line 1:
 
{{USNA_Annapolis}}
 
{{USNA_Annapolis}}
 
<html>
 
<html>
<div class="column full_size judges-will-not-evaluate">
 
<h3>★  ALERT! </h3>
 
<p>This page is used by the judges to evaluate your team for the <a href="https://2017.igem.org/Judging/Medals">medal criterion</a> or <a href="https://2017.igem.org/Judging/Awards"> award listed above</a>. </p>
 
<p> Delete this box in order to be evaluated for this medal criterion and/or award. See more information at <a href="https://2017.igem.org/Judging/Pages_for_Awards"> Instructions for Pages for awards</a>.</p>
 
</div>
 
<div class="clear"></div>
 
  
<div class="column full_size">
+
<style>
 +
<!-- Footer for each webpage, do not edit for fear of never ever in the history of ever working again!! -Beware- -->
  
<h1>Gold Medal and Integrated Human Practices</h1>
 
  
<p>This page will contain information for your Gold medal Human Practices work, which you can also use to nominate your team for the Best Integrated Human Practices page. To make things easier, we have combined the Gold medal page with the Best Integrated Human Practices page since we expect the work to overlap considerably. </p>
+
.img-50 {
<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>
+
        max-width:50%!important;
<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>For more information, please see the <a href="https://2017.igem.org/Competition/Human_Practices">Human Practices page</a>.</p>
+
 
 +
li {
 +
        font-family: "Helvetica Neue", Helvetica, sans-serif;;
 +
        font-size: 18px!important;
 +
        opacity: 1!important;
 +
}
 +
 
 +
 
 +
.halfcol {
 +
        width: 75%;
 +
}
 +
 
 +
.riskback {
 +
        padding-right: 50px;
 +
}
 +
 
 +
 
 +
 
 +
.footerbox {
 +
        display: inline;
 +
        width: 100%;
 +
        height: 500px;
 +
        margin-top: 200px;
 +
       
 +
}
 +
 
 +
.footerlogosizes {
 +
       
 +
        max-width: 200px!important;
 +
 
 +
}
 +
 
 +
.logoclear:hover {
 +
        opacity: 1;
 +
}
 +
.logoclear1 {
 +
        opacity: .6;
 +
}
 +
 
 +
.sealopactiy {
 +
        opacity: .6!important;
 +
}
 +
 
 +
.riskopacity {
 +
        opacity: .8;
 +
        width: 60%!important;
 +
}
 +
 
 +
.transphotopad {
 +
        padding-top: 100px;
 +
        padding-bottom: 100px;
 +
}
 +
 
 +
 
 +
.box-picshad {
 +
        -moz-box-shadow: 12px 29px 81px 0px rgba(0,0,0,0.75);
 +
        -webkit-box-shadow: 12px 29px 81px 0px rgba(0,0,0,0.75);
 +
        box-shadow: 12px 29px 81px 0px rgba(0,0,0,0.75);
 +
}
 +
 
 +
 
 +
 
 +
.textcenter {
 +
        text-align: center;
 +
}
 +
 
 +
.textpadding {
 +
        padding-left: 200px;
 +
        padding-right: 300px;
 +
        padding-top: 30px;
 +
}
 +
 
 +
.textpadding2 {
 +
        padding-left: 200px;
 +
        padding-top: 30px;
 +
        padding-bottom: 30px;
 +
}
 +
 
 +
 
 +
.textheading1 {
 +
        color: black!important;
 +
}
 +
 
 +
.subheading {
 +
        font-size: 22px;
 +
        opacity: 1!important;
 +
}
 +
 
 +
.riskbox {
 +
        height: 800px;
 +
}
 +
 
 +
 
 +
 
 +
h4 {
 +
        line-height: 150%!important;
 +
        font-family: "Helvetica Neue", Helvetica, sans-serif;
 +
        font-size: 18px!important;
 +
}
 +
 
 +
 
 +
.headingfont1 {
 +
        color: #FFFFFF!important;
 +
}
 +
 
 +
 
 +
.navbar {
 +
margin: 0 auto;
 +
margin-top: 1em;
 +
padding: 1em;
 +
border-radius: 10px;
 +
}
 +
 
 +
.outline1 {
 +
text-shadow:
 +
1px -1px 0 #000,
 +
-1px 1px 0 #000,
 +
        -1px -1px 0 #000,
 +
1px 1px 0 #000;
 +
 +
}
 +
.bufmargin1 {
 +
        margin-top: 150px;
 +
}
 +
.slidephoto {
 +
        background-size: contain;
 +
        position: absolute;
 +
        top: 250px;
 +
        left: 500px;
 +
}
 +
 
 +
 
 +
.background-pic {
 +
        background-image: url("https://static.igem.org/mediawiki/2017/e/e7/USNA_Annapolis-homebackfade5.jpg");
 +
        width: 100%;
 +
        height: 800px;
 +
        float: left;
 +
      margin-top: -20px;
 +
        <!-- text-shadow: 2px 2px 8px #4D4D4D; -->
 +
       
 +
}
 +
 
 +
.animate-leftlong {
 +
        animation: animateleft 1.5s!important;
 +
        transition-duration: 5s!important;
 +
}
 +
.teal-color{
 +
        color: #fff44f!important;
 +
}
 +
 
 +
.usnacrest {
 +
       
 +
        max-width: 25px;
 +
        background-size: contain;
 +
        position: absolute;
 +
        top: 100px;
 +
        left: 80px;
 +
        opacity: .75;
 +
        z-index: 0;
 +
}
 +
.usnacrest2 {
 +
       
 +
        text-align: center;
 +
}
 +
 
 +
 
 +
@media screen and (min-width: 700px){
 +
.dnaback {
 +
        background-image: url("https://static.igem.org/mediawiki/2017/0/06/USNA_Annapolis-Pipesback.jpg");
 +
        background-position: 80%;
 +
        background-attachment: relative;
 +
        background-repeat: repeat-y;
 +
        background-size: 300px;
 +
        z-index:-1;
 +
}
 +
}
 +
 
 +
<!-- end tag for reformatting for phone screens. -->
 +
 
 +
</style>
 +
 
 +
 
 +
 
 +
 
 +
<meta name= "viewport" content = "initial-scale=1.0, width= device-width" />
 +
 
 +
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
 +
 
 +
<link rel="stylesheet" href="https://2014.igem.org/Team:Aalto-Helsinki/bootstrap.min.css?action=raw&amp;ctype=text/css" type="text/css">
 +
<link rel="stylesheet" href="https://2014.igem.org/Team:Aalto-Helsinki/stylesheet.css?action=raw&amp;ctype=text/css" type="text/css">
 +
 
 +
<link rel="stylesheet" type="text/css"
 +
href="https://2017.igem.org/Template:USNA_Annapolis/CSS?action=raw&ctype=text/css" />
 +
 
 +
 
 +
 
 +
<header>
 +
    <div class= "navbar navbar-default navbar-fixed-top" style="padding-top: 25px">
 +
        <div class="text-center col-sm-12" id="navigation">
 +
            <nav>
 +
                <a href="https://2017.igem.org/Team:USNA_Annapolis" id="home">Main</a>
 +
                <a href="https://2017.igem.org/Team:USNA_Annapolis/Team">Team</a>
 +
                <a href="https://2017.igem.org/Team:USNA_Annapolis/Description">Project</a>
 +
                <a href="https://2017.igem.org/Team:USNA_Annapolis/Attributions">Attributions</a>
 +
                <a href="https://2017.igem.org/Team:USNA_Annapolis/HP/Gold_Integrated">Human Practices</a>
 +
                <a href="https://2017.igem.org/Team:USNA_Annapolis/Model">Modeling</a>
 +
                <a href="https://2017.igem.org/Team:USNA_Annapolis/InterLab">InterLab</a>
 +
                <a href="https://2017.igem.org/Team:USNA_Annapolis/Collaborations">Collaboration</a>
 +
                <a href="https://2017.igem.org/Team:USNA_Annapolis/Improve">Improve</a>
 +
                <a href="https://2017.igem.org/Team:USNA_Annapolis/Demonstrate">Demonstrate</a>
 +
            </nav>
 +
        </div>
 +
    </div>
 +
</header>
 +
 
 +
 
 +
 
 +
 
 +
 
 +
<div class="background-pic">
 +
 
 +
<div class="w3-container">
 +
  <h2 class="outline1 bufmargin1 headingfont1"> Attributions </h2>
 +
  <h3 class="outline1 usnacrest2 headingfont1"> Students and Mentors </h3>
 +
  <p class="usnacrest2"><img src="https://static.igem.org/mediawiki/igem.org/8/82/USNA_Annapolis-Seal.jpg" width="200px" style="float: center"></img></p>
 
</div>
 
</div>
 +
</div>
 +
 +
 +
<!-- this might actually look cool for like a banner pic? Too early?-->
 +
<div class="clear" >
 +
</div>
 +
 +
 +
 +
<div class="row">
 +
<h2 class="col-md-4 textheading1" > Student Work </h2>
 +
</div>
 +
 
<div class="clear"></div>
 
<div class="clear"></div>
  
  
<div class="column half_size">
 
<h3>Gold Medal Criterion #1</h3>
 
<p>Expand on your silver medal activity by demonstrating how you have integrated the investigated issues into the design and/or execution of your project.</p>
 
  
 +
<div class="dnaback img-responsive">
 +
<article>
 +
<div class="link" id="Abstract"></div>
 +
        <h3> In The Lab <h3>
 +
        <h4> This section I am going to need a few statements about what each student does, maybe have a short write up from each person, hyperlink their names to the Team page. </h4><br>
 +
       
 +
 +
</article>
 +
 +
 +
 +
 +
 +
 +
<article>
 +
<div class="link" id="Abstract"></div>
 +
        <h3> On the Web Site <h3>
 +
        <h4> Heading up the wiki page this year is our Computer Science student, <a
 +
        href="https://2017.igem.org/Team:USNA_Annapolis/Team#Joe"> Joe</a>. He produced the wiki using various sources such as
 +
        CSS and Bootstrap. Many of the images are completely free to use, and the others were created by us. Many of the
 +
        photos were edited in GIMP, a free image editing software produced by the GNU Project. The website was a continuous
 +
        effort this year, and Joe kept himself busy, proving to be a valuable
 +
        part of the USNA team. However, Joe could not have been so successful without the help of the rest of the team, since
 +
        he stayed mostly out of the lab itself. </h4>
 +
        <blockquote> We each brought our own particular skillset to the table. It just so happened that I was more familiar
 +
        with computers than the rest of the gang, so I decided to head up the web development part, and it was a great time! </blockquote>
 +
        <h4> Our iGEM team last year had been less experienced with building wiki pages, so this year the team made sure to get an early start to achieve an interactive, easy to navigate, and informational webpage for the competition.</h4>
 +
 +
</article>
 +
 +
 +
 +
<article>
 +
<div class="link" id="Abstract"></div>
 +
    <div class="row">
 +
      <div class="col-md-6 text-col-left">
 +
        <h3> Risks <h3>
 +
      </div>
 +
    </div>
 +
        <div class="row">
 +
 +
        <div class="col-md-6 text-col-left">
 +
        <h4> Our modified organism could pose the risk of environmental release, if applied to the human body. We will need to engineer in a kill-switch mechanism, or another self-destruct mechanism to control unintended proliferation.</h4>
 +
        </div>
 +
  <div class="col-md-6 img-100">
 +
            <img src="https://static.igem.org/mediawiki/igem.org/e/e5/USNA_Annapolis-Risks.jpg" class="img-responsive riskopacity">
 +
          </div>
 +
        </div>
 +
</article>
 
</div>
 
</div>
  
<div class="column half_size">
 
<h3>Best Integrated Human Practices Special Prize</h3>
 
  
<p>
+
<div class="row">
To compete for the <a href="https://2017.igem.org/Judging/Awards">Best Integrated Human Practices prize</a>, please describe your work on this page and also fill out the description on the <a href="https://2017.igem.org/Judging/Judging_Form">judging form</a>.
+
<h2 class="col-md-4 textheading1" > Mentor Work </h2>
<br><br>
+
</div>
You must also delete the message box on the top of this page to be eligible for this prize.
+
 
</p>
+
 
 +
 
 +
 
 +
 
 +
 
 +
<footer>
 +
<div id="logorow">
 +
  <div class="footerlogo">
 +
    <a href="http://www.dtra.mil/"></a><img class="footerlogosizes logoclear logoclear1 img-responsive footerimg" src="https://static.igem.org/mediawiki/igem.org/8/8b/USNA_Annapolis-DTRAseal.jpg"></img>
 +
  </div>
 +
  <div class="footerlogo">
 +
    <a href="https://www.nrl.navy.mil/"></a><img class="footerlogosizes logoclear logoclear1 img-responsive footerimg" src="https://static.igem.org/mediawiki/igem.org/d/dc/USNA_Annapolis-NRLseal.jpg"></img>
 +
  </div>
 +
  <div class="footerlogo">
 +
    <a href="https://www.onr.navy.mil//"></a><img class="footerlogosizes logoclear logoclear1 img-responsive footerimg" src="https://static.igem.org/mediawiki/igem.org/3/30/USNA_Annapolis-NavalResearchSeal.jpg">
 +
  </div>
 +
 
 
</div>
 
</div>
<div class="clear"></div>
+
</footer>
<div class="column full_size">
+
 
<h5>Inspiration</h5>
+
<p>Here are a few examples of excellent Integrated Human Practices work:</p>
+
<ul>
+
<li><a href="https://2016.igem.org/Team:INSA-Lyon/Integrated_Practices">2016 INSA Lyon</a></li>
+
<li><a href="https://2016.igem.org/Team:UofC_Calgary/Integrated_Practices">2016 UofC Calgary</a></li>
+
<li><a href="https://2015.igem.org/Team:Bielefeld-CeBiTec/Practices">2015 Bielefeld</a></li>
+
<li><a href="https://2015.igem.org/Team:Edinburgh/Practices">2015 Edinburgh</a></li>
+
</ul>
+
 
</html>
 
</html>

Revision as of 20:51, 11 July 2017

Attributions

Students and Mentors

Student Work

In The Lab

This section I am going to need a few statements about what each student does, maybe have a short write up from each person, hyperlink their names to the Team page.


On the Web Site

Heading up the wiki page this year is our Computer Science student, Joe. He produced the wiki using various sources such as CSS and Bootstrap. Many of the images are completely free to use, and the others were created by us. Many of the photos were edited in GIMP, a free image editing software produced by the GNU Project. The website was a continuous effort this year, and Joe kept himself busy, proving to be a valuable part of the USNA team. However, Joe could not have been so successful without the help of the rest of the team, since he stayed mostly out of the lab itself.

We each brought our own particular skillset to the table. It just so happened that I was more familiar with computers than the rest of the gang, so I decided to head up the web development part, and it was a great time!

Our iGEM team last year had been less experienced with building wiki pages, so this year the team made sure to get an early start to achieve an interactive, easy to navigate, and informational webpage for the competition.

Risks

Our modified organism could pose the risk of environmental release, if applied to the human body. We will need to engineer in a kill-switch mechanism, or another self-destruct mechanism to control unintended proliferation.

Mentor Work