diff --git a/docs/index.html b/docs/index.html
index 157f6c526..a28267127 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -1 +1 @@
-<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=viewport content="width=device-width,initial-scale=1"><link rel=icon href=/favicon.ico><script src=/babel-standalone.js></script><title>Human Connection - Styleguide</title><link href=/css/app.7bfbd875.css rel=preload as=style><link href=/css/chunk-vendors.26c7146d.css rel=preload as=style><link href=/js/app.65d83aa0.js rel=preload as=script><link href=/js/chunk-vendors.9fb0edf9.js rel=preload as=script><link href=/css/chunk-vendors.26c7146d.css rel=stylesheet><link href=/css/app.7bfbd875.css rel=stylesheet></head><body><noscript><strong>We're sorry but this CION doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id=app></div><script src=/js/chunk-vendors.9fb0edf9.js></script><script src=/js/app.65d83aa0.js></script></body></html>
\ No newline at end of file
+<!DOCTYPE html><html lang=en><head><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=viewport content="width=device-width,initial-scale=1"><link rel=icon href=/favicon.ico><script src=/babel-standalone.js></script><title>Human Connection - Styleguide</title><link href=/css/app.a55670c3.css rel=preload as=style><link href=/css/chunk-vendors.26c7146d.css rel=preload as=style><link href=/js/app.2b144647.js rel=preload as=script><link href=/js/chunk-vendors.8cfd4731.js rel=preload as=script><link href=/css/chunk-vendors.26c7146d.css rel=stylesheet><link href=/css/app.a55670c3.css rel=stylesheet></head><body><noscript><strong>We're sorry but this CION doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id=app></div><script src=/js/chunk-vendors.8cfd4731.js></script><script src=/js/app.2b144647.js></script></body></html>
\ No newline at end of file
diff --git a/package.json b/package.json
index 778b3a8ae..b332adeb7 100644
--- a/package.json
+++ b/package.json
@@ -18,7 +18,6 @@
     "access": "public"
   },
   "peerDependencies": {
-    "portal-vue": "1.x",
     "vue": "2.6.x"
   },
   "devDependencies": {
diff --git a/src/system/components/layout/Modal/Modal.vue b/src/system/components/layout/Modal/Modal.vue
index 8f12753a9..17786c479 100644
--- a/src/system/components/layout/Modal/Modal.vue
+++ b/src/system/components/layout/Modal/Modal.vue
@@ -1,75 +1,71 @@
 <template>
   <div>
-    <portal to="modal">
-      <div 
-        :key="key" 
-        class="ds-modal-wrapper">
-        <transition 
-          name="ds-transition-fade" 
-          appear>
-          <div
-            v-if="isOpen"
-            class="ds-modal-backdrop"
-            ref="backdrop"
-            @click="backdropHandler"
-          >
-            &nbsp;
-          </div>
-        </transition>
-        <transition 
-          name="ds-transition-modal-appear" 
-          appear>
-          <ds-card
-            v-if="isOpen"
-            class="ds-modal"
-            :class="[extended && 'ds-modal-extended']"
-            :header="title"
-            tableindex="-1"
-            role="dialog"
-            ref="modal"
-            style="display: block"
-          >
-            <ds-button
-              v-if="!force"
-              class="ds-modal-close"
-              ghost
-              size="small"
-              icon="close"
-              aria-hidden="true"
-              @click="cancel('close')"
-            />
-            <!-- @slot Modal content -->
-            <slot ref="modalBody"/>
-            <template slot="footer">
-              <!-- @slot Modal footer with action buttons -->
-              <slot
-                name="footer"
-                :confirm="confirm"
-                :cancel="cancel"
-                :cancelLabel="cancelLabel"
-                :confirmLabel="confirmLabel"
-              >
-                <ds-button 
-                  ghost 
-                  icon="close" 
-                  @click.prevent="cancel('cancel')">{{ cancelLabel }}</ds-button>
-                <ds-button 
-                  primary 
-                  icon="check" 
-                  @click.prevent="confirm('confirm')">{{ confirmLabel }}</ds-button>
-              </slot>
-            </template>
-          </ds-card>
-        </transition>
-      </div>
-    </portal>
+    <div
+      :key="key"
+      class="ds-modal-wrapper">
+      <transition
+        name="ds-transition-fade"
+        appear>
+        <div
+          v-if="isOpen"
+          class="ds-modal-backdrop"
+          ref="backdrop"
+          @click="backdropHandler"
+        >
+          &nbsp;
+        </div>
+      </transition>
+      <transition
+        name="ds-transition-modal-appear"
+        appear>
+        <ds-card
+          v-if="isOpen"
+          class="ds-modal"
+          :class="[extended && 'ds-modal-extended']"
+          :header="title"
+          tableindex="-1"
+          role="dialog"
+          ref="modal"
+          style="display: block"
+        >
+          <ds-button
+            v-if="!force"
+            class="ds-modal-close"
+            ghost
+            size="small"
+            icon="close"
+            aria-hidden="true"
+            @click="cancel('close')"
+          />
+          <!-- @slot Modal content -->
+          <slot ref="modalBody"/>
+          <template slot="footer">
+            <!-- @slot Modal footer with action buttons -->
+            <slot
+              name="footer"
+              :confirm="confirm"
+              :cancel="cancel"
+              :cancelLabel="cancelLabel"
+              :confirmLabel="confirmLabel"
+            >
+              <ds-button
+                ghost
+                icon="close"
+                @click.prevent="cancel('cancel')">{{ cancelLabel }}</ds-button>
+              <ds-button
+                primary
+                icon="check"
+                @click.prevent="confirm('confirm')">{{ confirmLabel }}</ds-button>
+            </slot>
+          </template>
+        </ds-card>
+      </transition>
+    </div>
   </div>
 </template>
 
 <script>
 import Vue from 'vue'
-import portal from 'portal-vue'
-Vue.use(portal)
 
 /* eslint-disable no-empty */
 
diff --git a/src/system/components/layout/Modal/demo.md b/src/system/components/layout/Modal/demo.md
index 50f9481e2..c1d322abf 100644
--- a/src/system/components/layout/Modal/demo.md
+++ b/src/system/components/layout/Modal/demo.md
@@ -2,11 +2,8 @@
 
 Basic modal usage
 
-You will need to add the portal-target to the end of your html body to get the modal working properly
 ```html
-<!-- put the following tag as last element to your html body / layout -->
-<!-- make sure you only include it once! -->
-<portal-target name="modal" style="position: absolute" />
+<ds-modal style="position: absolute" />
 ```
 
 ```
