Newer
Older
import { ButtonOneEngineering } from "../components/Buttons";
import { H3, H4 } from "../components/Headings";
import { useTabNavigation } from "../utils/TabNavigation";
import { TabScrollLink } from "../components/Link";
import { useNavigation } from "../utils";
Liliana Sanfilippo
committed
<br/> <br/> <br/>
<div id="tab-our-cycle" className="enginneeringtab" style={{display: "block"}}>
Liliana Sanfilippo
committed
<section > <br id="obenengineering"/>
Liliana Sanfilippo
committed
<H3 text="Our cycle" id="ourcycle"></H3>
Liliana Sanfilippo
committed
<p>Hallo Prime Editing diesdas</p>
</div>
<br/>
<div className="row">
<div className="col">
</div>
<div className="col button-left">
<div className="right"><ButtonOneEngineering label="Next" open="proof-of-concept" scrollToId="Proof of Concept"/></div>
</div>
</div>
</section>
</div>
<div id="tab-proof-of-concept" className="enginneeringtab" style={{display: "none"}}>
<section >
<H3 id="Proof of Concept" text="Proof of Concept"></H3>
<p>To test prime editors, a reliable model system is required. HEK293 cells are a human derived cell line and widely used in a variety of fields in biology[1]. Apart from easy handling and comparatively easy transfection, they have, as we found out in our exchange with Mattijs Bulcaen, one advantage over other models: They are naturally impaired in DNA repair mechanisms and therefore easier to edit. To properly compare editing efficiencies, a high transfection efficiency is of utmost importance. This engineering cycle focuses on our work in simulating prime editing using the PEAR reporter system[2] and optimizing transfection protocols.</p>
<H3 text="Test of Lipofectamine 2000" id="text"/>
<H4 text="Test" id="text"/>
<p>While conducting research on transfection methods for HEK cells, particular attention was devoted to the delivery of the Prime Editing complex into the cells. In the literature, Lipofectamine is described as a common transfection agent. <i>Anzalone et al. 2019</i>[3] describe a transfection of prime-editing complexes with Lipofectamine 2000. The aim of this study is to introduce our prime-editing complex into HEK cells.</p>
<p>Transfection with Lipofectamine 2000 was performed in accordance with the Anzalone protocol. However, the result was characterized by insufficient transfection efficiency.</p>
<H4 text="Learn" id="text"/>
<p>The low efficiency of Lipofectamine 2000 indicated that the product is not optimally suited to the specific conditions under consideration. In contrast, Lipofectamine 3000 is described in the literature as potentially more efficient.</p>
<H4 text="Design" id="text"/>
<p>In light of the aforementioned findings, the decision was taken to test Lipofectamine 3000, given its reputation for greater efficiency. A new test design was devised, utilizing Lipofectamine 3000 with an equivalent quantity of DNA and modified transfection conditions.</p>
<H4 text="Build" id="text"/>
<p>In accordance with the established protocol, the recommended ratio of 1 µg DNA to 2 µl Lipofectamine 3000, as provided by ThermoFisher, is to be employed.</p>
</p>
</div>
<div className="box" >
<p id="cyc2">
<H3 text="Initial Test with Lipofectamine 3000" id="text"/>
<H4 text="Test" id="text"/>
<p>Considering the favorable assessment of Lipofectamine 3000 in the scientific literature, the proof of concept was conducted once more.</p>
<p>The objective of the experiment was to enhance the transfection efficiency of Lipofectamine 3000. The transfection protocol was conducted in accordance with the manufacturer's instructions (1 µg DNA, 2 µl Lipofectamine 3000 reagent).</p>
<p>The outcome revealed that despite the modification, the transfection efficiency remained inadequate, although a marginal improvement was discernible.</p>
<H4 text="Learn" id="text"/>
<p>Although a switch to Lipofectamine 3000 resulted in a marginal improvement, the efficiency fell short of expectations. This indicates that further optimization is required in terms of the amount of Lipofectamine and DNA, as well as the medium used.</p>
<H4 text="Design" id="text"/>
<p>In order to optimize the transfection process, a new optimization test was designed, which incorporates a variable design with regard to the quantity of Lipofectamine 3000 and DNA.</p>
<H4 text="Build" id="text"/>
<p>The protocol entails the utilization of varying concentrations of Lipofectamine 3000, specifically 1 µl and 1.5 µl, with a DNA quantity of 1 µg or 0.5 µg.</p>
</p>
</div>
<div className="box" >
<p id="cyc3">
<H3 text="Optimization of DNA and Lipofectamine Volumes" id="text"/>
<H4 text="Test" id="text"/>
<p>To enhance transfection efficiency, optimization tests were conducted, in which the quantities of Lipofectamine and DNA were varied. The objective of this iteration was to find the optimal ratio of Lipofectamine 3000 to DNA. To this end, 1 µl and 1.5 µl of Lipofectamine 3000 at a DNA concentration of either 1 µg or 0.5 µg were compared with each other.</p>
<H4 text="Learn" id="text"/>
<p>The experiment demonstrated that a quantity of 1 µl Lipofectamine 3000 is sufficient for successful transfection, and that increasing the quantity does not result in a notable difference. Additionally, the findings indicated that an amount of 1 µg DNA exhibited a higher efficiency than an amount of 0.5 µg DNA. It can be reasoned that additional factors may have contributed to the previously observed decline in transfection efficiency. One potential explanation is that the cells may have been in an excessively high passage level.</p>
<p>It can be reasonably deduced that the aforementioned factors may have contributed to the observed decline in transfection efficiency.</p>
<H4 text="Design" id="text"/>
<p>The results obtained were used to develop an optimized protocol that takes into account both the concentration of Lipofectamine and the amount of DNA.</p>
<H4 text="Build" id="text"/>
<p>In the following experiments, a DNA quantity of 1 µg and a defined quantity of 1 µl Lipofectamine 3000 was used.</p>
</p>
</div>
<div className="box" >
<p id="cyc4">
<H3 text="Validation of optimized Protocol" id="text"/>
<H4 text="Test" id="text"/>
<p>Following the series of optimizations, the proof of concept was conducted once more to confirm the efficacy of the optimized protocol. This protocol involved the utilization of 1 µl Lipofectamine 3000, 1 µg DNA, 2 µl Reagent 3000 and Opti-MEM as a medium. The outcomes were encouraging, as the transfection efficiency was markedly enhanced.</p>
<H4 text="Learn" id="text"/>
<p>The utilization of an optimized quantity of 1 µl Lipofectamine 3000, a defined quantity of DNA and the suitable Opti-MEM medium resulted in a notable enhancement in transfection efficiency. This substantiates the assertion that the aforementioned conditions constitute an optimal foundation for the transfection of HEK cells with the prime editing complex.</p>
<H4 text="Design" id="text"/>
<p>This protocol establishes the standard procedure for the transfection of HEK cells with the Prime Editing Complex. The transfection reagent Lipofectamine 3000 is diluted in Opti-MEM to a final volume of 1 µl, and the DNA to be transfected is diluted to a final concentration of 1 µl.</p>
<br/>
<div className="row ">
<div className="col">
<div className="left"><ButtonOneEngineering label="Previous" open="our-cycle" scrollToId="ourcycle"/></div>
</div>
<div className="col button-left">
<div className="right"><ButtonOneEngineering label="Next" open="pe-systems" scrollToId="PE Systems"/></div>
<div className="enginneeringtab" id="tab-pe-systems" style={{display: ""}}>
Liliana Sanfilippo
committed
<section id="PE Systems sec" >
Liliana Sanfilippo
committed
<H3 id="PE Systems" text="PE Systems"></H3>
<H3 text="" id="text"/>
<H4 text="Design" id="text"/>
<p></p>
<H4 text="Build" id="text"/>
<p></p>
<H4 text="Test" id="text"/>
<p></p>
<H4 text="Learn" id="text"/>
<p></p>
</p>
</div>
<div className="box" >
<p id="pe2">
<H3 text="" id="text"/>
<H4 text="Design" id="text"/>
<p></p>
<H4 text="Build" id="text"/>
<p></p>
<H4 text="Test" id="text"/>
<p></p>
<H4 text="Learn" id="text"/>
<p></p>
</p>
</div>
<div className="box" >
<p id="pe3">
<H3 text="" id="text"/>
<H4 text="Design" id="text"/>
<p></p>
<H4 text="Build" id="text"/>
<p></p>
<H4 text="Test" id="text"/>
<p></p>
<H4 text="Learn" id="text"/>
<p></p>
<br/>
<div className="row ">
<div className="col">
<div className="left"><ButtonOneEngineering label="Previous" open="proof-of-concept" scrollToId="Proof of Concept"/></div>
</div>
<div className="col button-left">
<div className="right"><ButtonOneEngineering label="Next" open="nikase" scrollToId="Nikase"/></div>
</div>
<div className="enginneeringtab" id="tab-nikase" style={{display: "none"}}>
Liliana Sanfilippo
committed
<section id="Nikase sec" >
Liliana Sanfilippo
committed
<H3 id="Nikase" text="Nikase"></H3>
<img src="https://static.igem.wiki/teams/5247/fanzor/movie4-ezgif-com-video-to-gif-converter.gif"></img>
<img src="https://static.igem.wiki/teams/5247/fanzor/movie5-ezgif-com-video-to-gif-converter-2.gif"></img>
</div>
<div className="box" >
<p id="nik1">
<H3 text="SpuFz1 Zink Finger Mutation " id="text"/>
<H4 text="Design" id="text"/>
<p>In our quest to identify smaller endonucleases suitable for creating nickases, we focused on a newly characterized family of eukaryotic endonucleases known as Fanzor proteins, with SpuFz1 being a standout candidate due to its smaller size compared to Cas9. According to the paper "Fanzor is a Eukaryotic Programmable RNA-Guided Endonuclease"<TabScrollLink tab="tab-nikase" num="1" scrollId="desc-1"/>, SpuFz1 operates with two key domains: the RuvC domain, which cuts the non-target DNA strand, and the TNB domain (also called NUC domain), which helps facilitating the cleavage by pushing the target strand into the RuvC domain. We hypothesized that a zinc finger, which is part of the TNB domain and crucial for DNA coordination, could be a target for mutation to disrupt this process. Thus, our initial design strategy involved replacing the cysteine residues coordinating the zinc ion in the zinc finger with alanine to potentially impair its DNA-binding ability.</p>
<H4 text="Build" id="text"/>
<p>We used the protein visualization software ChimeraX to explore the SpuFz1 protein structure and identify the specific cysteine residues involved in zinc ion coordination. Based on this visualization, we designed mutant sequences by substituting these cysteines with alanine.</p>
<H4 text="Test" id="text"/>
<p>First, we discussed our approach with <a onClick={() => goToPagesAndOpenTab('hammer', '/human-practices')} >Kai Schülke</a>, a PhD student from the Hammer Group at Bielefeld University, which specializes in enzyme engineering. Although he could follow our logic, Kai mentioned that he was ultimately unable to assess the validity of our approach, as this specific class of enzymes falls outside his area of expertise. He recommended that, rather than testing a wide range of random mutations (due to the limited time of our project), we should focus on our specific mutant candidates by ordering the DNA sequences and cloning them into expression vectors.</p>
<p>Additionally, we simulated the potential effectiveness of our modified SpuFz1 nickase in a Prime Editing scenario, targeting the ΔF508 mutation in cystic fibrosis. During this simulation, we identified a challenge: the TAM sequence required for SpuFz1 binding was located relatively far from the target mutation site, which could reduce the effectiveness of the Prime Editor. However, we did not entirely rule out SpuFz1, considering that it might still be useful for other applications.</p>
<H4 text="Learn" id="text"/>
<p>From this iteration, we confirmed that targeted mutagenesis is the best approach for generating our mutant nickases. We also recognized the need for careful consideration of the PAM (or TAM) sequences associated with our chosen endonucleases. The realization that the TAM sequence of SpuFz1 might be too far from our target mutation suggests that SpuFz1 may not be the ideal candidate for this application, though it could still be an interesting candidate. Additionally, we learned the importance of expert consultation in refining our approach.</p>
</p>
</div>
<div className="box" >
<p id="nik2">
<H3 text="Fusion Protein from GtFz1 & SpuFz1" id="text"/>
<H4 text="Design" id="text"/>
<p>In our ongoing exploration of Fanzor proteins, we identified another potential candidate, GtFz1, which had a suitable TAM sequence for our target application of correcting the F508del mutation in cystic fibrosis. However, GtFz1 showed low cutting efficiency in the tests reported in the literature. To address this, we devised a strategy to combine the favorable TAM-binding region of GtFz1 with the higher cutting efficiency of SpuFz1. Specifically, we planned to engineer a fusion protein by replacing the TAM-binding domain of SpuFz1 with that of GtFz1. The idea was to create a new endonuclease with the optimal TAM sequence for our application and a robust DNA cutting ability.</p>
<p>Given that we were swapping entire domains rather than just single amino acids, we realized that the fusion protein might not retain the ideal TAM-binding efficiency or cutting efficiency of the original proteins. Our strategy was to create a fusion protein that could bind to the TAM site and perform DNA cutting to a certain extent, albeit weakly. We planned to use directed evolution techniques, such as Phage Assisted Continuous Evolution (PACE), to enhance these functionalities over time. This approach relies on having a starting point with some degree of the desired activity, which can then be incrementally improved through evolution.</p>
<H4 text="Build" id="text"/>
<p></p>
<H4 text="Test" id="text"/>
<p></p>
<H4 text="Learn" id="text"/>
<p></p>
</p>
</div>
<div className="box" >
<p id="nik3">
<H3 text="" id="text"/>
<H4 text="Design" id="text"/>
<p></p>
<H4 text="Build" id="text"/>
<p></p>
<H4 text="Test" id="text"/>
<p></p>
<H4 text="Learn" id="text"/>
<p></p>
</p>
</div>
<div className="box" >
<p id="nik4">
<H3 text="" id="text"/>
<H4 text="Design" id="text"/>
<p></p>
<H4 text="Build" id="text"/>
<p></p>
<H4 text="Test" id="text"/>
<p></p>
<H4 text="Learn" id="text"/>
<p></p>
</p>
</div>
<div className="box" >
<p id="nik5">
<H3 text="" id="text"/>
<H4 text="Design" id="text"/>
<p></p>
<H4 text="Build" id="text"/>
<p></p>
<H4 text="Test" id="text"/>
<p></p>
<H4 text="Learn" id="text"/>
<p></p>
</p>
</div>
<div className="box" >
<p id="nik6">
<H3 text="" id="text"/>
<H4 text="Design" id="text"/>
<p></p>
<H4 text="Build" id="text"/>
<p></p>
<H4 text="Test" id="text"/>
<p></p>
<H4 text="Learn" id="text"/>
<p></p>
</p>
</div>
<div className="box" >
<p id="nik6">
<H3 text="References" id="text"/>
<ol>
{/*<!-- Citation num 1--> */}
<li typeof="schema:ScolarlyArticle" role="doc-biblioentry" property="schema:citation" id="desc-1">
<span property="schema:author" typeof="schema:Person">
<span property="schema:Name"> Saito, M.</span>
<span property="schema:Name"> Xu, P.</span>
<span property="schema:Name"> Faure, G.</span>
<span property="schema:Name"> Maguire, S.</span>
<span property="schema:Name"> Kannan, S.</span>
<span property="schema:Name"> Altae-Tran, H.</span>
<span property="schema:Name"> Vo, S.</span>
<span property="schema:Name"> et al.</span>
</span>
<span property="schema:name"> Fanzor is a eukaryotic programmable RNA-guided endonuclease</span>.
<i property="schema:publisher" typeof="schema:Organization"> Nature</i>
<b property="issueNumber" typeof="PublicationIssue"> 620</b>
, <span property="schema:pageBegin"> 660</span>-<span property="schema:pageEnd">668</span>
(<time property="schema:datePublished" datatype="xsd:gYear" dateTime=" 2023">2023</time>).
<a className="doi" href="https://doi.org/10.1038/s41586-023-06356-2"> doi: 10.1038/s41586-023-06356-2</a>
</li>
</ol>
<br/>
<div className="row ">
<div className="col">
<div className="left"><ButtonOneEngineering label="Previous" open="pe-systems" scrollToId="PE Systems"/></div>
</div>
<div className="col button-left">
<div className="right"><ButtonOneEngineering label="Next" open="pegrna" scrollToId="pegRNA"/></div>
</section>
</div>
<div className="enginneeringtab" id="tab-pegrna" style={{display: "none"}}>
Liliana Sanfilippo
committed
<section id="pegRNA sec" >
Liliana Sanfilippo
committed
<H3 id="pegRNA" text="pegRNA"></H3>
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
<div className="box" >
<p id="peg1">
<h3>peg1</h3>
<LoremShort></LoremShort>
</p>
<p><LoremShort></LoremShort></p>
<p><LoremShort></LoremShort></p>
</div>
<div className="box" >
<p id="peg2">
<h3>peg2</h3>
<LoremShort></LoremShort>
</p>
<p><LoremShort></LoremShort></p>
<p><LoremShort></LoremShort></p>
</div>
<div className="box" >
<p id="peg3">
<h3>peg3</h3>
<LoremShort></LoremShort>
</p>
<p><LoremShort></LoremShort></p>
<p><LoremShort></LoremShort></p>
</div>
<div className="box" >
<p id="peg4">
<h3>peg4</h3>
<LoremShort></LoremShort>
</p>
<p><LoremShort></LoremShort></p>
<p><LoremShort></LoremShort></p>
</div>
<div className="box" >
<p id="peg5">
<h3>peg5</h3>
<LoremShort></LoremShort>
</p>
<p><LoremShort></LoremShort></p>
<p><LoremShort></LoremShort></p>
</div>
<div className="box" >
<p id="peg6">
<h3>peg6</h3>
<LoremShort></LoremShort>
</p>
<p><LoremShort></LoremShort></p>
<p><LoremShort></LoremShort></p>
</div>
<br/>
<div className="row ">
<div className="col">
<div className="left"><ButtonOneEngineering label="Previous" open="nikase" scrollToId="Nikase"/></div>
</div>
<div className="col button-left">
<div className="right"><ButtonOneEngineering label="Next" open="delivery" scrollToId="Delivery"/></div>
</section>
</div>
<div className="enginneeringtab" id="tab-delivery" style={{display: "none"}}>
Liliana Sanfilippo
committed
<section id="Delivery sec" >
Liliana Sanfilippo
committed
<H3 id="Delivery" text="Delivery"></H3>
<p><LoremShort></LoremShort></p>
</div>
<div className="box" >
<p id="del1">
<h3>del1</h3>
<LoremShort></LoremShort>
</p>
<p><LoremShort></LoremShort></p>
<p><LoremShort></LoremShort></p>
</div>
<div className="box" >
<p id="del2">
<h3>del2</h3>
<LoremShort></LoremShort>
<p><LoremShort></LoremShort></p>
<p><LoremShort></LoremShort></p>
</p>
</div>
<div className="box" >
<p id="del3">
<h3>del3</h3>
<LoremShort></LoremShort>
</p>
<p><LoremShort></LoremShort></p>
<p><LoremShort></LoremShort></p>
</div>
<br/>
<div className="row ">
<div className="col">
<div className="left"><ButtonOneEngineering label="Previous" open="pegrna" scrollToId="pegRNA"/></div>
</div>
<div className="col button-left">
<div className="right"><ButtonOneEngineering label="Next" open="references" scrollToId="References"/></div>
<div className="enginneeringtab" id="tab-references" style={{display: "none"}}>
Liliana Sanfilippo
committed
<section id="References sec" >
Liliana Sanfilippo
committed
<H3 id="References" text="References"></H3>
<p><LoremShort></LoremShort></p>
</div>
<br/>
<div className="row ">
<div className="col">
<div className="left"><ButtonOneEngineering label="Previous" open="delivery" scrollToId="Delivery"/></div>
</div>
<div className="col button-left">
</div>
</div>
return(
<svg className="rotate-linear-infinite"
width="100%"
height="100%"
viewBox="0 0 133 133"
id="svg25"
xmlns="http://www.w3.org/2000/svg">
<defs
id="defs1">
</defs>
<g
id="Layer_2"
data-name="Layer 2"
style={{strokeWidth:"6",strokeDasharray:"none"}}>
<g
id="Plasmid"
style={{strokeWidth:"6",strokeDasharray:"none"}}>
<g
id="g25"
transform="translate(7.500978,3.0504898)">
<a typeof="button" className="svg-button" onClick={openElement({elementToOpen: "designing", classToHide: "cycletab"})}>
<path
className="cls-7"
d="m 42.05,115.59 c 27.77,9.19 57.83,-4.79 69.76,-32.23"
id="path22"
style={{stroke:"#f4cc1e",strokeWidth:"15",strokeDasharray:"none",strokeOpacity:"1"}} />
</a>
</g>
<g
id="g26"
transform="translate(8.0019699,2.8418223)"
style={{strokeWidth:"6",strokeDasharray:"none"}}>
<polygon
className="cls-13"
points="112.07,83.36 110.94,76.27 117.65,78.84 "
id="polygon25"
style={{fill:"#850f78",fillOpacity:"1",strokeWidth:"6",strokeDasharray:"none"}}
transform="matrix(2.9806259,0,0,2.9806259,-225.43722,-156.45123)" />
<a typeof="button" className="svg-button" onClick={openElement({elementToOpen: "learning", classToHide: "cycletab"})}>
468
469
470
471
472
473
474
475
476
477
478
479
480
481
482
483
484
485
486
487
488
489
490
491
492
493
<path
className="cls-12"
d="M 114,78.55 C 123.45,50.86 110,20.75 82.66,8.6"
id="path25"
style={{strokeWidth:"15",strokeDasharray:"none",stroke:"#850f78",strokeOpacity:"1"}} />
<text
style={{fontSize:"17.3333px",lineHeight:"0",fontFamily:"Arial",fill:"#000000",fillOpacity:"1",stroke:"none",strokeWidth:"15",strokeLinecap:"round",strokeLinejoin:"round",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
id="text31"
transform="translate(5.6902194,-0.11551883)"><textPath
xlinkHref="#path25"
id="textPath33">Learn<tspan
id="tspan31" /></textPath></text> </a>
</g>
<g
id="g27"
style={{strokeWidth:"6",strokeDasharray:"none"}}
transform="translate(8.0019699,2.8418223)">
<polygon
className="cls-10"
points="62.53,7.12 63.47,0 69.17,4.37 "
id="polygon23"
transform="matrix(2.7712263,0.58147548,-0.58147548,2.7712263,-96.587828,-39.748071)"
style={{fill:"#a0a7f3",fillOpacity:"1",strokeWidth:"6",strokeDasharray:"none"}}
inkscape:transform-center-x="3.6173751"
inkscape:transform-center-y="5.1978852" />
<a typeof="button" className="svg-button" onClick={openElement({elementToOpen: "testing", classToHide: "cycletab"})}>
<path
className="cls-9"
d="M 78.599111,7.5468264 C 43.820346,-2.6177588 13.956746,14.286046 4.2106281,46.368749"
id="path23"
style={{stroke:"#a0a7f3",strokeWidth:"15",strokeDasharray:"none",strokeOpacity:"1"}} />
<text
style={{fontSize:"17.3333px",lineHeight:"0",fontFamily:"Arial",fill:"#000000",fillOpacity:"1",stroke:"none",strokeWidth:"6",strokeLinecap:"round",strokeLinejoin:"round",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
id="text28"
transform="translate(-0.03023506,-5.9602336)"><textPath
xlinkHref="#path23"
id="textPath28">Test</textPath></text> </a>
</g>
<g
id="g28"
style={{strokeWidth:"6",strokeDasharray:"none"}}
transform="translate(8.0019699,2.8418223)">
<polygon
className="cls-13"
points="117.65,78.84 112.07,83.36 110.94,76.27 "
id="polygon25-6"
style={{fill:"#f57d22",fillOpacity:"1",strokeWidth:"6",strokeDasharray:"none"}}
transform="matrix(-2.9650314,0.30449893,-0.30449893,-2.9650314,364.84067,249.28249)" />
<a typeof="button" className="svg-button" onClick={openElement({elementToOpen: "building", classToHide: "cycletab"})}>
<path
className="cls-11"
d="M 2.6659753,50.953505 C -2.0956694,72.727915 10.936866,102.94273 36.656234,113.62834"
id="path24"
style={{strokeWidth:"15",strokeDasharray:"none",stroke:"#f57d22",strokeOpacity:"1"}} />
<text
style={{fontSize:"17.3333px",lineHeight:"0",fontFamily:"Arial",fill:"#000000",fillOpacity:"1",stroke:"none",strokeWidth:"15",strokeLinecap:"round",strokeLinejoin:"round",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
id="text32"
transform="translate(-5.7110315,1.7453243)"><textPath
xlinkHref="#path24"
id="textPath32">Build<tspan
id="tspan32" /></textPath></text> </a>
</g>
<polygon
className="cls-8"
points="37.22,113.74 44.3,112.56 41.78,119.28 "
id="polygon22"
style={{strokeWidth:"6",strokeDasharray:"none",fill:"#f4cc1e",fillOpacity:"1"}}
transform="matrix(2.8248588,0,0,2.8248588,-67.797781,-207.96977)" />
<a typeof="button" className="svg-button" onClick={openElement({elementToOpen: "designing", classToHide: "cycletab"})}>
<text
style={{fontSize:"17.3333px",lineHeight:"0",fontFamily:"Arial",fill:"#000000",fillOpacity:"1",stroke:"none",strokeWidth:"15",strokeLinecap:"round",strokeLinejoin:"round",strokeDasharray:"none",strokeOpacity:"1",paintOrder:"fill markers stroke"}}
id="text29"
transform="translate(8.4052921,8.8553334)"><textPath
xlinkHref="#path22"
id="textPath34">Design<tspan
id="tspan29" /></textPath></text> </a>
</g>
</g>
<a typeof="button" className="svg-button" onClick={openElement({elementToOpen: "overview", classToHide: "cycletab"})}>
<circle
style={{opacity:"0.85",fill:"#e2dad7",fillOpacity:"1",strokeWidth:"15",strokeLinecap:"round",strokeLinejoin:"round",paintOrder:"fill markers stroke"}}
id="path1"
cx="67.916214"
cy="63.214005"
r="20" />
<text
style={{fontSize:"8px",lineHeight:"0",fontFamily:"Arial",opacity:"0.85",fill:"#000000",fillOpacity:"1",strokeWidth:"15",strokeLinecap:"round",strokeLinejoin:"round",strokeDasharray:"none",paintOrder:"fill markers stroke"}}
x="50.929825"
y="66.676674"
id="text1">
<tspan
id="tspan1"
x="50.929825"
y="66.676674"
style={{fontSize:"8px"}}>Overview</tspan></text>
</a>
</svg>
)
}