diff --git a/src/plan.py b/src/plan.py
index 63fa172278cea0cf33a3c8b410136464123e23f3..ce7366767afd009f26c3589d76cdb177cf1c06d2 100644
--- a/src/plan.py
+++ b/src/plan.py
@@ -3,9 +3,8 @@ import sys
 
 from PyQt6.QtCore import Qt
 from PyQt6.QtGui import QPixmap, QCursor, QFont
-from PyQt6.QtWidgets import (QApplication, QWidget, QLabel, QHBoxLayout, QVBoxLayout, QPushButton, QScrollArea)
+from PyQt6.QtWidgets import QApplication, QWidget, QLabel, QHBoxLayout, QVBoxLayout, QPushButton, QScrollArea
 
-# COLORS PALLETE
 BACKGROUNDCOLOR = '#5A8D6C'
 BUTTONCOLOR = '#174728'
 TEXTCOLOR = '#EEEEE2'
@@ -38,6 +37,7 @@ class plan(QWidget):
         buttonFont = QFont()
         buttonFont.setFamily('Segoe UI')
         buttonFont.setPointSize(18)
+        buttonFont.setBold(True)
 
         # Style sheets
         styleSheetNavbar0 = (f'''
@@ -47,6 +47,9 @@ class plan(QWidget):
                 border: none;
                 border-radius: 20px;
             }}
+            QPushButton:hover {{
+                color: {BUTTONCOLOR};
+            }}
         ''')
 
         styleSheetNavbar1 = (f'''
@@ -58,46 +61,55 @@ class plan(QWidget):
             }}
         ''')
 
