dev sp 2023-01-18 15:18:55 +00:00
parent f7507ccaea
commit af8c3d4409
24 changed files with 625 additions and 40 deletions

BIN
public/img/1.jpg Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 92 KiB

BIN
public/img/2.png Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 219 KiB

BIN
public/img/3.jpg Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 356 KiB

BIN
public/img/4.jpg Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 187 KiB

BIN
public/img/5.jpg Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 356 KiB

BIN
public/img/6.jpg Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 246 KiB

BIN
public/img/7.jpg Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 282 KiB

BIN
public/img/8.jpg Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 494 KiB

BIN
public/img/image1.png Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 941 KiB

BIN
public/img/image2.png Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 696 KiB

BIN
public/img/image3.png Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 229 KiB

BIN
public/img/image4.png Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 174 KiB

BIN
public/img/image5.png Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 270 KiB

BIN
public/img/image6.png Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 697 KiB

BIN
public/img/image7.png Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 354 KiB

BIN
public/img/rgylogo.png Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 45 KiB

12
public/img/svg/mail.svg Normal file
View File

@ -0,0 +1,12 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="25" height="25" viewBox="0 0 256 256" xml:space="preserve">
<defs>
</defs>
<g style="stroke: none; stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: none; fill-rule: nonzero; opacity: 1;" transform="translate(18.12918287937744 18.12918287937744) scale(2.43 2.43)" >
<path d="M 75.546 78.738 H 14.455 C 6.484 78.738 0 72.254 0 64.283 V 25.716 c 0 -7.97 6.485 -14.455 14.455 -14.455 h 61.091 c 7.97 0 14.454 6.485 14.454 14.455 v 38.567 C 90 72.254 83.516 78.738 75.546 78.738 z M 14.455 15.488 c -5.64 0 -10.228 4.588 -10.228 10.228 v 38.567 c 0 5.64 4.588 10.229 10.228 10.229 h 61.091 c 5.64 0 10.228 -4.589 10.228 -10.229 V 25.716 c 0 -5.64 -4.588 -10.228 -10.228 -10.228 H 14.455 z" style="stroke: none; stroke-width: 50; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(255,255,255); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
<path d="M 11.044 25.917 C 21.848 36.445 32.652 46.972 43.456 57.5 c 2.014 1.962 5.105 -1.122 3.088 -3.088 C 35.74 43.885 24.936 33.357 14.132 22.83 C 12.118 20.867 9.027 23.952 11.044 25.917 L 11.044 25.917 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(255,255,255); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round"/>
<path d="M 46.544 57.5 c 10.804 -10.527 21.608 -21.055 32.412 -31.582 c 2.016 -1.965 -1.073 -5.051 -3.088 -3.088 C 65.064 33.357 54.26 43.885 43.456 54.412 C 41.44 56.377 44.529 59.463 46.544 57.5 L 46.544 57.5 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(255,255,255); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
<path d="M 78.837 64.952 c -7.189 -6.818 -14.379 -13.635 -21.568 -20.453 c -2.039 -1.933 -5.132 1.149 -3.088 3.088 c 7.189 6.818 14.379 13.635 21.568 20.453 C 77.788 69.973 80.881 66.89 78.837 64.952 L 78.837 64.952 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(255,255,255); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
<path d="M 14.446 68.039 c 7.189 -6.818 14.379 -13.635 21.568 -20.453 c 2.043 -1.938 -1.048 -5.022 -3.088 -3.088 c -7.189 6.818 -14.379 13.635 -21.568 20.453 C 9.315 66.889 12.406 69.974 14.446 68.039 L 14.446 68.039 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(255,255,255); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.9 KiB

8
public/img/svg/phone.svg Normal file
View File

@ -0,0 +1,8 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="25" height="25" viewBox="0 0 256 256" xml:space="preserve">
<defs>
</defs>
<g style="stroke: none; stroke-width: 0; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: none; fill-rule: nonzero; opacity: 1;" transform="translate(1.4065934065934016 1.4065934065934016) scale(2.81 2.81)" >
<path d="M 64.533 0 H 25.467 c -3.829 0 -6.944 3.115 -6.944 6.944 v 76.112 c 0 3.829 3.115 6.944 6.944 6.944 h 39.065 c 3.829 0 6.944 -3.115 6.944 -6.944 V 6.944 C 71.477 3.115 68.362 0 64.533 0 z M 39.593 7.097 h 10.814 c 1.081 0 1.957 0.876 1.957 1.957 c 0 1.08 -0.876 1.956 -1.957 1.956 H 39.593 c -1.081 0 -1.957 -0.876 -1.957 -1.956 C 37.636 7.973 38.512 7.097 39.593 7.097 z M 45 83.684 c -1.891 0 -3.424 -1.533 -3.424 -3.424 c 0 -1.891 1.533 -3.424 3.424 -3.424 s 3.424 1.533 3.424 3.424 C 48.424 82.151 46.891 83.684 45 83.684 z M 67.564 70.52 H 22.436 V 18.017 h 45.128 V 70.52 z" style="stroke: none; stroke-width: 1; stroke-dasharray: none; stroke-linecap: butt; stroke-linejoin: miter; stroke-miterlimit: 10; fill: rgb(255,255,255); fill-rule: nonzero; opacity: 1;" transform=" matrix(1 0 0 1 0 0) " stroke-linecap="round" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.3 KiB

