diff --git a/frontend/src/components/App.tsx b/frontend/src/components/App.tsx
index d50350ea00d552a9303e9c796e6e2def1a54101c..296f404eccabc4b618126d5261065997c476d155 100644
--- a/frontend/src/components/App.tsx
+++ b/frontend/src/components/App.tsx
@@ -29,18 +29,18 @@ class App extends React.Component<{}, AppState> {
   }
 
   toggleLeftBar() {
-    if (window.innerWidth < 992) {
+    if (window.innerWidth <= 1024) {
       this.setState({
         toggledRight: false,
       });
-    }
+    } 
     this.setState((state) => ({
       toggledLeft: !state.toggledLeft,
     }));
   }
 
   toggleRightBar() {
-    if (window.innerWidth < 992) {
+    if (window.innerWidth <= 1024) {
       this.setState({
         toggledLeft: false,
       });
diff --git a/frontend/src/components/atoms/ModuleCard/index.tsx b/frontend/src/components/atoms/ModuleCard/index.tsx
index cec15728d7cd46f9237a72d33583a2bd4082a8b4..b5c22a6ce4f433d390c95c8c988051b77b11eedd 100644
--- a/frontend/src/components/atoms/ModuleCard/index.tsx
+++ b/frontend/src/components/atoms/ModuleCard/index.tsx
@@ -26,7 +26,7 @@ export interface ModuleCardProps {
 
 const ModuleCard: React.FC<ModuleCardProps> = ({ module }: ModuleCardProps) => {
   return (
-    <Col xs={12} sm={6} lg={4} xl={3} style={{ marginTop: "1.875rem" }}>
+    <Col xs={12} sm={12} md={6} lg={6} xl={3} style={{ marginTop: "1.875rem" }}>
       <Card
         className={classNames(styles.moduleCard)}
         as={Link}