index

pages/index.vue

 <template>
-  <div id="index">
+  <div id="index" class="test">
     <Title>Home</Title>
-    <div class=" h-screen" id="home page" style="background: url(https://static.igem.wiki/teams/4713/wiki/index/background2.png) center center / cover">
+    <div class=" h-screen" id="home page" style="background: url(https://static.igem.wiki/teams/4713/wiki/index/home.jpg) center center / cover">
       <h3 class="text-center pt-52 pb-5 bg-gradient-to-r from-indigo-500 via-purple-500 to-pink-500 bg-clip-text text-transparent text-4xl lg:text-6xl font-bold">
         Welcome to peking igem
       </h3>
@@ -11,7 +11,7 @@
     </div>
     <div id="Pancreatic Cancer1" class="h-screen" style="background: url(https://static.igem.wiki/teams/4713/wiki/index/background2.png) center center / cover">
       <section class=" relative" style="height: 100%; width: 100%">
-        <h5 class="w-[40%] test mx-auto absolute text-2xl lg:text-4xl text-center lg-top-11 sm-top-3" style="left:10%;">
+        <h5 class="w-[40%] mx-auto absolute text-2xl lg:text-4xl text-center lg-top-11 sm-top-3" style="left:10%;">
           <div class="wordfrom">
             <span class="block lg:pt-[2vh] lg:pb-[2vh] pt-[1vh] pb-[1vh]" style="">Nowadays, cancer is one of</span>
             <span class="block lg:pt-[2vh] lg:pb-[2vh] pt-[1vh] pb-[1vh]" style="">the most pressing health</span>
@@ -28,7 +28,7 @@
         <img class="iFlash absolute" src="https://static.igem.wiki/teams/4713/wiki//index/cancer-live.png" alt="pancreatic cancer" style="width: 50%; top: 10%; left:48%">
       </section>
     </div>
-    <div id="Pancreatic Cancer2" class="h-screen" style="background: url(https://static.igem.wiki/teams/4713/wiki/index/background2.png) center center / cover">
+    <div id="Pancreatic Cancer2" class="h-screen z-10" style="background: url(https://static.igem.wiki/teams/4713/wiki/index/background2.png) center center / cover">
       <h5 class="Pancreatic text-center mx-auto pt-[30vh] text-3xl lg:text-5xl font-bold">pancreatic cancer</h5>
       <h5 class="Pancreatic text-center mx-auto pt-[6vh] text-1xl lg:text-3xl">accounts for</h5>
       <h5 class="Pancreatic text-center mx-auto pt-[6vh] text-1xl lg:text-3xl"><span class=" text-red-600 text-4xl font-bold">3%</span> estimated new cases but <span class=" text-red-600 text-2xl lg:text-4xl font-bold">8%</span> estimated new deaths</h5>
@@ -126,8 +126,6 @@
         </div>
       </div>      
     </div>
-    </div>
-
 
     <div class=" h-screen" id="Our Project3" style="background: url(https://static.igem.wiki/teams/4713/wiki/index/background2.png) center center / cover">
       <h2 class="wordfrom text-center mx-auto pt-10 font-bold" style="font-size: 40px;">Concerns and Solutions</h2>
@@ -137,7 +135,7 @@
               <div class="card-front">
                 <strong><p style="margin: 0;">Effectiveness of Targeting</p></strong>
               </div>
-              <div class="card-back">
+              <div class="card-back" style="background: url(https://static.igem.wiki/teams/4713/wiki//index/bacteria.png)">
                 
                 Effectiveness of Targeting
                 
@@ -158,7 +156,7 @@
               <div class="card-front">
                 <strong><p style="margin: 0;">Intravenous safety</p></strong>
               </div>
-              <div class="card-back">
+              <div class="card-back" style="background: url(https://static.igem.wiki/teams/4713/wiki//index/bacteria.png)">
                 Intravenous safety
                 <br>
                 <br>
@@ -180,7 +178,7 @@
               <div class="card-front">
                 <strong><p style="margin: 0;">Social Concerns</p></strong>
               </div>
-              <div class="card-back">
+              <div class="card-back" style="background: url(https://static.igem.wiki/teams/4713/wiki//index/bacteria.png)">
                 Social Concerns
                 <br>
                 <br>
@@ -199,6 +197,7 @@
         </div>
       </div>      
     </div>
+  </div>
 </template>
 
 
@@ -298,8 +297,7 @@
   height: 100%;
   position: absolute;
   backface-visibility: hidden; 
-  border-radius: 20px; 
-  background-image: url('https://static.igem.wiki/teams/4713/wiki//index/bacteria.png'); 
+  border-radius: 20px;  
 }
 
 .card-front {