diff --git a/src/components/alerts/alert.css b/src/components/alerts/alert.css
index d44f6d471efefbe6d7caf5acb3ffba8b9b44f2b3..3bc1c932c723bc55fdde203b07e5d32f4f127724 100644
--- a/src/components/alerts/alert.css
+++ b/src/components/alerts/alert.css
@@ -1,7 +1,6 @@
 @import "../../css/units.css";
 @import "../../css/colors.css";
 @import "../../css/z-index.css";
-@import "../gui/gui.css";
 
 .alert {
     width: 100%;
diff --git a/src/components/alerts/alerts.jsx b/src/components/alerts/alerts.jsx
index 663c5c5d00e9f5e94a9d9990f8b53795a4ba2f34..c90e0fdc888ed907a68502a9041ccc23242511fa 100644
--- a/src/components/alerts/alerts.jsx
+++ b/src/components/alerts/alerts.jsx
@@ -1,3 +1,4 @@
+import classNames from 'classnames';
 import React from 'react';
 import PropTypes from 'prop-types';
 import Box from '../box/box.jsx';
@@ -5,20 +6,24 @@ import Button from '../button/button.jsx';
 
 import styles from './alert.css';
 
-const Alerts = props => (
+const Alerts = ({
+    className,
+    message,
+    onCloseAlert
+}) => (
     <Box
         bounds="parent"
-        className={styles.alertsContainer}
+        className={classNames(styles.alertsContainer, className)}
     >
         <Box
             className={styles.alert}
         >
             <div className={styles.alertMessage}>
-                {props.message}
+                {message}
             </div>
             <Button
                 className={styles.alertRemoveButton}
-                onClick={props.onCloseAlert}
+                onClick={onCloseAlert}
             >
                 { /* eslint-disable react/jsx-no-literals */ }
                 x
@@ -28,6 +33,7 @@ const Alerts = props => (
 );
 
 Alerts.propTypes = {
+    className: PropTypes.string,
     message: PropTypes.string.isRequired,
     onCloseAlert: PropTypes.func.isRequired
 };
diff --git a/src/components/gui/gui.jsx b/src/components/gui/gui.jsx
index ec480e3e72e3342b6702e0ea007a96db7a4ebfed..76ef997d89ba1d73a971cb10fffc4fa4e9c0242b 100644
--- a/src/components/gui/gui.jsx
+++ b/src/components/gui/gui.jsx
@@ -112,7 +112,7 @@ const GUIComponent = props => {
                 vm={vm}
             >
                 {alertsVisible ? (
-                    <Alerts />
+                    <Alerts className={styles.alertsContainer} />
                 ) : null}
             </StageWrapper>
         ) : (
@@ -140,7 +140,7 @@ const GUIComponent = props => {
                     <Cards />
                 ) : null}
                 {alertsVisible ? (
-                    <Alerts />
+                    <Alerts className={styles.alertsContainer} />
                 ) : null}
                 {costumeLibraryVisible ? (
                     <CostumeLibrary