Difference between revisions of "Team:HZAU-China/Results"

(Prototype team page)
 
 
(39 intermediate revisions by 6 users not shown)
Line 1: Line 1:
{{HZAU-China}}
+
{{HZAU-China/Bootstrap}}
 
<html>
 
<html>
  
 +
<head>
 +
    <meta charset="UTF-8">
 +
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
 +
    <link href="bootstrap.min.css" rel="stylesheet">
 +
    <!-- 导航栏CSS -->
 +
    <style type="text/css">
 +
        #sideMenu,
 +
        #top_title,
 +
        #team_submenu {
 +
            display: none;
 +
        }
  
<div class="column full_size">
+
        #HQ_page p {
<h1>Results</h1>
+
            margin: 0 !important;
<p>Here you can describe the results of your project and your future plans. </p>
+
        }
</div>
+
  
 +
        #content {
 +
            padding: 0px;
 +
            width: 100%;
 +
            margin-top: 0px;
 +
            margin-left: 0px;
 +
        }
  
<div class="column third_size" >
+
        #bodyContent h1,
 +
        #bodyContent h2,
 +
        #bodyContent h3,
 +
        #bodyContent h4,
 +
        #bodyContent h5 {
 +
            margin-bottom: 0px;
 +
        }
  
<h3>What should this page contain?</h3>
+
        #team_name {
<ul>
+
            display: none
<li> Clearly and objectively describe the results of your work.</li>
+
        }
<li> Future plans for the project. </li>
+
<li> Considerations for replicating the experiments. </li>
+
</ul>
+
</div>
+
  
 +
        .global_wrapper {
 +
            padding: 0px 0px 0px 0px;
 +
        }
  
 +
        #top_menu_14 {
 +
            height: 16px;
 +
        }
  
 +
        * {
 +
            margin: 0;
 +
            padding: 0;
 +
            list-style: none;
 +
            list-style-type: none;
 +
            text-decoration: none !important;
 +
        }
  
<div class="column two_thirds_size" >
+
        body {
<h3>Describe what your results mean </h3>
+
            margin: 0;
<ul>
+
            padding: 0;
<li> Interpretation of the results obtained during your project. Don't just show a plot/figure/graph/other, tell us what you think the data means. This is an important part of your project that the judges will look for. </li>
+
            background-color: #F3F3F3;
<li> Show data, but remember all measurement and characterization data must be on part pages in the Registry. </li>
+
            font-size: 16px;
<li> Consider including an analysis summary section to discuss what your results mean. Judges like to read what you think your data means, beyond all the data you have acquired during your project. </li>
+
            font-family: Arial, Verdana, Sans-serif;
</ul>
+
            letter-spacing: 0;
</div>
+
            color: #FFFFFF;
 +
        }
  
 +
        .daohang {
 +
            background-color: #323643;
 +
            position: relative;
 +
            color: #ffffff;
 +
            height: 64px;
 +
            top: -2px;
 +
        }
  
<div class="clear extra_space"></div>
+
        .logo-daohang {
 +
            height: 64px;
 +
            left: 10%;
 +
            float: left;
 +
            position: relative;
 +
        }
  
 +
        .daohang a {
 +
            display: block;
 +
            text-decoration: none;
 +
        }
  
 +
        .daohang .shade {
 +
            position: absolute;
 +
            width: 100%;
 +
            height: 160px;
 +
            top: 64px;
 +
            left: 0;
 +
            z-index: 1;
 +
            background-color: #EEEEEE;
 +
            box-shadow: 0 5px 15px #CCCCCC;
 +
            display: none;
 +
            border-bottom: #ffffff solid 1px;
 +
            border-bottom: rgba(255, 255, 255, 0.3) solid 1px;
 +
        }
  
<div class="column two_thirds_size" >
+
        .daohang .caidan {
<h3> Project Achievements </h3>
+
            position: absolute;
 +
            top: 0;
 +
            right: 10%;
 +
            margin: 0;
 +
            z-index: 2;
 +
            padding: 0;
 +
            list-style: none;
 +
            width: 730px;
 +
            float: right;
 +
            overflow: hidden;
 +
            height: 64px;
 +
        }
  
<p>You can also include a list of bullet points (and links) of the successes and failures you have had over your summer. It is a quick reference page for the judges to see what you achieved during your summer.</p>
+
        .daohang .caidan>li {
 +
            padding: 0;
 +
            float: left;
 +
            margin: 0;
 +
            text-align: center;
 +
            height: 224px;
 +
        }
  
<ul>
+
        .daohang .shortName {
<li>A list of linked bullet points of the successful results during your project</li>
+
            width: 110px;
<li>A list of linked bullet points of the unsuccessful results during your project. This is about being scientifically honest. If you worked on an area for a long time with no success, tell us so we know where you put your effort.</li>
+
        }
</ul>
+
  
</div>
+
        .daohang .longName {
 +
            width: 170px;
 +
        }
  
 +
        .daohang .nav_head {
 +
            height: 64px;
 +
            line-height: 64px;
 +
            color: #ffffff;
 +
            font-size: 16px !important;
 +
        }
  
 +
        .daohang .xsjPic {
 +
            display: inline-block;
 +
            width: 10px;
 +
            height: 10px;
 +
            vertical-align: middle;
 +
            background-size: 100% 100%;
 +
            background-image: url("https://static.igem.org/mediawiki/2018/6/63/T--HZAU-China--xsj.svg")
 +
        }
  
<div class="column third_size" >
+
        .daohang .xjtPic {
<div class="highlight decoration_A_full">
+
            display: inline-block;
<h3>Inspiration</h3>
+
            width: 10px;
<p>See how other teams presented their results.</p>
+
            height: 10px;
<ul>
+
            vertical-align: middle;
<li><a href="https://2014.igem.org/Team:TU_Darmstadt/Results/Pathway">2014 TU Darmstadt </a></li>
+
            background-size: 100% 100%;
<li><a href="https://2014.igem.org/Team:Imperial/Results">2014 Imperial </a></li>
+
            background-image: url("https://static.igem.org/mediawiki/2018/8/8d/T--HZAU-China--xjt.svg")
<li><a href="https://2014.igem.org/Team:Paris_Bettencourt/Results">2014 Paris Bettencourt </a></li>
+
        }
