diff --git a/components/report_cards/chemical_probe/CompoundCrystalStructures.vue b/components/report_cards/chemical_probe/CompoundCrystalStructures.vue
index 4c8f735fcec221307febb74c73f667973db7778f..167b523761dcaf2b4513e5946f1902aeb124ba93 100644
--- a/components/report_cards/chemical_probe/CompoundCrystalStructures.vue
+++ b/components/report_cards/chemical_probe/CompoundCrystalStructures.vue
@@ -5,12 +5,23 @@
       <v-card-text> No entires found in PDB for {{ itemID }} </v-card-text>
     </template>
     <template v-if="!loading && thereAreRefs">
-      <v-tabs show-arrows :vertical="makeTabsVertical">
-        <v-tab v-for="ref in pdbeRefs" :key="ref.id"> {{ ref.id }} </v-tab>
-        <v-tab-item v-for="ref in pdbeRefs" :key="`${ref.id}-item`">
-          <PDBeVisualisations :ligand-code="ref.id" :ref-link="ref.link" />
-        </v-tab-item>
-      </v-tabs>
+      <v-card-title> Ligand codes found in PDB </v-card-title>
+      <v-divider />
+      <v-card-text>
+        <v-btn
+          v-for="ref in pdbeRefs"
+          :key="ref.id"
+          depressed
+          color="primary"
+          :href="ref.link"
+          target="_blank"
+          class="a-button"
+        >
+          {{ ref.id }}
+
+          <v-icon> mdi-open-in-new </v-icon>
+        </v-btn>
+      </v-card-text>
     </template>
   </v-card>
 </template>
@@ -21,12 +32,9 @@ import ESProxyService from '~/web-components-submodule/services/ESProxyService.j
 import EntityNames from '~/web-components-submodule/standardisation/EntityNames.js'
 import IndexNames from '~/web-components-submodule/standardisation/IndexNames.js'
 import ObjectPropertyAccess from '~/web-components-submodule/utils/ObjectPropertyAccess.js'
-import PDBeVisualisations from '~/components/report_cards/shared/CrystalStructures/PDBeVisualisations.vue'
 
 export default {
-  components: {
-    PDBeVisualisations,
-  },
+  components: {},
   props: {
     itemID: {
       type: String,
@@ -41,16 +49,6 @@ export default {
     }
   },
   computed: {
-    makeTabsVertical() {
-      switch (this.$vuetify.breakpoint.name) {
-        case 'xs':
-          return false
-        case 'sm':
-          return false
-        default:
-          return true
-      }
-    },
     thereAreRefs() {
       return this.pdbeRefs.length > 0
     },
@@ -90,4 +88,8 @@ export default {
 }
 </script>
 
-<style></style>
+<style lang="scss" scoped>
+.a-button {
+  margin-right: 5px;
+}
+</style>
diff --git a/components/report_cards/target/TargetCrystalStructures.vue b/components/report_cards/target/TargetCrystalStructures.vue
index bf0b7fb61f7480243a79b3410c4ba55aa66a151d..9230959c975b328f01ba5861e4c01d46afd2ea48 100644
--- a/components/report_cards/target/TargetCrystalStructures.vue
+++ b/components/report_cards/target/TargetCrystalStructures.vue
@@ -5,17 +5,21 @@
       <v-card-text> No entires found in PDB for {{ itemID }} </v-card-text>
     </template>
     <template v-if="!loading && thereAreAccessions">
-      <v-tabs show-arrows :vertical="makeTabsVertical">
-        <v-tab v-for="accession in uniProtAccessions" :key="accession">
-          {{ accession }}
-        </v-tab>
-        <v-tab-item
+      <v-card-text>
+        <v-btn
           v-for="accession in uniProtAccessions"
-          :key="`${accession}-item`"
+          :key="accession"
+          depressed
+          color="primary"
+          :href="`https://www.uniprot.org/uniprot/${accession}`"
+          target="_blank"
+          class="a-button"
         >
-          <PDBeRepresentativeStructure :uni-prot-accession="accession" />
-        </v-tab-item>
-      </v-tabs>
+          {{ accession }}
+
+          <v-icon> mdi-open-in-new </v-icon>
+        </v-btn>
+      </v-card-text>
     </template>
   </v-card>
 </template>
@@ -26,12 +30,8 @@ import ESProxyService from '~/web-components-submodule/services/ESProxyService.j
 import EntityNames from '~/web-components-submodule/standardisation/EntityNames.js'
 import IndexNames from '~/web-components-submodule/standardisation/IndexNames.js'
 import ObjectPropertyAccess from '~/web-components-submodule/utils/ObjectPropertyAccess.js'
-import PDBeRepresentativeStructure from '~/components/report_cards/shared/CrystalStructures/PDBeRepresentativeStructure.vue'
 
 export default {
-  components: {
-    PDBeRepresentativeStructure,
-  },
   props: {
     itemID: {
       type: String,
@@ -41,7 +41,6 @@ export default {
   data() {
     return {
       loading: true,
-      ligandCode: 'VIA',
       uniProtAccessions: [],
     }
   },
@@ -96,4 +95,8 @@ export default {
 }
 </script>
 
-<style></style>
+<style lang="scss" scoped>
+.a-button {
+  margin-right: 5px;
+}
+</style>
diff --git a/report_cards_structure/CompoundReportCardGenerator.js b/report_cards_structure/CompoundReportCardGenerator.js
index c9d48eae4809b2d5ee160e763788900aaa6c0e15..c30001eca74dc1844f84ffc4c6fa8f1042680493 100644
--- a/report_cards_structure/CompoundReportCardGenerator.js
+++ b/report_cards_structure/CompoundReportCardGenerator.js
@@ -51,7 +51,7 @@ const methods = {
         },
         {
           id: 'CrystalStructures',
-          title: 'Crystal Structures',
+          title: 'PBD Ligand Codes',
           component: CompoundCrystalStructures,
           index: 6,
         },
diff --git a/report_cards_structure/TargetReportCardGenerator.js b/report_cards_structure/TargetReportCardGenerator.js
index 5d5f69ad83d503221ed13c751d9e059b414dcbec..5fb00b0965444c0280d307fadaae50cc33d7b46a 100644
--- a/report_cards_structure/TargetReportCardGenerator.js
+++ b/report_cards_structure/TargetReportCardGenerator.js
@@ -23,7 +23,7 @@ const methods = {
         },
         {
           id: 'CrystalStructures',
-          title: 'Crystal Structures',
+          title: 'Uniprot Accessions',
           component: TargetCrystalStructures,
           index: 2,
         },