Difference between revisions of "Team:BioIQS-Barcelona"

 
(192 intermediate revisions by 2 users not shown)
Line 1: Line 1:
{{BioIQS-Barcelona}}
 
 
{{BioIQS-Barcelona/Templates:fonts}}
 
{{BioIQS-Barcelona/Templates:bootstrap}}
 
{{BioIQS-Barcelona/Templates:essentials}}
 
{{BioIQS-Barcelona/Templates:layout}}
 
{{BioIQS-Barcelona/Templates:green}}
 
{{BioIQS-Barcelona/Templates:customcss}}
 
  
 
<html>
 
<html>
  
<div class="w3-card-2 topnav" id="topnav" style="position: relative;">
 
  <div style="overflow:auto;">
 
    <div class="w3-bar w3-left" style="width:100%;overflow:hidden;height:44px">
 
      <a href="javascript:void(0);" class="topnav-icons fa fa-menu w3-hide-large w3-left w3-bar-item w3-button" onclick="open_menu()" title="Menu"></a>
 
      <a href="/default.asp" class="topnav-icons fa fa-home w3-left w3-bar-item w3-button" title="Home"></a>
 
      <a class="w3-bar-item w3-button" href="/html/default.asp" title="HTML Tutorial">HTML</a>
 
      <a class="w3-bar-item w3-button" href="/css/default.asp" title="CSS Tutorial">CSS</a>
 
      <a class="w3-bar-item w3-button" href="/js/default.asp" title="JavaScript Tutorial">JAVASCRIPT</a>
 
      <a class="w3-bar-item w3-button" href="/sql/default.asp" title="SQL Tutorial">SQL</a>
 
      <a class="w3-bar-item w3-button" href="/php/default.asp" title="PHP Tutorial">PHP</a>
 
      <a class="w3-bar-item w3-button" href="/bootstrap/default.asp" title="Bootstrap Tutorial">BOOTSTRAP</a>
 
      <a class="w3-bar-item w3-button active" href="/howto/default.asp" title="How To">HOW TO</a>
 
      <a class="w3-bar-item w3-button" href="/jquery/default.asp" title="jQuery Tutorial">JQUERY</a>
 
      <a class="w3-bar-item w3-button" href="/w3css/default.asp" title="W3.CSS Tutorial">W3.CSS</a>
 
      <a class="w3-bar-item w3-button" href="/angular/default.asp" title="Angular Tutorial">ANGULARJS</a>
 
      <a class="w3-bar-item w3-button" href="/xml/default.asp" title="XML Tutorial">XML</a>
 
      <a class="w3-bar-item w3-button" id="topnavbtn_tutorials" href="javascript:void(0);" onclick="w3_open_nav(&quot;tutorials&quot;)" title="Tutorials">MORE <i class="fa fa-caret-down"></i><i class="fa fa-caret-up" style="display:none"></i></a>
 
      <a href="javascript:void(0);" class="topnav-icons fa w3-right w3-bar-item w3-button" onclick="open_search(this)" title="Search W3Schools"></a>
 
      <a href="javascript:void(0);" class="topnav-icons fa w3-right w3-bar-item w3-button" onclick="open_translate(this)" title="Translate W3Schools"></a>
 
      <a class="w3-bar-item w3-button w3-right" href="/forum/default.asp">FORUM</a>
 
      <a class="w3-bar-item w3-button w3-right" id="topnavbtn_examples" href="javascript:void(0);" onclick="w3_open_nav(&quot;examples&quot;)" title="Examples">EXAMPLES <i class="fa fa-caret-down"></i><i class="fa fa-caret-up" style="display:none"></i></a>
 
      <a class="w3-bar-item w3-button w3-right" id="topnavbtn_references" href="javascript:void(0);" onclick="w3_open_nav(&quot;references&quot;)" title="References">REFERENCES <i class="fa fa-caret-down"></i><i class="fa fa-caret-up" style="display:none"></i></a>
 
    </div>
 
    <div id="nav_tutorials" class="w3-bar-block w3-card-2" style="display:none;">
 
      <span onclick="w3_close_nav(&quot;tutorials&quot;)" class="w3-button w3-xlarge w3-right" style="position:absolute;right:0;font-weight:bold;">×</span>
 
      <div class="w3-row-padding" style="padding:24px 48px">
 
        <div class="w3-col l3 m4">
 
          <h3>HTML and CSS</h3>
 
          <a class="w3-bar-item w3-button" href="/html/default.asp">Learn HTML</a>
 
          <a class="w3-bar-item w3-button" href="/css/default.asp">Learn CSS</a>
 
          <a class="w3-bar-item w3-button" href="/w3css/default.asp">Learn W3.CSS</a>
 
          <a class="w3-bar-item w3-button" href="/colors/default.asp">Learn Colors</a>
 
          <a class="w3-bar-item w3-button" href="/bootstrap/default.asp">Learn Bootstrap 3</a>
 
          <a class="w3-bar-item w3-button" href="/bootstrap4/default.asp">Learn Bootstrap 4</a>
 
          <a class="w3-bar-item w3-button" href="/graphics/default.asp">Learn Graphics</a>
 
          <a class="w3-bar-item w3-button" href="/icons/default.asp">Learn Icons</a>
 
          <a class="w3-bar-item w3-button" href="/howto/default.asp">Learn How To</a>
 
        </div>
 
        <div class="w3-col l3 m4"> 
 
          <h3>JavaScript</h3>
 
          <a class="w3-bar-item w3-button" href="/js/default.asp">Learn JavaScript</a>
 
          <a class="w3-bar-item w3-button" href="/jquery/default.asp">Learn jQuery</a>
 
          <a class="w3-bar-item w3-button" href="/angular/default.asp">Learn AngularJS</a>
 
          <a class="w3-bar-item w3-button" href="/js/js_json_intro.asp">Learn JSON</a>
 
          <a class="w3-bar-item w3-button" href="/js/js_ajax_intro.asp">Learn AJAX</a>
 
          <a class="w3-bar-item w3-button" href="/w3js/default.asp">Learn W3.JS</a>
 
          <div class="w3-hide-small"><br><br></div>
 
        </div>
 
        <div class="w3-col l3 m4">
 
          <h3>Server Side</h3>
 
          <a class="w3-bar-item w3-button" href="/sql/default.asp">Learn SQL</a>
 
          <a class="w3-bar-item w3-button" href="/php/default.asp">Learn PHP</a>
 
          <a class="w3-bar-item w3-button" href="/python/default.asp">Learn Python</a>
 
          <a class="w3-bar-item w3-button" href="/asp/default.asp">Learn ASP</a>
 
          <a class="w3-bar-item w3-button" href="/nodejs/default.asp">Learn Node.js</a>
 
          <a class="w3-bar-item w3-button" href="/nodejs/nodejs_raspberrypi.asp">Learn Raspberry Pi</a>         
 
          <h3>Web Building</h3>
 
          <a class="w3-bar-item w3-button" href="/w3css/w3css_templates.asp">Web Templates</a>
 
          <a class="w3-bar-item w3-button" href="/browsers/default.asp">Web Statistics</a>
 
          <a class="w3-bar-item w3-button" href="/cert/default.asp">Web Certificates</a>
 
          <a class="w3-bar-item w3-button" href="/tryit/default.asp">Web Editor</a>
 
        </div>
 
        <div class="w3-col l3 m4">
 
          <h3>XML</h3>
 
          <a class="w3-bar-item w3-button" href="/xml/default.asp">Learn XML</a>
 
          <a class="w3-bar-item w3-button" href="/xml/ajax_intro.asp">Learn XML AJAX</a>
 
          <a class="w3-bar-item w3-button" href="/xml/dom_intro.asp">Learn XML DOM</a>
 
          <a class="w3-bar-item w3-button" href="/xml/xml_dtd_intro.asp">Learn XML DTD</a>
 
          <a class="w3-bar-item w3-button" href="/xml/schema_intro.asp">Learn XML Schema</a>
 
          <a class="w3-bar-item w3-button" href="/xml/xsl_intro.asp">Learn XSLT</a>
 
          <a class="w3-bar-item w3-button" href="/xml/xpath_intro.asp">Learn XPath</a>
 
          <a class="w3-bar-item w3-button" href="/xml/xquery_intro.asp">Learn XQuery</a>
 
        </div>
 
      </div>
 
      <br>
 
    </div>
 
    <div id="nav_references" class="w3-bar-block w3-card-2">
 
      <span onclick="w3_close_nav(&quot;references&quot;)" class="w3-button w3-xlarge w3-right" style="position:absolute;right:0;font-weight:bold;">×</span>
 
      <div class="w3-row-padding" style="padding:24px 48px">
 
        <div class="w3-col m4">
 
          <h3>HTML</h3>
 
          <a class="w3-bar-item w3-button" href="/tags/default.asp">HTML Tag Reference</a>
 
          <a class="w3-bar-item w3-button" href="/tags/ref_eventattributes.asp">HTML Event Reference</a>
 
          <a class="w3-bar-item w3-button" href="/colors/default.asp">HTML Color Reference</a>
 
          <a class="w3-bar-item w3-button" href="/tags/ref_attributes.asp">HTML Attribute Reference</a>
 
          <a class="w3-bar-item w3-button" href="/tags/ref_canvas.asp">HTML Canvas Reference</a>
 
          <a class="w3-bar-item w3-button" href="/graphics/svg_reference.asp">HTML SVG Reference</a>
 
          <a class="w3-bar-item w3-button" href="/graphics/google_maps_reference.asp">Google Maps Reference</a>
 
          <h3>Charsets</h3>
 
          <a class="w3-bar-item w3-button" href="/charsets/default.asp">HTML Character Sets</a>
 
          <a class="w3-bar-item w3-button" href="/charsets/ref_html_ascii.asp">HTML ASCII</a>
 
          <a class="w3-bar-item w3-button" href="/charsets/ref_html_ansi.asp">HTML ANSI</a>
 
          <a class="w3-bar-item w3-button" href="/charsets/ref_html_ansi.asp">HTML Windows-1252</a>
 
          <a class="w3-bar-item w3-button" href="/charsets/ref_html_8859.asp">HTML ISO-8859-1</a>
 
          <a class="w3-bar-item w3-button" href="/charsets/ref_html_symbols.asp">HTML Symbols</a>
 
          <a class="w3-bar-item w3-button" href="/charsets/ref_html_utf8.asp">HTML UTF-8</a>
 
        </div>
 
        <div class="w3-col m4">
 
          <h3>CSS</h3>
 
          <a class="w3-bar-item w3-button" href="/cssref/default.asp">CSS Reference</a>
 
          <a class="w3-bar-item w3-button" href="/cssref/css3_browsersupport.asp">CSS Browser Support</a>
 
          <a class="w3-bar-item w3-button" href="/cssref/css_selectors.asp">CSS Selector Reference</a>
 
          <a class="w3-bar-item w3-button" href="/w3css/w3css_references.asp">W3.CSS Reference</a>
 
          <a class="w3-bar-item w3-button" href="/bootstrap/bootstrap_ref_all_classes.asp">Bootstrap Reference</a>
 
          <a class="w3-bar-item w3-button" href="/icons/icons_reference.asp">Icon Reference</a>
 
          <h3>XML</h3>
 
          <a class="w3-bar-item w3-button" href="/xml/dom_nodetype.asp">XML Reference</a>
 
          <a class="w3-bar-item w3-button" href="/xml/dom_http.asp">XML Http Reference</a>
 
          <a class="w3-bar-item w3-button" href="/xml/xsl_elementref.asp">XSLT Reference</a>
 
          <a class="w3-bar-item w3-button" href="/xml/schema_elements_ref.asp">XML Schema Reference</a>
 
        </div>
 
        <div class="w3-col m4">
 
          <h3>JavaScript</h3>
 
          <a class="w3-bar-item w3-button" href="/jsref/default.asp">JavaScript Reference</a>
 
          <a class="w3-bar-item w3-button" href="/jsref/default.asp">HTML DOM Reference</a>
 
          <a class="w3-bar-item w3-button" href="/jquery/jquery_ref_overview.asp">jQuery Reference</a>
 
          <a class="w3-bar-item w3-button" href="/angular/angular_ref_directives.asp">AngularJS Reference</a>
 
          <a class="w3-bar-item w3-button" href="/w3js/w3js_references.asp">W3.JS Reference</a>
 
          <h3>Server Side</h3>
 
          <a class="w3-bar-item w3-button" href="/php/php_ref_overview.asp">PHP Reference</a>
 
          <a class="w3-bar-item w3-button" href="/sql/sql_quickref.asp">SQL Reference</a>
 
          <a class="w3-bar-item w3-button" href="/python/python_ref_functions.asp">Python Reference</a>
 
          <a class="w3-bar-item w3-button" href="/asp/asp_ref_response.asp">ASP Reference</a>
 
        </div>
 
      </div>
 
      <br>
 
    </div>
 
    <div id="nav_examples" class="w3-bar-block w3-card-2">
 
      <span onclick="w3_close_nav(&quot;examples&quot;)" class="w3-button w3-xlarge w3-right" style="position:absolute;right:0;font-weight:bold;">×</span>
 
      <div class="w3-row-padding" style="padding:24px 48px">
 
        <div class="w3-col l3 m6">
 
          <h3>HTML/CSS</h3>
 
          <a class="w3-bar-item w3-button" href="/html/html_examples.asp">HTML Examples</a>
 
          <a class="w3-bar-item w3-button" href="/css/css_examples.asp">CSS Examples</a>
 
          <a class="w3-bar-item w3-button" href="/w3css/w3css_examples.asp">W3.CSS Examples</a>
 
          <a class="w3-bar-item w3-button" href="/w3css/w3css_templates.asp">W3.CSS Templates</a>
 
          <a class="w3-bar-item w3-button" href="/bootstrap/bootstrap_examples.asp">Bootstrap Examples</a>
 
          <a class="w3-bar-item w3-button" href="/howto/default.asp">How To Examples</a>
 
          <a class="w3-bar-item w3-button" href="/graphics/svg_examples.asp">SVG Examples</a>
 
        </div>
 
        <div class="w3-col l3 m6">
 
          <h3>JavaScript</h3>
 
          <a class="w3-bar-item w3-button" href="/js/js_examples.asp" target="_top">JavaScript Examples</a>
 
          <a class="w3-bar-item w3-button" href="/js/js_dom_examples.asp" target="_top">HTML DOM Examples</a>
 
          <a class="w3-bar-item w3-button" href="/jquery/jquery_examples.asp" target="_top">jQuery Examples</a>
 
          <a class="w3-bar-item w3-button" href="/angular/angular_examples.asp" target="_top">AngularJS Examples</a>
 
          <a class="w3-bar-item w3-button" href="/js/js_ajax_examples.asp" target="_top">AJAX Examples</a>
 
          <a class="w3-bar-item w3-button" href="/w3js/w3js_examples.asp">W3.JS Examples</a>
 
        </div>
 
        <div class="w3-col l3 m6">
 
          <h3>Server Side</h3>
 
          <a class="w3-bar-item w3-button" href="/php/php_examples.asp" target="_top">PHP Examples</a>
 
          <a class="w3-bar-item w3-button" href="/asp/asp_examples.asp" target="_top">ASP Examples</a>
 
          <h3>XML</h3>
 
          <a class="w3-bar-item w3-button" href="/xml/xml_examples.asp" target="_top">XML Examples</a>
 
          <a class="w3-bar-item w3-button" href="/xml/xsl_examples.asp" target="_top">XSLT Examples</a>
 
          <a class="w3-bar-item w3-button" href="/xml/xpath_examples.asp" target="_top">XPath Examples</a>
 
          <a class="w3-bar-item w3-button" href="/xml/schema_example.asp" target="_top">XML Schema Examples</a>
 
          <a class="w3-bar-item w3-button" href="/graphics/svg_examples.asp" target="_top">SVG Examples</a>
 
        </div>
 
        <div class="w3-col l3 m6">
 
          <h3>Quizzes</h3>
 
          <a class="w3-bar-item w3-button" href="/quiztest/quiztest.asp?Qtest=HTML" target="_top">HTML Quiz</a>
 
          <a class="w3-bar-item w3-button" href="/quiztest/quiztest.asp?Qtest=CSS" target="_top">CSS Quiz</a>
 
          <a class="w3-bar-item w3-button" href="/quiztest/quiztest.asp?Qtest=JavaScript" target="_top">JavaScript Quiz</a>
 
          <a class="w3-bar-item w3-button" href="/quiztest/quiztest.asp?Qtest=Bootstrap" target="_top">Bootstrap Quiz</a>
 
          <a class="w3-bar-item w3-button" href="/quiztest/quiztest.asp?Qtest=jQuery" target="_top">jQuery Quiz</a>
 
          <a class="w3-bar-item w3-button" href="/quiztest/quiztest.asp?Qtest=PHP" target="_top">PHP Quiz</a>
 
          <a class="w3-bar-item w3-button" href="/quiztest/quiztest.asp?Qtest=SQL" target="_top">SQL Quiz</a>
 
          <a class="w3-bar-item w3-button" href="/quiztest/quiztest.asp?Qtest=XML" target="_top">XML Quiz</a>
 
        </div>
 
      </div>
 
      <br>
 
    </div>
 
  </div>
 