</ul>
+
</div>
+
</div>
+
  
 +
        .daohang a:hover span {
 +
            transform: rotateY(180deg);
 +
            -webkit-transform: rotateY(180deg);
 +
            -moz-transform: rotateY(180deg);
 +
            -o-transform: rotateY(180deg);
 +
            -ms-transform: rotateY(180deg);
 +
            transition: all 0.5s ease-in-out;
 +
            -webkit-transition: all 0.5s ease-in-out;
 +
            -moz-transition: all 0.5s ease-in-out;
 +
            -o-transition: all 0.5s ease-in-out;
 +
        }
  
 +
        .daohang .item {
 +
            font-size: 16px;
 +
            height: 40px;
 +
            line-height: 40px;
 +
            color: #333333;
 +
            position: relative;
 +
        }
  
 +
        .daohang .caidan:hover {
 +
            height: 264px;
 +
            transition: height 0.3s;
 +
        }
  
 +
        .daohang .caidan:hover+.shade {
 +
            display: block;
 +
        }
 +
 +
        .daohang .caidan>li.hiLight:hover {
 +
            background-color: #ffffff;
 +
        }
 +
 +
        .daohang .caidan>li:hover .nav_head {
 +
            background-color: #EA0D04;
 +
        }
 +
 +
        .daohang .caidan>li:hover .item {}
 +
 +
 +
        .daohang .shortName .item:before {
 +
            content: '';
 +
            display: block;
 +
            position: absolute;
 +
            width: 80px;
 +
            height: 1px;
 +
            bottom: 5px;
 +
            left: 15px;
 +
            background-color: #CCCCCC;
 +
        }
 +
 +
        .daohang .shortName .item:hover:after {
 +
            content: '';
 +
            display: block;
 +
            position: absolute;
 +
            width: 80px;
 +
            height: 2px;
 +
            bottom: 5px;
 +
            left: 15px;
 +
            background-color: #f51720;
 +
        }
 +
 +
        .daohang .longName .item:before {
 +
            content: '';
 +
            display: block;
 +
            position: absolute;
 +
            width: 130px;
 +
            height: 1px;
 +
            bottom: 5px;
 +
            left: 20px;
 +
            background-color: #CCCCCC;
 +
        }
 +
 +
        .daohang .longName .item:hover:after {
 +
            content: '';
 +
            display: block;
 +
            position: absolute;
 +
            width: 130px;
 +
            height: 2px;
 +
            bottom: 5px;
 +
            left: 20px;
 +
            background-color: #f51720;
 +
        }
 +
 +
        @media screen and (max-width: 1200px) {
 +
            .logo-daohang {
 +
                left: 3%;
 +
            }
 +
 +
            .daohangyi {
 +
                font-size: 12px;
 +
            }
 +
        }
 +
 +
        @media screen and (max-width: 880px) {
 +
 +
            .daohang .caidan {
 +
                right: 0;
 +
                width: 100%;
 +
            }
 +
 +
            .logo-daohang {
 +
                display: none;
 +
            }
 +
 +
            .daohang .shortName {
 +
                width: 15vw;
 +
            }
 +
 +
            .daohang .longName {
 +
                width: 25vw;
 +
            }
 +
 +
            .daohangyi img {
 +
                display: none;
 +
            }
 +
 +
            .daohang .longName .item:before {
 +
                width: 150px;
 +
                left: 20px;
 +
            }
 +
 +
            .daohang .longName .item:hover:after {
 +
                width: 150px;
 +
                left: 20px;
 +
            }
 +
        }
 +
    </style>
 +
    <!-- 内容CSS -->
 +
    <style class="text/css">
 +
        .clearfix:after {
 +
            content: ".";
 +
            display: block;
 +
            height: 0;
 +
            clear: both;
 +
            visibility: hidden;
 +
 +
        }
 +
 +
        .neirong {
 +
            width: 100%;
 +
            height: auto;
 +
            background-color: #F3F3F3;
 +
        }
 +
 +
        .zhengwen {
 +
            width: 80%;
 +
            /* height: auto; */
 +
            margin: 20px 40px 0 0;
 +
            /* right: 2%; */
 +
            /* top: 90px; */
 +
            padding: 50px 3%;
 +
            float: right;
 +
            /* position: relative; */
 +
            background-color: #FFF;
 +
            box-shadow: 0 1px 3px #676767;
 +
            /* border: 2px solid black; */
 +
            /* border-radius: 3px; */
 +
            /* overflow: hidden; */
 +
            /* display: block; */
 +
            /* font-family: Arial, Verdana, Sans-serif; */
 +
        }
 +
 +
        .cebian {
 +
            width: 200px;
 +
            /* height: 80vh; */
 +
            float: left;
 +
            /* left: 1vw; */
 +
            top: 150px;
 +
            position: fixed;
 +
            box-shadow: 0 1px 3px #676767;
 +
            /* border:2px solid black */
 +
            /* background-color: #323643 */
 +
        }
 +
 +
        .zhengwen p{
 +
            text-align: justify !important;
 +
            font-family:  'Times New Roman',Helvetica,'Open Sans',  Arial, sans-serif !important;
 +
            color: #3B3B3B;
 +
            font-size: 26px !important;
 +
            padding-right: 20px;
 +
        }
 +
 +
        .daimg {
 +
            width: 100%;
 +
            height: auto;
 +
            margin: 20px 0;
 +
            box-shadow: 0 1px 3px #676767;
 +
        }
 +
 +
        .h1 {
 +
            line-height: 55px;
 +
            font-weight: bold;
 +
            height:auto;
 +
            font-family: 'Product Sans', sans-serif;
 +
            font-size: 40px;
 +
            color: #3B3B3B;
 +
            border-bottom: 2px solid #676767;
 +
            margin-bottom: 20px;
 +
        }
 +
 +
        .h2 {
 +
            height: 40px;
 +
            line-height: 40px;
 +
            font-weight: bold;
 +
            height:auto;
 +
            /* font-weight: bold; */
 +
            font-family: 'Product Sans', sans-serif;
 +
            font-size: 30px;
 +
            color: #484848;
 +
            /* margin-bottom: 20px; */
 +
        }
 +
 +
        .h3 {
 +
            height: 30px;
 +
            line-height: 30px;
 +
            font-weight: bold;
 +
            height:auto;
 +
            /* font-weight: bold; */
 +
            font-family: 'Product Sans', sans-serif;
 +
            font-size: 24px;
 +
            color: #484848;
 +
            /* margin-bottom: 20px; */
 +
        }
 +
       
 +
        table {
 +
            color: #3B3B3B;
 +
        }
 +
 +
        .zhengwen .tuandui_list {
 +
            position: relative;
 +
            margin-top: 40px;
 +
            height: 520px;
 +
            overflow: hidden;
 +
        }
 +
 +
        .tuandui_list>li {
 +
            padding: 0;
 +
            width: 20%;
 +
            float: left;
 +
            position: relative;
 +
            margin: 0 2.4%;
 +
            text-align: center;
 +
        }
 +
 +
        .zhengwen .laoshi_list {
 +
            position: relative;
 +
            margin-top: 40px;
 +
            height: 430px;
 +
        }
 +
 +
        .laoshi_list>li {
 +
            padding: 0;
 +
            width: 20%;
 +
            float: left;
 +
            position: relative;
 +
            margin: 0 2.4%;
 +
            text-align: center;
 +
        }
 +
 +
        .duiyuan {
 +
            margin: 20px 0;
 +
            /* border: 1px solid red; */
 +
        }
 +
 +
        .laoshi {
 +
            margin: 20px 0;
 +
        }
 +
 +
        .duiyuan img {
 +
            width: 100%;
 +
            height: auto;
 +
            border-top: 3px solid #323643;
 +
            border-left: 3px solid #323643;
 +
            border-right: 3px solid #323643;
 +
        }
 +
 +
        .laoshi img {
 +
            width: 100%;
 +
            height: 50vh;
 +
            border-top: 3px solid #323643;
 +
            border-left: 3px solid #323643;
 +
            border-right: 3px solid #323643;
 +
        }
 +
 +
        .duiyuan .xingming {
 +
            width: 100%;
 +
            height: 50px;
 +
            line-height: 50px;
 +
            background-color: #323643;
 +
            border-left: 3px solid #323643;
 +
            border-right: 3px solid #323643;
 +
            font-size: 16px;
 +
            color: white;
 +
            box-shadow: 0 1px 3px #CCCCCC;
 +
            font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
 +
            font-size: 24px;
 +
            font-weight: bold;
 +
            text-align: center;
 +
        }
 +
 +
        .laoshi .xingming {
 +
            width: 100%;
 +
            height: 50px;
 +
            line-height: 50px;
 +
            background-color: #323643;
 +
            border-left: 3px solid #323643;
 +
            border-right: 3px solid #323643;
 +
            font-size: 16px;
 +
            color: white;
 +
            box-shadow: 0 1px 3px #CCCCCC;
 +
            font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
 +
            font-size: 24px;
 +
            font-weight: bold;
 +
            text-align: center;
 +
        }
 +
 +
        .duiyuan .jieshao {
 +
            width: 100%;
 +
            height: 200px;
 +
            background-color: #f6eee0;
 +
            border-bottom: 3px solid #323643;
 +
            border-left: 3px solid #323643;
 +
            border-right: 3px solid #323643;
 +
            /* border-bottom-left-radius: 5px;
 +
            border-bottom-right-radius: 5px; */
 +
        }
 +
 +
        .duiyuan .jieshao .saohua {
 +
            padding: 10px 4px 0px 4px !important;
 +
            color: black;
 +
            font-family: Arial;
 +
            font-style: italic;
 +
            font-size: 15px !important;
 +
            list-style-type: none;
 +
            text-align: justify;
 +
            line-height: 18px;
 +
        }
 +
    </style>
 +
    <!-- 滚动菜单栏CSS -->
 +
    <style>
 +
        #float01 {}
 +
   
 +
            #float02 {}
 +
 +
            #float03 {}
 +
 +
            #float04 {}
 +
 +
            #float05 {}
 +
 +
            div.floatCtro {
 +
                width: 100%;
 +
                /* height: auto; */
 +
                margin: 0;
 +
                position: relative;
 +
                background: #fff;
 +
   
 +
            }
 +
   
 +
            .daohangyi {
 +
                display: block;
 +
                width: 100%;
 +
                /* height: auto; */
 +
                /* text-align: left !important; */
 +
                color: #ffffff !important;
 +
                font-size: 16px;
 +
                padding:0;
 +
                background-color: #323643;
 +
                border-bottom: 1px solid black;
 +
                padding:0 3%;
 +
                text-decoration: none !important;
 +
            }
 +
   
 +
            div.floatCtro .daohanger {
 +
                width: 100%;
 +
                text-align: left !important;
 +
                height: auto;
 +
                line-height: 25px;
 +
                font-family: Arial;
 +
                font-size: 14px !important;
 +
                color: #676767;
 +
                margin: 0;
 +
                padding:10px 8%;
 +
                cursor: pointer;
 +
                background: #fff;
 +
            }
 +
   
 +
            div.floatCtro a {
 +
                display: inline-block;
 +
                display: none;
 +
                width: 100%;
 +
                height: 40px;
 +
                padding:10px 8%;
 +
                /* margin: 10px 0 0 0; */
 +
                background: #FFF;
 +
                color: #000 !important;
 +
                vertical-align: middle;
 +
                cursor: pointer;
 +
            }
 +
   
 +
            div.floatCtro a span {
 +
                display: block;
 +
                height: auto;
 +
                text-align: left !important;
 +
                line-height: 18px;
 +
                font-family: Arial;
 +
                font-size: 16px;
 +
            }
 +
   
 +
            div.floatCtro a:hover {
 +
                /* background: #76b39d; */
 +
                color: #EA0D04 !important;
 +
                zoom: 1;
 +
            }
 +
   
 +
            /* .cebian a:hover {
 +
                color: #f6eee0 !important;
 +
            } */
 +
   
 +
            div.floatCtro .daohanger:hover {
 +
                /* background: #76b39d; */
 +
                color: #1fa67a;
 +
                text-decoration: underline !important;
 +
            }
 +
   
 +
            div.floatCtro .daohanger.cur {
 +
                /* background: #1fa67a; */
 +
                color: #1fa67a;
 +
            }
 +
   
 +
            .biaoti {
 +
                display: inline-block;
 +
                margin: 8px 0;
 +
                /* width: 50%; */
 +
                /* margin-left: 6%; */
 +
                /* text-align: center; */
 +
                text-decoration: none !important;
 +
            }
 +
   
 +
            .daohangyi img {
 +
                display: inline-block;
 +
                width: 12px;
 +
                height: 12px;
 +
                vertical-align: middle;
 +
                background-size: 100% 100%;
 +
   
 +
            }
 +
            .cebian div:hover img{
 +
                transform: rotateY(180deg);           
 +
                -webkit-transform: rotateY(180deg);           
 +
                -moz-transform: rotateY(180deg);           
 +
                -o-transform: rotateY(180deg);           
 +
                -ms-transform: rotateY(180deg);
 +
                transition: all 0.5s ease-in-out;           
 +
                -webkit-transition: all 0.5s ease-in-out;           
 +
                -moz-transition: all 0.5s ease-in-out;           
 +
                -o-transition: all 0.5s ease-in-out;
 +
            }
 +
            .cebian a:hover img{
 +
                transform: rotate(360deg);           
 +
                -webkit-transform: rotate(360deg);           
 +
                -moz-transform: rotate(360deg);           
 +
                -o-transform: rotate(360deg);           
 +
                -ms-transform: rotate(360deg);
 +
                transition: all 0.5s ease-in-out;           
 +
                -webkit-transition: all 0.5s ease-in-out;           
 +
                -moz-transition: all 0.5s ease-in-out;           
 +
                -o-transition: all 0.5s ease-in-out;
 +
            }
 +
   
 +
            @media screen and (max-width: 1200px) {           
 +
             
 +
                .cebian {
 +
                width: 15%;
 +
                }
 +
   
 +
                .zhengwen {
 +
                margin: 20px 20px 0 0;
 +
   
 +
                .daohangyi {
 +
                    font-size: 14px;
 +
                }
 +
                .daohangyi img {
 +
                    display: none;
 +
                } 
 +
            }
 +
   
 +
            @media screen and (max-width: 900px) {
 +
   
 +
                .daohangyi img {
 +
                    display: none;
 +
                } 
 +
               
 +
                .laoshi img {
 +
                    height: 30vh;
 +
                }
 +
            }
 +
    </style>
 +
    <!-- 折叠框CSS -->
 +
    <style>
 +
        .collapseDiv {
 +
              color: #333;
 +
              border-radius: 4px;
 +
              background-color: #F3F3F3;
 +
              border: 1px solid transparent;
 +
              border-color: #ddd;
 +
              box-shadow: 0 1px 1px #F3F3F3;
 +
              margin-top: 5px;
 +
              margin-bottom: 0;
 +
            }
 +
            .collapseDiv label {
 +
              cursor: pointer;
 +
              font-size: 24px  !important;
 +
              /* font-weight: bold; */
 +
              color: green  !important;
 +
              border-color: #F3F3F3  !important;
 +
              padding: 5px 15px 5px 18px  !important;
 +
              background-color: #f5f5f5  !important;
 +
              margin: 0  !important;
 +
              border-radius: 5px  !important;
 +
            }
 +
   
 +
            #zhedie-toggle1,
 +
            #zhedie-toggle2,
 +
            #zhedie-toggle3,
 +
            #zhedie-toggle4,
 +
            #zhedie-toggle5,
 +
            #zhedie-toggle6,
 +
            #zhedie-toggle7 {
 +
                display: none;
 +
            }
 +
   
 +
            #zhedie1,
 +
            #zhedie2,
 +
            #zhedie3,
 +
            #zhedie4,
 +
            #zhedie5,
 +
            #zhedie6,
 +
            #zhedie7 {
 +
                display: none;
 +
                font-size: 18px;
 +
                padding: 0 50px 0 50px;
 +
                width: 100%;
 +
                margin: 0;
 +
                color: black;
 +
            }
 +
   
 +
            #zhedie-toggle1:checked+#zhedie1,
 +
            #zhedie-toggle2:checked+#zhedie2,
 +
            #zhedie-toggle3:checked+#zhedie3,
 +
            #zhedie-toggle4:checked+#zhedie4,
 +
            #zhedie-toggle5:checked+#zhedie5,
 +
            #zhedie-toggle6:checked+#zhedie6,
 +
            #zhedie-toggle7:checked+#zhedie7 {
 +
                display: block;
 +
            }
 +
   
 +
           
 +
   
 +
   
 +
            .collapse_body {
 +
              background-color: #fff;
 +
              position: relative;
 +
              height: 0;
 +
              overflow: hidden;
 +
              -webkit-transition-timing-function: ease;
 +
              -o-transition-timing-function: ease;
 +
              transition-timing-function: ease;
 +
              -webkit-transition-duration: .35s;
 +
              -o-transition-duration: .35s;
 +
              transition-duration: .35s;
 +
              -webkit-transition-property: height, visibility;
 +
              -o-transition-property: height, visibility;
 +
              transition-property: height, visibility
 +
            }
 +
            .collapse_content {
 +
              font-size: 20px;
 +
              border-top: 1px solid #ddd;
 +
              background-color: #fff;
 +
              padding: 15px;
 +
            }
 +
    </style>
 +
 +
 +
