r77766 / index.html
Rayan545454's picture
عن المعهد اضط زر بعدها شوف في رابط https://huggingface.co/spaces/Rayan545454/cc555 - Follow Up Deployment
f273c8c verified
<!DOCTYPE html>
<html lang="ar" dir="rtl">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>المعهد RT</title>
<link rel="icon" type="image/x-icon" href="/static/favicon.ico">
<script src="https://cdn.tailwindcss.com"></script>
<link href="https://fonts.googleapis.com/css2?family=Tajawal:wght@300;400;500;700&display=swap" rel="stylesheet">
<link href="https://unpkg.com/[email protected]/dist/aos.css" rel="stylesheet">
<script src="https://unpkg.com/[email protected]/dist/aos.js"></script>
<script src="https://cdn.jsdelivr.net/npm/feather-icons/dist/feather.min.js"></script>
<script src="https://unpkg.com/feather-icons"></script>
<style>
body {
font-family: 'Tajawal', sans-serif;
background-color: #f8f9fa;
}
.hero-bg {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}
.card-shadow {
box-shadow: 0 10px 30px -15px rgba(0,0,0,0.1);
transition: all 0.3s ease;
}
.card-shadow:hover {
transform: translateY(-5px);
box-shadow: 0 20px 40px -15px rgba(0,0,0,0.2);
}
.btn-primary {
background: linear-gradient(to right, #667eea, #764ba2);
transition: all 0.3s ease;
}
.btn-primary:hover {
transform: translateY(-2px);
box-shadow: 0 10px 20px rgba(0,0,0,0.1);
}
.feature-icon {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
}
</style>
</head>
<body class="bg-gray-50">
<!-- Header -->
<header class="bg-white shadow-sm sticky top-0 z-50">
<div class="container mx-auto px-4 py-4 flex justify-between items-center">
<div class="flex items-center">
<div class="bg-gradient-to-r from-purple-600 to-indigo-600 w-10 h-10 rounded-lg flex items-center justify-center text-white font-bold text-xl">RT</div>
<span class="mr-3 text-xl font-bold text-gray-800">المعهد RT</span>
</div>
<nav class="hidden md:flex space-x-8 space-x-reverse">
<a href="#" class="text-indigo-600 font-medium">الرئيسية</a>
<a href="https://enzostvs-deepsite.hf.space/projects/Rayan545454/r77766#" class="text-gray-600 hover:text-indigo-600 transition">عن المعهد</a>
<a href="#" class="text-gray-600 hover:text-indigo-600 transition">البرامج</a>
<a href="#" class="text-gray-600 hover:text-indigo-600 transition">الأساتذة</a>
<a href="#" class="text-gray-600 hover:text-indigo-600 transition">الأخبار</a>
<a href="#" class="text-gray-600 hover:text-indigo-600 transition">سجل الان</a>
</nav>
<button class="md:hidden text-gray-600">
<i data-feather="menu" class="w-6 h-6"></i>
</button>
</div>
</header>
<!-- Hero Section -->
<section class="hero-bg text-white py-20">
<div class="container mx-auto px-4 text-center">
<h1 class="text-4xl md:text-6xl font-bold mb-6" data-aos="fade-up">معهد RT للتعليم العالي</h1>
<p class="text-xl md:text-2xl mb-8 max-w-3xl mx-auto" data-aos="fade-up" data-aos-delay="100">نقدم تعليماً متقدماً في مختلف المجالات مع أساتذة متخصصين وبيئة تعليمية متطورة</p>
<div class="flex flex-col sm:flex-row justify-center gap-4" data-aos="fade-up" data-aos-delay="200">
<a href="#programs" class="bg-white text-indigo-600 font-bold py-3 px-8 rounded-lg hover:bg-gray-100 transition inline-flex items-center justify-center">تعرف على البرامج</a>
</div>
</div>
</section>
<!-- Features Section -->
<section class="py-20 bg-white">
<div class="container mx-auto px-4">
<div class="text-center mb-16" data-aos="fade-up">
<h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">لماذا تختار معهد RT؟</h2>
<p class="text-gray-600 max-w-2xl mx-auto">نوفر بيئة تعليمية متطورة وبرامج متخصصة لضمان نجاحك الأكاديمي والمهني</p>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
<div class="card-shadow bg-white rounded-xl p-6 text-center" data-aos="fade-up">
<div class="feature-icon w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-4">
<i data-feather="award" class="text-white w-8 h-8"></i>
</div>
<h3 class="text-xl font-bold text-gray-800 mb-2">شهادات معتمدة</h3>
<p class="text-gray-600">جميع شهاداتنا معتمدة من الجهات الرسمية والدولية</p>
</div>
<div class="card-shadow bg-white rounded-xl p-6 text-center" data-aos="fade-up" data-aos-delay="100">
<div class="feature-icon w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-4">
<i data-feather="users" class="text-white w-8 h-8"></i>
</div>
<h3 class="text-xl font-bold text-gray-800 mb-2">أساتذة متخصصون</h3>
<p class="text-gray-600">فريق تدريبي من الخبراء في مختلف التخصصات</p>
</div>
<div class="card-shadow bg-white rounded-xl p-6 text-center" data-aos="fade-up" data-aos-delay="200">
<div class="feature-icon w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-4">
<i data-feather="book-open" class="text-white w-8 h-8"></i>
</div>
<h3 class="text-xl font-bold text-gray-800 mb-2">مناهج حديثة</h3>
<p class="text-gray-600">مناهج محدثة تواكب التطورات في سوق العمل</p>
</div>
<div class="card-shadow bg-white rounded-xl p-6 text-center" data-aos="fade-up" data-aos-delay="300">
<div class="feature-icon w-16 h-16 rounded-full flex items-center justify-center mx-auto mb-4">
<i data-feather="globe" class="text-white w-8 h-8"></i>
</div>
<h3 class="text-xl font-bold text-gray-800 mb-2">فرص عمل</h3>
<p class="text-gray-600">شراكات مع الشركات لضمان فرص عمل للخريجين</p>
</div>
</div>
</div>
</section>
<!-- Programs Section -->
<section id="programs" class="py-20 bg-gray-50">
<div class="container mx-auto px-4">
<div class="text-center mb-16" data-aos="fade-up">
<h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">📚 المعهد RT الإلكتروني</h2>
<p class="text-gray-600 max-w-2xl mx-auto mb-6">أنا ريان بن خالد بن عبدالمحسن الثميري، مالك المعهد.<br>أحمل بكالوريوس إعلام/اتصال استراتيجي و دبلوم الأمن السيبراني.</p>
<p class="text-gray-700 max-w-3xl mx-auto text-lg mb-8">يقدم المعهد برامج متخصصة في:</p>
<div class="grid grid-cols-2 md:grid-cols-4 gap-4 max-w-2xl mx-auto mb-8">
<div class="bg-white p-4 rounded-lg shadow text-center font-medium">دبلوم اللغة الانجليزية</div>
<div class="bg-white p-4 rounded-lg shadow text-center font-medium">دبلوم الأمن السيبراني</div>
<div class="bg-white p-4 rounded-lg shadow text-center font-medium">دبلوم البرمجة</div>
<div class="bg-white p-4 rounded-lg shadow text-center font-medium">دبلوم التصميم</div>
</div>
<div class="bg-gradient-to-r from-purple-100 to-indigo-100 p-6 rounded-xl max-w-2xl mx-auto">
<p class="text-gray-800 text-lg italic">✨ الحكمة:<br>"بالعلم تبنى العقول، وبالإصرار تتحقق الطموحات و العلم قوة، والتقنية مستقبل."</p>
</div>
</div>
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
<div class="card-shadow bg-white rounded-xl overflow-hidden" data-aos="fade-up">
<img src="http://static.photos/education/640x360/1" alt="دبلوم اللغة الإنجليزية" class="w-full h-48 object-cover">
<div class="p-6">
<h3 class="text-xl font-bold text-gray-800 mb-2">دبلوم اللغة الإنجليزية</h3>
<p class="text-gray-600 mb-4">تطوير مهارات اللغة الإنجليزية للمبتدئين والمتقدمين</p>
<a href="https://mtjr.at/kOFfpAnAbc" class="btn-primary text-white font-bold py-2 px-4 rounded-lg hover:opacity-90 transition inline-block">ادفع دبلوم اللغة الإنجليزية</a>
</div>
</div>
<div class="card-shadow bg-white rounded-xl overflow-hidden" data-aos="fade-up" data-aos-delay="100">
<img src="http://static.photos/technology/640x360/2" alt="الأمن السيبراني" class="w-full h-48 object-cover">
<div class="p-6">
<h3 class="text-xl font-bold text-gray-800 mb-2">دبلوم الأمن السيبراني</h3>
<p class="text-gray-600 mb-4">حماية الأنظمة والمعلومات من التهديدات الإلكترونية</p>
</div>
</div>
<div class="card-shadow bg-white rounded-xl overflow-hidden" data-aos="fade-up" data-aos-delay="200">
<img src="http://static.photos/coding/640x360/3" alt="البرمجة" class="w-full h-48 object-cover">
<div class="p-6">
<h3 class="text-xl font-bold text-gray-800 mb-2">دبلوم البرمجة</h3>
<p class="text-gray-600 mb-4">تعلم لغات البرمجة وتطوير التطبيقات والأنظمة</p>
</div>
</div>
<div class="card-shadow bg-white rounded-xl overflow-hidden" data-aos="fade-up" data-aos-delay="300">
<img src="http://static.photos/design/640x360/4" alt="التصميم" class="w-full h-48 object-cover">
<div class="p-6">
<h3 class="text-xl font-bold text-gray-800 mb-2">دبلوم التصميم</h3>
<p class="text-gray-600 mb-4">إبداع تصاميم جذابة للواجهات والتطبيقات</p>
</div>
</div>
</div>
</div>
</section>
<!-- Stats Section -->
<section class="py-20 bg-gradient-to-r from-purple-600 to-indigo-600 text-white">
<div class="container mx-auto px-4">
<div class="grid grid-cols-2 md:grid-cols-4 gap-8 text-center">
<div data-aos="fade-up">
<div class="text-4xl md:text-5xl font-bold mb-2">5000+</div>
<div class="text-lg">طالب خريج</div>
</div>
<div data-aos="fade-up" data-aos-delay="100">
<div class="text-4xl md:text-5xl font-bold mb-2">150+</div>
<div class="text-lg">أساتذة متخصص</div>
</div>
<div data-aos="fade-up" data-aos-delay="200">
<div class="text-4xl md:text-5xl font-bold mb-2">25+</div>
<div class="text-lg">برنامج دراسي</div>
</div>
<div data-aos="fade-up" data-aos-delay="300">
<div class="text-4xl md:text-5xl font-bold mb-2">95%</div>
<div class="text-lg">نسبة التوظيف</div>
</div>
</div>
</div>
</section>
<!-- Testimonials Section -->
<section class="py-20 bg-white">
<div class="container mx-auto px-4">
<div class="text-center mb-16" data-aos="fade-up">
<h2 class="text-3xl md:text-4xl font-bold text-gray-800 mb-4">آراء خريجينا</h2>
<p class="text-gray-600 max-w-2xl mx-auto">قصص نجاح من خريجينا الذين حققوا أهدافهم المهنية</p>
</div>
<div class="grid grid-cols-1 md:grid-cols-3 gap-8">
<div class="card-shadow bg-white rounded-xl p-6" data-aos="fade-up">
<div class="flex items-center mb-4">
<img src="http://static.photos/people/320x240/1" alt="طالب" class="w-12 h-12 rounded-full object-cover ml-4">
<div>
<h4 class="font-bold text-gray-800">أحمد محمد</h4>
<p class="text-gray-600 text-sm">خريج علوم الحاسوب</p>
</div>
</div>
<p class="text-gray-600">"البرنامج ساعدني على الحصول على وظيفة في إحدى أكبر الشركات التقنية في المنطقة. أوصي به للجميع."</p>
</div>
<div class="card-shadow bg-white rounded-xl p-6" data-aos="fade-up" data-aos-delay="100">
<div class="flex items-center mb-4">
<img src="http://static.photos/people/320x240/2" alt="طالبة" class="w-12 h-12 rounded-full object-cover ml-4">
<div>
<h4 class="font-bold text-gray-800">فاطمة عبدالله</h4>
<p class="text-gray-600 text-sm">خريجة إدارة الأعمال</p>
</div>
</div>
<p class="text-gray-600">"البيئة الأكاديمية ممتازة والأساتذة داعمون جداً. ساعدني البرنامج على تطوير مهاراتي القيادية."</p>
</div>
<div class="card-shadow bg-white rounded-xl p-6" data-aos="fade-up" data-aos-delay="200">
<div class="flex items-center mb-4">
<img src="http://static.photos/people/320x240/3" alt="طالب" class="w-12 h-12 rounded-full object-cover ml-4">
<div>
<h4 class="font-bold text-gray-800">خالد سعيد</h4>
<p class="text-gray-600 text-sm">خريج التمريض</p>
</div>
</div>
<p class="text-gray-600">"التدريب العملي كان ممتازاً وفتح لي أبواباً عديدة في مجال التمريض. شكرًا للفريق الرائع."</p>
</div>
</div>
</div>
</section>
<!-- CTA Section -->
<section class="py-20 bg-gradient-to-r from-indigo-500 to-purple-600 text-white">
<div class="container mx-auto px-4 text-center">
<h2 class="text-3xl md:text-4xl font-bold mb-6" data-aos="fade-up">هل أنت جاهز للبدء؟</h2>
<p class="text-xl mb-8 max-w-2xl mx-auto" data-aos="fade-up" data-aos-delay="100">انضم إلينا اليوم وابدأ رحلتك الأكاديمية نحو النجاح</p>
<div class="flex flex-col sm:flex-row justify-center gap-4" data-aos="fade-up" data-aos-delay="200">
<a href="https://huggingface.co/spaces/Rayan545454/cs46" class="border-2 border-white text-white font-bold py-3 px-8 rounded-lg hover:bg-white hover:text-indigo-600 transition inline-flex items-center justify-center">سجل الان</a>
</div>
</div>
</section>
<!-- Footer -->
<footer class="bg-gray-900 text-white py-12">
<div class="container mx-auto px-4">
<div class="grid grid-cols-1 md:grid-cols-4 gap-8">
<div>
<div class="flex items-center mb-4">
<div class="bg-gradient-to-r from-purple-600 to-indigo-600 w-8 h-8 rounded-lg flex items-center justify-center text-white font-bold">RT</div>
<span class="mr-2 text-lg font-bold">المعهد RT</span>
</div>
<p class="text-gray-400 mb-4">معهد تعليمي متقدم يهدف إلى تمكين الطلاب وتأهيلهم للسوق المهني</p>
<div class="flex space-x-4 space-x-reverse">
<a href="#" class="text-gray-400 hover:text-white transition"><i data-feather="facebook" class="w-5 h-5"></i></a>
<a href="#" class="text-gray-400 hover:text-white transition"><i data-feather="twitter" class="w-5 h-5"></i></a>
<a href="#" class="text-gray-400 hover:text-white transition"><i data-feather="instagram" class="w-5 h-5"></i></a>
<a href="#" class="text-gray-400 hover:text-white transition"><i data-feather="linkedin" class="w-5 h-5"></i></a>
</div>
</div>
<div>
<h3 class="text-lg font-bold mb-4">روابط سريعة</h3>
<ul class="space-y-2">
<li><a href="#" class="text-gray-400 hover:text-white transition">الرئيسية</a></li>
<li><a href="https://huggingface.co/spaces/Rayan545454/cc555" class="text-gray-400 hover:text-white transition">عن المعهد</a></li>
<li><a href="#" class="text-gray-400 hover:text-white transition">البرامج</a></li>
<li><a href="#" class="text-gray-400 hover:text-white transition">الأساتذة</a></li>
<li><a href="#" class="text-gray-400 hover:text-white transition">الأخبار</a></li>
</ul>
</div>
<div>
<h3 class="text-lg font-bold mb-4">البرامج</h3>
<ul class="space-y-2">
<li><a href="#" class="text-gray-400 hover:text-white transition">علوم الحاسوب</a></li>
<li><a href="#" class="text-gray-400 hover:text-white transition">إدارة الأعمال</a></li>
<li><a href="#" class="text-gray-400 hover:text-white transition">التمريض</a></li>
<li><a href="#" class="text-gray-400 hover:text-white transition">هندسة البرمجيات</a></li>
<li><a href="#" class="text-gray-400 hover:text-white transition">التسويق الرقمي</a></li>
</ul>
</div>
</div>
<div class="border-t border-gray-800 mt-8 pt-8 text-center text-gray-400">
<p>&copy; 2023 المعهد RT. جميع الحقوق محفوظة.</p>
</div>
</div>
</footer>
<script>
AOS.init({
duration: 800,
easing: 'ease-in-out'
});
feather.replace();
</script>
</body>
</html>