View File

@ -0,0 +1,41 @@
<main>
<section class="container-fluid background">
<div class="flex flex-col lg:flex-row place-content-between container mx-auto h-fit">
<div class="flex place-items-center w-full">
<img class="w-24" src="/img/rgylogo.png" alt="">
<h1 class="text-white text-size font-bold px-4">RAJEEV GANDHI YOUTH COMPUTER INSTITUTE</h1>
<h1>Online </h1>
</div>
<div class="flex place-items-center w-full justify-end gap-x-4 xl:gap-x-8 text-white text-lg md:text-2xl cursor-pointer">
<p class="flex inline-flex hover:text-yellow-400"><img class="" src="/img/svg/phone.svg" alt="">&nbsp;+91 7318992100;</p>
<p class="flex inline-flex hover:text-yellow-400 pr-10"><img src="/img/svg/mail.svg" alt="">&nbsp;ho@rgyci.org</p>
</div>
<div class="flex text-lg md:text-2xl pb-0 pr-10 justify-end"><button class="text-white hover:text-yellow-400">Login</button></div>
</div>
</section>
<section>
</section>
</main>
<style>
.background {
background-color: #07294d;
}
/* .text-size {
font-size: 30px;
font-style: bold;
} */
@media screen and (min-width: 601px) {
.text-size {
font-size: 25px;
}
}
@media screen and (max-width: 600px) {
.text-size {
font-size: 20px;
}
}
</style>

View File

@ -1,48 +1,61 @@
<div class="hidden md:block">
<div class="navbar ">
<a href="#home">Home</a>
<a href="#news">News</a>
<div class="dropdownDesktop">
<button class="dropbtnDesktop">Dropdown
<i class="fa fa-caret-downDesktop"></i>
</button>
<div class="dropdown-contentDesktop">
<a href="#">Link 1</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
</div>
</div>
</div>
</div>
<div class="mobileTopMenu block md:hidden">
<div class="topnavMobile">
<a href="#home" class="active">Logo</a>
<div id="mobileMenu" class="hidden">
<a href="#news">News</a>
<a href="#contact">Contact</a>
<div class="dropdown">
<button class="dropbtn">Dropdown
&#8964
<main class="container-fluid">
<div class="hidden md:block flex justify-center">
<div class="navbar">
<a href="#home">Home</a>
<div class="dropdownDesktop">
<button class="dropbtnDesktop">About
<i class="fa fa-caret-downDesktop"></i>
</button>
<div class="dropdown-content">
<div class="dropdown-contentDesktop">
<a href="#">About Us</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
</div>
</div>
<a href="#news">News</a>
<div class="dropdownDesktop">
<button class="dropbtnDesktop">Dropdown
<i class="fa fa-caret-downDesktop"></i>
</button>
<div class="dropdown-contentDesktop">
<a href="#">Link 1</a>
<a href="#">Link 2Link 2Link 2</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
</div>
</div>
<a href="#about">About</a>
<a href="#about">About</a>
<a href="#about">About</a>
<a href="#about">About</a>
</div>
<a class="icon" onclick="openMobileMenu()">
&#9776;
</a>
</div>
<div class="mobileTopMenu block md:hidden">
<div class="topnavMobile">
<a href="#home" class="active">Logo</a>
<div id="mobileMenu" class="hidden">
<a href="#news">News</a>
<a href="#contact">Contact</a>
<div class="dropdown">
<button class="dropbtn">Dropdown
&#11183
</button>
<div class="dropdown-content">
<a href="#">Link 1</a>
<a href="#">Link 2Link 2Link 2</a>
<a href="#">Link 3</a>
</div>
</div>
<a href="#about">About</a>
<a href="#about">About</a>
<a href="#about">About</a>
<a href="#about">About</a>
</div>
<a class="icon" onclick="openMobileMenu()">
&#9776;
</a>
</div>
</div>
</div>
</main>
<script is:inline>

