Difference between revisions of "Team:Amoy/Safety"

Line 5: Line 5:
 
<title>Aomy/Project</title>
 
<title>Aomy/Project</title>
  
<style type="text/css">
+
<script type="text/javascript" src="https://igem.org/common/jquery-1.11.1.min.js?action=raw&amp;ctype=text/javascript"></script>
body
+
{
+
background-color: #fff;
+
}
+
  
#content
+
<link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:Amoy/css/BootstrapCss?action=raw&amp;ctype=text/css" />
{
+
padding: 0; border: 0; width: 100%;
+
}
+
  
.firstHeading
+
<link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:Amoy/css/InterlabCss?action=raw&amp;ctype=text/css" />
{
+
visibility: hidden;  
+
}
+
  
#menu
+
<link rel="stylesheet" type="text/css" href="https://2015.igem.org/Template:Amoy/css/MenuBarCss?action=raw&amp;ctype=text/css" />
{
+
width: 100%;
+
height: 200px;
+
overflow: hidden;
+
margin-top: -50px;
+
position: absolute;
+
}
+
  
#logo
+
</head>
{
+
position: absolute;
+
width: 115px;
+
height: 70px;
+
margin-top: -20px;
+
margin-left: 20px;
+
z-index:999;
+
}
+
  
  
 +
<body>
  
 +
<a style="width:50px; height:50px; position:fixed; right:30px; bottom:30px; z-index:9999; display:none; background:url(http://demo.lanrenzhijia.com/2014/scrollTop1120/images/lanren.gif) no-repeat center center #147abc;"  href="javascript:;" class="lanrenzhijia_top"></a>
  
 +
<script>
 +
$(function(){
 +
    $(window).scroll(function(){
 +
        var _top = $(window).scrollTop();
 +
        if(_top>300){
 +
            $('.lanrenzhijia_top').fadeIn(600);
 +
        }else{
 +
            $('.lanrenzhijia_top').fadeOut(600);
 +
        }
 +
    });
 +
    $(".lanrenzhijia_top").click(function(){
 +
        $("html,body").animate({scrollTop:0},400);
 +
    });
 +
});
 +
</script>
  
html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td
+
<div id="menu">
{
+
font-family: Helvetica, Tahoma, Arial, "Hiragino Sans GB", "Hiragino Sans GB W3", "Microsoft YaHei", STXihei, STHeiti, Heiti, SimSun, sans-serif;
+
font-size: 12px;
+
}
+
#cssmenu,
+
#cssmenu ul,
+
#cssmenu ul li,
+
#cssmenu ul li a,
+
#cssmenu #menu-button {
+
  margin: 0;
+
  padding: 0;
+
  border: 0;
+
  list-style: none;
+
  line-height: 1;
+
  display: block;
+
  position: relative;
+
  -webkit-box-sizing: border-box;
+
  -moz-box-sizing: border-box;
+
  box-sizing: border-box;
+
}
+
#cssmenu:after,
+
#cssmenu > ul:after {
+
  content: ".";
+
  display: block;
+
  clear: both;
+
  visibility: hidden;
+
  line-height: 0;
+
  height: 0;
+
}
+
#cssmenu #menu-button {
+
  display: none;
+
}
+
#cssmenu {
+
  width: auto;
+
  font-family: 'Open Sans', sans-serif;
+
  line-height: 1;
+
font-weight: bold;
+
  
}
+
<div id="bg_menu">
#menu-line {
+
<img src="https://static.igem.org/mediawiki/2015/archive/3/38/20150704080529%21Background1.jpg" />
  position: absolute;
+
  top: 0;
+
  left: 0;
+
  height: 3px;
+
  background: #009ae1;
+
  -webkit-transition: all 0.25s ease-out;
+
  -moz-transition: all 0.25s ease-out;
+
  -ms-transition: all 0.25s ease-out;
+
  -o-transition: all 0.25s ease-out;
+
  transition: all 0.25s ease-out;
+
}
+
#cssmenu > ul > li {
+
  float: left;
+
}
+
#cssmenu.align-center > ul {
+
  font-size: 0;
+
  text-align: center;
