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

 
(31 intermediate revisions by 6 users not shown)
Line 91: Line 91:
 
             z-index: 1;
 
             z-index: 1;
 
             background-color: #EEEEEE;
 
             background-color: #EEEEEE;
−
            opacity: 0.96;
 
−
            filter: alpha(opacity=96);
 
 
             box-shadow: 0 5px 15px #CCCCCC;
 
             box-shadow: 0 5px 15px #CCCCCC;
 
             display: none;
 
             display: none;
Line 154: Line 152:
 
         }
 
         }
  
−
         .daohang a:hover span{
+
         .daohang a:hover span {
−
             transform: rotateY(180deg);          
+
             transform: rotateY(180deg);
−
             -webkit-transform: rotateY(180deg);          
+
             -webkit-transform: rotateY(180deg);
−
             -moz-transform: rotateY(180deg);          
+
             -moz-transform: rotateY(180deg);
−
             -o-transform: rotateY(180deg);          
+
             -o-transform: rotateY(180deg);
 
             -ms-transform: rotateY(180deg);
 
             -ms-transform: rotateY(180deg);
−
             transition: all 0.5s ease-in-out;          
+
             transition: all 0.5s ease-in-out;
−
             -webkit-transition: all 0.5s ease-in-out;          
+
             -webkit-transition: all 0.5s ease-in-out;
−
             -moz-transition: all 0.5s ease-in-out;          
+
             -moz-transition: all 0.5s ease-in-out;
 
             -o-transition: all 0.5s ease-in-out;
 
             -o-transition: all 0.5s ease-in-out;
 
         }
 
         }
Line 244: Line 242:
  
 
             .daohangyi {
 
             .daohangyi {
−
                 font-size: 14px;
+
                 font-size: 12px;
 
             }
 
             }
 
         }
 
         }
Line 269: Line 267:
 
             .daohangyi img {
 
             .daohangyi img {
 
                 display: none;
 
                 display: none;
 +
            }
 +
 +
            .daohang .longName .item:before {
 +
                width: 150px;
 +
                left: 20px;
 +
            }
 +
 +
            .daohang .longName .item:hover:after {
 +
                width: 150px;
 +
                left: 20px;
 
             }
 
             }
 
         }
 
         }
Line 292: Line 300:
 
             width: 80%;
 
             width: 80%;
 
             /* height: auto; */
 
             /* height: auto; */
−
             margin: 20px 20px 0 0;
+
             margin: 20px 40px 0 0;
 
             /* right: 2%; */
 
             /* right: 2%; */
 
             /* top: 90px; */
 
             /* top: 90px; */
−
             padding: 20px 3%;
+
             padding: 50px 3%;
 
             float: right;
 
             float: right;
 
             /* position: relative; */
 
             /* position: relative; */
Line 308: Line 316:
  
 
         .cebian {
 
         .cebian {
−
             width: 15%;
+
             width: 200px;
 
             /* height: 80vh; */
 
             /* height: 80vh; */
 
             float: left;
 
             float: left;
Line 317: Line 325:
 
             /* border:2px solid black */
 
             /* border:2px solid black */
 
             /* background-color: #323643 */
 
             /* 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;
 
         }
 
         }
  
Line 327: Line 343:
  
 
         .h1 {
 
         .h1 {
−
            height: 100px;
+
             line-height: 55px;
−
             line-height: 100px;
+
 
             font-weight: bold;
 
             font-weight: bold;
 +
            height:auto;
 
             font-family: 'Product Sans', sans-serif;
 
             font-family: 'Product Sans', sans-serif;
−
             font-size: 50px;
+
             font-size: 40px;
−
             color: black;
+
             color: #3B3B3B;
−
             border-bottom: 3px solid black;
+
             border-bottom: 2px solid #676767;
−
             /* margin: 0 2.4%; */
+
            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;
 
         }
 
         }
  
