|
|
| (67 intermediate revisions by 5 users not shown) |
| Line 2: |
Line 2: |
| | | | |
| | <html> | | <html> |
| − |
| |
| − | <style>
| |
| − | </style>
| |
| − |
| |
| − | <body id="page-top">
| |
| − |
| |
| − | <!-- Full Width Image Header -->
| |
| − | <header class="header-image">
| |
| − | <div class="headline">
| |
| − | <div class="container">
| |
| − | <h1>SilenshR</h1>
| |
| − | <h3>developing an shRNA-induced Silencing Therapy for Cancer</h3>
| |
| − | </div>
| |
| − | </div>
| |
| − | </header>
| |
| − |
| |
| − | <!-- Page Content -->
| |
| − | <div class="container">
| |
| − |
| |
| − | <hr class="featurette-divider">
| |
| | | | |
| | <head> | | <head> |
| − | <title>Bootstrap Example</title>
| + | <style> |
| − | <meta charset="utf-8">
| + | /* |
| − | <meta name="viewport" content="width=device-width, initial-scale=1">
| + | .headline h1 { |
| − | <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
| + | font-size: 100px; |
| − | <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
| + | background-color: rgba(255, 255, 255, 0.9); |
| − | <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
| + | } |
| − | </head>
| + | |
| − | <body>
| + | .headline h2 { |
| | + | font-size: 100px; |
| | + | background: #fff; |
| | + | background: rgba(255, 255, 255, 0.9); |
| | + | } |
| | | | |
| − | <div class="container">
| + | .headline h3 { |
| − | <h2>Carousel Example</h2>
| + | font-size: 100px; |
| − | <div id="myCarousel" class="carousel slide" data-ride="carousel">
| + | background: #fff; |
| − | <!-- Indicators -->
| + | background: rgba(255, 255, 255, 0.9); |
| − | <ol class="carousel-indicators">
| + | } */ |
| − | <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
| + | |
| − | <li data-target="#myCarousel" data-slide-to="1"></li>
| + | |
| − | <li data-target="#myCarousel" data-slide-to="2"></li>
| + | |
| − | </ol>
| + | |
| | | | |
| − | <!-- Wrapper for slides -->
| + | h3{ |
| − | <div class="carousel-inner">
| + | color: #2E64FE |
| − | <div class="item active">
| + | |
| − | <img src="la.jpg" alt="Los Angeles" style="width:100%;">
| + | |
| − | </div>
| + | |
| | | | |
| − | <div class="item">
| + | } |
| − | <img src="chicago.jpg" alt="Chicago" style="width:100%;"> | + | |
| − | </div>
| + | |
| − |
| + | |
| − | <div class="item">
| + | |
| − | <img src="ny.jpg" alt="New york" style="width:100%;">
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| | | | |
| − | <!-- Left and right controls -->
| + | h1 { |
| − | <a class="left carousel-control" href="#myCarousel" data-slide="prev">
| + | color:#3399ff |
| − | <span class="glyphicon glyphicon-chevron-left"></span>
| + | |
| − | <span class="sr-only">Previous</span>
| + | |
| − | </a>
| + | |
| − | <a class="right carousel-control" href="#myCarousel" data-slide="next">
| + | |
| − | <span class="glyphicon glyphicon-chevron-right"></span>
| + | |
| − | <span class="sr-only">Next</span>
| + | |
| − | </a>
| + | |
| − | </div>
| + | |
| − | </div>
| + | |
| | | | |
| | + | } |
| | | | |
| − | <head>
| + | .headline h3 { |
| − | <meta name="viewport" content="width=device-width, initial-scale=1">
| + | padding: 15px; |
| − | <style>
| + | margin: 15px; |
| − | * {box-sizing:border-box}
| + | } */ |
| − | body {font-family: Verdana,sans-serif;}
| + | |
| − | .mySlides {display:none}
| + | |
| | | | |
| − | /* Slideshow container */ | + | </style> |
| − | .slideshow-container {
| + | |
| − | max-width: 2000px;
| + | |
| − | position: relative;
| + | |
| − | margin: auto;
| + | |
| − | }
| + | |
| | | | |
| − | /* Caption text */
| |
| − | .text {
| |
| − | color: #FF0000;
| |
| − | font-size: 25px;
| |
| − | padding: 8px 12px;
| |
| − | position: absolute;
| |
| − | bottom: 8px;
| |
| − | width: 100%;
| |
| − | text-align: center;
| |
| − | }
| |
| − |
| |
| − | /* Number text (1/3 etc) */
| |
| − | .numbertext {
| |
| − | color: #FF0000;
| |
| − | font-size: 12px;
| |
| − | padding: 8px 12px;
| |
| − | position: absolute;
| |
| − | top: 0;
| |
| − | }
| |
| − |
| |
| − | /* The dots/bullets/indicators */
| |
| − | .dot {
| |
| − | height: 13px;
| |
| − | width: 13px;
| |
| − | margin: 0 2px;
| |
| − | background-color: #bbb;
| |
| − | border-radius: 50%;
| |
| − | display: inline-block;
| |
| − | transition: background-color 0.6s ease;
| |
| − | }
| |
| − |
| |
| − | .active {
| |
| − | background-color: #717171;
| |
| − | }
| |
| − |
| |
| − | /* Fading animation */
| |
| − | .fade {
| |
| − | -webkit-animation-name: fade;
| |
| − | -webkit-animation-duration: 1.5s;
| |
| − | animation-name: fade;
| |
| − | animation-duration: 1.5s;
| |
| − | }
| |
| − |
| |
| − | @-webkit-keyframes fade {
| |
| − | from {opacity: .4}
| |
| − | to {opacity: 1}
| |
| − | }
| |
| − |
| |
| − | @keyframes fade {
| |
| − | from {opacity: .4}
| |
| − | to {opacity: 1}
| |
| − | }
| |
| − |
| |
| − | /* On smaller screens, decrease text size */
| |
| − | @media only screen and (max-width: 300px) {
| |
| − | .text {font-size: 11px}
| |
| − | }
| |
| − | </style>
| |
| | </head> | | </head> |
| − | <body>
| |
| | | | |
| | + | <body id="page-top"> |
| | | | |
| − | <div class="slideshow-container"> | + | <!-- Full Width Image Header --> |
| | + | <header class="header-image"> |
| | + | <div class="headline"> |
| | + | <div class="container"> |
| | | | |
| − | <div class="mySlides fade"> | + | <h1> |
| − | <div class="numbertext">1 / 3</div>
| + | <u> SilenshR</u><br> |
| − | <img src="img_nature_wide.jpg" style="width:100%">
| + | |
| − | <div class="text">In 2010, cancer costs exceeded <strong> $2.5 trillion </strong> </div>
| + | |
| − | </div>
| + | |
| | | | |
| − | <div class="mySlides fade"> | + | |
| − | <div class="numbertext">2 / 3</div>
| + | </h1> |
| − | <img src="img_fjords_wide.jpg" style="width:100%">
| + | <h3> <u> Bacteria-Mediated Oncogene Silencing as a Living Cancer Therapeutic </u> </h3> |
| − | <div class="text"> Our team proposes to use shRNA to knockdown the expression of aberrant oncogenes and consequently treat cancer. Taken in the form of a probiotic oral treatment, SilenshR is more accessible than most contemporary treatments such as chemotherapy and radiation therapy.</div> | + | </div> |
| − | </div> | + | </div> |
| | + | </header> |
| | | | |
| − | <div class="mySlides fade"> | + | <!-- Page Content --> |
| − | <div class=" numbertext" >3 / 3</div> | + | |
| − | <img src="img_mountains_wide.jpg" style="width:100%">
| + | |
| − | <div class="text">With the appropriate shRNA sequence, this products lends itself to many various applications. Its great versatility allows it to be a useful therapeutic avenue in the field of medicine. </div>
| + | |
| − | </div>
| + | |
| | | | |
| − | </div>
| + | |
| − | <br>
| + | |
| | | | |
| − | <div style="text-align:center">
| + | </div> |
| − | <span class="dot"></span>
| + | |
| − | <span class="dot"></span>
| + | |
| − | <span class="dot"></span>
| + | |
| − | </div>
| + | |
| − | | + | |
| − | <script>
| + | |
| − | var slideIndex = 0;
| + | |
| − | showSlides();
| + | |
| − | | + | |
| − | function showSlides() {
| + | |
| − | var i; | + | |
| − | var slides = document.getElementsByClassName("mySlides");
| + | |
| − | var dots = document.getElementsByClassName("dot");
| + | |
| − | for (i = 0; i < slides.length; i++) {
| + | |
| − | slides[i].style.display = "none";
| + | |
| − | }
| + | |
| − | slideIndex++;
| + | |
| − | if (slideIndex> slides.length) {slideIndex = 1}
| + | |
| − | for (i = 0; i < dots.length; i++) {
| + | |
| − | dots[i].className = dots[i].className.replace(" active", "");
| + | |
| − | }
| + | |
| − | slides[slideIndex-1].style.display = "block";
| + | |
| − | dots[slideIndex-1].className += " active";
| + | |
| − | setTimeout(showSlides, 2000); // Change image every 2 seconds
| + | |
| − | }
| + | |
| − | </script>
| + | |
| − | | + | |
| − | </body>
| + | |
| − | | + | |
| − | | + | |
| − | | + | |
| − | <!-- First Featurette -->
| + | |
| − | <div class="featurette" id="about">
| + | |
| − | <img class="featurette-image img-circle img-responsive pull-right" src="http://placehold.it/500x500">
| + | |
| − | <h2 class="featurette-heading">The Advantages to a
| + | |
| − | <span class="text-muted">Synthetic Biology Approach</span>
| + | |
| − | </h2>
| + | |
| − | <p class="lead">A cornerstone in synthetic biology is the connection of distinct biological functions to create useful system level behavior. We can take advantage of how bacteria naturally localize in tumors while failing to survive in healthy tissue in the body to use bacteria as a cancer-specific delivery mechanism. Also, bacteria can mass produce products, invade cells, and release the products directly into the cells. This allows easily-degraded compounds to be effective delivered into cancer cells. It also prevents these compounds from affecting healthy cells. The combination of these mechanisms creates a powerful, cancer-specific circuit for gene therapy.</p>
| + | |
| − | </div>
| + | |
| − | | + | |
| − | <hr class="featurette-divider">
| + | |
| − | | + | |
| − | <!-- Second Featurette -->
| + | |
| − | <div class="featurette" id="services">
| + | |
| − | <img class="featurette-image img-circle img-responsive pull-left" src="http://placehold.it/500x500">
| + | |
| − | <h2 class="featurette-heading">Expanding the Possibilities of
| + | |
| − | <span class="text-muted">Gene Therapy</span>
| + | |
| − | </h2>
| + | |
| − | <p class="lead">Anticipating the applications of synthetic biology to healthcare, Columbia iGEM 2017 is devising a therapeutic approach to modulate mammalian gene expression at the post-transcriptional level. Recombinant E. coli with the capacity to invade mammalian cells will deliver an shRNA payload against an aberrantly expressed gene, for example an oncogene in cancer or proinflammatory cytokine in inflammation, to the host cytoplasm. This shRNA payload will then inhibit protein function, which can combat mutations that confer resistance to traditional therapies, as with the tyrosine kinase inhibitors gefitinib and imatinib. </p>
| + | |
| − | </div>
| + | |
| − | | + | |
| − | <hr class="featurette-divider">
| + | |
| − | | + | |
| − | <!-- Third Featurette -->
| + | |
| − | <div class="featurette" id="contact">
| + | |
| − | <img class="featurette-image img-circle img-responsive pull-right" src="http://placehold.it/500x500">
| + | |
| − | <h2 class="featurette-heading">The Future
| + | |
| − | <span class="text-muted">Outlook</span>
| + | |
| − | </h2>
| + | |
| − | <p class="lead">Our mechanism to modulate mammalian gene expression can have a variety of applications, extending throughout as well beyond healthcare. The engineered bacteria would have a significant application to human health particularly in conditions characterized by aberrant gene expression, such as with oncogenes in cancer, cytokines in inflammation, and many others. For cancer applications, the engineered bacteria can be taken as an oral probiotic, which will then selectively localize in tumor cells to prove gene therapy.</p>
| + | |
| − | </div>
| + | |
| − | | + | |
| − | <hr class="featurette-divider">
| + | |
| − | | + | |
| − | </div>
| + | |
| | | | |
| | </body> | | </body> |