</head>
 +
 +
<body>
 +
    <!-- 导航栏 -->
 +
    <nav class="daohang">
 +
        <a href="https://2018.igem.org/Team:HZAU-China"><img src="https://static.igem.org/mediawiki/2018/7/75/T--HZAU-China--logo-nav.png"
 +
                class="logo-daohang"></a>
 +
        <ul class="caidan">
 +
            <li class="hiLight shortName">
 +
                <a class="nav_head" href="https://2018.igem.org/Team:HZAU-China">
 +
                    <span>Project</span>
 +
                    <span class="xsjPic"></span>
 +
                </a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Description">Description</a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Design">Design</a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Results">Results</a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Demonstrate">Demonstrate</a>
 +
            </li>
 +
            <li class="hiLight shortName">
 +
                <a class="nav_head" href="#">
 +
                    <span>Wetlab</span>
 +
                    <span class="xjtPic"></span>
 +
                </a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Experiments">Experiments</a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Improve">Improve</a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/InterLab">InterLab</a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Notebook">Notebook</a>
 +
 +
            </li>
 +
            <li class="hiLight shortName">
 +
                <a class="nav_head" href="#">
 +
                    <span>Drylab</span>
 +
                    <span class="xjtPic"></span>
 +
                </a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Model">Model</a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Software">Software</a>
 +
            </li>
 +
            <li class="hiLight longName">
 +
                <a class="nav_head" href="#">
 +
                    <span>Human&nbsp;Practices</span>
 +
                    <span class="xjtPic"></span>
 +
                </a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Safety">Safety</a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Human_Practices">Human Practices</a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Public_Engagement">Public Engagement</a>
 +
            </li>
 +
            <li class="hiLight shortName">
 +
                <a class="nav_head" href="#">
 +
                    <span>About Us</span>
 +
                    <span class="xjtPic"></span>
 +
                </a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Team">Team</a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Attributions">Attributions</a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Collaborations">Collaborations</a>
 +
            </li>
 +
            <li class="hiLight shortName">
 +
                <a class="nav_head" href="#">
 +
                    <span>Parts</span>
 +
                    <span class="xjtPic"></span>
 +
                </a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Basic_Part">Basic</a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Composite_Part">Composite</a>
 +
            </li>
 +
        </ul>
 +
        <div class="shade"></div>
 +
    </nav>
 +
    <!-- 内容 -->
 +
    <div class="neirong clearfix">
 +
        <!-- 正文 -->
 +
        <div class="zhengwen">
 +
            <div id="float01" class="cur">
 +
                <div class="h1">Chassis</div>
 +
                <div class="h2"><i>sifA</i> knock out</div>
 +
                <p>SifA maintains the integrity of <i>Salmonella</i>-containing vacuole (SCV) where <i>Salmonella</i>
 +
                    survive and
 +
                    replicate<sup>1</sup>. The existence of SCV limits the releasing of GSDMD-N275 into cytoplasm. In
 +
                    addition,
 +
                    the growth of inhibition of Δ<i>sifA</i> mutant in macrophage is remarkable<sup>2</sup>. Thus, we
 +
                    knocked out the
 +
                    <i>sifA</i> gene in order to decrease the stability of SCV and reduce the virulence of <i>Salmonella</i>.
 +
                </p>
 +
                <p>Δ<i>sifA</i> mutant was constructed by using gene editing system based on two-step allelic exchange<sup>3</sup>.</p>
 +
                <p>PCR verification indicated that the chromosomal gene <i>sifA</i> was knocked out (<b>Figure 1</b>).
 +
                    Primers named
 +
                    DSIFA F and DSIFA R were used in this PCR (<b>Figure 2</b>).</p>
 +
                <div style="width: 40%; margin: 20px auto">
 +
                    <img src="https://static.igem.org/mediawiki/2018/7/79/T--HZAU-China--results1.png" width=100% alt="">
 +
                </div>
 +
                <p><b>Figure 1.</b> PCR verification of <i>sifA</i> gene knock out. Lane 1 refers to Δ<i>sifA</i> mutant.
 +
                    Lane 2 refers
 +
                    to WT <i>Salmonella enterica</i> serovar Typhimurium strain SL1344 as a control.</p>
 +
                <div style="width: 90%; margin: 20px auto">
 +
                    <img src="https://static.igem.org/mediawiki/2018/0/07/T--HZAU-China--results2.png" width=100% alt="">
 +
                </div>
 +
                <p><b>Figure 2.</b> DSIFA F and DSIFA R are the primers in the ORF of <i>sifA</i>. This pair of primers
 +
                    can produce a 436bp product in WT.</p>
 +
 +
                <div class="h2">Safety</div>
 +
                <p><i>SifA</i> is essential for maintaining vacuolar membrane stability. Cytosolic bacterium can be generated
 +
                    by the function loss of SCV. This population of bacterium was
 +
                    easily
 +
                    recognized and cleaned up by macrophage. Hence, Δ<i>sifA</i> mutant decreases the toxicity to the
 +
                    host.
 +
                    Microscopy demonstrated that Δ<i>sifA</i> mutant was defective for replication in macrophage (<b>Figure
 +
                        3</b>).
 +
                </p>
 +
                <div style="width: 90%; margin: 0px auto">
 +
                    <img src="https://static.igem.org/mediawiki/2018/9/93/T--HZAU-China--results3.png" width=100% alt="">
 +
                </div>
 +
                <p><b>Figure 3.</b> Microscopy of immortalized bone-marrow-derived macrophages (iBMDM) infected with
 +
                    the Δ<i>sifA</i>
 +
                    mutant and WT <i>Salmonella</i> SL1344, respectively. These strains contain high copy number plasmids to
 +
                    express RFP constitutively.</p>
 +
                <div class="collapseDiv">
 +
                    <label for="zhedie-toggle1">Method</label>
 +
                    <input type="checkbox" id="zhedie-toggle1" />
 +
                    <div id="zhedie1" class="text-success text-left">
 +
                        <b>Preparation of Cells for Infection</b>
 +