Line 452: Line 496:
  
 
         #float02 {}
 
         #float02 {}
−
 
−
        #float03 {}
 
  
 
         div.floatCtro {
 
         div.floatCtro {
 
             width: 100%;
 
             width: 100%;
−
             height: 250px;
+
             /* height: auto; */
 
             margin: 0;
 
             margin: 0;
 
             position: relative;
 
             position: relative;
Line 467: Line 509:
 
             display: block;
 
             display: block;
 
             width: 100%;
 
             width: 100%;
−
             height: 40px;
+
             /* height: auto; */
 +
            /* text-align: left !important; */
 
             color: #ffffff !important;
 
             color: #ffffff !important;
 
             font-size: 16px;
 
             font-size: 16px;
 +
            padding:0;
 
             background-color: #323643;
 
             background-color: #323643;
 
             border-bottom: 1px solid black;
 
             border-bottom: 1px solid black;
−
             /* border-radius: 5px; */
+
             padding:0 3%;
 
             text-decoration: none !important;
 
             text-decoration: none !important;
 
         }
 
         }
Line 478: Line 522:
 
         div.floatCtro .daohanger {
 
         div.floatCtro .daohanger {
 
             width: 100%;
 
             width: 100%;
−
             text-align: justify !important;
+
             text-align: left !important;
−
             height: 45px;
+
             height: auto;
−
             line-height: 45px;
+
             line-height: 25px;
 
             font-family: Arial;
 
             font-family: Arial;
−
             font-size: 14px;
+
             font-size: 14px !important;
 
             color: #676767;
 
             color: #676767;
 
             margin: 0;
 
             margin: 0;
−
             padding-left: 8%;
+
             padding:10px 8%;
 
             cursor: pointer;
 
             cursor: pointer;
 
             background: #fff;
 
             background: #fff;
Line 495: Line 539:
 
             width: 100%;
 
             width: 100%;
 
             height: 40px;
 
             height: 40px;
 +
            padding:10px 8%;
 
             /* margin: 10px 0 0 0; */
 
             /* margin: 10px 0 0 0; */
 
             background: #FFF;
 
             background: #FFF;
Line 504: Line 549:
 
         div.floatCtro a span {
 
         div.floatCtro a span {
 
             display: block;
 
             display: block;
−
             height: 44px;
+
             height: auto;
−
             line-height: 44px;
+
            text-align: left !important;
 +
             line-height: 18px;
 
             font-family: Arial;
 
             font-family: Arial;
 
             font-size: 16px;
 
             font-size: 16px;
−
            padding-left: 8%;
 
 
         }
 
         }
  
Line 533: Line 578:
  
 
         .biaoti {
 
         .biaoti {
−
             line-height: 40px;
+
             display: inline-block;
−
             width: 50%;
+
            margin: 8px 0;
−
             margin-left: 6%;
+
             /* width: 50%; */
−
             text-align: center;
+
             /* margin-left: 6%; */
 +
             /* text-align: center; */
 
             text-decoration: none !important;
 
             text-decoration: none !important;
 
         }
 
         }
Line 571: Line 617:
 
         }
 
         }
  
