new-course-add

src/components/Contactfrom.vue

@@ -55,7 +55,7 @@ export default {
         formData.append('Email', this.cuemail);
         formData.append('MessageDetails', this.cumessage);
         formData.append('formName', 'rgyci-contact-us');
-        fetch('', 
+        fetch('https://api11.siliconpin.com/API/contactFormProcessor/v1/', 
             {
                 method: 'POST',
                 body: formData,

src/components/Menu.astro

@@ -42,7 +42,7 @@ import Online from "./Online.vue";
             <i class="fas fa-angle-down"></i>
           </a>
           <div class="drop-content">
-            <a href="https://online.rgyci.org/login/index.php">Online Courses</a>
+            <a href="/online-course">Online Courses</a>
             <a href="#">Offline Courses</a>             
           </div>
         </div>

src/pages/online-course.astro

@@ -8,105 +8,306 @@ import Header from "../components/Header.astro";
     <Header/>
     <Menu/>
     <main>
-        <section class="container mx-auto py-16 2xl:py-24">
+        <section class="container mx-auto py-16">
             <p class="text-center text-4xl pb-8 2xl:pb-10 decoration-4 underline decoration-red-500 font-bold">Our Courses</p>
             <div class="grid grid-cols-1 lg:grid-cols-2 xl:grid-cols-3 place-items-center gap-16 ">
                 <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none cursor-pointer">
                     <div class="">
-                        <img class="rounded-t-2xl img-size" src="/img/image1.png" alt="">
+                        <img class="rounded-t-2xl img-size" src="/img/rgyci-img1.jpg" alt="">
                         <h1 class="h1-text font-bold p-4">DCA (Diploma In Computer Application)</h1>
-                        <h3 class="text-lg font-bold px-4">Course Fee : 3000/-</h3>
                         <div class="flex place-content-between p-4 button-place hr">
                             <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
-                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">6 Months</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">06 Months</button>
                         </div>
                     </div>
                 </div>
                 <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
                     <div class="">
-                        <img class="rounded-t-2xl img-size" src="/img/image2.png" alt="">
+                        <img class="rounded-t-2xl img-size" src="/img/rgyci-img2.jpg" alt="">
-                        <h1 class="h1-text font-bold p-4">DCA (Diploma In Computer Application)</h1>
+                        <h1 class="h1-text font-bold p-4">DCAAE (Diploma In Computer Application & Accounting Expert)</h1>
-                        <h3 class="text-lg font-bold px-4">Course Fee : 3000/-</h3>
                         <div class="flex place-content-between p-4 button-place hr">
                             <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
-                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">6 Months</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">12 Months</button>
                         </div>
                     </div>
                 </div>
                 <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
                     <div class="">
-                        <img class="rounded-t-2xl img-size" src="/img/image7.png" alt="">
+                        <img class="rounded-t-2xl img-size" src="/img/rgyci-img3.jpg" alt="">
-                        <h1 class="h1-text font-bold p-4">DCA (Diploma In Computer Application)</h1>
+                        <h1 class="h1-text font-bold p-4">ADCHNE (Advance Diploma In Computer Hardware & Networking Engineering)</h1>
-                        <h3 class="text-lg font-bold px-4">Course Fee : 3000/-</h3>
                         <div class="flex place-content-between p-4 button-place hr">
                             <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
-                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">6 Months</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">12 Months</button>
                         </div>
                     </div>
                 </div>
                 <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
                     <div class="">
-                        <img class="rounded-t-2xl img-size" src="/img/image4.png" alt="">
+                        <img class="rounded-t-2xl img-size" src="/img/rgyci-img4.jpg" alt="">
-                        <h1 class="h1-text font-bold p-4">DCA (Diploma In Computer Application)</h1>
+                        <h1 class="h1-text font-bold p-4">ADCS (Advance Diploma In Cyber Security)</h1>
-                        <h3 class="text-lg font-bold px-4">Course Fee : 3000/-</h3>
                         <div class="flex place-content-between p-4 button-place hr">
                             <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
-                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">6 Months</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">12 Months</button>
                         </div>
                     </div>
                 </div>
                 <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
                     <div class="">
-                        <img class="rounded-t-2xl img-size" src="/img/image5.png" alt="">
+                        <img class="rounded-t-2xl img-size" src="/img/rgyci-img5.jpg" alt="">
-                        <h1 class="h1-text font-bold p-4">DCA (Diploma In Computer Application)</h1>
+                        <h1 class="h1-text font-bold p-4">ADOAP (Advance Diploma In Office Accounts & Publishing)</h1>
-                        <h3 class="text-lg font-bold px-4">Course Fee : 3000/-</h3>
                         <div class="flex place-content-between p-4 button-place hr">
                             <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
-                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">6 Months</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">12 Months</button>
                         </div>
                     </div>
                 </div>
                 <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
                     <div class="">
-                        <img class="rounded-t-2xl img-size" src="/img/image6.png" alt="">
+                        <img class="rounded-t-2xl img-size" src="/img/rgyci-img6.jpg" alt="">
-                        <h1 class="h1-text font-bold p-4">DCA (Diploma In Computer Application)</h1>
+                        <h1 class="h1-text font-bold p-4">ADCA (Advance Diploma In Computer Application)</h1>
-                        <h3 class="text-lg font-bold px-4">Course Fee : 3000/-</h3>
                         <div class="flex place-content-between p-4 button-place hr">
                             <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
-                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">6 Months</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">12 Months</button>
                         </div>
                     </div>
                 </div>
                 <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
                     <div class="">
-                        <img class="rounded-t-2xl img-size" src="/img/image7.png" alt="">
+                        <img class="rounded-t-2xl img-size" src="/img/rgyci-img7.jpg" alt="">
-                        <h1 class="h1-text font-bold p-4">DCA (Diploma In Computer Application)</h1>
+                        <h1 class="h1-text font-bold p-4">CCLE (Computer Chip Level Engineering)</h1>
-                        <h3 class="text-lg font-bold px-4">Course Fee : 3000/-</h3>
                         <div class="flex place-content-between p-4 button-place hr">
                             <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
-                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">6 Months</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">12 Months</button>
                         </div>
                     </div>
                 </div>
                 <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
                     <div class="">
-                        <img class="rounded-t-2xl img-size" src="/img/image1.png" alt="">
+                        <img class="rounded-t-2xl img-size" src="/img/rgyci-img8.jpg" alt="">
-                        <h1 class="h1-text font-bold p-4">DCA (Diploma In Computer Application)</h1>
+                        <h1 class="h1-text font-bold p-4">DCAMS (Diploma In Computer Application & Multimedia Specialist)</h1>
-                        <h3 class="text-lg font-bold px-4">Course Fee : 3000/-</h3>
                         <div class="flex place-content-between p-4 button-place hr">
                             <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
-                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">6 Months</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">12 Months</button>
                         </div>
                     </div>
                 </div>
                 <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
                     <div class="">
-                        <img class="rounded-t-2xl img-size" src="/img/image2.png" alt="">
+                        <img class="rounded-t-2xl img-size" src="/img/rgyci-img9.jpg" alt="">
-                        <h1 class="h1-text font-bold p-4">DCA (Diploma In Computer Application)</h1>
+                        <h1 class="h1-text font-bold p-4">DCCTT (Diploma In Computer Teacher Training)</h1>
-                        <h3 class="text-lg font-bold px-4">Course Fee : 3000/-</h3>
                         <div class="flex place-content-between p-4 button-place hr">
                             <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
-                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">6 Months</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">12 Months</button>
+                        </div>
+                    </div>
+                </div>
+                <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
+                    <div class="">
+                        <img class="rounded-t-2xl img-size" src="/img/10.jpg" alt="">
+                        <h1 class="h1-text font-bold p-4">DCNE (Diploma in computer Networking Engineering)</h1>
+                        <div class="flex place-content-between p-4 button-place hr">
+                            <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">12 Months</button>
+                        </div>
+                    </div>
+                </div>
+                <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
+                    <div class="">
+                        <img class="rounded-t-2xl img-size" src="/img/11.jpg" alt="">
+                        <h1 class="h1-text font-bold p-4">DWDDWD (Diploma in Web Designing and Web Development)</h1>
+                        <div class="flex place-content-between p-4 button-place hr">
+                            <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">12 Months</button>
+                        </div>
+                    </div>
+                </div>
+                <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
+                    <div class="">
+                        <img class="rounded-t-2xl img-size" src="/img/12.jpg" alt="">
+                        <h1 class="h1-text font-bold p-4">DM (Diploma in Multimedia)</h1>
+                        <div class="flex place-content-between p-4 button-place hr">
+                            <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">12 Months</button>
+                        </div>
+                    </div>
+                </div>
+                <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
+                    <div class="">
+                        <img class="rounded-t-2xl img-size" src="/img/13.jpg" alt="">
+                        <h1 class="h1-text font-bold p-4">DIA (Diploma in Industrial Accounts)</h1>
+                        <div class="flex place-content-between p-4 button-place hr">
+                            <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">12 Months</button>
+                        </div>
+                    </div>
+                </div>
+                <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
+                    <div class="">
+                        <img class="rounded-t-2xl img-size" src="/img/14.jpg" alt="">
+                        <h1 class="h1-text font-bold p-4">DSO Tailor (Diploma In Sewing Operating)</h1>
+                        <div class="flex place-content-between p-4 button-place hr">
+                            <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">12 Months</button>
+                        </div>
+                    </div>
+                </div>
+                <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
+                    <div class="">
+                        <img class="rounded-t-2xl img-size" src="/img/15.jpg" alt="">
+                        <h1 class="h1-text font-bold p-4">DITA Tailor (Diploma In Information Technology & Application)</h1>
+                        <div class="flex place-content-between p-4 button-place hr">
+                            <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">12 Months</button>
+                        </div>
+                    </div>
+                </div>
+                <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
+                    <div class="">
+                        <img class="rounded-t-2xl img-size" src="/img/16.jpg" alt="">
+                        <h1 class="h1-text font-bold p-4">KIDS Tailor (Smart Computer Course)</h1>
+                        <div class="flex place-content-between p-4 button-place hr">
+                            <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">10 Months</button>
+                        </div>
+                    </div>
+                </div>
+                <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
+                    <div class="">
+                        <img class="rounded-t-2xl img-size" src="/img/17.jpg" alt="">
+                        <h1 class="h1-text font-bold p-4">MRME (Mobile Repairing And Maintenance Engineering)</h1>
+                        <div class="flex place-content-between p-4 button-place hr">
+                            <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">12 Months</button>
+                        </div>
+                    </div>
+                </div>
+                <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
+                    <div class="">
+                        <img class="rounded-t-2xl img-size" src="/img/18.jpg" alt="">
+                        <h1 class="h1-text font-bold p-4">PGDCA (Post Graduate Diploma In Computer Application)</h1>
+                        <div class="flex place-content-between p-4 button-place hr">
+                            <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">12 Months</button>
+                        </div>
+                    </div>
+                </div>
+                <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
+                    <div class="">
+                        <img class="rounded-t-2xl img-size" src="/img/19.jpg" alt="">
+                        <h1 class="h1-text font-bold p-4">SE (Spoken English)</h1>
+                        <div class="flex place-content-between p-4 button-place hr">
+                            <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">12 Months</button>
+                        </div>
+                    </div>
+                </div>
+                <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
+                    <div class="">
+                        <img class="rounded-t-2xl img-size" src="/img/20.jpg" alt="">
+                        <h1 class="h1-text font-bold p-4">DCAA (Diploma In Computer Accounting)</h1>
+                        <div class="flex place-content-between p-4 button-place hr">
+                            <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">10 Months</button>
+                        </div>
+                    </div>
+                </div>
+                <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
+                    <div class="">
+                        <img class="rounded-t-2xl img-size" src="/img/21.jpg" alt="">
+                        <h1 class="h1-text font-bold p-4">DIPWD (Diploma in Internet Programming& Web Designing)</h1>
+                        <div class="flex place-content-between p-4 button-place hr">
+                            <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">10 Months</button>
+                        </div>
+                    </div>
+                </div>
+                <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
+                    <div class="">
+                        <img class="rounded-t-2xl img-size" src="/img/22.jpg" alt="">
+                        <h1 class="h1-text font-bold p-4">CICA (Certificate In Computer Application)</h1>
+                        <div class="flex place-content-between p-4 button-place hr">
+                            <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">05 Months</button>
+                        </div>
+                    </div>
+                </div>
+                <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
+                    <div class="">
+                        <img class="rounded-t-2xl img-size" src="/img/23.jpg" alt="">
+                        <h1 class="h1-text font-bold p-4">CDEO (Certificate In Data Entry Operations)</h1>
+                        <div class="flex place-content-between p-4 button-place hr">
+                            <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">05 Months</button>
+                        </div>
+                    </div>
+                </div>
+                <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
+                    <div class="">
+                        <img class="rounded-t-2xl img-size" src="/img/24.jpg" alt="">
+                        <h1 class="h1-text font-bold p-4">CCCA (Certificate course In computer Accounting)</h1>
+                        <div class="flex place-content-between p-4 button-place hr">
+                            <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">10 Months</button>
+                        </div>
+                    </div>
+                </div>
+                <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
+                    <div class="">
+                        <img class="rounded-t-2xl img-size" src="/img/25.jpg" alt="">
+                        <h1 class="h1-text font-bold p-4">DDTP (Diploma In Desktop Publishing)</h1>
+                        <div class="flex place-content-between p-4 button-place hr">
+                            <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">10 Months</button>
+                        </div>
+                    </div>
+                </div>
+                <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
+                    <div class="">
+                        <img class="rounded-t-2xl img-size" src="/img/26.jpg" alt="">
+                        <h1 class="h1-text font-bold p-4">DCHE (Diploma In Computer Hardware Engineering)</h1>
+                        <div class="flex place-content-between p-4 button-place hr">
+                            <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">10 Months</button>
+                        </div>
+                    </div>
+                </div>
+                <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
+                    <div class="">
+                        <img class="rounded-t-2xl img-size" src="/img/27.jpg" alt="">
+                        <h1 class="h1-text font-bold p-4">DAC (Diploma in Auto Cad)</h1>
+                        <div class="flex place-content-between p-4 button-place hr">
+                            <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">10 Months</button>
+                        </div>
+                    </div>
+                </div>
+                <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
+                    <div class="">
+                        <img class="rounded-t-2xl img-size" src="/img/28.jpg" alt="">
+                        <h1 class="h1-text font-bold p-4">DCMS (Diploma In Computer Multimedia Specialist)</h1>
+                        <div class="flex place-content-between p-4 button-place hr">
+                            <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">10 Months</button>
+                        </div>
+                    </div>
+                </div>
+                <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
+                    <div class="">
+                        <img class="rounded-t-2xl img-size" src="/img/29.jpg" alt="">
+                        <h1 class="h1-text font-bold p-4">DVEE (Diploma In Video Editing Expert)</h1>
+                        <div class="flex place-content-between p-4 button-place hr">
+                            <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">10 Months</button>
+                        </div>
+                    </div>
+                </div>
+                <div class="flex relative shadow-xl area transition transform hover:-translate-y-4 motion-reduce:transition-none motion-reduce:hover:transform-none">
+                    <div class="">
+                        <img class="rounded-t-2xl img-size" src="/img/30.jpg" alt="">
+                        <h1 class="h1-text font-bold p-4">DSWD (Diploma In Smart Web Designing)</h1>
+                        <div class="flex place-content-between p-4 button-place hr">
+                            <button class="h-fit bg-blue-700 text-white p-2 text-xl rounded-lg">Register now</button>
+                            <button class="h-fit bg-yellow-500 text-white p-2 text-xl rounded-lg">10 Months</button>
                         </div>
                     </div>
                 </div>
@@ -116,6 +317,10 @@ import Header from "../components/Header.astro";
     <Mainfooter/>
 </Layout>
 <style>
+    .img-size {
+        width: 300px;
+        height: 200px;
+    }
     
     .h1-text {
         font-size: 24px;