diff --git a/src/component/Contact/Main.js b/src/component/Contact/Main.js
index 1c4855d..7b65228 100644
--- a/src/component/Contact/Main.js
+++ b/src/component/Contact/Main.js
@@ -1,11 +1,25 @@
-import React, { useEffect } from "react";
+import React, { useEffect, useState } from "react";
 import { Link } from "react-router-dom";
 import Bredcrumb from "../Bredcrumb/Main";
 import BGImg from "../../assets/images/bread_crumb_bg.png";
 import BGImg1 from "../../assets/images/bread_crumb_bg_one.png";
 import BGImg2 from "../../assets/images/bread_crumb_bg_two.png";
 
+import SiteService from "../../vendors/service/siteService";
+
 const Main = ({ brdcum }) => {
+  let [countries, setCountries] = useState([]) // initial state for country dropdown
+  let countryClass = new SiteService() // instantiating the class
+  
+  const allCountry = () => {
+    return countryClass.countryData();
+  }
+
+  //CALLS THE API AFTER COMPONENT LOADS
+  useEffect(()=>{
+    allCountry().then((data)=> setCountries(Object.values(data.data)))
+  },[])
+
   return (
     <>
       {brdcum.b1 && (
@@ -86,6 +100,7 @@ const Main = ({ brdcum }) => {
                 <div className="form-group">
                   <select className="form-control">
                     <option value="">Country</option>
+                    {countries.length > 0 && countries.map((country, index) => <option key={index} value={country}>{country}</option>)}
                   </select>
                 </div>
                 <div className="form-group">
diff --git a/src/vendors/service/siteService.js b/src/vendors/service/siteService.js
index 7b56d62..dbea9f4 100644
--- a/src/vendors/service/siteService.js
+++ b/src/vendors/service/siteService.js
@@ -9,7 +9,9 @@ class SiteService {
     return this.getAuxEnd("blogdata", null);
   }
 
-  countryData() {}
+  countryData() {
+    return this.getAuxEnd("/country", null);
+  }
 
   faqData() {}
   
@@ -20,11 +22,11 @@ class SiteService {
   //----------------------------------------  -----
   getAuxEnd(uri, reqData) {
     const endPoint = process.env.REACT_APP_AUX_ENDPOINT + uri;
-    Axios.get(endPoint)
+    return Axios.get(endPoint)
       .then((response) => {
-        console.log(response);
-        res = response;
-        console.log("~~~~~~~ Toks2 GET ~~~~~~~~");
+        // console.log(response);
+        // res = response;
+        // console.log("~~~~~~~ Toks2 GET ~~~~~~~~");
         return response;
       })
       .catch((error) => {
@@ -41,12 +43,12 @@ class SiteService {
       });
   }
 
-  getAuxEnd(uri, reqData) {
+  postAuxEnd(uri, reqData) {
     const endPoint = process.env.REACT_APP_AUX_ENDPOINT + uri;
     Axios.post(endPoint)
       .then((response) => {
         console.log(response);
-        res = response;
+        // res = response;
         console.log("~~~~~~~ Toks2 POST ~~~~~~~~");
         return response;
       })