From 154ff107dfab344f6dc6f7ccfddb49c9efde2588 Mon Sep 17 00:00:00 2001
From: Jorge Marcos <jorge.marcosfer@gmail.com>
Date: Tue, 19 Jul 2022 17:29:13 +0200
Subject: [PATCH] add footer

---
 .../views/package-lock.json                   |   5 +
 .../discogs-autotagging/views/package.json    |   1 +
 .../discogs-autotagging/views/src/App.vue     |  15 +-
 .../views/src/assets/styles/globals.scss      |   9 +
 .../views/src/components/DemosFooter.vue      |  80 ++++
 .../views/src/components/EssentiaLogo.vue     |  92 +++++
 .../views/src/components/EssentiajsLogo.vue   |  25 ++
 .../views/src/components/MTGLogo.vue          | 369 ++++++++++++++++++
 8 files changed, 591 insertions(+), 5 deletions(-)
 create mode 100644 examples/demos/discogs-autotagging/views/src/assets/styles/globals.scss
 create mode 100644 examples/demos/discogs-autotagging/views/src/components/DemosFooter.vue
 create mode 100644 examples/demos/discogs-autotagging/views/src/components/EssentiaLogo.vue
 create mode 100644 examples/demos/discogs-autotagging/views/src/components/EssentiajsLogo.vue
 create mode 100644 examples/demos/discogs-autotagging/views/src/components/MTGLogo.vue

diff --git a/examples/demos/discogs-autotagging/views/package-lock.json b/examples/demos/discogs-autotagging/views/package-lock.json
index c07c393..8624dad 100644
--- a/examples/demos/discogs-autotagging/views/package-lock.json
+++ b/examples/demos/discogs-autotagging/views/package-lock.json
@@ -297,6 +297,11 @@
       "integrity": "sha512-jDctJ/IVQbZoJykoeHbhXpOlNBqGNcwXJKJog42E5HDPUwQTSdjCHdihjj0DlnheQ7blbT6dHOafNAiS8ooQKA==",
       "dev": true
     },
