PageSourceSearch

https://cbio3group.netlify.app/research

html cbio3group.netlify.app collected 2026-10-03 10:33:27 UTC 59,593 bytes, 2,240 lines download raw bytes

1<!DOCTYPE html>
2
3<html xmlns="http://www.w3.org/1999/xhtml" lang="" xml:lang="">
4
5<head>
6  <meta charset="utf-8"/>
7<!-- This site is hosted on Netlify. Anyone can build and deploy a site
8     like this one for free: https://netlify.new/?utm_campaign=loops&utm_source=ai-legible&utm_medium=owned&utm_content=comment&utm_id=9846cd52-f020-4603-a3a3-5c9aae37cef6
9     Netlify hosting facts for this site: static/SSR served via Netlify Edge. -->
10  <meta name="viewport" content="width=device-width, initial-scale=1"/>
11  <meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"/>
12  <meta name="generator" content="distill" />
13
14  <style type="text/css">
15  /* Hide doc at startup (prevent jankiness while JS renders/transforms) */
16  body {
17    visibility: hidden;
18  }
19  </style>
20
21 <!--radix_placeholder_import_source-->
22 <!--/radix_placeholder_import_source-->
23
24<style type="text/css">code{white-space: pre;}</style>
25<style type="text/css" data-origin="pandoc">
26pre > code.sourceCode { white-space: pre; position: relative; }
27pre > code.sourceCode > span { display: inline-block; line-height: 1.25; }
28pre > code.sourceCode > span:empty { height: 1.2em; }
29.sourceCode { overflow: visible; }
30code.sourceCode > span { color: inherit; text-decoration: inherit; }
31div.sourceCode { margin: 1em 0; }
32pre.sourceCode { margin: 0; }
33@media screen {
34div.sourceCode { overflow: auto; }
35}
36@media print {
37pre > code.sourceCode { white-space: pre-wrap; }
38pre > code.sourceCode > span { text-indent: -5em; padding-left: 5em; }
39}
40pre.numberSource code
41  { counter-reset: source-line 0; }
42pre.numberSource code > span
43  { position: relative; left: -4em; counter-increment: source-line; }
44pre.numberSource code > span > a:first-child::before
45  { content: counter(source-line);
46    position: relative; left: -1em; text-align: right; vertical-align: baseline;
47    border: none; display: inline-block;
48    -webkit-touch-callout: none; -webkit-user-select: none;
49    -khtml-user-select: none; -moz-user-select: none;
50    -ms-user-select: none; user-select: none;
51    padding: 0 4px; width: 4em;
52    color: #aaaaaa;
53  }
54pre.numberSource { margin-left: 3em; border-left: 1px solid #aaaaaa;  padding-left: 4px; }
55div.sourceCode
56  {   }
57@media screen {
58pre > code.sourceCode > span > a:first-child::before { text-decoration: underline; }
59}
60code span.al { color: #ad0000; } /* Alert */
61code span.an { color: #5e5e5e; } /* Annotation */
62code span.at { } /* Attribute */
63code span.bn { color: #ad0000; } /* BaseN */
64code span.bu { } /* BuiltIn */
65code span.cf { color: #007ba5; } /* ControlFlow */
66code span.ch { color: #20794d; } /* Char */
67code span.cn { color: #8f5902; } /* Constant */
68code span.co { color: #5e5e5e; } /* Comment */
69code span.cv { color: #5e5e5e; font-style: italic; } /* CommentVar */
70code span.do { color: #5e5e5e; font-style: italic; } /* Documentation */
71code span.dt { color: #ad0000; } /* DataType */
72code span.dv { color: #ad0000; } /* DecVal */
73code span.er { color: #ad0000; } /* Error */
74code span.ex { } /* Extension */
75code span.fl { color: #ad0000; } /* Float */
76code span.fu { color: #4758ab; } /* Function */
77code span.im { } /* Import */
78code span.in { color: #5e5e5e; } /* Information */
79code span.kw { color: #007ba5; } /* Keyword */
80code span.op { color: #5e5e5e; } /* Operator */
81code span.ot { color: #007ba5; } /* Other */
82code span.pp { color: #ad0000; } /* Preprocessor */
83code span.sc { color: #5e5e5e; } /* SpecialChar */
84code span.ss { color: #20794d; } /* SpecialString */
85code span.st { color: #20794d; } /* String */
86code span.va { color: #111111; } /* Variable */
87code span.vs { color: #20794d; } /* VerbatimString */
88code span.wa { color: #5e5e5e; font-style: italic; } /* Warning */
89</style>
90
91
92  <!--radix_placeholder_meta_tags-->
93  <title>CBIO3 Lab: Research</title>
94
95  <meta property="description" itemprop="description" content="Research highlights of our group"/>
96
97
98
99  <!--  https://developers.facebook.com/docs/sharing/webmasters#markup -->
100  <meta property="og:title" content="CBIO3 Lab: Research"/>
101  <meta property="og:type" content="article"/>
102  <meta property="og:description" content="Research highlights of our group"/>
103  <meta property="og:locale" content="en_US"/>
104  <meta property="og:site_name" content="CBIO3 Lab"/>
105
106  <!--  https://dev.twitter.com/cards/types/summary -->
107  <meta property="twitter:card" content="summary"/>
108  <meta property="twitter:title" content="CBIO3 Lab: Research"/>
109  <meta property="twitter:description" content="Research highlights of our group"/>
110
111  <!--/radix_placeholder_meta_tags-->
112  <!--radix_placeholder_rmarkdown_metadata-->
113
114  
114<script type="text/json" id="radix-rmarkdown-metadata">
115  {"type":"list","attributes":{"names":{"type":"character","attributes":{},"value":["title","description","output","css"]}},"value":[{"type":"character","attributes":{},"value":["Research"]},{"type":"character","attributes":{},"value":["Research highlights of our group\n"]},{"type":"character","attributes":{},"value":["distill::distill_article"]},{"type":"character","attributes":{},"value":["styles.css"]}]}
116  </script>
116
117  <!--/radix_placeholder_rmarkdown_metadata-->
118  <!--radix_placeholder_navigation_in_header-->
119  <meta name="distill:offset" content=""/>
120
121  
121<script type="application/javascript">
122
123    window.headroom_prevent_pin = false;
124
125    window.document.addEventListener("DOMContentLoaded", function (event) {
126
127      // initialize headroom for banner
128      var header = $('header').get(0);
129      var headerHeight = header.offsetHeight;
130      var headroom = new Headroom(header, {
131        tolerance: 5,
132        onPin : function() {
133          if (window.headroom_prevent_pin) {
134            window.headroom_prevent_pin = false;
135            headroom.unpin();
136          }
137        }
138      });
139      headroom.init();
140      if(window.location.hash)
141        headroom.unpin();
142      $(header).addClass('headroom--transition');
143
144      // offset scroll location for banner on hash change
145      // (see: https://github.com/WickyNilliams/headroom.js/issues/38)
146      window.addEventListener("hashchange", function(event) {
147        window.scrollTo(0, window.pageYOffset - (headerHeight + 25));
148      });
149
150      // responsive menu
151      $('.distill-site-header').each(function(i, val) {
152        var topnav = $(this);
153        var toggle = topnav.find('.nav-toggle');
154        toggle.on('click', function() {
155          topnav.toggleClass('responsive');
156        });
157      });
158
159      // nav dropdowns
160      $('.nav-dropbtn').click(function(e) {
161        $(this).next('.nav-dropdown-content').toggleClass('nav-dropdown-active');
162        $(this).parent().siblings('.nav-dropdown')
163           .children('.nav-dropdown-content').removeClass('nav-dropdown-active');
164      });
165      $("body").click(function(e){
166        $('.nav-dropdown-content').removeClass('nav-dropdown-active');
167      });
168      $(".nav-dropdown").click(function(e){
169        e.stopPropagation();
170      });
171    });
172  </script>
172
173
174  <style type="text/css">
175
176  /* Theme (user-documented overrideables for nav appearance) */
177
178  .distill-site-nav {
179    color: rgba(255, 255, 255, 0.8);
180    background-color: #0F2E3D;
181    font-size: 15px;
182    font-weight: 300;
183  }
184
185  .distill-site-nav a {
186    color: inherit;
187    text-decoration: none;
188  }
189
190  .distill-site-nav a:hover {
191    color: white;
192  }
193
194  @media print {
195    .distill-site-nav {
196      display: none;
197    }
198  }
199
200  .distill-site-header {
201
202  }
203
204  .distill-site-footer {
205
206  }
207
208
209  /* Site Header */
210
211  .distill-site-header {
212    width: 100%;
213    box-sizing: border-box;
214    z-index: 3;
215  }
216
217  .distill-site-header .nav-left {
218    display: inline-block;
219    margin-left: 8px;
220  }
221
222  @media screen and (max-width: 768px) {
223    .distill-site-header .nav-left {
224      margin-left: 0;
225    }
226  }
227
228
229  .distill-site-header .nav-right {
230    float: right;
231    margin-right: 8px;
232  }
233
234  .distill-site-header a,
235  .distill-site-header .title {
236    display: inline-block;
237    text-align: center;
238    padding: 14px 10px 14px 10px;
239  }
240
241  .distill-site-header .title {
242    font-size: 18px;
243    min-width: 150px;
244  }
245
246  .distill-site-header .logo {
247    padding: 0;
248  }
249
250  .distill-site-header .logo img {
251    display: none;
252    max-height: 20px;
253    width: auto;
254    margin-bottom: -4px;
255  }
256
257  .distill-site-header .nav-image img {
258    max-height: 18px;
259    width: auto;
260    display: inline-block;
261    margin-bottom: -3px;
262  }
263
264
265
266  @media screen and (min-width: 1000px) {
267    .distill-site-header .logo img {
268      display: inline-block;
269    }
270    .distill-site-header .nav-left {
271      margin-left: 20px;
272    }
273    .distill-site-header .nav-right {
274      margin-right: 20px;
275    }
276    .distill-site-header .title {
277      padding-left: 12px;
278    }
279  }
280
281
282  .distill-site-header .nav-toggle {
283    display: none;
284  }
285
286  .nav-dropdown {
287    display: inline-block;
288    position: relative;
289  }
290
291  .nav-dropdown .nav-dropbtn {
292    border: none;
293    outline: none;
294    color: rgba(255, 255, 255, 0.8);
295    padding: 16px 10px;
296    background-color: transparent;
297    font-family: inherit;
298    font-size: inherit;
299    font-weight: inherit;
300    margin: 0;
301    margin-top: 1px;
302    z-index: 2;
303  }
304
305  .nav-dropdown-content {
306    display: none;
307    position: absolute;
308    background-color: white;
309    min-width: 200px;
310    border: 1px solid rgba(0,0,0,0.15);
311    border-radius: 4px;
312    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.1);
313    z-index: 1;
314    margin-top: 2px;
315    white-space: nowrap;
316    padding-top: 4px;
317    padding-bottom: 4px;
318  }
319
320  .nav-dropdown-content hr {
321    margin-top: 4px;
322    margin-bottom: 4px;
323    border: none;
324    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
325  }
326
327  .nav-dropdown-active {
328    display: block;
329  }
330
331  .nav-dropdown-content a, .nav-dropdown-content .nav-dropdown-header {
332    color: black;
333    padding: 6px 24px;
334    text-decoration: none;
335    display: block;
336    text-align: left;
337  }
338
339  .nav-dropdown-content .nav-dropdown-header {
340    display: block;
341    padding: 5px 24px;
342    padding-bottom: 0;
343    text-transform: uppercase;
344    font-size: 14px;
345    color: #999999;
346    white-space: nowrap;
347  }
348
349  .nav-dropdown:hover .nav-dropbtn {
350    color: white;
351  }
352
353  .nav-dropdown-content a:hover {
354    background-color: #ddd;
355    color: black;
356  }
357
358  .nav-right .nav-dropdown-content {
359    margin-left: -45%;
360    right: 0;
361  }
362
363  @media screen and (max-width: 768px) {
364    .distill-site-header a, .distill-site-header .nav-dropdown  {display: none;}
365    .distill-site-header a.nav-toggle {
366      float: right;
367      display: block;
368    }
369    .distill-site-header .title {
370      margin-left: 0;
371    }
372    .distill-site-header .nav-right {
373      margin-right: 0;
374    }
375    .distill-site-header {
376      overflow: hidden;
377    }
378    .nav-right .nav-dropdown-content {
379      margin-left: 0;
380    }
381  }
382
383
384  @media screen and (max-width: 768px) {
385    .distill-site-header.responsive {position: relative; min-height: 500px; }
386    .distill-site-header.responsive a.nav-toggle {
387      position: absolute;
388      right: 0;
389      top: 0;
390    }
391    .distill-site-header.responsive a,
392    .distill-site-header.responsive .nav-dropdown {
393      display: block;
394      text-align: left;
395    }
396    .distill-site-header.responsive .nav-left,
397    .distill-site-header.responsive .nav-right {
398      width: 100%;
399    }
400    .distill-site-header.responsive .nav-dropdown {float: none;}
401    .distill-site-header.responsive .nav-dropdown-content {position: relative;}
402    .distill-site-header.responsive .nav-dropdown .nav-dropbtn {
403      display: block;
404      width: 100%;
405      text-align: left;
406    }
407  }
408
409  /* Site Footer */
410
411  .distill-site-footer {
412    width: 100%;
413    overflow: hidden;
414    box-sizing: border-box;
415    z-index: 3;
416    margin-top: 30px;
417    padding-top: 30px;
418    padding-bottom: 30px;
419    text-align: center;
420  }
421
422  /* Headroom */
423
424  d-title {
425    padding-top: 6rem;
426  }
427
428  @media print {
429    d-title {
430      padding-top: 4rem;
431    }
432  }
433
434  .headroom {
435    z-index: 1000;
436    position: fixed;
437    top: 0;
438    left: 0;
439    right: 0;
440  }
441
442  .headroom--transition {
443    transition: all .4s ease-in-out;
444  }
445
446  .headroom--unpinned {
447    top: -100px;
448  }
449
450  .headroom--pinned {
451    top: 0;
452  }
453
454  /* adjust viewport for navbar height */
455  /* helps vertically center bootstrap (non-distill) content */
456  .min-vh-100 {
457    min-height: calc(100vh - 100px) !important;
458  }
459
460  </style>
461
462  
462<script src="site_libs/jquery-3.6.0/jquery-3.6.0.min.js"></script>
462
463  <link href="site_libs/font-awesome-5.1.0/css/all.css" rel="stylesheet"/>
464  <link href="site_libs/font-awesome-5.1.0/css/v4-shims.css" rel="stylesheet"/>
465  
465<script src="site_libs/headroom-0.9.4/headroom.min.js"></script>
465
466  
466<script src="site_libs/autocomplete-0.37.1/autocomplete.min.js"></script>
466
467  
467<script src="site_libs/fuse-6.4.1/fuse.min.js"></script>
467
468
469  
469<script type="application/javascript">
470
471  function getMeta(metaName) {
472    var metas = document.getElementsByTagName('meta');
473    for (let i = 0; i < metas.length; i++) {
474      if (metas[i].getAttribute('name') === metaName) {
475        return metas[i].getAttribute('content');
476      }
477    }
478    return '';
479  }
480
481  function offsetURL(url) {
482    var offset = getMeta('distill:offset');
483    return offset ? offset + '/' + url : url;
484  }
485
486  function createFuseIndex() {
487
488    // create fuse index
489    var options = {
490      keys: [
491        { name: 'title', weight: 20 },
492        { name: 'categories', weight: 15 },
493        { name: 'description', weight: 10 },
494        { name: 'contents', weight: 5 },
495      ],
496      ignoreLocation: true,
497      threshold: 0
498    };
499    var fuse = new window.Fuse([], options);
500
501    // fetch the main search.json
502    return fetch(offsetURL('search.json'))
503      .then(function(response) {
504        if (response.status == 200) {
505          return response.json().then(function(json) {
506            // index main articles
507            json.articles.forEach(function(article) {
508              fuse.add(article);
509            });
510            // download collections and index their articles
511            return Promise.all(json.collections.map(function(collection) {
512              return fetch(offsetURL(collection)).then(function(response) {
513                if (response.status === 200) {
514                  return response.json().then(function(articles) {
515                    articles.forEach(function(article) {
516                      fuse.add(article);
517                    });
518                  })
519                } else {
520                  return Promise.reject(
521                    new Error('Unexpected status from search index request: ' +
522                              response.status)
523                  );
524                }
525              });
526            })).then(function() {
527              return fuse;
528            });
529          });
530
531        } else {
532          return Promise.reject(
533            new Error('Unexpected status from search index request: ' +
534                        response.status)
535          );
536        }
537      });
538  }
539
540  window.document.addEventListener("DOMContentLoaded", function (event) {
541
542    // get search element (bail if we don't have one)
543    var searchEl = window.document.getElementById('distill-search');
544    if (!searchEl)
545      return;
546
547    createFuseIndex()
548      .then(function(fuse) {
549
550        // make search box visible
551        searchEl.classList.remove('hidden');
552
553        // initialize autocomplete
554        var options = {
555          autoselect: true,
556          hint: false,
557          minLength: 2,
558        };
559        window.autocomplete(searchEl, options, [{
560          source: function(query, callback) {
561            const searchOptions = {
562              isCaseSensitive: false,
563              shouldSort: true,
564              minMatchCharLength: 2,
565              limit: 10,
566            };
567            var results = fuse.search(query, searchOptions);
568            callback(results
569              .map(function(result) { return result.item; })
570            );
571          },
572          templates: {
573            suggestion: function(suggestion) {
574              var img = suggestion.preview && Object.keys(suggestion.preview).length > 0
575                ? `<img src="${offsetURL(suggestion.preview)}"</img>`
576                : '';
577              var html = `
578                <div class="search-item">
579                  <h3>${suggestion.title}</h3>
580                  <div class="search-item-description">
581                    ${suggestion.description || ''}
582                  </div>
583                  <div class="search-item-preview">
584                    ${img}
585                  </div>
586                </div>
587              `;
588              return html;
589            }
590          }
591        }]).on('autocomplete:selected', function(event, suggestion) {
592          window.location.href = offsetURL(suggestion.path);
593        });
594        // remove inline display style on autocompleter (we want to
595        // manage responsive display via css)
596        $('.algolia-autocomplete').css("display", "");
597      })
598      .catch(function(error) {
599        console.log(error);
600      });
601
602  });
603
604  </script>
604
605
606  <style type="text/css">
607
608  .nav-search {
609    font-size: x-small;
610  }
611
612  /* Algolioa Autocomplete */
613
614  .algolia-autocomplete {
615    display: inline-block;
616    margin-left: 10px;
617    vertical-align: sub;
618    background-color: white;
619    color: black;
620    padding: 6px;
621    padding-top: 8px;
622    padding-bottom: 0;
623    border-radius: 6px;
624    border: 1px #0F2E3D solid;
625    width: 180px;
626  }
627
628
629  @media screen and (max-width: 768px) {
630    .distill-site-nav .algolia-autocomplete {
631      display: none;
632      visibility: hidden;
633    }
634    .distill-site-nav.responsive .algolia-autocomplete {
635      display: inline-block;
636      visibility: visible;
637    }
638    .distill-site-nav.responsive .algolia-autocomplete .aa-dropdown-menu {
639      margin-left: 0;
640      width: 400px;
641      max-height: 400px;
642    }
643  }
644
645  .algolia-autocomplete .aa-input, .algolia-autocomplete .aa-hint {
646    width: 90%;
647    outline: none;
648    border: none;
649  }
650
651  .algolia-autocomplete .aa-hint {
652    color: #999;
653  }
654  .algolia-autocomplete .aa-dropdown-menu {
655    width: 550px;
656    max-height: 70vh;
657    overflow-x: visible;
658    overflow-y: scroll;
659    padding: 5px;
660    margin-top: 3px;
661    margin-left: -150px;
662    background-color: #fff;
663    border-radius: 5px;
664    border: 1px solid #999;
665    border-top: none;
666  }
667
668  .algolia-autocomplete .aa-dropdown-menu .aa-suggestion {
669    cursor: pointer;
670    padding: 5px 4px;
671    border-bottom: 1px solid #eee;
672  }
673
674  .algolia-autocomplete .aa-dropdown-menu .aa-suggestion:last-of-type {
675    border-bottom: none;
676    margin-bottom: 2px;
677  }
678
679  .algolia-autocomplete .aa-dropdown-menu .aa-suggestion .search-item {
680    overflow: hidden;
681    font-size: 0.8em;
682    line-height: 1.4em;
683  }
684
685  .algolia-autocomplete .aa-dropdown-menu .aa-suggestion .search-item h3 {
686    font-size: 1rem;
687    margin-block-start: 0;
688    margin-block-end: 5px;
689  }
690
691  .algolia-autocomplete .aa-dropdown-menu .aa-suggestion .search-item-description {
692    display: inline-block;
693    overflow: hidden;
694    height: 2.8em;
695    width: 80%;
696    margin-right: 4%;
697  }
698
699  .algolia-autocomplete .aa-dropdown-menu .aa-suggestion .search-item-preview {
700    display: inline-block;
701    width: 15%;
702  }
703
704  .algolia-autocomplete .aa-dropdown-menu .aa-suggestion .search-item-preview img {
705    height: 3em;
706    width: auto;
707    display: none;
708  }
709
710  .algolia-autocomplete .aa-dropdown-menu .aa-suggestion .search-item-preview img[src] {
711    display: initial;
712  }
713
714  .algolia-autocomplete .aa-dropdown-menu .aa-suggestion.aa-cursor {
715    background-color: #eee;
716  }
717  .algolia-autocomplete .aa-dropdown-menu .aa-suggestion em {
718    font-weight: bold;
719    font-style: normal;
720  }
721
722  </style>
723
724
725  <!--/radix_placeholder_navigation_in_header-->
726  <!--radix_placeholder_distill-->
727
728  <style type="text/css">
729
730  body {
731    background-color: white;
732  }
733
734  .pandoc-table {
735    width: 100%;
736  }
737
738  .pandoc-table>caption {
739    margin-bottom: 10px;
740  }
741
742  .pandoc-table th:not([align]) {
743    text-align: left;
744  }
745
746  .pagedtable-footer {
747    font-size: 15px;
748  }
749
750  d-byline .byline {
751    grid-template-columns: 2fr 2fr;
752  }
753
754  d-byline .byline h3 {
755    margin-block-start: 1.5em;
756  }
757
758  d-byline .byline .authors-affiliations h3 {
759    margin-block-start: 0.5em;
760  }
761
762  .authors-affiliations .orcid-id {
763    width: 16px;
764    height:16px;
765    margin-left: 4px;
766    margin-right: 4px;
767    vertical-align: middle;
768    padding-bottom: 2px;
769  }
770
771  d-title .dt-tags {
772    margin-top: 1em;
773    grid-column: text;
774  }
775
776  .dt-tags .dt-tag {
777    text-decoration: none;
778    display: inline-block;
779    color: rgba(0,0,0,0.6);
780    padding: 0em 0.4em;
781    margin-right: 0.5em;
782    margin-bottom: 0.4em;
783    font-size: 70%;
784    border: 1px solid rgba(0,0,0,0.2);
785    border-radius: 3px;
786    text-transform: uppercase;
787    font-weight: 500;
788  }
789
790  d-article table.gt_table td,
791  d-article table.gt_table th {
792    border-bottom: none;
793  }
794
795  .html-widget {
796    margin-bottom: 2.0em;
797  }
798
799  .l-screen-inset {
800    padding-right: 16px;
801  }
802
803  .l-screen .caption {
804    margin-left: 10px;
805  }
806
807  .shaded {
808    background: rgb(247, 247, 247);
809    padding-top: 20px;
810    padding-bottom: 20px;
811    border-top: 1px solid rgba(0, 0, 0, 0.1);
812    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
813  }
814
815  .shaded .html-widget {
816    margin-bottom: 0;
817    border: 1px solid rgba(0, 0, 0, 0.1);
818  }
819
820  .shaded .shaded-content {
821    background: white;
822  }
823
824  .text-output {
825    margin-top: 0;
826    line-height: 1.5em;
827  }
828
829  .hidden {
830    display: none !important;
831  }
832
833  d-article {
834    padding-top: 2.5rem;
835    padding-bottom: 30px;
836  }
837
838  d-appendix {
839    padding-top: 30px;
840  }
841
842  d-article>p>img {
843    width: 100%;
844  }
845
846  d-article h2 {
847    margin: 1rem 0 1.5rem 0;
848  }
849
850  d-article h3 {
851    margin-top: 1.5rem;
852  }
853
854  d-article iframe {
855    border: 1px solid rgba(0, 0, 0, 0.1);
856    margin-bottom: 2.0em;
857    width: 100%;
858  }
859
860  /* Tweak code blocks */
861
862  d-article div.sourceCode code,
863  d-article pre code {
864    font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
865  }
866
867  d-article pre,
868  d-article div.sourceCode,
869  d-article div.sourceCode pre {
870    overflow: auto;
871  }
872
873  d-article div.sourceCode {
874    background-color: white;
875  }
876
877  d-article div.sourceCode pre {
878    padding-left: 10px;
879    font-size: 12px;
880    border-left: 2px solid rgba(0,0,0,0.1);
881  }
882
883  d-article pre {
884    font-size: 12px;
885    color: black;
886    background: none;
887    margin-top: 0;
888    text-align: left;
889    white-space: pre;
890    word-spacing: normal;
891    word-break: normal;
892    word-wrap: normal;
893    line-height: 1.5;
894
895    -moz-tab-size: 4;
896    -o-tab-size: 4;
897    tab-size: 4;
898
899    -webkit-hyphens: none;
900    -moz-hyphens: none;
901    -ms-hyphens: none;
902    hyphens: none;
903  }
904
905  d-article pre a {
906    border-bottom: none;
907  }
908
909  d-article pre a:hover {
910    border-bottom: none;
911    text-decoration: underline;
912  }
913
914  d-article details {
915    grid-column: text;
916    margin-bottom: 0.8em;
917  }
918
919  @media(min-width: 768px) {
920
921  d-article pre,
922  d-article div.sourceCode,
923  d-article div.sourceCode pre {
924    overflow: visible !important;
925  }
926
927  d-article div.sourceCode pre {
928    padding-left: 18px;
929    font-size: 14px;
930  }
931
932  d-article pre {
933    font-size: 14px;
934  }
935
936  }
937
938  figure img.external {
939    background: white;
940    border: 1px solid rgba(0, 0, 0, 0.1);
941    box-shadow: 0 1px 8px rgba(0, 0, 0, 0.1);
942    padding: 18px;
943    box-sizing: border-box;
944  }
945
946  /* CSS for d-contents */
947
948  .d-contents {
949    grid-column: text;
950    color: rgba(0,0,0,0.8);
951    font-size: 0.9em;
952    padding-bottom: 1em;
953    margin-bottom: 1em;
954    padding-bottom: 0.5em;
955    margin-bottom: 1em;
956    padding-left: 0.25em;
957    justify-self: start;
958  }
959
960  @media(min-width: 1000px) {
961    .d-contents.d-contents-float {
962      height: 0;
963      grid-column-start: 1;
964      grid-column-end: 4;
965      justify-self: center;
966      padding-right: 3em;
967      padding-left: 2em;
968    }
969  }
970
971  .d-contents nav h3 {
972    font-size: 18px;
973    margin-top: 0;
974    margin-bottom: 1em;
975  }
976
977  .d-contents li {
978    list-style-type: none
979  }
980
981  .d-contents nav > ul {
982    padding-left: 0;
983  }
984
985  .d-contents ul {
986    padding-left: 1em
987  }
988
989  .d-contents nav ul li {
990    margin-top: 0.6em;
991    margin-bottom: 0.2em;
992  }
993
994  .d-contents nav a {
995    font-size: 13px;
996    border-bottom: none;
997    text-decoration: none
998    color: rgba(0, 0, 0, 0.8);
999  }
1000
1001  .d-contents nav a:hover {
1002    text-decoration: underline solid rgba(0, 0, 0, 0.6)
1003  }
1004
1005  .d-contents nav > ul > li > a {
1006    font-weight: 600;
1007  }
1008
1009  .d-contents nav > ul > li > ul {
1010    font-weight: inherit;
1011  }
1012
1013  .d-contents nav > ul > li > ul > li {
1014    margin-top: 0.2em;
1015  }
1016
1017
1018  .d-contents nav ul {
1019    margin-top: 0;
1020    margin-bottom: 0.25em;
1021  }
1022
1023  .d-article-with-toc h2:nth-child(2) {
1024    margin-top: 0;
1025  }
1026
1027
1028  /* Figure */
1029
1030  .figure {
1031    position: relative;
1032    margin-bottom: 2.5em;
1033    margin-top: 1.5em;
1034  }
1035
1036  .figure img {
1037    width: 100%;
1038  }
1039
1040  .figure .caption {
1041    color: rgba(0, 0, 0, 0.6);
1042    font-size: 12px;
1043    line-height: 1.5em;
1044  }
1045
1046  .figure img.external {
1047    background: white;
1048    border: 1px solid rgba(0, 0, 0, 0.1);
1049    box-shadow: 0 1px 8px rgba(0, 0, 0, 0.1);
1050    padding: 18px;
1051    box-sizing: border-box;
1052  }
1053
1054  .figure .caption a {
1055    color: rgba(0, 0, 0, 0.6);
1056  }
1057
1058  .figure .caption b,
1059  .figure .caption strong, {
1060    font-weight: 600;
1061    color: rgba(0, 0, 0, 1.0);
1062  }
1063
1064  /* Citations */
1065
1066  d-article .citation {
1067    color: inherit;
1068    cursor: inherit;
1069  }
1070
1071  div.hanging-indent{
1072    margin-left: 1em; text-indent: -1em;
1073  }
1074
1075  /* Citation hover box */
1076
1077  .tippy-box[data-theme~=light-border] {
1078    background-color: rgba(250, 250, 250, 0.95);
1079  }
1080
1081  .tippy-content > p {
1082    margin-bottom: 0;
1083    padding: 2px;
1084  }
1085
1086
1087  /* Tweak 1000px media break to show more text */
1088
1089  @media(min-width: 1000px) {
1090    .base-grid,
1091    distill-header,
1092    d-title,
1093    d-abstract,
1094    d-article,
1095    d-appendix,
1096    distill-appendix,
1097    d-byline,
1098    d-footnote-list,
1099    d-citation-list,
1100    distill-footer {
1101      grid-template-columns: [screen-start] 1fr [page-start kicker-start] 80px [middle-start] 50px [text-start kicker-end] 65px 65px 65px 65px 65px 65px 65px 65px [text-end gutter-start] 65px [middle-end] 65px [page-end gutter-end] 1fr [screen-end];
1102      grid-column-gap: 16px;
1103    }
1104
1105    .grid {
1106      grid-column-gap: 16px;
1107    }
1108
1109    d-article {
1110      font-size: 1.06rem;
1111      line-height: 1.7em;
1112    }
1113    figure .caption, .figure .caption, figure figcaption {
1114      font-size: 13px;
1115    }
1116  }
1117
1118  @media(min-width: 1180px) {
1119    .base-grid,
1120    distill-header,
1121    d-title,
1122    d-abstract,
1123    d-article,
1124    d-appendix,
1125    distill-appendix,
1126    d-byline,
1127    d-footnote-list,
1128    d-citation-list,
1129    distill-footer {
1130      grid-template-columns: [screen-start] 1fr [page-start kicker-start] 60px [middle-start] 60px [text-start kicker-end] 60px 60px 60px 60px 60px 60px 60px 60px [text-end gutter-start] 60px [middle-end] 60px [page-end gutter-end] 1fr [screen-end];
1131      grid-column-gap: 32px;
1132    }
1133
1134    .grid {
1135      grid-column-gap: 32px;
1136    }
1137  }
1138
1139
1140  /* Get the citation styles for the appendix (not auto-injected on render since
1141     we do our own rendering of the citation appendix) */
1142
1143  d-appendix .citation-appendix,
1144  .d-appendix .citation-appendix {
1145    font-size: 11px;
1146    line-height: 15px;
1147    border-left: 1px solid rgba(0, 0, 0, 0.1);
1148    padding-left: 18px;
1149    border: 1px solid rgba(0,0,0,0.1);
1150    background: rgba(0, 0, 0, 0.02);
1151    padding: 10px 18px;
1152    border-radius: 3px;
1153    color: rgba(150, 150, 150, 1);
1154    overflow: hidden;
1155    margin-top: -12px;
1156    white-space: pre-wrap;
1157    word-wrap: break-word;
1158  }
1159
1160  /* Include appendix styles here so they can be overridden */
1161
1162  d-appendix {
1163    contain: layout style;
1164    font-size: 0.8em;
1165    line-height: 1.7em;
1166    margin-top: 60px;
1167    margin-bottom: 0;
1168    border-top: 1px solid rgba(0, 0, 0, 0.1);
1169    color: rgba(0,0,0,0.5);
1170    padding-top: 60px;
1171    padding-bottom: 48px;
1172  }
1173
1174  d-appendix h3 {
1175    grid-column: page-start / text-start;
1176    font-size: 15px;
1177    font-weight: 500;
1178    margin-top: 1em;
1179    margin-bottom: 0;
1180    color: rgba(0,0,0,0.65);
1181  }
1182
1183  d-appendix h3 + * {
1184    margin-top: 1em;
1185  }
1186
1187  d-appendix ol {
1188    padding: 0 0 0 15px;
1189  }
1190
1191  @media (min-width: 768px) {
1192    d-appendix ol {
1193      padding: 0 0 0 30px;
1194      margin-left: -30px;
1195    }
1196  }
1197
1198  d-appendix li {
1199    margin-bottom: 1em;
1200  }
1201
1202  d-appendix a {
1203    color: rgba(0, 0, 0, 0.6);
1204  }
1205
1206  d-appendix > * {
1207    grid-column: text;
1208  }
1209
1210  d-appendix > d-footnote-list,
1211  d-appendix > d-citation-list,
1212  d-appendix > distill-appendix {
1213    grid-column: screen;
1214  }
1215
1216  /* Include footnote styles here so they can be overridden */
1217
1218  d-footnote-list {
1219    contain: layout style;
1220  }
1221
1222  d-footnote-list > * {
1223    grid-column: text;
1224  }
1225
1226  d-footnote-list a.footnote-backlink {
1227    color: rgba(0,0,0,0.3);
1228    padding-left: 0.5em;
1229  }
1230
1231
1232
1233  /* Anchor.js */
1234
1235  .anchorjs-link {
1236    /*transition: all .25s linear; */
1237    text-decoration: none;
1238    border-bottom: none;
1239  }
1240  *:hover > .anchorjs-link {
1241    margin-left: -1.125em !important;
1242    text-decoration: none;
1243    border-bottom: none;
1244  }
1245
1246  /* Social footer */
1247
1248  .social_footer {
1249    margin-top: 30px;
1250    margin-bottom: 0;
1251    color: rgba(0,0,0,0.67);
1252  }
1253
1254  .disqus-comments {
1255    margin-right: 30px;
1256  }
1257
1258  .disqus-comment-count {
1259    border-bottom: 1px solid rgba(0, 0, 0, 0.4);
1260    cursor: pointer;
1261  }
1262
1263  #disqus_thread {
1264    margin-top: 30px;
1265  }
1266
1267  .article-sharing a {
1268    border-bottom: none;
1269    margin-right: 8px;
1270  }
1271
1272  .article-sharing a:hover {
1273    border-bottom: none;
1274  }
1275
1276  .sidebar-section.subscribe {
1277    font-size: 12px;
1278    line-height: 1.6em;
1279  }
1280
1281  .subscribe p {
1282    margin-bottom: 0.5em;
1283  }
1284
1285
1286  .article-footer .subscribe {
1287    font-size: 15px;
1288    margin-top: 45px;
1289  }
1290
1291
1292  .sidebar-section.custom {
1293    font-size: 12px;
1294    line-height: 1.6em;
1295  }
1296
1297  .custom p {
1298    margin-bottom: 0.5em;
1299  }
1300
1301  /* Styles for listing layout (hide title) */
1302  .layout-listing d-title, .layout-listing .d-title {
1303    display: none;
1304  }
1305
1306  /* Styles for posts lists (not auto-injected) */
1307
1308
1309  .posts-with-sidebar {
1310    padding-left: 45px;
1311    padding-right: 45px;
1312  }
1313
1314  .posts-list .description h2,
1315  .posts-list .description p {
1316    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif;
1317  }
1318
1319  .posts-list .description h2 {
1320    font-weight: 700;
1321    border-bottom: none;
1322    padding-bottom: 0;
1323  }
1324
1325  .posts-list h2.post-tag {
1326    border-bottom: 1px solid rgba(0, 0, 0, 0.2);
1327    padding-bottom: 12px;
1328  }
1329  .posts-list {
1330    margin-top: 60px;
1331    margin-bottom: 24px;
1332  }
1333
1334  .posts-list .post-preview {
1335    text-decoration: none;
1336    overflow: hidden;
1337    display: block;
1338    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
1339    padding: 24px 0;
1340  }
1341
1342  .post-preview-last {
1343    border-bottom: none !important;
1344  }
1345
1346  .posts-list .posts-list-caption {
1347    grid-column: screen;
1348    font-weight: 400;
1349  }
1350
1351  .posts-list .post-preview h2 {
1352    margin: 0 0 6px 0;
1353    line-height: 1.2em;
1354    font-style: normal;
1355    font-size: 24px;
1356  }
1357
1358  .posts-list .post-preview p {
1359    margin: 0 0 12px 0;
1360    line-height: 1.4em;
1361    font-size: 16px;
1362  }
1363
1364  .posts-list .post-preview .thumbnail {
1365    box-sizing: border-box;
1366    margin-bottom: 24px;
1367    position: relative;
1368    max-width: 500px;
1369  }
1370  .posts-list .post-preview img {
1371    width: 100%;
1372    display: block;
1373  }
1374
1375  .posts-list .metadata {
1376    font-size: 12px;
1377    line-height: 1.4em;
1378    margin-bottom: 18px;
1379  }
1380
1381  .posts-list .metadata > * {
1382    display: inline-block;
1383  }
1384
1385  .posts-list .metadata .publishedDate {
1386    margin-right: 2em;
1387  }
1388
1389  .posts-list .metadata .dt-authors {
1390    display: block;
1391    margin-top: 0.3em;
1392    margin-right: 2em;
1393  }
1394
1395  .posts-list .dt-tags {
1396    display: block;
1397    line-height: 1em;
1398  }
1399
1400  .posts-list .dt-tags .dt-tag {
1401    display: inline-block;
1402    color: rgba(0,0,0,0.6);
1403    padding: 0.3em 0.4em;
1404    margin-right: 0.2em;
1405    margin-bottom: 0.4em;
1406    font-size: 60%;
1407    border: 1px solid rgba(0,0,0,0.2);
1408    border-radius: 3px;
1409    text-transform: uppercase;
1410    font-weight: 500;
1411  }
1412
1413  .posts-list img {
1414    opacity: 1;
1415  }
1416
1417  .posts-list img[data-src] {
1418    opacity: 0;
1419  }
1420
1421  .posts-more {
1422    clear: both;
1423  }
1424
1425
1426  .posts-sidebar {
1427    font-size: 16px;
1428  }
1429
1430  .posts-sidebar h3 {
1431    font-size: 16px;
1432    margin-top: 0;
1433    margin-bottom: 0.5em;
1434    font-weight: 400;
1435    text-transform: uppercase;
1436  }
1437
1438  .sidebar-section {
1439    margin-bottom: 30px;
1440  }
1441
1442  .categories ul {
1443    list-style-type: none;
1444    margin: 0;
1445    padding: 0;
1446  }
1447
1448  .categories li {
1449    color: rgba(0, 0, 0, 0.8);
1450    margin-bottom: 0;
1451  }
1452
1453  .categories li>a {
1454    border-bottom: none;
1455  }
1456
1457  .categories li>a:hover {
1458    border-bottom: 1px solid rgba(0, 0, 0, 0.4);
1459  }
1460
1461  .categories .active {
1462    font-weight: 600;
1463  }
1464
1465  .categories .category-count {
1466    color: rgba(0, 0, 0, 0.4);
1467  }
1468
1469
1470  @media(min-width: 768px) {
1471    .posts-list .post-preview h2 {
1472      font-size: 26px;
1473    }
1474    .posts-list .post-preview .thumbnail {
1475      float: right;
1476      width: 30%;
1477      margin-bottom: 0;
1478    }
1479    .posts-list .post-preview .description {
1480      float: left;
1481      width: 45%;
1482    }
1483    .posts-list .post-preview .metadata {
1484      float: left;
1485      width: 20%;
1486      margin-top: 8px;
1487    }
1488    .posts-list .post-preview p {
1489      margin: 0 0 12px 0;
1490      line-height: 1.5em;
1491      font-size: 16px;
1492    }
1493    .posts-with-sidebar .posts-list {
1494      float: left;
1495      width: 75%;
1496    }
1497    .posts-with-sidebar .posts-sidebar {
1498      float: right;
1499      width: 20%;
1500      margin-top: 60px;
1501      padding-top: 24px;
1502      padding-bottom: 24px;
1503    }
1504  }
1505
1506
1507  /* Improve display for browsers without grid (IE/Edge <= 15) */
1508
1509  .downlevel {
1510    line-height: 1.6em;
1511    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif;
1512    margin: 0;
1513  }
1514
1515  .downlevel .d-title {
1516    padding-top: 6rem;
1517    padding-bottom: 1.5rem;
1518  }
1519
1520  .downlevel .d-title h1 {
1521    font-size: 50px;
1522    font-weight: 700;
1523    line-height: 1.1em;
1524    margin: 0 0 0.5rem;
1525  }
1526
1527  .downlevel .d-title p {
1528    font-weight: 300;
1529    font-size: 1.2rem;
1530    line-height: 1.55em;
1531    margin-top: 0;
1532  }
1533
1534  .downlevel .d-byline {
1535    padding-top: 0.8em;
1536    padding-bottom: 0.8em;
1537    font-size: 0.8rem;
1538    line-height: 1.8em;
1539  }
1540
1541  .downlevel .section-separator {
1542    border: none;
1543    border-top: 1px solid rgba(0, 0, 0, 0.1);
1544  }
1545
1546  .downlevel .d-article {
1547    font-size: 1.06rem;
1548    line-height: 1.7em;
1549    padding-top: 1rem;
1550    padding-bottom: 2rem;
1551  }
1552
1553
1554  .downlevel .d-appendix {
1555    padding-left: 0;
1556    padding-right: 0;
1557    max-width: none;
1558    font-size: 0.8em;
1559    line-height: 1.7em;
1560    margin-bottom: 0;
1561    color: rgba(0,0,0,0.5);
1562    padding-top: 40px;
1563    padding-bottom: 48px;
1564  }
1565
1566  .downlevel .footnotes ol {
1567    padding-left: 13px;
1568  }
1569
1570  .downlevel .base-grid,
1571  .downlevel .distill-header,
1572  .downlevel .d-title,
1573  .downlevel .d-abstract,
1574  .downlevel .d-article,
1575  .downlevel .d-appendix,
1576  .downlevel .distill-appendix,
1577  .downlevel .d-byline,
1578  .downlevel .d-footnote-list,
1579  .downlevel .d-citation-list,
1580  .downlevel .distill-footer,
1581  .downlevel .appendix-bottom,
1582  .downlevel .posts-container {
1583    padding-left: 40px;
1584    padding-right: 40px;
1585  }
1586
1587  @media(min-width: 768px) {
1588    .downlevel .base-grid,
1589    .downlevel .distill-header,
1590    .downlevel .d-title,
1591    .downlevel .d-abstract,
1592    .downlevel .d-article,
1593    .downlevel .d-appendix,
1594    .downlevel .distill-appendix,
1595    .downlevel .d-byline,
1596    .downlevel .d-footnote-list,
1597    .downlevel .d-citation-list,
1598    .downlevel .distill-footer,
1599    .downlevel .appendix-bottom,
1600    .downlevel .posts-container {
1601    padding-left: 150px;
1602    padding-right: 150px;
1603    max-width: 900px;
1604  }
1605  }
1606
1607  .downlevel pre code {
1608    display: block;
1609    border-left: 2px solid rgba(0, 0, 0, .1);
1610    padding: 0 0 0 20px;
1611    font-size: 14px;
1612  }
1613
1614  .downlevel code, .downlevel pre {
1615    color: black;
1616    background: none;
1617    font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
1618    text-align: left;
1619    white-space: pre;
1620    word-spacing: normal;
1621    word-break: normal;
1622    word-wrap: normal;
1623    line-height: 1.5;
1624
1625    -moz-tab-size: 4;
1626    -o-tab-size: 4;
1627    tab-size: 4;
1628
1629    -webkit-hyphens: none;
1630    -moz-hyphens: none;
1631    -ms-hyphens: none;
1632    hyphens: none;
1633  }
1634
1635  .downlevel .posts-list .post-preview {
1636    color: inherit;
1637  }
1638
1639
1640
1641  </style>
1642
1643  
1643<script type="application/javascript">
1644
1645  function is_downlevel_browser() {
1646    if (bowser.isUnsupportedBrowser({ msie: "12", msedge: "16"},
1647                                   window.navigator.userAgent)) {
1648      return true;
1649    } else {
1650      return window.load_distill_framework === undefined;
1651    }
1652  }
1653
1654  // show body when load is complete
1655  function on_load_complete() {
1656
1657    // add anchors
1658    if (window.anchors) {
1659      window.anchors.options.placement = 'left';
1660      window.anchors.add('d-article > h2, d-article > h3, d-article > h4, d-article > h5');
1661    }
1662
1663
1664    // set body to visible
1665    document.body.style.visibility = 'visible';
1666
1667    // force redraw for leaflet widgets
1668    if (window.HTMLWidgets) {
1669      var maps = window.HTMLWidgets.findAll(".leaflet");
1670      $.each(maps, function(i, el) {
1671        var map = this.getMap();
1672        map.invalidateSize();
1673        map.eachLayer(function(layer) {
1674          if (layer instanceof L.TileLayer)
1675            layer.redraw();
1676        });
1677      });
1678    }
1679
1680    // trigger 'shown' so htmlwidgets resize
1681    $('d-article').trigger('shown');
1682  }
1683
1684  function init_distill() {
1685
1686    init_common();
1687
1688    // create front matter
1689    var front_matter = $('<d-front-matter></d-front-matter>');
1690    $('#distill-front-matter').wrap(front_matter);
1691
1692    // create d-title
1693    $('.d-title').changeElementType('d-title');
1694
1695    // create d-byline
1696    var byline = $('<d-byline></d-byline>');
1697    $('.d-byline').replaceWith(byline);
1698
1699    // create d-article
1700    var article = $('<d-article></d-article>');
1701    $('.d-article').wrap(article).children().unwrap();
1702
1703    // move posts container into article
1704    $('.posts-container').appendTo($('d-article'));
1705
1706    // create d-appendix
1707    $('.d-appendix').changeElementType('d-appendix');
1708
1709    // flag indicating that we have appendix items
1710    var appendix = $('.appendix-bottom').children('h3').length > 0;
1711
1712    // replace footnotes with <d-footnote>
1713    $('.footnote-ref').each(function(i, val) {
1714      appendix = true;
1715      var href = $(this).attr('href');
1716      var id = href.replace('#', '');
1717      var fn = $('#' + id);
1718      var fn_p = $('#' + id + '>p');
1719      fn_p.find('.footnote-back').remove();
1720      var text = fn_p.html();
1721      var dtfn = $('<d-footnote></d-footnote>');
1722      dtfn.html(text);
1723      $(this).replaceWith(dtfn);
1724    });
1725    // remove footnotes
1726    $('.footnotes').remove();
1727
1728    // move refs into #references-listing
1729    $('#references-listing').replaceWith($('#refs'));
1730
1731    $('h1.appendix, h2.appendix').each(function(i, val) {
1732      $(this).changeElementType('h3');
1733    });
1734    $('h3.appendix').each(function(i, val) {
1735      var id = $(this).attr('id');
1736      $('.d-contents a[href="#' + id + '"]').parent().remove();
1737      appendix = true;
1738      $(this).nextUntil($('h1, h2, h3')).addBack().appendTo($('d-appendix'));
1739    });
1740
1741    // show d-appendix if we have appendix content
1742    $("d-appendix").css('display', appendix ? 'grid' : 'none');
1743
1744    // localize layout chunks to just output
1745    $('.layout-chunk').each(function(i, val) {
1746
1747      // capture layout
1748      var layout = $(this).attr('data-layout');
1749
1750      // apply layout to markdown level block elements
1751      var elements = $(this).children().not('details, div.sourceCode, pre, script');
1752      elements.each(function(i, el) {
1753        var layout_div = $('<div class="' + layout + '"></div>');
1754        if (layout_div.hasClass('shaded')) {
1755          var shaded_content = $('<div class="shaded-content"></div>');
1756          $(this).wrap(shaded_content);
1757          $(this).parent().wrap(layout_div);
1758        } else {
1759          $(this).wrap(layout_div);
1760        }
1761      });
1762
1763
1764      // unwrap the layout-chunk div
1765      $(this).children().unwrap();
1766    });
1767
1768    // remove code block used to force  highlighting css
1769    $('.distill-force-highlighting-css').parent().remove();
1770
1771    // remove empty line numbers inserted by pandoc when using a
1772    // custom syntax highlighting theme
1773    $('code.sourceCode a:empty').remove();
1774
1775    // load distill framework
1776    load_distill_framework();
1777
1778    // wait for window.distillRunlevel == 4 to do post processing
1779    function distill_post_process() {
1780
1781      if (!window.distillRunlevel || window.distillRunlevel < 4)
1782        return;
1783
1784      // hide author/affiliations entirely if we have no authors
1785      var front_matter = JSON.parse($("#distill-front-matter").html());
1786      var have_authors = front_matter.authors && front_matter.authors.length > 0;
1787      if (!have_authors)
1788        $('d-byline').addClass('hidden');
1789
1790      // article with toc class
1791      $('.d-contents').parent().addClass('d-article-with-toc');
1792
1793      // strip links that point to #
1794      $('.authors-affiliations').find('a[href="#"]').removeAttr('href');
1795
1796      // add orcid ids
1797      $('.authors-affiliations').find('.author').each(function(i, el) {
1798        var orcid_id = front_matter.authors[i].orcidID;
1799        if (orcid_id) {
1800          var a = $('<a></a>');
1801          a.attr('href', 'https://orcid.org/' + orcid_id);
1802          var img = $('<img></img>');
1803          img.addClass('orcid-id');
1804          img.attr('alt', 'ORCID ID');
1805          img.attr('src','data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDo1N0NEMjA4MDI1MjA2ODExOTk0QzkzNTEzRjZEQTg1NyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDozM0NDOEJGNEZGNTcxMUUxODdBOEVCODg2RjdCQ0QwOSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDozM0NDOEJGM0ZGNTcxMUUxODdBOEVCODg2RjdCQ0QwOSIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M1IE1hY2ludG9zaCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkZDN0YxMTc0MDcyMDY4MTE5NUZFRDc5MUM2MUUwNEREIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjU3Q0QyMDgwMjUyMDY4MTE5OTRDOTM1MTNGNkRBODU3Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+84NovQAAAR1JREFUeNpiZEADy85ZJgCpeCB2QJM6AMQLo4yOL0AWZETSqACk1gOxAQN+cAGIA4EGPQBxmJA0nwdpjjQ8xqArmczw5tMHXAaALDgP1QMxAGqzAAPxQACqh4ER6uf5MBlkm0X4EGayMfMw/Pr7Bd2gRBZogMFBrv01hisv5jLsv9nLAPIOMnjy8RDDyYctyAbFM2EJbRQw+aAWw/LzVgx7b+cwCHKqMhjJFCBLOzAR6+lXX84xnHjYyqAo5IUizkRCwIENQQckGSDGY4TVgAPEaraQr2a4/24bSuoExcJCfAEJihXkWDj3ZAKy9EJGaEo8T0QSxkjSwORsCAuDQCD+QILmD1A9kECEZgxDaEZhICIzGcIyEyOl2RkgwAAhkmC+eAm0TAAAAABJRU5ErkJggg==');
1806          a.append(img);
1807          $(this).append(a);
1808        }
1809      });
1810
1811      // hide elements of author/affiliations grid that have no value
1812      function hide_byline_column(caption) {
1813        $('d-byline').find('h3:contains("' + caption + '")').parent().css('visibility', 'hidden');
1814      }
1815
1816      // affiliations
1817      var have_affiliations = false;
1818      for (var i = 0; i<front_matter.authors.length; ++i) {
1819        var author = front_matter.authors[i];
1820        if (author.affiliation !== "&nbsp;") {
1821          have_affiliations = true;
1822          break;
1823        }
1824      }
1825      if (!have_affiliations)
1826        $('d-byline').find('h3:contains("Affiliations")').css('visibility', 'hidden');
1827
1828      // published date
1829      if (!front_matter.publishedDate)
1830        hide_byline_column("Published");
1831
1832      // document object identifier
1833      var doi = $('d-byline').find('h3:contains("DOI")');
1834      var doi_p = doi.next().empty();
1835      if (!front_matter.doi) {
1836        // if we have a citation and valid citationText then link to that
1837        if ($('#citation').length > 0 && front_matter.citationText) {
1838          doi.html('Citation');
1839          $('<a href="#citation"></a>')
1840            .text(front_matter.citationText)
1841            .appendTo(doi_p);
1842        } else {
1843          hide_byline_column("DOI");
1844        }
1845      } else {
1846        $('<a></a>')
1847           .attr('href', "https://doi.org/" + front_matter.doi)
1848           .html(front_matter.doi)
1849           .appendTo(doi_p);
1850      }
1851
1852       // change plural form of authors/affiliations
1853      if (front_matter.authors.length === 1) {
1854        var grid = $('.authors-affiliations');
1855        grid.children('h3:contains("Authors")').text('Author');
1856        grid.children('h3:contains("Affiliations")').text('Affiliation');
1857      }
1858
1859      // remove d-appendix and d-footnote-list local styles
1860      $('d-appendix > style:first-child').remove();
1861      $('d-footnote-list > style:first-child').remove();
1862
1863      // move appendix-bottom entries to the bottom
1864      $('.appendix-bottom').appendTo('d-appendix').children().unwrap();
1865      $('.appendix-bottom').remove();
1866
1867      // hoverable references
1868      $('span.citation[data-cites]').each(function() {
1869        var refs = $(this).attr('data-cites').split(" ");
1870        var refHtml = refs.map(function(ref) {
1871          return "<p>" + $('#ref-' + ref).html() + "</p>";
1872        }).join("\n");
1873        window.tippy(this, {
1874          allowHTML: true,
1875          content: refHtml,
1876          maxWidth: 500,
1877          interactive: true,
1878          interactiveBorder: 10,
1879          theme: 'light-border',
1880          placement: 'bottom-start'
1881        });
1882      });
1883
1884      // clear polling timer
1885      clearInterval(tid);
1886
1887      // show body now that everything is ready
1888      on_load_complete();
1889    }
1890
1891    var tid = setInterval(distill_post_process, 50);
1892    distill_post_process();
1893
1894  }
1895
1896  function init_downlevel() {
1897
1898    init_common();
1899
1900     // insert hr after d-title
1901    $('.d-title').after($('<hr class="section-separator"/>'));
1902
1903    // check if we have authors
1904    var front_matter = JSON.parse($("#distill-front-matter").html());
1905    var have_authors = front_matter.authors && front_matter.authors.length > 0;
1906
1907    // manage byline/border
1908    if (!have_authors)
1909      $('.d-byline').remove();
1910    $('.d-byline').after($('<hr class="section-separator"/>'));
1911    $('.d-byline a').remove();
1912
1913    // remove toc
1914    $('.d-contents').remove();
1915
1916    // move appendix elements
1917    $('h1.appendix, h2.appendix').each(function(i, val) {
1918      $(this).changeElementType('h3');
1919    });
1920    $('h3.appendix').each(function(i, val) {
1921      $(this).nextUntil($('h1, h2, h3')).addBack().appendTo($('.d-appendix'));
1922    });
1923
1924
1925    // inject headers into references and footnotes
1926    var refs_header = $('<h3></h3>');
1927    refs_header.text('References');
1928    $('#refs').prepend(refs_header);
1929
1930    var footnotes_header = $('<h3></h3');
1931    footnotes_header.text('Footnotes');
1932    $('.footnotes').children('hr').first().replaceWith(footnotes_header);
1933
1934    // move appendix-bottom entries to the bottom
1935    $('.appendix-bottom').appendTo('.d-appendix').children().unwrap();
1936    $('.appendix-bottom').remove();
1937
1938    // remove appendix if it's empty
1939    if ($('.d-appendix').children().length === 0)
1940      $('.d-appendix').remove();
1941
1942    // prepend separator above appendix
1943    $('.d-appendix').before($('<hr class="section-separator" style="clear: both"/>'));
1944
1945    // trim code
1946    $('pre>code').each(function(i, val) {
1947      $(this).html($.trim($(this).html()));
1948    });
1949
1950    // move posts-container right before article
1951    $('.posts-container').insertBefore($('.d-article'));
1952
1953    $('body').addClass('downlevel');
1954
1955    on_load_complete();
1956  }
1957
1958
1959  function init_common() {
1960
1961    // jquery plugin to change element types
1962    (function($) {
1963      $.fn.changeElementType = function(newType) {
1964        var attrs = {};
1965
1966        $.each(this[0].attributes, function(idx, attr) {
1967          attrs[attr.nodeName] = attr.nodeValue;
1968        });
1969
1970        this.replaceWith(function() {
1971          return $("<" + newType + "/>", attrs).append($(this).contents());
1972        });
1973      };
1974    })(jQuery);
1975
1976    // prevent underline for linked images
1977    $('a > img').parent().css({'border-bottom' : 'none'});
1978
1979    // mark non-body figures created by knitr chunks as 100% width
1980    $('.layout-chunk').each(function(i, val) {
1981      var figures = $(this).find('img, .html-widget');
1982      if ($(this).attr('data-layout') !== "l-body") {
1983        figures.css('width', '100%');
1984      } else {
1985        figures.css('max-width', '100%');
1986        figures.filter("[width]").each(function(i, val) {
1987          var fig = $(this);
1988          fig.css('width', fig.attr('width') + 'px');
1989        });
1990
1991      }
1992    });
1993
1994    // auto-append index.html to post-preview links in file: protocol
1995    // and in rstudio ide preview
1996    $('.post-preview').each(function(i, val) {
1997      if (window.location.protocol === "file:")
1998        $(this).attr('href', $(this).attr('href') + "index.html");
1999    });
2000
2001    // get rid of index.html references in header
2002    if (window.location.protocol !== "file:") {
2003      $('.distill-site-header a[href]').each(function(i,val) {
2004        $(this).attr('href', $(this).attr('href').replace("index.html", "./"));
2005      });
2006    }
2007
2008    // add class to pandoc style tables
2009    $('tr.header').parent('thead').parent('table').addClass('pandoc-table');
2010    $('.kable-table').children('table').addClass('pandoc-table');
2011
2012    // add figcaption style to table captions
2013    $('caption').parent('table').addClass("figcaption");
2014
2015    // initialize posts list
2016    if (window.init_posts_list)
2017      window.init_posts_list();
2018
2019    // implmement disqus comment link
2020    $('.disqus-comment-count').click(function() {
2021      window.headroom_prevent_pin = true;
2022      $('#disqus_thread').toggleClass('hidden');
2023      if (!$('#disqus_thread').hasClass('hidden')) {
2024        var offset = $(this).offset();
2025        $(window).resize();
2026        $('html, body').animate({
2027          scrollTop: offset.top - 35
2028        });
2029      }
2030    });
2031  }
2032
2033  document.addEventListener('DOMContentLoaded', function() {
2034    if (is_downlevel_browser())
2035      init_downlevel();
2036    else
2037      window.addEventListener('WebComponentsReady', init_distill);
2038  });
2039
2040  </script>
2040
2041
2042  <!--/radix_placeholder_distill-->
2043  
2043<script src="site_libs/header-attrs-2.13/header-attrs.js"></script>
2043
2044  
2044<script src="site_libs/popper-2.6.0/popper.min.js"></script>
2044
2045  <link href="site_libs/tippy-6.2.7/tippy.css" rel="stylesheet" />
2046  <link href="site_libs/tippy-6.2.7/tippy-light-border.css" rel="stylesheet" />
2047  
2047<script src="site_libs/tippy-6.2.7/tippy.umd.min.js"></script>
2047
2048  
2048<script src="site_libs/anchor-4.2.2/anchor.min.js"></script>
2048
2049  
2049<script src="site_libs/bowser-1.9.3/bowser.min.js"></script>
2049
2050  
2050<script src="site_libs/webcomponents-2.0.0/webcomponents.js"></script>
2050
2051  
2051<script src="site_libs/distill-2.2.21/template.v2.js"></script>
2051
2052  <!--radix_placeholder_site_in_header-->
2053  <!--/radix_placeholder_site_in_header-->
2054
2055  <link rel="stylesheet" href="styles.css" type="text/css"/>
2056
2057</head>
2058
2059<body>
2060
2061<!--radix_placeholder_front_matter-->
2062
2063<script id="distill-front-matter" type="text/json">
2064{"title":"Research","description":"Research highlights of our group","authors":[]}
2065</script>
2065
2066
2067<!--/radix_placeholder_front_matter-->
2068<!--radix_placeholder_navigation_before_body-->
2069<header class="header header--fixed" role="banner">
2070<nav class="distill-site-nav distill-site-header">
2071<div class="nav-left">
2072<a class="logo" href="cb.png">
2073<img src="cb.png" alt="Logo"/>
2074</a>
2075<a class='title' href='/'>CBIO3 Lab</a>
2076</div>
2077<div class="nav-right">
2078<a href='/'>Home</a>
2079<a href='/research'>Research</a>
2080<div class="nav-dropdown">
2081<button class="nav-dropbtn">
2082People
2083 
2084<span class="down-arrow">&#x25BE;</span>
2085</button>
2086<div class="nav-dropdown-content">
2087<a href='/wzr'>Prof. William J. Zamora R.</a>
2088<a href='/ssp'>Prof. Silvana De Souza P.</a>
2089<a href='/jww'>Prof. Jannette Wen Fang Wu Wu</a>
2090<a href='/eb'>Prof. Esteban Bertsch Aguilar</a>
2091<a href='/jz'>Jose Rodríguez Zúñiga</a>
2092<a href='/ss'>Sebastián Suñer Sánchez</a>
2093<a href='/pm'>Paulina Matamoros Parker</a>
2094<a href='/ags'>Adriana García Schmidt</a>
2095<a href='/dm'>Daniel Mora Romero</a>
2096<a href='/da'>Daniel Acuña Jiménez</a>
2097<a href='/former'>Former Members</a>
2098<a href='/ama'>Visitors</a>
2099</div>
2100</div>
2101<a href='/resources'>Resources</a>
2102<a href='/databases'>Databases</a>
2103<a href='/publications'>Publications</a>
2104<div class="nav-dropdown">
2105<button class="nav-dropbtn">
2106News
2107 
2108<span class="down-arrow">&#x25BE;</span>
2109</button>
2110<div class="nav-dropdown-content">
2111<a href='/2021_oct_edukl'>2021 Oct Kenneth y Eduardo</a>
2112<a href='/2022_may_jose'>2022 May Jose</a>
2113<a href='/2022_may_edu'>2022 May Eduardo</a>
2114<a href='/2022_june_klp_thesis'>2022 June Thesis: Kenneth</a>
2115<a href='/2022_july_edu_seminar'>2022 July Seminar: Eduardo</a>
2116<a href='/2022_semanac'>2022 September: Semana C</a>
2117<a href='/2022_birthday_wzr'>2022 October: Birthday</a>
2118<a href='/2022_panama'>2022 October Symposium: INDICASAT,Panamá</a>
2119<a href='/2022_bip_paper'>2022 October Paper: Paulina</a>
2120<a href='/2022_ipasteurfrancia'>2022 October Symposium: I.Pasteur,Francia</a>
2121<a href='/2022_ipasteurfrancia2'>2022 November Symposium: I.Pasteur,Francia</a>
2122<a href='/2022_ipasteurmontevideo'>2022 November Course: I.Pasteur,Uruguay</a>
2123<a href='/2023_cambridge'>2023 January: University of Cambridge</a>
2124<a href='/2023_editorial'>2023 February: Editorial Board</a>
2125<a href='/2023_full'>2023 March: Full Professor</a>
2126</div>
2127</div>
2128<a href='/about'>About</a>
2129<a href="javascript:void(0);" class="nav-toggle">&#9776;</a>
2130</div>
2131</nav>
2132</header>
2133<!--/radix_placeholder_navigation_before_body-->
2134<!--radix_placeholder_site_before_body-->
2135<!--/radix_placeholder_site_before_body-->
2136
2137<div class="d-title">
2138<h1>Research</h1>
2139<!--radix_placeholder_categories-->
2140<!--/radix_placeholder_categories-->
2141<p><p>Research highlights of our group</p></p>
2142</div>
2143
2144
2145<div class="d-article">
2146<p><span style="color: blue;"> <strong>Design of New Bioinspired
2147Superantibiotics</strong> </span></p>
2148<p><img src="amps_irta.png" style="width:125.0%" /> The introduction of
2149antibiotics as a means to treat and control infectious diseases marked a
2150turning point in the evolution of modern medicine. However, misuse of
2151these antimicrobial agents has caused the development of widespread
2152antibiotic resistance (ABR) in organisms ranging from spoilage
2153microorganisms to pathogens. ABR represents a global public health
2154threat that must be faced, otherwise it will have disastrous
2155consequences for global public health. ABR bacterial infections killed
21561.27 million people in the world in 2019, Africa being the most affected
2157continent. Thus, if this growth continues, it is expected by 2050
2158ABR-related deaths will exceed those due to cancer.</p>
2159<p>In collaboration with the <strong><span style="color: blue;"><a
2160href="https://www.irta.cat/en/">IRTA</a></span></strong> - Institute of
2161Agrifood Research and Technology (Dra. Elena García and Dra. Ana Aris),
2162we are design new bioinspired superantibiotics based on personalized
2163host defense peptides (HDPs) that have higher potency, selectivity, and
2164less toxicity than existing ones to prevent and treat infectious
2165diseases caused by multiresistance or extensive drug resistance
2166(MDR/XDR). Our research project aims recombinantly produce the
2167best-tailored HDPs-based superantibiotics selected by an artificial
2168intelligence algorithm based on a transdisciplinary approach that
2169includes a broad screening antimicrobial assay and experimental and
2170in-silico physicochemical characterization of the HDPs.</p>
2171<p><span style="color: blue;"> <strong>Simulation</strong> </span></p>
2172<p><em>Drug Design</em> <img src="simulation_dd.png" /> Implementation
2173of tools for collaborations in the area of medicinal chemistry in
2174antibiotic development such as use and development of chemoinformatics
2175tools, ADME-Tox properties, docking using Glide, QSAR studies and
2176classical molecular dynamic simulations using AMBER).</p>
2177<p><em>Computational Biology</em> <img src="web1.png" /> QSAR studies
2178and classical molecular dynamic simulations in peptides and proteins,
2179mainly AMPs. Prediction of the effect of mutations in diseases such as
2180Alzheimer and Myotonia. Study of peptides with neuroprotective and
2181antioxidant effects.</p>
2182<p><em>Computational Chemistry</em> <img src="simulation_cc.png" />
2183Development and parameterization of the continuous solvation model
2184IEFPCM/MST using Gaussian. Determination of QM-based physicochemical
2185properties in small molecules including drugs and pollutants</p>
2186<p><span style="color: blue;"> <strong>Theoretical</strong> </span></p>
2187<p><em>Physical chemistry</em> <img src="theo_pc.png" /> Theoretical
2188models for lipophilicity profiles of ionizable compounds considering the
2189effect of the pH and background salt. <img src="theo_cb2.png" /> Models
2190to explain the relative water content in aerosols as a function of the
2191organic solute present in these colloidal suspensions.</p>
2192<p><em>Drug Design</em> <img src="theo_dd.png" /> Development of
2193software and scoring functions for docking studies in collaboration with
2194Phamacelera Inc. </p>
2195<p><em>Computational Biology</em> <img src="theo_cb.png" /> Developed a
2196structure-based lipophilicity scale of amino acids, models to describe
2197amphipathicity in antimicrobial peptides-AMPs.</p>
2198<p><span style="color: blue;"> <strong>Data Exploration</strong>
2199</span></p>
2200<p><img src="data1.png" /> Development of models based on artificial
2201intelligence for determining physicochemical properties in small
2202molecules including drugs (bioactivity, lipophilicity and tautomeric
2203equilibria) and pollutants (solubility and toxicity).</p>
2204<p><span style="color: blue;"> <strong>Experimental</strong> </span></p>
2205<p><img src="exp.png" /> <em>Drug Design</em></p>
2206<p>Potentiometric and Shake-flask methods to determine the pKa and
2207lipophilicity of small molecules.</p>
2208<p><em>Environmental Pollutants</em></p>
2209<p>
2209Quantification by analytical techniques of emerging pollutants for
2210the creation of databases for computational models.</p>
2211<p><em>Phytotherapeutics</em></p>
2212<p>Analysis, biological activity, collaborative research in the
2213improvement of bioavailability with the application of nanotechnology.
2214Natural Products Research (Structural elucidation methods as NMR, MS,
2215IR)</p>
2216<p><em>Separation methods</em></p>
2217<p>Column and thin layer chromatography, UPLC, HPLC; Antioxidant
2218methods: Oxygen radical absorption capacity based on fluorometry
2219-ORAC.</p>
2220<div class="sourceCode" id="cb1"><pre
2221class="sourceCode r distill-force-highlighting-css"><code class="sourceCode r"></code></pre></div>
2222<!--radix_placeholder_article_footer-->
2223<!--/radix_placeholder_article_footer-->
2224</div>
2225
2226<div class="d-appendix">
2227</div>
2228
2229
2230<!--radix_placeholder_site_after_body-->
2231<!--/radix_placeholder_site_after_body-->
2232<!--radix_placeholder_appendices-->
2233<div class="appendix-bottom"></div>
2234<!--/radix_placeholder_appendices-->
2235<!--radix_placeholder_navigation_after_body-->
2236<!--/radix_placeholder_navigation_after_body-->
2237
2238</body>
2239
2240</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.