</div>
 
  
<div class="column full_size" >
+
    <meta charset="utf-8">
<h1> We are BioIQS iGEM team! </h1>
+
    <meta name="viewport" content="width=device-width, initial-scale=1">
<h3> Project description:</h3>
+
    <meta name="description" content="">
<p>We would like to present you a brief description of our project on celiac disease:</p>
+
    <meta name="author" content="">
  
<img src="https://static.igem.org/mediawiki/2018/f/ff/T--BioIQS-Barcelona--TeamLabPicture.jpg">
+
    <!-- JQUERY CDN, REMOVE.    script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script-->
  
 +
    <!--script>
 +
            if (typeof jQuery == 'undefined') {
 +
                console.log("jquery not loaded")
 +
            } else {
 +
                console.log("jquery is loaded")
 +
            }
 +
        </script-->
  
<p style="text-align: justify;">Our project is based on the design of a <strong>personalized gluten sensor</strong> by using the common tools of synthetic biology. There are already several sensors that are able to detect gluten in the food. However, there are milestones that still have not been overcome. We propose a robust model in which the HLA molecule of a patient is expressed and used as a sensor to detect specific reactive gluten epitopes.</p>
+
       
<p style="text-align: justify;"><strong>Coeliac disease (CD)</strong> is an autoimmune disorder that is closely related with HLA (Human leukocyte antigen), a type of receptor that are located in the surface of almost every cell of a human tissue, including white blood cells. These molecules are responsible for the correct discrimination between what is self and foreign proteins, guaranteeing the correct immune response against foreign agents that can cause infections.</p>
+
    <script>
