diff --git a/src/screens/Faq/components/Instance.js b/src/screens/Faq/components/Instance.js
index cb663c1..64bbaca 100644
--- a/src/screens/Faq/components/Instance.js
+++ b/src/screens/Faq/components/Instance.js
@@ -1,10 +1,4 @@
-import {
-  View,
-  Text,
-  Dimensions,
-  TouchableOpacity,
-  Appearance,
-} from "react-native";
+import { View, Text, TouchableOpacity } from "react-native";
 import { Entypo } from "@expo/vector-icons";
 import { connect } from "react-redux";
 //style
@@ -12,26 +6,19 @@ import tw from "tailwind-rn";
 import fontSize from "../../../constants/fontSize";
 import Colors from "../../../constants/Colors";
 
-const { width } = Dimensions.get("window");
-
-function Instance({ question, selectFaq, mobile }) {
-  const colorScheme = Appearance.getColorScheme();
+function Instance({ question, selectFaq, mobile, theme }) {
   return (
     <TouchableOpacity
       onPress={() => selectFaq(question.id)}
       style={[
-        tw(
-          `w-full flex  my-1.5 rounded-md px-4 ${
-            mobile ? "py-2" : "py-3"
-          }`
-        ),
+        tw(`w-full flex  my-1.5 rounded-md px-4 ${mobile ? "py-2" : "py-3"}`),
         {
           backgroundColor: !question.active
             ? "#F9F9F9"
-            : Colors.theme1[colorScheme].greenCF + "0a",
+            : Colors.theme1[theme].greenCF + "0a",
           borderColor: !question.active
             ? "#DBDBDB"
-            : Colors.theme1[colorScheme].greenCF,
+            : Colors.theme1[theme].greenCF,
           borderWidth: 1.5,
         },
       ]}
@@ -42,7 +29,7 @@ function Instance({ question, selectFaq, mobile }) {
             {
               width: "90%",
               textAlign: "right",
-              color: Colors.theme1[colorScheme].green79,
+              color: Colors.theme1[theme].green79,
               fontSize: mobile ? fontSize.tiny : fontSize.lg,
               fontFamily: "bold",
             },
@@ -51,17 +38,9 @@ function Instance({ question, selectFaq, mobile }) {
           {question.title}
         </Text>
         {question.active ? (
-          <Entypo
-            name="minus"
-            size={18}
-            color={Colors.theme1[colorScheme].green79}
-          />
+          <Entypo name="minus" size={18} color={Colors.theme1[theme].green79} />
         ) : (
-          <Entypo
-            name="plus"
-            size={18}
-            color={Colors.theme1[colorScheme].green79}
-          />
+          <Entypo name="plus" size={18} color={Colors.theme1[theme].green79} />
         )}
       </View>
       {question.active && (
@@ -69,7 +48,7 @@ function Instance({ question, selectFaq, mobile }) {
           <Text
             style={[
               {
-                color: Colors.theme1[colorScheme].green79,
+                color: Colors.theme1[theme].green79,
                 fontSize: mobile ? fontSize.tiny : fontSize.lg,
                 fontFamily: "light",
               },
@@ -86,6 +65,7 @@ function Instance({ question, selectFaq, mobile }) {
 
 const mapStateToProps = (state) => ({
   mobile: state.publicApi.mobile,
+  theme: state.publicApi.theme,
 });
 
 export default connect(mapStateToProps)(Instance);
diff --git a/src/screens/Faq/index.js b/src/screens/Faq/index.js
index 0374dc4..d38eb0a 100644
--- a/src/screens/Faq/index.js
+++ b/src/screens/Faq/index.js
@@ -1,13 +1,11 @@
-import React, { useState, useEffect } from "react";
+import React, { useEffect } from "react";
 import {
   View,
-  StyleSheet,
   Dimensions,
   ScrollView,
   SafeAreaView,
   Platform,
   StatusBar,
-  LayoutAnimation,
 } from "react-native";
 import { connect } from "react-redux";
 import { faq } from "../../redux/actions";