<br>
 +
                        1. Grow iBMDMs in a humidified 37 °C, 5% CO<sub>2</sub> tissue-culture incubator.<br>
 +
                        2. Count the cells using a hemocytometer. Seed in 24-well (5×10^4 per well) and grow
 +
                        overnight .<br>
 +
                        <b>Preparation of the Bacterial Cells</b>
 +
<br>
 +
                        1. Grow bacterial cells overnight 16 h in 2 mL LB in a 15-mL tube. Incubate at 37 °C in a shaking
 +
                        incubator (200 rpm).<br>
 +
                        2. Subculture bacterial cells by transferring 300 μL of the overnight culture into 5 mL of LB in a
 +
                        loosely capped 50-mL tube. Incubate at 37 °C in a shaking incubator (200 rpm) to late log
 +
                        phase.<br>
 +
                        3. Pellet 1 mL of the <i>Salmonella</i> bacteria cells subculture by centrifugation at 1,000×g in a microfuge
 +
                        for 2
 +
                        min at room temperature.<br>
 +
                        4. Remove 900 μL of supernatant and gently resuspend the pellet in 900 μL PBS.<br>
 +
                        <b>Infection</b>
 +
<br>
 +
                        1. Aspirate media and rinse the monolayer twice with PBS.<br>
 +
                        2. Inoculate cells with bacterial cells (MOI = 20) by adding bacterial cells directly to the cell-culture
 +
                        supernatant. Centrifugate at 110 g for 5 min at room temperature.<br>
 +
                        3. Incubate for 25 min at 37 °C in 5% CO<sub>2</sub>.<br>
 +
                        4. Aspirate media and rinse the monolayer twice with PBS, to remove extracellular bacterial cells.<br>
 +
                        5. Add fresh GM containing 100 μg/mL gentamicin and incubate for 2 h at 37 °C in 5% CO<sub>2</sub>.<br>
 +
                        6. Replace GM with fresh GM containing 20 μg/mL gentamicin for remainder of experiment.<br>
 +
                        Observation is taken after 11 h.<br><br>
 +
 +
                    </div>
 +
                </div>
 +
            </div>
 +
            <div id="float02">
 +
                <div class="h1">Targeting</div>
 +
                <p>RGD motif can specifically bind to alpha V beta 3 (αvβ3), a well-known biomarker on the surface of
 +
                    tumor cells. We express RGD motif fused with OmpA to surface display it on the outer membrane of
 +
                    bacterial cells. Microscopy shows that bacterial cells expressed Lpp-OmpA-RGD induced by 0.1 mM IPTG can bind to
 +
                    αvβ3-positive MDA-MB-231 cell line (<b>Figure 4</b>), but cannot bind to αvβ3-negative MCF7 cell line (<b>Figure 5</b>). These results demonstrated that the bacterium gain the function of tumor targeting though display RGD motif. </p>
 +
                <div style="width: 90%; margin: 0px auto">
 +
                    <img src="https://static.igem.org/mediawiki/2018/b/b1/T--HZAU-China--Improve2.png" width=100% alt="">
 +
                </div>
 +
                <p><b>Figure 4.</b> Microscopy of αvβ3-positive MDA-MB-231 cell line were incubated with <i>E. coli</i>
 +
                    which
 +
                    constructively expressed RFP and inductively expressed RGD motif under the control of <i>lac</i> promoter. The locations of bacteria cells are pointed by red arrow. </p>
 +
                <div style="width: 90%; margin: 0px auto">
 +
                    <img src="https://static.igem.org/mediawiki/2018/c/cf/T--HZAU-China--Improve3.png" width=100% alt="">
 +
                </div>
 +
                <p><b>Figure 5.</b> Microscopy of αvβ3-negative MCF7 cell line were incubated with <i>E. coli</i> which
 +
                    constructively
 +
                    expressed RFP and inductively expressed RGD motif under the control of <i>lac</i> promoter.</p>
 +
                <div class="collapseDiv">
 +
                    <label for="zhedie-toggle2">Method</label>
 +
                    <input type="checkbox" id="zhedie-toggle2" />
 +
                    <div id="zhedie2" class="text-success text-left">
 +
                        <b>Preparation of Cells</b><br>
 +
                        1. Grow MDA-MB-231 and MCF7 in a humidified 37 °C, 5% CO<sub>2</sub> tissue-culture incubator.<br>
 +
                        2. Count the cells using a hemocytometer. Seed in 24-well (1.5× 10^5 per well) and grow
 +
                        overnight.<br>
 +
                        <b>Preparation of Bacterial cells</b><br>
 +
                        1. Grow bacterial cells overnight 14 h in 2 mL LB in a 15-mL tube. Incubate at 37 °C in a shaking
 +
                        incubator (200 rpm).<br>
 +
                        2. Subculture bacterial cells by transferring 300 μL of the overnight culture into 5 mL of LB
 +
                        containing 0.1 mM IPTG in a loosely capped 50-mL tube. Incubate at 37 °C in a shaking incubator
 +
                        (200 rpm) to early stationary phase.<br>
 +
                        3. Pellet 1 mL of the bacterial cells subculture by centrifugation at 1000 g in a microfuge for 2 min
 +
                        at room temperature.<br>
 +
                        4. Remove 900 μL of supernatant and gently resuspend the pellet in 900 μL PBS.<br>
 +
                        <b>Infection</b>
 +
                        1. Aspirate media and rinse the monolayer twice with PBS.<br>
 +
                        2. Inoculate cells with bacterial cells (MOI = 100) by adding bacterial cells directly to the cell-culture
 +
                        supernatant.<br>
 +
                        3. Incubate for 1.5 h at 37 °C in 5% CO<sub>2</sub>.<br>
 +
                        4. Aspirate media and rinse the monolayer three times with PBS.<br>
 +
                        Observation is taken immediately.<br><br>
 +
                    </div>
 +
                </div>
 +
            </div>
 +
            <div id="float03">
 +
                <div class="h1">Function of GSDMD</div>
 +
                <div class="h2">The N-terminal of GSDMD performs the function of cell pyroptosis</div>
 +
                <p>We fused eGFP with GSDMD-N275 (N-terminal 275 amino acids) and GSDMD FL (full length), respectively. Then the corresponding
 +
                    plasmids were transfected into Hela GSDMD knockout (KO) cell. Cell microscopy showed that the cells
 +
                    transfected with GSDMD-N275 underwent pyroptosis while the cells with GSDMD FL did not (<b>Figure 6</b>).
 +
                    We also tested the cell viability through an ATP assay (CellTiter-Glo<sup>®</sup> Luminescent Cell Viability
 +
                    Assay) and demonstrated that GSDMD-N275 and mutants of GSDMD FL have different abilities to induce
 +
                    pyroptosis (<b>Figure 7</b>).</p>
 +
                <div style="width: 100%; margin: 30px auto">
 +
                    <img src="https://static.igem.org/mediawiki/2018/d/d7/T--HZAU-China--basicPart1.png.png" width="100%" alt="">
 +
                </div>
 +
                <p><b>Figure 6.</b> Microscopy of the Hela GSDMD KO cells transfected with pCS2-eGFP-GSDMD FL (above) and
 +
                    pCS2-eGFP-GSDMD-N275 (below), respectively. Pyroptotic cells are pointed by red arrow.</p>
 +
                <div class="collapseDiv">
 +
                    <label for="zhedie-toggle3">Method</label>
 +
                    <input type="checkbox" id="zhedie-toggle3" />
 +
                    <div id="zhedie3" class="text-success text-left">
 +
                        <b>Preparation of Cells for transfection</b><br>
 +
                        1. Grow Hela GSDMD KO cells in a humidified 37 °C, 5% CO<sub>2</sub> tissue-culture incubator.<br>
 +
                        2. Count the cells using a hemocytometer. Seed in 24-well (5 × 10^4 per well) and grow.<br>
 +
                        <b>Transfection</b> <br>
 +
                        1. Dilute 0.5 μg DNA into 50 μl jetPRIME<sup>®</sup> buffer (supplied). Mix by vortexing.<br>
 +
                        2. Add 1 μl jetPRIME<sup>®</sup>, vortex for 10 s, spin down briefly.<br>
 +
                        3. Incubate for 10 min at RT.<br>
 +
                        4. Add 50μl of transfection mix per well drop wise onto the cells in serum containing medium,
 +
                        and distribute evenly.<br>
 +
                        5. Gently rock the plates back and forth and from side to side.<br>
 +
                        6. If needed, replace transfection medium after 4 h by cell growth medium and return the plates
 +
                        to the incubator.<br>
 +
                        Observation is taken after 1.5 h.<br><br>
 +
                    </div>
 +
                </div>
 +
                <div style="width: 50%; margin: 20px auto">
 +
                    <img src="https://static.igem.org/mediawiki/2018/f/f5/T--HZAU-China--basicPart2.png" width=100% alt="">
 +
                </div>
 +
                <p><b>Figure 7.</b> Cell viability of the 293T cells transfected with pCS2-Flag-GSDMD FL,
 +
                    pCS2-Flag-GSDMD-N275, pCS2-Flag-GSDMD L290D, pCS2-Flag-GSDMD Y373D, pCS2-Flag-GSDMD A377D,
 +
                    respectively. Asterisks indicate the statistically significant differences. ATP-based cell
 +
                    viability was measured (n=6). </p>
 +
                <div class="collapseDiv">
 +
                    <label for="zhedie-toggle4">Method</label>
 +
                    <input type="checkbox" id="zhedie-toggle4" />
 +
                    <div id="zhedie4" class="text-success text-left">
 +
                        <b>Preparation of Cells for ATP assay</b><br>
 +
                        1. Grow HEK293T cells in a humidified 37 °C, 5% CO<sub>2</sub> tissue-culture incubator.<br>
 +
                        2. Count the cells using a hemocytometer. Seed in 96-well (1 × 10^4 per well) and grow
 +
                        overnight.<br>
 +
                        3. Transfect 0.5 μg DNA per well.<br>
 +
                        4. Equilibrate the plate and its contents at room temperature for approximately 30 minutes
 +
                        after 20 h.<br>
 +
                        5. Add a volume of CellTiter-Glo<sup>®</sup> Reagent equal to the volume of cell culture medium present in
 +
                        each well. (add 100 μl of reagent to 100 μl of medium containing cells for a 96-well plate).<br>
 +
                        6. Mix contents for 2 minutes on an orbital shaker to induce cell lysis.<br>
 +
                        7. Allow the plate to incubate at room temperature for 10 minutes to stabilize luminescent
 +
                        signal.<br>
 +
                        8. Record luminescence.<br><br>
 +
                    </div>
 +
                </div>
 +
            </div>
 +
            <div id="float04">
 +
                <div class="h1">Induce the expression of GSDMD-N275</div>
 +
                <div class="h2">Intracellular environment-dependent expression</div>
 +
                <p>P<sub>sifA</sub> is a intracellular environment-dependent promoter. SipD is required for bacterial
 +
                    internalization.
 +
                    Δ<i>sipD</i> mutant cannot enter host cells. Thus, we use this strain as a control. Microscopy
 +
                    suggested
 +
                    that only intracellular bacteria express eGFP which is under the control of P<sub>sifA</sub> (<b>Figure
 +
                        8</b>). </p>
 +
                <div style="width: 90%; margin: 0px auto">
 +
                    <img src="https://static.igem.org/mediawiki/2018/0/0b/T--HZAU-China--results8.png" width=100% alt="">
 +
                </div>
 +
                <p><b>Figure 8.</b> Microscopy of hela GSDMD KO cells infected with the Δ<i>sipD</i> or Δ<i>sifA</i>
 +
                    mutant, respectively.
 +
                    These mutants contain low copy number plasmids to express eGFP which was regulated by P<sub>sifA</sub>.</p>
 +
                <div class="collapseDiv">
 +
                    <label for="zhedie-toggle5">Method</label>
 +
                    <input type="checkbox" id="zhedie-toggle5" />
 +
                    <div id="zhedie5" class="text-success text-left">
 +
                        <b>Preparation of Cells for Infection</b><br>
 +
                        1. Grow Hela GSDMD KO cells in a humidified 37 °C, 5% CO<sub>2</sub> tissue-culture incubator.<br>
 +
                        2. Count the cells using a hemocytometer. Seed in 24-well (9× 10^4 per well) and grow
 +
                        overnight.<br>
 +
                        <b>Preparation of Bacterial Cells</b> <br>
 +
                        1. Grow bacterial cells overnight 16 h in 2 mL LB in a 15-mL tube. Incubate at 37 °C in a shaking
 +
                        incubator (200 rpm).<br>
 +
                        2. Subculture bacterial cells by transferring 300 μL of the overnight culture into 5 mL of LB in a
 +
                        loosely capped 50-mL tube. Incubate at 37 °C in a shaking incubator (200 rpm) to late log
 +
                        phase.<br>
 +
                        3. Pellet 1 mL of the <i>Salmonella</i> subculture by centrifugation at 1000 g in a microfuge
 +
                        for 2
 +
                        min at room temperature.<br>
 +
                        4. Remove 900 μL of supernatant and gently resuspend the pellet in 900 μL PBS.<br>
 +
                        <b>Infection</b> <br>
 +
                        1. Aspirate media and rinse the monolayer twice with PBS.<br>
 +
                        2. Inoculate cells with bacterial cells (MOI = 100) by adding bacterial cells directly to the cell-culture
 +
                        supernatant.<br>
 +
                        3. Incubate for 3 h at 37 °C in 5% CO<sub>2</sub>.<br>
 +
                        4. Aspirate media and rinse the monolayer twice with PBS.<br>
 +
                        5. Add fresh GM containing 100 μg/mL gentamicin and incubate at 37 °C in 5% CO<sub>2</sub>.
 +
                        Observation is taken after 2 h.<br><br>
 +
                    </div>
 +
                </div>
 +
                <div class="h2">ATc-dependent expression</div>
 +
                <div class="h3">GSDMD-N275 can lyse bacteria</div>
 +
                <p>Expression of the N-terminal of GSDMD fused with eGFP (eGFP-GSDMD-N275) in <i>Salmonella enterica</i>
 +
                    serovar Typhimurium str. SL1344 Δ<i>sifA</i> is under the control of P<sub>tet</sub>. The
 +
                    colony-forming unit (CFU)
 +
                    was measured for counting the number of viable bacterial cells (<b>Figure 9</b>). This result shows that
 +
                    eGFP-GSDMD-N275 exhibits cytotoxicity in bacteria.</p>
 +
                <div style="width: 40%; margin: 0px auto">
 +
                    <img src="https://static.igem.org/mediawiki/2018/f/fb/T--HZAU-China--basicPart3.jpg" width=100% alt="">
 +
                </div>
 +
                <p><b>Figure 9.</b> CFU comparison between the SL1344 Δ<i>sifA</i> cells with eGFP-GSDMD-N275 plasmid
 +
                    and with the
 +
                    empty vector. In each group, ATc (15μg/ml) was added into medium when bacterium grew to logarithmic
 +
                    phase (OD = 0.6~0.8). Vector refers to bacterium containing a high copy number plasmid which only
 +
                    expresses TetR under the control of P<sub>tet</sub>. CFU for vector
 +
                    and eGFP-GSDMD-N275 are shown in the logarithmic form (log10) (n=3).</p>
 +
                <div class="collapseDiv">
 +
                    <label for="zhedie-toggle6">Method</label>
 +
                    <input type="checkbox" id="zhedie-toggle6" />
 +
                    <div id="zhedie6" class="text-success text-left">
 +
                        1. Bacteria are cultured overnight in LB broth containing corresponding antibiotics, and
 +
                        dilute each 1 volume overnight cultures with 100 volume fresh LB containing antibiotics.
 +
                        Culture in 37℃ 200 rpm.<br>
 +
                        2. When OD reaching to 0.6-0.8, add anhydrotetracycline with final concentration of
 +
                        μg/ml to induce the expression of EGFP-GSDMD-N275.<br>
 +
                        3. Take 100 μl diluted culture to plate on LB agar plates containing appropriate concentration
 +
                        of antibody after 1.5 hours of induce.<br>
 +
                        Observation is taken overnight.<br><br>
 +
                    </div>
 +
                </div>
 +
 +
                <div class="h3">GSDMD-N275 from lytic bacteria induces host cell pyroptosis</div>
 +
                <p>Expression of the N-terminal of GSDMD fused with eGFP (eGFP-GSDMD-N275) is under the control of tet
 +
                    promoter in Δ<i>sifA</i> SL1344. Hela GSDMD KO cells were infected with Δ<i>sifA</i> SL1344.
 +
                    Inducer ATc
 +
                    (16μg/mL) were added 3h after infection. Microscopy shows that eGFP-GSDMD-N275 located in cytoplasm
 +
                    after 5 min of induction and triggered pyroptosis after 30 min of induction (<b>Figure 10</b>). After
 +
                    1.5 h
 +
                    of induction, Hela GSDMD KO cells underwent second necrosis caused by bacterial infection without
 +
                    inducer. Morphology of this process is similar to pyroptosis<sup>4</sup>. Thus, the population of
 +
                    ruptured
 +
                    cells was counted. There is 1.96 fold change between control group and induced group (<b>Figure 11</b>).
 +
                    So
 +
                    the pyroptosis of host cell in the induced group was triggered by eGFP-GSDMD-N275 not by bacterial
 +
                    infection.</p>
 +
                <p>In these experiments, the choice of MOI (multiplicity of infection) and infection time were directed by <a href="https://2018.igem.org/Team:HZAU-China/Model">Modeling</a>.</p>
 +
                <div style="width: 90%; margin: 0px auto">
 +
                    <img src="https://static.igem.org/mediawiki/2018/b/b3/T--HZAU-China--basicPart4.png" width=100% alt="">
 +
                </div>
 +
                <p><b>Figure 10.</b> Hela GSDMD KO cells were infected with Δ<i>sifA</i> SL1344 containing high copy
 +
                    number plasmids
 +
                    which express eGFP-GSDMD-N275 under the control of ATc. Photographs were captured 5 min, 30 min, 90 min
 +
                    after induction, respectively.</p>
 +
                <div style="width: 40%; margin: 0px auto">
 +
                    <img src="https://static.igem.org/mediawiki/2018/2/22/T--HZAU-China--basicPart5.png" width=100% alt="">
 +
                </div>
 +
                <p><b>Figure 11.</b>  Ruptured cells in a
 +
                    field of
 +
                    view were counted. </p>
 +
                <div class="collapseDiv">
 +
                    <label for="zhedie-toggle7">Method</label>
 +
                    <input type="checkbox" id="zhedie-toggle7" />
 +
                    <div id="zhedie7" class="text-success text-left">
 +
                        <b>Preparation of Cells for Infection</b><br>
 +
                        1. Grow Hela GSDMD KO cells in a humidified 37 °C, 5% CO<sub>2</sub> tissue-culture incubator.<br>
 +
                        2. Count the cells using a hemocytometer. Seed in 24-well (5 × 10^4 per well) and grow
 +
                        overnight.<br>
 +
                        <b>Preparation of Bacteria</b> <br>
 +
                        1. Grow bacteria overnight 16 h in 2 mL LB in a 15-mL tube. Incubate at 37 °C in a shaking
 +
                        incubator (200 rpm).<br>
 +
                        2. Subculture bacteria by transferring 300 μL of the overnight culture into 5 mL of LB in a
 +
                        loosely capped 50-mL tube. Incubate at 37 °C in a shaking incubator (200 rpm) to late log
 +
                        phase.<br>
 +
                        3. Pellet 1 mL of the <i>Salmonella</i> subculture by centrifugation at 1,000×g in a microfuge
 +
                        for 2
 +
                        min at room temperature.<br>
 +
                        4. Remove 900 μL of supernatant and gently resuspend the pellet in 900 μL PBS.<br>
 +
                        <b>Infection</b><br>
 +
                        1. Aspirate media and rinse the monolayer twice with PBS.<br>
 +
                        2. Inoculate cells with bacteria (MOI = 100) by adding bacteria directly to the cell-culture
 +
                        supernatant.<br>
 +
                        3. Incubate for 2 h at 37 °C in 5% CO<sub>2</sub>.<br>
 +
                        4. Aspirate media and wash.<br>
 +
                        5. Add fresh GM containing 100 μg/mL gentamicin and 16 μg/mL incubate at 37 °C in 5% CO<sub>2</sub>.<br>
 +
                        Observation is taken after 5 min, 30 min, 90min.<br><br>
 +
                    </div>
 +
                </div>
 +
            </div>
 +
            <div id="float05">
 +
                <div class="h1">Reference</div>
 +
                <p>1. Dumont, A. et al. SKIP, the host target of the <i>Salmonella</i> virulence factor SifA, promotes
 +
                    kinesin-1-dependent vacuolar membrane exchanges. Traffic 11, 899-911,
 +
                    doi:10.1111/j.1600-0854.2010.01069.x (2010).
 +
                </p>
 +
                <p>2. Thurston, T. L. et al. Growth inhibition of cytosolic <i>Salmonella</i> by caspase-1 and
 +
                    caspase-11
 +
                    precedes host cell death. Nature communications 7, 13292, doi:10.1038/ncomms13292 (2016).</p>
 +
                <p>3. Hmelo, L. R. et al. Precision-engineering the Pseudomonas aeruginosa genome with two-step allelic
 +
                    exchange. Nat Protoc 10, 1820-1841, doi:10.1038/nprot.2015.115 (2015).</p>
 +
                <p>4. He, W. T. et al. Gasdermin D is an executor of pyroptosis and required for interleukin-1beta
 +
                    secretion. Cell research 25, 1285-1298, doi:10.1038/cr.2015.139 (2015).</p>
 +
            </div>
 +
        </div>
 +
        <!-- 侧边 -->
 +
        <div class="cebian">
 +
            <!-- 滚动菜单栏 -->
 +
            <a class="daohangyi" href="https://2018.igem.org/Team:HZAU-China/Description">
 +
                <span class="biaoti">Description</span>
 +
                <span class="xsjPic"><img src="https://static.igem.org/mediawiki/2018/7/7c/T--HZAU-China--ysj.svg" alt=""></span>
 +
            </a>
 +
            <a class="daohangyi" href="https://2018.igem.org/Team:HZAU-China/Design">
 +
                <span class="biaoti">Design</span>
 +
                <span class="xsjPic"><img src="https://static.igem.org/mediawiki/2018/7/7c/T--HZAU-China--ysj.svg" alt=""></span>
 +
            </a>
 +
            <div class="daohangyi">
 +
                <span class="biaoti">Results</span>
 +
                <span class="xsjPic"><img src="https://static.igem.org/mediawiki/2018/8/8d/T--HZAU-China--xjt.svg" alt=""></span>
 +
            </div>
 +
            <div class="floatCtro">
 +
                <p class="daohanger">Chassis</p>
 +
                <p class="daohanger">Targeting</p>
 +
                <p class="daohanger">Function of GSDMD</p>
 +
                <p class="daohanger">Induce the expression of GSDMD-N275</p>
 +
                <p class="daohanger">Reference</p>
 +
                <a>
 +
                    <span>Back&nbsp;to&nbsp;Top</span>
 +
                </a>
 +
            </div>
 +
            <a class="daohangyi" href="https://2018.igem.org/Team:HZAU-China/Demonstrate">
 +
                <span class="biaoti">Demonstrate</span>
 +
                <span class="xsjPic"><img src="https://static.igem.org/mediawiki/2018/7/7c/T--HZAU-China--ysj.svg" alt=""></span>
 +
            </a>
 +
            <!-- 滚动菜单栏 -->
 +
        </div>
 +
    </div>
 +
 +
    <!-- 滚动菜单栏jQuery -->
 +
    <script src="jquery.js" type="text/javascript"></script>
 +
    <script>
 +
        $(function () {
 +
            var AllHet = $(window).height();
 +
            var mainHet = $('.floatCtro').height();
 +
            var fixedTop = (AllHet - mainHet) / 2
 +
            //  $('div.floatCtro').css({top:fixedTop+'px'});
 +
            $('div.floatCtro p').click(function () {
 +
                var ind = $('div.floatCtro p').index(this) + 1;
 +
                var topVal = $('#float0' + ind).offset().top;
 +
                $('body,html').animate({ scrollTop: topVal }, 1000)
 +
            })
 +
            $('div.floatCtro a').click(function () {
 +
                $('body,html').animate({ scrollTop: 0 }, 1000)
 +
            })
 +
            $(window).scroll(scrolls)
 +
            scrolls()
 +
            function scrolls() {
 +
                var f1, f2, f3, f4, f5, bck;
 +
                var fixRight = $('div.floatCtro p');
 +
                var blackTop = $('div.floatCtro a')
 +
                var sTop = $(window).scrollTop();
 +
                fl = $('#float01').offset().top;
 +
                f2 = $('#float02').offset().top;
 +
                f3 = $('#float03').offset().top;
 +
                f4 = $('#float04').offset().top;
 +
                f5 = $('#float05').offset().top;
 +
 +
                if (sTop <= f2 - 100) {
 +
                    blackTop.fadeOut(300).css('display', 'none')
 +
                }
 +
                else {
 +
                    blackTop.fadeIn(300).css('display', 'block')
 +
                }
 +
 +
                if (sTop >= fl) {
 +
                    fixRight.eq(0).addClass('cur').siblings().removeClass('cur');
 +
                }
 +
                if (sTop >= f2 - 100) {
 +
                    fixRight.eq(1).addClass('cur').siblings().removeClass('cur');
 +
                }
 +
                if (sTop >= f3 - 100) {
 +
                    fixRight.eq(2).addClass('cur').siblings().removeClass('cur');
 +
                }
 +
                if (sTop >= f4 - 100) {
 +
                    fixRight.eq(3).addClass('cur').siblings().removeClass('cur');
 +
                }
 +
                if (sTop >= f5 - 100) {
 +
                    fixRight.eq(4).addClass('cur').siblings().removeClass('cur');
 +
                }
 +
 +
            }
 +
        })
 +
    </script>
 +
    <!-- 滚动菜单栏jQuery -->
 +
 +