<p style="text-align: justify;">Within the HLA protein family there are the highly polymorphic HLA-DQ, which means that <strong>there are a lot of existing genetic variants of these molecules</strong>. Some of these HLA-DQ variants are able to recognize different gluten epitopes (aminoacid sequence of a protein) and present them to the T cells. More specifically, 25% of the general population carry the HLA-DQ that can recognize gluten derived epitopes, but only 1% of the population suffer from coeliac disease. The reason of such fact is that the inflammatory reaction is triggered by some T cells that can sense the gluten epitope presented by the HLA-DQ.</p>
+
        var element = document.querySelector('[rel="stylesheet"]');
<p style="text-align: justify;">Understanding why the inflammatory response is triggered by a certain type of T cells upon epitope presentation by HLA-DQ molecules is essential to uncover the mechanism of CD. Since the first step for the immune response activation is the recognition and binding of the gluten epitope to the HLA-DQ receptor, the development of a personalized sensor to determine reactive epitopes could help to better understand the disease and would also allow the screening of those foods that could potentially trigger an immune response to the patient.</p>
+
        var stylesheet = element.sheet || element.styleSheet;
 +
        console.log(stylesheet);
 +
        stylesheet.disabled = true;
 +
    </script>
  
<div class="highlight decoration_background decoration_A_top">
+
<!--script>
<p style="text-align: justify;">In our iGEM Project we will design a <strong>personalized gluten sensor</strong> through a synthetic biology approach. To do so, we decided to build a model based on the HLA expression of the patient which will be coupled to a sensor, allowing the detection of reactive epitopes. The main specificities of our sensor are described as follows:</p>
+
        if (typeof jQuery == 'undefined') {
<ul>
+
            console.log("jquery not loaded after disabling")
<li style="text-align: justify;">Since our sensor will be built <strong>according to the patient</strong> HLA, it will allow the detection of specific reactive epitopes independently of the food source.</li>
+
        } else {
<li style="text-align: justify;">Additionally, our sensor will be able to detect reactive epitopes even in fermented foods.</li>
+
            console.log("jquery is loaded after diabling")
<li style="text-align: justify;">The methodology implemented in our sensor could be used for the i<strong>dentification of new reactive epitopes</strong> and unknown allelic variants.</li>
+
        }