View File

@ -0,0 +1,35 @@
<main>
<section class="container-fluid" style="background-color: #343a40;">
<div class="grid grid-cols-1 lg:grid-cols-2 xl:grid-cols-3 container mx-auto xl:place-items-center py-10 px-6" >
<div class="grid">
<div class="flex ">
<img class="w-20 flex" src="/img/rgylogo.png" alt=""><p class="text-3xl font-bold text-white pt-2">RGYCSM</p>
</div>
<div class="text-white text-lg">
<p class=""><strong>Head Office : </strong>Habra, North 24 Parganas, West Bengal</p>
<p><strong>Phone : </strong>+91 7318992100</p>
<p><strong>Email : </strong>ho@rgyci.org</p>
</div>
</div>
<div class="grid text-white text-lg">
<p class="pt-2 text-xl font-bold pb-4">Useful Links</p>
<a href="#">Home</a>
<a href="#">About Us</a>
<a href="#">Terms of Service</a>
<a href="#">Privacy Policy</a>
</div>
<div class="grid text-white text-lg">
<p class="text-xl font-bold pt-2 pb-4">Get in Touch</p>
<a href="#">Authorized Study Centres</a>
<a href="#">How to Get Affiliation?</a>
<a href="#">Examinations</a>
<a href="#">Student Registration</a>
</div>
</div>
<div class="flex flex-col lg:flex-row place-content-between bg-gray-800 text-xl text-white">
<div class="flex py-4 px-8">© Copyright RGYCI. All Rights Reserved</div>
<div class="py-4 px-8">Designed by<a class="text-blue-700 hover:underline" href=""> DWD Consultancy Service</a></div>
</div>
</section>
</main>

239
src/components/Menu.astro Normal file
View File