</body>
  
 
</html>
 
</html>

Latest revision as of 02:35, 18 October 2018

Chassis
sifA knock out

SifA maintains the integrity of Salmonella-containing vacuole (SCV) where Salmonella survive and replicate1. The existence of SCV limits the releasing of GSDMD-N275 into cytoplasm. In addition, the growth of inhibition of ΔsifA mutant in macrophage is remarkable2. Thus, we knocked out the sifA gene in order to decrease the stability of SCV and reduce the virulence of Salmonella.

ΔsifA mutant was constructed by using gene editing system based on two-step allelic exchange3.

PCR verification indicated that the chromosomal gene sifA was knocked out (Figure 1). Primers named DSIFA F and DSIFA R were used in this PCR (Figure 2).

Figure 1. PCR verification of sifA gene knock out. Lane 1 refers to ΔsifA mutant. Lane 2 refers to WT Salmonella enterica serovar Typhimurium strain SL1344 as a control.

Figure 2. DSIFA F and DSIFA R are the primers in the ORF of sifA. This pair of primers can produce a 436bp product in WT.

Safety

SifA is essential for maintaining vacuolar membrane stability. Cytosolic bacterium can be generated by the function loss of SCV. This population of bacterium was easily recognized and cleaned up by macrophage. Hence, ΔsifA mutant decreases the toxicity to the host. Microscopy demonstrated that ΔsifA mutant was defective for replication in macrophage (Figure 3).