<li style="text-align: justify;">Our design requires <strong>only a DNA sample</strong> of the patient. Therefore, the methodology and application of our sensor could be extended for the detection of other HLA related disorders as well as the generation of new research lines for the diagnosis, detection and basic knowledge of these type of disorders.</li>
+
    </script-->
</ul>
+
</div>
+
</div>  
+
  
 +
    <link rel="stylesheet" href="https://2018.igem.org/Template:BioIQS-Barcelona/css/goodload?action=raw&ctype=text/css">
  
 +
    <!-- Habilitar nomes al app per veure les funcions Jquery -->
 +
    <script src="https://2018.igem.org/Template:BioIQS-Barcelona/js/vendor?action=raw&ctype=text/javascript"></script>
  
 +
    <title>BIO IQS</title>
  
 +
    <!-- Bootstrap core CSS -->
 +
    <link href="https://2018.igem.org/Template:BioIQS-Barcelona/css/bootstrapmin?action=raw&ctype=text/css" rel="stylesheet">
  
<div class="clear extra_space"></div>
+
    <script>
<div class="line_divider"></div>
+
        $(function () {
<div class="clear extra_space"></div>
+
            $('navigationbar').load('https://2018.igem.org/Template:BioIQS-Barcelona/header?action=raw&ctype=text/javascript');
 +
            $('footer').load('https://2018.igem.org/Template:BioIQS-Barcelona/footer?action=raw&ctype=text/javascript');
 +
        });
 +
    </script>
  
 +
    <!--    Fonts googlefonts-->
 +
    <link href="https://fonts.googleapis.com/css?family=Permanent+Marker" rel="stylesheet">
  