+
}
+
#cssmenu.align-center > ul > li {
+
  display: inline-block;
+
  float: none;
+
}
+
#cssmenu.align-center ul ul {
+
  text-align: left;
+
}
+
#cssmenu.align-right > ul > li {
+
  float: right;
+
}
+
#cssmenu.align-right ul ul {
+
  text-align: right;
+
}
+
#cssmenu > ul > li > a {
+
margin-right: 40px;
+
  padding-top: 20px;
+
  font-size: 12px;
+
  text-decoration: none;
+
  text-transform: uppercase;
+
  color: #fff;
+
  -webkit-transition: color .2s ease;
+
  -moz-transition: color .2s ease;
+
  -ms-transition: color .2s ease;
+
  -o-transition: color .2s ease;
+
  transition: color .2s ease;
+
}
+
 
+
#cssmenu > ul > li:hover > a,
+
#cssmenu > ul > li.active > a
+
{
+
border-bottom: 1.5px solid #fff;
+
padding-bottom: 5px;
+
 
+
}
+
 
+
#cssmenu > ul > li.has-sub > a {
+
  margin-right: 40px;
+
}
+
#cssmenu > ul > li.has-sub > a::after {
+
  position: absolute;
+
  top: 21px;
+
  right: -18px;
+
  width: 4px;
+
  height: 4px;
+
  border-bottom: 1px solid #fff;
+
  border-right: 1px solid #fff;
+
  content: "";
+
  -webkit-transform: rotate(45deg);
+
  -moz-transform: rotate(45deg);
+
  -ms-transform: rotate(45deg);
+
  -o-transform: rotate(45deg);
+
  transform: rotate(45deg);
+
  -webkit-transition: border-color 0.2s ease;
+
  -moz-transition: border-color 0.2s ease;
+
  -ms-transition: border-color 0.2s ease;
+
  -o-transition: border-color 0.2s ease;
+
  transition: border-color 0.2s ease;
+
}
+
#cssmenu > ul > li.has-sub:hover > a::after {
+
}
+
#cssmenu ul ul {
+
  position: absolute;
+
  left: -9999px;
+
}
+
#cssmenu li:hover > ul {
+
  left: auto;
+
}
+
#cssmenu.align-right li:hover > ul {
+
  right: 0;
+
}
+
#cssmenu ul ul ul {
+
  margin-left: 100%;
+
  top: 0;
+
}
+
#cssmenu.align-right ul ul ul {
+
  margin-left: 0;
+
  margin-right: 100%;
+
}
+
#cssmenu ul ul li {
+
  height: 0;
+
  -webkit-transition: height .2s ease;
+
  -moz-transition: height .2s ease;
+
  -ms-transition: height .2s ease;
+
  -o-transition: height .2s ease;
+
  transition: height .2s ease;
+
}
+
#cssmenu ul li:hover > ul > li {
+
  height: 32px;
+
}
+
#cssmenu ul ul li a {
+
  padding: 10px 20px;
+
  width: 160px;
+
  font-size: 12px;
+
  background: #333333;
+
  text-decoration: none;
+
  color: #dddddd;
+
  -webkit-transition: color .2s ease;
+
  -moz-transition: color .2s ease;
+
  -ms-transition: color .2s ease;
+
  -o-transition: color .2s ease;
+
  transition: color .2s ease;
+
}
+
#cssmenu ul ul li:hover > a,
+
#cssmenu ul ul li a:hover {
+
  color: #ffffff;
+
}
+
#cssmenu ul ul li.has-sub > a::after {
+
  position: absolute;
+
  top: 13px;
+
  right: 10px;
+
  width: 4px;
+
  height: 4px;
+
  border-bottom: 1px solid #dddddd;
+
  border-right: 1px solid #dddddd;
+
  content: "";
+
  -webkit-transform: rotate(-45deg);
+
  -moz-transform: rotate(-45deg);
+
  -ms-transform: rotate(-45deg);
+
  -o-transform: rotate(-45deg);
+
  transform: rotate(-45deg);
+
  -webkit-transition: border-color 0.2s ease;
+
  -moz-transition: border-color 0.2s ease;
