diff --git a/src/assets/img/logo.png b/src/assets/img/logo.png
deleted file mode 100644
index 9e631a0..0000000
Binary files a/src/assets/img/logo.png and /dev/null differ
diff --git a/src/assets/img/logo.webp b/src/assets/img/logo.webp
new file mode 100644
index 0000000..652f553
Binary files /dev/null and b/src/assets/img/logo.webp differ
diff --git a/src/assets/img/logo2.jpg b/src/assets/img/logo2.jpg
deleted file mode 100644
index 09bdc3a..0000000
Binary files a/src/assets/img/logo2.jpg and /dev/null differ
diff --git a/src/assets/img/logo3.jpg b/src/assets/img/logo3.jpg
deleted file mode 100644
index 2c2c884..0000000
Binary files a/src/assets/img/logo3.jpg and /dev/null differ
diff --git a/src/components/common/VideoPlayer/Components/VideoControls-State.ts b/src/components/common/VideoPlayer/Components/VideoControls-State.ts
index 4f7b59b..2368473 100644
--- a/src/components/common/VideoPlayer/Components/VideoControls-State.ts
+++ b/src/components/common/VideoPlayer/Components/VideoControls-State.ts
@@ -149,11 +149,11 @@ export const useVideoControlsState = (
     togglePlay();
   };
 
+  const firstPlay = useSignal(true);
   const handleCanPlay = () => {
+    if (firstPlay.value) setPlaying(true); // makes the video play when fully loaded
+    firstPlay.value = false;
     isLoading.value = false;
-    canPlay.value = true;
-    updatePlaybackRate(playbackRate.value);
-    setPlaying(true); // makes the video play when fully loaded
   };
 
   const setPlaying = async (setPlay: boolean) => {
diff --git a/src/components/common/VideoPlayer/VideoPlayer-State.ts b/src/components/common/VideoPlayer/VideoPlayer-State.ts
index 33accd5..d338886 100644
--- a/src/components/common/VideoPlayer/VideoPlayer-State.ts
+++ b/src/components/common/VideoPlayer/VideoPlayer-State.ts
@@ -110,15 +110,6 @@ export const useVideoPlayerState = (props: VideoPlayerProps, ref: any) => {
   const toggleRef = useRef<any>(null);
   const { downloadVideo } = useContext(MyContext);
 
-  if (resourceStatus?.status === "READY") {
-    canPlay.value = true;
-    isLoading.value = false;
-    //startPlay.value = true;
-
-    // playing.value = false;
-    // videoRef.current.pause();
-  }
-
   const onProgressChange = async (_: any, value: number | number[]) => {
     if (!videoRef.current) return;
     videoRef.current.currentTime = value as number;
@@ -142,6 +133,14 @@ export const useVideoPlayerState = (props: VideoPlayerProps, ref: any) => {
     progress.value = videoRef.current.currentTime;
   };
 
+  const videoCanPlayIfDownloaded = () => {
+    if (resourceStatus?.status === "READY") {
+      canPlay.value = true;
+    }
+  };
+
+  videoCanPlayIfDownloaded();
+
   const getSrc = React.useCallback(async () => {
     if (!name || !identifier || !service || !jsonId || !user) return;
     try {
diff --git a/src/components/common/VideoPlayer/VideoPlayer-styles.ts b/src/components/common/VideoPlayer/VideoPlayer-styles.ts
index 01dd4c8..87c56d8 100644
--- a/src/components/common/VideoPlayer/VideoPlayer-styles.ts
+++ b/src/components/common/VideoPlayer/VideoPlayer-styles.ts
@@ -11,7 +11,6 @@ export const VideoContainer = styled(Box)(({ theme }) => ({
   height: "100%",
   margin: 0,
   padding: 0,
-
   "&:focus": { outline: "none" },
 }));
 
diff --git a/src/pages/ContentPages/VideoContent/VideoContent-State.ts b/src/pages/ContentPages/VideoContent/VideoContent-State.ts
index f3519ae..0ed47d1 100644
--- a/src/pages/ContentPages/VideoContent/VideoContent-State.ts
+++ b/src/pages/ContentPages/VideoContent/VideoContent-State.ts
@@ -236,11 +236,17 @@ export const useVideoContentState = () => {
     if (!nameAddress || !id) return;
     getComments(id, nameAddress);
   }, [getComments, id, nameAddress]);
-  const subList = useSelector(
-    (state: RootState) => state.persist.subscriptionList
-  );
 
-  const focusVideo = (e: React.MouseEvent<HTMLDivElement>) => {
+  const focusVideo = () => {
+    const focusRef = containerRef.current?.getContainerRef()?.current;
+    focusRef?.focus({ preventScroll: true });
+  };
+
+  useEffect(() => {
+    focusVideo();
+  });
+
+  const focusVideoOnClick = (e: React.MouseEvent<HTMLDivElement>) => {
     console.log("in focusVideo");
     const target = e.target as Element;
 
@@ -259,12 +265,11 @@ export const useVideoContentState = () => {
 
     if (target == e.currentTarget || clickOnEmptySpace) {
       console.log("in correctTarget");
-      const focusRef = containerRef.current?.getContainerRef()?.current;
-      focusRef.focus({ preventScroll: true });
+      focusVideo();
     }
   };
   return {
-    focusVideo,
+    focusVideo: focusVideoOnClick,
     videoReference,
     channelName,
     id,
diff --git a/src/pages/ContentPages/VideoContent/VideoContent.tsx b/src/pages/ContentPages/VideoContent/VideoContent.tsx
index 222ec82..810b05e 100644
--- a/src/pages/ContentPages/VideoContent/VideoContent.tsx
+++ b/src/pages/ContentPages/VideoContent/VideoContent.tsx
@@ -68,9 +68,8 @@ export const VideoContent = () => {
       <Box
         sx={{
           display: "flex",
-          marginLeft: "5%",
           flexDirection: "column",
-          padding: "0px 10px",
+          padding: "0px 10px 0px 5%",
         }}
         onClick={focusVideo}
       >