Fixed issues with tailwind not extending default styles

17th Website/src/components/inputs/pingableTextBox.vue

@@ -91,7 +91,7 @@ export default {
     <div class="relative">
         <input type="text" v-model="search" @input="onchange" @keydown.down="bumpDown" @keydown.up="bumpUp"
             @keydown.enter="select" @keydown.tab="select" :class="{}"
-            class="bg-gray-light rounded-md text-white"/>
+            class="bg-gray-light rounded-md text-white focus:outline-none p-1 px-2"/>
         <ul id="results" v-show="isOpen">
             <li class="result" v-for="(result, i) in results" :key="i" @click="setResult(result)"
                 :class="{ 'is-active': i === arrowCounter }">
@@ -122,7 +122,7 @@ export default {
 
 .result.is-active,
 .result:hover {
-    background-color: #4AAE9B;
+    background-color: #01bde7;
     color: white;
 }
 </style>