+
  -ms-transition: border-color 0.2s ease;
+
  -o-transition: border-color 0.2s ease;
+
  transition: border-color 0.2s ease;
+
}
+
#cssmenu.align-right ul ul li.has-sub > a::after {
+
  right: auto;
+
  left: 10px;
+
  border-bottom: 0;
+
  border-right: 0;
+
  border-top: 1px solid #dddddd;
+
  border-left: 1px solid #dddddd;
+
}
+
#cssmenu ul ul li.has-sub:hover > a::after {
+
  border-color: #ffffff;
+
}
+
@media all and (max-width: 768px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) {
+
  #cssmenu {
+
    width: 100%;
+
  }
+
  #cssmenu ul {
+
    width: 100%;
+
    display: none;
+
  }
+
  #cssmenu.align-center > ul,
+
  #cssmenu.align-right ul ul {
+
    text-align: left;
+
  }
+
  #cssmenu ul li,
+
  #cssmenu ul ul li,
+
  #cssmenu ul li:hover > ul > li {
+
    width: 100%;
+
    height: auto;
+
    border-top: 1px solid rgba(120, 120, 120, 0.15);
+
  }
+
  #cssmenu ul li a,
+
  #cssmenu ul ul li a {
+
    width: 100%;
+
  }
+
  #cssmenu > ul > li,
+
  #cssmenu.align-center > ul > li,
+
  #cssmenu.align-right > ul > li {
+
    float: none;
+
    display: block;
+
  }
+
  #cssmenu ul ul li a {
+
    padding: 20px 20px 20px 30px;
+
    font-size: 12px;
+
    color: #000000;
+
    background: none;
+
  }
+
  #cssmenu ul ul li:hover > a,
+
  #cssmenu ul ul li a:hover {
+
    color: #000000;
+
  }
+
  #cssmenu ul ul ul li a {
+
    padding-left: 40px;
+
  }
+
  #cssmenu ul ul,
+
  #cssmenu ul ul ul {
+
    position: relative;
+
    left: 0;
+
    right: auto;
+
    width: 100%;
+
    margin: 0;
+
  }
+
  #cssmenu > ul > li.has-sub > a::after,
+
  #cssmenu ul ul li.has-sub > a::after {
+
    display: none;
+
  }
+
  #menu-line {
+
    display: none;
+
  }
+
  #cssmenu #menu-button {
+
    display: block;
+
    padding: 20px;
+
    color: #000000;
+
    cursor: pointer;
+
    font-size: 12px;
+
    text-transform: uppercase;
+
  }
+
  #cssmenu #menu-button::after {
+
    content: '';
+
    position: absolute;
+
    top: 20px;
+
    right: 20px;
+
    display: block;
+
    width: 15px;
+
    height: 2px;
+
    background: #000000;
+
  }
+
  #cssmenu #menu-button::before {
+
    content: '';
+
    position: absolute;
+
    top: 25px;
+
    right: 20px;
+
    display: block;
+
    width: 15px;
+
    height: 3px;
+
    border-top: 2px solid #000000;
+
    border-bottom: 2px solid #000000;
+
  }
+
  #cssmenu .submenu-button {
+
    position: absolute;
+
    z-index: 10;
+
    right: 0;
+
    top: 0;
+
    display: block;
+
    border-left: 1px solid rgba(120, 120, 120, 0.15);
+
    height: 52px;
+
    width: 52px;
+
    cursor: pointer;
+
  }
+
  #cssmenu .submenu-button::after {
+
    content: '';
+
    position: absolute;
+
    top: 21px;
+
    left: 26px;
+
    display: block;
+
    width: 1px;
+
    height: 11px;
+
    background: #000000;
+
    z-index: 99;
+
  }
+
  #cssmenu .submenu-button::before {
+
    content: '';
+
    position: absolute;
+
    left: 21px;
+
    top: 26px;
+
    display: block;
+
    width: 11px;
+
    height: 1px;
+
    background: #000000;
+
    z-index: 99;
+
  }
+
  #cssmenu .submenu-button.submenu-opened:after {
+
    display: none;
+
  }
+
}
+
 
+
#project_abstract{
+
    padding-right: 20px;
