responsive ness>?

components/demo/Announcements.tsx

@@ -37,7 +37,7 @@ export default function Announcements(props: IVoiceDemoProps) {
 
   return (
     <section
-      className={`p-5 flex flex-col bg-gray-100 bg-opacity-25 rounded-lg shadow-md absolute right-0 backdrop-blur-xl ${
+      className={`p-5 flex flex-col bg-gray-100 bg-opacity-25 rounded-lg shadow-md -translate-x-32 backdrop-blur-xl ${
         isAnnouncementsTurn ? " z-20 " : "blur-sm"
       }`}
     >

components/demo/TeamVoiceLine.tsx

@@ -142,7 +142,7 @@ function TeamVoiceLine(props: IVoiceDemoProps) {
 
   return (
     <section
-      className={`p-5 flex w-80 flex-col bg-gray-100 bg-opacity-25 rounded-lg shadow-2xl absolute top-32 left-10 z-10 backdrop-blur-xl transition-all duration-300 ${
+      className={`p-5 flex w-80 flex-col bg-gray-100 bg-opacity-25 rounded-lg shadow-2xl z-10 translate-y-24 translate-x-20 backdrop-blur-xl transition-all duration-300 ${
         !isVoiceLineTurn ? "blur-sm" : ""
       } ${props.demoStep == DemoStep.doneDemo ? "z-30" : ""}`}
     >

components/demo/VoiceLineConceptDemo.tsx

@@ -44,7 +44,7 @@ export default function VoiceLineConceptDemo() {
             onClick={() => setDemoStep(DemoStep.playIncomingMessage)}
             className="absolute mx-auto my-auto left-1/2 top-1/2 
       bg-gray-200 py-2 px-2 rounded font-semibold inline-flex items-center text-teal-600
-      space-x-2 animate-bounce"
+      space-x-2 animate-bounce z-50"
           >
             <FaPlay /> <span>Play Demo</span>
           </button>