diff --git a/pages/Gallery.js b/pages/Gallery.js
index 2e07d0a..4fa30a5 100644
--- a/pages/Gallery.js
+++ b/pages/Gallery.js
@@ -1,7 +1,7 @@
-import React, { useEffect, useState} from 'react';
+import React, { useEffect, useState } from 'react';
 import axios from "axios";
 import AppContainer from "./appContainer";
-import {AppFile, AppUrl} from "../lib/api";
+import { AppFile, AppUrl } from "../lib/api";
 import Image from "next/image";
 import dynamic from "next/dynamic";
 import { Suspense } from 'react'
@@ -12,8 +12,8 @@ import {
     MDBContainer,
     MDBRow,
 } from "mdb-react-ui-kit";
-import  {LightBox} from "react-lightbox-pack";
-import {Button, Divider, Tab, TabList, TabPanel, TabPanels, Tabs} from "@chakra-ui/react";
+import { LightBox } from "react-lightbox-pack";
+import { Button, Divider, Tab, TabList, TabPanel, TabPanels, Tabs } from "@chakra-ui/react";
 
 const APV = dynamic(() => import('./components/Videos'), {
     ssr: false,
@@ -40,25 +40,25 @@ const toBase64 = (str) =>
 const Gallery = (dataImage) => {
     const [Images, SetImages] = useState(dataImage)
     const [justifyActive, setJustifyActive] = React.useState('tab1');
-    const [toggle, setToggle] =  React.useState(false);
-    const [sIndex, setSIndex] =  React.useState(0);
-    const [filterId, setFilterId] =  React.useState(1);
-    const Parallax = ({  quality }) => {
+    const [toggle, setToggle] = React.useState(false);
+    const [sIndex, setSIndex] = React.useState(0);
+    const [filterId, setFilterId] = React.useState(1);
+    const Parallax = ({ quality }) => {
         return `../resource/parallax/Gallery.jpg`;
     }
     const Filter = async (filter) => {
         const res = await axios.get(AppUrl(`FilterGalleyImages/${filter}`));
-        SetImages({dataImage : res.data})
+        SetImages({ dataImage: res.data })
         setFilterId(filter)
     }
-    
+
     const AllImage = async () => {
         const res = await axios.get(AppUrl(`GetGalleyImages`));
-        SetImages({dataImage: res.data})
+        SetImages({ dataImage: res.data })
     }
 
     // Handler
-    const  lightBoxHandler  = (state, sIndex) => {
+    const lightBoxHandler = (state, sIndex) => {
         setToggle(state);
         setSIndex(sIndex);
     };
@@ -88,7 +88,7 @@ const Gallery = (dataImage) => {
             </style>
             <AppContainer>
                 <div className="parallax-container">
-                    <h1  className={'center-align text-white header_back service-text dana font-weight-bold'}> گالری بیمارستان  </h1>
+                    <h1 className={'center-align text-white header_back service-text dana font-weight-bold'}> گالری بیمارستان  </h1>
                     <Image
                         loader={Parallax}
                         src="Parallax.png"
@@ -98,68 +98,61 @@ const Gallery = (dataImage) => {
                         alt="درباره بیارستان مهر ایرانیان پرند "
                         width={3000}
                         height={1300}
-                     />
+                    />
                 </div>
-                <div className='lg:mx-20 sm:mx-5'>          
-                             <Tabs defaultIndex={1} className={'mt-5'} isFitted variant='enclosed'>
-                       <TabList mb='1em'>
-                           {/* <Tab on className={'bk font-weight-bold'} _selected={{ color: 'white', bg: 'teal.500' }}>ویدئو ها</Tab> */}
-                           <Tab  className={'bk font-weight-bold'}  _selected={{ color: 'white', bg: 'teal.500' }}>تصاویر</Tab>
-                       </TabList>
-                       <TabPanels>
-                           <TabPanel>
-                               <APV />
-                           </TabPanel>
-                           <TabPanel>
-                               <div style={{ flexDirection: 'column' }} className={'flex justify-content-end flex-xl-row flex-lg-row flex-md-column flex-sm-column'}>
-                                   <MDBBtn onClick={() => Filter(2)} color={filterId === 2 ? 'light' : 'light'} className={filterId === 2 ? 'm-2' : 'm-2 text-dark'}>تصاویر در حال ساخت</MDBBtn>
-                                   <MDBBtn onClick={() => Filter(1)} color={filterId === 1 ? 'light' : 'light'} className={'m-2'}>تصاویر معماری</MDBBtn>
-                                   <MDBBtn onClick={() => AllImage()} color={filterId !== 1 && 2 ? 'light' : 'light'} className={'m-2'}>همه تصاویر </MDBBtn>
-                               </div>
-                               <Divider colorScheme={'gray'} />
-                               <MDBRow style={{ marginTop: 10 }}>
-                                   {Images && Images.dataImage.map((image ,index)=> {
-                                       return (
-                                           <MDBCol xs={12} sm={12} md={6} lg={3}>
-                                               <div className={'cardImage'} key={image.id}>
-                                                   <img
-                                                       key={image.id}
-                                                       alt={image.title}
-                                                       width={350}
-                                                       style={{ cursor: 'zoom-in' }}
-                                                       className={'responsive-img'}
-                                                       src={AppFile(`panel-public/uploads/HospitalGallery/${image.imageAddr}`)}
-                                                       onClick={() => {
-                                                           lightBoxHandler(true, index);
-                                                       }}
-                                                   />
-                                                   <br />
-                                                   <span>{ image.title }</span>
-                                               </div>
-                                           </MDBCol>
-                                       )
-                                   })}
-                               </MDBRow>
-                           </TabPanel>
-                       </TabPanels>
-                   </Tabs>
+                <div className='lg:mx-20 sm:mx-5'>
+                    <Tabs defaultIndex={1} className={'mt-5'} isFitted variant='enclosed'>
+                        <TabList mb='1em'>
+                            {/* <Tab on className={'bk font-weight-bold'} _selected={{ color: 'white', bg: 'teal.500' }}>ویدئو ها</Tab> */}
+                            <Tab className={'bk font-weight-bold'} _selected={{ color: 'white', bg: 'teal.500' }}>تصاویر</Tab>
+                        </TabList>
 
-                   <LightBox
-                       state={toggle}
-                       event={lightBoxHandler}
-                       data={Images.dataImage}
-                       imageWidth="60vw"
-                       imageHeight="70vh"
-                       thumbnailHeight={50}
-                       thumbnailWidth={50}
-                       setImageIndex={setSIndex}
-                       imageIndex={sIndex}
-                   />
-                   <br />
-                   <br />
-                   <br />
-                   <br />
-               </div>
+                    </Tabs>
+                    <div style={{ flexDirection: 'column' }} className={'flex justify-content-end flex-xl-row flex-lg-row flex-md-column flex-sm-column'}>
+                        <MDBBtn onClick={() => Filter(2)} color={filterId === 2 ? 'light' : 'light'} className={filterId === 2 ? 'm-2' : 'm-2 text-dark'}>تصاویر در حال ساخت</MDBBtn>
+                        <MDBBtn onClick={() => Filter(1)} color={filterId === 1 ? 'light' : 'light'} className={'m-2'}>تصاویر معماری</MDBBtn>
+                        <MDBBtn onClick={() => AllImage()} color={filterId !== 1 && 2 ? 'light' : 'light'} className={'m-2'}>همه تصاویر </MDBBtn>
+                    </div>
+                    <Divider colorScheme={'gray'} />
+                    <MDBRow style={{ marginTop: 10 }}>
+                        {Images && Images.dataImage.map((image, index) => {
+                            return (
+                                <MDBCol xs={12} sm={12} md={6} lg={3}>
+                                    <div className={'cardImage'} key={image.id}>
+                                        <img
+                                            key={image.id}
+                                            alt={image.title}
+                                            width={350}
+                                            style={{ cursor: 'zoom-in' }}
+                                            className={'responsive-img'}
+                                            src={AppFile(`panel-public/uploads/HospitalGallery/${image.imageAddr}`)}
+                                            onClick={() => {
+                                                lightBoxHandler(true, index);
+                                            }}
+                                        />
+                                        <br />
+                                        <span>{image.title}</span>
+                                    </div>
+                                </MDBCol>
+                            )
+                        })}
+                    </MDBRow>
+                    <LightBox
+                        state={toggle}
+                        event={lightBoxHandler}
+                        data={Images.dataImage}
+                        imageWidth="60vw"
+                        imageHeight="70vh"
+                        thumbnailHeight={50}
+                        thumbnailWidth={50}
+                        setImageIndex={setSIndex}
+                        imageIndex={sIndex}
+                    />
+                    <br />
+                    <br />
+                    <br />
+                    <br />
+                </div>
             </AppContainer>
 
         </div>
@@ -169,7 +162,7 @@ export async function getServerSideProps(context) {
     const res = await axios.get(AppUrl('GetGalleyImages'));
     return {
         props: {
-            dataImage : res.data
+            dataImage: res.data
         }, // will be passed to the page component as props
     }
 }