+
    padding-left: 20px;
+
}
+
 
+
 
+
 
+
#cssmenu
+
{
+
position: absolute;
+
right: 20px;
+
margin-top: -20px;
+
}
+
 
+
 
+
#main_text
+
{
+
position: absolute;
+
margin-top: 150px;
+
}
+
 
+
</style>
+
 
+
</head>
+
 
+
 
+
<body>
+
<div id="menu">
+
<img id="bg_menu" src="https://static.igem.org/mediawiki/2015/archive/3/38/20150704080529%21Background1.jpg" />
+
 
</div>
 
</div>
  
Line 408: Line 55:
 
       </ul>
 
       </ul>
 
   </li>
 
   </li>
   <li class='has-sub'><a href='https://2015.igem.org/Team:Amoy/Interlab'>Interlab</a>
+
   <li><a href='https://2015.igem.org/Team:Amoy/Interlab'>Interlab</a>
      <ul>
+
        <li class='has-sub'><a href='https://2015.igem.org/Team:Amoy/Interlab/Results'>Results</a></li>
+
        <li class='has-sub'><a href='https://2015.igem.org/Team:Amoy/Interlab/Figure'>Figure</a></li>
+
        <li class='has-sub'><a href='https://2015.igem.org/Team:Amoy/Interlab/Table'>Table</a></li>
+
      </ul>
+
 
   </li>
 
   </li>
 
   <li class='has-sub'><a href='https://2015.igem.org/Team:Amoy/Newsletter'>Newsletter</a>
 
   <li class='has-sub'><a href='https://2015.igem.org/Team:Amoy/Newsletter'>Newsletter</a>
Line 434: Line 76:
 
       <ul>
 
       <ul>
 
         <li class='has-sub'><a href='https://2015.igem.org/Team:Amoy/Member/Member'>Member</a></li>
 
         <li class='has-sub'><a href='https://2015.igem.org/Team:Amoy/Member/Member'>Member</a></li>
        <li class='has-sub'><a href='https://2015.igem.org/Team:Amoy/Member/Work'>Work</a></li>
 
 
         <li class='has-sub'><a href='https://2015.igem.org/Team:Amoy/Member/Amoy'>Amoy</a></li>
 
         <li class='has-sub'><a href='https://2015.igem.org/Team:Amoy/Member/Amoy'>Amoy</a></li>
 
         <li class='has-sub'><a href='https://2015.igem.org/Team:Amoy/Member/Gallery'>Gallery</a></li>
 
         <li class='has-sub'><a href='https://2015.igem.org/Team:Amoy/Member/Gallery'>Gallery</a></li>
 
       </ul>
 
       </ul>
 
   </li>
 
   </li>
   <li class='active'><a href='https://2015.igem.org/Team:Amoy/Safety'>Safety</a></li>
+
   <li><a href='https://2015.igem.org/Team:Amoy/Safety'>Safety</a></li>
 
   <li><a href='https://2015.igem.org/Team:Amoy/Acknowledgement'>Acknowledgement</a></li>
 
   <li><a href='https://2015.igem.org/Team:Amoy/Acknowledgement'>Acknowledgement</a></li>
 
</ul>
 
</ul>
 
</div>
 
</div>
  
 +
</div>
  
<div id="main_text">
 
  
<h2>Safety in iGEM</h2>
+
<div class="col-md-1"></div>
 +
<div id="main_content" class="col-md-10">
  
<p>Please visit <a href="https://2015.igem.org/Safety">the main Safety page</a> to find this year's safety requirements & deadlines, and to learn about safe & responsible research in iGEM.</p>
+
<div id="s_menu" class="col-md-2">
 +
    <a href="https://2015.igem.org/Team:Amoy/Safety"><h4>Safety</h4></a>
 +
    <ul class="ul_menu">
 +
        <li><a id="a_Introduction" href="javascript:;">Introduction</a></li>
 +
        <li><a id="a_Protocol" href="javascript:;">Protocol</a></li>
 +
        <li><a id="a_Measurements" href="javascript:;">Measurements</a></li>
 +
        <li><a id="a_Provenance" href="javascript:;">Provenance</a></li>
 +
        <li><a id="a_Appendix" href="javascript:;">Appendix</a></li>
 +
        <li><a id="a_Reference" href="javascript:;">Reference</a></li>
 +
    </ul>
 +