−
         @media screen and (max-width: 1000px) {             
+
         @media screen and (max-width: 1200px) {             
 
            
 
            
 +
            .cebian {
 +
            width: 15%;
 +
            }
 +
 +
            .zhengwen {
 +
            margin: 20px 20px 0 0;
 +
 
             .daohangyi {
 
             .daohangyi {
 
                 font-size: 14px;
 
                 font-size: 14px;
 
             }
 
             }
 +
            .daohangyi img {
 +
                display: none;
 +
            } 
 
         }
 
         }
  
−
         @media screen and (max-width: 880px) {
+
         @media screen and (max-width: 900px) {
  
 
             .daohangyi img {
 
             .daohangyi img {
Line 589: Line 645:
 
         }
 
         }
 
     </style>
 
     </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 {
 +
                display: none;
 +
            }
 +
   
 +
            #zhedie1,
 +
            #zhedie2,
 +
            #zhedie3,
 +
            #zhedie4 {
 +
                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 {
 +
                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>
 
</head>
Line 616: Line 746:
 
                 <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/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/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/InterLab">InterLab</a>
 +
                <a class="item" href="https://2018.igem.org/Team:HZAU-China/Notebook">Notebook</a>
 +
 
 
             </li>
 
             </li>
 
             <li class="hiLight shortName">
 
             <li class="hiLight shortName">
Line 631: Line 763:
 
                     <span class="xjtPic"></span>
 
                     <span class="xjtPic"></span>
 
                 </a>
 
                 </a>
−
                 <a class="item" href="https://2018.igem.org/Team:HZAU-China/Safety">Safty</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/Human_Practices">Human Practices</a>
 
                 <a class="item" href="https://2018.igem.org/Team:HZAU-China/Public_Engagement">Public Engagement</a>
 
                 <a class="item" href="https://2018.igem.org/Team:HZAU-China/Public_Engagement">Public Engagement</a>
Line 644: Line 776:
 
                 <a class="item" href="https://2018.igem.org/Team:HZAU-China/Collaborations">Collaborations</a>
 
                 <a class="item" href="https://2018.igem.org/Team:HZAU-China/Collaborations">Collaborations</a>
 
             </li>
 
             </li>
−
             <li class="shortName">
+
             <li class="hiLight shortName">
−
                 <a class="nav_head" href="https://2018.igem.org/Team:HZAU-China/Parts">
+
                 <a class="nav_head" href="#">
 
                     <span>Parts</span>
 
                     <span>Parts</span>
 +
                    <span class="xjtPic"></span>
 
                 </a>
 
                 </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>
 
             </li>
 
         </ul>
 
         </ul>
Line 656: Line 791:
 
         <!-- 正文 -->
 
         <!-- 正文 -->
 
         <div class="zhengwen">
 
         <div class="zhengwen">
−
            <img class="daimg" src="https://static.igem.org/mediawiki/2018/7/70/T--HZAU-China--hezhao1.png" alt="">
 
 
             <div id="float01" class="cur">
 
             <div id="float01" class="cur">
−
                 <div class="h1">biaotiyi</div>
+
                 <p>Our project goal is to induce pyroptosis in tumor cells through
 +
                    translocating a pyroptosis-associated protein GSDMD by <i>Salmonella</i>. Expression of the N-terminal of
 +
                    GSDMD fused with eGFP (eGFP-GSDMD-N275) is under the control of the promoter P<sub>tet</sub> in Δ<i>sifA</i>
 +
                    Salmonella. Hela GSDMD KO (knockout) cell line were infected with Δ<i>sifA</i> <i>Salmonella</i>. Inducer anhydrotetracycline (ATc) (16μg/mL) was added 3 h after infection. Microscopy shows that eGFP-GSDMD-N275 located in cytoplasm after 5 min of induction and  pyroptosis was triggered after 30 min of induction (<b>Figure 1</b>). By counting the population of ruptured cells, a 1.96 fold-change was demonstrated between the induced group and the control group (<b>Figure 2</b>). So, the pyroptosis of host cell in the induced group was triggered by eGFP-GSDMD-N275 as expected. These results demonstrate that we successfully achieved the goal of our project!!! </p>
  
 
             </div>
 
             </div>
 
             <div id="float02">
 
             <div id="float02">
−
                 <div class="h1">biaotier</div>
+
                 <div style="width: 90%; margin: auto">
−
 
+
                    <img src="https://static.igem.org/mediawiki/2018/b/b3/T--HZAU-China--basicPart4.png" width=100% alt="">
−
            </div>
+
                </div>
−
            <div id="float03">
+
                <p><b>Figure 1.</b>  Hela GSDMD KO cells were infected by <i>Salmonella</i> Δ<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, and 90 min after induction, respectively. </p>
−
                <div class="h1">biaotisan</div>
+
                <div style="width: 40%; margin: 30px auto">
−
                  
+
                    <img src="https://static.igem.org/mediawiki/2018/1/16/T--HZAU-China--Demonstrate2.png" width=100% alt="">
−
             </div>
+
                </div>
 +
                 <p><b>Figure 2.</b> Ruptured cells in a field of view were counted (n=8).</p><br>   
 +
                <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>          
 
         </div>
 
         </div>
 
         <!-- 侧边 -->
 
         <!-- 侧边 -->
Line 681: Line 821:
 
                 <span class="xsjPic"><img src="https://static.igem.org/mediawiki/2018/7/7c/T--HZAU-China--ysj.svg" alt=""></span>
 
                 <span class="xsjPic"><img src="https://static.igem.org/mediawiki/2018/7/7c/T--HZAU-China--ysj.svg" alt=""></span>
 
             </a>
 
             </a>
−
             <a class="daohangyi" href="https://2018.igem.org/Team:HZAU-ChinaResults">
+
             <a class="daohangyi" href="https://2018.igem.org/Team:HZAU-China/Results">
 
                 <span class="biaoti">Results</span>
 
                 <span class="biaoti">Results</span>
 
                 <span class="xsjPic"><img src="https://static.igem.org/mediawiki/2018/7/7c/T--HZAU-China--ysj.svg" alt=""></span>
 
                 <span class="xsjPic"><img src="https://static.igem.org/mediawiki/2018/7/7c/T--HZAU-China--ysj.svg" alt=""></span>
 
             </a>
 
             </a>
 
             <div class="daohangyi">
 
             <div class="daohangyi">
−
                    <span class="biaoti">Demonstrate</span>
+
                <span class="biaoti">Demonstrate</span>
−
                    <span class="xsjPic"><img src="https://static.igem.org/mediawiki/2018/8/8d/T--HZAU-China--xjt.svg" alt=""></span>
+
                <span class="xsjPic"><img src="https://static.igem.org/mediawiki/2018/8/8d/T--HZAU-China--xjt.svg" alt=""></span>
 
             </div>
 
             </div>
 
             <div class="floatCtro">
 
             <div class="floatCtro">
−
                 <p class="daohanger">neirongyi</p>
+
                 <!-- <p class="daohanger">neirongyi</p>
 
                 <p class="daohanger">neironger</p>
 
                 <p class="daohanger">neironger</p>
−
                 <p class="daohanger">neirongsan</p>
+
                 <p class="daohanger">neirongsan</p> -->
 
                 <a>
 
                 <a>
 
                     <span>Back&nbsp;to&nbsp;Top</span>
 
                     <span>Back&nbsp;to&nbsp;Top</span>

Latest revision as of 02:41, 18 October 2018

Our project goal is to induce pyroptosis in tumor cells through translocating a pyroptosis-associated protein GSDMD by Salmonella. Expression of the N-terminal of GSDMD fused with eGFP (eGFP-GSDMD-N275) is under the control of the promoter Ptet in ΔsifA Salmonella. Hela GSDMD KO (knockout) cell line were infected with ΔsifA Salmonella. Inducer anhydrotetracycline (ATc) (16μg/mL) was added 3 h after infection. Microscopy shows that eGFP-GSDMD-N275 located in cytoplasm after 5 min of induction and pyroptosis was triggered after 30 min of induction (Figure 1). By counting the population of ruptured cells, a 1.96 fold-change was demonstrated between the induced group and the control group (Figure 2). So, the pyroptosis of host cell in the induced group was triggered by eGFP-GSDMD-N275 as expected. These results demonstrate that we successfully achieved the goal of our project!!!

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

Figure 2. Ruptured cells in a field of view were counted (n=8).


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

Description Design Results
Demonstrate
Back to Top