Figure 3. Microscopy of immortalized bone-marrow-derived macrophages (iBMDM) infected with the ΔsifA mutant and WT Salmonella SL1344, respectively. These strains contain high copy number plasmids to express RFP constitutively.

Preparation of Cells for Infection
1. Grow iBMDMs in a humidified 37 °C, 5% CO2 tissue-culture incubator.
2. Count the cells using a hemocytometer. Seed in 24-well (5×10^4 per well) and grow overnight .
Preparation of the Bacterial Cells
1. Grow bacterial cells overnight 16 h in 2 mL LB in a 15-mL tube. Incubate at 37 °C in a shaking incubator (200 rpm).
2. Subculture bacterial cells by transferring 300 μL of the overnight culture into 5 mL of LB in a loosely capped 50-mL tube. Incubate at 37 °C in a shaking incubator (200 rpm) to late log phase.
3. Pellet 1 mL of the Salmonella bacteria cells subculture by centrifugation at 1,000×g in a microfuge for 2 min at room temperature.
4. Remove 900 μL of supernatant and gently resuspend the pellet in 900 μL PBS.
Infection
1. Aspirate media and rinse the monolayer twice with PBS.
2. Inoculate cells with bacterial cells (MOI = 20) by adding bacterial cells directly to the cell-culture supernatant. Centrifugate at 110 g for 5 min at room temperature.
3. Incubate for 25 min at 37 °C in 5% CO2.
4. Aspirate media and rinse the monolayer twice with PBS, to remove extracellular bacterial cells.
5. Add fresh GM containing 100 μg/mL gentamicin and incubate for 2 h at 37 °C in 5% CO2.
6. Replace GM with fresh GM containing 20 μg/mL gentamicin for remainder of experiment.
Observation is taken after 11 h.