+    "bootstrap": {
+      "version": "4.6.1",
+      "resolved": "https://registry.npmjs.org/bootstrap/-/bootstrap-4.6.1.tgz",
+      "integrity": "sha512-0dj+VgI9Ecom+rvvpNZ4MUZJz8dcX7WCX+eTID9+/8HgOkv3dsRzi8BGeZJCQU6flWQVYxwTQnEZFrmJSEO7og=="
+    },
     "braces": {
       "version": "3.0.2",
       "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.2.tgz",
diff --git a/examples/demos/discogs-autotagging/views/package.json b/examples/demos/discogs-autotagging/views/package.json
index 72188d8..4753e2d 100644
--- a/examples/demos/discogs-autotagging/views/package.json
+++ b/examples/demos/discogs-autotagging/views/package.json
@@ -8,6 +8,7 @@
   },
   "dependencies": {
     "@tensorflow/tfjs": "^3.11.0",
+    "bootstrap": "^4.6.1",
     "d3": "^7.1.1",
     "d3-cloud": "^1.2.5",
     "essentia.js": "^0.1.3",
diff --git a/examples/demos/discogs-autotagging/views/src/App.vue b/examples/demos/discogs-autotagging/views/src/App.vue
index 8cc928a..035c3ec 100644
--- a/examples/demos/discogs-autotagging/views/src/App.vue
+++ b/examples/demos/discogs-autotagging/views/src/App.vue
@@ -1,16 +1,20 @@
 <template>
-	<main>
-		<YTStream></YTStream>
-		<PredictionsDisplay></PredictionsDisplay>
-	</main>
+	<div>
+		<main>
+			<YTStream></YTStream>
+			<PredictionsDisplay></PredictionsDisplay>
+		</main>
+		<DemosFooter></DemosFooter>
+	</div>
 </template>
 
 <script>
 import YTStream from './components/YTStream.vue';
 import PredictionsDisplay from './components/PredictionsDisplay.vue';
+import DemosFooter from './components/DemosFooter.vue';
 
 export default {
-    components: { YTStream, PredictionsDisplay }
+    components: { YTStream, PredictionsDisplay, DemosFooter }
 }
 </script>
 
@@ -45,5 +49,6 @@ main {
 body {
 	background-color: rgb(var(--color-bg));
 	color: white;
+	margin: 0;
 }
 </style>
diff --git a/examples/demos/discogs-autotagging/views/src/assets/styles/globals.scss b/examples/demos/discogs-autotagging/views/src/assets/styles/globals.scss
new file mode 100644
index 0000000..6e0ec03
--- /dev/null
+++ b/examples/demos/discogs-autotagging/views/src/assets/styles/globals.scss
@@ -0,0 +1,9 @@
+$primary: #E4454A;
+$dark: rgb(25, 25, 25);
+$carousel-control-color: #000;
+
+@import 'bootstrap/scss/bootstrap.scss';
+
+body {
+    overflow: hidden;
+}
\ No newline at end of file
diff --git a/examples/demos/discogs-autotagging/views/src/components/DemosFooter.vue b/examples/demos/discogs-autotagging/views/src/components/DemosFooter.vue
new file mode 100644
index 0000000..ef17df7
--- /dev/null
+++ b/examples/demos/discogs-autotagging/views/src/components/DemosFooter.vue
@@ -0,0 +1,80 @@
+<template>
+    <footer id="footer-wrapper" class="d-flex justify-content-around text-muted font-weight-light container-fluid">
+        <div id="mtg-logo" class="d-flex align-items-center footer-block">
+            <a id="mtg-link" href="https://www.upf.edu/web/mtg/" target="_blank">
+                <mtg-logo></mtg-logo>
+            </a> 
+        </div>
+        <div id="essentiajs-logo" class="d-flex align-items-center footer-block">
+            <a id="essentiajs-link" href="https://mtg.github.io/essentia.js/" target="_blank">
+                <essentiajs-logo></essentiajs-logo>
+            </a>
+        </div>
+        <div id="essentia-models" class="d-flex flex-column justify-content-center align-items-center footer-block" 
+            @mouseover="essentiaModelsHovered = true" @mouseleave="essentiaModelsHovered = false">
+            <p>Made with</p> 
+            <a href="https://essentia.upf.edu/models.html#discogs-effnet" target="_blank">
+                <essentia-logo :isHovered="essentiaModelsHovered"></essentia-logo>
+            </a>
+            <p :style="essentiaModelsHovered ? {fontWeight: 'bold', color: '#afafaf'} : {}">Models</p>
+        </div>
+    </footer>
+</template>
+
+<script>
+import MtgLogo from './MTGLogo.vue';
+import EssentiajsLogo from './EssentiajsLogo.vue';
+import EssentiaLogo from './EssentiaLogo.vue';
+export default {
+    components: { MtgLogo, EssentiajsLogo, EssentiaLogo },
+    data () {
+        return {
+            essentiaModelsHovered: false
+        }
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+    @import '../assets/styles/globals.scss';
+
+    #footer-wrapper {
+        position: absolute;
+        bottom: 0vh;
+        background-color: $dark;
+        z-index: 10;
+    }
+
+    .footer-block {
+        margin-bottom: 0.5rem;
+    }
+
+    .footer-block p {
+        margin: auto!important;
+    }
+
+    .footer-block a {
+        margin: auto 0;
+    }
+
+    .footer-block img {
+        margin-left: 2rem;
+        border-radius: 5px;
+    }
+
+    #essentiajs-link {
+        height: 2.5rem;
+        margin-left: .5rem;
+    }
+
+    #mtg-link {
+        height: 3.5rem;
+    }
+
+    #essentia-models {
+        margin-top: .5rem;
+        &:hover {
+            cursor: pointer;
+        }
+    }
+</style>
\ No newline at end of file
diff --git a/examples/demos/discogs-autotagging/views/src/components/EssentiaLogo.vue b/examples/demos/discogs-autotagging/views/src/components/EssentiaLogo.vue
new file mode 100644
index 0000000..72b35ed
--- /dev/null
+++ b/examples/demos/discogs-autotagging/views/src/components/EssentiaLogo.vue
@@ -0,0 +1,92 @@
+<template>
+    <!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+    <!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+    <svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+        width="211.202px" height="40.708px" viewBox="0 28 211.202 20.708" enable-background="new 0 0 211.202 74.708"
+        xml:space="preserve">
+        <path :fill="colors.ssentia" d="M94.359,49.474c-0.324,0-0.578-0.092-0.763-0.277c-0.186-0.185-0.277-0.439-0.277-0.764V26.921
+            c0-0.323,0.092-0.577,0.277-0.763c0.185-0.185,0.439-0.278,0.763-0.278h10.004c0.324,0,0.578,0.093,0.764,0.278
+            c0.185,0.186,0.277,0.439,0.277,0.763v1.042c0,0.324-0.093,0.578-0.277,0.763c-0.186,0.186-0.44,0.278-0.764,0.278H94.07
+            c-0.231,0,2.544,0.116,2.544,0.347v6.245c0,0.232-2.775,0.348-2.544,0.348h9.599c0.324,0,0.579,0.093,0.764,0.277
+            c0.186,0.186,0.278,0.439,0.278,0.763v1.041c0,0.324-0.093,0.579-0.278,0.763c-0.185,0.186-0.439,0.277-0.764,0.277H94.07
+            c-0.231,0,2.544,0.117,2.544,0.347v6.592c0,0.232-2.775,0.347-2.544,0.347h10.987c0.324,0,0.578,0.093,0.764,0.278
+            c0.185,0.185,0.277,0.439,0.277,0.763v1.04c0,0.325-0.093,0.579-0.277,0.764c-0.186,0.185-0.44,0.277-0.764,0.277H94.359z"/>
+        <path :fill="colors.ssentia" d="M52.974,45.067c0.231-0.231,0.479-0.335,0.746-0.312c0.266,0.023,0.503,0.127,0.711,0.312
+            c0.185,0.162,0.393,0.342,0.625,0.538c0.23,0.196,0.497,0.376,0.797,0.537c0.3,0.162,0.647,0.295,1.041,0.399
+            c0.394,0.104,0.845,0.156,1.353,0.156c1.11,0,2.024-0.307,2.741-0.92c0.716-0.613,1.075-1.382,1.075-2.307
+            c0-1.042-0.318-1.875-0.954-2.499c-0.637-0.625-1.648-1.272-3.036-1.943c-0.88-0.417-1.672-0.855-2.377-1.318
+            c-0.706-0.462-1.312-0.983-1.821-1.561c-0.509-0.579-0.897-1.232-1.162-1.96c-0.267-0.729-0.399-1.567-0.399-2.516
+            c0-0.786,0.149-1.549,0.451-2.29c0.3-0.74,0.74-1.394,1.318-1.96c0.579-0.567,1.279-1.023,2.099-1.371
+            c0.822-0.347,1.741-0.521,2.759-0.521c1.319,0,2.446,0.255,3.383,0.763c0.937,0.51,1.683,1.042,2.237,1.596
+            c0.486,0.486,0.486,0.972,0,1.458l-0.797,0.833c-0.231,0.231-0.451,0.353-0.659,0.365c-0.208,0.011-0.451-0.11-0.729-0.365
+            c-0.3-0.278-0.764-0.601-1.388-0.972c-0.625-0.37-1.307-0.555-2.047-0.555c-0.509,0-0.978,0.087-1.405,0.26
+            c-0.429,0.173-0.798,0.399-1.111,0.677c-0.312,0.277-0.555,0.596-0.729,0.955c-0.173,0.358-0.26,0.734-0.26,1.127
+            c0,0.509,0.075,0.96,0.226,1.354c0.15,0.394,0.382,0.758,0.694,1.093c0.312,0.336,0.717,0.654,1.214,0.955
+            c0.498,0.3,1.105,0.601,1.822,0.902c0.948,0.417,1.792,0.856,2.533,1.318c0.74,0.463,1.364,0.977,1.873,1.544
+            s0.897,1.214,1.163,1.943s0.398,1.567,0.398,2.516c0,0.879-0.185,1.712-0.555,2.498c-0.37,0.786-0.878,1.475-1.526,2.064
+            c-0.648,0.59-1.406,1.064-2.273,1.423c-0.867,0.357-1.787,0.538-2.758,0.538c-1.573,0-2.805-0.238-3.695-0.711
+            s-1.671-1.081-2.342-1.822c-0.186-0.184-0.29-0.416-0.312-0.694c-0.023-0.277,0.081-0.532,0.312-0.763L52.974,45.067z"/>
+        <path :fill="colors.ssentia" d="M73.038,45.067c0.23-0.231,0.479-0.335,0.745-0.312c0.267,0.023,0.503,0.127,0.711,0.312
+            c0.185,0.162,0.394,0.342,0.625,0.538c0.23,0.196,0.497,0.376,0.797,0.537c0.301,0.162,0.647,0.295,1.041,0.399
+            c0.394,0.104,0.845,0.156,1.354,0.156c1.11,0,2.024-0.307,2.741-0.92c0.717-0.613,1.075-1.382,1.075-2.307
+            c0-1.042-0.318-1.875-0.954-2.499c-0.637-0.625-1.648-1.272-3.036-1.943c-0.88-0.417-1.672-0.855-2.377-1.318
+            c-0.706-0.462-1.313-0.983-1.821-1.561c-0.51-0.579-0.897-1.232-1.163-1.96c-0.266-0.729-0.398-1.567-0.398-2.516
+            c0-0.786,0.149-1.549,0.451-2.29c0.3-0.74,0.74-1.394,1.318-1.96s1.278-1.023,2.1-1.371c0.821-0.347,1.74-0.521,2.759-0.521
+            c1.318,0,2.446,0.255,3.382,0.763c0.937,0.51,1.683,1.042,2.238,1.596c0.486,0.486,0.486,0.972,0,1.458l-0.798,0.833
+            c-0.231,0.231-0.451,0.353-0.66,0.365c-0.208,0.011-0.451-0.11-0.729-0.365c-0.3-0.278-0.764-0.601-1.388-0.972
+            c-0.625-0.37-1.307-0.555-2.046-0.555c-0.51,0-0.978,0.087-1.406,0.26c-0.429,0.173-0.798,0.399-1.11,0.677
+            c-0.312,0.277-0.555,0.596-0.729,0.955c-0.173,0.358-0.261,0.734-0.261,1.127c0,0.509,0.075,0.96,0.226,1.354
+            c0.15,0.394,0.382,0.758,0.694,1.093c0.312,0.336,0.716,0.654,1.214,0.955c0.498,0.3,1.104,0.601,1.822,0.902
+            c0.948,0.417,1.792,0.856,2.533,1.318c0.74,0.463,1.364,0.977,1.874,1.544c0.508,0.567,0.896,1.214,1.162,1.943
+            c0.266,0.729,0.399,1.567,0.399,2.516c0,0.879-0.186,1.712-0.556,2.498c-0.37,0.786-0.879,1.475-1.526,2.064
+            c-0.648,0.59-1.406,1.064-2.273,1.423c-0.867,0.357-1.787,0.538-2.758,0.538c-1.573,0-2.805-0.238-3.696-0.711
+            c-0.89-0.474-1.671-1.081-2.341-1.822c-0.185-0.184-0.29-0.416-0.312-0.694c-0.023-0.277,0.081-0.532,0.312-0.763L73.038,45.067z"/>
+        <path :fill="colors.ssentia" d="M128.044,49.474c-0.324,0-0.584-0.087-0.781-0.261c-0.197-0.173-0.399-0.433-0.607-0.781l-8.812-15.439
+            c-0.116-0.185-0.238-0.254-0.365-0.208s-0.191,0.162-0.191,0.346v15.301c0,0.325-0.092,0.579-0.277,0.764
+            c-0.186,0.185-0.44,0.277-0.763,0.277h-1.215c-0.324,0-0.578-0.092-0.763-0.277c-0.186-0.185-0.277-0.439-0.277-0.764V26.921
+            c0-0.323,0.091-0.577,0.277-0.763c0.185-0.185,0.439-0.278,0.763-0.278h1.353c0.348,0,0.636,0.064,0.868,0.191
+            s0.439,0.353,0.625,0.676l8.431,14.677c0.091,0.138,0.202,0.197,0.33,0.173c0.126-0.022,0.19-0.126,0.19-0.312V26.921
+            c0-0.323,0.092-0.577,0.277-0.763c0.185-0.185,0.439-0.278,0.763-0.278h1.215c0.323,0,0.578,0.093,0.763,0.278
+            c0.185,0.186,0.277,0.439,0.277,0.763v21.511c0,0.325-0.093,0.579-0.277,0.764c-0.186,0.185-0.44,0.277-0.763,0.277H128.044z"/>
+        <polygon :fill="colors.e" points="24.174,50.068 24.174,44.121 27.041,44.121 27.041,47.053 41.542,47.053 41.542,44.121 
+            44.354,44.121 44.354,50.068 "/>
+        <polygon :fill="colors.e" points="33.784,40.589 33.062,38.991 28.987,38.991 28.987,36.201 33.062,36.201 33.784,34.604 
+            35.377,34.604 35.377,40.589 "/>
+        <rect x="24.174" y="36.285" :fill="colors.e" width="2.774" height="2.623"/>
+        <polygon :fill="colors.e" points="41.542,31.239 41.542,28.062 27.041,28.062 27.041,31.239 24.174,31.239 24.174,25.295 
+            44.354,25.295 44.354,31.239 "/>
+        <path :fill="colors.ssentia" d="M144.624,49.543c-0.322,0-0.576-0.092-0.761-0.277c-0.185-0.185-0.277-0.438-0.277-0.763V29.45
+            c0-0.23-0.116-0.347-0.346-0.347h-5.196c-0.325,0-0.578-0.092-0.762-0.277c-0.185-0.185-0.277-0.438-0.277-0.762v-1.04
+            c0-0.323,0.092-0.577,0.277-0.762c0.184-0.185,0.438-0.277,0.762-0.277h14.377c0.323,0,0.577,0.092,0.762,0.277
+            c0.185,0.186,0.277,0.439,0.277,0.762v1.04c0,0.323-0.093,0.577-0.277,0.762c-0.185,0.186-0.439,0.277-0.762,0.277h-5.196
+            c-0.231,0-0.347,0.116-0.347,0.347v19.053c0,0.324-0.092,0.578-0.276,0.763c-0.186,0.185-0.44,0.277-0.762,0.277H144.624z"/>
+        <path :fill="colors.ssentia" d="M161.084,49.42c-0.323,0-0.577-0.092-0.762-0.277c-0.186-0.185-0.277-0.438-0.277-0.763V26.902
+            c0-0.323,0.092-0.577,0.277-0.762c0.185-0.185,0.438-0.277,0.762-0.277h1.213c0.323,0,0.577,0.092,0.762,0.277
+            c0.185,0.185,0.277,0.439,0.277,0.762V48.38c0,0.325-0.093,0.578-0.277,0.763c-0.185,0.185-0.439,0.277-0.762,0.277H161.084z"/>
+        <path :fill="colors.ssentia" d="M186.95,49.42c-0.23,0.185-0.49,0.265-0.78,0.242c-0.288-0.023-0.56-0.104-0.814-0.242l-10.081-5.89
+            c-0.163-0.092-0.307-0.092-0.433,0c-0.127,0.092-0.214,0.208-0.26,0.347l-1.42,4.711c-0.162,0.555-0.554,0.832-1.178,0.832h-1.698
+            c-0.67,0-0.913-0.323-0.728-0.97l6.928-21.652c0.116-0.369,0.272-0.618,0.468-0.745c0.196-0.126,0.455-0.19,0.779-0.19h2.425
+            c0.323,0,0.583,0.063,0.779,0.19c0.196,0.127,0.352,0.376,0.468,0.745l6.617,20.716c0.161,0.532,0.069,0.947-0.278,1.247
+            L186.95,49.42z M179.295,30.263c-0.069-0.254-0.186-0.381-0.347-0.381c-0.163,0-0.277,0.127-0.346,0.381l-2.737,9.146
+            c-0.093,0.3-0.104,0.526-0.036,0.676c0.07,0.15,0.185,0.271,0.347,0.364l6.513,3.811c0.254,0.162,0.439,0.18,0.554,0.052
+            c0.116-0.127,0.15-0.271,0.104-0.433L179.295,30.263z"/>
+    </svg>
+</template>
+
+<script>
+export default {
+    props: ['isHovered'],
+    computed: {
+        colors () {
+            return {
+                e: this.isHovered ? "#E4454A" : "#757575",
+                ssentia: this.isHovered ? "#afafaf" : "#757575"
+            }
+        }
+    }
+}
+</script>
+
+<style scoped>
+
+</style>
\ No newline at end of file
diff --git a/examples/demos/discogs-autotagging/views/src/components/EssentiajsLogo.vue b/examples/demos/discogs-autotagging/views/src/components/EssentiajsLogo.vue
new file mode 100644
index 0000000..16694bf
--- /dev/null
+++ b/examples/demos/discogs-autotagging/views/src/components/EssentiajsLogo.vue
@@ -0,0 +1,25 @@
+<template>
+    <svg width="230" height="50" viewBox="0 0 310 50" fill="none" xmlns="http://www.w3.org/2000/svg" @mouseover="isHovered = true" @mouseleave="isHovered = false">
+        <path :fill="isHovered ? '#afafaf' : colors.main" d="M25.8479 28.0014C25.8479 36.9629 31.4122 42.6443 41.135 42.6443C44.9422 42.6443 48.5736 42 51.5022 40.8286L50.3308 34.7371C47.8708 35.5571 45.4693 35.9671 42.4236 35.9671C38.265 35.9671 34.6336 34.21 34.3408 30.52H52.7908C52.9079 29.8757 53.1422 28.5871 53.1422 27.0057C53.1422 19.9186 49.5693 12.7143 40.315 12.7143C30.3579 12.7143 25.8479 20.7386 25.8479 28.0014ZM34.2822 24.4286C34.5165 22.0857 36.0393 18.63 39.7879 18.63C43.8293 18.63 44.825 22.32 44.825 24.4286H34.2822ZM56.7581 40.5943C58.8666 41.7657 62.2638 42.6443 66.0123 42.6443C74.2123 42.6443 78.4295 38.6614 78.4295 33.3314C78.3709 29.1143 76.0866 26.3614 70.6395 24.4871C67.1252 23.2571 66.0123 22.5543 66.0123 21.2071C66.0123 19.8014 67.2423 18.8643 69.4095 18.8643C71.8695 18.8643 74.3295 19.86 75.6181 20.5043L77.1995 14.3543C75.4423 13.4757 72.4552 12.7143 69.1166 12.7143C61.9709 12.7143 57.4609 16.6971 57.4609 22.0857C57.4609 25.4829 59.6866 28.7043 65.6609 30.6957C68.8823 31.8086 69.8195 32.5114 69.8195 33.9757C69.8195 35.4986 68.6481 36.3771 65.9538 36.3771C63.3766 36.3771 59.9795 35.2057 58.3395 34.21L56.7581 40.5943ZM82.2229 40.5943C84.3315 41.7657 87.7286 42.6443 91.4772 42.6443C99.6772 42.6443 103.894 38.6614 103.894 33.3314C103.836 29.1143 101.551 26.3614 96.1043 24.4871C92.59 23.2571 91.4772 22.5543 91.4772 21.2071C91.4772 19.8014 92.7072 18.8643 94.8743 18.8643C97.3343 18.8643 99.7943 19.86 101.083 20.5043L102.664 14.3543C100.907 13.4757 97.92 12.7143 94.5815 12.7143C87.4358 12.7143 82.9258 16.6971 82.9258 22.0857C82.9258 25.4829 85.1515 28.7043 91.1258 30.6957C94.3472 31.8086 95.2843 32.5114 95.2843 33.9757C95.2843 35.4986 94.1129 36.3771 91.4186 36.3771C88.8415 36.3771 85.4443 35.2057 83.8043 34.21L82.2229 40.5943ZM107.688 28.0014C107.688 36.9629 113.252 42.6443 122.975 42.6443C126.782 42.6443 130.413 42 133.342 40.8286L132.171 34.7371C129.711 35.5571 127.309 35.9671 124.263 35.9671C120.105 35.9671 116.473 34.21 116.181 30.52H134.631C134.748 29.8757 134.982 28.5871 134.982 27.0057C134.982 19.9186 131.409 12.7143 122.155 12.7143C112.198 12.7143 107.688 20.7386 107.688 28.0014ZM116.122 24.4286C116.356 22.0857 117.879 18.63 121.628 18.63C125.669 18.63 126.665 22.32 126.665 24.4286H116.122ZM140.179 42H149.141V25.4829C149.141 24.6629 149.258 23.7843 149.492 23.2571C150.078 21.6171 151.542 19.9186 154.002 19.9186C157.165 19.9186 158.512 22.4371 158.512 26.1271V42H167.415V25.0143C167.415 16.58 163.022 12.7143 157.165 12.7143C152.362 12.7143 149.492 15.4671 148.321 17.3414H148.145L147.735 13.3586H139.945C140.062 15.9357 140.179 18.9229 140.179 22.4957V42ZM177.903 40.1257C179.367 41.6486 181.768 42.6443 184.697 42.6443C187.157 42.6443 189.265 42.2343 190.437 41.8243L190.378 35.03C189.734 35.2057 188.855 35.3229 187.684 35.3229C185.048 35.3229 184.228 33.7414 184.228 30.2857V19.9186H190.613V13.3586H184.228V5.15857L175.501 7.20857V13.3586H171.635V19.9186H175.501V31.6329C175.501 35.7329 176.263 38.4271 177.903 40.1257ZM195.673 42H204.635V13.3586H195.673V42ZM200.066 9.84429C203.053 9.84429 204.928 7.85286 204.869 5.39286C204.869 2.81571 203.053 0.882859 200.183 0.882859C197.372 0.882859 195.498 2.81571 195.498 5.39286C195.498 7.85286 197.255 9.84429 200.066 9.84429ZM209.873 33.9171C209.873 38.4857 213.329 42.6443 219.128 42.6443C222.525 42.6443 225.453 41.4143 227.328 39.1886H227.503L228.031 42H236.055C235.762 40.36 235.586 37.7829 235.586 35.03V25.0729C235.586 18.3371 232.599 12.7143 223.052 12.7143C217.839 12.7143 213.915 14.12 211.923 15.2914L213.563 20.9729C215.496 19.86 218.483 18.8057 221.412 18.8057C225.863 18.8057 226.683 20.9729 226.683 22.4957V22.9057C216.551 22.9057 209.873 26.42 209.873 33.9171ZM218.659 32.98C218.659 29.5829 222.232 28.47 226.976 28.4114V31.6329C226.976 32.1014 226.976 32.6871 226.801 33.0971C226.215 34.9129 224.399 36.3771 222.232 36.3771C220.182 36.3771 218.659 35.2643 218.659 32.98Z"/>
+        <path :fill="isHovered ? colors.red : colors.main " d="M241.321 37.2557C241.321 40.4186 243.488 42.6443 246.534 42.6443C249.697 42.6443 251.805 40.4186 251.805 37.2557C251.805 33.9757 249.638 31.8086 246.593 31.8086C243.488 31.8086 241.321 34.0343 241.321 37.2557Z"/>
+        <path :fill="isHovered ? colors.red : colors.main " d="M257.016 41.7071C258.831 42.2929 261.526 42.6443 263.576 42.6443C272.244 42.6443 277.633 38.6614 277.633 27.5329V2.52286H268.73V27.3571C268.73 33.5071 266.329 35.2057 262.639 35.2057C260.881 35.2057 259.241 34.9129 258.011 34.5029L257.016 41.7071ZM283.579 40.1843C285.805 41.4143 290.256 42.6443 294.766 42.6443C305.661 42.6443 310.639 36.9629 310.639 30.3443C310.639 24.78 307.418 21.1486 300.448 18.5714C295.352 16.6386 293.126 15.4671 293.126 13.0071C293.126 11.0157 295.001 9.2 298.866 9.2C302.732 9.2 305.543 10.3714 307.125 11.0743L309.058 3.87C306.773 2.81571 303.552 1.93714 298.983 1.93714C289.729 1.93714 284.048 7.03286 284.048 13.7686C284.048 19.5671 288.382 23.0814 295.001 25.4829C299.686 27.1229 301.561 28.5871 301.561 30.9886C301.561 33.5657 299.393 35.2643 295.293 35.2643C291.486 35.2643 287.738 34.0343 285.395 32.8043L283.579 40.1843Z"/>
+    </svg>
+</template>
+
+<script>
+export default {
+    data () {
+        return {
+            colors: {
+                red: "#E4454A",
+                main: "#757575"
+            },
+            isHovered: false
+        }
+    }
+}
+</script>
+
+<style scoped>
+
+</style>
\ No newline at end of file
diff --git a/examples/demos/discogs-autotagging/views/src/components/MTGLogo.vue b/examples/demos/discogs-autotagging/views/src/components/MTGLogo.vue
new file mode 100644
index 0000000..2bb80bf
--- /dev/null
+++ b/examples/demos/discogs-autotagging/views/src/components/MTGLogo.vue
@@ -0,0 +1,369 @@
+<template>
+    <!-- taken from MTG_CMYK_logo-06.svg -->
+    <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+        width="302.265px" height="76.16px" viewBox="0 0 302.265 76.16" enable-background="new 0 0 302.265 76.16" xml:space="preserve" class="mtg-logo-text"
+        @mouseover="isHovered = true" @mouseleave="isHovered = false">
+    <rect y="-11.241" fill="none" width="302.265" height="87.401" />
+    <g>
+        <path :fill="colors.text" d="M188.827,23.48v-4.433l-1.343,2.286h-1.488l-1.342-2.286v4.433h-2.327v-9.256h2.286l2.126,4.08l2.127-4.08
+            h2.286v9.256H188.827z"/>
+        <path :fill="colors.text" d="M196.83,16.253v7.228h-2.327v-7.228h-2.326v-2.028h6.978v2.028H196.83z"/>
+        <path :fill="colors.text" d="M206.196,22.491c-0.706,0.704-1.556,1.067-2.687,1.067c-1.104,0-1.94-0.363-2.631-1.04
+            c-0.997-0.977-0.957-2.276-0.957-3.667c0-1.394-0.04-2.693,0.957-3.667c0.69-0.675,1.489-1.039,2.631-1.039
+            c1.356,0,2.074,0.311,2.924,1.143l-1.582,1.547c-0.451-0.44-0.745-0.661-1.343-0.661c-0.424,0-0.744,0.181-0.916,0.403
+            c-0.214,0.271-0.346,0.584-0.346,2.274c0,1.689,0.132,2.015,0.346,2.288c0.172,0.222,0.492,0.391,0.916,0.391
+            c0.492,0,0.744-0.146,0.958-0.363c0.251-0.248,0.345-0.704,0.345-1.016v-0.104h-1.304v-1.898h3.616v1.247
+            C207.125,20.894,206.912,21.776,206.196,22.491z"/>
+        <path :fill="colors.text" d="M189.354,38.857v-7.038l-2.591,5.582h-0.864l-2.631-5.582v7.038h-1.01v-9.261h1.01l3.084,6.567l3.002-6.567
+            h1.01v9.261H189.354z"/>
+        <path :fill="colors.text" d="M196.649,38.857v-0.716c-0.229,0.26-0.5,0.456-0.815,0.594c-0.312,0.132-0.655,0.201-1.026,0.201
+            c-0.715,0-1.276-0.199-1.682-0.599c-0.229-0.226-0.397-0.487-0.502-0.789c-0.107-0.297-0.159-0.633-0.159-1.007v-4.083h0.956V36.4
+            c0,0.57,0.142,0.999,0.424,1.28c0.283,0.281,0.67,0.422,1.165,0.422s0.888-0.145,1.184-0.43c0.297-0.285,0.444-0.71,0.444-1.272
+            v-3.941h0.969v6.398H196.649z"/>
+        <path :fill="colors.text" d="M204.22,37.811c-0.129,0.238-0.311,0.443-0.546,0.612c-0.234,0.167-0.514,0.295-0.836,0.382
+            c-0.324,0.088-0.685,0.132-1.083,0.132c-0.558,0-1.056-0.071-1.489-0.209c-0.434-0.14-0.833-0.378-1.195-0.716l0.637-0.624
+            c0.258,0.27,0.558,0.461,0.903,0.57c0.346,0.114,0.723,0.172,1.13,0.172c0.541,0,0.967-0.095,1.276-0.279
+            c0.31-0.188,0.465-0.473,0.465-0.853c0-0.277-0.086-0.495-0.259-0.65c-0.173-0.158-0.45-0.252-0.83-0.288l-1.076-0.09
+            c-0.639-0.052-1.123-0.219-1.457-0.5c-0.332-0.281-0.498-0.687-0.498-1.217c0-0.295,0.06-0.557,0.179-0.787
+            c0.121-0.229,0.286-0.425,0.499-0.586c0.213-0.159,0.467-0.283,0.765-0.37c0.296-0.086,0.617-0.13,0.963-0.13
+            c0.47,0,0.906,0.056,1.309,0.17c0.403,0.111,0.75,0.285,1.042,0.519l-0.625,0.612c-0.23-0.173-0.493-0.301-0.789-0.384
+            c-0.299-0.081-0.615-0.122-0.951-0.122c-0.479,0-0.841,0.093-1.09,0.277c-0.248,0.188-0.373,0.447-0.373,0.775
+            c0,0.278,0.086,0.493,0.26,0.65c0.173,0.155,0.467,0.25,0.884,0.285l1.049,0.09c0.283,0.028,0.545,0.075,0.783,0.145
+            c0.24,0.07,0.443,0.173,0.612,0.312c0.168,0.138,0.299,0.311,0.393,0.52c0.092,0.21,0.14,0.46,0.14,0.755
+            C204.413,37.298,204.347,37.573,204.22,37.811z"/>
+        <path :fill="colors.text" d="M205.876,30.638v-1.055h1.077v1.055H205.876z M205.929,38.857v-6.398h0.957v6.398H205.929z"/>
+        <path :fill="colors.text" d="M212.631,38.728c-0.324,0.138-0.712,0.209-1.163,0.209c-0.417,0-0.8-0.069-1.149-0.201
+            c-0.35-0.138-0.657-0.34-0.918-0.613c-0.262-0.271-0.465-0.616-0.611-1.027c-0.146-0.411-0.219-0.891-0.219-1.438
+            c0-0.545,0.073-1.021,0.219-1.429c0.146-0.407,0.349-0.75,0.611-1.023c0.261-0.271,0.568-0.478,0.918-0.615
+            c0.349-0.138,0.731-0.209,1.149-0.209c0.45,0,0.839,0.071,1.163,0.209c0.323,0.138,0.652,0.386,0.989,0.739l-0.651,0.599
+            c-0.248-0.268-0.482-0.455-0.705-0.559c-0.221-0.103-0.488-0.158-0.796-0.158c-0.32,0-0.608,0.063-0.864,0.186
+            c-0.257,0.12-0.475,0.303-0.652,0.547c-0.15,0.206-0.259,0.444-0.324,0.707c-0.066,0.266-0.1,0.6-0.1,1.007s0.034,0.746,0.1,1.01
+            c0.065,0.264,0.174,0.502,0.324,0.708c0.177,0.244,0.396,0.425,0.652,0.545c0.256,0.124,0.544,0.184,0.864,0.184
+            c0.309,0,0.575-0.054,0.796-0.162c0.223-0.109,0.457-0.297,0.705-0.566l0.651,0.612C213.283,38.342,212.954,38.588,212.631,38.728z
+            "/>
+        <path :fill="colors.text" d="M221.168,30.479v8.378h-1.01v-8.378h-2.738v-0.883h6.485v0.883H221.168z"/>
+        <path :fill="colors.text" d="M224.808,35.904c0,0.698,0.164,1.239,0.492,1.623c0.328,0.384,0.805,0.575,1.435,0.575
+            c0.38,0,0.697-0.058,0.95-0.174c0.253-0.118,0.507-0.303,0.763-0.555l0.652,0.561c-0.168,0.163-0.335,0.312-0.498,0.433
+            c-0.164,0.124-0.339,0.227-0.525,0.312c-0.186,0.082-0.392,0.147-0.619,0.192c-0.226,0.041-0.476,0.065-0.75,0.065
+            c-0.434,0-0.826-0.065-1.175-0.195c-0.35-0.13-0.649-0.33-0.897-0.6c-0.248-0.27-0.441-0.608-0.579-1.02
+            c-0.137-0.413-0.206-0.9-0.206-1.466c0-1.04,0.24-1.846,0.717-2.418c0.479-0.573,1.135-0.858,1.966-0.858
+            c0.851,0,1.51,0.277,1.981,0.83c0.469,0.558,0.703,1.312,0.703,2.266v0.429H224.808z M228.236,34.866
+            c-0.009-0.099-0.021-0.184-0.033-0.262c-0.014-0.079-0.031-0.155-0.054-0.229c-0.022-0.07-0.051-0.151-0.086-0.24
+            c-0.123-0.295-0.323-0.529-0.597-0.702c-0.275-0.171-0.585-0.258-0.931-0.258c-0.345,0-0.655,0.087-0.93,0.258
+            c-0.274,0.173-0.473,0.407-0.598,0.702c-0.071,0.176-0.12,0.332-0.146,0.47c-0.025,0.14-0.043,0.336-0.052,0.598h3.455
+            C228.254,35.072,228.244,34.96,228.236,34.866z"/>
+        <path :fill="colors.text" d="M234.687,38.728c-0.323,0.138-0.709,0.209-1.162,0.209c-0.417,0-0.8-0.069-1.151-0.201
+            c-0.349-0.138-0.655-0.34-0.915-0.613c-0.263-0.271-0.466-0.616-0.612-1.027c-0.146-0.411-0.219-0.891-0.219-1.438
+            c0-0.545,0.073-1.021,0.219-1.429c0.146-0.407,0.349-0.75,0.612-1.023c0.26-0.271,0.566-0.478,0.915-0.615
+            c0.351-0.138,0.734-0.209,1.151-0.209c0.452,0,0.839,0.071,1.162,0.209c0.324,0.138,0.654,0.386,0.99,0.739l-0.651,0.599
+            c-0.249-0.268-0.483-0.455-0.704-0.559c-0.222-0.103-0.487-0.158-0.797-0.158c-0.319,0-0.607,0.063-0.865,0.186
+            c-0.257,0.12-0.473,0.303-0.65,0.547c-0.15,0.206-0.258,0.444-0.326,0.707c-0.066,0.266-0.099,0.6-0.099,1.007
+            s0.033,0.746,0.099,1.01c0.067,0.264,0.175,0.502,0.326,0.708c0.177,0.244,0.394,0.425,0.65,0.545
+            c0.258,0.124,0.546,0.184,0.865,0.184c0.311,0,0.575-0.054,0.797-0.162c0.221-0.109,0.455-0.297,0.704-0.566l0.651,0.612
+            C235.341,38.342,235.011,38.588,234.687,38.728z"/>
+        <path :fill="colors.text" d="M241.354,38.857v-3.956c0-0.56-0.142-0.984-0.426-1.266c-0.284-0.281-0.673-0.426-1.168-0.426
+            c-0.497,0-0.893,0.146-1.19,0.432c-0.297,0.285-0.445,0.708-0.445,1.26v3.956h-0.957v-9.261h0.957v3.562
+            c0.468-0.52,1.081-0.779,1.833-0.779c0.744,0,1.322,0.213,1.734,0.638s0.619,1.001,0.619,1.73v4.109H241.354z"/>
+        <path :fill="colors.text" d="M248.469,38.857v-3.94c0-0.571-0.144-1-0.432-1.281c-0.289-0.281-0.68-0.426-1.176-0.426
+            s-0.891,0.146-1.183,0.432c-0.292,0.285-0.438,0.712-0.438,1.275v3.94h-0.957v-6.398h0.957v0.7c0.23-0.258,0.5-0.454,0.811-0.584
+            c0.309-0.132,0.651-0.195,1.022-0.195c0.709,0,1.267,0.199,1.674,0.599c0.454,0.435,0.678,1.026,0.678,1.781v4.098H248.469z"/>
+        <path :fill="colors.text" d="M256.275,37.056c-0.102,0.438-0.317,0.82-0.645,1.152c-0.23,0.225-0.5,0.403-0.811,0.533
+            c-0.311,0.13-0.664,0.195-1.063,0.195c-0.398,0-0.753-0.065-1.062-0.195c-0.31-0.13-0.58-0.309-0.811-0.533
+            c-0.169-0.165-0.304-0.346-0.405-0.541c-0.102-0.196-0.183-0.399-0.24-0.611c-0.058-0.211-0.097-0.435-0.119-0.671
+            c-0.023-0.232-0.034-0.475-0.034-0.729c0-0.241,0.011-0.483,0.034-0.722c0.022-0.238,0.061-0.462,0.119-0.676
+            c0.057-0.212,0.138-0.417,0.24-0.611c0.102-0.195,0.236-0.374,0.405-0.539c0.23-0.227,0.501-0.403,0.811-0.533
+            c0.309-0.132,0.664-0.195,1.062-0.195c0.399,0,0.752,0.063,1.063,0.195c0.311,0.13,0.581,0.307,0.811,0.533
+            c0.328,0.328,0.543,0.714,0.645,1.15c0.102,0.438,0.152,0.904,0.152,1.397C256.427,36.152,256.377,36.619,256.275,37.056z
+            M255.458,35.111c-0.008-0.183-0.031-0.359-0.066-0.534c-0.036-0.173-0.089-0.336-0.16-0.487c-0.07-0.149-0.164-0.287-0.279-0.409
+            c-0.318-0.312-0.717-0.471-1.196-0.471c-0.469,0-0.865,0.158-1.184,0.471c-0.123,0.122-0.217,0.26-0.284,0.409
+            c-0.067,0.151-0.121,0.314-0.159,0.487c-0.041,0.175-0.064,0.352-0.074,0.534c-0.009,0.182-0.013,0.364-0.013,0.545
+            c0,0.184,0.004,0.364,0.013,0.548c0.01,0.181,0.033,0.359,0.074,0.532c0.038,0.174,0.092,0.339,0.159,0.494
+            c0.067,0.157,0.161,0.293,0.284,0.403c0.319,0.312,0.714,0.469,1.184,0.469c0.479,0,0.877-0.156,1.196-0.469
+            c0.115-0.11,0.208-0.246,0.279-0.403c0.071-0.155,0.125-0.32,0.16-0.494c0.035-0.173,0.058-0.352,0.066-0.532
+            c0.009-0.184,0.014-0.364,0.014-0.548C255.471,35.476,255.466,35.293,255.458,35.111z"/>
+        <path :fill="colors.text" d="M259.769,38.857c-0.575,0-0.995-0.161-1.261-0.488c-0.267-0.324-0.398-0.729-0.398-1.218v-7.555h0.957
+            v7.518c0,0.311,0.061,0.547,0.185,0.702c0.124,0.158,0.353,0.234,0.69,0.234h0.518v0.807H259.769z"/>
+        <path :fill="colors.text" d="M266.629,37.056c-0.1,0.438-0.316,0.82-0.644,1.152c-0.23,0.225-0.5,0.403-0.811,0.533
+            c-0.31,0.13-0.664,0.195-1.062,0.195s-0.753-0.065-1.063-0.195c-0.31-0.13-0.58-0.309-0.811-0.533
+            c-0.168-0.165-0.303-0.346-0.405-0.541c-0.102-0.196-0.182-0.399-0.239-0.611c-0.058-0.211-0.097-0.435-0.12-0.671
+            c-0.022-0.232-0.032-0.475-0.032-0.729c0-0.241,0.01-0.483,0.032-0.722c0.023-0.238,0.062-0.462,0.12-0.676
+            c0.057-0.212,0.138-0.417,0.239-0.611c0.102-0.195,0.237-0.374,0.405-0.539c0.231-0.227,0.5-0.403,0.811-0.533
+            c0.31-0.132,0.665-0.195,1.063-0.195s0.752,0.063,1.062,0.195c0.311,0.13,0.58,0.307,0.811,0.533
+            c0.328,0.328,0.544,0.714,0.644,1.15c0.104,0.438,0.154,0.904,0.154,1.397C266.783,36.152,266.733,36.619,266.629,37.056z
+            M265.813,35.111c-0.009-0.183-0.03-0.359-0.066-0.534c-0.036-0.173-0.088-0.336-0.16-0.487c-0.07-0.149-0.164-0.287-0.278-0.409
+            c-0.32-0.312-0.717-0.471-1.196-0.471c-0.47,0-0.864,0.158-1.183,0.471c-0.123,0.122-0.218,0.26-0.285,0.409
+            c-0.067,0.151-0.12,0.314-0.16,0.487c-0.04,0.175-0.064,0.352-0.073,0.534c-0.009,0.182-0.014,0.364-0.014,0.545
+            c0,0.184,0.005,0.364,0.014,0.548c0.009,0.181,0.033,0.359,0.073,0.532c0.04,0.174,0.093,0.339,0.16,0.494
+            c0.067,0.157,0.162,0.293,0.285,0.403c0.319,0.312,0.713,0.469,1.183,0.469c0.479,0,0.876-0.156,1.196-0.469
+            c0.114-0.11,0.208-0.246,0.278-0.403c0.072-0.155,0.124-0.32,0.16-0.494c0.036-0.173,0.057-0.352,0.066-0.532
+            c0.008-0.184,0.013-0.364,0.013-0.548C265.826,35.476,265.821,35.293,265.813,35.111z"/>
+        <path :fill="colors.text" d="M273.201,40.152c-0.125,0.332-0.301,0.621-0.532,0.863c-0.23,0.244-0.516,0.435-0.856,0.574
+            c-0.341,0.138-0.725,0.207-1.149,0.207c-0.249,0-0.471-0.016-0.664-0.048c-0.196-0.029-0.379-0.078-0.552-0.151
+            c-0.173-0.068-0.341-0.159-0.505-0.27c-0.164-0.11-0.33-0.244-0.498-0.403l0.624-0.598c0.116,0.104,0.229,0.194,0.338,0.273
+            c0.111,0.078,0.227,0.146,0.346,0.2c0.119,0.058,0.251,0.099,0.393,0.124c0.141,0.027,0.305,0.04,0.492,0.04
+            c0.319,0,0.59-0.052,0.816-0.154c0.227-0.104,0.412-0.241,0.558-0.415c0.146-0.169,0.252-0.375,0.318-0.609
+            c0.067-0.236,0.102-0.494,0.102-0.768v-0.993c-0.267,0.324-0.55,0.543-0.852,0.653c-0.3,0.11-0.628,0.165-0.983,0.165
+            c-0.335,0-0.64-0.051-0.909-0.153c-0.271-0.106-0.494-0.244-0.671-0.419c-0.329-0.321-0.543-0.717-0.644-1.183
+            c-0.102-0.468-0.153-0.962-0.153-1.483c0-0.52,0.051-1.013,0.153-1.482c0.101-0.47,0.315-0.861,0.644-1.185
+            c0.177-0.173,0.402-0.309,0.677-0.409c0.274-0.1,0.581-0.149,0.918-0.149c0.362,0,0.692,0.054,0.99,0.164
+            c0.296,0.107,0.578,0.33,0.843,0.666v-0.751h0.944v6.595C273.387,39.449,273.325,39.819,273.201,40.152z M272.377,34.732
+            c-0.034-0.291-0.111-0.548-0.226-0.771c-0.115-0.223-0.278-0.401-0.492-0.541c-0.212-0.14-0.496-0.211-0.849-0.211
+            c-0.355,0-0.641,0.071-0.859,0.211c-0.216,0.14-0.381,0.318-0.498,0.541c-0.114,0.223-0.191,0.479-0.226,0.771
+            c-0.035,0.291-0.053,0.584-0.053,0.879c0,0.305,0.019,0.603,0.053,0.888c0.035,0.287,0.112,0.541,0.226,0.763
+            c0.116,0.223,0.281,0.403,0.498,0.541c0.218,0.14,0.504,0.209,0.859,0.209c0.353,0,0.637-0.069,0.849-0.209
+            c0.213-0.138,0.376-0.318,0.492-0.541c0.115-0.222,0.192-0.476,0.226-0.763c0.036-0.285,0.054-0.583,0.054-0.888
+            C272.431,35.316,272.413,35.023,272.377,34.732z"/>
+        <path :fill="colors.text" d="M277.303,40.405c-0.124,0.339-0.28,0.591-0.466,0.754c-0.177,0.165-0.376,0.281-0.596,0.347
+            c-0.222,0.062-0.449,0.096-0.679,0.096h-0.412V40.77h0.292c0.328,0,0.563-0.059,0.705-0.175c0.142-0.118,0.266-0.323,0.372-0.618
+            l0.465-1.249l-2.352-6.269h1.037l1.794,5.136l1.78-5.136h1.036L277.303,40.405z"/>
+        <path :fill="colors.text" d="M188.697,50.405c-0.125,0.376-0.333,0.716-0.625,1.02c-0.337,0.355-0.72,0.623-1.15,0.801
+            c-0.43,0.179-0.889,0.268-1.375,0.268c-0.47,0-0.911-0.083-1.322-0.248c-0.412-0.164-0.777-0.403-1.096-0.717
+            c-0.222-0.216-0.393-0.44-0.512-0.677c-0.119-0.233-0.208-0.495-0.266-0.786c-0.058-0.289-0.091-0.62-0.1-0.988
+            c-0.01-0.367-0.014-0.801-0.014-1.294c0-0.496,0.004-0.925,0.014-1.293c0.009-0.371,0.042-0.7,0.1-0.989
+            c0.058-0.291,0.146-0.555,0.266-0.789c0.12-0.232,0.29-0.458,0.512-0.675c0.655-0.642,1.462-0.962,2.418-0.962
+            c0.451,0,0.866,0.065,1.242,0.201c0.377,0.134,0.707,0.326,0.991,0.572c0.283,0.246,0.515,0.539,0.697,0.879
+            c0.181,0.337,0.308,0.709,0.379,1.118h-1.01c-0.133-0.591-0.401-1.053-0.805-1.386c-0.403-0.334-0.901-0.501-1.494-0.501
+            c-0.31,0-0.609,0.059-0.897,0.175c-0.289,0.118-0.533,0.281-0.738,0.488c-0.15,0.147-0.27,0.307-0.358,0.476
+            c-0.088,0.167-0.155,0.37-0.199,0.604c-0.045,0.234-0.075,0.52-0.086,0.853c-0.015,0.332-0.021,0.745-0.021,1.229
+            c0,0.485,0.006,0.895,0.021,1.229c0.012,0.334,0.042,0.619,0.086,0.859c0.043,0.238,0.11,0.442,0.199,0.61
+            c0.089,0.169,0.208,0.328,0.358,0.476c0.205,0.207,0.449,0.368,0.738,0.48c0.288,0.112,0.587,0.169,0.897,0.169
+            c0.345,0,0.676-0.067,0.99-0.2c0.314-0.137,0.583-0.335,0.804-0.593c0.194-0.227,0.332-0.472,0.412-0.735
+            c0.079-0.266,0.119-0.581,0.119-0.944v-0.7h-2.325v-0.874h3.335v1.472C188.883,49.569,188.821,50.025,188.697,50.405z"/>
+        <path :fill="colors.text" d="M194.382,47.236c-0.178-0.173-0.345-0.293-0.504-0.364c-0.161-0.068-0.369-0.104-0.626-0.104
+            c-0.239,0-0.455,0.046-0.65,0.132c-0.195,0.087-0.359,0.207-0.492,0.364c-0.134,0.155-0.237,0.336-0.312,0.545
+            c-0.075,0.211-0.113,0.435-0.113,0.677v3.929h-0.956v-6.399h0.956v0.779c0.177-0.268,0.432-0.479,0.764-0.632
+            c0.333-0.149,0.689-0.227,1.07-0.227c0.309,0,0.591,0.044,0.844,0.13c0.251,0.087,0.494,0.244,0.724,0.471L194.382,47.236z"/>
+        <path :fill="colors.text" d="M200.963,50.612c-0.102,0.438-0.317,0.82-0.646,1.152c-0.23,0.225-0.5,0.403-0.811,0.533
+            c-0.309,0.128-0.664,0.195-1.062,0.195c-0.397,0-0.752-0.067-1.062-0.195c-0.311-0.13-0.58-0.309-0.811-0.533
+            c-0.168-0.165-0.304-0.346-0.405-0.541c-0.102-0.196-0.182-0.399-0.239-0.611c-0.059-0.213-0.099-0.438-0.121-0.671
+            c-0.021-0.232-0.033-0.475-0.033-0.729c0-0.241,0.011-0.483,0.033-0.722c0.022-0.238,0.062-0.462,0.121-0.677
+            c0.057-0.213,0.137-0.415,0.239-0.611c0.102-0.195,0.237-0.374,0.405-0.537c0.23-0.229,0.5-0.403,0.811-0.533
+            c0.31-0.132,0.665-0.197,1.062-0.197c0.398,0,0.753,0.065,1.062,0.197c0.311,0.13,0.581,0.305,0.811,0.533
+            c0.329,0.328,0.544,0.712,0.646,1.148c0.102,0.438,0.153,0.905,0.153,1.398C201.116,49.709,201.065,50.173,200.963,50.612z
+            M200.146,48.668c-0.009-0.183-0.031-0.359-0.066-0.535c-0.036-0.173-0.088-0.334-0.16-0.487c-0.071-0.149-0.163-0.287-0.279-0.409
+            c-0.318-0.313-0.717-0.469-1.196-0.469c-0.47,0-0.864,0.155-1.183,0.469c-0.124,0.122-0.219,0.26-0.285,0.409
+            c-0.067,0.153-0.12,0.314-0.16,0.487c-0.039,0.176-0.064,0.353-0.072,0.535c-0.01,0.182-0.015,0.364-0.015,0.545
+            c0,0.184,0.005,0.364,0.015,0.547c0.008,0.182,0.033,0.36,0.072,0.533c0.04,0.174,0.093,0.339,0.16,0.494
+            c0.066,0.155,0.162,0.291,0.285,0.403c0.319,0.312,0.712,0.468,1.183,0.468c0.479,0,0.877-0.155,1.196-0.468
+            c0.116-0.112,0.208-0.248,0.279-0.403c0.071-0.155,0.124-0.32,0.16-0.494c0.035-0.173,0.057-0.352,0.066-0.533
+            c0.009-0.183,0.015-0.363,0.015-0.547C200.16,49.032,200.154,48.85,200.146,48.668z"/>
+        <path :fill="colors.text" d="M206.941,52.414v-0.716c-0.228,0.26-0.5,0.456-0.814,0.592c-0.313,0.134-0.655,0.203-1.026,0.203
+            c-0.715,0-1.276-0.201-1.682-0.599c-0.229-0.227-0.398-0.487-0.502-0.789c-0.107-0.299-0.16-0.633-0.16-1.007v-4.084h0.956v3.942
+            c0,0.57,0.142,0.999,0.424,1.28c0.283,0.281,0.669,0.421,1.165,0.421c0.495,0,0.888-0.144,1.183-0.429
+            c0.297-0.287,0.445-0.71,0.445-1.272v-3.942h0.969v6.399H206.941z"/>
+        <path :fill="colors.text" d="M215.078,49.969c-0.021,0.25-0.062,0.496-0.12,0.733c-0.057,0.238-0.138,0.463-0.238,0.671
+            c-0.104,0.209-0.237,0.396-0.405,0.559c-0.177,0.174-0.403,0.312-0.678,0.411c-0.274,0.099-0.582,0.15-0.917,0.15
+            c-0.364,0-0.695-0.058-0.998-0.172c-0.3-0.11-0.584-0.332-0.85-0.663v3.618h-0.956v-9.262h0.956v0.753
+            c0.266-0.338,0.55-0.561,0.85-0.669c0.302-0.107,0.634-0.163,0.998-0.163c0.335,0,0.643,0.05,0.917,0.151
+            c0.274,0.099,0.5,0.234,0.678,0.409c0.168,0.164,0.302,0.351,0.405,0.559c0.1,0.209,0.181,0.432,0.238,0.669
+            c0.058,0.238,0.099,0.484,0.12,0.734c0.022,0.254,0.033,0.506,0.033,0.755C215.111,49.467,215.101,49.717,215.078,49.969z
+            M214.102,48.305c-0.036-0.298-0.11-0.555-0.226-0.781c-0.115-0.225-0.281-0.407-0.499-0.547c-0.216-0.14-0.503-0.209-0.857-0.209
+            s-0.639,0.069-0.857,0.209c-0.217,0.14-0.383,0.322-0.498,0.547c-0.115,0.227-0.193,0.483-0.232,0.781
+            c-0.041,0.293-0.06,0.596-0.06,0.908c0,0.313,0.02,0.618,0.06,0.911c0.039,0.295,0.117,0.557,0.232,0.781
+            c0.115,0.226,0.281,0.407,0.498,0.547c0.218,0.138,0.503,0.206,0.857,0.206s0.641-0.068,0.857-0.206
+            c0.217-0.14,0.383-0.321,0.499-0.547c0.116-0.225,0.19-0.486,0.226-0.781c0.036-0.293,0.052-0.598,0.052-0.911
+            C214.154,48.9,214.138,48.598,214.102,48.305z"/>
+    </g>
+    <g>
+        <path :fill="colors.upf" d="M34.879,36.797c-0.994,0-1.348-0.432-1.348-1.461l0.035-8.323c0-0.316-0.067-0.484-0.418-0.484
+            c-0.092,0-0.301,0.023-0.621,0.059c-0.728,0.084-2.076,0.203-3.689,0.252l-0.07,0.004v1.041h0.073c0.849,0,1.414,0.23,1.414,1.219
+            l-0.032,2.422c0,4.015-1.609,4.792-2.785,4.792c-0.961,0-1.32-0.994-1.32-1.83l0.047-7.474c0-0.316-0.068-0.484-0.418-0.484
+            c-0.091,0-0.304,0.023-0.623,0.059c-0.727,0.084-1.922,0.203-3.531,0.252l-0.072,0.004v1.041h0.074c0.852,0,1.414,0.23,1.414,1.219
+            l-0.045,5.039c0,3.284,1.697,3.974,3.121,3.974c2.123,0,3.342-1.385,4.004-2.127c0.183-0.207,0.369-0.418,0.436-0.418
+            c0.033,0,0.133,0,0.133,0.156v2.041c0,0.303,0.204,0.348,0.324,0.348c0.093,0,0.299-0.027,0.608-0.072
+            c0.75-0.1,2.008-0.203,3.29-0.203h0.075v-1.043H34.879z"/>
+        <path :fill="colors.upf" d="M56.857,20.884c-2.896,0-3.68,4.062-4.055,6.076h-2.336l-0.214,1.043h2.392l-0.156,1.012
+            c-0.105,0.678-0.209,1.355-0.312,2.043l-0.177,1.166c-1.019,6.72-1.532,9.706-2.644,9.706c-0.125,0-0.155-0.037-0.155-0.18
+            c0-0.047,0.015-0.105,0.032-0.174c0.029-0.098,0.059-0.221,0.059-0.377c0-0.461-0.341-0.785-0.828-0.785
+            c-0.73,0-1.061,0.525-1.061,1.016c0,0.906,0.66,1.541,1.61,1.541c1.7,0,3.785-1.959,5.662-14.968h2.589l0.184-1.043h-2.64
+            l0.22-1.705c0.325-2.336,0.748-3.328,1.416-3.328c0.269,0,0.432,0.135,0.432,0.359c0,0.148-0.02,0.223-0.041,0.299
+            c-0.023,0.09-0.051,0.182-0.051,0.365c0,0.385,0.24,0.834,0.924,0.834c0.826,0,1.195-0.637,1.195-1.268
+            C58.902,21.479,58.158,20.884,56.857,20.884"/>
+        <path :fill="colors.upf" d="M58.5,35.354c-0.747,0-1.355,0.609-1.355,1.359c0,0.746,0.608,1.357,1.355,1.357
+            c0.75,0,1.36-0.611,1.36-1.357C59.86,35.963,59.25,35.354,58.5,35.354"/>
+    </g>
+    <path :fill="colors.upf" d="M17.856,56.111h46.245V9.868H17.856V56.111z M66.887,58.9H15.069V7.081h51.817V58.9z"/>
+    <g>
+        <path :fill="colors.upf" d="M46.35,30.728c0,1.863-0.891,5.946-3.539,5.946c-1.479,0-2.001-1.5-2.001-2.782
+            c0-2.482,1.181-5.924,3.401-5.924C45.979,27.968,46.35,29.47,46.35,30.728 M44.832,26.528c-2.08,0-3.205,1.441-3.689,2.133
+            c-0.027-1.377-0.539-2.02-1.606-2.02c-1.726,0-2.735,2.355-3.278,3.623l-0.027,0.059l0.814,0.461l0.035-0.068
+            c0.037-0.078,0.084-0.188,0.146-0.318c0.353-0.785,1.087-2.416,1.849-2.416c0.416,0,0.478,0.514,0.478,0.82
+            c0,0.439-0.133,1.135-0.364,2.186l-2.155,9.241c-0.312,1.371-0.462,1.592-1.831,1.592h-0.061l-0.187,1.041h5.786l0.24-1.041h-0.092
+            c-1.788,0-2.085-0.02-2.085-0.705c0-0.145,0.081-0.488,0.144-0.766l1.023-4.334c0.557,1.16,1.234,2.1,3.299,2.1
+            c3.55,0,5.441-3.997,5.441-6.882C48.711,28.892,47.512,26.528,44.832,26.528"/>
+        <path :fill="colors.text" d="M74.439,14.216h5.156v0.627H79.27c-0.901,0-1.133,0.383-1.133,0.955v4.557c0,1.678,0.75,2.564,2.264,2.564
+            c1.406,0,2.143-0.559,2.498-1.432c0.162-0.41,0.191-1.037,0.191-1.406v-3.738c0-1.24-0.615-1.5-1.461-1.5v-0.627h3.397v0.627
+            c-1.119,0-1.255,0.504-1.255,1.5v3.738c0,2.047-0.887,3.672-3.889,3.672c-2.771,0-4.107-1.393-4.107-3.398v-3.971
+            c0-1.459-0.273-1.541-1.336-1.541V14.216z"/>
+        <path :fill="colors.text" d="M85.123,23.015c0.641,0,0.914-0.191,0.914-0.873v-3.711c0-0.668-0.369-0.75-0.982-0.75v-0.533
+            c1.146-0.025,2.374-0.203,2.564-0.203c0.109,0,0.123,0.096,0.123,0.217v0.955c0,0.191,0.014,0.287,0.082,0.287
+            c0.15,0,0.723-1.459,2.169-1.459c1.337,0,2.005,0.832,2.005,2.25v3.152c0,0.52,0.287,0.668,0.833,0.668v0.533h-3.52v-0.533
+            c0.423,0,0.804-0.082,0.804-0.627v-3.385c0-0.818-0.381-1.076-0.79-1.076c-0.696,0-1.405,0.764-1.405,2.033v2.414
+            c0,0.572,0.367,0.641,0.791,0.641v0.533h-3.588V23.015z"/>
+        <path :fill="colors.text" d="M95.172,13.478c0.573,0,1.051,0.465,1.051,1.037c0,0.574-0.478,1.037-1.051,1.037
+            c-0.572,0-1.051-0.463-1.051-1.037C94.121,13.942,94.6,13.478,95.172,13.478 M93.48,23.015c0.641,0,0.982,0,0.982-0.695v-3.684
+            c0-0.859-0.382-0.955-0.982-0.955v-0.533c1.434-0.055,2.265-0.203,2.66-0.203c0.15,0,0.205,0.053,0.205,0.383v4.992
+            c0,0.695,0.327,0.695,0.9,0.695v0.533H93.48V23.015z"/>
+        <path :fill="colors.text" d="M97.361,17.147h3.753v0.533c-0.383,0-0.818,0.055-0.818,0.531c0,0.314,0.177,0.764,0.477,1.461l0.818,1.883
+            c0.082,0.191,0.123,0.273,0.165,0.273c0.067,0,0.095-0.137,0.149-0.273l0.614-1.557c0.19-0.477,0.45-1.158,0.45-1.623
+            c0-0.49-0.328-0.695-0.859-0.695v-0.533h2.374v0.533c-0.327,0.041-0.519,0.164-0.806,0.873l-2.061,5.076h-1.146l-2.17-5.062
+            c-0.312-0.736-0.381-0.887-0.941-0.887V17.147z"/>
+        <path :fill="colors.text" d="M108.444,19.755c0.082,0,0.108-0.041,0.108-0.137v-0.273c0-1.215-0.3-1.869-0.929-1.869
+            c-0.559,0-0.928,0.6-0.928,1.938v0.342H108.444z M110.599,21.556c-0.422,1.377-1.514,2.197-2.906,2.197
+            c-1.623,0-3.097-1.434-3.097-3.398c0-1.979,1.474-3.41,3.138-3.41c1.814,0,2.825,1.418,2.825,3.342h-3.862v0.26
+            c0,1.76,0.778,2.375,1.543,2.375c0.969,0,1.459-0.67,1.746-1.365H110.599z"/>
+        <path :fill="colors.text" d="M110.909,23.015c0.656,0,1.16,0,1.16-0.832v-3.752c0-0.668-0.367-0.75-1.118-0.75v-0.533
+            c0.981-0.025,2.483-0.203,2.634-0.203c0.096,0,0.122,0.066,0.122,0.191v1.117c0,0.055,0,0.15,0.068,0.15
+            c0.204,0,0.628-1.459,1.72-1.459c0.695,0,1.064,0.477,1.064,1.172c0,0.561-0.301,1.064-0.929,1.064c-0.928,0-0.778-1.01-0.969-1.01
+            c-0.205,0-0.709,0.588-0.709,1.924v2.088c0,0.832,0.478,0.832,1.364,0.832v0.533h-4.408V23.015z"/>
+        <path :fill="colors.text" d="M121.229,18.868c-0.287-0.875-0.846-1.393-1.787-1.393c-0.572,0-0.982,0.246-0.982,0.818
+            c0,1.201,3.643,0.887,3.643,3.371c0,1.186-0.969,2.086-2.278,2.086c-0.846,0-1.351-0.367-1.651-0.367
+            c-0.163,0-0.312,0.123-0.367,0.34h-0.492c0.014-0.367,0.041-0.736,0.041-1.104c0-0.369-0.027-0.723-0.041-1.092h0.519
+            c0.15,0.969,0.982,1.691,1.938,1.691c0.641,0,1.077-0.328,1.077-0.832c0-1.637-3.644-1.119-3.644-3.615
+            c0-1.174,1.092-1.828,2.252-1.828c0.805,0,0.996,0.271,1.351,0.271c0.218,0,0.382-0.055,0.45-0.23h0.424
+            c-0.014,0.312-0.042,0.627-0.042,0.941c0,0.312,0.028,0.627,0.042,0.941H121.229z"/>
+        <path :fill="colors.text" d="M124.362,13.478c0.572,0,1.051,0.465,1.051,1.037c0,0.574-0.479,1.037-1.051,1.037
+            c-0.574,0-1.051-0.463-1.051-1.037C123.312,13.942,123.788,13.478,124.362,13.478 M122.671,23.015c0.641,0,0.982,0,0.982-0.695
+            v-3.684c0-0.859-0.383-0.955-0.982-0.955v-0.533c1.432-0.055,2.264-0.203,2.66-0.203c0.149,0,0.204,0.053,0.204,0.383v4.992
+            c0,0.695,0.327,0.695,0.9,0.695v0.533h-3.765V23.015z"/>
+        <path :fill="colors.text" d="M126.585,17.229c1.35-0.367,1.992-1.555,2.414-2.729h0.506v2.646h1.541v0.533h-1.541v4.365
+            c0,0.602,0.258,0.725,0.518,0.725c0.437,0,0.668-0.424,0.859-0.752l0.45,0.205c-0.382,0.941-0.996,1.529-2.061,1.529
+            c-1.118,0-1.65-0.588-1.65-1.844v-4.229h-1.036V17.229z"/>
+        <path :fill="colors.text" d="M134.726,22.919c0.766,0,1.283-0.682,1.283-2.059c0-0.533,0-0.615-0.068-0.615
+            c-0.518,0-2.033,0.273-2.033,1.541C133.907,22.524,134.167,22.919,134.726,22.919 M137.892,22.374c0,0.287,0.123,0.396,0.328,0.396
+            c0.123,0,0.204-0.043,0.26-0.043c0.054,0,0.096,0.055,0.096,0.139c0,0.641-0.643,0.887-1.161,0.887
+            c-0.94,0-1.228-0.725-1.364-0.957c-0.26,0.205-1.105,0.957-2.251,0.957c-1.132,0-1.774-0.697-1.774-1.598
+            c0-1.91,2.565-2.279,3.984-2.348v-0.9c0-1.021-0.518-1.432-1.474-1.432c-0.546,0-0.736,0.137-0.736,0.301
+            c0,0.285,0.396,0.189,0.396,0.818c0,0.449-0.272,0.873-0.955,0.873c-0.586,0-0.928-0.49-0.928-1.023c0-0.982,1.064-1.5,2.388-1.5
+            c2.36,0,3.192,0.982,3.192,2.852V22.374z"/>
+        <path :fill="colors.text" d="M138.755,17.229c1.35-0.367,1.992-1.555,2.414-2.729h0.506v2.646h1.541v0.533h-1.541v4.365
+            c0,0.602,0.258,0.725,0.518,0.725c0.437,0,0.669-0.424,0.859-0.752l0.451,0.205c-0.383,0.941-0.997,1.529-2.061,1.529
+            c-1.119,0-1.651-0.588-1.651-1.844v-4.229h-1.036V17.229z"/>
+        <path :fill="colors.text" d="M78.272,32.72c0,0.109,0.054,0.15,0.231,0.15c1.502,0,2.061-0.41,2.061-1.965
+            c0-0.982-0.341-1.746-1.445-1.746c-0.561,0-0.847,0.246-0.847,0.928V32.72z M74.684,37.277h0.383c0.627,0,0.846-0.314,0.846-0.75
+            v-6.399c0-0.887-0.41-0.928-1.229-0.928v-0.627h4.926c2.564,0,3.562,0.982,3.562,2.414c0,2.033-2.13,2.469-3.809,2.469h-0.859
+            c-0.178,0-0.231,0.041-0.231,0.15v2.921c0,0.695,0.313,0.75,1.282,0.75h0.273v0.627h-5.145V37.277z"/>
+        <path :fill="colors.text" d="M86.629,37.578c0.695,0,1.201-0.355,1.201-2.865c0-2.552-0.588-2.88-1.201-2.88s-1.201,0.328-1.201,2.88
+            C85.428,37.223,85.934,37.578,86.629,37.578 M86.629,31.3c1.746,0,3.302,1.434,3.302,3.413c0,1.963-1.474,3.396-3.302,3.396
+            s-3.302-1.434-3.302-3.396C83.327,32.733,84.883,31.3,86.629,31.3"/>
+        <path :fill="colors.text" d="M90.38,37.373c0.45,0,0.832-0.055,0.832-0.832v-3.753c0-0.668-0.354-0.75-0.832-0.75v-0.533
+            c0.941-0.055,2.128-0.205,2.36-0.205c0.096,0,0.122,0.07,0.122,0.191v0.9c0,0.232,0,0.369,0.082,0.369
+            c0.178,0,0.696-1.461,2.183-1.461c1.721,0,1.748,1.488,1.924,1.488c0.164,0,0.465-1.488,2.115-1.488
+            c1.214,0,1.979,0.875,1.979,2.375v2.866c0,0.682,0.204,0.832,0.818,0.832v0.531h-3.506v-0.531c0.422,0,0.805-0.055,0.805-0.832
+            V33.88c0-1.201-0.327-1.596-0.887-1.596c-0.71,0-1.256,1.076-1.256,2.292v1.965c0,0.682,0.205,0.832,0.819,0.832v0.531h-3.507
+            v-0.531c0.424,0,0.805-0.055,0.805-0.832V33.88c0-1.201-0.326-1.596-0.886-1.596c-0.71,0-1.256,1.076-1.256,2.292v1.965
+            c0,0.682,0.204,0.832,0.819,0.832v0.531H90.38V37.373z"/>
+        <path :fill="colors.text" d="M106.127,37.277c0.832,0,1.2-0.914,1.2-2.512c0-1.882-0.259-2.632-1.172-2.632
+            c-1.065,0-1.229,1.418-1.229,2.632C104.927,36.254,105.295,37.277,106.127,37.277 M102.062,40.033c0.45,0,0.982-0.137,0.982-0.709
+            v-6.536c0-0.668-0.369-0.75-0.982-0.75v-0.533c0.9-0.027,2.346-0.205,2.496-0.205c0.096,0,0.123,0.096,0.123,0.191v0.67
+            c0,0.217,0.027,0.285,0.068,0.285c0.137,0,0.627-1.146,2.02-1.146c1.473,0,2.66,1.215,2.66,3.274c0,1.994-0.969,3.535-2.688,3.535
+            c-1.27,0-1.583-0.859-1.72-0.859c-0.067,0-0.095,0.082-0.095,0.164v1.938c0,0.627,0.396,0.682,1.377,0.682v0.531h-4.242V40.033z"/>
+        <path :fill="colors.text" d="M114.161,34.11c0.083,0,0.109-0.039,0.109-0.135v-0.273c0-1.215-0.3-1.869-0.928-1.869
+            c-0.559,0-0.928,0.6-0.928,1.938v0.34H114.161z M116.317,35.912c-0.423,1.379-1.514,2.197-2.906,2.197
+            c-1.623,0-3.098-1.432-3.098-3.396c0-1.979,1.475-3.413,3.139-3.413c1.814,0,2.824,1.42,2.824,3.345h-3.861v0.26
+            c0,1.76,0.777,2.373,1.543,2.373c0.968,0,1.459-0.668,1.746-1.365H116.317z"/>
+        <path :fill="colors.text" d="M116.665,31.505c1.365-0.041,2.388-0.205,2.565-0.205c0.163,0,0.204,0.055,0.204,0.246v4.448
+            c0,0.643,0.191,1.133,0.736,1.133c0.765,0,1.502-0.887,1.502-2.4v-1.938c0-0.654-0.424-0.75-0.887-0.75v-0.533
+            c1.364-0.041,2.387-0.205,2.564-0.205c0.164,0,0.204,0.055,0.204,0.246V36.5c0,0.613,0.204,0.873,0.847,0.873v0.531
+            c-1.078,0-2.143,0.205-2.32,0.205c-0.122,0-0.149-0.082-0.149-0.164V36.73c0-0.082-0.041-0.135-0.123-0.135
+            c-0.218,0-0.75,1.514-2.442,1.514c-1.051,0-1.814-0.641-1.814-2.32v-3.001c0-0.654-0.423-0.75-0.887-0.75V31.505z"/>
+        <path :fill="colors.text" d="M128.685,37.277h0.342c0.627,0,0.846-0.314,0.846-0.75v-6.399c0-0.887-0.409-0.928-1.188-0.928v-0.627
+            h8.459l0.055,2.852h-0.627c-0.164-1.543-1.27-2.266-2.784-2.266c-1.378,0-1.555,0.15-1.555,0.709v2.674
+            c0,0.178,0.041,0.232,0.204,0.232c1.133,0,1.828-0.273,1.828-1.691h0.628v4.038h-0.601c-0.081-1.255-0.477-1.761-1.732-1.761
+            c-0.259,0-0.327,0.027-0.327,0.205v2.962c0,0.695,0.313,0.75,1.282,0.75h0.232v0.627h-5.062V37.277z"/>
+        <path :fill="colors.text" d="M140.2,37.277c0.764,0,1.282-0.682,1.282-2.061c0-0.531,0-0.613-0.067-0.613
+            c-0.52,0-2.033,0.273-2.033,1.541C139.382,36.881,139.641,37.277,140.2,37.277 M143.365,36.73c0,0.287,0.123,0.396,0.327,0.396
+            c0.123,0,0.205-0.041,0.26-0.041s0.096,0.055,0.096,0.137c0,0.643-0.642,0.887-1.16,0.887c-0.941,0-1.228-0.723-1.363-0.955
+            c-0.26,0.205-1.105,0.955-2.252,0.955c-1.133,0-1.774-0.695-1.774-1.596c0-1.91,2.565-2.28,3.984-2.349v-0.9
+            c0-1.021-0.519-1.432-1.474-1.432c-0.545,0-0.736,0.137-0.736,0.301c0,0.285,0.396,0.189,0.396,0.818
+            c0,0.449-0.273,0.873-0.955,0.873c-0.587,0-0.929-0.492-0.929-1.023c0-0.982,1.065-1.502,2.389-1.502
+            c2.359,0,3.192,0.984,3.192,2.852V36.73z"/>
+        <path :fill="colors.text" d="M148.423,32.134c-0.859,0-1.297,0.873-1.297,2.7c0,1.666,0.438,2.744,1.297,2.744
+            c0.737,0,1.119-0.779,1.119-2.512C149.542,32.651,149.132,32.134,148.423,32.134 M144.234,28.108
+            c1.487-0.055,2.538-0.271,2.769-0.271c0.069,0,0.123,0.039,0.123,0.148v3.93c0,0.328,0.015,0.396,0.096,0.396
+            c0.15,0,0.438-1.01,1.787-1.01c1.692,0,2.634,1.637,2.634,3.356c0,1.883-1.2,3.451-3.124,3.451c-1.201,0-1.788-1.104-1.979-1.104
+            c-0.15,0-0.709,0.898-0.832,1.104h-0.518c0.054-1.037,0.054-2.32,0.054-3.89v-4.652c0-0.736-0.245-0.928-0.888-0.928h-0.122V28.108
+            z"/>
+        <path :fill="colors.text" d="M152.071,37.373c0.654,0,1.16,0,1.16-0.832v-3.753c0-0.668-0.369-0.75-1.119-0.75v-0.533
+            c0.982-0.027,2.482-0.205,2.633-0.205c0.096,0,0.123,0.07,0.123,0.191v1.119c0,0.055,0,0.15,0.068,0.15
+            c0.205,0,0.627-1.461,1.719-1.461c0.695,0,1.064,0.479,1.064,1.174c0,0.561-0.3,1.064-0.928,1.064c-0.928,0-0.778-1.01-0.969-1.01
+            c-0.205,0-0.709,0.588-0.709,1.925v2.088c0,0.832,0.477,0.832,1.363,0.832v0.531h-4.406V37.373z"/>
+        <path :fill="colors.text" d="M160.906,37.277c0.764,0,1.282-0.682,1.282-2.061c0-0.531,0-0.613-0.068-0.613
+            c-0.518,0-2.033,0.273-2.033,1.541C160.087,36.881,160.347,37.277,160.906,37.277 M164.071,36.73c0,0.287,0.123,0.396,0.328,0.396
+            c0.122,0,0.204-0.041,0.26-0.041c0.053,0,0.095,0.055,0.095,0.137c0,0.643-0.642,0.887-1.16,0.887c-0.94,0-1.228-0.723-1.364-0.955
+            c-0.26,0.205-1.105,0.955-2.252,0.955c-1.131,0-1.773-0.695-1.773-1.596c0-1.91,2.565-2.28,3.984-2.349v-0.9
+            c0-1.021-0.519-1.432-1.474-1.432c-0.546,0-0.737,0.137-0.737,0.301c0,0.285,0.396,0.189,0.396,0.818
+            c0,0.449-0.272,0.873-0.955,0.873c-0.586,0-0.928-0.492-0.928-1.023c0-0.982,1.064-1.502,2.388-1.502
+            c2.36,0,3.192,0.984,3.192,2.852V36.73z"/>
+        <path :fill="colors.text" d="M78.382,46.969h1.05c1.352,0,3.616-0.027,3.616-1.951c0-1.131-0.765-1.473-2.47-1.473
+            c-1.323,0-1.433,0.121-1.582,0.75L78.382,46.969z M77.632,50.516c-0.042,0.191-0.068,0.383-0.068,0.506
+            c0,0.422,0.108,0.627,1.378,0.627c2.66,0,3.547-0.695,3.547-2.182c0-1.816-1.732-1.885-3.547-1.885H78.26L77.632,50.516z
+            M74.902,51.648h0.355c0.818,0,0.955-0.244,1.077-0.846l1.31-6.072c0.068-0.285,0.109-0.49,0.109-0.695
+            c0-0.383-0.3-0.49-1.051-0.49H76.43l0.137-0.615h4.693c1.707,0,3.07,0.424,3.07,1.965c0,2.02-1.938,2.252-2.633,2.416v0.027
+            c0.682,0.109,2.224,0.465,2.224,1.99c0,1.461-1.118,2.934-4.093,2.934h-5.062L74.902,51.648z"/>
+        <path :fill="colors.text" d="M87.516,51.812c1.432,0,2.195-3.027,2.195-4.135c0-0.572-0.109-1.404-1.023-1.404
+            c-1.404,0-2.237,2.947-2.237,4.092C86.45,51.062,86.696,51.812,87.516,51.812 M91.99,50.543c-0.328,0.736-1.051,1.924-1.979,1.924
+            c-0.777,0-0.846-0.736-0.873-1.188l-0.027-0.027c-0.232,0.262-0.969,1.215-2.006,1.215c-1.242,0-1.773-1.131-1.773-2.332
+            c0-1.76,1.2-4.475,3.246-4.475c1.051,0,1.365,0.777,1.475,1.062l0.026-0.027l0.273-0.832h1.022
+            c-0.49,1.596-1.296,4.652-1.296,5.389c0,0.273,0.082,0.438,0.301,0.438c0.45,0,1.05-1.092,1.187-1.432L91.99,50.543z"/>
+        <path :fill="colors.text" d="M93.65,50.201c0.367-1.268,0.709-2.768,0.709-3.355c0-0.299-0.123-0.477-0.3-0.477
+            c-0.56,0-1.063,1.322-1.228,1.65l-0.41-0.232c0.328-0.764,0.914-2.127,1.91-2.127c0.573,0,0.873,0.463,0.873,1.105
+            c0,0.408-0.068,0.693-0.096,0.816l0.027,0.029c0.328-0.574,1.078-1.951,1.992-1.951c0.6,0,0.914,0.436,0.914,0.967
+            c0,0.67-0.341,0.928-0.75,0.928c-0.328,0-0.6-0.189-0.6-0.49c0-0.232,0.068-0.246,0.068-0.395c0-0.082-0.068-0.139-0.178-0.139
+            c-0.396,0-1.516,1.693-2.497,5.73H93.05L93.65,50.201z"/>
+        <path :fill="colors.text" d="M103.728,51.021c-0.643,0.791-1.583,1.445-2.633,1.445c-2.089,0-2.757-1.514-2.757-2.729
+            c0-2.088,1.501-4.08,3.697-4.08c0.928,0,2.006,0.451,2.006,1.488c0,0.49-0.341,0.982-0.942,0.982c-0.408,0-0.709-0.26-0.709-0.643
+            c0-0.627,0.506-0.639,0.506-0.912c0-0.191-0.355-0.383-0.888-0.383c-1.31,0-2.387,1.568-2.387,3.615
+            c0,1.064,0.449,2.006,1.609,2.006c0.847,0,1.624-0.545,2.101-1.215L103.728,51.021z"/>
+        <path :fill="colors.text" d="M106.037,49.303l0.026,0.027c1.324-0.205,3.221-0.941,3.221-2.266c0-0.572-0.369-0.873-0.873-0.873
+            C106.937,46.191,106.118,48.252,106.037,49.303 M110.185,50.98c-0.588,0.531-1.515,1.486-3.098,1.486
+            c-1.582,0-2.333-1.037-2.333-2.441c0-2.102,1.665-4.367,3.89-4.367c0.873,0,1.842,0.328,1.842,1.406c0,1.473-1.625,2.17-4.504,2.77
+            c-0.014,0.096-0.027,0.246-0.027,0.367c0,0.957,0.465,1.611,1.475,1.611c0.818,0,1.664-0.504,2.428-1.242L110.185,50.98z"/>
+        <path :fill="colors.text" d="M111.988,42.604c0.996-0.014,1.801-0.096,2.442-0.191l0.108,0.15l-1.882,7.572
+            c-0.109,0.449-0.205,0.723-0.205,1.01c0,0.369,0.15,0.545,0.368,0.545c0.587,0,1.228-1.229,1.46-1.705l0.45,0.205
+            c-0.354,0.818-1.146,2.209-2.169,2.209c-0.818,0-1.146-0.559-1.146-1.199c0-0.465,0.164-1.092,0.383-1.967l0.969-3.941
+            c0.164-0.682,0.3-1.297,0.3-1.637c0-0.438-0.231-0.52-0.888-0.52h-0.312L111.988,42.604z"/>
+        <path :fill="colors.text" d="M118.194,51.936c1.855,0,2.455-2.797,2.455-3.875s-0.408-1.869-1.555-1.869
+            c-1.664,0-2.346,2.605-2.346,3.971C116.749,51.09,117.13,51.936,118.194,51.936 M119.19,45.658c1.65,0,2.66,1.201,2.66,2.811
+            c0,1.967-1.445,3.998-3.684,3.998c-1.773,0-2.619-1.213-2.619-2.66C115.548,47.582,117.034,45.658,119.19,45.658"/>
+        <path :fill="colors.text" d="M130.349,50.326c-0.479,0.887-1.146,2.072-2.252,2.072c-0.736,0-1.051-0.572-1.051-1.309
+            c0-0.641,0.273-1.297,0.683-2.32c0.354-0.873,0.532-1.24,0.532-1.719c0-0.463-0.3-0.682-0.628-0.682
+            c-1.187,0-2.032,1.434-2.633,3.615l-0.614,2.277h-1.092l0.602-2.059c0.367-1.27,0.709-2.77,0.709-3.357
+            c0-0.299-0.123-0.477-0.301-0.477c-0.559,0-1.064,1.322-1.228,1.65l-0.409-0.232c0.328-0.764,0.914-2.127,1.91-2.127
+            c0.573,0,0.873,0.463,0.873,1.104c0,0.41-0.068,0.695-0.096,0.818l0.027,0.029c0.45-0.738,1.296-1.951,2.47-1.951
+            c0.887,0,1.446,0.586,1.446,1.486c0,0.682-0.301,1.432-0.547,2.047c-0.449,1.133-0.668,1.637-0.668,2.047
+            c0,0.23,0.123,0.449,0.396,0.449c0.559,0,1.159-1.158,1.391-1.609L130.349,50.326z"/>
+        <path :fill="colors.text" d="M133.35,51.812c1.433,0,2.196-3.027,2.196-4.135c0-0.572-0.108-1.404-1.023-1.404
+            c-1.405,0-2.237,2.947-2.237,4.092C132.285,51.062,132.531,51.812,133.35,51.812 M137.825,50.543
+            c-0.328,0.736-1.051,1.924-1.979,1.924c-0.777,0-0.846-0.736-0.873-1.188l-0.027-0.027c-0.232,0.262-0.969,1.215-2.006,1.215
+            c-1.242,0-1.773-1.131-1.773-2.332c0-1.76,1.201-4.475,3.246-4.475c1.052,0,1.365,0.777,1.475,1.062l0.027-0.027l0.272-0.832h1.023
+            c-0.491,1.596-1.296,4.652-1.296,5.389c0,0.273,0.082,0.438,0.299,0.438c0.451,0,1.052-1.092,1.188-1.432L137.825,50.543z"/>
+    </g>
+    </svg>
+
+</template>
+
+<script>
+    export default {
+        data () {
+            return {
+                isHovered: false
+            }
+        },
+        computed: {
+            colors () {
+                return {
+                    upf: this.isHovered ? "#E4454A" : "#757575",
+                    text: this.isHovered ? "#afafaf" : "#757575"
+                }
+            }
+        }
+    }
+</script>
+
+<style scoped>
+    .mtg-logo-text:hover {
+        /* border: solid 1px white; */
+        cursor: pointer;
+    }
+</style>
\ No newline at end of file