:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif}body{margin:0}main.svelte-1ue3qne.svelte-1ue3qne{flex-direction:column;margin:0 auto}section.svelte-1ue3qne.svelte-1ue3qne{box-sizing:border-box;display:flex;justify-content:center;padding:4rem;width:100%}.url-container.svelte-1ue3qne.svelte-1ue3qne{background-color:#c7f9cc}h1.svelte-1ue3qne.svelte-1ue3qne{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Open Sans,Helvetica Neue,sans-serif;border:none;color:#333;font-size:3rem;font-weight:100;padding:4rem;line-height:1;margin:0;text-align:center;width:100%;box-sizing:border-box}.url-grid.svelte-1ue3qne.svelte-1ue3qne{display:grid;grid-gap:1rem;grid-template-areas:"protocol-value double-slash hostname-value colon  port-value pathname-value search-value hash-value" "protocol       .            hostname       .      port       pathname       search       hash      " "protocol       .            host           host   host       pathname       search       hash      " "origin         origin       origin         origin origin     pathname       search       hash      " "href           href         href           href   href       href           href         href      "}.protocol-value.svelte-1ue3qne.svelte-1ue3qne{grid-area:protocol-value}.double-slash.svelte-1ue3qne.svelte-1ue3qne{grid-area:double-slash}.hostname-value.svelte-1ue3qne.svelte-1ue3qne{grid-area:hostname-value}.colon.svelte-1ue3qne.svelte-1ue3qne{grid-area:colon}.port-value.svelte-1ue3qne.svelte-1ue3qne{grid-area:port-value}.pathname-value.svelte-1ue3qne.svelte-1ue3qne{grid-area:pathname-value}.search-value.svelte-1ue3qne.svelte-1ue3qne{grid-area:search-value}.hash-value.svelte-1ue3qne.svelte-1ue3qne{grid-area:hash-value}.protocol.svelte-1ue3qne.svelte-1ue3qne{grid-area:protocol}.hostname.svelte-1ue3qne.svelte-1ue3qne{grid-area:hostname}.host.svelte-1ue3qne.svelte-1ue3qne{grid-area:host}.port.svelte-1ue3qne.svelte-1ue3qne{grid-area:port}.pathname.svelte-1ue3qne.svelte-1ue3qne{grid-area:pathname}.search.svelte-1ue3qne.svelte-1ue3qne{grid-area:search}.hash.svelte-1ue3qne.svelte-1ue3qne{grid-area:hash}.origin.svelte-1ue3qne.svelte-1ue3qne{grid-area:origin}.href.svelte-1ue3qne.svelte-1ue3qne{grid-area:href}.url-grid.svelte-1ue3qne>div.svelte-1ue3qne{color:#333;font-size:2rem;text-align:center}.url-grid.svelte-1ue3qne>.url-label.svelte-1ue3qne{align-items:center;align-self:flex-start;background-color:#80ed99;border:4px solid #38a3a5;border-radius:0 0 10px 10px;border-top:0;display:flex;justify-content:center;font-size:2rem;padding:1rem}.url-grid.svelte-1ue3qne>.url-part.svelte-1ue3qne{background-color:#fff;border:4px solid #38a3a5;border-radius:10px 10px 0 0;border-bottom:0;display:flex;justify-content:center;font-size:2rem;padding:1rem}h1.svelte-1ue3qne.svelte-1ue3qne:focus{outline:none}.invalid-url.svelte-1ue3qne.svelte-1ue3qne{font-size:2rem}@media (min-width: 480px){h1.svelte-1ue3qne.svelte-1ue3qne{max-width:none}}.url-parts-container.svelte-1ue3qne.svelte-1ue3qne{background-color:#ffeae4}.url-parts-inner.svelte-1ue3qne.svelte-1ue3qne{margin:auto;max-width:770px;grid-template-columns:1fr 1fr;grid-gap:1rem}.url-parts-inner.svelte-1ue3qne>div.svelte-1ue3qne{border-radius:.5rem;margin-bottom:1rem}.url-prop.svelte-1ue3qne.svelte-1ue3qne{background-color:#fff;line-height:1;display:flex}.url-prop-name.svelte-1ue3qne.svelte-1ue3qne{background-color:#d8bfd8;border-radius:.5rem 0 0 .5rem;display:inline-block;flex-basis:100px;padding:1rem}.url-prop-value.svelte-1ue3qne.svelte-1ue3qne{font-size:1rem;font-family:monospace;padding:1rem}