<div class="column full_size" >
+
    <!-- Custom fonts for this template -->
<h1> Welcome to iGEM 2018! </h1>
+
    <link href="https://2018.igem.org/Template:BioIQS-Barcelona/css/allmin?action=raw&ctype=text/css" rel="stylesheet"> <!-- canvio all.min per allmin-->
<p>Your team has been approved and you are ready to start the iGEM season! </p>
+
    <link rel="stylesheet" href="https://2018.igem.org/Template:BioIQS-Barcelona/css/simplelineicons?action=raw&ctype=text/css">    <!-- CANVI-->
 +
    <link href="https://fonts.googleapis.com/css?family=Lato" rel="stylesheet">
 +
    <link href="https://fonts.googleapis.com/css?family=Catamaran:100,200,300,400,500,600,700,800,900" rel="stylesheet">
 +
    <link href="https://fonts.googleapis.com/css?family=Muli" rel="stylesheet">     
 +
    <!-- Importing fonts awesome, it doesnt work from allmin.css because of url('undefined'), needed to upload manually -->   
 +
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.5.0/css/all.css" integrity="sha384-B4dIYHKNBt8Bc12p+WXckhzcICo0wtJAoU8YZTY5qE0Id1GSseTk6S+L3BlXeVIU" crossorigin="anonymous">
  
  
 +
    <link rel="stylesheet" href="https://2018.igem.org/Template:BioIQS-Barcelona/css/new-age?action=raw&ctype=text/css">
  
+
    <link rel="stylesheet" href="https://2018.igem.org/Template:BioIQS-Barcelona/css/adaptwiki?action=raw&ctype=text/css">
  
</div>
 
  
 +
    <!--Added MathJax hack to make inline equations work-->
 +
    <script type="text/x-mathjax-config">
 +
    MathJax.Hub.Config({
 +
    tex2jax: {
 +
    inlineMath: [ ['$','$'], ["\\(","\\)"] ],
 +
    processEscapes: true
 +
  }
 +
});
 +
</script>
  
<div class="column full_size" >
 
  
<h3>Before you start</h3>
 
<p> Please read the following pages:</p>
 
<ul>
 
<li>  <a href="https://2018.igem.org/Competition">Competition Hub</a> </li>
 
<li> <a href="https://2018.igem.org/Competition/Deliverables/Wiki">Wiki Requirements page</a></li>
 
<li> <a href="https://2018.igem.org/Resources/Template_Documentation">Template documentation</a></li>
 
</ul>
 
</div>
 
  
 +
    <!-- TREIEM AIXO PQ SENSE ESTIL ES PERD EL FORMAT I NO SERVEIX DE RES -->
 +
    <navigationbar></navigationbar>
  
<div class="clear extra_space"></div>
+
   
<div class="line_divider"></div>
+
    <button id="myBtn" class="js-scroll-trigger" title="Go to top">Top</button>
<div class="clear extra_space"></div>
+
  
 +
    <header class="masthead">
 +
        <div class="container h-100">
 +
            <div class="row h-100">
 +
                <div class="col-lg-7 my-auto">
 +
                    <div class="header-content mx-auto">
 +
                        <h1 class="mb-5">We are the BioIQS iGEM team!</h1>
 +
                        <a href="https://2018.igem.org/Team:BioIQS-Barcelona#project" class="btn btn-outline btn-xl js-scroll-trigger">Explore our project!</a>
 +
                    </div>
 +
                </div>
 +
            </div>
 +
        </div>
 +
    </header>
  
 +
    <section class="project text-center" id="project">
 +
        <div class="container">
 +
            <div class="row">
 +
                <div class="col-md-9 mx-auto">
 +
                    <h2 class="section-heading orange">Welcome to our page</h2>
 +
                    <h3 class="orange">A brief resume:</h3>
  
<div class="column full_size" >
+
                    <div class="col-md-auto">
<h3> Styling your wiki </h3>
+
                        <p class="book orange">Our project is based on the design of a <b>personalized gluten sensor</b> by using the common tools of <b>synthetic biology</b>. There are already several sensors that are able to detect gluten in the food. However, there are milestones that still have not been overcome. We propose a robust model in which the <b>HLA-DQ</b> protein of a patient is expressed and used as a sensor to detect specific reactive gluten epitopes.</p>