Targeting

RGD motif can specifically bind to alpha V beta 3 (αvβ3), a well-known biomarker on the surface of tumor cells. We express RGD motif fused with OmpA to surface display it on the outer membrane of bacterial cells. Microscopy shows that bacterial cells expressed Lpp-OmpA-RGD induced by 0.1 mM IPTG can bind to αvβ3-positive MDA-MB-231 cell line (Figure 4), but cannot bind to αvβ3-negative MCF7 cell line (Figure 5). These results demonstrated that the bacterium gain the function of tumor targeting though display RGD motif.

Figure 4. Microscopy of αvβ3-positive MDA-MB-231 cell line were incubated with E. coli which constructively expressed RFP and inductively expressed RGD motif under the control of lac promoter. The locations of bacteria cells are pointed by red arrow.

Figure 5. Microscopy of αvβ3-negative MCF7 cell line were incubated with E. coli which constructively expressed RFP and inductively expressed RGD motif under the control of lac promoter.

Preparation of Cells
1. Grow MDA-MB-231 and MCF7 in a humidified 37 °C, 5% CO2 tissue-culture incubator.
2. Count the cells using a hemocytometer. Seed in 24-well (1.5× 10^5 per well) and grow overnight.
Preparation of Bacterial cells
1. Grow bacterial cells overnight 14 h in 2 mL LB in a 15-mL tube. Incubate at 37 °C in a shaking incubator (200 rpm).
2. Subculture bacterial cells by transferring 300 μL of the overnight culture into 5 mL of LB containing 0.1 mM IPTG in a loosely capped 50-mL tube. Incubate at 37 °C in a shaking incubator (200 rpm) to early stationary phase.
3. Pellet 1 mL of the bacterial cells subculture by centrifugation at 1000 g in a microfuge for 2 min at room temperature.
4. Remove 900 μL of supernatant and gently resuspend the pellet in 900 μL PBS.
Infection 1. Aspirate media and rinse the monolayer twice with PBS.
2. Inoculate cells with bacterial cells (MOI = 100) by adding bacterial cells directly to the cell-culture supernatant.
3. Incubate for 1.5 h at 37 °C in 5% CO2.
4. Aspirate media and rinse the monolayer three times with PBS.
Observation is taken immediately.

Function of GSDMD
The N-terminal of GSDMD performs the function of cell pyroptosis

We fused eGFP with GSDMD-N275 (N-terminal 275 amino acids) and GSDMD FL (full length), respectively. Then the corresponding plasmids were transfected into Hela GSDMD knockout (KO) cell. Cell microscopy showed that the cells transfected with GSDMD-N275 underwent pyroptosis while the cells with GSDMD FL did not (Figure 6). We also tested the cell viability through an ATP assay (CellTiter-Glo® Luminescent Cell Viability Assay) and demonstrated that GSDMD-N275 and mutants of GSDMD FL have different abilities to induce pyroptosis (Figure 7).

Figure 6. Microscopy of the Hela GSDMD KO cells transfected with pCS2-eGFP-GSDMD FL (above) and pCS2-eGFP-GSDMD-N275 (below), respectively. Pyroptotic cells are pointed by red arrow.

