diff --git a/src/components/PaymentsOptionsRendererTwoColumn.tsx b/src/components/PaymentsOptionsRendererTwoColumn.tsx
new file mode 100644
index 0000000..9344433
--- /dev/null
+++ b/src/components/PaymentsOptionsRendererTwoColumn.tsx
@@ -0,0 +1,58 @@
+import type React from "react";
+import { Dimensions, View } from "react-native";
+import PaymentOption from "./PaymentOption";
+import Box from "./bases/Box";
+
+const PaymentsOptionsRendererTwoColumn = () => {
+ return (
+
+
+
+ navigation.navigate("paymentAmountInputScreen")}
+ paymentMethod={"OrangeMoney"}
+ />
+
+
+ navigation.navigate("paymentAmountInputScreen")}
+ paymentMethod={"MtnMoney"}
+ />
+
+
+
+
+ navigation.navigate("paymentAmountInputScreen")}
+ paymentMethod={"MoovMoney"}
+ />
+
+
+ navigation.navigate("paymentAmountInputScreen")}
+ paymentMethod={"WaveMoney"}
+ />
+
+
+
+ navigation.navigate("paymentAmountInputScreen")}
+ paymentMethod={"VisaCard"}
+ />
+
+
+ );
+};
+
+const screenWidth = Dimensions.get("window").width;
+const paymentOptionCardWidth = screenWidth / 2 - 30;
+const paymentOptionCardHeight = paymentOptionCardWidth * 0.65;
+const PaymentOptionContainer = ({ children }: { children: React.ReactNode }) => {
+ return (
+
+ {children}
+
+ );
+};
+
+export default PaymentsOptionsRendererTwoColumn;