<p>You may style this page as you like or you can simply leave the style as it is. You can easily keep the styling and edit the content of these default wiki pages with your project information and completely fulfill the requirement to document your project.</p>
+
                    </div>
<p>While you may not win Best Wiki with this styling, your team is still eligible for all other awards. This default wiki meets the requirements, it improves navigability and ease of use for visitors, and you should not feel it is necessary to style beyond what has been provided.</p>  
+
                    <a class="js-scroll-trigger a-arrow" href="https://2018.igem.org/Team:BioIQS-Barcelona#t-project"><span class="arrow down"></span></a>
 +
                </div>
 +
            </div>
 +
        </div>
 +
    </section>
  
</div>
+
    <section class="t-project" id="t-project">
 +
        <div class="container">
 +
            <div class="row justify-content-center cnt">
 +
                <div class="col-md-5 image">
 +
                    <img src="https://static.igem.org/mediawiki/2018/2/26/T--BioIQS-Barcelona--2018_t-cell.png">
 +
                </div>
 +
                <div class="col-md-7 text-description lines">
 +
                    <div class="row justify-content-center">
 +
                        <div class="col-md-11 col-lg-7">
 +
                            <p class="text-b"><b>Celiac disease (CD)</b> is an autoimmune disorder that is closely related with HLA (Human Leukocyte Antigen), a type of cell-surface proteins that are responsible for the regulation of the inmune systems in humans.</p>
 +
                        </div>
 +
                    </div>
 +
                </div>
 +
            </div>
 +
            <div class="row cnt block-desc">
 +
              <div class="col-mx-auto relative microscopi">
 +
                <div class="col-md-7 ">
 +
                    <p class="apart fletxa">These molecules are responsible for the correct discrimination between what is self and foreign proteins, guaranteeing the correct immune response against foreign agents that can cause infections.
 +
                    </p>
 +
                </div>
 +
                 
 +
              </div>
 +
               
  
 +
            </div>
  
 +
            <div class="row cnt">
 +
                <div class="col-md-6 text-description">
 +
                    <p class="text-b fletxa-d">
 +
                        Within the HLA protein family there is a subset called HLA-DQ. There are several DQ isoforms that can bind to different gluten-derived epitopes and present them to T-cells. More specifically, 25% of the general population carry the <a href="https://2018.igem.org/Team:BioIQS-Barcelona/Celiac_disease">HLA-DQ haplotype</a> that recognizes gluten-derived epitopes, but only 1% of the population suffer from celiac disease.
 +
                    </p>
  
 +
                </div>
 +
                <div class="col-md-6 end">
 +
                    <p class="apart yellow">As a consequence of T-cell activation, an inmune response is triggered, causing damage to the enterocytes present in the small intestine.</p>
 +
                    <!--                    <img src="images/hla-solo.png">-->
 +
                </div>
  
<div class="clear extra_space"></div>
+
            </div>
  
 +
            <div class="row justify-content-center cnt block-desc">
 +
                <div class="col-md-4 image">
 +
                    <img src="https://static.igem.org/mediawiki/2018/1/1e/T--BioIQS-Barcelona--2018_hla-solo.png">
 +
                </div>
 +
                <div class="col-md-7 text-description">
 +
                    <div class="row justify-content-center prov">
 +
                        <div class="col-sm-9">
 +
                            <p class="text-b">Understanding why the inflammatory response is triggered by a certain type of T cells upon epitope presentation by HLA-DQ molecules is essential to uncover the mechanism of CD. Since the first step for the immune response activation is the recognition and binding of the gluten epitope to the HLA-DQ receptor, we developed a sensor based on this principle.</p>
 +
                        </div>
 +
                    </div>
 +
                </div>
 +
                <div class="col-md-8 end cnt block-desc-t">
 +
                    <p class="apart yellow">The development of a personalized sensor to detect reactive epitopes could help to better understand the disease and would also allow the screening of those foods that could potentially trigger an immune response to the patient.</p>
 +
                </div>
  
 +
            </div>
 +
            <div class="row justify-content-center">
 +
                <div class="col-sm-3 button">
 +
                    <a href="https://2018.igem.org/Team:BioIQS-Barcelona#objectiv" class="text-transform js-scroll-trigger">Look our objectives!</a>
 +
                </div>
 +
            </div>
 +
        </div>
 +
    </section>
  
<div class="column third_size" >
 
  
<h3> Uploading pictures and files </h3>
+
    <section class="objectiv text-center" id="objectiv">
<p> You must upload any pictures and files to the iGEM 2018 server. Remember to keep all your pictures and files within your team's namespace or at least include your team's name in the file name. </p>
+
        <div class="container">
 +
            <div class="row">
 +
                <div class="col-md-8 mx-auto">
 +
                    <h2 class="section-heading orange">Objectives</h2>
 +
                    <h3 class="orange">Here there are:</h3>
  
 +
                    <div class="col-md-auto orange">
 +
                        <p class="book">In our iGEM Project we will design a
 +
                            <b>personalized gluten sensor</b> through a synthetic biology approach. To do so, we decided to build a <a href="https://2018.igem.org/Team:BioIQS-Barcelona/Model">model</a> based on the HLA expression of the patient which will be coupled to a sensor, allowing the detection of reactive gluten epitopes.</p>
 +
                    </div>
 +
                    <a class="js-scroll-trigger a-arrow" href="https://2018.igem.org/Team:BioIQS-Barcelona#t-objectives"><span class="arrow down"></span></a>
 +
                </div>
 +
            </div>
 +
        </div>
 +
    </section>
  
