diff --git a/10_React_Project_Folder_Structure/10_react_project_folder_structure_boilerplate/src/components/main/Main.js b/10_React_Project_Folder_Structure/10_react_project_folder_structure_boilerplate/src/components/main/Main.js
index 5c1c9bbc31..9dd423dd4d 100644
--- a/10_React_Project_Folder_Structure/10_react_project_folder_structure_boilerplate/src/components/main/Main.js
+++ b/10_React_Project_Folder_Structure/10_react_project_folder_structure_boilerplate/src/components/main/Main.js
@@ -3,19 +3,9 @@ import Button from '../shared/Button'
 import HexaColr from '../color/HexaColor'
 import Country from '../country/Country'
 import UserCard from '../user/UserCard'
+import { buttonStyles } from '../../styles/button-styles'
+
 
-// CSS styles in JavaScript Object
-const buttonStyles = {
-  backgroundColor: '#61dbfb',
-  padding: 10,
-  border: 'none',
-  borderRadius: 5,
-  margin: 3,
-  cursor: 'pointer',
-  fontSize: 22,
-  color: 'white',
-  margin: '0 auto',
-}
 // TechList Component
 // class base component
 class TechList extends React.Component {
diff --git a/10_React_Project_Folder_Structure/10_react_project_folder_structure_boilerplate/src/styles/button-styles.js b/10_React_Project_Folder_Structure/10_react_project_folder_structure_boilerplate/src/styles/button-styles.js
new file mode 100644
index 0000000000..87b54344f0
--- /dev/null
+++ b/10_React_Project_Folder_Structure/10_react_project_folder_structure_boilerplate/src/styles/button-styles.js
@@ -0,0 +1,12 @@
+// CSS styles in JavaScript Object
+export const buttonStyles = {
+  backgroundColor: '#61dbfb',
+  padding: 10,
+  border: 'none',
+  borderRadius: 5,
+  margin: 3,
+  cursor: 'pointer',
+  fontSize: 22,
+  color: 'white',
+  margin: '0 auto',
+}