diff --git a/src/components/Contact/Forms.js b/src/components/Contact/Forms.js
index f1e7f53..3f2f19a 100644
--- a/src/components/Contact/Forms.js
+++ b/src/components/Contact/Forms.js
@@ -1,40 +1,92 @@
-import React from 'react';
+import React, {useState} from 'react';
 import getConfig from './../../Config/config'
 import ContactData from '../../Services/ContactData';
 
 
 function Forms() {
 
-    var site = getConfig()[0];
+    const [formDetails, setFormDetails] = useState({
+        first_name: '',
+        last_name: '',
+        email: '',
+        subject: '',
+        phone_number: '',
+        action: 1001,
+        message: '',
+        channel: 'WEB',
+        terms_conditions: false
+    })
 
-    function handleSubmit(e) {
-        e.preventDefault();
-      //  console.log('You clicked submit.');
-      //  console.log(e);
-       // debugger;
-        const firstname = e.target['f-name'].value;
-        const lastname = e.target['l-name'].value;
-        const email = e.target['email'].value;
-        const phone = e.target['phone'].value;
-        const subject = e.target['subject'].value;
-        const message =  e.target['message'].value;
-        const terms =   e.target['terms-conditions'].checked;
-//alert(terms);
-
-        var callData = [{
-            "firstname": firstname,
-            "lastname": lastname,
-            "email": email,
-            "phone": phone,
-            "subject": subject,
-            "message": message,
-            "channel": 'WEB'
-        }];
-
-       const callRet = ContactData(callData);
-       console.log('You clicked submit========> '+ callRet);
+    
+    const handleChange = ({target:{name, value}}) => {
+        if(name == 'terms_conditions'){
+            setFormDetails(prev => ({...prev, [name]:!prev.terms_conditions}))
+        }else{
+            setFormDetails(prev => ({...prev, [name]:value}))
+        }
     }
+    
+    const [requestStatus, setRequestStatus] = useState({loading:false, status:false, msg:''})
+    
+    const validForm = formDetails.first_name && formDetails.last_name && formDetails.email && formDetails.phone_number && formDetails.subject && formDetails.message
+    function handleSubmit(e) {
+        e.preventDefault()
+        const isChecked = formDetails.terms_conditions
+        setRequestStatus({loading:true, status:false, msg:''})
+        if(!validForm){
+            setRequestStatus({loading:false, status:false, msg:'Please, fill all fields'})
+            setTimeout(()=>{
+                setRequestStatus({loading:false, status:false, msg:''})
+            },3000)
+            return
+        }
+        if(!(/^\d{7,15}$/.test(formDetails.phone_number))){
+            setRequestStatus({loading:false, status:false, msg:'Please, enter a valid phone number'})
+            setTimeout(()=>{
+                setRequestStatus({loading:false, status:false, msg:''})
+            },3000)
+            return
+        }
+        if(!isChecked){
+            setRequestStatus({loading:false, status:false, msg:'Please, Accept Terms & Conditions'})
+            setTimeout(()=>{
+                setRequestStatus({loading:false, status:false, msg:''})
+            },3000)
+            return
+        }
 
+        delete formDetails.terms_conditions
+
+       ContactData(formDetails).then(res =>{
+        if(res?.data?.result != '100'){
+            setRequestStatus({loading:false, status:false, msg:'failed to send message'})
+            setTimeout(()=>{
+                setRequestStatus({loading:false, status:false, msg:''})
+            },3000)
+            return
+        }
+        setRequestStatus({loading:false, status:true, msg:'message Sent'})
+        setTimeout(()=>{
+            setRequestStatus({loading:false, status:false, msg:''})
+            setFormDetails({
+                first_name: '',
+                last_name: '',
+                email: '',
+                subject: '',
+                phone_number: '',
+                action: 1001,
+                message: '',
+                channel: 'WEB',
+                terms_conditions: false
+            })
+        },3000)
+       }).catch(err => {
+        setRequestStatus({loading:false, status:false, msg:'failed something went wrong'})
+        setTimeout(()=>{
+            setRequestStatus({loading:false, status:false, msg:''})
+        },3000)
+       });
+    }
 
 
     return (
@@ -46,7 +98,7 @@ function Forms() {
                             <div className="contact--info-area">
                                 <h3>Get in touch</h3>
                                 <p>Looking for help? Fill the form and start a new discussion.</p>
-                                <div className="single-info">
+                                {/* <div className="single-info">
                                     <h5>Headquaters</h5>
                                     <p>
                                         <i className="fal fa-home"></i>
@@ -57,9 +109,8 @@ function Forms() {
                                         <i className="fal fa-home"></i>
                                           {process.env.REACT_APP_SUPPORT_US_ADDRESS}
                                     </p>
-
-                                </div>
-                                <div className="single-info">
+                                </div> */}
+                                {/* <div className="single-info">
                                     <h5>Phone</h5>
                                     <p>
                                         <i className="fal fa-phone"></i>
@@ -67,7 +118,7 @@ function Forms() {
                                         <br />
                                         {process.env.REACT_APP_SUPPORT_PHONE}
                                     </p>
-                                </div>
+                                </div> */}
                                 <div className="single-info">
                                     <h5>Support</h5>
                                     <p>
@@ -98,47 +149,64 @@ function Forms() {
                                 <h4>Let’s Connect</h4>
                                 <form onSubmit={handleSubmit} className="row">
                                     <div className="col-md-6">
-                                        <input type="text" name="f-name" placeholder="First Name"  maxLength={15} />
+                                        <input type="text" name="first_name" placeholder="First Name"  maxLength={15} onChange={handleChange} value={formDetails.first_name} />
                                     </div>
                                     <div className="col-md-6">
-                                        <input type="text" name="l-name" placeholder="Last Name"  maxLength={15} />
+                                        <input type="text" name="last_name" placeholder="Last Name"  maxLength={15} onChange={handleChange} value={formDetails.last_name} />
                                     </div>
                                     <div className="col-md-6">
                                         <input
                                             type="email"
                                             name="email"
                                             placeholder="Email Address" 
-                                            maxLength={35} 
+                                            maxLength={55} 
+                                            onChange={handleChange}
+                                            value={formDetails.email}
                                         />
                                     </div>
                                     <div className="col-md-6">
                                         <input
-                                            type="number"
-                                            name="phone"
+                                            type="text"
+                                            name="phone_number"
                                             placeholder="Phone Number" 
                                             maxLength={15} 
+                                            onChange={handleChange}
+                                            value={formDetails.phone_number}
                                         />
                                     </div>
                                     <div className="col-md-12">
-                                        <input type="text" name="subject" placeholder="Subject"  maxLength={35}  />
+                                        <input type="text" name="subject" placeholder="Subject"  maxLength={150} value={formDetails.subject} onChange={handleChange}  />
                                     </div>
                                     <div className="col-md-12">
                                         <textarea
                                             name="message"
                                             placeholder="How can we help?"
+                                            onChange={handleChange}
+                                            value={formDetails.message}
+                                            maxLength={350}
                                         ></textarea>
                                     </div>
                                     <div className="col-md-6">
                                         <div className="condition-check">
-                                            <input id="terms-conditions" name="terms-conditions" type="checkbox" />
+                                            <input id="terms-conditions" name="terms_conditions" type="checkbox" value={formDetails.terms_conditions} onChange={handleChange} />
                                             <label htmlFor="terms-conditions">
                                                 I agree to the <a href="#">Terms & Conditions</a>
                                             </label>
                                         </div>
                                     </div>
                                     <div className="col-md-6 text-right">
-                                        <input type="submit" name="submit" value="Send Message" />
+                                        <input 
+                                            type="submit"  
+                                            value={ requestStatus.loading ? 'Sending...' : 'Send Message'} 
+                                            disabled={requestStatus.loading} 
+                                            className={`${!validForm ? 'opacity-25' : 'opacity-100'}`}
+                                        />
                                     </div>
+                                    {/* <div className="p-2 col-12">
+                                        {requestStatus.msg &&
+                                        }
+                                    </div> */}
+                                    <p className={`p-1 w-100 text-center ${requestStatus.status ? 'text-success' : 'text-danger'}`}>{requestStatus.msg}</p>
                                 </form>
                             </div>
                         </div>
diff --git a/src/components/HomeOne/FooterHomeOne.js b/src/components/HomeOne/FooterHomeOne.js
index b25310f..491b449 100644
--- a/src/components/HomeOne/FooterHomeOne.js
+++ b/src/components/HomeOne/FooterHomeOne.js
@@ -25,7 +25,7 @@ function FooterHomeOne({ className }) {
                 <a href="/service">
                   Read More <i className="fal fa-arrow-right" />
                 </a>
-                <div className="social mt-30">
+                {/* <div className="social mt-30">
                   <ul>
                     <li>
                       <a href={site.facebook_link}>
@@ -38,8 +38,7 @@ function FooterHomeOne({ className }) {
                       </a>
                     </li>
                   </ul>
-                </div>
-
+                </div> */}
               </div>
             </div>
             <div className="col-lg-2 col-md-6">
@@ -96,20 +95,37 @@ function FooterHomeOne({ className }) {
                       <i className="fal fa-envelope" /> {site.support_email}
                     </a>
                   </li>
-                  {/*<li>*/}
-                  {/*  <a href="#">*/}
-                  {/*    <i className="fal fa-phone" />  404-855-7966*/}
-                  {/*  </a>*/}
-                  {/*</li>*/}
-                  {/*<li>*/}
-                  {/*  <a href="#">*/}
-                  {/*    <i className="fal fa-map-marker-alt" />Atlanta, GA 30339*/}
-                  {/*  </a>*/}
-                  {/*</li>*/}
+                  {/* <li>
+                    <a href="#">
+                      <i className="fal fa-phone" />  404-855-7966
+                    </a>
+                  </li>
+                  <li>
+                    <a href="#">
+                      <i className="fal fa-map-marker-alt" />Atlanta, GA 30339
+                    </a>
+                  </li> */}
                 </ul>
               </div>
+              <div className='footer-about-widget'>
+                <div className="social mt-30">
+                  <ul>
+                    <li>
+                      <a href={site.facebook_link}>
+                        <i className="fab fa-facebook-f" />
+                      </a>
+                    </li>
+                    <li>
+                      <a className="twi" href={process.env.REACT_APP_TWITTER_LINK}>
+                        <i className="fab fa-x-twitter"></i>
+                      </a>
+                    </li>
+                  </ul>
+                </div>
+              </div>
             </div>
           </div>
+                
           <div className="row">
             <div className="col-lg-12">
               <div className="footer-copyright d-flex align-items-center justify-content-between pt-2">