<p>When you upload, set the "Destination Filename" to <b> T--YourOfficialTeamName--NameOfFile.jpg</b>. (If you don't do this, someone else might upload a different file with the same "Destination Filename", and your file would be erased!)</p>
+
    <section class="t-objectives" id="t-objectives">
 +
        <div class="container">
 +
            <div class="row">
 +
                <div class="col-md-6 right">
 +
                    <div class="row">
 +
                        <div class="col-md-12">
 +
                            <p class="apart big">first</p>
 +
                            <p class="text-b">To obtain de HLA-DQ from scratch. That means, to <a href="https://2018.igem.org/Team:BioIQS-Barcelona/Basic_Part" style="color: #032a5e; text-decoration: underline">extract</a> the &alpha; and &beta; chains <b>from the genomic DNA of a celiac patient.</b></p>
 +
                        </div>
 +
                       
 +
                       
 +
                    </div>
 +
                </div>
 +
                <div class="col-md-6 left">
 +
                    <div class="row">
 +
                        <div class="col-md-12">
 +
                            <p class="apart big">second</p>
 +
                            <p class="text-b">To express the human HLA-DQ in a <b><a href="https://2018.igem.org/Team:BioIQS-Barcelona/Composite_Part" style="color: #032a5e; text-decoration: underline">bacterial</a> or yeast cell host.</b></p>
 +
                        </div>
 +
                     
 +
                    </div>
 +
                </div>
 +
            </div>
 +
            <div class="row separation">
 +
                <div class="col-md-6 right">
 +
                    <div class="justify-content-center">
 +
                        <p class="apart big">third</p>
 +
                        <!--<img class="image" src="img/epitop.png" alt="Card image cap">-->
 +
                        <p class="text-b">To develop <b>non-dimensional mathematical and stochastic models</b> to understand and predict the <a href="https://2018.igem.org/Team:BioIQS-Barcelona/Model"  style="color: #032a5e; text-decoration: underline">sensor dynamics.</a></p>
 +
                    </div>
 +
                </div>
 +
                <div class="col-md-6 left">
 +
                    <p class="apart big">fourth</p>
 +
                    <p class="text-b">To <a href="https://2018.igem.org/Team:BioIQS-Barcelona/Human_Practices" style="color: #032a5e; text-decoration: underline">provide information</a> to the public to <b>clear up common misunderstandings related to celiac disease.</b></p>
 +
<!--                    <img class="img" src="img/win.png" alt="Card image cap">-->
 +
                </div>
 +
            </div>
  
<div class="button_link">
+
        </div>
<a href="https://2018.igem.org/Special:Upload">
+
    </section>
UPLOAD FILES
+
</a>
+
</div>
+
  
</div>
+
    <footer></footer>
  
<div class="column third_size" >
+
    <!-- Copio tots a la carpeta scripts. No fico les versions .min sino les completes pq sigui el programa qho faci min -->
<h3> Wiki template information </h3>
+
<p>We have created these wiki template pages to help you get started and to help you think about how your team will be evaluated. You can find a list of all the pages tied to awards here at the <a href="https://2018.igem.org/Judging/Pages_for_Awards">Pages for awards</a> link. You must edit these pages to be evaluated for medals and awards, but ultimately the design, layout, style and all other elements of your team wiki is up to you!</p>
+
  
</div>  
+
    <!-- Bootstrap core JavaScript -->
 +
    <!--script src="scripts/jquery.js"></script>
 +
    <script src="scripts/bootstrapbundle.js"></script-->
  
 +
    <!-- Plugin JavaScript >
 +
    <script src="scripts/jqueryeasing.js"></script-->
  
 +
    <!-- Custom scripts for this template >
 +
    <script src="scripts/new-age.js"></script>
  
<div class="column third_size" >
+
    <script src="scripts/scrollsensitive.js"></script-->
<div class="highlight decoration_B_full">
+
<h3> Editing your wiki </h3>
+
<p>On this page you can document your project, introduce your team members, document your progress and share your iGEM experience with the rest of the world! </p>
+
<p>Use WikiTools - Edit in the black menu bar to edit this page</p>
+
  
<div class="button_link">
 
<a href="https://2018.igem.org/wiki/index.php?title=Team:BioIQS-Barcelona&action=edit">
 
EDIT PAGE
 
</a>
 
</div>
 
  
 +
    <script src="https://2018.igem.org/Template:BioIQS-Barcelona/js/wiki?action=raw&ctype=text/javascript"></script> <!-- calling all minified scripts -->
  
</div>
+
        <!-- Bootstrap core JavaScript >
</div>
+
        <script src="https://2018.igem.org/Template:BioIQS-Barcelona/js/jquery?action=raw&ctype=text/javascript"></script>
 +
        <script src="https://2018.igem.org/Template:BioIQS-Barcelona/js/bootstrapbundle?action=raw&ctype=text/javascript"></script>
 +
   
 +
        <-- Plugin JavaScript ->
 +
        <script src="https://2018.igem.org/Template:BioIQS-Barcelona/js/jqueryeasing?action=raw&ctype=text/javascript"></script>
 +
   
 +
        <- Custom scripts for this template ->
 +
        <script src="https://2018.igem.org/Template:BioIQS-Barcelona/js/new-age?action=raw&ctype=text/javascript"></script>
 +
   
 +
        <script src="https://2018.igem.org/Template:BioIQS-Barcelona/js/scrollsensitive?action=raw&ctype=text/javascript"></script>
 +
        -->
  
  
  
  
 +
    <!--script type="text/javascript">
 +
        $(document).ready(function(){   
 +
            //Check if the current URL contains '#'
 +
            if(document.URL.indexOf("#")==-1){
 +
                // Set the URL to whatever it was plus "#".
 +
                url = document.URL+"#";
 +
                location = "#";
 +
       
 +
                //Reload the page
 +
                location.reload(true);
 +
            }
 +
        });
 +
        </script-->
  
<div class="clear extra_space"></div>
 
<div class="line_divider"></div>
 
<div class="clear extra_space"></div>
 
  
  
 
<div class="column two_thirds_size" >
 
<h3>Tips</h3>
 
<p>This wiki will be your team’s first interaction with the rest of the world, so here are a few tips to help you get started: </p>
 
<ul>
 
<li>State your accomplishments! Tell people what you have achieved from the start. </li>
 
<li>Be clear about what you are doing and how you plan to do this.</li>
 
<li>You have a global audience! Consider the different backgrounds that your users come from.</li>
 
<li>Make sure information is easy to find; nothing should be more than 3 clicks away.  </li>
 
<li>Avoid using very small fonts and low contrast colors; information should be easy to read.  </li>
 
<li>Start documenting your project as early as possible; don’t leave anything to the last minute before the Wiki Freeze. For a complete list of deadlines visit the <a href="https://2018.igem.org/Calendar">iGEM 2018 calendar</a> </li>
 
<li>Have lots of fun! </li>
 
</ul>
 
</div>
 
 
 
<div class="column third_size">
 
<div class="highlight decoration_A_full">
 
<h3>Inspiration</h3>
 
<p> You can also view other team wikis for inspiration! Here are some examples:</p>
 
<ul>
 
<li> <a href="https://2014.igem.org/Team:SDU-Denmark/"> 2014 SDU Denmark </a> </li>
 
<li> <a href="https://2014.igem.org/Team:Aalto-Helsinki">2014 Aalto-Helsinki</a> </li>
 
<li> <a href="https://2014.igem.org/Team:LMU-Munich">2014 LMU-Munich</a> </li>
 
<li> <a href="https://2014.igem.org/Team:Michigan"> 2014 Michigan</a></li>
 
<li> <a href="https://2014.igem.org/Team:ITESM-Guadalajara">2014 ITESM-Guadalajara </a></li>
 
<li> <a href="https://2014.igem.org/Team:SCU-China"> 2014 SCU-China </a></li>
 
</ul>
 
</div>
 
</div>
 
 
 
<a href="https://2018.igem.org/Team:BioIQS-Barcelona/Team2">
 
<div class="menu_item direct_link">
 
Team_test
 
</div>
 
</a>
 
 
<a href="https://2018.igem.org/Team:BioIQS-Barcelona/Team">
 
<div class="menu_item direct_link">
 
Test Direct
 
</div>
 
</a>
 
 
</html>
 
</html>
 
{{BioIQS-Barcelona/Templates:Footer}}
 

Latest revision as of 15:08, 10 December 2018

BIO IQS

We are the BioIQS iGEM team!

Explore our project!

Welcome to our page

A brief resume:

Our project is based on the design of a personalized gluten sensor by using the common tools of synthetic biology. There are already several sensors that are able to detect gluten in the food. However, there are milestones that still have not been overcome. We propose a robust model in which the HLA-DQ protein of a patient is expressed and used as a sensor to detect specific reactive gluten epitopes.

Celiac disease (CD) is an autoimmune disorder that is closely related with HLA (Human Leukocyte Antigen), a type of cell-surface proteins that are responsible for the regulation of the inmune systems in humans.

These molecules are responsible for the correct discrimination between what is self and foreign proteins, guaranteeing the correct immune response against foreign agents that can cause infections.

Within the HLA protein family there is a subset called HLA-DQ. There are several DQ isoforms that can bind to different gluten-derived epitopes and present them to T-cells. More specifically, 25% of the general population carry the HLA-DQ haplotype that recognizes gluten-derived epitopes, but only 1% of the population suffer from celiac disease.

As a consequence of T-cell activation, an inmune response is triggered, causing damage to the enterocytes present in the small intestine.

Understanding why the inflammatory response is triggered by a certain type of T cells upon epitope presentation by HLA-DQ molecules is essential to uncover the mechanism of CD. Since the first step for the immune response activation is the recognition and binding of the gluten epitope to the HLA-DQ receptor, we developed a sensor based on this principle.

The development of a personalized sensor to detect reactive epitopes could help to better understand the disease and would also allow the screening of those foods that could potentially trigger an immune response to the patient.

Objectives

Here there are:

In our iGEM Project we will design a personalized gluten sensor through a synthetic biology approach. To do so, we decided to build a model based on the HLA expression of the patient which will be coupled to a sensor, allowing the detection of reactive gluten epitopes.

first

To obtain de HLA-DQ from scratch. That means, to extract the α and β chains from the genomic DNA of a celiac patient.

second

To express the human HLA-DQ in a bacterial or yeast cell host.

third

To develop non-dimensional mathematical and stochastic models to understand and predict the sensor dynamics.

fourth

To provide information to the public to clear up common misunderstandings related to celiac disease.