-        styleSheetBigCard = (
-            "background-color: #D2DCC4;"
-            "border-radius: 20px;"
+        styleSheetSmallCard = (
+            '''
+            QPushButton {
+                background-color:  #5A8D6C;
+                border: 1.2px solid rgba(255, 255, 255, 0.8);
+                border-radius: 20px;
+            }
+            QPushButton:hover {
+                background-color: #174728;
+                border: 1.2px solid rgba(255, 255, 255, 0.8);
+            }
+            '''
         )
 
-        styleSheetSmallCard = (
-            "color: #5A8D6C;"
+        styleSheetBigCard = (
             "background-color: #D2DCC4;"
             "border-radius: 20px;"
         )
 
-        styleSheet2 = (
+        styleSheet = (
             "color: #5A8D6C;"
             "background-color: #D2DCC4;"
             "border-radius: 20px;"
         )
-        styleSheet4 = (
-            "color: #EEEEE2;"
-            "background-color: #174728;"
-            "border-radius: 20px;"
+        styleSheetStart = (
         f'''
             QPushButton {{
                 color: {TEXTCOLOR};
                 background-color: {BACKGROUNDCOLOR};
-                border: none;
+                border: 1.2px solid rgba(255, 255, 255, 0.8);
                 border-radius: 20px;
             }}
+            QPushButton:hover {{
+                background-color: {BUTTONCOLOR};
+            }}
         ''')
-
-        styleSheetCard = (
-            "background-color: #5A8D6C;"
-            "border-radius: 20px;"
-        )
         
-        styleSheet6 = (f'''
+        styleSheetCutomize = (f'''
+            QPushButton {{
             background-color: {CARDCOLOR};
             color: {BUTTONCOLOR};
             border: none;
             border-radius: 20px;
             text-decoration: underline;
+            }}
+            QPushButton:hover {{
+            background-color: {CARDCOLOR};
+            color: {BACKGROUNDCOLOR};
+            }}
         ''')
 
         verticallScrollBarStyle = (""" 
@@ -162,8 +174,7 @@ class plan(QWidget):
         homeButton.setFont(buttonFont)
         homeButton.setFixedSize(96, 42)
         homeButton.move(507, 53)    
-        homeButton.setCursor(
-            QCursor(Qt.CursorShape.PointingHandCursor))
+        homeButton.setCursor(QCursor(Qt.CursorShape.PointingHandCursor))
         
         # Customize Button
         customizeButton = QPushButton(self)
@@ -171,8 +182,7 @@ class plan(QWidget):
         customizeButton.setStyleSheet(styleSheetNavbar0)
         customizeButton.setFont(buttonFont)
         customizeButton.move(649, 58)
-        customizeButton.setCursor(
-            QCursor(Qt.CursorShape.PointingHandCursor))
+        customizeButton.setCursor(QCursor(Qt.CursorShape.PointingHandCursor))
         
         # Plan Button
         planButton = QPushButton(self)
@@ -188,8 +198,7 @@ class plan(QWidget):
         listButton.setStyleSheet(styleSheetNavbar0)
         listButton.setFont(buttonFont)
         listButton.move(898, 58)
-        listButton.setCursor(
-            QCursor(Qt.CursorShape.PointingHandCursor))
+        listButton.setCursor(QCursor(Qt.CursorShape.PointingHandCursor))
 
         # History Button
         historyButton = QPushButton(self)
@@ -197,8 +206,7 @@ class plan(QWidget):
         historyButton.setStyleSheet(styleSheetNavbar0)
         historyButton.setFont(buttonFont)
         historyButton.move(979, 58)
-        historyButton.setCursor(
-            QCursor(Qt.CursorShape.PointingHandCursor))   
+        historyButton.setCursor(QCursor(Qt.CursorShape.PointingHandCursor))   
 
         # Profile Picture
         profilePicture = QLabel(self)
@@ -233,15 +241,13 @@ class plan(QWidget):
             exButton = QPushButton(self)
             exButton.setStyleSheet(styleSheetSmallCard)
             exButton.setFixedSize(366, 99)
-            exButton.setStyleSheet("background-color: #5A8D6C; border-radius: 20px;")
             exButton.setFont(buttonFont)
-            exButton.setCursor(
-                QCursor(Qt.CursorShape.PointingHandCursor))
+            exButton.setCursor(QCursor(Qt.CursorShape.PointingHandCursor))
             exButton.clicked.connect(lambda state, index=i: showExercise(index))
             title = QLabel(exButton)
             title.setText(f'<font style="font-size:24px;" color="#D2DCC4"; font-family="Sogoe UI";><b>{data[i][1]}<b>')
             title.move(20, 15)
-            dur = QLabel(exButton)
+            title.setStyleSheet("background-color: transparent;")
 
             con = sqlite3.connect('fitu.db')
             c = con.cursor()
@@ -250,8 +256,10 @@ class plan(QWidget):
             c.close()
 
             predict = len(data2)
+            dur = QLabel(exButton)
             dur.setText(f'<font style="font-size:18px;" color="#D2DCC4"; font-family="Sogoe UI";>{predict} Minutes')
             dur.move(20, 50)
+            dur.setStyleSheet("background-color: transparent;")
             scrollLayout.addWidget(exButton)  
         scroll.setWidget(scrollWidget)
         
@@ -276,49 +284,47 @@ class plan(QWidget):
 
         # create a function to show exercise data based on index
         def showExercise(index):
-                clickedRowData = data[index][0]
-                con = sqlite3.connect('fitu.db')
-                c = con.cursor()
-                c.execute("SELECT title, repetition, duration, gif FROM latihan_program, daftar_latihan WHERE latihan_program.exercise_id = daftar_latihan.exercise_id AND latihan_program.program_id = ?", (clickedRowData,))
-                data2 = c.fetchall()
-                c.close()
-
-                # clear the exercise data list
-                exercise_data.clear()
-
-                # append new exercise data to the list
-                for i in range(len(data2)):
-                    exercise_data.append(data2[i])
-
-                # remove all widgets from scrollLayout2
-                for i in reversed(range(scrollLayout2.count())):
-                    scrollLayout2.itemAt(i).widget().setParent(None)
-
-                # create QLabel widgets for each exercise and add them to scrollLayout2
-                for i in range(len(exercise_data)):
-                    exLabel = QLabel(self)
-                    exLabel.setFixedSize(202, 270)
-                    exLabel.setStyleSheet("background-color: #5A8D6C; border-radius: 20px;")
-                    title = QLabel(exLabel)
-                    title.setText(f'<font style="font-size:24px;" color="#D2DCC4"; font-family="Sogoe UI";><b>{exercise_data[i][0]}<b>')
-                    title.move(20, 15)
-                    repDur = QLabel(exLabel)
-                    if exercise_data[i][1] == None:
-                        repDur.setText(f'<font style="font-size:18px;" color="#D2DCC4"; font-family="Sogoe UI";>{exercise_data[i][2]} Minutes')
-                    else:
-                        repDur.setText(f'<font style="font-size:18px;" color="#D2DCC4"; font-family="Sogoe UI";>{exercise_data[i][1]} Repetitions')
-                    repDur.move(20, 50)
-                    exPix = QPixmap(exercise_data[i][3])
-                    image = QLabel(exLabel)
-                    image.setPixmap(exPix)
-                    image.setScaledContents(True)
-                    image.move(20, 80)
-                    image.setFixedSize(160, 160)
-
-                    scrollLayout2.addWidget(exLabel)
-
-                # set the widget of scroll2 to scrollWidget2 to update the view
-                scroll2.setWidget(scrollWidget2)
+            clickedRowData = data[index][0]
+            con = sqlite3.connect('fitu.db')
+            c = con.cursor()
+            c.execute("SELECT title, repetition, duration, gif FROM latihan_program, daftar_latihan WHERE latihan_program.exercise_id = daftar_latihan.exercise_id AND latihan_program.program_id = ?", (clickedRowData,))
+            data2 = c.fetchall()
+            c.close()
+
+            # clear the exercise data list
+            exercise_data.clear()
+
+            # append new exercise data to the list
+            for i in range(len(data2)):
+                exercise_data.append(data2[i])
+
+            # remove all widgets from scrollLayout2
+            for i in reversed(range(scrollLayout2.count())):
+                scrollLayout2.itemAt(i).widget().setParent(None)
+
+            # create QLabel widgets for each exercise and add them to scrollLayout2
+            for i in range(len(exercise_data)):
+                exLabel = QLabel(self)
+                exLabel.setFixedSize(202, 270)
+                exLabel.setStyleSheet("background-color: #5A8D6C; border-radius: 20px;")
+                title = QLabel(exLabel)
+                title.setText(f'<font style="font-size:22px;" color="#D2DCC4"; font-family="Sogoe UI";><b>{exercise_data[i][0]}<b>')
+                title.move(20, 15)
+                repDur = QLabel(exLabel)
+                if exercise_data[i][1] == None:
+                    repDur.setText(f'<font style="font-size:18px;" color="#D2DCC4"; font-family="Sogoe UI";>{exercise_data[i][2]} Minutes')
+                else:
+                    repDur.setText(f'<font style="font-size:18px;" color="#D2DCC4"; font-family="Sogoe UI";>{exercise_data[i][1]} Repetitions')
+                repDur.move(20, 50)
+                exPix = QPixmap(exercise_data[i][3])
+                image = QLabel(exLabel)
+                image.setPixmap(exPix)
+                image.setScaledContents(True)
+                image.move(20, 80)
+                image.setFixedSize(160, 160)
+
+                scrollLayout2.addWidget(exLabel)
+            scroll2.setWidget(scrollWidget2)
             
         font = QFont()
         font.setFamily("Segoe UI")
@@ -334,38 +340,33 @@ class plan(QWidget):
         exText = QLabel(self)
         exText.setText("Workout Plan")
         exText.setFont(font)
-        exText.setStyleSheet(styleSheet2)
+        exText.setStyleSheet(styleSheet)
         exText.setFixedSize(250, 50)
         exText.move(140,185)
         
         progText = QLabel(self)
         progText.setText("Exercise")
-        progText.setStyleSheet(styleSheet2)
+        progText.setStyleSheet(styleSheet)
         progText.setFixedSize(165, 50)
         progText.setFont(font)
         progText.move(599, 182)
         
-
         startButton = QPushButton(self)
         startButton.setFont(font)
         startButton.setText("START >")
         startButton.move(1004, 620)
         startButton.setFixedSize(144, 42)
-        startButton.setStyleSheet(styleSheet4)
+        startButton.setStyleSheet(styleSheetStart)
         startButton.setFont(font1)
-        startButton.setCursor(
-            QCursor(Qt.CursorShape.PointingHandCursor))
+        startButton.setCursor(QCursor(Qt.CursorShape.PointingHandCursor))
 
         custButton = QPushButton(self)
         custButton.setFont(font)
         custButton.setText("Customize")
         custButton.move(825, 620)
-        custButton.setStyleSheet(styleSheet6)
+        custButton.setStyleSheet(styleSheetCutomize)
         custButton.setFont(font1)
-        custButton.setCursor(
-            QCursor(Qt.CursorShape.PointingHandCursor))
-
-            
+        custButton.setCursor(QCursor(Qt.CursorShape.PointingHandCursor))
 
 if __name__ == '__main__':
     app = QApplication(sys.argv)
diff --git a/src/plan2.py b/src/plan2.py
index 70778ad6922319230b78d6b8645af6b14a9336db..e371dab9b9a1170fd9e2a6cb92febb84e9bebe7e 100644
--- a/src/plan2.py
+++ b/src/plan2.py
@@ -2,17 +2,18 @@ import sqlite3
 from PyQt6.QtWidgets import QApplication, QLabel, QWidget, QPushButton, QMessageBox
 from PyQt6.QtGui import QFont, QPixmap, QCursor, QMovie, QIcon
 from PyQt6.QtCore import Qt, QSize, QUrl, QTimer, QTime
+from PyQt6.QtMultimedia import QMediaPlayer
 # from PyQt6.QtMultimedia import QSoundEffect
 import time
 import sys
-conn = sqlite3.connect("fitu.db")
-c = conn.cursor()
-latihan = c.execute("SELECT gif FROM daftar_latihan NATURAL JOIN latihan_program WHERE program_id = 1").fetchall()
-print(latihan)
 class plan(QWidget):
     def __init__(self):
         super().__init__()
         self.index = 0
+        self.conn = sqlite3.connect("fitu.db")
+        self.c = self.conn.cursor()
+        self.latihan = self.c.execute("SELECT gif FROM daftar_latihan NATURAL JOIN latihan_program WHERE program_id = 1").fetchall()
+        print(self.latihan)
         # self.remaining_time = 0
         self.timer = QTimer(self)
         self.timer.timeout.connect(self.updateTimer)
@@ -24,13 +25,24 @@ class plan(QWidget):
     def setUpWindowPlan(self):
         self.setWindowTitle("FitU - Plan")
         self.setFixedSize(1280, 720)
+        # background = QMovie("img/background.gif")
+        # background.setScaledSize(QSize(1280, 720))
+        # background_label = QLabel(self)
+        # background_label.setGeometry(0, 0, 1280, 720)
+        # background_label.setMovie(background)
+        # background.start()
+        
+        # set the background style sheet
+        # self.setStyleSheet("background-image: url(img/background.gif);")
+        
         self.setUpPlan()
 
     def updateTimer(self):
-        if self.remaining_time > 0:
-            self.remaining_time -= 1
-            minutes = self.remaining_time // 60
-            seconds = self.remaining_time % 60
+        # print(type(self.remaining_time))
+        if int(self.remaining_time) > 0:
+            self.remaining_time = int(self.remaining_time) - 1
+            minutes = int(self.remaining_time) // 60
+            seconds = int(self.remaining_time) % 60
             self.timer_label.setText(f"{minutes:02d}:{seconds:02d}")
         else:
             self.timer.stop()
@@ -40,8 +52,7 @@ class plan(QWidget):
     def resetTimer(self):
         self.remaining_time = self.duration[self.index][0]
         self.timer.start(1000)
-        if(self.duration[self.index][0]<59):
-
+        if(int(self.duration[self.index][0])<59):
             self.timer_label.setText("00:"+str(self.remaining_time))
         else:
             self.timer_label.setText("00:"+str(self.remaining_time))
@@ -51,11 +62,14 @@ class plan(QWidget):
 
     def setUpPlan(self):
         self.setStyleSheet('background-color: #5A8D6C')
+       
 
-        backButton = QPushButton("<", self)
+        backButton = QPushButton(self)
         backButton.setGeometry(200, 150, 100, 100)
-        backButton.resize(50, 50)
-        backButton.setStyleSheet("background-color: #174728; color: #EEEEE2; border-radius: 25px; border: 2px; font-size: 23px; font-weight: bold")
+        backButton.resize(60, 60)
+        backButton.setIcon(QIcon("img/arrow-left.png"))
+        backButton.setIconSize(QPixmap("img/arrow-left.png").size())
+        backButton.setStyleSheet("background-color: #174728; color: #EEEEE2; border-radius: 30px; border: 2px;")
         backButton.setCursor(QCursor(Qt.CursorShape.PointingHandCursor))
         backButton.move(50, 64)
 
@@ -63,25 +77,51 @@ class plan(QWidget):
         self.currEx.setFixedSize(360, 335)
         self.currEx.move(460, 105)
         self.currEx.setStyleSheet("background-color: #EEEEE2; border-radius: 25px; border: 2px")
-        self.movie = QMovie(latihan[0][0])
+        self.movie = QMovie(self.latihan[0][0])
         self.currEx.setMovie(self.movie)
         self.movie.start()
         # self.movie.setScaledSize(QSize(330, 305))
         self.currEx.setScaledContents(True)
         self.movie.setSpeed(60)
 
+        # nextLabel = QLabel(self)
+        # nextLabel.setFixedSize(360, 335)
+        # nextLabel.move(460, 105)
+        # nextLabel.setStyleSheet("background-color: #5A8D6C; border-radius: 20px;")
+
+        # prevLabel = QLabel(self)
+        # prevLabel.setFixedSize(360, 335)
+        # prevLabel.move(513, 581)
+        # prevLabel.setStyleSheet("background-color: #5A8D6C; border-radius: 20px;")
+
         nextButton = QPushButton(self)
         nextButton.setGeometry(200, 150, 100, 100)
         nextButton.setIcon(QIcon("img/arrow-right.png"))
         nextButton.setIconSize(QPixmap("img/arrow-right.png").size())
         nextButton.setCursor(QCursor(Qt.CursorShape.PointingHandCursor))
+        nextButton.setStyleSheet('''
+        QPushButton{
+            border: 5px #5A8D6C;
+            } 
+        QPushButton:hover {
+            background-color: #174728;
+        }''')
         nextButton.move(700, 581)
         nextButton.clicked.connect(self.nextEx)
 
         prevButton = QPushButton(self)
         prevButton.setGeometry(200, 150, 100, 100)
+        # prevButton.setStyleSheet("background-image: url(img/arrow-left.png)")
         prevButton.setIcon(QIcon("img/arrow-left.png"))
         prevButton.setIconSize(QPixmap("img/arrow-left.png").size())
+        # print("size: "+ str(QPixmap("img/arrow-left.png").size()))
+        prevButton.setStyleSheet('''
+        QPushButton{
+            border: 5px #5A8D6C;
+            } 
+        QPushButton:hover {
+            background-color: #174728;
+        }''')
         prevButton.setCursor(QCursor(Qt.CursorShape.PointingHandCursor))
         prevButton.move(513, 581)
         prevButton.clicked.connect(self.prevEx)
@@ -93,27 +133,27 @@ class plan(QWidget):
         # effect.setLoopCount(-2)
         # effect.play()
 
-        # if self.index == len(latihan):
+        # if self.index == len(self.latihan):
         #     nextButton.setEnabled(False)
         #     titleProgram = c.execute(f"SELECT name FROM program WHERE program_id = {programId}").fetchone()
-        #     nameExe = c.execute(f"SELECT name FROM daftar_latihan WHERE exercise_id in (SELECT exercise_id FROM latihan_program)").fetchall()
+        #     nameExe = c.execute(f"SELECT name FROM daftar_self.latihan WHERE exercise_id in (SELECT exercise_id FROM self.latihan_program)").fetchall()
         #     date = time.strftime("%Y-%m-%d", time.localtime())
-        #     totDuration = c.execute(f"SELECT SUM(duration) FROM daftar_latihan WHERE exercise_id in (SELECT exercise_id FROM latihan_program)").fetchone()
-        #     c.execute("INSERT INTO riwayat_latihan program_id, name, title_program, date, tot_duration VALUES ({programId}, {nameExe}, {titleProgram}, {date}, {totDuration})")
+        #     totDuration = c.execute(f"SELECT SUM(duration) FROM daftar_self.latihan WHERE exercise_id in (SELECT exercise_id FROM self.latihan_program)").fetchone()
+        #     c.execute("INSERT INTO riwayat_self.latihan program_id, name, title_program, date, tot_duration VALUES ({programId}, {nameExe}, {titleProgram}, {date}, {totDuration})")
 
-        self.name = c.execute(f"SELECT title FROM daftar_latihan NATURAL JOIN latihan_program WHERE program_id = 1").fetchall()
+        self.name = self.c.execute(f"SELECT title FROM daftar_latihan NATURAL JOIN latihan_program WHERE program_id = 1").fetchall()
         print(self.name)
         self.nameLabel = QLabel(self)
         self.nameLabel.setText(self.name[self.index][0])
         print(self.name[self.index][0])
-        self.nameLabel.setFont(QFont("Arial", 20, QFont.Weight.Bold))
+        self.nameLabel.setFont(QFont("Segoe UI", 20, QFont.Weight.Bold))
         self.nameLabel.setStyleSheet("color: #EEEEE2")
         self.nameLabel.move(600, 461)
         self.nameLabel.setFixedWidth(200)
 
         # duration = QLabel(self)
         self.repLabel = QLabel(self)
-        self.repLabel.setFont(QFont("Arial", 20, QFont.Weight.Bold))
+        self.repLabel.setFont(QFont("Segoe UI", 20, QFont.Weight.Bold))
         self.repLabel.setStyleSheet("color: #EEEEE2")
         self.repLabel.move(547, 510)
 
@@ -123,9 +163,10 @@ class plan(QWidget):
         self.timer_label.move(547, 510)
         self.timer_label.setFont(QFont("Arial", 20, QFont.Weight.Bold))
         self.timer_label.setStyleSheet("background-color: #EEEEE2; border-radius: 10px; border: 2px")
-        # durationCount = c.execute(f"SELECT duration FROM daftar_latihan WHERE exercise_id in (SELECT exercise_id FROM latihan_program WHERE program_id = 1)").fetchall()
-        self.repCount = c.execute(f"SELECT repetition FROM daftar_latihan NATURAL JOIN latihan_program WHERE program_id = 1").fetchall()
-        self.duration = c.execute(f"SELECT duration FROM daftar_latihan NATURAL JOIN latihan_program WHERE program_id = 1").fetchall()
+        # durationCount = c.execute(f"SELECT duration FROM daftar_self.latihan WHERE exercise_id in (SELECT exercise_id FROM self.latihan_program WHERE program_id = 1)").fetchall()
+        self.repCount = self.c.execute(f"SELECT repetition FROM daftar_latihan NATURAL JOIN latihan_program WHERE program_id = 1").fetchall()
+        self.duration = self.c.execute(f"SELECT duration FROM daftar_latihan NATURAL JOIN latihan_program WHERE program_id = 1").fetchall()
+        print(type(self.duration[self.index+1][0]))
         for i in self.repCount:
             print("rep",i)
         for i in self.duration:
@@ -138,12 +179,22 @@ class plan(QWidget):
             self.repetitionLabel()
         print((self.repCount[self.index][0])==None)    
 
+        # player = QMediaPlayer()
+        # # playlist = QMediaPlaylist()
+        # media = QMediaContent(QUrl.fromLocalFile("BGM ITS OKAY NOT TO BE OKAY.mp3"))  # Add your background music file here
+        # player.setMedia(media)
+        # player.setPlaybackMode(QMediaPlaylist.Loop)
+        # player.setMedia(player)
+
+        # button = QPushButton("Toggle BGM")
+        # button.clicked.connect(lambda: player.play() if player.state() == QMediaPlayer.StoppedState else player.stop())
+        # player.play()
 
 
     def prevEx(self):
         if self.index > 0:
             self.index -= 1
-            self.movie = QMovie(latihan[self.index][0])
+            self.movie = QMovie(self.latihan[self.index][0])
             self.currEx.setMovie(self.movie)
             self.movie.start()
             self.movie.setScaledSize(QSize(330, 305))
@@ -160,9 +211,9 @@ class plan(QWidget):
 
 
     def nextEx(self):
-        if self.index < (len(latihan)) - 1:
+        if self.index < (len(self.latihan)) - 1:
             self.index += 1
-            self.movie = QMovie(latihan[self.index][0])
+            self.movie = QMovie(self.latihan[self.index][0])
             self.currEx.setMovie(self.movie)
             self.movie.start()
             self.movie.setScaledSize(QSize(330, 305))
@@ -175,6 +226,8 @@ class plan(QWidget):
             self.repetitionLabel()
         self.nameLabel.setText(self.name[self.index][0])
         print(self.index)
+
+    
     
 if __name__ == "__main__":