@ -0,0 +1,239 @@
<main class="container-fluid navbar">
<!-- Desktop Menu -->
<div class="container mx-auto flex justify-center">
<div class="hidden md:block py-4">
<div class="navbar">
<a href="#home">Home</a>
<div class="dropdownDesktop">
<button class="dropbtnDesktop">About
<i class="fa fa-caret-downDesktop"></i>
</button>
<div class="dropdown-contentDesktop">
<a href="#">About Us</a>
<a href="#">Chairman Message</a>
<a href="#">Adninistrator</a>
</div>
</div>
<a href="#news">Center List</a>
<div class="dropdownDesktop">
<button class="dropbtnDesktop">Courses
<i class="fa fa-caret-downDesktop"></i>
</button>
<div class="dropdown-contentDesktop">
<a href="#">Online Courses</a>
<a href="#">Offline Courses</a>
</div>
</div>
<div class="dropdownDesktop">
<button class="dropbtnDesktop">Student Zone
<i class="fa fa-caret-downDesktop"></i>
</button>
<div class="dropdown-contentDesktop">
<a href="#">Check Registration</a>
<a href="#">Result</a>
<a href="#">Certificate Verification</a>
<a href="#">Download</a>
<a href="#">Online Exam</a>
<a href="#">Student's Placement Form</a>
<a href="#">Library</a>
</div>
</div>
<div class="dropdownDesktop">
<button class="dropbtnDesktop">Franchise
<i class="fa fa-caret-downDesktop"></i>
</button>
<div class="dropdown-contentDesktop">
<a href="#">Procedure</a>
<a href="#">Enquiry</a>
<a href="#">Company's Placement Form</a>
</div>
</div>
<a href="#home">Gallery</a>
<a href="#home">Contact Us</a>
<div class="dropdownDesktop">
<button class="dropbtnDesktop">Login
<i class="fa fa-caret-downDesktop"></i>
</button>
<div class="dropdown-contentDesktop">
<a href="#">Center</a>
<a href="#">Teacher</a>
</div>
</div>
</div>
</div>
</div>
<!-- Mobile Menu -->
<div class="mobileTopMenu block md:hidden">
<div class="topnavMobile">
<a href="#home" class="active">Logo</a>
<div id="mobileMenu" class="hidden">
<a href="#news">News</a>
<a href="#contact">Contact</a>
<div class="dropdown">
<button class="dropbtn">Dropdown
&#11183
</button>
<div class="dropdown-content">
<a href="#">Link 1</a>
<a href="#">Link 2Link 2Link 2</a>
<a href="#">Link 3</a>
</div>
</div>
<a href="#about">About</a>
<a href="#about">About</a>
<a href="#about">About</a>
<a href="#about">About</a>
</div>
<a class="icon" onclick="openMobileMenu()">
&#9776;
</a>
</div>
</div>
</main>
<script is:inline>
function openMobileMenu() {
var element = document.getElementById("mobileMenu");
element.classList.toggle("hidden");
}
</script>
<style>
.navbar {
overflow: hidden;
background-color: rgb(150, 39, 39);
/* position: absolute;
width: 100%;
left: 0;
top: 0; */
}
.navbar a {
float: left;
font-size: 16px;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
.dropdownDesktop {
float: left;
overflow: hidden;
}
.dropdownDesktop .dropbtnDesktop {
font-size: 16px;
border: none;
outline: none;
color: white;
padding: 14px 16px;
background-color: inherit;
font-family: inherit;
margin: 0;
}
.navbar a:hover, .dropdownDesktop:hover .dropbtnDesktop {
background-color: red;
}
.dropdown-contentDesktop {
display: none;
position: absolute;
background-color: #f9f9f9;
min-width: 160px;
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
z-index: 1;
}
.dropdown-contentDesktop a {
float: none;
color: black;
padding: 12px 16px;
text-decoration: none;
display: block;
text-align: left;
}
.dropdown-contentDesktop a:hover {
background-color: #ddd;
}
.dropdownDesktop:hover .dropdown-contentDesktop {
display: block;
}
/* .mobileTopMenu{
position: absolute;
top:0;
left:0;
width:100%;
} */
.dropdown:hover .dropdown-content {
display: block;
background-color: #ddd;
}
.dropdown-content a:hover {
background-color: #ddd;
}
.dropdown-content {
display: none;
position: absolute;
z-index: 1;
}
.dropdown-content a {
float: none;
text-decoration: none;
display: block;
text-align: left;
}
.topnavMobile {
overflow: hidden;
background-color: #333;
position: relative;
}
.topnavMobile a, .topnavMobile >div > div {
color: white;
padding: 14px 16px;
text-decoration: none;
font-size: 17px;
display: block;
}
.topnavMobile a.icon {
background: black;
display: block;
position: absolute;
right: 0;
top: 0;
}
.topnavMobile a:hover {
background-color: #ddd;
color: black;
}
.active {
background-color: #aa6204;
color: white;
}
</style>

View File

@ -1,12 +1,12 @@
---
import Layout from '../layouts/Layout.astro';
import Card from '../components/Card.astro';
import MainHeader from '../components/MainHeader.astro';
import Menu from '../components/Menu.astro';
import Footer from '../components/Footer.astro';
---
<Layout title="Welcome to Astro.">
<MainHeader />
<Menu />
<main>
<h1>Welcome to <span class="text-gradient">Astro</span></h1>
<p class="instructions">

237
src/pages/page1.astro Normal file
View File

@ -0,0 +1,237 @@
---
import Header from '../components/Header.astro';
import Layout from '../layouts/Layout.astro';
import Menu from '../components/Menu.astro';
import Mainfooter from '../components/Mainfooter.astro';
---
<Layout title="Welcome to RGYCSM">
<Header/>
<Menu />
<main class="">
<!-- <section>
<div class="grid grid-cols-1 lg:grid-cols-2 gap-16">
<div class="grid box1 shadow-2xl rounded-tr-full rounded-br-full border-8 border-gray-300">
<p class="text-3xl font-bold pt-6 px-6"><span class="underline decoration-4 decoration-red-600">About</span> Us</p>
<p class="w-11/12 text-justify pt-4 px-4 text-xl leading-tight ">The Rajeev Gandhi Youth Computer Saksharta Mission (RGYCSM) Computer Education, Distance Education Institute of with brand name RGYCSM started its Journey in March 2014. The main function of the Trust is to provide higher technical education for every group of urban and rural areas to get success in computer revolution which is the main dream of Indian Govt. RGYCSM is a non Commercial organization engaged in the work of social welfare, started with a mission to education service and spread literacy to all class of people.
<br>
<div class="p-4"><button class="bg-yellow-400 px-4 py-2 rounded-full shadow-2xl text-white text-xl">Read More</button></div>
</p>
</div>
</div>
</section> -->
<section class="container mx-auto py-24">
<p class="text-center text-4xl py-20 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-2xl 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="">
<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>
</div>
</div>
</div>
<div class="flex relative shadow-2xl 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="">
<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>
</div>
</div>
</div>
<div class="flex relative shadow-2xl 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="">
<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>
</div>
</div>
</div>
<div class="flex relative shadow-2xl 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="">
<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>
</div>
</div>
</div>
<div class="flex relative shadow-2xl 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="">
<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>
</div>
</div>
</div>
<div class="flex relative shadow-2xl 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="">
<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>
</div>
</div>
</div>
<div class="flex relative shadow-2xl 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="">
<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>
</div>
</div>
</div>
<div class="flex relative shadow-2xl 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="">
<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>
</div>
</div>
</div>
<div class="flex relative shadow-2xl 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="">
<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>
</div>
</div>
</div>
</div>
</section>
<!-- image gallery -->
<section class="container mx-auto">
<p class="text-4xl font-bold text-center py-16">Im<span class="underline decoration-4 decoration-red-600">age Gall</span>ery</p>
<div class="grid grid-cols-1 md:grid-2 xl:grid-cols-4 gap-8 pb-16">
<div class="grid relative justify-center bg"><img class="bg" src="/img/1.jpg" alt="">
<p class="position text-center py-3 text-white">RGYCI No. 1 Computer Institute</p>
</div>
<div class="grid relative justify-center bg"><img class="bg" src="/img/2.png" alt="">
<p class="position text-center py-3 text-white">Stay Home: Online Admission & Classes Available</p>
</div>
<div class="grid relative justify-center"><img class="" src="/img/3.jpg" alt="">
<p class="position text-center py-3 text-white">ISO 9001 : 2015 Certified Institute</p>
</div>
<div class="grid relative justify-center"><img class="" src="/img/4.jpg" alt="">
<p class="position text-center py-3 text-white">5 Star Rating Institute</p>
</div>
<div class="grid relative justify-center"><img class="" src="/img/5.jpg" alt="">
<p class="position text-center py-3 text-white">Skilled and Helpfull Employee</p>
</div>
<div class="grid relative justify-center"><img class="" src="/img/6.jpg" alt="">
<p class="position text-center py-3 text-white">Members are Happy with RGYCI</p>
</div>
<div class="grid relative justify-center"><img class="" src="/img/7.jpg" alt="">
<p class="position text-center py-3 text-white">Courses are registered under C.V.C act of ministry of HRD (Dept. of secondary & higher education govt. of india)</p>
</div>
<div class="grid relative justify-center"><img class="" src="/img/8.jpg" alt="">
<p class="position text-center py-3 text-white">Very Gratefull to You</p>
</div>
</div>
</section>
<section class="container mx-auto my-16">
<div class="grid grid-cols-1 lg:grid-cols-2">
<div class="grid notice-area rounded-b-xl shadow-xl" style="border-bottom-width: 16px; border-color: #b7f7ec;">
<p class="text-center text-2xl font-bold rounded-t-xl" style="background-color: #b7f7ec;">Notice Board</p>
<div class="px-3 text-lg text-white overflow-y-scroll" style="background-color: #000080;">
<p class="py-2 border-bottom hover:underline"><a href="">We are offering franchise to all our center Director. This New Year franchise offer is 40,000/- for Rural and 50,000/- for Urban to all center Director.</a></p>
<p class="py-2 border-bottom hover:underline"><a href="">Never miss the golden chance to start your new career. It will help the Director in Self development and a good opportunity for them to be financially strong they can earn up to 50,000 a month dont wait any more open your institute and be self independent.</a></p>
<p class="py-2 border-bottom hover:underline"><a href="">Come lets us join hands together to build India a Digital India and provide cheap Computer Education</a> </p>
<p class="py-2 border-bottom hover:underline"><a href="">We are providing Online course, Admission and classes online and also career guidance.</a></p>
</div>
</div>
</div>
</section>
</main>
<Mainfooter />
</Layout>
<style>
.notice-area {
width: 450px;
height: 600px;
}
.border-bottom {
border-bottom: 2px solid #000000;
}
.bg {
width: 100%;
height: 100%;
}
.position {
width: 100%;
position: absolute ;
bottom: 0%;
font-size: 20px;
background-color: rgb(0, 0, 0); opacity:0.6;
}
.box1 {
width: 100%;
height: auto;
/* border-top-right-radius: full; */
/* border-bottom-right-radius: full; */
}
.box2 {
width: 100%;
height: auto;
border-top-left-radius: 200px;
border-bottom-left-radius: 200px;
padding-top: 48px;
padding-bottom: 84px;
}
.area {
width: 300px;
height: 450px;
background-color: rgb(215, 247, 244);
border-radius: 16px;
}
.hr {
border-top: 2px solid red;
}
.img-size {
width: 300px;
height: 170px;
}
.button-place {
position: sticky;
width: 100%;
bottom: 0px;
position: fixed;
}
.h1-text {
font-size: 24px;
color: black;
}
.h1-text:hover {
color: rgb(211, 162, 0);
}
</style>