</div>
 +
 
 +
<script>
 +
$(function(){
 +
    $("#a_Introduction").click(function(){
 +
        $("html,body").animate({scrollTop:$('#Introduction').offset().top},400);
 +
    });
 +
});
 +
</script>
 +
 
 +
<script>
 +
$(function(){
 +
    $("#a_Protocol").click(function(){
 +
        $("html,body").animate({scrollTop:$('#Protocol').offset().top},400);
 +
    });
 +
});
 +
</script>
  
<p>On this page of your wiki, you should write about how you are addressing any safety issues in your project. The wiki is a place where you can <strong>go beyond the questions on the safety forms</strong>, and write about whatever safety topics are most interesting in your project. (You do not need to copy your safety forms onto this wiki page.)</p>
+
<script>
 +
$(function(){
 +
    $("#a_Measurements").click(function(){
 +
        $("html,body").animate({scrollTop:$('#Measurements').offset().top},400);
 +
    });
 +
});
 +
</script>
  
 +
<script>
 +
$(function(){
 +
    $("#a_Provenance").click(function(){
 +
        $("html,body").animate({scrollTop:$('#Provenance').offset().top},400);
 +
    });
 +
});
 +
</script>
  
<h4>Safe Project Design</h4>
+
<script>
 +
$(function(){
 +
    $("#a_Appendix").click(function(){
 +
        $("html,body").animate({scrollTop:$('#Appendix').offset().top},400);
 +
    });
 +
});
 +
</script>
  
<p>Does your project include any safety features? Have you made certain decisions about the design to reduce risks? Write about them here! For example:</p>
+
<script>
 +
$(function(){
 +
    $("#a_Reference").click(function(){
 +
        $("html,body").animate({scrollTop:$('#Reference').offset().top},400);
 +
    });
 +
});
 +
</script>
 +
 
 +
<div class="col-md-1"></div>
 +
 
 +
<div id="title" class="col-md-9">
 +
 
 +
<p id="title_p">Safety</p>
 +
 
 +
<h1 id="Introduction" class="main_h1">Safe Project Design</h1>
 +
 
 +
<p class="main_p">Does your project include any safety features? Have you made certain decisions about the design to reduce risks? Write about them here! For example:</p>
  
 
<ul>
 
<ul>
Line 465: Line 168:
 
</ul>
 
</ul>
  
<h4>Safe Lab Work</h4>
+
<h1 id="Introduction" class="main_h1">Safe Lab Work</h1>
  
<p>What safety procedures do you use every day in the lab? Did you perform any unusual experiments, or face any unusual safety issues? Write about them here!</p>
+
<p class="main_p">What safety procedures do you use every day in the lab? Did you perform any unusual experiments, or face any unusual safety issues? Write about them here!</p>
  
<h4>Safe Shipment</h4>
+
<h1 id="Introduction" class="main_h1">Safe Shipment</h1>
  
<p>Did you face any safety problems in sending your DNA parts to the Registry? How did you solve those problems?</p>
+
<p class="main_p">Did you face any safety problems in sending your DNA parts to the Registry? How did you solve those problems?</p>
 +
 
 +
</div>
  
  
 
</div>
 
</div>
 +
  
 
</body>
 
</body>
  
 
</html>
 
</html>

Revision as of 13:42, 26 August 2015

Aomy/Project

Safety

Safe Project Design

Does your project include any safety features? Have you made certain decisions about the design to reduce risks? Write about them here! For example:

  • Choosing a non-pathogenic chassis
  • Choosing parts that will not harm humans / animals / plants
  • Substituting safer materials for dangerous materials in a proof-of-concept experiment
  • Including an "induced lethality" or "kill-switch" device

Safe Lab Work

What safety procedures do you use every day in the lab? Did you perform any unusual experiments, or face any unusual safety issues? Write about them here!

Safe Shipment

Did you face any safety problems in sending your DNA parts to the Registry? How did you solve those problems?