Preparation of Cells for transfection
1. Grow Hela GSDMD KO cells in a humidified 37 °C, 5% CO2 tissue-culture incubator.
2. Count the cells using a hemocytometer. Seed in 24-well (5 × 10^4 per well) and grow.
Transfection
1. Dilute 0.5 μg DNA into 50 μl jetPRIME® buffer (supplied). Mix by vortexing.
2. Add 1 μl jetPRIME®, vortex for 10 s, spin down briefly.
3. Incubate for 10 min at RT.
4. Add 50μl of transfection mix per well drop wise onto the cells in serum containing medium, and distribute evenly.
5. Gently rock the plates back and forth and from side to side.
6. If needed, replace transfection medium after 4 h by cell growth medium and return the plates to the incubator.
Observation is taken after 1.5 h.

Figure 7. Cell viability of the 293T cells transfected with pCS2-Flag-GSDMD FL, pCS2-Flag-GSDMD-N275, pCS2-Flag-GSDMD L290D, pCS2-Flag-GSDMD Y373D, pCS2-Flag-GSDMD A377D, respectively. Asterisks indicate the statistically significant differences. ATP-based cell viability was measured (n=6).

Preparation of Cells for ATP assay
1. Grow HEK293T cells in a humidified 37 °C, 5% CO2 tissue-culture incubator.
2. Count the cells using a hemocytometer. Seed in 96-well (1 × 10^4 per well) and grow overnight.
3. Transfect 0.5 μg DNA per well.
4. Equilibrate the plate and its contents at room temperature for approximately 30 minutes after 20 h.
5. Add a volume of CellTiter-Glo® Reagent equal to the volume of cell culture medium present in each well. (add 100 μl of reagent to 100 μl of medium containing cells for a 96-well plate).
6. Mix contents for 2 minutes on an orbital shaker to induce cell lysis.
7. Allow the plate to incubate at room temperature for 10 minutes to stabilize luminescent signal.
8. Record luminescence.

Induce the expression of GSDMD-N275
Intracellular environment-dependent expression

PsifA is a intracellular environment-dependent promoter. SipD is required for bacterial internalization. ΔsipD mutant cannot enter host cells. Thus, we use this strain as a control. Microscopy suggested that only intracellular bacteria express eGFP which is under the control of PsifA (Figure 8).

Figure 8. Microscopy of hela GSDMD KO cells infected with the ΔsipD or ΔsifA mutant, respectively. These mutants contain low copy number plasmids to express eGFP which was regulated by PsifA.

Preparation of Cells for Infection
1. Grow Hela GSDMD KO cells in a humidified 37 °C, 5% CO2 tissue-culture incubator.
2. Count the cells using a hemocytometer. Seed in 24-well (9× 10^4 per well) and grow overnight.
Preparation of Bacterial Cells
1. Grow bacterial cells overnight 16 h in 2 mL LB in a 15-mL tube. Incubate at 37 °C in a shaking incubator (200 rpm).
2. Subculture bacterial cells by transferring 300 μL of the overnight culture into 5 mL of LB in a loosely capped 50-mL tube. Incubate at 37 °C in a shaking incubator (200 rpm) to late log phase.
3. Pellet 1 mL of the Salmonella subculture by centrifugation at 1000 g in a microfuge for 2 min at room temperature.
4. Remove 900 μL of supernatant and gently resuspend the pellet in 900 μL PBS.
Infection
1. Aspirate media and rinse the monolayer twice with PBS.
2. Inoculate cells with bacterial cells (MOI = 100) by adding bacterial cells directly to the cell-culture supernatant.
3. Incubate for 3 h at 37 °C in 5% CO2.
4. Aspirate media and rinse the monolayer twice with PBS.
5. Add fresh GM containing 100 μg/mL gentamicin and incubate at 37 °C in 5% CO2. Observation is taken after 2 h.

ATc-dependent expression
GSDMD-N275 can lyse bacteria

Expression of the N-terminal of GSDMD fused with eGFP (eGFP-GSDMD-N275) in Salmonella enterica serovar Typhimurium str. SL1344 ΔsifA is under the control of Ptet. The colony-forming unit (CFU) was measured for counting the number of viable bacterial cells (Figure 9). This result shows that eGFP-GSDMD-N275 exhibits cytotoxicity in bacteria.

Figure 9. CFU comparison between the SL1344 ΔsifA cells with eGFP-GSDMD-N275 plasmid and with the empty vector. In each group, ATc (15μg/ml) was added into medium when bacterium grew to logarithmic phase (OD = 0.6~0.8). Vector refers to bacterium containing a high copy number plasmid which only expresses TetR under the control of Ptet. CFU for vector and eGFP-GSDMD-N275 are shown in the logarithmic form (log10) (n=3).

1. Bacteria are cultured overnight in LB broth containing corresponding antibiotics, and dilute each 1 volume overnight cultures with 100 volume fresh LB containing antibiotics. Culture in 37℃ 200 rpm.
2. When OD reaching to 0.6-0.8, add anhydrotetracycline with final concentration of μg/ml to induce the expression of EGFP-GSDMD-N275.
3. Take 100 μl diluted culture to plate on LB agar plates containing appropriate concentration of antibody after 1.5 hours of induce.
Observation is taken overnight.

GSDMD-N275 from lytic bacteria induces host cell pyroptosis

Expression of the N-terminal of GSDMD fused with eGFP (eGFP-GSDMD-N275) is under the control of tet promoter in ΔsifA SL1344. Hela GSDMD KO cells were infected with ΔsifA SL1344. Inducer ATc (16μg/mL) were added 3h after infection. Microscopy shows that eGFP-GSDMD-N275 located in cytoplasm after 5 min of induction and triggered pyroptosis after 30 min of induction (Figure 10). After 1.5 h of induction, Hela GSDMD KO cells underwent second necrosis caused by bacterial infection without inducer. Morphology of this process is similar to pyroptosis4. Thus, the population of ruptured cells was counted. There is 1.96 fold change between control group and induced group (Figure 11). So the pyroptosis of host cell in the induced group was triggered by eGFP-GSDMD-N275 not by bacterial infection.

In these experiments, the choice of MOI (multiplicity of infection) and infection time were directed by Modeling.

Figure 10. Hela GSDMD KO cells were infected with ΔsifA SL1344 containing high copy number plasmids which express eGFP-GSDMD-N275 under the control of ATc. Photographs were captured 5 min, 30 min, 90 min after induction, respectively.

Figure 11. Ruptured cells in a field of view were counted.

Preparation of Cells for Infection
1. Grow Hela GSDMD KO cells in a humidified 37 °C, 5% CO2 tissue-culture incubator.
2. Count the cells using a hemocytometer. Seed in 24-well (5 × 10^4 per well) and grow overnight.
Preparation of Bacteria
1. Grow bacteria overnight 16 h in 2 mL LB in a 15-mL tube. Incubate at 37 °C in a shaking incubator (200 rpm).
2. Subculture bacteria by transferring 300 μL of the overnight culture into 5 mL of LB in a loosely capped 50-mL tube. Incubate at 37 °C in a shaking incubator (200 rpm) to late log phase.
3. Pellet 1 mL of the Salmonella subculture by centrifugation at 1,000×g in a microfuge for 2 min at room temperature.
4. Remove 900 μL of supernatant and gently resuspend the pellet in 900 μL PBS.
Infection
1. Aspirate media and rinse the monolayer twice with PBS.
2. Inoculate cells with bacteria (MOI = 100) by adding bacteria directly to the cell-culture supernatant.
3. Incubate for 2 h at 37 °C in 5% CO2.
4. Aspirate media and wash.
5. Add fresh GM containing 100 μg/mL gentamicin and 16 μg/mL incubate at 37 °C in 5% CO2.
Observation is taken after 5 min, 30 min, 90min.

Reference

1. Dumont, A. et al. SKIP, the host target of the Salmonella virulence factor SifA, promotes kinesin-1-dependent vacuolar membrane exchanges. Traffic 11, 899-911, doi:10.1111/j.1600-0854.2010.01069.x (2010).

2. Thurston, T. L. et al. Growth inhibition of cytosolic Salmonella by caspase-1 and caspase-11 precedes host cell death. Nature communications 7, 13292, doi:10.1038/ncomms13292 (2016).

3. Hmelo, L. R. et al. Precision-engineering the Pseudomonas aeruginosa genome with two-step allelic exchange. Nat Protoc 10, 1820-1841, doi:10.1038/nprot.2015.115 (2015).

4. He, W. T. et al. Gasdermin D is an executor of pyroptosis and required for interleukin-1beta secretion. Cell research 25, 1285-1298, doi:10.1038/cr.2015.139 (2015).

Description Design
Results

Chassis

Targeting

Function of GSDMD

Induce the expression of GSDMD-N275

Reference

Back to Top
Demonstrate