SESI 2

index.html

@@ -39,52 +39,35 @@ <h2><span>Inspiratif, bersemangat, dan siap menaklukkan dunia!</span><br> Alumni
             <img src="./asset foto/IMG_6176.jpg">
         </div>
     </div>
-    <div class="galeri">
+    <div class="profil">
         <h1>Galery</h1>
-    </div>
-    <article>
-        <ul class="profile">
-            <li>
-                <div class="jurusan">
-                    <a href="belom_ada_isinyaa" target="_blank" class="no_underliner">
-                        <img src="./asset foto/DSC04075.JPG">
-                    </a>
+        <div class="tkj">
+            <img src="./asset foto/IMG_6162.jpg">
+            <ul>
+                <li>
                     <h3>Teknik Komputer dan Jaringan</h3>
-                    <p>"Mereka adalah para pionir di dunia digital, menggali jaringan dan membangun sistem yang
-                        menjadi tulang punggung teknologi masa depan. Kreatif, cermat, dan siap menghadapi setiap
-                        tantangan di ranah teknologi informasi."</p>
-                </div>
-            </li>
-            <li>
-                <div class="jurusan">
-                    <a href="belom_ada_isinyaa_wak " target="_blank" class="no_underliner">
-                        <img src="./asset foto/DSC04075.JPG">
-                    </a>
+                    <p>"Mereka adalah para pionir di dunia digital, menggali jaringan dan membangun sistem yang menjadi tulang punggung teknologi masa depan. Kreatif, cermat, dan siap menghadapi setiap tantangan di ranah teknologi informasi."</p>
+                </li>
+            </ul>
+        </div>
+        <div class="akl">
+            <img src="./asset foto/IMG_6162.jpg">
+            <ul>
+                <li>
                     <h3>Akutansi dan Keuangan Lembaga</h3>
-                    <p>"Mengintip masa depan melalui angka dan laporan keuangan, mereka adalah penjaga ketelitian
-                        dan
-                        keandalan informasi keuangan. Dengan ketepatan dan kecermatan, mereka mengarahkan langkah
-                        menuju
-                        kesuksesan finansial."</p>
-                </div>
-            </li>
-            <li>
-                <div class="jurusan">
-                    <a href="ingfokan_konten" target="_blank" class="no_underliner">
-                        <img src="./asset foto/DSC04075.JPG">
-                    </a>
-                    <h3>Teknik Bisnis Sepeda Motor</h3>
-                    <p>"Dari mesin hingga kenyamanan pengendara, mereka adalah ahli di bidang mobil dan sepeda
-                        motor.
-                        Dengan kecakapan dan keahlian, mereka membawa inovasi dan kenyamanan ke setiap perjalanan."
+                    <p>"Mengintip masa depan melalui angka dan laporan keuangan, mereka adalah penjaga ketelitian dan keandalan informasi keuangan. Dengan ketepatan dan kecermatan, mereka mengarahkan langkah menuju kesuksesan finansial."
                     </p>
-                </div>
-            </li>
-        </ul>
-    </article>
-
-    <footer>
-        <p>belom jadi wak review aja dulu</p>
-        <p>kalo ada ide kasi tau yee</p>
-    </footer>
+                </li>
+            </ul>
+        </div>
+        <div class="tbsm">
+            <img src="./asset foto/IMG_6162.jpg">
+            <ul>
+                <li>
+                    <h3>Teknik Bisnis Sepeda Motor</h3>
+                    <p>"Dari mesin hingga kenyamanan pengendara, mereka adalah ahli di bidang mobil dan sepeda motor. Dengan kecakapan dan keahlian, mereka membawa inovasi dan kenyamanan ke setiap perjalanan."</p>
+                </li>
+            </ul>
+        </div>
+    </div>
 </body>

style.css

@@ -89,54 +89,89 @@ span {
 
 /*slide 3 */
 
-.galeri h1 {
-    padding: 90px;
+
+.profil {
+    width: 100%;
+    margin-top: 40px;
+}
+
+.profil h1 {
+    align-items: center;
     text-align: center;
-    margin: 0;
-    transform: translateY(-80px);
-
+    padding: 0px;
+    font-size: 300%;
 }
 
-/*untuk bagian foto */
-li {
-    list-style: none;
+.profil img {
+    width: 200px;
+    height: 200px;
+    margin-right: -250px;
+    border-radius: 30px 30px 30px 30px;
 }
 
-.profile {
+/*ini untuk class tkj*/
+
+.tkj {
     display: flex;
-    flex-wrap: wrap;
-    position: relative;
-    height: 100%;
-    text-align: center;
-    justify-content: center;
-    gap: 90px;
+    margin-left: 120px;
+    width: 42%;
+    padding: 10px;
+    margin-top: 50px;
+}
 
+.tkj li {
+    list-style: none;
+    margin-left: 280px;
+    margin-top: 40px;
+    text-align: justify;
 }
 
-.jurusan {
-    padding: 200px;
-    width: 266%;
-    height: 95%;
-    max-width: 250px;
-    box-shadow: #000000 20px 20px 20px 5px;
-    align-items: center;
+.tkj p {
+    font-size: 13px;
+}
+
+/* untuk class akl*/
+.akl {
+    display: flex;
+    margin: 10px;
+    margin-right: 30px;
+    width: 42%;
     padding: 10px;
-    border: 1px solid #ccc;
-    border-radius: 20px;
-    justify-content: space-between;
-    position: relative;
+    float: right;
+    transform: translateY(-130px);
 }
 
-.jurusan img {
-    width: 100%;
+.akl li {
+    list-style: none;
+    margin-left: 280px;
+    margin-top: 40px;
+    text-align: justify;
+}
+
+.akl p {
+    font-size: 13px;
 }
 
-.jurusan h3 {
-    margin-bottom: 10px;
+/* untuk class tbsm*/
+.tbsm {
+    display: flex;
+    margin: 10px;
+    width: 45%;
+    padding: 10px;
+    margin-top: 50px;
+    margin-left: 320px;
+    transform: translateY(-80px);
 }
 
-.jurusan p {
-    font-size: small;
+.tbsm li {
+    list-style: none;
+    margin-left: 280px;
+    margin-top: 40px;
+    text-align: justify;
+}
+
+.tbsm p {
+    font-size: 13px;
 }
 
 /*responsive nanti buat kode css diatasnya ini wajib!!!!*/
@@ -158,7 +193,6 @@ footer {
         margin-top: -50px;
         margin-left: 20px;
         width: 90%;
-
     }
 
     .aset img {