mirror of https://github.com/captn3m0/talks.git
453 lines
98 KiB
HTML
453 lines
98 KiB
HTML
<!DOCTYPE html><html lang="en-US"><head><title>crypto.tls</title><meta property="og:title" content="crypto.tls"><meta charset="UTF-8"><meta name="viewport" content="width=device-width,height=device-height,initial-scale=1.0"><meta name="apple-mobile-web-app-capable" content="yes"><meta http-equiv="X-UA-Compatible" content="ie=edge"><meta property="og:type" content="website"><meta name="twitter:card" content="summary"><style>@media screen{body,html{background:#000;height:100%;margin:0;overflow:hidden}.bespoke-marp-osc{display:none;opacity:0}.bespoke-marp-parent{bottom:0;left:0;position:absolute;right:0;top:0}.bespoke-marp-parent>.bespoke-marp-osc{background:rgba(0,0,0,.65);border-radius:7px;bottom:50px;color:#fff;display:block;font-family:Helvetica,Arial,sans-serif;font-size:16px;left:50%;line-height:0;opacity:1;padding:12px;position:absolute;touch-action:manipulation;-webkit-transform:translateX(-50%);transform:translateX(-50%);transition:opacity .2s linear;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;white-space:nowrap;z-index:1}.bespoke-marp-parent>.bespoke-marp-osc>*{margin-left:6px}.bespoke-marp-parent>.bespoke-marp-osc>:first-child{margin-left:0}.bespoke-marp-parent>.bespoke-marp-osc>span{opacity:.8}.bespoke-marp-parent>.bespoke-marp-osc>span[data-bespoke-marp-osc=page]{display:inline-block;min-width:140px;text-align:center}.bespoke-marp-parent>.bespoke-marp-osc>button{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:0;color:inherit;cursor:pointer;font-size:inherit;opacity:.8;outline:none;padding:0;transition:opacity .2s linear;-webkit-tap-highlight-color:transparent}.bespoke-marp-parent>.bespoke-marp-osc>button:disabled{cursor:not-allowed;opacity:.15!important}.bespoke-marp-parent>.bespoke-marp-osc>button:hover{opacity:1}.bespoke-marp-parent>.bespoke-marp-osc>button:hover:active{opacity:.6}.bespoke-marp-parent>.bespoke-marp-osc>button:hover:not(:disabled){transition:none}.bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=prev]{background-size:contain;background:transparent url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48cGF0aCBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSI1IiBkPSJNNjggOTBMMjggNTBsNDAtNDAiLz48L3N2Zz4=") no-repeat 50%;height:32px;overflow:hidden;text-indent:100%;white-space:nowrap;width:32px}.bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=next]{background-size:contain;background:transparent url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48cGF0aCBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIgc3Ryb2tlLXdpZHRoPSI1IiBkPSJNMzIgOTBsNDAtNDAtNDAtNDAiLz48L3N2Zz4=") no-repeat 50%;height:32px;overflow:hidden;text-indent:100%;white-space:nowrap;width:32px}.bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=fullscreen]{background-size:contain;background:transparent url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48ZGVmcz48c3R5bGU+LmF7ZmlsbDpub25lO3N0cm9rZTojZmZmO3N0cm9rZS1saW5lY2FwOnJvdW5kO3N0cm9rZS1saW5lam9pbjpyb3VuZDtzdHJva2Utd2lkdGg6NXB4fTwvc3R5bGU+PC9kZWZzPjxyZWN0IGNsYXNzPSJhIiB4PSIxMCIgeT0iMjAiIHdpZHRoPSI4MCIgaGVpZ2h0PSI2MCIgcng9IjUuNjciLz48cGF0aCBjbGFzcz0iYSIgZD0iTTQwIDcwSDIwVjUwbTIwIDBMMjAgNzBtNDAtNDBoMjB2MjBtLTIwIDBsMjAtMjAiLz48L3N2Zz4=") no-repeat 50%;height:32px;overflow:hidden;text-indent:100%;white-space:nowrap;width:32px}.bespoke-marp-parent>.bespoke-marp-osc>button[data-bespoke-marp-osc=fullscreen].exit{background-image:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAxMDAgMTAwIj48ZGVmcz48c3R5bGU+LmF7ZmlsbDpub25lO3N0cm9rZTojZmZmO3N0cm9rZS1saW5lY2FwOnJvdW5kO3N0cm9rZS1saW5lam9pbjpyb3VuZDtzdHJva2Utd2lkdGg6NXB4fTwvc3R5bGU+PC9kZWZzPjxyZWN0IGNsYXNzPSJhIiB4PSIxMCIgeT0iMjAiIHdpZHRoPSI4MCIgaGVpZ2h0PSI2MCIgcng9IjUuNjciLz48cGF0aCBjbGFzcz0iYSIgZD0iTTIwIDUwaDIwdjIwbS0yMCAwbDIwLTIwbTQwIDBINjBWMzBtMjAgMEw2MCA1MCIvPjwvc3ZnPg==")}.bespoke-marp-parent.bespoke-marp-inactive{cursor:none}.bespoke-marp-parent.bespoke-marp-inactive>.bespoke-marp-osc{opacity:0;pointer-events:none}svg.bespoke-marp-slide{height:100%;left:0;pointer-events:none;position:absolute;top:0;width:100%;z-index:-1}svg.bespoke-marp-slide.bespoke-marp-active{pointer-events:auto;z-index:0}.bespoke-progress-parent{background:#222;display:flex;height:5px;width:100%}.bespoke-progress-parent+.bespoke-marp-parent{top:5px}.bespoke-progress-parent .bespoke-progress-bar{flex:0 0 0;background:#0288d1;transition:flex-basis .2s cubic-bezier(0,1,1,1)}}@media print{.bespoke-marp-osc,.bespoke-progress-parent{display:none!important;transition:none!important}.bespoke-marp-parent{top:0}}</style><style>article#presentation > svg > foreignObject > section {
|
||
width: 1280px;
|
||
height: 720px;
|
||
|
||
box-sizing: border-box;
|
||
overflow: hidden;
|
||
position: relative;
|
||
|
||
scroll-snap-align: center center;
|
||
}article#presentation > svg > foreignObject > section::after {
|
||
bottom: 0;
|
||
content: attr(data-marpit-pagination);
|
||
padding: inherit;
|
||
pointer-events: none;
|
||
position: absolute;
|
||
right: 0;
|
||
}article#presentation > svg > foreignObject > section:not([data-marpit-pagination])::after {
|
||
display: none;
|
||
}/* Normalization */article#presentation > svg > foreignObject > section h1 {
|
||
font-size: 2em;
|
||
margin: 0.67em 0;
|
||
}@page {
|
||
size: 1280px 720px;
|
||
margin: 0;
|
||
}@media print {html, body {
|
||
background-color: #fff;
|
||
margin: 0;
|
||
page-break-inside: avoid;
|
||
break-inside: avoid-page;
|
||
}
|
||
article#presentation > svg > foreignObject > section {
|
||
page-break-before: always;
|
||
break-before: page;
|
||
}
|
||
|
||
article#presentation > svg > foreignObject > section, article#presentation > svg > foreignObject > section * {
|
||
-webkit-print-color-adjust: exact !important;
|
||
color-adjust: exact !important;
|
||
}
|
||
|
||
article#presentation > svg[data-marpit-svg] {
|
||
display: block;
|
||
height: 100vh;
|
||
width: 100vw;
|
||
}
|
||
}article#presentation > svg > foreignObject > section svg[data-marp-fitting=svg]{display:block;height:auto;width:100%}@supports (-ms-ime-align:auto){article#presentation > svg > foreignObject > section svg[data-marp-fitting=svg]{position:static}}article#presentation > svg > foreignObject > section svg[data-marp-fitting=svg].__reflow__{content:""}@supports (-ms-ime-align:auto){article#presentation > svg > foreignObject > section svg[data-marp-fitting=svg].__reflow__{position:relative}}article#presentation > svg > foreignObject > section [data-marp-fitting-svg-content]{display:table;white-space:nowrap}article#presentation > svg > foreignObject > section [data-marp-fitting-svg-content-wrap]{white-space:pre}article#presentation > svg > foreignObject > section img[data-marp-twemoji]{background:transparent;height:1em;margin:0 .05em 0 .1em;vertical-align:-.1em;width:1em}/*!
|
||
* Marp default theme.
|
||
*
|
||
* @theme default
|
||
*/@font-face{font-family:octicons-link;src:url(data:font/woff;charset=utf-8;base64,d09GRgABAAAAAAZwABAAAAAACFQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABEU0lHAAAGaAAAAAgAAAAIAAAAAUdTVUIAAAZcAAAACgAAAAoAAQAAT1MvMgAAAyQAAABJAAAAYFYEU3RjbWFwAAADcAAAAEUAAACAAJThvmN2dCAAAATkAAAABAAAAAQAAAAAZnBnbQAAA7gAAACyAAABCUM+8IhnYXNwAAAGTAAAABAAAAAQABoAI2dseWYAAAFsAAABPAAAAZwcEq9taGVhZAAAAsgAAAA0AAAANgh4a91oaGVhAAADCAAAABoAAAAkCA8DRGhtdHgAAAL8AAAADAAAAAwGAACfbG9jYQAAAsAAAAAIAAAACABiATBtYXhwAAACqAAAABgAAAAgAA8ASm5hbWUAAAToAAABQgAAAlXu73sOcG9zdAAABiwAAAAeAAAAME3QpOBwcmVwAAAEbAAAAHYAAAB/aFGpk3jaTY6xa8JAGMW/O62BDi0tJLYQincXEypYIiGJjSgHniQ6umTsUEyLm5BV6NDBP8Tpts6F0v+k/0an2i+itHDw3v2+9+DBKTzsJNnWJNTgHEy4BgG3EMI9DCEDOGEXzDADU5hBKMIgNPZqoD3SilVaXZCER3/I7AtxEJLtzzuZfI+VVkprxTlXShWKb3TBecG11rwoNlmmn1P2WYcJczl32etSpKnziC7lQyWe1smVPy/Lt7Kc+0vWY/gAgIIEqAN9we0pwKXreiMasxvabDQMM4riO+qxM2ogwDGOZTXxwxDiycQIcoYFBLj5K3EIaSctAq2kTYiw+ymhce7vwM9jSqO8JyVd5RH9gyTt2+J/yUmYlIR0s04n6+7Vm1ozezUeLEaUjhaDSuXHwVRgvLJn1tQ7xiuVv/ocTRF42mNgZGBgYGbwZOBiAAFGJBIMAAizAFoAAABiAGIAznjaY2BkYGAA4in8zwXi+W2+MjCzMIDApSwvXzC97Z4Ig8N/BxYGZgcgl52BCSQKAA3jCV8CAABfAAAAAAQAAEB42mNgZGBg4f3vACQZQABIMjKgAmYAKEgBXgAAeNpjYGY6wTiBgZWBg2kmUxoDA4MPhGZMYzBi1AHygVLYQUCaawqDA4PChxhmh/8ODDEsvAwHgMKMIDnGL0x7gJQCAwMAJd4MFwAAAHjaY2BgYGaA4DAGRgYQkAHyGMF8NgYrIM3JIAGVYYDT+AEjAwuDFpBmA9KMDEwMCh9i/v8H8sH0/4dQc1iAmAkALaUKLgAAAHjaTY9LDsIgEIbtgqHUPpDi3gPoBVyRTmTddOmqTXThEXqrob2gQ1FjwpDvfwCBdmdXC5AVKFu3e5MfNFJ29KTQT48Ob9/lqYwOGZxeUelN2U2R6+cArgtCJpauW7UQBqnFkUsjAY/kOU1cP+DAgvxwn1chZDwUbd6CFimGXwzwF6tPbFIcjEl+vvmM/byA48e6tWrKArm4ZJlCbdsrxksL1AwWn/yBSJKpYbq8AXaaTb8AAHja28jAwOC00ZrBeQNDQOWO//sdBBgYGRiYWYAEELEwMTE4uzo5Zzo5b2BxdnFOcALxNjA6b2ByTswC8jYwg0VlNuoCTWAMqNzMzsoK1rEhNqByEyerg5PMJlYuVueETKcd/89uBpnpvIEVomeHLoMsAAe1Id4AAAAAAAB42oWQT07CQBTGv0JBhagk7HQzKxca2sJCE1hDt4QF+9JOS0nbaaYDCQfwCJ7Au3AHj+LO13FMmm6cl7785vven0kBjHCBhfpYuNa5Ph1c0e2Xu3jEvWG7UdPDLZ4N92nOm+EBXuAbHmIMSRMs+4aUEd4Nd3CHD8NdvOLTsA2GL8M9PODbcL+hD7C1xoaHeLJSEao0FEW14ckxC+TU8TxvsY6X0eLPmRhry2WVioLpkrbp84LLQPGI7c6sOiUzpWIWS5GzlSgUzzLBSikOPFTOXqly7rqx0Z1Q5BAIoZBSFihQYQOOBEdkCOgXTOHA07HAGjGWiIjaPZNW13/+lm6S9FT7rLHFJ6fQbkATOG1j2OFMucKJJsxIVfQORl+9Jyda6Sl1dUYhSCm1dyClfoeDve4qMYdLEbfqHf3O/AdDumsjAAB42mNgYoAAZQYjBmyAGYQZmdhL8zLdDEydARfoAqIAAAABAAMABwAKABMAB///AA8AAQAAAAAAAAAAAAAAAAABAAAAAA==) format("woff")}article#presentation > svg > foreignObject > section .markdown-body .octicon,article#presentation > svg > foreignObject > section .octicon{display:inline-block;fill:currentColor;vertical-align:text-bottom}article#presentation > svg > foreignObject > section .markdown-body .anchor,article#presentation > svg > foreignObject > section .anchor{float:left;line-height:1;margin-left:-20px;padding-right:4px}article#presentation > svg > foreignObject > section .markdown-body .anchor:focus,article#presentation > svg > foreignObject > section .anchor:focus{outline:none}article#presentation > svg > foreignObject > section .markdown-body h1 .octicon-link,article#presentation > svg > foreignObject > section .markdown-body h2 .octicon-link,article#presentation > svg > foreignObject > section .markdown-body h3 .octicon-link,article#presentation > svg > foreignObject > section .markdown-body h4 .octicon-link,article#presentation > svg > foreignObject > section .markdown-body h5 .octicon-link,article#presentation > svg > foreignObject > section .markdown-body h6 .octicon-link,article#presentation > svg > foreignObject > section h1 .octicon-link,article#presentation > svg > foreignObject > section h2 .octicon-link,article#presentation > svg > foreignObject > section h3 .octicon-link,article#presentation > svg > foreignObject > section h4 .octicon-link,article#presentation > svg > foreignObject > section h5 .octicon-link,article#presentation > svg > foreignObject > section h6 .octicon-link{color:#1b1f23;vertical-align:middle;visibility:hidden}article#presentation > svg > foreignObject > section .markdown-body h1:hover .anchor,article#presentation > svg > foreignObject > section .markdown-body h2:hover .anchor,article#presentation > svg > foreignObject > section .markdown-body h3:hover .anchor,article#presentation > svg > foreignObject > section .markdown-body h4:hover .anchor,article#presentation > svg > foreignObject > section .markdown-body h5:hover .anchor,article#presentation > svg > foreignObject > section .markdown-body h6:hover .anchor,article#presentation > svg > foreignObject > section h1:hover .anchor,article#presentation > svg > foreignObject > section h2:hover .anchor,article#presentation > svg > foreignObject > section h3:hover .anchor,article#presentation > svg > foreignObject > section h4:hover .anchor,article#presentation > svg > foreignObject > section h5:hover .anchor,article#presentation > svg > foreignObject > section h6:hover .anchor{text-decoration:none}article#presentation > svg > foreignObject > section .markdown-body h1:hover .anchor .octicon-link,article#presentation > svg > foreignObject > section .markdown-body h2:hover .anchor .octicon-link,article#presentation > svg > foreignObject > section .markdown-body h3:hover .anchor .octicon-link,article#presentation > svg > foreignObject > section .markdown-body h4:hover .anchor .octicon-link,article#presentation > svg > foreignObject > section .markdown-body h5:hover .anchor .octicon-link,article#presentation > svg > foreignObject > section .markdown-body h6:hover .anchor .octicon-link,article#presentation > svg > foreignObject > section h1:hover .anchor .octicon-link,article#presentation > svg > foreignObject > section h2:hover .anchor .octicon-link,article#presentation > svg > foreignObject > section h3:hover .anchor .octicon-link,article#presentation > svg > foreignObject > section h4:hover .anchor .octicon-link,article#presentation > svg > foreignObject > section h5:hover .anchor .octicon-link,article#presentation > svg > foreignObject > section h6:hover .anchor .octicon-link{visibility:visible}article#presentation > svg > foreignObject > section .markdown-body,article#presentation > svg > foreignObject > section{-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;color:#24292e;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;font-size:16px;line-height:1.5;word-wrap:break-word}article#presentation > svg > foreignObject > section .markdown-body .pl-c,article#presentation > svg > foreignObject > section .pl-c{color:#6a737d}article#presentation > svg > foreignObject > section .markdown-body .pl-c1,article#presentation > svg > foreignObject > section .markdown-body .pl-s .pl-v,article#presentation > svg > foreignObject > section .pl-c1,article#presentation > svg > foreignObject > section .pl-s .pl-v{color:#005cc5}article#presentation > svg > foreignObject > section .markdown-body .pl-e,article#presentation > svg > foreignObject > section .markdown-body .pl-en,article#presentation > svg > foreignObject > section .pl-e,article#presentation > svg > foreignObject > section .pl-en{color:#6f42c1}article#presentation > svg > foreignObject > section .markdown-body .pl-s .pl-s1,article#presentation > svg > foreignObject > section .markdown-body .pl-smi,article#presentation > svg > foreignObject > section .pl-s .pl-s1,article#presentation > svg > foreignObject > section .pl-smi{color:#24292e}article#presentation > svg > foreignObject > section .markdown-body .pl-ent,article#presentation > svg > foreignObject > section .pl-ent{color:#22863a}article#presentation > svg > foreignObject > section .markdown-body .pl-k,article#presentation > svg > foreignObject > section .pl-k{color:#d73a49}article#presentation > svg > foreignObject > section .markdown-body .pl-pds,article#presentation > svg > foreignObject > section .markdown-body .pl-s,article#presentation > svg > foreignObject > section .markdown-body .pl-s .pl-pse .pl-s1,article#presentation > svg > foreignObject > section .markdown-body .pl-sr,article#presentation > svg > foreignObject > section .markdown-body .pl-sr .pl-cce,article#presentation > svg > foreignObject > section .markdown-body .pl-sr .pl-sra,article#presentation > svg > foreignObject > section .markdown-body .pl-sr .pl-sre,article#presentation > svg > foreignObject > section .pl-pds,article#presentation > svg > foreignObject > section .pl-s,article#presentation > svg > foreignObject > section .pl-s .pl-pse .pl-s1,article#presentation > svg > foreignObject > section .pl-sr,article#presentation > svg > foreignObject > section .pl-sr .pl-cce,article#presentation > svg > foreignObject > section .pl-sr .pl-sra,article#presentation > svg > foreignObject > section .pl-sr .pl-sre{color:#032f62}article#presentation > svg > foreignObject > section .markdown-body .pl-smw,article#presentation > svg > foreignObject > section .markdown-body .pl-v,article#presentation > svg > foreignObject > section .pl-smw,article#presentation > svg > foreignObject > section .pl-v{color:#e36209}article#presentation > svg > foreignObject > section .markdown-body .pl-bu,article#presentation > svg > foreignObject > section .pl-bu{color:#b31d28}article#presentation > svg > foreignObject > section .markdown-body .pl-ii,article#presentation > svg > foreignObject > section .pl-ii{background-color:#b31d28;color:#fafbfc}article#presentation > svg > foreignObject > section .markdown-body .pl-c2,article#presentation > svg > foreignObject > section .pl-c2{background-color:#d73a49;color:#fafbfc}article#presentation > svg > foreignObject > section .markdown-body .pl-c2:before,article#presentation > svg > foreignObject > section .pl-c2:before{content:"^M"}article#presentation > svg > foreignObject > section .markdown-body .pl-sr .pl-cce,article#presentation > svg > foreignObject > section .pl-sr .pl-cce{color:#22863a;font-weight:700}article#presentation > svg > foreignObject > section .markdown-body .pl-ml,article#presentation > svg > foreignObject > section .pl-ml{color:#735c0f}article#presentation > svg > foreignObject > section .markdown-body .pl-mh,article#presentation > svg > foreignObject > section .markdown-body .pl-mh .pl-en,article#presentation > svg > foreignObject > section .markdown-body .pl-ms,article#presentation > svg > foreignObject > section .pl-mh,article#presentation > svg > foreignObject > section .pl-mh .pl-en,article#presentation > svg > foreignObject > section .pl-ms{color:#005cc5;font-weight:700}article#presentation > svg > foreignObject > section .markdown-body .pl-mi,article#presentation > svg > foreignObject > section .pl-mi{color:#24292e;font-style:italic}article#presentation > svg > foreignObject > section .markdown-body .pl-mb,article#presentation > svg > foreignObject > section .pl-mb{color:#24292e;font-weight:700}article#presentation > svg > foreignObject > section .markdown-body .pl-md,article#presentation > svg > foreignObject > section .pl-md{background-color:#ffeef0;color:#b31d28}article#presentation > svg > foreignObject > section .markdown-body .pl-mi1,article#presentation > svg > foreignObject > section .pl-mi1{background-color:#f0fff4;color:#22863a}article#presentation > svg > foreignObject > section .markdown-body .pl-mc,article#presentation > svg > foreignObject > section .pl-mc{background-color:#ffebda;color:#e36209}article#presentation > svg > foreignObject > section .markdown-body .pl-mi2,article#presentation > svg > foreignObject > section .pl-mi2{background-color:#005cc5;color:#f6f8fa}article#presentation > svg > foreignObject > section .markdown-body .pl-mdr,article#presentation > svg > foreignObject > section .pl-mdr{color:#6f42c1;font-weight:700}article#presentation > svg > foreignObject > section .markdown-body .pl-ba,article#presentation > svg > foreignObject > section .pl-ba{color:#586069}article#presentation > svg > foreignObject > section .markdown-body .pl-sg,article#presentation > svg > foreignObject > section .pl-sg{color:#959da5}article#presentation > svg > foreignObject > section .markdown-body .pl-corl,article#presentation > svg > foreignObject > section .pl-corl{color:#032f62;text-decoration:underline}article#presentation > svg > foreignObject > section .markdown-body details,article#presentation > svg > foreignObject > section details{display:block}article#presentation > svg > foreignObject > section .markdown-body summary,article#presentation > svg > foreignObject > section summary{display:list-item}article#presentation > svg > foreignObject > section .markdown-body a,article#presentation > svg > foreignObject > section a{background-color:transparent}article#presentation > svg > foreignObject > section .markdown-body a:active,article#presentation > svg > foreignObject > section .markdown-body a:hover,article#presentation > svg > foreignObject > section a:active,article#presentation > svg > foreignObject > section a:hover{outline-width:0}article#presentation > svg > foreignObject > section .markdown-body strong,article#presentation > svg > foreignObject > section strong{font-weight:inherit;font-weight:bolder}article#presentation > svg > foreignObject > section .markdown-body h1,article#presentation > svg > foreignObject > section h1{margin:.67em 0}article#presentation > svg > foreignObject > section .markdown-body img,article#presentation > svg > foreignObject > section img{border-style:none}article#presentation > svg > foreignObject > section .markdown-body code,article#presentation > svg > foreignObject > section .markdown-body kbd,article#presentation > svg > foreignObject > section .markdown-body pre,article#presentation > svg > foreignObject > section code,article#presentation > svg > foreignObject > section kbd,article#presentation > svg > foreignObject > section pre{font-family:monospace,monospace;font-size:1em}article#presentation > svg > foreignObject > section .markdown-body hr,article#presentation > svg > foreignObject > section hr{box-sizing:content-box;overflow:visible}article#presentation > svg > foreignObject > section .markdown-body input,article#presentation > svg > foreignObject > section input{font:inherit;margin:0;overflow:visible}article#presentation > svg > foreignObject > section .markdown-body [type=checkbox],article#presentation > svg > foreignObject > section [type=checkbox]{box-sizing:border-box;padding:0}article#presentation > svg > foreignObject > section .markdown-body *,article#presentation > svg > foreignObject > section *{box-sizing:border-box}article#presentation > svg > foreignObject > section .markdown-body input,article#presentation > svg > foreignObject > section input{font-family:inherit;font-size:inherit;line-height:inherit}article#presentation > svg > foreignObject > section .markdown-body a,article#presentation > svg > foreignObject > section a{color:#0366d6;text-decoration:none}article#presentation > svg > foreignObject > section .markdown-body a:hover,article#presentation > svg > foreignObject > section a:hover{text-decoration:underline}article#presentation > svg > foreignObject > section .markdown-body strong,article#presentation > svg > foreignObject > section strong{font-weight:600}article#presentation > svg > foreignObject > section .markdown-body hr,article#presentation > svg > foreignObject > section hr{background:transparent;border-bottom:1px solid #dfe2e5;height:0;margin:15px 0;overflow:hidden}article#presentation > svg > foreignObject > section .markdown-body hr:before,article#presentation > svg > foreignObject > section hr:before{content:"";display:table}article#presentation > svg > foreignObject > section .markdown-body hr:after,article#presentation > svg > foreignObject > section hr:after{clear:both;content:"";display:table}article#presentation > svg > foreignObject > section .markdown-body table,article#presentation > svg > foreignObject > section table{border-collapse:collapse;border-spacing:0}article#presentation > svg > foreignObject > section .markdown-body td,article#presentation > svg > foreignObject > section .markdown-body th,article#presentation > svg > foreignObject > section td,article#presentation > svg > foreignObject > section th{padding:0}article#presentation > svg > foreignObject > section .markdown-body details summary,article#presentation > svg > foreignObject > section details summary{cursor:pointer}article#presentation > svg > foreignObject > section .markdown-body h1,article#presentation > svg > foreignObject > section .markdown-body h2,article#presentation > svg > foreignObject > section .markdown-body h3,article#presentation > svg > foreignObject > section .markdown-body h4,article#presentation > svg > foreignObject > section .markdown-body h5,article#presentation > svg > foreignObject > section .markdown-body h6,article#presentation > svg > foreignObject > section h1,article#presentation > svg > foreignObject > section h2,article#presentation > svg > foreignObject > section h3,article#presentation > svg > foreignObject > section h4,article#presentation > svg > foreignObject > section h5,article#presentation > svg > foreignObject > section h6{margin-bottom:0;margin-top:0}article#presentation > svg > foreignObject > section .markdown-body h1,article#presentation > svg > foreignObject > section h1{font-size:32px}article#presentation > svg > foreignObject > section .markdown-body h1,article#presentation > svg > foreignObject > section .markdown-body h2,article#presentation > svg > foreignObject > section h1,article#presentation > svg > foreignObject > section h2{font-weight:600}article#presentation > svg > foreignObject > section .markdown-body h2,article#presentation > svg > foreignObject > section h2{font-size:24px}article#presentation > svg > foreignObject > section .markdown-body h3,article#presentation > svg > foreignObject > section h3{font-size:20px}article#presentation > svg > foreignObject > section .markdown-body h3,article#presentation > svg > foreignObject > section .markdown-body h4,article#presentation > svg > foreignObject > section h3,article#presentation > svg > foreignObject > section h4{font-weight:600}article#presentation > svg > foreignObject > section .markdown-body h4,article#presentation > svg > foreignObject > section h4{font-size:16px}article#presentation > svg > foreignObject > section .markdown-body h5,article#presentation > svg > foreignObject > section h5{font-size:14px}article#presentation > svg > foreignObject > section .markdown-body h5,article#presentation > svg > foreignObject > section .markdown-body h6,article#presentation > svg > foreignObject > section h5,article#presentation > svg > foreignObject > section h6{font-weight:600}article#presentation > svg > foreignObject > section .markdown-body h6,article#presentation > svg > foreignObject > section h6{font-size:12px}article#presentation > svg > foreignObject > section .markdown-body p,article#presentation > svg > foreignObject > section p{margin-bottom:10px;margin-top:0}article#presentation > svg > foreignObject > section .markdown-body blockquote,article#presentation > svg > foreignObject > section blockquote{margin:0}article#presentation > svg > foreignObject > section .markdown-body ol,article#presentation > svg > foreignObject > section .markdown-body ul,article#presentation > svg > foreignObject > section ol,article#presentation > svg > foreignObject > section ul{margin-bottom:0;margin-top:0;padding-left:0}article#presentation > svg > foreignObject > section .markdown-body ol ol,article#presentation > svg > foreignObject > section .markdown-body ul ol,article#presentation > svg > foreignObject > section ol ol,article#presentation > svg > foreignObject > section ul ol{list-style-type:lower-roman}article#presentation > svg > foreignObject > section .markdown-body ol ol ol,article#presentation > svg > foreignObject > section .markdown-body ol ul ol,article#presentation > svg > foreignObject > section .markdown-body ul ol ol,article#presentation > svg > foreignObject > section .markdown-body ul ul ol,article#presentation > svg > foreignObject > section ol ol ol,article#presentation > svg > foreignObject > section ol ul ol,article#presentation > svg > foreignObject > section ul ol ol,article#presentation > svg > foreignObject > section ul ul ol{list-style-type:lower-alpha}article#presentation > svg > foreignObject > section .markdown-body dd,article#presentation > svg > foreignObject > section dd{margin-left:0}article#presentation > svg > foreignObject > section .markdown-body code,article#presentation > svg > foreignObject > section .markdown-body pre,article#presentation > svg > foreignObject > section code,article#presentation > svg > foreignObject > section pre{font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace;font-size:12px}article#presentation > svg > foreignObject > section .markdown-body pre,article#presentation > svg > foreignObject > section pre{margin-bottom:0;margin-top:0}article#presentation > svg > foreignObject > section .markdown-body input::-webkit-inner-spin-button,article#presentation > svg > foreignObject > section .markdown-body input::-webkit-outer-spin-button,article#presentation > svg > foreignObject > section input::-webkit-inner-spin-button,article#presentation > svg > foreignObject > section input::-webkit-outer-spin-button{-webkit-appearance:none;appearance:none;margin:0}article#presentation > svg > foreignObject > section .markdown-body .border,article#presentation > svg > foreignObject > section .border{border:1px solid #e1e4e8!important}article#presentation > svg > foreignObject > section .markdown-body .border-0,article#presentation > svg > foreignObject > section .border-0{border:0!important}article#presentation > svg > foreignObject > section .markdown-body .border-bottom,article#presentation > svg > foreignObject > section .border-bottom{border-bottom:1px solid #e1e4e8!important}article#presentation > svg > foreignObject > section .markdown-body .rounded-1,article#presentation > svg > foreignObject > section .rounded-1{border-radius:3px!important}article#presentation > svg > foreignObject > section .markdown-body .bg-white,article#presentation > svg > foreignObject > section .bg-white{background-color:#fff!important}article#presentation > svg > foreignObject > section .markdown-body .bg-gray-light,article#presentation > svg > foreignObject > section .bg-gray-light{background-color:#fafbfc!important}article#presentation > svg > foreignObject > section .markdown-body .text-gray-light,article#presentation > svg > foreignObject > section .text-gray-light{color:#6a737d!important}article#presentation > svg > foreignObject > section .markdown-body .mb-0,article#presentation > svg > foreignObject > section .mb-0{margin-bottom:0!important}article#presentation > svg > foreignObject > section .markdown-body .my-2,article#presentation > svg > foreignObject > section .my-2{margin-bottom:8px!important;margin-top:8px!important}article#presentation > svg > foreignObject > section .markdown-body .py-0,article#presentation > svg > foreignObject > section .py-0{padding-bottom:0!important;padding-top:0!important}article#presentation > svg > foreignObject > section .markdown-body .py-2,article#presentation > svg > foreignObject > section .py-2{padding-bottom:8px!important;padding-top:8px!important}article#presentation > svg > foreignObject > section .markdown-body .pl-3,article#presentation > svg > foreignObject > section .markdown-body .px-3,article#presentation > svg > foreignObject > section .pl-3,article#presentation > svg > foreignObject > section .px-3{padding-left:16px!important}article#presentation > svg > foreignObject > section .markdown-body .px-3,article#presentation > svg > foreignObject > section .px-3{padding-right:16px!important}article#presentation > svg > foreignObject > section .markdown-body .f6,article#presentation > svg > foreignObject > section .f6{font-size:12px!important}article#presentation > svg > foreignObject > section .markdown-body .lh-condensed,article#presentation > svg > foreignObject > section .lh-condensed{line-height:1.25!important}article#presentation > svg > foreignObject > section .markdown-body .text-bold,article#presentation > svg > foreignObject > section .text-bold{font-weight:600!important}article#presentation > svg > foreignObject > section .markdown-body:before,article#presentation > svg > foreignObject > section:before{content:"";display:table}article#presentation > svg > foreignObject > section .markdown-body:after,article#presentation > svg > foreignObject > section:after{clear:both;/* content:""; */display:table}article#presentation > svg > foreignObject > section .markdown-body>:first-child,article#presentation > svg > foreignObject > section>:first-child{margin-top:0!important}article#presentation > svg > foreignObject > section .markdown-body>:last-child,article#presentation > svg > foreignObject > section>:last-child{margin-bottom:0!important}article#presentation > svg > foreignObject > section .markdown-body a:not([href]),article#presentation > svg > foreignObject > section a:not([href]){color:inherit;text-decoration:none}article#presentation > svg > foreignObject > section .markdown-body blockquote,article#presentation > svg > foreignObject > section .markdown-body dl,article#presentation > svg > foreignObject > section .markdown-body ol,article#presentation > svg > foreignObject > section .markdown-body p,article#presentation > svg > foreignObject > section .markdown-body pre,article#presentation > svg > foreignObject > section .markdown-body table,article#presentation > svg > foreignObject > section .markdown-body ul,article#presentation > svg > foreignObject > section blockquote,article#presentation > svg > foreignObject > section dl,article#presentation > svg > foreignObject > section ol,article#presentation > svg > foreignObject > section p,article#presentation > svg > foreignObject > section pre,article#presentation > svg > foreignObject > section table,article#presentation > svg > foreignObject > section ul{margin-bottom:16px;margin-top:0}article#presentation > svg > foreignObject > section .markdown-body hr,article#presentation > svg > foreignObject > section hr{background-color:#e1e4e8;border:0;height:.25em;margin:24px 0;padding:0}article#presentation > svg > foreignObject > section .markdown-body blockquote,article#presentation > svg > foreignObject > section blockquote{border-left:.25em solid #dfe2e5;color:#6a737d;padding:0 1em}article#presentation > svg > foreignObject > section .markdown-body blockquote>:first-child,article#presentation > svg > foreignObject > section blockquote>:first-child{margin-top:0}article#presentation > svg > foreignObject > section .markdown-body blockquote>:last-child,article#presentation > svg > foreignObject > section blockquote>:last-child{margin-bottom:0}article#presentation > svg > foreignObject > section .markdown-body kbd,article#presentation > svg > foreignObject > section kbd{border:1px solid #c6cbd1;border-bottom-color:#959da5;box-shadow:inset 0 -1px 0 #959da5;font-size:11px}article#presentation > svg > foreignObject > section .markdown-body h1,article#presentation > svg > foreignObject > section .markdown-body h2,article#presentation > svg > foreignObject > section .markdown-body h3,article#presentation > svg > foreignObject > section .markdown-body h4,article#presentation > svg > foreignObject > section .markdown-body h5,article#presentation > svg > foreignObject > section .markdown-body h6,article#presentation > svg > foreignObject > section h1,article#presentation > svg > foreignObject > section h2,article#presentation > svg > foreignObject > section h3,article#presentation > svg > foreignObject > section h4,article#presentation > svg > foreignObject > section h5,article#presentation > svg > foreignObject > section h6{font-weight:600;line-height:1.25;margin-bottom:16px;margin-top:24px}article#presentation > svg > foreignObject > section .markdown-body h1,article#presentation > svg > foreignObject > section h1{font-size:2em}article#presentation > svg > foreignObject > section .markdown-body h1,article#presentation > svg > foreignObject > section .markdown-body h2,article#presentation > svg > foreignObject > section h1,article#presentation > svg > foreignObject > section h2{border-bottom:1px solid #eaecef;padding-bottom:.3em}article#presentation > svg > foreignObject > section .markdown-body h2,article#presentation > svg > foreignObject > section h2{font-size:1.5em}article#presentation > svg > foreignObject > section .markdown-body h3,article#presentation > svg > foreignObject > section h3{font-size:1.25em}article#presentation > svg > foreignObject > section .markdown-body h4,article#presentation > svg > foreignObject > section h4{font-size:1em}article#presentation > svg > foreignObject > section .markdown-body h5,article#presentation > svg > foreignObject > section h5{font-size:.875em}article#presentation > svg > foreignObject > section .markdown-body h6,article#presentation > svg > foreignObject > section h6{color:#6a737d;font-size:.85em}article#presentation > svg > foreignObject > section .markdown-body ol,article#presentation > svg > foreignObject > section .markdown-body ul,article#presentation > svg > foreignObject > section ol,article#presentation > svg > foreignObject > section ul{padding-left:2em}article#presentation > svg > foreignObject > section .markdown-body ol ol,article#presentation > svg > foreignObject > section .markdown-body ol ul,article#presentation > svg > foreignObject > section .markdown-body ul ol,article#presentation > svg > foreignObject > section .markdown-body ul ul,article#presentation > svg > foreignObject > section ol ol,article#presentation > svg > foreignObject > section ol ul,article#presentation > svg > foreignObject > section ul ol,article#presentation > svg > foreignObject > section ul ul{margin-bottom:0;margin-top:0}article#presentation > svg > foreignObject > section .markdown-body li,article#presentation > svg > foreignObject > section li{word-wrap:break-all}article#presentation > svg > foreignObject > section .markdown-body li>p,article#presentation > svg > foreignObject > section li>p{margin-top:16px}article#presentation > svg > foreignObject > section .markdown-body li+li,article#presentation > svg > foreignObject > section li+li{margin-top:.25em}article#presentation > svg > foreignObject > section .markdown-body dl,article#presentation > svg > foreignObject > section dl{padding:0}article#presentation > svg > foreignObject > section .markdown-body dl dt,article#presentation > svg > foreignObject > section dl dt{font-size:1em;font-style:italic;font-weight:600;margin-top:16px;padding:0}article#presentation > svg > foreignObject > section .markdown-body dl dd,article#presentation > svg > foreignObject > section dl dd{margin-bottom:16px;padding:0 16px}article#presentation > svg > foreignObject > section .markdown-body table,article#presentation > svg > foreignObject > section table{display:block;overflow:auto;width:100%}article#presentation > svg > foreignObject > section .markdown-body table th,article#presentation > svg > foreignObject > section table th{font-weight:600}article#presentation > svg > foreignObject > section .markdown-body table td,article#presentation > svg > foreignObject > section .markdown-body table th,article#presentation > svg > foreignObject > section table td,article#presentation > svg > foreignObject > section table th{border:1px solid #dfe2e5;padding:6px 13px}article#presentation > svg > foreignObject > section .markdown-body table tr,article#presentation > svg > foreignObject > section table tr{background-color:#fff;border-top:1px solid #c6cbd1}article#presentation > svg > foreignObject > section .markdown-body table tr:nth-child(2n),article#presentation > svg > foreignObject > section table tr:nth-child(2n){background-color:#f6f8fa}article#presentation > svg > foreignObject > section .markdown-body img,article#presentation > svg > foreignObject > section img{background-color:#fff;box-sizing:content-box;max-width:100%}article#presentation > svg > foreignObject > section .markdown-body img[align=right],article#presentation > svg > foreignObject > section img[align=right]{padding-left:20px}article#presentation > svg > foreignObject > section .markdown-body img[align=left],article#presentation > svg > foreignObject > section img[align=left]{padding-right:20px}article#presentation > svg > foreignObject > section .markdown-body code,article#presentation > svg > foreignObject > section code{background-color:rgba(27,31,35,.05);border-radius:3px;font-size:85%;margin:0;padding:.2em .4em}article#presentation > svg > foreignObject > section .markdown-body pre,article#presentation > svg > foreignObject > section pre{word-wrap:normal}article#presentation > svg > foreignObject > section .markdown-body pre>code,article#presentation > svg > foreignObject > section pre>code{background:transparent;border:0;font-size:100%;margin:0;padding:0;white-space:pre;word-break:normal}article#presentation > svg > foreignObject > section .markdown-body .highlight,article#presentation > svg > foreignObject > section .highlight{margin-bottom:16px}article#presentation > svg > foreignObject > section .markdown-body .highlight pre,article#presentation > svg > foreignObject > section .highlight pre{margin-bottom:0;word-break:normal}article#presentation > svg > foreignObject > section .markdown-body .highlight pre,article#presentation > svg > foreignObject > section .markdown-body pre,article#presentation > svg > foreignObject > section .highlight pre,article#presentation > svg > foreignObject > section pre{background-color:#f6f8fa;border-radius:3px;font-size:85%;line-height:1.45;overflow:auto;padding:16px}article#presentation > svg > foreignObject > section .markdown-body pre code,article#presentation > svg > foreignObject > section pre code{background-color:transparent;border:0;display:inline;line-height:inherit;margin:0;max-width:auto;overflow:visible;padding:0;word-wrap:normal}article#presentation > svg > foreignObject > section .markdown-body .commit-tease-sha,article#presentation > svg > foreignObject > section .commit-tease-sha{color:#444d56;display:inline-block;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace;font-size:90%}article#presentation > svg > foreignObject > section .markdown-body .blob-wrapper,article#presentation > svg > foreignObject > section .blob-wrapper{border-bottom-left-radius:3px;border-bottom-right-radius:3px;overflow-x:auto;overflow-y:hidden}article#presentation > svg > foreignObject > section .markdown-body .blob-wrapper-embedded,article#presentation > svg > foreignObject > section .blob-wrapper-embedded{max-height:240px;overflow-y:auto}article#presentation > svg > foreignObject > section .markdown-body .blob-num,article#presentation > svg > foreignObject > section .blob-num{-moz-user-select:none;-ms-user-select:none;-webkit-user-select:none;color:rgba(27,31,35,.3);cursor:pointer;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace;font-size:12px;line-height:20px;min-width:50px;padding-left:10px;padding-right:10px;text-align:right;user-select:none;vertical-align:top;white-space:nowrap;width:1%}article#presentation > svg > foreignObject > section .markdown-body .blob-num:hover,article#presentation > svg > foreignObject > section .blob-num:hover{color:rgba(27,31,35,.6)}article#presentation > svg > foreignObject > section .markdown-body .blob-num:before,article#presentation > svg > foreignObject > section .blob-num:before{content:attr(data-line-number)}article#presentation > svg > foreignObject > section .markdown-body .blob-code,article#presentation > svg > foreignObject > section .blob-code{line-height:20px;padding-left:10px;padding-right:10px;position:relative;vertical-align:top}article#presentation > svg > foreignObject > section .markdown-body .blob-code-inner,article#presentation > svg > foreignObject > section .blob-code-inner{color:#24292e;font-family:SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace;font-size:12px;overflow:visible;white-space:pre;word-wrap:normal}article#presentation > svg > foreignObject > section .markdown-body .pl-token.active,article#presentation > svg > foreignObject > section .markdown-body .pl-token:hover,article#presentation > svg > foreignObject > section .pl-token.active,article#presentation > svg > foreignObject > section .pl-token:hover{background:#ffea7f;cursor:pointer}article#presentation > svg > foreignObject > section .markdown-body kbd,article#presentation > svg > foreignObject > section kbd{background-color:#fafbfc;border:1px solid #d1d5da;border-bottom-color:#c6cbd1;border-radius:3px;box-shadow:inset 0 -1px 0 #c6cbd1;color:#444d56;display:inline-block;font:11px SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace;line-height:10px;padding:3px 5px;vertical-align:middle}article#presentation > svg > foreignObject > section .markdown-body :checked+.radio-label,article#presentation > svg > foreignObject > section :checked+.radio-label{border-color:#0366d6;position:relative;z-index:1}article#presentation > svg > foreignObject > section .markdown-body .tab-size[data-tab-size="1"],article#presentation > svg > foreignObject > section .tab-size[data-tab-size="1"]{-moz-tab-size:1;-o-tab-size:1;tab-size:1}article#presentation > svg > foreignObject > section .markdown-body .tab-size[data-tab-size="2"],article#presentation > svg > foreignObject > section .tab-size[data-tab-size="2"]{-moz-tab-size:2;-o-tab-size:2;tab-size:2}article#presentation > svg > foreignObject > section .markdown-body .tab-size[data-tab-size="3"],article#presentation > svg > foreignObject > section .tab-size[data-tab-size="3"]{-moz-tab-size:3;-o-tab-size:3;tab-size:3}article#presentation > svg > foreignObject > section .markdown-body .tab-size[data-tab-size="4"],article#presentation > svg > foreignObject > section .tab-size[data-tab-size="4"]{-moz-tab-size:4;-o-tab-size:4;tab-size:4}article#presentation > svg > foreignObject > section .markdown-body .tab-size[data-tab-size="5"],article#presentation > svg > foreignObject > section .tab-size[data-tab-size="5"]{-moz-tab-size:5;-o-tab-size:5;tab-size:5}article#presentation > svg > foreignObject > section .markdown-body .tab-size[data-tab-size="6"],article#presentation > svg > foreignObject > section .tab-size[data-tab-size="6"]{-moz-tab-size:6;-o-tab-size:6;tab-size:6}article#presentation > svg > foreignObject > section .markdown-body .tab-size[data-tab-size="7"],article#presentation > svg > foreignObject > section .tab-size[data-tab-size="7"]{-moz-tab-size:7;-o-tab-size:7;tab-size:7}article#presentation > svg > foreignObject > section .markdown-body .tab-size[data-tab-size="8"],article#presentation > svg > foreignObject > section .tab-size[data-tab-size="8"]{-moz-tab-size:8;-o-tab-size:8;tab-size:8}article#presentation > svg > foreignObject > section .markdown-body .tab-size[data-tab-size="9"],article#presentation > svg > foreignObject > section .tab-size[data-tab-size="9"]{-moz-tab-size:9;-o-tab-size:9;tab-size:9}article#presentation > svg > foreignObject > section .markdown-body .tab-size[data-tab-size="10"],article#presentation > svg > foreignObject > section .tab-size[data-tab-size="10"]{-moz-tab-size:10;-o-tab-size:10;tab-size:10}article#presentation > svg > foreignObject > section .markdown-body .tab-size[data-tab-size="11"],article#presentation > svg > foreignObject > section .tab-size[data-tab-size="11"]{-moz-tab-size:11;-o-tab-size:11;tab-size:11}article#presentation > svg > foreignObject > section .markdown-body .tab-size[data-tab-size="12"],article#presentation > svg > foreignObject > section .tab-size[data-tab-size="12"]{-moz-tab-size:12;-o-tab-size:12;tab-size:12}article#presentation > svg > foreignObject > section .markdown-body .task-list-item,article#presentation > svg > foreignObject > section .task-list-item{list-style-type:none}article#presentation > svg > foreignObject > section .markdown-body .task-list-item+.task-list-item,article#presentation > svg > foreignObject > section .task-list-item+.task-list-item{margin-top:3px}article#presentation > svg > foreignObject > section .markdown-body .task-list-item input,article#presentation > svg > foreignObject > section .task-list-item input{margin:0 .2em .25em -1.6em;vertical-align:middle}article#presentation > svg > foreignObject > section .markdown-body hr,article#presentation > svg > foreignObject > section hr{border-bottom-color:#eee}article#presentation > svg > foreignObject > section .markdown-body .pl-0,article#presentation > svg > foreignObject > section .pl-0{padding-left:0!important}article#presentation > svg > foreignObject > section .markdown-body .pl-1,article#presentation > svg > foreignObject > section .pl-1{padding-left:4px!important}article#presentation > svg > foreignObject > section .markdown-body .pl-2,article#presentation > svg > foreignObject > section .pl-2{padding-left:8px!important}article#presentation > svg > foreignObject > section .markdown-body .pl-3,article#presentation > svg > foreignObject > section .pl-3{padding-left:16px!important}article#presentation > svg > foreignObject > section .markdown-body .pl-4,article#presentation > svg > foreignObject > section .pl-4{padding-left:24px!important}article#presentation > svg > foreignObject > section .markdown-body .pl-5,article#presentation > svg > foreignObject > section .pl-5{padding-left:32px!important}article#presentation > svg > foreignObject > section .markdown-body .pl-6,article#presentation > svg > foreignObject > section .pl-6{padding-left:40px!important}article#presentation > svg > foreignObject > section .markdown-body .pl-7,article#presentation > svg > foreignObject > section .pl-7{padding-left:48px!important}article#presentation > svg > foreignObject > section .markdown-body .pl-8,article#presentation > svg > foreignObject > section .pl-8{padding-left:64px!important}article#presentation > svg > foreignObject > section .markdown-body .pl-9,article#presentation > svg > foreignObject > section .pl-9{padding-left:80px!important}article#presentation > svg > foreignObject > section .markdown-body .pl-10,article#presentation > svg > foreignObject > section .pl-10{padding-left:96px!important}article#presentation > svg > foreignObject > section .markdown-body .pl-11,article#presentation > svg > foreignObject > section .pl-11{padding-left:112px!important}article#presentation > svg > foreignObject > section .markdown-body .pl-12,article#presentation > svg > foreignObject > section .pl-12{padding-left:128px!important}article#presentation > svg > foreignObject > section .hljs{display:block;background:#fff;padding:.5em;color:#333;overflow-x:auto}article#presentation > svg > foreignObject > section .hljs-comment,article#presentation > svg > foreignObject > section .hljs-meta{color:#969896}article#presentation > svg > foreignObject > section .hljs-emphasis,article#presentation > svg > foreignObject > section .hljs-quote,article#presentation > svg > foreignObject > section .hljs-string,article#presentation > svg > foreignObject > section .hljs-strong,article#presentation > svg > foreignObject > section .hljs-template-variable,article#presentation > svg > foreignObject > section .hljs-variable{color:#df5000}article#presentation > svg > foreignObject > section .hljs-keyword,article#presentation > svg > foreignObject > section .hljs-selector-tag,article#presentation > svg > foreignObject > section .hljs-type{color:#a71d5d}article#presentation > svg > foreignObject > section .hljs-attribute,article#presentation > svg > foreignObject > section .hljs-bullet,article#presentation > svg > foreignObject > section .hljs-literal,article#presentation > svg > foreignObject > section .hljs-symbol{color:#0086b3}article#presentation > svg > foreignObject > section .hljs-name,article#presentation > svg > foreignObject > section .hljs-section{color:#63a35c}article#presentation > svg > foreignObject > section .hljs-tag{color:#333}article#presentation > svg > foreignObject > section .hljs-attr,article#presentation > svg > foreignObject > section .hljs-selector-attr,article#presentation > svg > foreignObject > section .hljs-selector-class,article#presentation > svg > foreignObject > section .hljs-selector-id,article#presentation > svg > foreignObject > section .hljs-selector-pseudo,article#presentation > svg > foreignObject > section .hljs-title{color:#795da3}article#presentation > svg > foreignObject > section .hljs-addition{color:#55a532;background-color:#eaffea}article#presentation > svg > foreignObject > section .hljs-deletion{color:#bd2c00;background-color:#ffecec}article#presentation > svg > foreignObject > section .hljs-link{text-decoration:underline}article#presentation > svg > foreignObject > section svg[data-marp-fitting=svg]{max-height:563px}article#presentation > svg > foreignObject > section h1{color:#246;font-size:1.6em}article#presentation > svg > foreignObject > section h1,article#presentation > svg > foreignObject > section h2{border-bottom:none}article#presentation > svg > foreignObject > section h2{font-size:1.3em}article#presentation > svg > foreignObject > section h3{font-size:1.1em}article#presentation > svg > foreignObject > section h4{font-size:1.05em}article#presentation > svg > foreignObject > section h5{font-size:1em}article#presentation > svg > foreignObject > section h6{font-size:.9em}article#presentation > svg > foreignObject > section h1 strong,article#presentation > svg > foreignObject > section h2 strong,article#presentation > svg > foreignObject > section h3 strong,article#presentation > svg > foreignObject > section h4 strong,article#presentation > svg > foreignObject > section h5 strong,article#presentation > svg > foreignObject > section h6 strong{font-weight:inherit;color:#48c}article#presentation > svg > foreignObject > section hr{height:0;padding-top:.25em}article#presentation > svg > foreignObject > section pre{border:1px solid #999;line-height:1.15;overflow:visible}article#presentation > svg > foreignObject > section pre code svg[data-marp-fitting=svg]{max-height:529px}article#presentation > svg > foreignObject > section footer,article#presentation > svg > foreignObject > section header{margin:0;position:absolute;left:30px;color:hsla(0,0%,40%,.75);font-size:18px}article#presentation > svg > foreignObject > section header{top:21px}article#presentation > svg > foreignObject > section footer{bottom:21px}article#presentation > svg > foreignObject > section{align-items:stretch;background:#fff;display:flex;flex-direction:column;flex-wrap:nowrap;font-size:29px;height:720px;justify-content:center;padding:78.5px;width:1280px}article#presentation > svg > foreignObject > section>:last-child,article#presentation > svg > foreignObject > section[data-footer]>:nth-last-child(2){margin-bottom:0}article#presentation > svg > foreignObject > section>:first-child,article#presentation > svg > foreignObject > section>header:first-child+*{margin-top:0}article#presentation > svg > foreignObject > section:after{position:absolute;padding:0;right:30px;bottom:21px;font-size:24px;color:#777}article#presentation > svg > foreignObject > section.invert{background-color:#222;color:#e6eaf0}article#presentation > svg > foreignObject > section.invert:after{color:#999}article#presentation > svg > foreignObject > section.invert img{background-color:transparent}article#presentation > svg > foreignObject > section.invert a{color:#50b3ff}article#presentation > svg > foreignObject > section.invert h1{color:#a3c5e7}article#presentation > svg > foreignObject > section.invert h2,article#presentation > svg > foreignObject > section.invert h3,article#presentation > svg > foreignObject > section.invert h4,article#presentation > svg > foreignObject > section.invert h5{color:#ebeff5}article#presentation > svg > foreignObject > section.invert blockquote,article#presentation > svg > foreignObject > section.invert h6{border-color:#3d3f43;color:#939699}article#presentation > svg > foreignObject > section.invert h1 strong,article#presentation > svg > foreignObject > section.invert h2 strong,article#presentation > svg > foreignObject > section.invert h3 strong,article#presentation > svg > foreignObject > section.invert h4 strong,article#presentation > svg > foreignObject > section.invert h5 strong,article#presentation > svg > foreignObject > section.invert h6 strong{color:#7bf}article#presentation > svg > foreignObject > section.invert hr{background-color:#3d3f43}article#presentation > svg > foreignObject > section.invert footer,article#presentation > svg > foreignObject > section.invert header{color:hsla(0,0%,60%,.75)}article#presentation > svg > foreignObject > section.invert code,article#presentation > svg > foreignObject > section.invert kbd{background-color:#111}article#presentation > svg > foreignObject > section.invert kbd{border-color:#666;box-shadow:inset 0 -1px 0 #555;color:#e6eaf0}article#presentation > svg > foreignObject > section.invert table tr{background-color:#12181d;border-color:#60657b}article#presentation > svg > foreignObject > section.invert table tr:nth-child(2n){background-color:#1b2024}article#presentation > svg > foreignObject > section.invert table td,article#presentation > svg > foreignObject > section.invert table th{border-color:#5b5e61}article#presentation > svg > foreignObject > section.invert pre{background-color:#0a0e12;border-color:#777}article#presentation > svg > foreignObject > section.invert pre code{background-color:transparent}article#presentation > svg > foreignObject > section[data-color] h1,article#presentation > svg > foreignObject > section[data-color] h2,article#presentation > svg > foreignObject > section[data-color] h3,article#presentation > svg > foreignObject > section[data-color] h4,article#presentation > svg > foreignObject > section[data-color] h5,article#presentation > svg > foreignObject > section[data-color] h6{color:currentColor}article#presentation > svg > foreignObject > section[data-marpit-advanced-background="background"] {
|
||
padding: 0 !important;
|
||
}article#presentation > svg > foreignObject > section[data-marpit-advanced-background="background"]::before,
|
||
article#presentation > svg > foreignObject > section[data-marpit-advanced-background="background"]::after,
|
||
article#presentation > svg > foreignObject > section[data-marpit-advanced-background="content"]::before,
|
||
article#presentation > svg > foreignObject > section[data-marpit-advanced-background="content"]::after {
|
||
display: none !important;
|
||
}article#presentation > svg > foreignObject > section[data-marpit-advanced-background="background"] > div[data-marpit-advanced-background-container] {
|
||
all: initial;
|
||
display: flex;
|
||
flex-direction: row;
|
||
height: 100%;
|
||
overflow: hidden;
|
||
width: 100%;
|
||
}article#presentation > svg > foreignObject > section[data-marpit-advanced-background="background"][data-marpit-advanced-background-split] > div[data-marpit-advanced-background-container] {
|
||
width: 50%;
|
||
}article#presentation > svg > foreignObject > section[data-marpit-advanced-background="background"][data-marpit-advanced-background-split="right"] > div[data-marpit-advanced-background-container] {
|
||
margin-left: 50%;
|
||
}article#presentation > svg > foreignObject > section[data-marpit-advanced-background="background"] > div[data-marpit-advanced-background-container] > figure {
|
||
all: initial;
|
||
background-position: center;
|
||
background-repeat: no-repeat;
|
||
background-size: cover;
|
||
flex: auto;
|
||
margin: 0;
|
||
}article#presentation > svg > foreignObject > section[data-marpit-advanced-background="content"],
|
||
article#presentation > svg > foreignObject > section[data-marpit-advanced-background="pseudo"] {
|
||
background: transparent !important;
|
||
}article#presentation > svg > foreignObject > section[data-marpit-advanced-background="pseudo"],
|
||
article#presentation > svg[data-marpit-svg] > foreignObject[data-marpit-advanced-background="pseudo"] {
|
||
pointer-events: none !important;
|
||
}article#presentation > svg > foreignObject > section[data-marpit-advanced-background-split] {
|
||
width: 100%;
|
||
height: 100%;
|
||
}</style></head><body><div class="bespoke-marp-osc"><button data-bespoke-marp-osc="prev" tabindex="-1" title="Previous slide">Previous slide</button><span data-bespoke-marp-osc="page"></span><button data-bespoke-marp-osc="next" tabindex="-1" title="Next slide">Next slide</button><button data-bespoke-marp-osc="fullscreen" tabindex="-1" title="Toggle fullscreen (f)">Toggle fullscreen</button></div><article id="presentation"><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="1" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="1" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1><svg data-marp-fitting="svg"><foreignObject><span data-marp-fitting-svg-content> Practical Cryptography</span></foreignObject></svg></h1>
|
||
<h1>Requirements</h1>
|
||
<ul>
|
||
<li><code>openssl version</code> (1.1.1a)</li>
|
||
<li><code>curl --version</code> (7.64.0)</li>
|
||
<li><code>php --version</code> (7.3.2)</li>
|
||
<li><code>php -m |grep -e openssl -e curl</code></li>
|
||
<li><code>composer --version</code> (See <a href="https://getcomposer.org/download/">https://getcomposer.org/download/</a>) (1.8.4)</li>
|
||
<li><code>docker --version</code> (18.09.2-ce)</li>
|
||
<li><code>libtasn</code> (<code>brew install libtasn1</code>) (4.13)</li>
|
||
</ul>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="2" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="2" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1><svg data-marp-fitting="svg"><foreignObject><span data-marp-fitting-svg-content> Practical PKI</span></foreignObject></svg></h1>
|
||
<p><a href="nemo@razorpay.com"><em>nemo</em></a></p>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="3" data-paginate="true" data-footer="Razorpay" data-background-color="rebeccapurple" data-color="white" data-class="lead" data-theme="default" class="lead" data-marpit-pagination="3" style="--paginate:true;--footer:Razorpay;--background-color:rebeccapurple;--color:white;--class:lead;--theme:default;color:white;background-color:rebeccapurple;background-image:none;">
|
||
<h1><svg data-marp-fitting="svg"><foreignObject><span data-marp-fitting-svg-content> Why</span></foreignObject></svg></h1>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="4" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="4" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1>Objectives</h1>
|
||
<ul>
|
||
<li>Get familiar with Crypto primitives</li>
|
||
<li>Hands-on with
|
||
<ul>
|
||
<li>OpenSSL</li>
|
||
<li>TLS</li>
|
||
<li>Curl</li>
|
||
</ul>
|
||
</li>
|
||
</ul>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="5" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="5" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1>Non-Goals</h1>
|
||
<ul>
|
||
<li>Understanding all Crypto-Attacks (we'll discuss a couple)</li>
|
||
<li>Elliptic Curve Crypto</li>
|
||
<li>crypto-currencies <img class="emoji" draggable="false" alt="🤑" src="https://twemoji.maxcdn.com/2/svg/1f911.svg" data-marp-twemoji=""/></li>
|
||
<li>Math</li>
|
||
<li>Intermediate Certs</li>
|
||
<li>Cert Revocation</li>
|
||
</ul>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="6" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="6" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1>Requirements</h1>
|
||
<ul>
|
||
<li><code>openssl version</code> (1.1.1a)</li>
|
||
<li><code>curl --version</code> (7.64.0)</li>
|
||
<li><code>php --version</code> (7.3.2)</li>
|
||
<li><code>php -m |grep -e openssl -e curl</code></li>
|
||
<li><code>composer --version</code> (See <a href="https://getcomposer.org/download/">https://getcomposer.org/download/</a>) (1.8.4)</li>
|
||
<li><code>docker --version</code> (18.09.2-ce)</li>
|
||
<li><code>libtasn</code> (<code>brew install libtasn1</code>) (4.13)</li>
|
||
</ul>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="7" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="7" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1>Setup</h1>
|
||
<ol>
|
||
<li>Have a browser open with Google (Lots of googling needed for this)</li>
|
||
<li><code>git clone git@github.com/captn3m0/crypto.koans.git && cd crypto.koans</code></li>
|
||
<li><code>composer install</code></li>
|
||
</ol>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="8" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="8" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1><svg data-marp-fitting="svg"><foreignObject><span data-marp-fitting-svg-content> Koans <img class="emoji" draggable="false" alt="💃" src="https://twemoji.maxcdn.com/2/svg/1f483.svg" data-marp-twemoji=""/></span></foreignObject></svg></h1>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="9" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="9" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1><strong>koan</strong></h1>
|
||
<p><em>noun</em>, <strong>plural ko·ans, ko·an.</strong> <em>Zen.</em></p>
|
||
<ol>
|
||
<li>a nonsensical or paradoxical question to a student for which an answer is demanded, the stress of meditation on the question often being illuminating.</li>
|
||
</ol>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="10" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="10" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1><svg data-marp-fitting="svg"><foreignObject><span data-marp-fitting-svg-content> What is the colour of wind?</span></foreignObject></svg></h1>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="11" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="11" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h2>Ruby <img class="emoji" draggable="false" alt="💎" src="https://twemoji.maxcdn.com/2/svg/1f48e.svg" data-marp-twemoji=""/></h2>
|
||
<pre><code><svg data-marp-fitting="svg" data-marp-fitting-code><foreignObject><span data-marp-fitting-svg-content><span data-marp-fitting-svg-content-wrap>ruby path_to_enlightenment.rb
|
||
|
||
Thinking AboutAsserts
|
||
test_assert_truth has damaged your karma.
|
||
|
||
You have <span class="hljs-keyword">not</span> yet reached enlightenment ...
|
||
<<span class="hljs-literal">false</span>> <span class="hljs-keyword">is</span> <span class="hljs-keyword">not</span> <span class="hljs-literal">true</span>.
|
||
|
||
Please meditate <span class="hljs-keyword">on</span> <span class="hljs-keyword">the</span> following code:
|
||
./about_asserts.rb:<span class="hljs-number">10</span>:<span class="hljs-keyword">in</span> `test_assert_truth'
|
||
path_to_enlightenment.rb:<span class="hljs-number">27</span>
|
||
|
||
mountains are merely mountains
|
||
</span></span></foreignObject></svg></code></pre>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="12" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="12" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<pre><code class="language-ruby"><svg data-marp-fitting="svg" data-marp-fitting-code><foreignObject><span data-marp-fitting-svg-content><span data-marp-fitting-svg-content-wrap> <span class="hljs-comment"># We shall contemplate truth by testing reality, via asserts.</span>
|
||
<span class="hljs-function"><span class="hljs-keyword">def</span> <span class="hljs-title">test_assert_truth</span></span>
|
||
assert <span class="hljs-literal">false</span> <span class="hljs-comment"># This should be true</span>
|
||
<span class="hljs-keyword">end</span>
|
||
</span></span></foreignObject></svg></code></pre>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="13" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="13" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1>tl;dr</h1>
|
||
<ol>
|
||
<li>Run tests</li>
|
||
<li>Why is the test failing? (<code>koans/files</code> directories)</li>
|
||
<li>Get it to pass</li>
|
||
</ol>
|
||
<p><img class="emoji" draggable="false" alt="👌🏼" src="https://twemoji.maxcdn.com/2/svg/1f44c-1f3fc.svg" data-marp-twemoji=""/> Don't Cheat</p>
|
||
<ul>
|
||
<li><img class="emoji" draggable="false" alt="❗" src="https://twemoji.maxcdn.com/2/svg/2757.svg" data-marp-twemoji=""/> Means you must do something here</li>
|
||
<li>Keep a <a href="http://solutions.md">solutions.md</a> file listing down commands as you run them</li>
|
||
</ul>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="14" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="14" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1>Setup</h1>
|
||
<ol>
|
||
<li>Have a browser open with Google (Lots of googling needed for this)</li>
|
||
<li><code>git clone git@github.com/captn3m0/crypto.koans.git && cd crypto.koans</code></li>
|
||
<li><code>composer install</code></li>
|
||
<li><code>vendor/bin/phpunit</code></li>
|
||
<li><code>man openssl</code>, <code>man curl</code></li>
|
||
</ol>
|
||
<p><img class="emoji" draggable="false" alt="🧘♀️" src="https://twemoji.maxcdn.com/2/svg/1f9d8-200d-2640-fe0f.svg" data-marp-twemoji=""/><img class="emoji" draggable="false" alt="🧘♂️" src="https://twemoji.maxcdn.com/2/svg/1f9d8-200d-2642-fe0f.svg" data-marp-twemoji=""/></p>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="15" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="15" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1><svg data-marp-fitting="svg"><foreignObject><span data-marp-fitting-svg-content> <code>vendor/bin/phpunit</code></span></foreignObject></svg></h1>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="16" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="16" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1><code>OpensslKeyGenerationKoans.php</code></h1>
|
||
<p><code>vendor/bin/phpunit --filter BOpensslKeyGenerationKoans</code></p>
|
||
<h2><svg data-marp-fitting="svg"><foreignObject><span data-marp-fitting-svg-content> Questions<img class="emoji" draggable="false" alt="❓" src="https://twemoji.maxcdn.com/2/svg/2753.svg" data-marp-twemoji=""/></span></foreignObject></svg></h2>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="17" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="17" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1><code>FileFormatKoans.php</code></h1>
|
||
<p><code>vendor/bin/phpunit --filter CFileFormatKoans</code></p>
|
||
<h2><svg data-marp-fitting="svg"><foreignObject><span data-marp-fitting-svg-content> Questions<img class="emoji" draggable="false" alt="❓" src="https://twemoji.maxcdn.com/2/svg/2753.svg" data-marp-twemoji=""/></span></foreignObject></svg></h2>
|
||
<ul>
|
||
<li>What is PEM vs DER?</li>
|
||
</ul>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="18" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="18" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1>Theory Break 1</h1>
|
||
<ul>
|
||
<li>Keys</li>
|
||
<li>Certificates</li>
|
||
<li>Signatures</li>
|
||
</ul>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="19" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="19" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1><code>CA Certificates</code></h1>
|
||
<p><code>vendor/bin/phpunit --filter DCaCertificateKoans.php</code></p>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="20" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="20" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1><svg data-marp-fitting="svg"><foreignObject><span data-marp-fitting-svg-content> Generate A CA Certificate</span></foreignObject></svg></h1>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="21" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="21" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1>testCaCertificateExists</h1>
|
||
<pre><code class="language-haskell"><svg data-marp-fitting="svg" data-marp-fitting-code><foreignObject><span data-marp-fitting-svg-content><span data-marp-fitting-svg-content-wrap><span class="hljs-title">openssl</span> req -x509
|
||
-newkey rsa:<span class="hljs-number">1024</span>
|
||
-keyout files/ca.key
|
||
-nodes
|
||
-out files/ca.pem
|
||
-subj '/<span class="hljs-type">CN</span>=crypto.koans.invalid'
|
||
</span></span></foreignObject></svg></code></pre>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="22" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="22" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1><svg data-marp-fitting="svg"><foreignObject><span data-marp-fitting-svg-content> Generate a Certificate Signing Request</span></foreignObject></svg></h1>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="23" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="23" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1><svg data-marp-fitting="svg"><foreignObject><span data-marp-fitting-svg-content> Generate a Certificate Signing Request</span></foreignObject></svg></h1>
|
||
<pre><code class="language-haskell"><svg data-marp-fitting="svg" data-marp-fitting-code><foreignObject><span data-marp-fitting-svg-content><span data-marp-fitting-svg-content-wrap><span class="hljs-title">openssl</span> req -new
|
||
-key files/<span class="hljs-number">1.</span>key
|
||
-subj '/<span class="hljs-type">CN</span>=server.crypto.koans.invalid'
|
||
-out files/<span class="hljs-number">1.</span>csr
|
||
</span></span></foreignObject></svg></code></pre>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="24" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="24" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1><svg data-marp-fitting="svg"><foreignObject><span data-marp-fitting-svg-content> Sign your CSR with your CA</span></foreignObject></svg></h1>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="25" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="25" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1><svg data-marp-fitting="svg"><foreignObject><span data-marp-fitting-svg-content> Sign your CSR with your CA</span></foreignObject></svg></h1>
|
||
<pre><code class="language-haskell"><svg data-marp-fitting="svg" data-marp-fitting-code><foreignObject><span data-marp-fitting-svg-content><span data-marp-fitting-svg-content-wrap><span class="hljs-title">openssl</span> x509 -req
|
||
-<span class="hljs-keyword">in</span> files/<span class="hljs-number">1.</span>csr
|
||
-<span class="hljs-type">CA</span> files/ca.pem
|
||
-<span class="hljs-type">CAkey</span> files/ca.key
|
||
-<span class="hljs-type">CAcreateserial</span>
|
||
-out files/<span class="hljs-number">1.</span>crt
|
||
</span></span></foreignObject></svg></code></pre>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="26" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="26" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1><svg data-marp-fitting="svg"><foreignObject><span data-marp-fitting-svg-content> What can a Certificate Do?</span></foreignObject></svg></h1>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="27" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="27" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1>What can a Certificate Do?</h1>
|
||
<pre><code class="language-perl"><svg data-marp-fitting="svg" data-marp-fitting-code><foreignObject><span data-marp-fitting-svg-content><span data-marp-fitting-svg-content-wrap>openssl x509
|
||
-in google.pem
|
||
-purpose
|
||
-noout <span class="hljs-comment">#Remove this and retry</span>
|
||
</span></span></foreignObject></svg></code></pre>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="28" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="28" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1><svg data-marp-fitting="svg"><foreignObject><span data-marp-fitting-svg-content> Generate a Client Certificate</span></foreignObject></svg></h1>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="29" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="29" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1>Generate a Client Certificate</h1>
|
||
<h2>Step 1</h2>
|
||
<pre><code class="language-bash"><svg data-marp-fitting="svg" data-marp-fitting-code><foreignObject><span data-marp-fitting-svg-content><span data-marp-fitting-svg-content-wrap><span class="hljs-built_in">printf</span> <span class="hljs-string">"extendedKeyUsage=clientAuth\nkeyUsage=digitalSignature"</span> > client.cnf
|
||
</span></span></foreignObject></svg></code></pre>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="30" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="30" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1>Generate a Client Certificate</h1>
|
||
<h2>Step 2</h2>
|
||
<pre><code class="language-bash"><svg data-marp-fitting="svg" data-marp-fitting-code><foreignObject><span data-marp-fitting-svg-content><span data-marp-fitting-svg-content-wrap><span class="hljs-comment"># As Alice</span>
|
||
openssl req -subj <span class="hljs-string">'/CN=alice.crypto.koans'</span>
|
||
-key files/client.key
|
||
-new
|
||
-out files/client.csr
|
||
<span class="hljs-comment"># As Bob</span>
|
||
openssl x509 -req -<span class="hljs-keyword">in</span> files/alice.csr
|
||
-CA files/ca.pem
|
||
-CAkey files/ca.key
|
||
-CAcreateserial
|
||
-extfile client.cnf
|
||
-out files/alice.crt
|
||
</span></span></foreignObject></svg></code></pre>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="31" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="31" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1>Generate a Client Certificate</h1>
|
||
<h2>Step 3</h2>
|
||
<ol>
|
||
<li>Save <code>alice.crt</code> as <code>client.crt</code></li>
|
||
<li>Save the CA file you received as <code>bob.pem</code></li>
|
||
<li>See <code>testClientBundleGenerated</code></li>
|
||
</ol>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="32" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="32" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1>Theory Break 2</h1>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="33" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="33" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1>What Alice Had</h1>
|
||
<ol>
|
||
<li>Client (<code>client.key</code>, <code>client.csr</code>)</li>
|
||
</ol>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="34" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="34" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1>What Bob Had</h1>
|
||
<ol>
|
||
<li>Client CSR (<code>client.csr</code>)</li>
|
||
<li>CA (<code>ca.pem</code>, <code>ca.key</code>)</li>
|
||
</ol>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="35" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="35" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1>What Bob Had</h1>
|
||
<ol>
|
||
<li>Client CSR (<code>client.csr</code>, <code>alice.crt</code>)</li>
|
||
<li>CA (<code>ca.pem</code>, <code>ca.key</code>)</li>
|
||
</ol>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="36" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="36" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1>What Alice Has</h1>
|
||
<ol>
|
||
<li>Client (<code>client.key</code>, <code>client.csr</code>, <code>client.crt</code>)</li>
|
||
<li>Bob's CA (<code>bob.pem</code>)</li>
|
||
</ol>
|
||
<h1>What Bob Has</h1>
|
||
<ol>
|
||
<li>Server (<code>1.key</code>, <code>1.csr</code>, <code>1.crt</code>)</li>
|
||
<li>CA (<code>ca.pem</code>, <code>ca.key</code>)</li>
|
||
</ol>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="37" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="37" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1>What Alice Has</h1>
|
||
<ol>
|
||
<li>Client (<code>client.key</code>, <code>client.crt</code>)</li>
|
||
<li>Bob's CA (<code>bob.pem</code>)</li>
|
||
</ol>
|
||
<h1>What Bob Has</h1>
|
||
<ol>
|
||
<li>Server (<code>1.key</code>, <code>1.crt</code>)</li>
|
||
<li>Bob's Own CA (<code>ca.pem</code>)</li>
|
||
</ol>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="38" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="38" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1>Where we're going</h1>
|
||
<h1><svg data-marp-fitting="svg"><foreignObject><span data-marp-fitting-svg-content> <img class="emoji" draggable="false" alt="🐳" src="https://twemoji.maxcdn.com/2/svg/1f433.svg" data-marp-twemoji=""/> <img class="emoji" draggable="false" alt="🚀" src="https://twemoji.maxcdn.com/2/svg/1f680.svg" data-marp-twemoji=""/></span></foreignObject></svg></h1>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="39" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="39" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1><img class="emoji" draggable="false" alt="🐳" src="https://twemoji.maxcdn.com/2/svg/1f433.svg" data-marp-twemoji=""/> <img class="emoji" draggable="false" alt="1️⃣" src="https://twemoji.maxcdn.com/2/svg/31-20e3.svg" data-marp-twemoji=""/> / <img class="emoji" draggable="false" alt="2️⃣" src="https://twemoji.maxcdn.com/2/svg/32-20e3.svg" data-marp-twemoji=""/></h1>
|
||
<h2>As Bob</h2>
|
||
<p>Bring up a server using your key (<code>1.key</code>) and certificate (<code>1.crt</code>) and allow any client signed<br />
|
||
by your CA (<code>ca.pem</code>) to talk to you.</p>
|
||
<pre><code class="language-bash"><svg data-marp-fitting="svg" data-marp-fitting-code><foreignObject><span data-marp-fitting-svg-content><span data-marp-fitting-svg-content-wrap>docker run --volume `<span class="hljs-built_in">pwd</span>`/files:/etc/koans
|
||
--publish 8443:443
|
||
captn3m0/crypto.koans
|
||
</span></span></foreignObject></svg></code></pre>
|
||
<pre><code><svg data-marp-fitting="svg" data-marp-fitting-code><foreignObject><span data-marp-fitting-svg-content><span data-marp-fitting-svg-content-wrap><span class="hljs-meta"># ssl_certificate /etc/koans/1.crt;</span>
|
||
<span class="hljs-meta"># ssl_certificate_key /etc/koans/1.key;</span>
|
||
<span class="hljs-meta"># ssl_client_certificate /etc/koans/ca.pem;</span>
|
||
<span class="hljs-meta"># Give your WiFi IP to your partner</span>
|
||
</span></span></foreignObject></svg></code></pre>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="40" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="40" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1><img class="emoji" draggable="false" alt="🐳" src="https://twemoji.maxcdn.com/2/svg/1f433.svg" data-marp-twemoji=""/> <img class="emoji" draggable="false" alt="2️⃣" src="https://twemoji.maxcdn.com/2/svg/32-20e3.svg" data-marp-twemoji=""/> / <img class="emoji" draggable="false" alt="2️⃣" src="https://twemoji.maxcdn.com/2/svg/32-20e3.svg" data-marp-twemoji=""/></h1>
|
||
<h2>As Alice</h2>
|
||
<p>Use the certificate (signed by Bob) and the key<br />
|
||
(which only you have) to talk to Bob's server (which<br />
|
||
you can verify using the CA given)</p>
|
||
<pre><code class="language-bash"><svg data-marp-fitting="svg" data-marp-fitting-code><foreignObject><span data-marp-fitting-svg-content><span data-marp-fitting-svg-content-wrap>curl https://server.crypto.koans.invalid:8443
|
||
--resolve server.crypto.koans.invalid:8443:192.168.1.121
|
||
--cert files/client.crt
|
||
--key files/client.key
|
||
--cacert files/bob.pem
|
||
</span></span></foreignObject></svg></code></pre>
|
||
<pre><code><svg data-marp-fitting="svg" data-marp-fitting-code><foreignObject><span data-marp-fitting-svg-content><span data-marp-fitting-svg-content-wrap># /etc/hosts
|
||
<span class="hljs-number">192.168</span><span class="hljs-number">.1</span><span class="hljs-number">.121</span> server.crypto.koans.invalid
|
||
</span></span></foreignObject></svg></code></pre>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg><svg data-marpit-svg="" viewBox="0 0 1280 720"><foreignObject width="1280" height="720"><section id="41" data-paginate="true" data-footer="Razorpay" data-theme="default" data-marpit-pagination="41" style="--paginate:true;--footer:Razorpay;--theme:default;">
|
||
<h1>Browser <img class="emoji" draggable="false" alt="🌍" src="https://twemoji.maxcdn.com/2/svg/1f30d.svg" data-marp-twemoji=""/></h1>
|
||
<ol>
|
||
<li>Import <code>bundle.pfx</code> in your browser</li>
|
||
<li>Enable CA Usage for websites</li>
|
||
<li>Open <a href="https://server.crypto.koans.invalid:8443">https://server.crypto.koans.invalid:8443</a></li>
|
||
</ol>
|
||
<footer>Razorpay</footer>
|
||
</section>
|
||
</foreignObject></svg></article><script>!function(){"use strict";function e(e){var n=i([["iOS",/iP(hone|od|ad)/],["Android OS",/Android/],["BlackBerry OS",/BlackBerry|BB10/],["Windows Mobile",/IEMobile/],["Amazon OS",/Kindle/],["Windows 3.11",/Win16/],["Windows 95",/(Windows 95)|(Win95)|(Windows_95)/],["Windows 98",/(Windows 98)|(Win98)/],["Windows 2000",/(Windows NT 5.0)|(Windows 2000)/],["Windows XP",/(Windows NT 5.1)|(Windows XP)/],["Windows Server 2003",/(Windows NT 5.2)/],["Windows Vista",/(Windows NT 6.0)/],["Windows 7",/(Windows NT 6.1)/],["Windows 8",/(Windows NT 6.2)/],["Windows 8.1",/(Windows NT 6.3)/],["Windows 10",/(Windows NT 10.0)/],["Windows ME",/Windows ME/],["Open BSD",/OpenBSD/],["Sun OS",/SunOS/],["Linux",/(Linux)|(X11)/],["Mac OS",/(Mac_PowerPC)|(Macintosh)/],["QNX",/QNX/],["BeOS",/BeOS/],["OS/2",/OS\/2/],["Search Bot",/(nuhk)|(Googlebot)|(Yammybot)|(Openbot)|(Slurp)|(MSNBot)|(Ask Jeeves\/Teoma)|(ia_archiver)/]]).filter(function(n){return n.rule&&n.rule.test(e)})[0];return n?n.name:null}function n(){return"undefined"!=typeof process&&process.version&&{name:"node",version:process.version.slice(1),os:process.platform}}function t(n){var t=i([["aol",/AOLShield\/([0-9\._]+)/],["edge",/Edge\/([0-9\._]+)/],["yandexbrowser",/YaBrowser\/([0-9\._]+)/],["vivaldi",/Vivaldi\/([0-9\.]+)/],["kakaotalk",/KAKAOTALK\s([0-9\.]+)/],["samsung",/SamsungBrowser\/([0-9\.]+)/],["chrome",/(?!Chrom.*OPR)Chrom(?:e|ium)\/([0-9\.]+)(:?\s|$)/],["phantomjs",/PhantomJS\/([0-9\.]+)(:?\s|$)/],["crios",/CriOS\/([0-9\.]+)(:?\s|$)/],["firefox",/Firefox\/([0-9\.]+)(?:\s|$)/],["fxios",/FxiOS\/([0-9\.]+)/],["opera",/Opera\/([0-9\.]+)(?:\s|$)/],["opera",/OPR\/([0-9\.]+)(:?\s|$)$/],["ie",/Trident\/7\.0.*rv\:([0-9\.]+).*\).*Gecko$/],["ie",/MSIE\s([0-9\.]+);.*Trident\/[4-7].0/],["ie",/MSIE\s(7\.0)/],["bb10",/BB10;\sTouch.*Version\/([0-9\.]+)/],["android",/Android\s([0-9\.]+)/],["ios",/Version\/([0-9\._]+).*Mobile.*Safari.*/],["safari",/Version\/([0-9\._]+).*Safari/],["facebook",/FBAV\/([0-9\.]+)/],["instagram",/Instagram\s([0-9\.]+)/],["ios-webview",/AppleWebKit\/([0-9\.]+).*Mobile/]]);if(!n)return null;var o=t.map(function(e){var t=e.rule.exec(n),i=t&&t[1].split(/[._]/).slice(0,3);return i&&i.length<3&&(i=i.concat(1==i.length?[0,0]:[0])),t&&{name:e.name,version:i.join(".")}}).filter(Boolean)[0]||null;return o&&(o.os=e(n)),/alexa|bot|crawl(er|ing)|facebookexternalhit|feedburner|google web preview|nagios|postrank|pingdom|slurp|spider|yahoo!|yandex/i.test(n)&&((o=o||{}).bot=!0),o}function i(e){return e.map(function(e){return{name:e[0],rule:e[1]}})}var o=function(){return"undefined"!=typeof navigator?t(navigator.userAgent):n()},r=o;let s;const a=["android","bb10","crios","facebook","fxios","instagram","ios-webview","ios","phantomjs","safari"];function l(){Array.from(document.getElementsByTagName("svg"),e=>{if(e.hasAttribute("data-marpit-svg")){const{clientHeight:n,clientWidth:t}=e;e.style.transform||(e.style.transform="translateZ(0)");const{width:i,height:o}=e.viewBox.baseVal,r=Math.min(n/o,t/i);Array.from(e.querySelectorAll(":scope > foreignObject"),e=>{const s=e.x.baseVal.value,a=e.y.baseVal.value;Array.from(e.querySelectorAll(":scope > section"),e=>{e.style.transformOrigin||(e.style.transformOrigin="0 0");const l=(t-r*i)/2-s,d=(n-r*o)/2-a;e.style.transform=`translate3d(${l}px,${d}px,0) scale(${r}) translate(${s}px,${a}px)`})})}})}const d="data-marp-fitting",c="data-marp-fitting-code",u="data-marp-fitting-math",f=(e,n,t)=>{if(e.getAttribute(n)!==t)return e.setAttribute(n,t),!0};!function(e=!0){const n=()=>{for(const e of function(){if(!s){s=[];const{name:e}=r()||{};a.includes(e)&&s.push(l)}return s}())e();Array.from(document.querySelectorAll(`svg[${d}="svg"]`),e=>{const n=e.firstChild,t=n.firstChild,{scrollWidth:i,scrollHeight:o}=t;let r,s=1;if(e.hasAttribute(c)&&(r=e.parentElement.parentElement),e.hasAttribute(u)&&(r=e.parentElement),r){const e=getComputedStyle(r),n=Math.ceil(r.clientWidth-parseFloat(e.paddingLeft)-parseFloat(e.paddingRight));n&&(s=n)}const a=Math.max(i,s),l=Math.max(o,1),d=`0 0 ${a} ${l}`;f(n,"width",`${a}`),f(n,"height",`${l}`),f(e,"preserveAspectRatio",getComputedStyle(e).getPropertyValue("--preserve-aspect-ratio")||"xMinYMin meet"),f(e,"viewBox",d)&&e.classList.toggle("__reflow__")}),e&&window.requestAnimationFrame(n)};n()}()}();
|
||
</script><script>!function(){"use strict";var e={from:function(e,n){var t=1===(e.parent||e).nodeType?e.parent||e:document.querySelector(e.parent||e),r=[].filter.call("string"==typeof e.slides?t.querySelectorAll(e.slides):e.slides||t.children,function(e){return"SCRIPT"!==e.nodeName}),i=r[0],l={},o=function(e,n){r[e]&&(a("deactivate",u(i,n)),i=r[e],a("activate",u(i,n)))},s=function(e,n){var t=r.indexOf(i)+e;a(e>0?"next":"prev",u(i,n))&&o(t,n)},c=function(e,n){l[e]=(l[e]||[]).filter(function(e){return e!==n})},a=function(e,n){return(l[e]||[]).reduce(function(e,t){return e&&!1!==t(n)},!0)},u=function(e,n){return(n=n||{}).index=r.indexOf(e),n.slide=e,n},d={on:function(e,n){return(l[e]||(l[e]=[])).push(n),c.bind(null,e,n)},off:c,fire:a,slide:function(e,n){if(!arguments.length)return r.indexOf(i);a("slide",u(r[e],n))&&o(e,n)},next:s.bind(null,1),prev:s.bind(null,-1),parent:t,slides:r};return(n||[]).forEach(function(e){e(d)}),o(0),d}},n=function(){return function(e){e.slides.forEach(function(e){e.addEventListener("keydown",function(e){(/INPUT|TEXTAREA|SELECT/.test(e.target.nodeName)||"true"===e.target.contentEditable)&&e.stopPropagation()})})}};function t(e){e.parent.classList.add("bespoke-marp-parent"),e.slides.map(e=>e.classList.add("bespoke-marp-slide")),e.on("activate",n=>{e.slides.map(e=>e.classList.remove("bespoke-marp-active")),n.slide.classList.add("bespoke-marp-active")})}function r(e=2e3){return n=>{let t;function r(){t&&clearTimeout(t),t=setTimeout(()=>{n.parent.classList.add("bespoke-marp-inactive")},e),n.parent.classList.remove("bespoke-marp-inactive")}document.addEventListener("mousedown",r),document.addEventListener("mousemove",r),document.addEventListener("touchend",r),setTimeout(r,0)}}var i,l=(function(e){var n,t,r,i,l,o;n="undefined"!=typeof window&&void 0!==window.document?window.document:{},t=e.exports,r="undefined"!=typeof Element&&"ALLOW_KEYBOARD_INPUT"in Element,i=function(){for(var e,t=[["requestFullscreen","exitFullscreen","fullscreenElement","fullscreenEnabled","fullscreenchange","fullscreenerror"],["webkitRequestFullscreen","webkitExitFullscreen","webkitFullscreenElement","webkitFullscreenEnabled","webkitfullscreenchange","webkitfullscreenerror"],["webkitRequestFullScreen","webkitCancelFullScreen","webkitCurrentFullScreenElement","webkitCancelFullScreen","webkitfullscreenchange","webkitfullscreenerror"],["mozRequestFullScreen","mozCancelFullScreen","mozFullScreenElement","mozFullScreenEnabled","mozfullscreenchange","mozfullscreenerror"],["msRequestFullscreen","msExitFullscreen","msFullscreenElement","msFullscreenEnabled","MSFullscreenChange","MSFullscreenError"]],r=0,i=t.length,l={};r<i;r++)if((e=t[r])&&e[1]in n){for(r=0;r<e.length;r++)l[t[0][r]]=e[r];return l}return!1}(),l={change:i.fullscreenchange,error:i.fullscreenerror},o={request:function(e){return new Promise(function(t){var l=i.requestFullscreen,o=function(){this.off("change",o),t()}.bind(this);e=e||n.documentElement,/ Version\/5\.1(?:\.\d+)? Safari\//.test(navigator.userAgent)?e[l]():e[l](r?Element.ALLOW_KEYBOARD_INPUT:{}),this.on("change",o)}.bind(this))},exit:function(){return new Promise(function(e){var t=function(){this.off("change",t),e()}.bind(this);n[i.exitFullscreen](),this.on("change",t)}.bind(this))},toggle:function(e){return this.isFullscreen?this.exit():this.request(e)},onchange:function(e){this.on("change",e)},onerror:function(e){this.on("error",e)},on:function(e,t){var r=l[e];r&&n.addEventListener(r,t,!1)},off:function(e,t){var r=l[e];r&&n.removeEventListener(r,t,!1)},raw:i},i?(Object.defineProperties(o,{isFullscreen:{get:function(){return Boolean(n[i.fullscreenElement])}},element:{enumerable:!0,get:function(){return n[i.fullscreenElement]}},enabled:{enumerable:!0,get:function(){return Boolean(n[i.fullscreenEnabled])}}}),t?e.exports=o:window.screenfull=o):t?e.exports=!1:window.screenfull=!1}(i={exports:{}},i.exports),i.exports);function o(e){e.fullscreen=(()=>l.toggle(document.body)),document.addEventListener("keydown",n=>{70!==n.which&&122!==n.which||n.altKey||n.ctrlKey||n.metaKey||!l.enabled||(e.fullscreen(),n.preventDefault())})}function s(e={}){const n=Object.assign({history:!0},e);return e=>{function t(){const n=parseInt(window.location.hash.slice(1),10);Number.isNaN(n)||function(n){const t=Math.max(0,Math.min(n,e.slides.length-1));t!==e.slide()&&e.slide(t)}(n-1)}setTimeout(()=>{t(),e.on("activate",e=>{n.history?window.location.hash=e.index+1:window.location.replace(`#${e.index+1}`)}),window.addEventListener("hashchange",t)},0)}}var c,a=function(e){return function(n){var t="vertical"!==e;document.addEventListener("keydown",function(e){(34==e.which||32==e.which&&!e.shiftKey||t&&39==e.which||!t&&40==e.which)&&n.next(),(33==e.which||32==e.which&&e.shiftKey||t&&37==e.which||!t&&38==e.which)&&n.prev()})}};function u(e={}){const n=Object.assign({interval:200},e);return e=>{a()(e),document.addEventListener("keydown",n=>{35===n.which&&e.slide(e.slides.length-1),36===n.which&&e.slide(0),38===n.which&&e.prev(),40===n.which&&e.next()});let t,r,i=0;e.parent.addEventListener("wheel",l=>{let o=!1;const s=(e,n)=>{e&&(o=o||function(e,n){return function(e,n){const t=n===c.X?"Width":"Height";return e[`client${t}`]<e[`scroll${t}`]}(e,n)&&function(e,n){const{overflow:t}=e,r=e[`overflow${n}`];return"auto"===t||"scroll"===t||"auto"===r||"scroll"===r}(getComputedStyle(e),n)}(e,n)),e&&e.parentElement&&s(e.parentElement,n)};if(0!==l.deltaX&&s(l.target,c.X),0!==l.deltaY&&s(l.target,c.Y),o)return;l.preventDefault(),r&&clearTimeout(r),r=setTimeout(()=>{t=0},n.interval);const a=Date.now()-i<n.interval,u=Math.sqrt(Math.pow(l.deltaX,2)+Math.pow(l.deltaY,2)),d=u<=t;if(t=u,a||d)return;let f;(l.deltaX>0||l.deltaY>0)&&(f="next"),(l.deltaX<0||l.deltaY<0)&&(f="prev"),f&&(e[f](),i=Date.now())})}}function d(e=".bespoke-marp-osc"){const n=document.querySelector(e);if(!n)return()=>{};const t=(e,t)=>{n.querySelectorAll(`[data-bespoke-marp-osc=${JSON.stringify(e)}]`).forEach(t)};return l.enabled||t("fullscreen",e=>e.style.display="none"),e=>{n.addEventListener("click",n=>{if(n.target instanceof HTMLElement)switch(n.target.dataset.bespokeMarpOsc){case"next":e.next();break;case"prev":e.prev();break;case"fullscreen":"function"==typeof e.fullscreen&&l.enabled&&e.fullscreen()}}),e.parent.appendChild(n),e.on("activate",({index:n})=>{t("page",t=>t.textContent=`Page ${n+1} of ${e.slides.length}`),t("prev",e=>e.disabled=0===n),t("next",t=>t.disabled=n===e.slides.length-1)}),l.onchange(()=>t("fullscreen",e=>e.classList.toggle("exit",l.isFullscreen)))}}!function(e){e.X="X",e.Y="Y"}(c||(c={}));const f=".bespoke-progress-bar";function h(e){e.on("activate",n=>{document.querySelectorAll(f).forEach(t=>{t.style.flexBasis=`${100*n.index/(e.slides.length-1)}%`})})}function p(e={}){const n=Object.assign({slope:Math.tan(-35*Math.PI/180),swipeThreshold:30},e);return e=>{let t;const r=e.parent,i=e=>{const n=r.getBoundingClientRect();return{x:e.pageX-(n.left+n.right)/2,y:e.pageY-(n.top+n.bottom)/2}};r.addEventListener("touchstart",e=>{t=1===e.touches.length?i(e.touches[0]):void 0}),r.addEventListener("touchmove",e=>{if(t)if(1===e.touches.length){e.preventDefault();const n=i(e.touches[0]),r=n.x-t.x,l=n.y-t.y;t.delta=Math.sqrt(Math.pow(Math.abs(r),2)+Math.pow(Math.abs(l),2)),t.radian=Math.atan2(r,l)}else t=void 0}),r.addEventListener("touchend",r=>{if(t){if(t.delta&&t.delta>=n.swipeThreshold){let i=t.radian-n.slope;i=(i+Math.PI)%(2*Math.PI)-Math.PI,e[i<0?"next":"prev"](),r.stopPropagation()}t=void 0}})}}e.from(document.getElementById("presentation"),[n(),t,r(),s({history:!1}),u(),o,h,p(),d()])}();
|
||
</script></body></html> |