diff --git a/README.md b/README.md
index bff6cefd..9829ff22 100644
--- a/README.md
+++ b/README.md
@@ -1,6 +1,6 @@
 <p align="center">
   <a href="https://dash-bootstrap-components.opensource.faculty.ai/">
-    <img src="https://cdn.opensource.faculty.ai/dbc/assets/logo.svg" alt="dash-bootstrap-components logo" width="200" height="200">
+    <img src="./readme-images/logo.svg" alt="dash-bootstrap-components logo" width="200" height="200">
   </a>
 </p>
 
@@ -136,7 +136,7 @@ will pass our linting checks, and how to submit the pull request itself.
 ## Copyright and license
 
 Code and documentation is copyright [Faculty Science Ltd.][faculty]
-2018-2022, and released under the [Apache 2.0 license](./LICENSE)
+2018-2024, and released under the [Apache 2.0 license](./LICENSE)
 
 [dash-homepage]: https://dash.plotly.com/
 [dash-docs-external]: https://dash.plotly.com/external-resources
diff --git a/readme-images/logo.svg b/readme-images/logo.svg
new file mode 100644
index 00000000..421bf18d
--- /dev/null
+++ b/readme-images/logo.svg
@@ -0,0 +1,1013 @@
+<svg id="dbclogo"
+    viewBox="0 0 90 90"
+    preserveAspectRatio="xMidYMid meet"
+    version="1.1"
+    baseProfile="full"
+    xmlns="http://www.w3.org/2000/svg"
+    xmlns:xlink="http://www.w3.org/1999/xlink"
+    style="background-color:white;padding:5;">
+
+  <!--
+
+  Randomly generated and animating logo for Dash Bootstrap Components.
+  By Bureau Bureau (bureaubureau.uk) 💛
+  8 August 2019
+
+  Rules for random component selection:
+  1. Always have "y" logo present
+  2. Have no more than one text block
+  3. Avoid pie and doughnut graphs in the same layout
+  4. Avoid both wide/tall and square versions of the same type of graph in the same layout
+
+  Rules for random layout selection:
+  "Quad" layout has 40% probability.
+  "Wide" layout has 40% probability, equally distributed for wide top or wide bottom.
+  "Tall" layout has 20% probability, equally distributed for tall left or tall right.
+
+  -->
+
+  <defs>
+
+    <style>
+      <![CDATA[
+
+      use {
+        opacity: 0;
+        animation-fill-mode: forwards;
+        animation-duration: 0.4s;
+        animation-timing-function: ease-out;
+      }
+
+      #tl {
+        animation-name: fadeInLeft;
+      }
+
+      #tr {
+        animation-name: fadeInDown;
+        animation-delay: 0.1s;
+      }
+
+      #bl {
+        animation-name: fadeInUp;
+        animation-delay: 0.3s;
+      }
+
+      #br {
+        animation-name: fadeInRight;
+        animation-delay: 0.2s;
+      }
+
+      #usegrid {
+        opacity: 1;
+      }
+
+      #grid line {
+        stroke: #fa7268; /* Living coral. */
+      }
+
+      #refreshbutton {
+        opacity: 0;
+      }
+
+      /* Colour scheme for dark mode. Only use if host page has a dark mode @media query. */
+
+      /* @media (prefers-color-scheme: dark) {
+
+          svg {
+            fill: white;
+          }
+
+        } */
+
+      /* Disable animation for printing. */
+
+      @media only print {
+
+        use {
+          animation: none;
+          opacity: 1 !important;
+          -webkit-transform: translate3d(0, 0, 0);
+          transform: translate3d(0, 0, 0);
+        }
+
+      }
+
+      /* Animation definitions from animate.css */
+
+      @keyframes fadeInDown {
+        from {
+          opacity: 0;
+          -webkit-transform: translate3d(0, -20%, 0);
+          transform: translate3d(0, -20%, 0);
+        }
+
+        to {
+          opacity: 1;
+          -webkit-transform: translate3d(0, 0, 0);
+          transform: translate3d(0, 0, 0);
+        }
+      }
+
+      @keyframes fadeInLeft {
+        from {
+          opacity: 0;
+          -webkit-transform: translate3d(-20%, 0, 0);
+          transform: translate3d(-20%, 0, 0);
+        }
+
+        to {
+          opacity: 1;
+          -webkit-transform: translate3d(0, 0, 0);
+          transform: translate3d(0, 0, 0);
+        }
+      }
+
+      @keyframes fadeInRight {
+        from {
+          opacity: 0;
+          -webkit-transform: translate3d(20%, 0, 0);
+          transform: translate3d(20%, 0, 0);
+        }
+
+        to {
+          opacity: 1;
+          -webkit-transform: translate3d(0, 0, 0);
+          transform: translate3d(0, 0, 0);
+        }
+      }
+
+      @keyframes fadeInUp {
+        from {
+          opacity: 0;
+          -webkit-transform: translate3d(0, 20%, 0);
+          transform: translate3d(0, 20%, 0);
+        }
+
+        to {
+          opacity: 1;
+          -webkit-transform: translate3d(0, 0, 0);
+          transform: translate3d(0, 0, 0);
+        }
+      }
+
+      @keyframes fadeOutDown {
+        from {
+          opacity: 1;
+        }
+
+        to {
+          opacity: 0;
+          -webkit-transform: translate3d(0, 20%, 0);
+          transform: translate3d(0, 20%, 0);
+        }
+      }
+
+      @keyframes fadeOutLeft {
+        from {
+          opacity: 1;
+        }
+
+        to {
+          opacity: 0;
+          -webkit-transform: translate3d(-20%, 0, 0);
+          transform: translate3d(-20%, 0, 0);
+        }
+      }
+
+      @keyframes fadeOutRight {
+        from {
+          opacity: 1;
+        }
+
+        to {
+          opacity: 0;
+          -webkit-transform: translate3d(20%, 0, 0);
+          transform: translate3d(20%, 0, 0);
+        }
+      }
+
+      @keyframes fadeOutUp {
+        from {
+          opacity: 1;
+        }
+
+        to {
+          opacity: 0;
+          -webkit-transform: translate3d(0, -20%, 0);
+          transform: translate3d(0, -20%, 0);
+        }
+      }
+
+      ]]>
+    </style>
+
+    <symbol id="blank">
+    </symbol>
+    <symbol id="widegantt" data-name="widegantt" viewBox="0 0 64 30">
+      <g opacity="0.1">
+        <rect width="1" height="30"/>
+        <rect x="63" width="1" height="30"/>
+        <rect x="9" width="1" height="30"/>
+        <rect x="18" width="1" height="30"/>
+        <rect x="27" width="1" height="30"/>
+        <rect x="36" width="1" height="30"/>
+        <rect x="54" width="1" height="30"/>
+        <rect x="45" width="1" height="30"/>
+      </g>
+      <g opacity="0.8">
+        <rect y="2" width="10" height="2"/>
+        <rect x="9" y="6" width="10" height="2"/>
+        <rect x="9" y="10" width="23" height="2"/>
+        <rect x="18" y="14" width="14" height="2"/>
+        <rect x="32" y="18" width="14" height="2"/>
+        <rect x="36" y="22" width="19" height="2"/>
+        <rect x="54" y="26" width="10" height="2"/>
+      </g>
+    </symbol>
+    <symbol id="grid" data-name="grid" viewBox="0 0 80 80">
+      <g opacity="0.6">
+        <line x1="80" y1="7.75" y2="7.75" fill="none" stroke-width="0.5"/>
+        <line x1="80" y1="4.25" y2="4.25" fill="none" stroke-width="0.5"/>
+        <line x1="80" y1="72.25" y2="72.25" fill="none" stroke-width="0.5"/>
+        <line x1="80" y1="75.75" y2="75.75" fill="none" stroke-width="0.5"/>
+        <line x1="80" y1="41.75" y2="41.75" fill="none" stroke-width="0.5"/>
+        <line x1="80" y1="38.25" y2="38.25" fill="none" stroke-width="0.5"/>
+      </g>
+      <g opacity="0.6">
+        <line x1="7.75" x2="7.75" y2="80" fill="none" stroke-width="0.5"/>
+        <line x1="4.25" x2="4.25" y2="80" fill="none" stroke-width="0.5"/>
+        <line x1="72.25" x2="72.25" y2="80" fill="none" stroke-width="0.5"/>
+        <line x1="75.75" x2="75.75" y2="80" fill="none" stroke-width="0.5"/>
+        <line x1="38.25" y1="80" x2="38.25" fill="none" stroke-width="0.5"/>
+        <line x1="41.75" y1="80" x2="41.75" fill="none" stroke-width="0.5"/>
+      </g>
+    </symbol>
+    <symbol id="text1" data-name="text1" viewBox="0 0 30 30">
+      <rect width="30" height="30" fill="none"/>
+      <g opacity="0.8">
+        <rect y="6" width="30" height="2"/>
+        <rect width="26.996" height="4"/>
+        <rect y="10" width="30" height="2"/>
+        <rect y="14" width="30" height="2"/>
+        <rect y="18" width="30" height="2"/>
+        <rect y="22" width="15" height="2"/>
+      </g>
+    </symbol>
+    <symbol id="text2" data-name="text2" viewBox="0 0 30 30">
+      <rect width="30" height="30" fill="none"/>
+      <g opacity="0.8">
+        <rect y="8" width="30" height="2"/>
+        <rect y="4" width="30" height="2"/>
+        <rect width="30" height="2"/>
+        <rect y="12" width="30" height="2"/>
+        <rect y="16" width="22" height="2"/>
+      </g>
+    </symbol>
+    <symbol id="text3" data-name="text3" viewBox="0 0 30 30">
+      <rect width="30" height="30" fill="none"/>
+      <g opacity="0.8">
+        <rect y="8" width="30" height="2"/>
+        <rect y="4" width="30" height="2"/>
+        <rect width="30" height="2"/>
+        <rect y="12" width="21" height="2"/>
+      </g>
+    </symbol>
+    <symbol id="text4" data-name="text4" viewBox="0 0 30 30">
+      <rect width="30" height="30" fill="none"/>
+      <g opacity="0.8">
+        <rect x="4" y="16" width="18" height="2"/>
+        <rect x="4" y="4" width="20" height="2"/>
+        <rect width="2" height="2"/>
+        <rect y="4" width="2" height="2"/>
+        <rect y="8" width="2" height="2"/>
+        <rect y="12" width="2" height="2"/>
+        <rect y="16" width="2" height="2"/>
+        <rect x="4" width="22" height="2"/>
+        <rect x="4" y="12" width="22" height="2"/>
+        <rect x="4" y="8" width="24" height="2"/>
+      </g>
+    </symbol>
+    <symbol id="talltext1" data-name="talltext1" viewBox="0 0 30 64">
+      <rect width="30" height="64" fill="none"/>
+      <g opacity="0.8">
+        <rect y="6" width="30" height="2"/>
+        <rect width="25" height="4"/>
+        <rect y="10" width="30" height="2"/>
+        <rect y="14" width="30" height="2"/>
+        <rect y="18" width="30" height="2"/>
+        <rect y="22" width="30" height="2"/>
+        <rect y="26" width="30" height="2"/>
+        <rect y="30" width="30" height="2"/>
+        <rect y="34" width="30" height="2"/>
+        <rect y="38" width="18" height="2"/>
+      </g>
+    </symbol>
+    <symbol id="talltext2" data-name="talltext2" viewBox="0 0 30 64">
+      <rect width="30" height="64" fill="none"/>
+      <g opacity="0.8">
+        <rect width="30" height="2"/>
+        <rect y="4" width="30" height="2"/>
+        <rect y="8" width="30" height="2"/>
+        <rect y="12" width="30" height="2"/>
+        <rect y="16" width="18" height="2"/>
+        <rect y="24" width="30" height="2"/>
+        <rect y="28" width="30" height="2"/>
+        <rect y="32" width="30" height="2"/>
+        <rect y="36" width="30" height="2"/>
+        <rect y="40" width="26" height="2"/>
+      </g>
+    </symbol>
+    <symbol id="widetext1" data-name="widetext1" viewBox="0 0 64 30">
+      <rect width="64" height="30" fill="none"/>
+      <g opacity="0.8">
+        <rect y="6" width="64" height="2"/>
+        <rect width="38" height="4"/>
+        <rect y="10" width="64" height="2"/>
+        <rect y="14" width="64" height="2"/>
+        <rect y="18" width="42.252" height="2"/>
+      </g>
+    </symbol>
+    <symbol id="widetext2" data-name="widetext2" viewBox="0 0 64 30">
+      <rect width="64" height="30" fill="none"/>
+      <g opacity="0.8">
+        <rect width="64" height="2"/>
+        <rect y="4" width="64" height="2"/>
+        <rect y="8" width="64" height="2"/>
+        <rect y="12" width="16.022" height="2"/>
+      </g>
+    </symbol>
+    <symbol id="widetext3" data-name="widetext3" viewBox="0 0 64 30">
+      <rect width="64" height="30" fill="none"/>
+      <g opacity="0.8">
+        <rect y="6" width="30" height="2"/>
+        <rect width="57" height="4"/>
+        <rect y="10" width="30" height="2"/>
+        <rect y="14" width="30" height="2"/>
+        <rect y="18" width="30" height="2"/>
+        <rect y="22" width="22" height="2"/>
+        <rect x="34" y="6" width="30" height="2"/>
+        <rect x="34" y="10" width="30" height="2"/>
+        <rect x="34" y="14" width="30" height="2"/>
+        <rect x="34" y="18" width="16.022" height="2"/>
+      </g>
+    </symbol>
+    <symbol id="widetext4" data-name="widetext4" viewBox="0 0 64 30">
+      <rect width="64" height="30" fill="none"/>
+      <g opacity="0.8">
+        <rect width="30" height="2"/>
+        <rect y="4" width="30" height="2"/>
+        <rect x="34" width="30" height="2"/>
+        <rect x="34" y="4" width="30" height="2"/>
+        <rect y="8" width="30" height="2"/>
+        <rect y="12" width="30" height="2"/>
+        <rect y="16" width="20" height="2"/>
+        <rect x="34" y="8" width="30" height="2"/>
+        <rect x="34" y="12" width="30" height="2"/>
+        <rect x="34" y="16" width="10" height="2"/>
+      </g>
+    </symbol>
+    <symbol id="bar" data-name="bar" viewBox="0 0 30 30">
+      <rect width="30" height="30" fill="none"/>
+      <g opacity="0.8">
+        <rect y="21" width="5" height="9"/>
+        <rect x="25" y="11" width="5" height="19"/>
+        <rect x="16.667" y="6" width="5" height="24"/>
+        <rect x="8.333" y="15" width="5" height="15"/>
+      </g>
+    </symbol>
+    <symbol id="errorbars" data-name="errorbars" viewBox="0 0 30 30">
+      <g opacity="0.4">
+        <polygon points="2 25 2 18 3 18 3 25 2 25"/>
+        <polygon points="7 30 7 21 8 21 8 30 7 30"/>
+        <polygon points="12 22 12 13 13 13 13 22 12 22"/>
+        <polygon points="27 15 27 2 28 2 28 15 27 15"/>
+        <polygon points="17 14 17 3 18 3 18 14 17 14"/>
+        <polygon points="22 11 22 0 23 0 23 11 22 11"/>
+      </g>
+      <rect width="30" height="30" fill="none"/>
+      <g>
+        <rect y="21" width="5" height="1"/>
+        <rect x="5" y="24" width="5" height="1"/>
+        <rect x="10" y="16" width="5" height="1"/>
+        <rect x="25" y="7" width="5" height="1"/>
+        <rect x="15" y="7" width="5" height="1"/>
+        <rect x="20" y="3" width="5" height="1"/>
+      </g>
+    </symbol>
+    <symbol id="line1" data-name="line1" viewBox="0 0 30 30">
+      <rect width="30" height="30" fill="none"/>
+      <g opacity="0.8">
+        <path d="M22,30c-2.809,0-3.619-3.784-4.478-7.791C16.961,19.589,16.191,16,15,16s-1.783,1.511-2.551,3.816C11.639,22.246,10.721,25,8,25c-2.566,0-3.56-1.655-4.357-2.985S2.37,20,1,20a1,1,0,0,1,0-2c2.566,0,3.56,1.655,4.357,2.985S6.63,23,8,23c1.19,0,1.783-1.511,2.551-3.816C11.361,16.754,12.279,14,15,14c2.809,0,3.619,3.784,4.478,7.791C20.039,24.411,20.809,28,22,28c1.167-.609,2-8.432,2.506-13.106C25.524,5.382,26.236,0,29,0a1,1,0,0,1,0,2c-1.167.609-2,8.432-2.506,13.106C25.476,24.618,24.764,30,22,30Z"/>
+      </g>
+    </symbol>
+    <symbol id="line2" data-name="line2" viewBox="0 0 30 30">
+      <rect width="30" height="30" fill="none"/>
+      <g opacity="0.6">
+        <path d="M7,30c-2.721,0-3.431-2.129-3.948-3.684C2.491,24.635,2.169,24,1,24a1,1,0,0,1,0-2c2.721,0,3.431,2.129,3.948,3.684C5.509,27.365,5.831,28,7,28c1.639,0,2.432-5.288,3.011-9.148C10.849,13.271,11.639,8,15,8c2.744,0,3.654,3.035,4.458,5.713C20.211,16.223,20.834,18,22,18c1.181,0,1.986-4.03,2.52-6.7C25.373,7.034,26.181,3,29,3a1,1,0,0,1,0,2c-1.181,0-1.986,4.03-2.52,6.7C25.627,15.966,24.819,20,22,20c-2.744,0-3.654-3.035-4.458-5.713C16.789,11.777,16.166,10,15,10c-1.639,0-2.432,5.288-3.011,9.148C11.151,24.729,10.361,30,7,30Z"/>
+      </g>
+      <g opacity="0.4">
+        <path d="M1,30a1,1,0,0,1,0-2c1.219,0,1.946-2.907,2.53-5.243C4.36,19.435,5.219,16,8,16c2.618,0,3.6,1.97,4.395,3.553C13.176,21.116,13.683,22,15,22c1.2,0,1.968-3.309,2.525-5.725C18.351,12.7,19.2,9,22,9c2.819,0,3.627,4.034,4.48,8.3C27.014,19.97,27.819,24,29,24a1,1,0,0,1,0,2c-2.819,0-3.627-4.034-4.48-8.3C23.986,15.03,23.181,11,22,11c-1.2,0-1.968,3.309-2.525,5.725C18.649,20.3,17.8,24,15,24c-2.618,0-3.6-1.97-4.395-3.553C9.824,18.884,9.317,18,8,18c-1.219,0-1.946,2.907-2.53,5.243C4.64,26.565,3.781,30,1,30Z"/>
+      </g>
+    </symbol>
+    <symbol id="linedot" data-name="linedot" viewBox="0 0 30 30">
+      <g opacity="0.4">
+        <path d="M1,30a1,1,0,0,1-.6-1.8l3.834-2.876,3.9-6.82a.979.979,0,0,1,.269-.3l3.834-2.876,3.9-6.82a1,1,0,0,1,1.11-.474l3.642.91L24.357,7.2l3.862-4.829a1,1,0,1,1,1.562,1.25l-4,5a1.012,1.012,0,0,1-.333.27l-4,2a1.011,1.011,0,0,1-.69.075l-3.266-.816L13.868,16.5a.989.989,0,0,1-.268.3L9.766,19.676l-3.9,6.82a.989.989,0,0,1-.268.3l-4,3A.994.994,0,0,1,1,30Z"/>
+      </g>
+      <rect width="30" height="30" fill="none"/>
+      <g>
+        <circle cx="29" cy="3" r="1"/>
+        <circle cx="25" cy="8" r="1"/>
+        <circle cx="21" cy="10" r="1"/>
+        <circle cx="17" cy="9" r="1"/>
+        <circle cx="13" cy="16" r="1"/>
+        <circle cx="9" cy="19" r="1"/>
+        <circle cx="5" cy="26" r="1"/>
+        <circle cx="1" cy="29" r="1"/>
+      </g>
+    </symbol>
+    <symbol id="pie" data-name="pie" viewBox="0 0 30 30">
+      <rect width="30" height="30" fill="none"/>
+      <path d="M29.49,18.883A15,15,0,0,0,23.6,2.715L15,15Z" opacity="0.4"/>
+      <path d="M29.49,18.883,15,15l8.6,12.285A15.013,15.013,0,0,0,29.49,18.883Z" opacity="0.6"/>
+      <path d="M23.6,2.715a15,15,0,1,0,0,24.57L15,15Z" opacity="0.2"/>
+    </symbol>
+    <symbol id="doughnut" data-name="doughnut" viewBox="0 0 30 30">
+      <rect width="30" height="30" fill="none"/>
+      <path d="M7.017,15a7.941,7.941,0,0,1,1.218-4.237L2.289,7.039A15,15,0,0,0,11.565,29.6l1.607-6.83A7.982,7.982,0,0,1,7.017,15Z" opacity="0.4"/>
+      <path d="M15,7.017a7.981,7.981,0,0,1,7.029,4.2l6.178-3.328A15,15,0,0,0,2.289,7.039l5.946,3.724A7.975,7.975,0,0,1,15,7.017Z" opacity="0.2"/>
+      <path d="M28.207,7.885l-6.178,3.328a7.984,7.984,0,0,1,.655,5.949l6.755,1.9A15.006,15.006,0,0,0,28.207,7.885Z"/>
+      <path d="M15,22.983a7.98,7.98,0,0,1-1.828-.213L11.565,29.6A14.993,14.993,0,0,0,29.439,19.063l-6.755-1.9A7.985,7.985,0,0,1,15,22.983Z" opacity="0.6"/>
+    </symbol>
+    <symbol id="area" data-name="area" viewBox="0 0 30 30">
+      <rect width="30" height="30" fill="none"/>
+      <path d="M0,30C4.6,30,2,6.985,8,6.985S12,20,18,20c8,0,7.677,10,12,10" opacity="0.6"/>
+    </symbol>
+    <symbol id="table" data-name="table" viewBox="0 0 30 30">
+      <rect width="30" height="30" fill="none"/>
+      <path d="M23,0H0V19H30V0ZM22,1V3H16V1Zm0,11H16V10h6Zm1-2h6v2H23ZM4,10H15v2H4ZM3,12H1V10H3ZM15,7V9H4V7ZM4,6V4H15V6Zm11,7v2H4V13Zm1,0h6v2H16Zm0-4V7h6V9Zm0-3V4h6V6ZM15,1V3H4V1ZM1,1H3V3H1ZM1,4H3V6H1ZM1,7H3V9H1Zm2,6v2H1V13ZM1,18V16H3v2Zm3,0V16H15v2Zm12,0V16h6v2Zm13,0H23V16h6Zm0-3H23V13h6ZM23,9V7h6V9Zm0-3V4h6V6Zm0-3V1h6V3Z" opacity="0.8"/>
+    </symbol>
+    <symbol id="tree" data-name="tree" viewBox="0 0 30 30">
+      <rect width="30" height="30" fill="none"/>
+      <path d="M28.682,23.518V19a1.5,1.5,0,0,0-1.5-1.5H26.045V13a1.5,1.5,0,0,0-1.5-1.5H20.773V7a1.5,1.5,0,0,0-1.5-1.5H12.864V0h-1V5.5H5.455A1.5,1.5,0,0,0,3.955,7v4.5H2.818a1.5,1.5,0,0,0-1.5,1.5v4.518A1.5,1.5,0,0,0,0,19V30H1V19a.5.5,0,0,1,.5-.5h.636a.5.5,0,0,1,.5.5V30h1V19a1.5,1.5,0,0,0-1.318-1.482V13a.5.5,0,0,1,.5-.5H6.091a.5.5,0,0,1,.5.5v4.518A1.5,1.5,0,0,0,5.273,19V30h1V19a.5.5,0,0,1,.5-.5h.636a.5.5,0,0,1,.5.5V30h1V19a1.5,1.5,0,0,0-1.318-1.482V13a1.5,1.5,0,0,0-1.5-1.5H4.955V7a.5.5,0,0,1,.5-.5H19.273a.5.5,0,0,1,.5.5v4.5H16A1.5,1.5,0,0,0,14.5,13v4.5H13.364a1.5,1.5,0,0,0-1.5,1.5v4.518A1.5,1.5,0,0,0,10.545,25v5h1V25a.5.5,0,0,1,.5-.5h.637a.5.5,0,0,1,.5.5v5h1V25a1.5,1.5,0,0,0-1.318-1.482V19a.5.5,0,0,1,.5-.5h3.272a.5.5,0,0,1,.5.5v4.518A1.5,1.5,0,0,0,15.818,25v5h1V25a.5.5,0,0,1,.5-.5h.637a.5.5,0,0,1,.5.5v5h1V25a1.5,1.5,0,0,0-1.319-1.482V19a1.5,1.5,0,0,0-1.5-1.5H15.5V13a.5.5,0,0,1,.5-.5h8.545a.5.5,0,0,1,.5.5v4.5H23.909a1.5,1.5,0,0,0-1.5,1.5v4.518A1.5,1.5,0,0,0,21.091,25v5h1V25a.5.5,0,0,1,.5-.5h.636a.5.5,0,0,1,.5.5v5h1V25a1.5,1.5,0,0,0-1.318-1.482V19a.5.5,0,0,1,.5-.5h3.273a.5.5,0,0,1,.5.5v4.518A1.5,1.5,0,0,0,26.364,25v5h1V25a.5.5,0,0,1,.5-.5H28.5a.5.5,0,0,1,.5.5v5h1V25A1.5,1.5,0,0,0,28.682,23.518Z"/>
+    </symbol>
+    <symbol id="radar" data-name="radar" viewBox="0 0 30 30">
+      <g opacity="0.2">
+        <path d="M21.858,3.121,28.717,15,21.858,26.879H8.142L1.283,15,8.142,3.121H21.858M22.5,2.01H7.5L0,15,7.5,27.99h15L30,15,22.5,2.01Z"/>
+        <path d="M20.576,5.343,26.151,15l-5.575,9.657H9.424L3.849,15,9.424,5.343H20.576m.641-1.111H8.783L2.566,15,8.783,25.768H21.217L27.434,15,21.217,4.232Z"/>
+        <path d="M19.292,7.565,23.585,15l-4.293,7.435H10.708L6.415,15l4.293-7.435h8.584m.642-1.111H10.066L5.132,15l4.934,8.546h9.868L24.868,15,19.934,6.454Z"/>
+        <path d="M18.009,9.787,21.019,15l-3.01,5.213H11.991L8.981,15l3.01-5.213h6.018m.642-1.111h-7.3L7.7,15l3.651,6.324h7.3L22.3,15l-3.65-6.324Z"/>
+        <path d="M16.726,12.009,18.452,15l-1.726,2.991H13.274L11.548,15l1.726-2.991h3.452m.642-1.111H12.632L10.265,15l2.367,4.1h4.736L19.735,15l-2.367-4.1Z"/>
+        <path d="M15.443,14.231l.444.769-.444.769h-.886L14.113,15l.444-.769h.886m.642-1.111h-2.17L12.83,15l1.085,1.88h2.17L17.17,15l-1.085-1.88Z"/>
+      </g>
+      <rect width="30" height="30" fill="none"/>
+      <polygon points="3.849 15 11.349 8.676 20.575 5.343 21.018 15 19.292 22.435 11.349 21.324 3.849 15" opacity="0.4"/>
+      <polygon points="10.066 6.454 18.009 9.787 24.868 15 19.934 23.546 8.783 25.768 7.698 15 10.066 6.454" opacity="0.4"/>
+    </symbol>
+    <symbol id="y" data-name="y" viewBox="0 0 30 30">
+      <rect width="30" height="30" fill="none"/>
+      <rect width="30" height="30" opacity="0.1"/>
+      <path d="M19.226,8c-.679,0-1.029.657-1.029,1.314,0,.613.263.985.263,1.8,0,1.9-1.467,4.183-2.387,5.825C15.635,14.832,15.679,8,12.591,8c-1.774,0-2.365,1.861-2.365,3.306,0,.4.134.763.476.718.315-.041.318-.343.23-.618a1.829,1.829,0,0,1-.136-.8,1,1,0,0,1,1.051-.988c1.423,0,2.277,3.854,2.562,6.373l.2,1.817.065,1.139-1.182,1.379a2.521,2.521,0,0,1-1.861,1.052c-.351,0-.635-.154-.92-.154a.8.8,0,0,0-.788.9.912.912,0,0,0,.9.876c1.752,0,3.241-2.234,4.183-3.438,1.533-1.971,5.08-7.993,5.08-10.4C20.08,8.591,19.861,8,19.226,8Z"/>
+    </symbol>
+    <symbol id="tallbar" data-name="tallbar" viewBox="0 0 30 64">
+      <rect width="30" height="64" fill="none"/>
+      <g opacity="0.8">
+        <rect width="28" height="4"/>
+        <rect y="6" width="26" height="4"/>
+        <rect y="12" width="22" height="4"/>
+        <rect y="18" width="22" height="4"/>
+        <rect y="24" width="16" height="4"/>
+        <rect y="30" width="15" height="4"/>
+        <rect y="36" width="14" height="4"/>
+        <rect y="42" width="14" height="4"/>
+        <rect y="48" width="8" height="4"/>
+        <rect y="54" width="8" height="4"/>
+        <rect y="60" width="4" height="4"/>
+      </g>
+    </symbol>
+    <symbol id="talllines" data-name="talllines" viewBox="0 0 30 64">
+      <rect width="30" height="64" fill="none"/>
+      <path d="M11.48,24.855a2.678,2.678,0,0,1-2.094-1.22c-.468-.551-.771-.881-1.388-.866a3,3,0,0,0-1.519.426,3.994,3.994,0,0,1-1.95.539,2.641,2.641,0,0,1-2.169-1.1c-.481-.515-.743-.788-1.4-.784a.493.493,0,0,1-.518-.482.5.5,0,0,1,.483-.517,2.662,2.662,0,0,1,2.168,1.1c.481.516.752.794,1.4.785a3.023,3.023,0,0,0,1.519-.425,3.979,3.979,0,0,1,1.95-.54,2.638,2.638,0,0,1,2.185,1.217c.469.552.775.888,1.388.867a9.031,9.031,0,0,0,1.665-.193,9.932,9.932,0,0,1,1.823-.211c.532-.019.829-.571,1.254-1.476.443-.941.944-2.007,2.124-2.049,1.152-.069,1.761,1.019,2.269,1.956.492.906.831,1.446,1.356,1.435a2.233,2.233,0,0,0,1.452-.567,3.188,3.188,0,0,1,2.011-.764,3.068,3.068,0,0,1,2.073.664,2.2,2.2,0,0,0,1.478.493.487.487,0,0,1,.518.482.5.5,0,0,1-.483.517A3.113,3.113,0,0,1,27,23.477a2.133,2.133,0,0,0-1.477-.493,2.235,2.235,0,0,0-1.451.568,3.183,3.183,0,0,1-2.012.763c-1.16.074-1.76-1.02-2.27-1.957-.49-.905-.817-1.422-1.354-1.434-.532.019-.83.57-1.255,1.476-.443.941-.944,2.007-2.123,2.049a9.019,9.019,0,0,0-1.665.193,10.048,10.048,0,0,1-1.824.211Z"/>
+      <path d="M28.8,54.4a.507.507,0,0,1-.055,0c-1.15-.124-1.62-1.09-2-1.866s-.635-1.248-1.206-1.31c-.595-.059-.947.256-1.461.785a2.643,2.643,0,0,1-2.286,1.083,2.67,2.67,0,0,1-2-1.447c-.393-.584-.665-.945-1.277-1.011-.586-.067-.937.288-1.454.866a2.606,2.606,0,0,1-2.306,1.193A5.762,5.762,0,0,1,12.9,52.21a4.878,4.878,0,0,0-1.584-.411c-1.165-.125-1.621-1.191-1.987-2.048s-.63-1.387-1.173-1.445c-.855-.092-1.274-.1-1.717-.116s-.9-.024-1.8-.12a6.09,6.09,0,0,0-1.655.018,7.038,7.038,0,0,1-1.888.02.5.5,0,0,1-.444-.55.506.506,0,0,1,.551-.444A6.127,6.127,0,0,0,2.857,47.1a7,7,0,0,1,1.888-.02c.855.091,1.274.1,1.717.115s.9.024,1.8.121c1.164.124,1.62,1.19,1.986,2.047s.63,1.388,1.173,1.446a5.777,5.777,0,0,1,1.862.482,4.863,4.863,0,0,0,1.582.411c.583.067.936-.288,1.453-.865a2.619,2.619,0,0,1,2.307-1.194,2.668,2.668,0,0,1,2,1.447c.393.584.665.946,1.277,1.011.587.062.948-.255,1.46-.785a2.644,2.644,0,0,1,2.287-1.083c1.151.123,1.621,1.09,2,1.867s.633,1.247,1.206,1.309a.5.5,0,0,1-.053,1Z"/>
+      <path d="M1.132,35.362a.5.5,0,0,1-.034-1,1.835,1.835,0,0,0,1.352-.8,2.794,2.794,0,0,1,2.026-1.134,2.041,2.041,0,0,0,1.4-.684,3.029,3.029,0,0,1,2-.94,3.937,3.937,0,0,0,1.558-.4,4.947,4.947,0,0,1,1.891-.48,3.258,3.258,0,0,1,2.071.515,2.307,2.307,0,0,0,1.511.39,2.632,2.632,0,0,1,2.26,1.3c.495.605.789.964,1.416.932.562-.04.834-.532,1.231-1.332s.9-1.8,2.057-1.883a3.782,3.782,0,0,1,2.018.366,2.852,2.852,0,0,0,1.552.289,13.321,13.321,0,0,0,1.691-.216,13.82,13.82,0,0,1,1.8-.23.5.5,0,1,1,.072,1,13.158,13.158,0,0,0-1.692.216,14.185,14.185,0,0,1-1.8.23,3.827,3.827,0,0,1-2.018-.367,2.85,2.85,0,0,0-1.553-.288c-.561.04-.834.532-1.231,1.332s-.9,1.8-2.057,1.883a2.629,2.629,0,0,1-2.26-1.3c-.5-.6-.822-.973-1.415-.932a3.264,3.264,0,0,1-2.072-.515,2.309,2.309,0,0,0-1.51-.39,3.972,3.972,0,0,0-1.558.4,4.954,4.954,0,0,1-1.892.48,2.045,2.045,0,0,0-1.4.684,3.029,3.029,0,0,1-2,.94,1.837,1.837,0,0,0-1.353.8A2.791,2.791,0,0,1,1.168,35.36Z"/>
+      <path d="M11.492,43.293a2.634,2.634,0,0,1-2.143-1.324C8.9,41.39,8.6,41.034,8,41.034a14.759,14.759,0,0,1-1.8-.095,13.739,13.739,0,0,0-1.7-.09,10.1,10.1,0,0,1-1.828-.144A9.229,9.229,0,0,0,1,40.574a.5.5,0,0,1,0-1,10.213,10.213,0,0,1,1.827.143,9.121,9.121,0,0,0,1.672.132,14.759,14.759,0,0,1,1.8.1,13.54,13.54,0,0,0,1.7.09,2.636,2.636,0,0,1,2.143,1.323c.448.581.754.936,1.352.936.534,0,.85-.528,1.307-1.4s1.014-1.932,2.191-1.932c1.159,0,1.725.957,2.18,1.725s.758,1.234,1.319,1.234c.536,0,.853-.519,1.309-1.374s1.016-1.9,2.191-1.9a9.291,9.291,0,0,1,1.838.159,8.352,8.352,0,0,0,1.667.144,2.636,2.636,0,0,1,2.154,1.378c.451.6.757.976,1.352.976a.5.5,0,0,1,0,1,2.635,2.635,0,0,1-2.154-1.379c-.45-.605-.757-.975-1.352-.975a9.287,9.287,0,0,1-1.837-.159,8.348,8.348,0,0,0-1.668-.144c-.536,0-.852.52-1.308,1.375s-1.017,1.9-2.192,1.9c-1.16,0-1.725-.956-2.18-1.725s-.758-1.234-1.319-1.234c-.534,0-.849.528-1.306,1.4S12.669,43.293,11.492,43.293Z"/>
+      <path d="M11.48,62.073c-.05,0-.1,0-.154-.006a2.677,2.677,0,0,1-2.04-1.327c-.425-.566-.694-.887-1.311-.932a2.206,2.206,0,0,0-1.5.415,3.162,3.162,0,0,1-2.084.553A2.636,2.636,0,0,1,2.335,59.14c-.4-.684-.68-1.106-1.263-1.148a.5.5,0,1,1,.072-1A2.635,2.635,0,0,1,3.2,58.632c.4.684.68,1.105,1.263,1.147a2.164,2.164,0,0,0,1.5-.415,3.15,3.15,0,0,1,2.084-.553,2.681,2.681,0,0,1,2.039,1.328c.425.565.694.887,1.311.931.583.046.913-.362,1.412-1.025a2.669,2.669,0,0,1,2.279-1.418,7.344,7.344,0,0,0,1.665-.044,8.205,8.205,0,0,1,1.858-.048,2.711,2.711,0,0,1,2.037,1.258,1.769,1.769,0,0,0,1.328.886,3.391,3.391,0,0,0,1.582-.223,4.294,4.294,0,0,1,1.977-.275,5.02,5.02,0,0,0,1.632-.117,5.857,5.857,0,0,1,1.91-.134.5.5,0,1,1-.072,1,5.093,5.093,0,0,0-1.633.116,5.948,5.948,0,0,1-1.907.135,3.38,3.38,0,0,0-1.581.223,4.356,4.356,0,0,1-1.98.275,2.712,2.712,0,0,1-2.036-1.258,1.769,1.769,0,0,0-1.327-.886,7.534,7.534,0,0,0-1.666.044,8.371,8.371,0,0,1-1.858.049c-.574-.045-.91.363-1.411,1.024A2.737,2.737,0,0,1,11.48,62.073Z"/>
+      <path d="M4.121,15.165a3.656,3.656,0,0,1-1.466-.323,2.61,2.61,0,0,0-1.566-.218.5.5,0,0,1-.141-.991,3.6,3.6,0,0,1,2.074.278,2.632,2.632,0,0,0,1.567.218c.612-.087.873-.46,1.246-1.06A2.687,2.687,0,0,1,7.79,11.548c.886-.127,1.332-.167,1.779-.208s.868-.079,1.729-.2c.887-.126,1.334-.167,1.78-.207s.868-.078,1.731-.2a5.257,5.257,0,0,0,1.587-.453,6.274,6.274,0,0,1,1.843-.524,6.415,6.415,0,0,0,1.615-.42,7.3,7.3,0,0,1,1.829-.476c1.193-.17,1.879.847,2.49,1.743.578.845,1,1.4,1.524,1.316s.76-.765,1.07-1.811c.325-1.1.694-2.348,1.888-2.519a.5.5,0,1,1,.141.991c-.52.074-.761.765-1.07,1.812-.326,1.1-.694,2.346-1.888,2.517s-1.878-.846-2.49-1.742c-.577-.844-.983-1.4-1.525-1.317a6.4,6.4,0,0,0-1.614.42,7.3,7.3,0,0,1-1.829.476,5.3,5.3,0,0,0-1.587.452,6.227,6.227,0,0,1-1.844.525c-.887.127-1.334.167-1.78.208s-.868.078-1.731.2c-.885.127-1.333.167-1.779.208s-.867.079-1.728.2c-.613.087-.873.46-1.246,1.06A2.688,2.688,0,0,1,4.729,15.12,4.391,4.391,0,0,1,4.121,15.165Z"/>
+      <path d="M14.99,5.273a3.061,3.061,0,0,1-2.052-.768,2.074,2.074,0,0,0-1.446-.564,3.337,3.337,0,0,1-2.013-.626A2.38,2.38,0,0,0,8,2.843a12.717,12.717,0,0,1-1.809-.111,12.043,12.043,0,0,0-1.689-.1,3.569,3.569,0,0,1-2-.561A2.609,2.609,0,0,0,1,1.637a.5.5,0,0,1,0-1A3.567,3.567,0,0,1,3,1.2a2.6,2.6,0,0,0,1.5.431,12.9,12.9,0,0,1,1.81.111A11.861,11.861,0,0,0,8,1.843a3.344,3.344,0,0,1,2.013.626,2.376,2.376,0,0,0,1.482.472,3.064,3.064,0,0,1,2.052.768,2.074,2.074,0,0,0,1.446.564,12.92,12.92,0,0,0,1.694-.095,13.86,13.86,0,0,1,1.8-.1,1.927,1.927,0,0,0,1.423-.634,2.909,2.909,0,0,1,2.077-.877,1.98,1.98,0,0,0,1.435-.61,2.948,2.948,0,0,1,2.07-.841,2.635,2.635,0,0,1,2.163,1.469c.45.646.757,1.042,1.343,1.042a.5.5,0,0,1,0,1,2.633,2.633,0,0,1-2.163-1.469c-.451-.646-.757-1.042-1.343-1.042a1.974,1.974,0,0,0-1.432.611,2.964,2.964,0,0,1-2.073.84,1.93,1.93,0,0,0-1.423.634,2.9,2.9,0,0,1-2.077.877,12.878,12.878,0,0,0-1.694.1A13.9,13.9,0,0,1,14.99,5.273Z"/>
+    </symbol>
+    <symbol id="talltree" data-name="talltree" viewBox="0 0 30 64">
+      <rect width="30" height="64" fill="none"/>
+      <path d="M28.682,50.719V39.4a1.5,1.5,0,0,0-1.5-1.5H26.045V26.6a1.5,1.5,0,0,0-1.5-1.5H20.773V13.8a1.5,1.5,0,0,0-1.5-1.5H12.864V0h-1V12.3H5.455a1.5,1.5,0,0,0-1.5,1.5V25.1H2.818a1.5,1.5,0,0,0-1.5,1.5V37.919A1.5,1.5,0,0,0,0,39.4V64H1V39.4a.5.5,0,0,1,.5-.5h.636a.5.5,0,0,1,.5.5V64h1V39.4a1.5,1.5,0,0,0-1.318-1.481V26.6a.5.5,0,0,1,.5-.5H6.091a.5.5,0,0,1,.5.5V37.919A1.5,1.5,0,0,0,5.273,39.4V64h1V39.4a.5.5,0,0,1,.5-.5h.636a.5.5,0,0,1,.5.5V64h1V39.4a1.5,1.5,0,0,0-1.318-1.481V26.6a1.5,1.5,0,0,0-1.5-1.5H4.955V13.8a.5.5,0,0,1,.5-.5H19.273a.5.5,0,0,1,.5.5V25.1H16a1.5,1.5,0,0,0-1.5,1.5V37.9H13.364a1.5,1.5,0,0,0-1.5,1.5V50.719A1.5,1.5,0,0,0,10.545,52.2V64h1V52.2a.5.5,0,0,1,.5-.5h.637a.5.5,0,0,1,.5.5V64h1V52.2a1.5,1.5,0,0,0-1.318-1.481V39.4a.5.5,0,0,1,.5-.5h3.272a.5.5,0,0,1,.5.5V50.719A1.5,1.5,0,0,0,15.818,52.2V64h1V52.2a.5.5,0,0,1,.5-.5h.637a.5.5,0,0,1,.5.5V64h1V52.2a1.5,1.5,0,0,0-1.319-1.481V39.4a1.5,1.5,0,0,0-1.5-1.5H15.5V26.6a.5.5,0,0,1,.5-.5h8.545a.5.5,0,0,1,.5.5V37.9H23.909a1.5,1.5,0,0,0-1.5,1.5V50.719A1.5,1.5,0,0,0,21.091,52.2V64h1V52.2a.5.5,0,0,1,.5-.5h.636a.5.5,0,0,1,.5.5V64h1V52.2a1.5,1.5,0,0,0-1.318-1.481V39.4a.5.5,0,0,1,.5-.5h3.273a.5.5,0,0,1,.5.5V50.719A1.5,1.5,0,0,0,26.364,52.2V64h1V52.2a.5.5,0,0,1,.5-.5H28.5a.5.5,0,0,1,.5.5V64h1V52.2A1.5,1.5,0,0,0,28.682,50.719Z"/>
+    </symbol>
+    <symbol id="widemap" data-name="widemap" viewBox="0 0 64 30">
+      <rect width="64" height="30" fill="none"/>
+      <g>
+        <g opacity="0.2">
+          <polygon points="17.19 15.712 13.409 15.284 12.22 14.8 11.951 14.607 8.862 12.716 9.319 10.84 12.38 11.853 12.497 11.713 13.937 9.418 14.668 8.631 19.049 6.127 19.366 5.914 16.284 3.852 14.838 5.763 13.827 3.865 15.483 2.746 15.13 2.652 12.805 2.645 11.025 2.158 10.659 2.062 9.941 2.215 7.761 2.321 6.337 2.114 5.767 2.207 2.893 3.552 2.606 3.715 1.013 5.276 1 5.384 5.31 4.295 6.741 7.17 5.399 8.738 6.25 12.215 6.323 12.214 6.628 10.727 6.687 10.731 7.478 13.211 12.61 16.506 12.266 18.086 12.185 18.762 12.858 21.038 14.437 21.804 14.682 28.238 15.515 28.847 17.091 30 17.226 30 17.213 29.87 16.171 28.003 18.255 23.302 19.985 22.967 21.057 18.94 18.083 17.863 17.19 15.712"/>
+          <polygon points="25.99 0 25.046 0 24.65 0.046 21.349 0.072 20.859 0.151 18.778 0.859 18.502 0.966 18.518 1.044 20.902 1.791 20.136 4.444 21.615 3.424 25.144 0.761 25.99 0"/>
+          <polygon points="60.904 26.734 59.595 28.447 61.218 28.548 61.928 27.743 63 26.579 63 26.447 60.904 26.734"/>
+          <polygon points="51.23 15.023 53.482 9.881 53.54 9.408 52.887 5.791 55.268 3.77 56.784 6.086 56.784 4.129 58.282 3.467 58.254 3.385 57.704 3.254 54.671 2.588 50.443 2.3 48.541 2.116 44.38 1.013 43.605 1.022 36.696 3.078 36.067 3.03 34.437 2.343 34.12 2.263 31.774 2.448 31.506 2.557 30.055 3.871 30.055 4.533 30.884 4.461 32.611 3.767 32.686 3.75 33.251 4.248 29.53 5.473 28.718 4.477 27.955 4.833 28.375 7.801 27.316 7.633 27.133 9.15 27.72 9.272 28.727 9.105 30.499 8.094 33.769 8.872 33.091 7.922 35.89 7.75 35.909 7.813 34.352 8.623 34.416 9.626 36.037 9.32 36.069 9.378 34.948 10.537 35.176 10.91 32.261 10.91 31.184 9.774 28.577 9.974 28.218 10.128 25.107 12.692 25.203 14.77 26.833 16.625 29.401 16.32 30.917 17.966 31.415 19.179 31.762 20.056 30.84 21.247 32.419 25.458 34.332 24.915 34.771 22.381 36.921 21.264 36.381 18.655 37.559 17.836 38.264 17.257 39.024 15.333 37.341 15.535 35.37 11.236 35.419 11.212 37.884 14.79 40.381 12.72 39.349 12.44 38.709 11.972 37.919 10.734 39.075 11.606 39.867 11.904 41.582 12.056 44.95 15.444 47.273 12.512 49.854 17.471 51.23 15.023"/>
+          <polygon points="58.034 20.727 54.837 21.072 54.57 21.202 52.124 22.8 51.877 23.151 51.412 25.314 51.264 26.136 55.512 25.596 55.84 26.894 57.972 26.894 59.624 24.212 58.034 20.727"/>
+          <polygon points="53.31 20.409 53.37 20.293 48.384 17.073 48.322 17.147 48.46 17.349 50.092 19.474 50.655 19.829 51.956 20.121 53.31 20.409"/>
+          <polygon points="51.512 18.541 52.905 18.631 53.223 16.385 51.279 17.268 51.512 18.541"/>
+          <polygon points="56.274 8.675 55.414 8.163 54.479 10.761 56.11 10.119 56.274 8.675"/>
+          <polygon points="37.827 21.719 37.459 23.752 38.41 23.586 39.179 20.959 39.099 20.921 37.827 21.719"/>
+          <polygon points="54.886 15.888 54.872 15.407 53.897 13.509 53.193 14.875 54.817 16.687 54.886 15.888"/>
+          <polygon points="57.456 19.963 59.651 20.481 58.951 19.173 58.799 19.064 57.136 18.682 57.456 19.963"/>
+        </g>
+        <g opacity="0.8">
+          <circle cx="5.935" cy="9" r="1"/>
+          <circle cx="15" cy="8" r="1"/>
+          <circle cx="18.255" cy="23.302" r="1"/>
+          <circle cx="28.5" cy="16.5" r="1"/>
+          <circle cx="29" cy="6" r="1"/>
+          <circle cx="36" cy="5" r="1"/>
+          <circle cx="52" cy="11" r="1"/>
+          <circle cx="51" cy="15" r="1"/>
+          <circle cx="40" cy="12.5" r="1"/>
+          <circle cx="58.5" cy="25.5" r="1"/>
+          <circle cx="50" cy="18" r="1"/>
+          <circle cx="56" cy="10" r="1"/>
+        </g>
+      </g>
+    </symbol>
+    <symbol id="widearea" data-name="widearea" viewBox="0 0 64 30">
+      <rect width="64" height="30" fill="none"/>
+      <path d="M64,30c-6,0-12-12-21-12C36,18,35,4,27,4S18,22,12,22,6,30,0,30Z" opacity="0.6"/>
+    </symbol>
+    <symbol id="wideline1" data-name="wideline1" viewBox="0 0 64 30">
+      <rect width="64" height="30" fill="none"/>
+      <g opacity="0.8">
+        <path d="M1,30a1,1,0,0,1,0-2c2.479,0,4.034-2.222,5.681-4.573C8.461,20.883,10.479,18,14,18a7.976,7.976,0,0,1,4.986,2.025A7.748,7.748,0,0,0,24,22c2.586,0,4.387-1.8,6.293-3.707C32.4,16.183,34.586,14,38,14c3.566,0,5.314,2.914,6.857,5.485C46.311,21.908,47.566,24,50,24c2.269,0,4.087-5.713,5.547-10.3C57.461,7.682,59.269,2,63,2a1,1,0,0,1,0,2c-2.269,0-4.087,5.713-5.547,10.3C55.539,20.318,53.731,26,50,26c-3.566,0-5.314-2.914-6.857-5.485C41.689,18.092,40.434,16,38,16c-2.586,0-4.387,1.8-6.293,3.707C29.6,21.817,27.414,24,24,24a9.634,9.634,0,0,1-6.194-2.359C16.552,20.724,15.562,20,14,20c-2.479,0-4.034,2.222-5.681,4.573C6.539,27.117,4.521,30,1,30Z"/>
+      </g>
+    </symbol>
+    <symbol id="wideline2" data-name="wideline2" viewBox="0 0 64 30">
+      <rect width="64" height="30" fill="none"/>
+      <g opacity="0.4">
+        <path d="M63,26c-3.549,0-5.565-3.168-7.344-5.963C54.008,17.446,52.451,15,50,15a7.389,7.389,0,0,0-5.859,2.383A8.088,8.088,0,0,1,38,20c-3.6,0-5.777-4.082-7.883-8.029C28.29,8.544,26.4,5,24,5c-2.181,0-3.157,4.886-4.02,9.2C18.918,19.508,17.819,25,14,25c-3.574,0-5.5-3.3-7.364-6.5C4.985,15.674,3.426,13,1,13a1,1,0,0,1,0-2c3.574,0,5.5,3.3,7.364,6.5C10.015,20.326,11.574,23,14,23c2.181,0,3.157-4.886,4.02-9.2C19.082,8.492,20.181,3,24,3c3.6,0,5.777,4.082,7.883,8.029C33.71,14.456,35.6,18,38,18a6.1,6.1,0,0,0,4.793-2.1A9.268,9.268,0,0,1,50,13c3.549,0,5.565,3.168,7.344,5.963C58.992,21.554,60.549,24,63,24a1,1,0,0,1,0,2Z"/>
+      </g>
+      <g opacity="0.6">
+        <path d="M50,30c-4.4,0-5.974-5.751-7.5-11.313C41.387,14.615,40.122,10,38,10c-2.365,0-4.262,4.029-6.095,7.926C29.806,22.387,27.635,27,24,27c-3.812,0-4.913-5.233-5.979-10.294C17.162,12.625,16.188,8,14,8c-2.279,0-4.018,5.215-5.552,9.816C6.531,23.567,4.721,29,1,29a1,1,0,0,1,0-2c2.279,0,4.018-5.215,5.552-9.816C8.469,11.433,10.279,6,14,6c3.812,0,4.913,5.233,5.979,10.294C20.838,20.375,21.812,25,24,25c2.365,0,4.262-4.029,6.095-7.926C32.194,12.613,34.365,8,38,8s5,4.935,6.431,10.158C45.7,22.771,47.128,28,50,28c2.426,0,3.985-2.674,5.636-5.5C57.5,19.3,59.426,16,63,16a1,1,0,0,1,0,2c-2.426,0-3.985,2.674-5.636,5.5C55.5,26.7,53.574,30,50,30Z"/>
+      </g>
+    </symbol>
+    <symbol id="wideline3" data-name="wideline3" viewBox="0 0 64 30">
+      <rect width="64" height="30" fill="none"/>
+      <g opacity="0.8">
+        <path d="M1,25a1,1,0,0,1,0-2c2.451,0,4.008-2.446,5.656-5.037C8.435,15.168,10.451,12,14,12c2.287,0,4.444,1.349,6.53,2.652C22.462,15.859,24.287,17,26,17c2.465,0,4.264-2.7,6.168-5.555C34.28,8.276,36.465,5,40,5c3.618,0,4.88,2.524,5.9,4.553C46.963,11.69,47.733,13,50,13c2.4,0,3.965-2.9,5.619-5.974C57.479,3.571,59.4,0,63,0a1,1,0,0,1,0,2c-2.4,0-3.965,2.9-5.619,5.974C55.521,11.429,53.6,15,50,15c-3.618,0-4.88-2.524-5.9-4.553C43.037,8.31,42.267,7,40,7c-2.465,0-4.264,2.7-6.168,5.555C31.72,15.724,29.535,19,26,19c-2.287,0-4.444-1.349-6.53-2.652C17.538,15.141,15.713,14,14,14c-2.451,0-4.008,2.446-5.656,5.037C6.565,21.832,4.549,25,1,25Z"/>
+      </g>
+      <g opacity="0.6">
+        <path d="M14,29c-3.574,0-5.5-3.3-7.364-6.5C4.985,19.674,3.426,17,1,17a1,1,0,0,1,0-2c3.574,0,5.5,3.3,7.364,6.5C10.015,24.326,11.574,27,14,27c2.872,0,4.305-5.229,5.569-9.842C21,11.935,22.353,7,26,7c3.618,0,5.792,4.348,7.9,8.553C35.725,19.214,37.618,23,40,23c2.2,0,3.126-4.177,4.023-8.217C45.093,9.974,46.2,5,50,5c3.574,0,5.5,3.3,7.364,6.5C59.015,14.326,60.574,17,63,17a1,1,0,0,1,0,2c-3.574,0-5.5-3.3-7.364-6.5C53.985,9.674,52.426,7,50,7c-2.2,0-3.126,4.177-4.023,8.217C44.907,20.026,43.8,25,40,25c-3.618,0-5.792-4.348-7.9-8.553C30.275,12.786,28.382,9,26,9c-2.122,0-3.387,4.615-4.5,8.687C19.974,23.249,18.4,29,14,29Z"/>
+      </g>
+      <g opacity="0.4">
+        <path d="M26,30c-3.371,0-4.9-1.956-6.254-3.682C18.352,24.538,17.147,23,14,23c-2.63,0-4.122,1.278-5.85,2.759C6.379,27.278,4.37,29,1,29a1,1,0,0,1,0-2c2.63,0,4.122-1.278,5.85-2.759C8.621,22.722,10.63,21,14,21c4.122,0,5.9,2.266,7.321,4.086C22.6,26.714,23.6,28,26,28c2.336,0,4.324-4.722,6.078-8.888C34.268,13.912,36.336,9,40,9c3.8,0,4.907,4.974,5.977,9.783C46.874,22.823,47.8,27,50,27c2.346,0,3.992-3.763,5.584-7.4C57.434,15.371,59.346,11,63,11a1,1,0,0,1,0,2c-2.346,0-3.992,3.763-5.584,7.4C55.566,24.629,53.654,29,50,29c-3.8,0-4.907-4.974-5.977-9.783C43.126,15.177,42.2,11,40,11c-2.336,0-4.324,4.722-6.078,8.888C31.732,25.088,29.664,30,26,30Z"/>
+      </g>
+    </symbol>
+    <symbol id="wideerrorbars" data-name="wideerrorbars" viewBox="0 0 64 30">
+      <g opacity="0.4">
+        <rect x="4" y="22" width="1" height="6"/>
+        <rect x="10.875" y="18" width="1" height="6"/>
+        <rect x="17.75" y="12" width="1" height="9"/>
+        <rect x="24.625" y="14" width="1" height="9"/>
+        <rect x="31.5" y="10" width="1" height="10"/>
+        <rect x="38.375" y="15" width="1" height="10"/>
+        <rect x="45.25" y="18" width="1" height="10"/>
+        <rect x="52.125" y="5" width="1" height="12"/>
+        <rect x="59" y="2" width="1" height="13"/>
+      </g>
+      <rect width="64" height="30" fill="none"/>
+      <g>
+        <rect x="2" y="25" width="5" height="1"/>
+        <rect x="8.875" y="20" width="5" height="1"/>
+        <rect x="15.75" y="15" width="5" height="1"/>
+        <rect x="22.625" y="17" width="5" height="1"/>
+        <rect x="29.5" y="14" width="5" height="1"/>
+        <rect x="36.375" y="21" width="5" height="1"/>
+        <rect x="43.25" y="23" width="5" height="1"/>
+        <rect x="50.125" y="10" width="5" height="1"/>
+        <rect x="57" y="6" width="5" height="1"/>
+      </g>
+    </symbol>
+    <symbol id="widebar" data-name="widebar" viewBox="0 0 64 30">
+      <rect width="64" height="30" fill="none"/>
+      <g opacity="0.8">
+        <rect y="20" width="4" height="10"/>
+        <rect x="7.5" y="17" width="4" height="13"/>
+        <rect x="60" y="13" width="4" height="17"/>
+        <rect x="52.5" y="2" width="4" height="28"/>
+        <rect x="45" y="16" width="4" height="14"/>
+        <rect x="37.5" y="11" width="4" height="19"/>
+        <rect x="30" y="13" width="4" height="17"/>
+        <rect x="22.5" y="15" width="4" height="15"/>
+        <rect x="15" y="8" width="4" height="22"/>
+      </g>
+    </symbol>
+    <symbol id="widetree" data-name="widetree" viewBox="0 0 64 30">
+      <rect width="64" height="30" fill="none"/>
+      <path d="M64,11.863H51.7V5.454a1.5,1.5,0,0,0-1.5-1.5H38.9V2.818a1.5,1.5,0,0,0-1.5-1.5H26.081A1.5,1.5,0,0,0,24.6,0H0V1H24.6a.5.5,0,0,1,.5.5v.637a.5.5,0,0,1-.5.5H0v1H24.6a1.5,1.5,0,0,0,1.481-1.319H37.4a.5.5,0,0,1,.5.5V6.091a.5.5,0,0,1-.5.5H26.081A1.5,1.5,0,0,0,24.6,5.272H0v1H24.6a.5.5,0,0,1,.5.5v.637a.5.5,0,0,1-.5.5H0v1H24.6a1.5,1.5,0,0,0,1.481-1.318H37.4a1.5,1.5,0,0,0,1.5-1.5V4.954H50.2a.5.5,0,0,1,.5.5V19.272a.5.5,0,0,1-.5.5H38.9V16a1.5,1.5,0,0,0-1.5-1.5H26.1V13.363a1.5,1.5,0,0,0-1.5-1.5H13.281A1.5,1.5,0,0,0,11.8,10.546H0v1H11.8a.5.5,0,0,1,.5.5v.636a.5.5,0,0,1-.5.5H0v1H11.8a1.5,1.5,0,0,0,1.481-1.319H24.6a.5.5,0,0,1,.5.5v3.274a.5.5,0,0,1-.5.5H13.281A1.5,1.5,0,0,0,11.8,15.818H0v1H11.8a.5.5,0,0,1,.5.5v.636a.5.5,0,0,1-.5.5H0v1H11.8a1.5,1.5,0,0,0,1.481-1.317H24.6a1.5,1.5,0,0,0,1.5-1.5V15.5H37.4a.5.5,0,0,1,.5.5v8.546a.5.5,0,0,1-.5.5H26.1V23.909a1.5,1.5,0,0,0-1.5-1.5H13.281A1.5,1.5,0,0,0,11.8,21.091H0v1H11.8a.5.5,0,0,1,.5.5v.637a.5.5,0,0,1-.5.5H0v1H11.8a1.5,1.5,0,0,0,1.481-1.319H24.6a.5.5,0,0,1,.5.5v3.273a.5.5,0,0,1-.5.5H13.281A1.5,1.5,0,0,0,11.8,26.363H0v1H11.8a.5.5,0,0,1,.5.5V28.5a.5.5,0,0,1-.5.5H0v1H11.8a1.5,1.5,0,0,0,1.481-1.318H24.6a1.5,1.5,0,0,0,1.5-1.5V26.046H37.4a1.5,1.5,0,0,0,1.5-1.5V20.772H50.2a1.5,1.5,0,0,0,1.5-1.5V12.863H64Z"/>
+    </symbol>
+    <symbol id="widelinedot" data-name="widelinedot" viewBox="0 0 64 30">
+      <g opacity="0.4">
+        <path d="M1.033,27.968a1,1,0,0,1-.555-1.832l6.193-4.129a1,1,0,0,1,.391-.154l5.982-1,6.015-4.009a.975.975,0,0,1,.238-.117l5.97-1.99,6.026-6.027a1,1,0,0,1,.391-.241l6.194-2.065a1.165,1.165,0,0,1,.152-.038l6.194-1.032a1.007,1.007,0,0,1,.611.092l6.193,3.1a.9.9,0,0,1,.108.063l6.194,4.13a.911.911,0,0,1,.152.125l6.194,6.193a1,1,0,0,1-1.414,1.414l-6.123-6.123-6.061-4.041L44.231,7.362l-5.794.966-5.9,1.965L26.514,16.32a.994.994,0,0,1-.391.242l-6.066,2.022-6.082,4.055a1.011,1.011,0,0,1-.391.154l-5.982,1L1.587,27.8A1,1,0,0,1,1.033,27.968Z"/>
+      </g>
+      <rect width="64" height="30" fill="none"/>
+      <g>
+        <circle cx="1.032" cy="26.968" r="1"/>
+        <circle cx="7.226" cy="22.839" r="1"/>
+        <circle cx="13.42" cy="21.806" r="1"/>
+        <circle cx="19.613" cy="17.677" r="1"/>
+        <circle cx="25.807" cy="15.613" r="1"/>
+        <circle cx="32" cy="9.419" r="1"/>
+        <circle cx="38.194" cy="7.355" r="1"/>
+        <circle cx="44.388" cy="6.323" r="1"/>
+        <circle cx="50.581" cy="9.419" r="1"/>
+        <circle cx="56.775" cy="13.548" r="1"/>
+        <circle cx="62.969" cy="19.742" r="1"/>
+      </g>
+    </symbol>
+    <symbol id="distribution" data-name="distribution" viewBox="0 0 30 30">
+      <g opacity="0.8">
+        <rect width="30" height="30" fill="none"/>
+        <rect y="22" width="2" height="8"/>
+        <rect x="3.111" y="20" width="2" height="10"/>
+        <rect x="6.222" y="17" width="2" height="13"/>
+        <rect x="9.333" y="13" width="2" height="17"/>
+        <rect x="12.444" y="8" width="2" height="22"/>
+        <rect x="15.556" y="6" width="2" height="24"/>
+        <rect x="18.667" y="9" width="2" height="21"/>
+        <rect x="21.778" y="15" width="2" height="15"/>
+        <rect x="24.889" y="19" width="2" height="11"/>
+        <rect x="28" y="21" width="2" height="9"/>
+      </g>
+    </symbol>
+    <symbol id="shadedbar" data-name="shadedbar" viewBox="0 0 30 30">
+      <g opacity="0.8">
+        <rect y="23" width="5" height="7"/>
+        <rect x="25" y="21.475" width="5" height="8.525"/>
+        <rect x="16.667" y="14.525" width="5" height="15.475"/>
+        <rect x="8.333" y="19" width="5" height="11"/>
+      </g>
+      <g opacity="0.4">
+        <rect y="13" width="5" height="10"/>
+        <rect x="25" y="12.262" width="5" height="9.213"/>
+        <rect x="16.667" y="6.525" width="5" height="8"/>
+        <rect x="8.333" y="8" width="5" height="11"/>
+      </g>
+      <g opacity="0.2">
+        <rect width="5" height="13"/>
+        <rect x="25" width="5" height="12.262"/>
+        <rect x="16.667" width="5" height="6.5"/>
+        <rect x="8.333" width="5" height="8"/>
+      </g>
+    </symbol>
+    <symbol id="wideshadedbar" data-name="wideshadedbar" viewBox="0 0 64 30">
+      <g opacity="0.8">
+        <rect y="23" width="4" height="7"/>
+        <rect x="7.5" y="19" width="4" height="11"/>
+        <rect x="60" y="17" width="4" height="13"/>
+        <rect x="52.5" y="20" width="4" height="10"/>
+        <rect x="45.035" y="17" width="4" height="13"/>
+        <rect x="37.5" y="11" width="4" height="19"/>
+        <rect x="30" y="13" width="4" height="17"/>
+        <rect x="22.5" y="16.5" width="4" height="13.5"/>
+        <rect x="15" y="21.411" width="4" height="8.589"/>
+      </g>
+      <g opacity="0.6">
+        <rect y="11" width="4" height="12"/>
+        <rect x="7.5" y="6" width="4" height="13"/>
+        <rect x="22.5" y="8" width="4" height="8.5"/>
+        <rect x="37.5" y="4.717" width="4" height="6.283"/>
+        <rect x="45.035" y="7.717" width="4" height="9.283"/>
+        <rect x="52.5" y="9.717" width="4" height="10.283"/>
+        <rect x="60" y="4.717" width="4" height="12.283"/>
+        <rect x="30" y="3.717" width="4" height="9.283"/>
+        <rect x="15" y="10" width="4" height="11.411"/>
+      </g>
+      <g opacity="0.2">
+        <rect width="4" height="11"/>
+        <rect x="7.5" width="4" height="6"/>
+        <rect x="22.5" width="4" height="8"/>
+        <rect x="30" width="4" height="3.717"/>
+        <rect x="37.5" width="4" height="4.717"/>
+        <rect x="45.035" width="4" height="7.717"/>
+        <rect x="52.5" width="4" height="9.717"/>
+        <rect x="60" width="4" height="4.717"/>
+        <rect x="15" width="4" height="10"/>
+      </g>
+    </symbol>
+    <symbol id="widescatter" data-name="widescatter" viewBox="0 0 64 30">
+      <rect width="64" height="30" fill="none"/>
+      <g>
+        <circle cx="4" cy="26" r="1"/>
+        <circle cx="8" cy="23" r="1"/>
+        <circle cx="12" cy="24" r="1"/>
+        <circle cx="16" cy="22" r="1"/>
+        <circle cx="20" cy="18" r="1"/>
+        <circle cx="24" cy="14" r="1"/>
+        <circle cx="28" cy="16" r="1"/>
+        <circle cx="32" cy="11" r="1"/>
+        <circle cx="36" cy="14" r="1"/>
+        <circle cx="40" cy="11" r="1"/>
+        <circle cx="44" cy="13" r="1"/>
+        <circle cx="48" cy="6" r="1"/>
+        <circle cx="52" cy="11" r="1"/>
+        <circle cx="56" cy="4" r="1"/>
+        <circle cx="60" cy="10" r="1"/>
+      </g>
+    </symbol>
+
+  </defs>
+
+  <!--
+  Here is where the logo is drawn.
+  This generates a fallback version of the logo in case javascript can't run,
+  e.g. if SVG is embedded with <img>.
+  -->
+
+  <use id="tl" width="30" height="30" xlink:href="#y" href="#y" x="8" y="8" /> <!-- top left place -->
+  <use id="tr" width="30" height="30" xlink:href="#text1" href="#text1" x="42" y="8" /> <!-- top right place -->
+  <use id="bl" width="30" height="30" xlink:href="#pie" href="#pie" x="8" y="42" /> <!-- bottom left place -->
+  <use id="br" width="30" height="30" xlink:href="#bar" href="#bar" x="42" y="42" /> <!-- bottom right place -->
+
+  <use id="usegrid" width="80" height="80" xlink:href="#grid" href="#grid" x="0" y="0" /> <!-- overlay gridlines -->
+
+  <rect id="refreshbutton" x="0" y="0" width="80" height="80" onclick="rearrange()" /> <!-- a blank rect to act as a button that rearranges the logo -->
+
+  <!-- Embedded javascript that generates random layouts, and handles refreshing -->
+
+  <script type="text/javascript"><![CDATA[
+
+    var svg = document.getElementById('dbclogo');
+
+    // a function to shuffle any array
+
+    function shuffle(array) {
+      var currentIndex = array.length, temporaryValue, randomIndex;
+
+      // While there remain elements to shuffle...
+      while (0 !== currentIndex) {
+
+        // Pick a remaining element...
+        randomIndex = Math.floor(Math.random() * currentIndex);
+        currentIndex -= 1;
+
+        // And swap it with the current element.
+        temporaryValue = array[currentIndex];
+        array[currentIndex] = array[randomIndex];
+        array[randomIndex] = temporaryValue;
+      }
+
+      return array;
+    }
+
+    // a function to remove an element from an array
+
+    function arrayRemove(arr, value) {
+       return arr.filter(function(ele){
+           return ele != value;
+       });
+    }
+
+    // initialise component arrays using the symbol definitions
+
+    var squareGraphs = ["bar","errorbars","line1","line2","linedot","pie","doughnut","area","table","tree","radar","shadedbar","distribution"];
+    var wideGraphs = ["widemap","widebar","wideerrorbars","wideline1","wideline2","wideline3","widelinedot","widescatter","widearea","widetree","widegantt","wideshadedbar"];
+    var tallGraphs = ["tallbar","talllines","talltree"];
+
+    var squareText = ["text1","text2","text3","text4"];
+    var wideText =["widetext1","widetext2","widetext3","widetext4"];
+    var tallText =["talltext1","talltext2"];
+
+    // arrange the symbols into a logo layout
+
+    function arrange() {
+
+    var layout = Math.floor((Math.random() * 10) + 1); // Roll 1d10 to pick layout: 1–4 quad, 5–8 wide, 9–10 tall
+
+    if (layout >= 5 && layout <= 8) {
+
+      // layout 5–8 has 40% chance
+      // wide layout
+
+      if (layout <= 6) {
+
+        // layout 5–6 has 20% chance
+        // wide top layout
+
+        var wideplace = "tl";
+        var clearplace = "tr";
+        var places = ["bl","br"];
+
+      } else {
+
+        // layout 7–8 has 20% chance
+        // wide bottom layout
+
+        var wideplace = "bl";
+        var clearplace = "br";
+        var places = ["tl","tr"];
+
+      }
+
+      document.getElementById(wideplace).setAttribute("width", "64");
+
+      places = shuffle(places);
+
+      var graphortext = Math.floor((Math.random() * 2) + 1); // flip a coin to decide if wide place is a graph or text
+
+      if (graphortext == 1) {
+
+        // wide place has a graph, therefore the remaining square should be either a graph or text
+
+        wideGraphs = shuffle(wideGraphs); // shuffle array
+
+        var squareGraphsText = squareGraphs.concat(squareText);
+        var square = shuffle(squareGraphsText);
+
+        document.getElementById(wideplace).setAttribute("xlink:href", "#"+wideGraphs[0]);
+        document.getElementById(wideplace).setAttribute("href", "#"+wideGraphs[0]);
+
+        // drop equivalent square graph from squareGraphs array
+
+        var squareversion = wideGraphs[0].substring(4);
+        square = arrayRemove(square,squareversion);
+
+      } else {
+
+        // wide place has text, therefore the remaining square should be a graph
+
+        wideText = shuffle(wideText);
+        var square = shuffle(squareGraphs);
+
+        document.getElementById(wideplace).setAttribute("xlink:href", "#"+wideText[0]);
+        document.getElementById(wideplace).setAttribute("href", "#"+wideText[0]);
+
+      }
+
+        document.getElementById(clearplace).setAttribute("xlink:href", "#blank");
+        document.getElementById(clearplace).setAttribute("href", "#blank");
+
+        document.getElementById(places[0]).setAttribute("xlink:href", "#y");
+        document.getElementById(places[0]).setAttribute("href", "#y");
+
+        document.getElementById(places[1]).setAttribute("xlink:href", "#"+square[0]);
+        document.getElementById(places[1]).setAttribute("href", "#"+square[0]);
+
+    } else if (layout >= 9 && layout <= 10) {
+
+      // layout 9–10 has 20% chance
+      //tall layout
+
+      if (layout == 9) {
+
+        // layout 9 has 10% chance
+        // tall left layout
+
+        var tallplace = "tl";
+        var clearplace = "bl";
+        var places = ["tr","br"];
+
+      } else {
+
+        // layout 10 has 10% chance
+        // tall right layout
+
+        var tallplace = "tr";
+        var clearplace = "br";
+        var places = ["tl","bl"];
+
+      }
+
+      document.getElementById(tallplace).setAttribute("height", "64");
+
+      places = shuffle(places);
+
+      var graphortext = Math.floor((Math.random() * 2) + 1); // flip a coin to decide if tall place is a graph or text
+
+      if (graphortext == 1) {
+
+        // tall place has a graph, therefore the remaining square should be either a graph or text
+
+        tallGraphs = shuffle(tallGraphs);
+
+        var squareGraphsText = squareGraphs.concat(squareText);
+        var square = shuffle(squareGraphsText);
+
+        document.getElementById(tallplace).setAttribute("xlink:href", "#"+tallGraphs[0]);
+        document.getElementById(tallplace).setAttribute("href", "#"+tallGraphs[0]);
+
+        // drop equivalent square graph from squareGraphs array
+
+        var squareversion = tallGraphs[0].substring(4);
+        square = arrayRemove(square,squareversion);
+
+      } else {
+
+        // tall place has text, therefore the remaining square should be a graph
+
+        tallText = shuffle(tallText);
+        var square = shuffle(squareGraphs);
+
+        document.getElementById(tallplace).setAttribute("xlink:href", "#"+tallText[0]);
+        document.getElementById(tallplace).setAttribute("href", "#"+tallText[0]);
+
+      }
+
+        document.getElementById(clearplace).setAttribute("xlink:href", "#blank");
+        document.getElementById(clearplace).setAttribute("href", "#blank");
+
+        document.getElementById(places[0]).setAttribute("xlink:href", "#y");
+        document.getElementById(places[0]).setAttribute("href", "#y");
+
+        document.getElementById(places[1]).setAttribute("xlink:href", "#"+square[0]);
+        document.getElementById(places[1]).setAttribute("href", "#"+square[0]);
+
+    } else {
+
+      // quad layout
+
+      var places = ["tl","tr","bl","br"];
+      places = shuffle(places);
+      squareGraphs = shuffle(squareGraphs);
+      squareText = shuffle(squareText);
+
+      document.getElementById(places[0]).setAttribute("xlink:href", "#y");
+      document.getElementById(places[0]).setAttribute("href", "#y");
+
+      document.getElementById(places[1]).setAttribute("xlink:href", "#"+squareText[1]);
+      document.getElementById(places[1]).setAttribute("href", "#"+squareText[1]);
+
+      // In a quad layout, only use pie or doughnut, not both.
+
+      var pieordoughnut = Math.floor((Math.random() * 2) + 1); // flip a coin for pie or doughnut
+
+      if (pieordoughnut == 1) {
+        var filteredSquareGraphs = arrayRemove(squareGraphs,"doughnut"); // filter out doughnut
+      } else {
+        var filteredSquareGraphs = arrayRemove(squareGraphs,"pie"); //filter out pie
+      }
+
+      var i=2;
+
+      while (places[i]) {
+      document.getElementById(places[i]).setAttribute("xlink:href", "#"+filteredSquareGraphs[i-1]);
+      document.getElementById(places[i]).setAttribute("href", "#"+filteredSquareGraphs[i-1]);
+      i++;
+      }
+
+    }
+
+    }
+
+    function clear() {
+
+      // animate out components
+
+      document.getElementById("tl").style = "opacity: 1; animation-timing-function: ease-in; animation-name: fadeOutUp;";
+      document.getElementById("tr").style = "opacity: 1; animation-timing-function: ease-in; animation-name: fadeOutRight;";
+      document.getElementById("br").style = "opacity: 1; animation-timing-function: ease-in; animation-name: fadeOutDown;";
+      document.getElementById("bl").style = "opacity: 1; animation-timing-function: ease-in; animation-name: fadeOutLeft;";
+
+    }
+
+    function restore() {
+
+      // reset animation styles and arrays
+
+      document.getElementById("tl").style = "animation-name: fadeInLeft;";
+      document.getElementById("tr").style = "animation-name: fadeInDown;";
+      document.getElementById("br").style = "animation-name: fadeInRight;";
+      document.getElementById("bl").style = "animation-name: fadeInUp;";
+
+      var places = [];
+      var places = ["tl","tr","bl","br"];
+
+      var i = 0;
+
+      while (places[i]) {
+        document.getElementById(places[i]).setAttribute("width", "30");
+        document.getElementById(places[i]).setAttribute("height", "30");
+        document.getElementById(places[i]).style = "opacity: 0; animation-timing-function: ease-out;";
+        document.getElementById(places[i]).setAttribute("xlink:href", "#blank");
+        document.getElementById(places[i]).setAttribute("href", "#blank");
+        i++;
+      }
+    }
+
+    function rearrange() {
+
+      // animate out components, reset, and arrange new components
+      clear();
+      window.setTimeout(restore,800);
+      window.setTimeout(arrange,800);
+      // arrange ();
+    }
+
+    // rearrange logo three times on load.
+
+    arrange();
+    window.setTimeout(rearrange,1500);
+    window.setTimeout(rearrange,3500);
+
+  ]]>
+  </script>
+
+</svg>