diff --git a/course-funnel-website|atulcodex.png b/course-funnel-website|atulcodex.png deleted file mode 100644 index 6ae0dad..0000000 Binary files a/course-funnel-website|atulcodex.png and /dev/null differ diff --git a/fonts/Gilroy-ExtraBold.otf b/fonts/Gilroy-ExtraBold.otf new file mode 100644 index 0000000..7413e3d Binary files /dev/null and b/fonts/Gilroy-ExtraBold.otf differ diff --git a/fonts/Gilroy-Light.otf b/fonts/Gilroy-Light.otf new file mode 100644 index 0000000..dbc0512 Binary files /dev/null and b/fonts/Gilroy-Light.otf differ diff --git a/img/Alimzhan.png b/img/Alimzhan.png new file mode 100644 index 0000000..e860e72 Binary files /dev/null and b/img/Alimzhan.png differ diff --git a/img/Aripzhan.png b/img/Aripzhan.png new file mode 100644 index 0000000..2fbe323 Binary files /dev/null and b/img/Aripzhan.png differ diff --git a/img/AripzhanPap.png b/img/AripzhanPap.png new file mode 100644 index 0000000..8122abf Binary files /dev/null and b/img/AripzhanPap.png differ diff --git a/img/Bernara.png b/img/Bernara.png new file mode 100644 index 0000000..ea1f676 Binary files /dev/null and b/img/Bernara.png differ diff --git a/img/Elnura.png b/img/Elnura.png new file mode 100644 index 0000000..d8bb4af Binary files /dev/null and b/img/Elnura.png differ diff --git a/img/Ernar-azhe.png b/img/Ernar-azhe.png new file mode 100644 index 0000000..674d3a0 Binary files /dev/null and b/img/Ernar-azhe.png differ diff --git a/img/Esim.png b/img/Esim.png new file mode 100644 index 0000000..460a21f Binary files /dev/null and b/img/Esim.png differ diff --git a/img/Komekbaev.png b/img/Komekbaev.png new file mode 100644 index 0000000..800c61b Binary files /dev/null and b/img/Komekbaev.png differ diff --git a/img/Mukhammed.png b/img/Mukhammed.png new file mode 100644 index 0000000..67f6c5b Binary files /dev/null and b/img/Mukhammed.png differ diff --git a/img/Nurbaqyt.png b/img/Nurbaqyt.png new file mode 100644 index 0000000..9625bdc Binary files /dev/null and b/img/Nurbaqyt.png differ diff --git a/img/Roza.png b/img/Roza.png new file mode 100644 index 0000000..d1d648f Binary files /dev/null and b/img/Roza.png differ diff --git a/img/Samgar.png b/img/Samgar.png new file mode 100644 index 0000000..48013ad Binary files /dev/null and b/img/Samgar.png differ diff --git a/img/Symbar.png b/img/Symbar.png new file mode 100644 index 0000000..cd49292 Binary files /dev/null and b/img/Symbar.png differ diff --git a/img/We.JPG b/img/We.JPG new file mode 100644 index 0000000..5b349db Binary files /dev/null and b/img/We.JPG differ diff --git a/img/ata-ana2.png b/img/ata-ana2.png new file mode 100644 index 0000000..93cbf24 Binary files /dev/null and b/img/ata-ana2.png differ diff --git a/img/bg-handbook.jpg b/img/bg-handbook.jpg new file mode 100644 index 0000000..2587de2 Binary files /dev/null and b/img/bg-handbook.jpg differ diff --git a/img/bg-image.jpg b/img/bg-image.jpg new file mode 100644 index 0000000..93751ba Binary files /dev/null and b/img/bg-image.jpg differ diff --git a/img/bg-piyatno.png b/img/bg-piyatno.png new file mode 100644 index 0000000..d824047 Binary files /dev/null and b/img/bg-piyatno.png differ diff --git a/img/category-bg-dark2.png b/img/category-bg-dark2.png new file mode 100644 index 0000000..492202e Binary files /dev/null and b/img/category-bg-dark2.png differ diff --git a/img/course-facility.png b/img/course-facility.png deleted file mode 100644 index 5025738..0000000 Binary files a/img/course-facility.png and /dev/null differ diff --git a/img/facility-alibek.png b/img/facility-alibek.png new file mode 100644 index 0000000..655663d Binary files /dev/null and b/img/facility-alibek.png differ diff --git a/img/facility-photo.JPG b/img/facility-photo.JPG new file mode 100644 index 0000000..bb389cb Binary files /dev/null and b/img/facility-photo.JPG differ diff --git a/img/logo_amjilcyberacademy.svg b/img/logo_amjilcyberacademy.svg new file mode 100644 index 0000000..101409e --- /dev/null +++ b/img/logo_amjilcyberacademy.svg @@ -0,0 +1,49 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/img/logo_amjilcyberschool.svg b/img/logo_amjilcyberschool.svg new file mode 100644 index 0000000..11b6b95 --- /dev/null +++ b/img/logo_amjilcyberschool.svg @@ -0,0 +1,47 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/img/logo_astanahub.svg b/img/logo_astanahub.svg new file mode 100644 index 0000000..d9aa9dc --- /dev/null +++ b/img/logo_astanahub.svg @@ -0,0 +1,28 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/img/logo_bookingcom.svg b/img/logo_bookingcom.svg new file mode 100644 index 0000000..1d9079f --- /dev/null +++ b/img/logo_bookingcom.svg @@ -0,0 +1,22 @@ + + + + + + + + + + + + + + + + + + + + + + diff --git a/img/logo_fiverr.svg b/img/logo_fiverr.svg new file mode 100644 index 0000000..3a2c3fa --- /dev/null +++ b/img/logo_fiverr.svg @@ -0,0 +1,10 @@ + + + + + + + + + + diff --git a/img/logo_kaspikz.svg b/img/logo_kaspikz.svg new file mode 100644 index 0000000..5e99e0e --- /dev/null +++ b/img/logo_kaspikz.svg @@ -0,0 +1,4 @@ + + + + diff --git a/img/logos_upwork.svg b/img/logos_upwork.svg new file mode 100644 index 0000000..979de2a --- /dev/null +++ b/img/logos_upwork.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/img/new-facility.JPG b/img/new-facility.JPG new file mode 100644 index 0000000..4e2d291 Binary files /dev/null and b/img/new-facility.JPG differ diff --git a/img/team.jpg b/img/team.jpg new file mode 100644 index 0000000..f2fb380 Binary files /dev/null and b/img/team.jpg differ diff --git a/index.html b/index.html index 553ebb6..514e5c0 100644 --- a/index.html +++ b/index.html @@ -3,7 +3,7 @@ - Course funnel landing page + Amjilt Cyber Academy @@ -15,46 +15,110 @@
+ +
☰
+ + + + +
-

- Learn from the Experts
- Anytime, Anywhere. -

-

- Lorem Ipsum is simply dummied text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s. -

- +

+ Үш сала бір бағдарлама!
+ Болашақ мамандар осында қалыптасады +

+

+ IT, Дизайн және Маркетинг әлеміне жолыңызды бізбен бірге бастаңыз +

+
-
+ -
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +

- Change is the end result of all true learning + Amjilt Cyber Academy туралы

- Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s. + Amjilt Cyber Academy — Қазақстандағы қазақ тілінде IT мамандандыруға негізделген алғашқы оқу орталығы. Біз 5 жылдан астам уақыт бойы ақпараттық технологиялар саласында сапалы білім беріп, мыңдаған жастарға жаңа мүмкіндіктер есігін ашып келеміз.

- course about + course about
@@ -63,78 +127,92 @@

-
-
+
+

- Course Categories + Курс түрлері

- Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s. + FullStack, Графикалық дизайн және Цифрлық маркетинг курстары бір кешенде оқытылады. Қосымша English мен AI модульдері студенттердің бәсекеге қабілеттілігін күшейтеді.

-
- -

Graphic Design

-

- 22 Courses -

-
- -
- -

Content Writing

-

- 22 Courses -

-
- -
- -

Business

-

- 22 Courses -

-
- -
- -

Marketing

-

- 22 Courses -

-
- -
- -

Technology

-

- 22 Courses -

-
- -
- -

HR & Leadership

-

- 22 Courses -

+
+
+ +

FullStack

+

+ Веб-бағдарламашы +

+
+ +
+ +

English

+

+ Ағылшын тілі +

+
+ +
+ +

AI

+

+ Жасанды Интеллект +

+
- -
- -

Enterpreneurship

-

- 22 Courses -

+ +
+
+ +

Graphic Design

+

+ Графикалық дизайн +

+
+ +
+ +

English

+

+ Ағылшын тілі +

+
+ +
+ +

AI

+

+ Жасанды Интеллект +

+
+ +
+
+ +

Digital Marketing

+

+ Цифрлық маркетинг +

+
-
- -

Leadership

-

- 22 Courses -

+
+ +

English

+

+ Ағылшын тілі +

+
+ +
+ +

AI

+

+ Жасанды Интеллект +

+
@@ -147,46 +225,42 @@

Leadership

- +
-

Our Facilities

-

- Lorem Ipsum has been the industry's standard dummy text ever since the 1500s. -

+

Оқыту жүйесі

- +

- Global Certified + Қазақ тілінде оқыту

- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis. + Мұнда әлемдік стандарттар мен жаңа әдістемелер ана тілімізде ұғынықты түрде түсіндіріледі.

-
- +

- Books & Library + PBL - жобаға негізделген үйрету жүйесі

- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis. + Жобаға негізделген оқыту арқылы теориялық материал нақты контекстке енгізіледі.

- +

- Alumni Support + 100% практика

- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis. + Практикалық сабақтарға басымдық беру – сізді “білушіден” “жасайтын” маманға айналдырады.

@@ -202,26 +276,26 @@

- 5 Years of Success! + 5 жылдық Тәжірибе!

- Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s. + Біздің 5 жылдық тарихымыз – табысты жобалар мен жылдар бойы жинақталған білім қоймасы.

-

80+

+

3

- Courses + Түрлі сала

-

5.5K+

+

500+

- Students + Түлек студент

@@ -229,15 +303,15 @@

5.5K+

100%

- Success Rate + практикаға негізделген

-

98%

+

1 жыл

- Certified + оқу мерзімі

@@ -247,74 +321,209 @@

98%

-
+
-

Meet our Masters

-

- Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s. +

Жетістіктер

+

+ Академияның түлектері кәсіби салада жұмысқа орналасып, жетекші IT-компанияларда өз үлестерін қосуда. Олардың табыстары – біздің тәжірибеміздің және қолдаудың жемісі.

+
+ -
-
- -

Mr. John Mathew

-

Graphics & Technology

-
- -
- -

Mr. James Smith

-

Content Writing & Business

-
- -
- -

Ms. Ana Ghomes

-

HR & Leadership

-
- -
- -

Mr. Robert Claive

-

Marketing

+
+
+ +

Комекбаев Нұрсұлтан

+

2024 жылғы түлек

+

Оқу барысында ерекше белсенділігімен, практикалық дағдыларды тез меңгеруімен көзге түсті. Қазіргі таңда өзінің білімі мен шеберлігін табыс көзіне айналдырып, жеке тапсырыстар арқылы аптасына 65 000 теңге көлемінде табыс табуда

+
+ +
+ +

Абдуқасым Мұхаммед

+

2024 жылғы түлек

+

Бүгінде Кентау қаласындағы ТЭЦ-5 мекемесінде инженер-программист ретінде қызмет атқарып келеді.Техникалық білім мен заманауи цифрлық дағдыларды меңгеру арқылы 6 айдан бері тұрақты жұмыс орнында өз саласының маманы ретінде еңбек етуде.

+
+ +
+ +

Бернара

+

2023 жылғы түлек

+

Бүгінде “Алматы мемлекеттік политехникалық колледжінде” IT саласы бойынша мұғалім болып қызмет атқарып келеді. Оқу орнын аяқтағаннан кейін бірден маман ретінде еңбек жолын бастап, бастапқы айлық табысы — 300 000 теңгені құрады.

+
+ +
+ +

Темірбай Роза

+

2024 жылғы түлек

+

Бүгінде өзі түлегі болған академияда – Amjilt Cyber Academy оқу орталығында куратор қызметін атқарып келеді. Өзі білім алған орталықта еңбек етуі – біздің жүйелі білім беруіміздің, практикалық тәсіліміздің және командалық рухтың нақты дәлелі.

+
+ +
+ +

Нурмукан Самғар

+

2024 жылғы түлек

+

Amjilt Cyber Academy-де 1 жылдық оқу барысында Самғар толықтай Fullstack бағытынан өтіп, ағылшын тілін жетілдіріп, жеке портфолио құрып, шетелге өтініш беруге толық дайындалды. Бүгінде Самғар Жапониядағы IT университетінің студенті. Бұл — жай сандар емес, нақты нәтиже!

+
+ +
+ +

Арипжан Алихан

+

2025 жылғы түлек

+

11-сыныпты бітіре сала біздің академияға қабылданып, небәрі 1 жылдың ішінде IT саласы бойынша толық дайындықтан өтті. Білім мен тәжірибені қатар меңгеріп, жеке портфолиосын дайындап, ағылшын тілін меңгеру арқылы Жапониядағы халықаралық университетке IT мамандығы бойынша оқуға түсті.

+
+ +
+ +

Есекенов Есім

+

2025 жылғы түлек

+

Колледжді аяқтағаннан кейін IT саласында нақты бағыт іздеген студент біздің академияға қабылданып, 1 жылдық бағдарламаны сәтті аяқтады. Практикаға негізделген оқыту, ағылшын тілі мен портфолио дайындығы арқылы студентіміз Жапониядағы TOWA университетке IT бағыты бойынша оқуға түсті.

+
+ +
+ +

Төреханов Алижан

+

2024 жылғы түлек

+

Amjilt-тегі ағылшын сабағы кәдімгі мектептегі сабақ сияқты емес. Мұнда нақты сөйлетуге, IELTS форматына сай ойлауға үйретеді.6 айдың ішінде мен 7.0 балл алып шықты. Ең кереметі — ұстаздардың мотивация беріп, әр оқушыны жеке бақылауы.

+
+ +
+ + +
+ + + + + -
+

- Get Certified with Your trusted Partners + Түлектеріміз қайда жұмыс істей алады?

- Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s. + Біздің түлектеріміз әлемдік және отандық IT-компанияларда, стартаптарда және цифрлық агенттіктерде жұмыс істей алады. Олар оқу барысында игерген практикалық дағдылар арқылы кез келген командаға тез кірісе алады.

- +
- +
- +
- +
- + +
+
+ +
+
+
@@ -324,44 +533,217 @@

-
+
-

Let's Hear from Student's

-

- Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s. +

Пікірлер

+

+ Lorem Ipsum is simply dummy text of the printing and typesetting industry.

+
+

- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. + Универ мен курс маған ешқандай қиындық тудырмайды. Барлығын 0-ден бастап оқыдым. Алған білімім арқасында + университетте проект жасап, алхыс хатқа ие болдым. Универден қарағанда академия ұстаздары мен кураторлары ашық-жарқын және қатаң қадағалайды. Ұстазым мен кураторыма рахмет.

- -

John Doe

+ +
+

Нұрбақыт

+

18 жас, АТУ студенті

+

- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. + Орталыққа қызымды оқытуға әкелгенмін, қызым қолы босамаған соң өзім оқуды жөн көрдім. Ағылшын деңгейім көтерілді. Бірнеше проектер жасадым. Мұғалімдер жас болғанымен білімдері өте жоғары. IT үйренемін деушілерге НИКОГДА НЕ ПОЗДНО! Рахмет!

- -

Teresa Mathew

+ +
+

Маметова Эльнура

+

37 жас

+

- Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo. + Мен КАЗНПУ бітіріп, осы академияға келдім. Барлығын 0-ден бастадым. + Бірнеше тіл арқылы проект жасадым. Ұстаздар өте білікті мамандар. Ешқашан қолыңды қайтармайды. Жасқа қарамаңыздар, Amjilt cyber academy-сына келсеңіздер еш өкінбейсіздер.

- -

Liyendra Tom

+ +
+

Сымбат Алтынбекқызы

+

23 жас, КАЗНПУ түлегі

+
+
+
+
+

+ Ернар Мыңжасар немерем оқиды. Балам тұйық болатын, академияда оқып, тұйық мінезі ашылды, үлгерімі жақсарды IT-ға қызығушылығы ашылды. Ұстаздарына рахмет, Amjilt cyber academy-сына берсеңіздер болады. +

+
+ +
+

user_name

+
+
+

+ Ағама айтып 4 баламызды қатар беріп оқыттық, өкінбейміз. Дизайн және IT-ды меңгеріп шықты. Академия ұстаздарына алғыс. Қазақ халқына қызмет ететін білімді ұрпақ тәрбиелей беріңіздер, рахмет! +

+
+ +
+

user_name

+
+
+
+
+

+ Есімім Мақсутов Маулен. Талдықорған қаласынан келгенбіз. Ұлым 11-сынып бітіріп, бірден осында келдік. Amjilt cyber academy арқасында Жапонияға ұлым оқуға шақырту алды. Сіздерге көп рахмет, жұмыстарыңыз өне берсін. +

+
+ +
+

Мақсутов Маулен

+
+
+
+
+
+ + @@ -369,14 +751,14 @@

Liyendra Tom

diff --git a/style.css b/style.css index 9f7df94..03cff2e 100644 --- a/style.css +++ b/style.css @@ -1,11 +1,24 @@ /*------------ Google font -----------*/ @import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,700;1,800;1,900&display=swap'); +@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap'); + +@font-face { + font-family: 'Gilroy Light'; + src: url('./fonts/Gilroy-Light.otf'); +} + +@font-face { + font-family: 'Gilroy Bold'; + src: url('./fonts/Gilroy-ExtraBold.otf'); +} :root { /*--------- Color variable ---------*/ --blue-color: #33467b; ---light--blue-color: #69788F; + --header-color:#ffffffea; + --desc-color: #ffffffba; /*---------- Font size ------------*/ ---heading--font-size: 1.5rem; @@ -22,11 +35,12 @@ html { font-size: 16px; + scroll-behavior: smooth; } body { - font-family: 'Poppins', sans-serif; + font-family: "Montserrat", sans-serif; } img @@ -35,11 +49,20 @@ img height: 0 auto; } +.facility-img{ + width: 80%; + height:auto; +} + .heading { color: var(--blue-color); font-size: var(---heading--font-size); - font-weight: 600; + font-weight: 400; +} + +.heading-accomplishment{ + color: var(--header-color); } .para-line @@ -48,6 +71,10 @@ img font-size: var(---paragraph--font-size); } +.para-accomplishment{ + color: var(--desc-color); +} + .white { color: #ffffff; @@ -97,17 +124,17 @@ img { height: 100vh; width: 100%; - background-image: url(img/course-bg.jpg); + background-image: url(img/bg-image.jpg); background-size: cover; background-position: center center; background-repeat: no-repeat; } -.hero .container +.container { - height: 100vh; width: 100%; - padding: 1.5rem; + padding-left: 1.5rem; + padding-right: 1.5rem; display: flex; flex-direction: column; justify-content: center; @@ -116,6 +143,20 @@ img } +nav{ + display: flex; + justify-content: center; + align-items: center; + height: 18vh; + list-style: none; + gap: 50px; +} + +li a{ + text-decoration: none; + color: white; +} + .hero .container .para-line { margin: 1rem 0 1rem 0; @@ -156,16 +197,39 @@ img margin: 2rem 0; } -.category-card -{ - background-color: #ffffff; - margin: 2rem 0; - padding: 1rem 2rem; - border: none; - border-radius: 10px; - box-shadow: rgba(17, 17, 26, 0.05) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px; +.category-card { + /* background-color: #ffffff; */ + margin: 2rem 0; + padding: 1rem 2rem; + border: none; + border-radius: 10px; +} + +/* Альтернативалық box-shadow нұсқасы */ +.category-col:first-child .category-card{ + background-color:rgba(82,113,255,0.35); + box-shadow: + /* жеңіл акт лайнер көлеңке */ + 0px 1px 4px rgba(82,113,255,0.35), + /* кең дақылы терең көлеңке */ + 0px 6px 20px rgba(82,113,255,0.10); +} + +.category-col:nth-child(2) .category-card{ + background-color:rgba(56,182,255,0.35); + box-shadow: + 0px 1px 4px rgba(56,182,255,0.35), + 0px 6px 20px rgba(56,182,255,0.10); } +.category-col:last-child .category-card{ + background-color:rgba(235,121,153,0.35); + box-shadow: + 0px 1px 4px rgba(235,121,153,0.35), + 0px 6px 20px rgba(235,121,153,0.10); +} + + .category-icon { color: var(--blue-color); @@ -221,7 +285,6 @@ img /*--------------- Success section start --------------*/ .success { - margin: 4rem 0; background-color: #faf8ff; } @@ -257,37 +320,163 @@ img /*--------------- Master section start -------------*/ -.master -{ - margin: 4rem 0; +/* Негізгі стильдер */ +.master { + /* max-width: 1200px; */ + padding: 0 1.8rem; + position: relative; + background-image: url('./img/bg-handbook.jpg'); } - -.master .container -{ - padding: 0 1.8rem; - text-align: center; + +.master .container { + text-align: center; + position: relative; + overflow: hidden; } -.masters-row -{ - margin: 2rem 0; +.slider-container { + position: relative; + width: 100%; + margin: 2rem 0; } -.master-card -{ - margin: 1.5rem 0; - padding: 2rem; - box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px; +.masters-row { + display: flex; + transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1); + gap: 20px; + padding: 10px 1px; /* Көлеңкелерді қимау үшін */ + overflow-x: auto; + scroll-behavior: smooth; + cursor: grab; } -.master-name -{ - font-weight: 700; +.masters-row.dragging { + cursor: grabbing; + user-select: none; + scroll-behavior: auto; } -.master-name, .master-post -{ - color: var(--blue-color); +.masters-row { + scrollbar-width: none; /* Firefox */ + -ms-overflow-style: none; /* IE және Edge */ + + /* Chrome, Safari */ +} +.masters-row::-webkit-scrollbar { + display: none; +} + +.master-card { + flex: 0 0 calc(33% - 12px); + background: white; + padding: 1.5rem; + border-radius: 20px; + box-shadow: rgba(149, 157, 165, 0.15) 0px 8px 24px; + transition: all 0.4s ease; +} + +.master-card img { + width: 100%; + height: 200px; + object-fit: cover; + border-radius: 15px; + margin-bottom: 1rem; +} + +.master-name { + font-weight: 700; + font-size: 1.2rem; + margin-bottom: 0.5rem; + color: var(--blue-color); +} + +.master-post { + color: var(--blue-color); + font-weight: 500; + margin-bottom: 1rem; + font-size: 0.9rem; +} + +.desc-txt { + font-size: 14px; + line-height: 1.6; + color: #555; +} + +/* Батырмаларды сыртқа әдемі шығару */ +.slider-btn { + position: absolute; + top: 50%; + transform: translateY(-50%); + width: 50px; + height: 50px; + background: white; + color: var(--blue-color); + border: none; + border-radius: 50%; + font-size: 20px; + cursor: pointer; + display: flex; + align-items: center; + justify-content: center; + box-shadow: 0 5px 25px rgba(0, 0, 0, 0.15); + transition: all 0.3s ease; + z-index: 20; + border: 1px solid rgba(74, 107, 255, 0.1); +} + +.slider-btn:hover { + background: var(--blue-color); + color: white; + transform: translateY(-50%) scale(1.1); +} + +.slider-btn.prev { + left: -25px; +} + +.slider-btn.next { + right: -25px; +} + +/* Адаптивтік стильдер */ +@media (max-width: 1200px) { + .master-card { + flex: 0 0 calc(33.333% - 15px); + } +} + +@media (max-width: 992px) { + .master { + padding: 0 1.5rem; + } + + .master-card { + flex: 0 0 calc(50% - 15px); + } + + .slider-btn { + width: 45px; + height: 45px; + } + + .slider-btn.prev { + left: -15px; + } + + .slider-btn.next { + right: -15px; + } +} + +@media (max-width: 768px) { + .master-card { + flex: 0 0 calc(100% - 15px); + } + + .slider-btn { + display: none; + } } /*--------------- Master section end -------------*/ @@ -295,13 +484,11 @@ img /*--------------- Partner section start ----------*/ .partner { - margin: 4rem 0; background-color: #faf8ff; } .partner .container { - padding: 3.6rem 1.8rem; text-align: center; } @@ -318,59 +505,222 @@ img box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px; border: none; border-radius: 8px; + display: flex; + justify-content: center; + align-items: center; +} + +.partner-card:nth-child(4) .partner-img, +.partner-card:nth-child(6) .partner-img, +.partner-card:nth-child(7) .partner-img{ + width: 80%; +} + +.partner-card:nth-child(1) .partner-img, +.partner-card:nth-child(2) .partner-img, +.partner-card:nth-child(3) .partner-img, +.partner-card:nth-child(5) .partner-img{ + width: 120%; } /*--------------- Partner section end ----------*/ /*-------------- testimonial section start -------*/ -.testimonial -{ - margin: 4rem 0; +/* ===== Пікірлер бөлімінің негізгі стильдері ===== */ +.testimonial { + background-color: #f8f9fa; /* Қоңырқай фон */ + padding: 4rem 0; } -.testimonial .container -{ - padding: 3.6rem 1.8rem; - text-align: center; +.testimonial .container { + max-width: 1200px; + margin: 0 auto; + padding: 0 1.8rem; + text-align: center; + position: relative; } -.testimonial-row -{ - margin: 2rem 0; +.heading-feedback { + font-size: 2.2rem; + color: var(--blue-color); + margin-bottom: 1rem; + font-weight: 700; +} + +.para-feedback { + color: #555; + max-width: 700px; + margin: 0 auto 3rem; + font-size: 1.1rem; + line-height: 1.6; } -.testimonial-card -{ - text-align: left; - margin: 1.4rem 0; - border-radius: 10px; - background-color: #ffffff; - padding: 0.5rem 2rem 1rem 1rem; - box-shadow: rgba(17, 17, 26, 0.05) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px; +/* ===== Слайдер контейнері ===== */ +.slider-feedback-container { + /* position: relative; */ + margin: 2rem 0; + overflow: hidden; + width: 100%; } -.avatar-card -{ - display: flex; - justify-content: flex-start; - align-items: center; - margin-top: 1rem; +.testimonial-row { + display: flex; + transition: transform 0.6s cubic-bezier(0.16, 1, 0.3, 1); + gap: 20px; + padding: 10px 1px; /* Көлеңкелерді қимау үшін */ } -.student-img -{ - max-width: 50px; - border: none; - border-radius: 50px; - margin-right: 0.6rem; +/* ===== Пікір карталары ===== */ +.testimonial-card { + flex: 0 0 calc(33.333% - 15px); + background: white; + padding: 1.8rem; + border-radius: 15px; + transition: all 0.3s ease; + min-width: 0; /* Контенттің сығылуы үшін */ } -.student-name -{ - color: var(--blue-color); - font-size: 1.2rem; - font-weight: 600; +.testimonial-card:hover { + transform: translateY(-5px); + box-shadow: rgba(0, 0, 0, 0.1) 0px 10px 25px; +} + +.review-line { + color: #444; + font-size: 1rem; + line-height: 1.7; + margin-bottom: 1.5rem; + font-style: italic; +} + +/* ===== Аватар бөлімі ===== */ +.avatar-card { + display: flex; + align-items: center; + margin-top: 1.5rem; +} + +.student-img { + width: 60px; + height: 60px; + border-radius: 50%; + object-fit: cover; + border: 2px solid var(--blue-color); + margin-right: 1rem; +} + +.info-student { + text-align: left; +} + +.student-name { + color: var(--blue-color); + font-size: 1.1rem; + font-weight: 600; + margin-bottom: 0.3rem; +} + +.info-student p { + color: #666; + font-size: 0.9rem; + margin: 0; +} + +/* ===== Слайдер батырмалары ===== */ +.slider-feedback-btn { + position: absolute; + top: 55%; + transform: translateY(-50%); + width: 50px; + height: 50px; + background: white; + color: var(--blue-color); + border: none; + border-radius: 50%; + font-size: 1.2rem; + cursor: pointer; + box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1); + display: flex; + align-items: center; + justify-content: center; + z-index: 10; + transition: all 0.3s ease; +} + +.slider-feedback-btn:hover { + background: var(--blue-color); + color: white; + transform: translateY(-50%) scale(1.1); +} + +.slider-feedback-btn.prev { + left: 0px; +} + +.slider-feedback-btn.next { + right: 20px; +} + +/* ===== Адаптивтік стильдер ===== */ +@media (max-width: 1200px) { + .testimonial-card { + flex: 0 0 calc(33.333% - 15px); + } +} + +@media (max-width: 992px) { + .testimonial-card { + flex: 0 0 calc(50% - 15px); + padding: 1.5rem; + } + + .slider-feedback-btn { + width: 45px; + height: 45px; + } + + .slider-feedback-btn.prev { + left: -15px; + } + + .slider-feedback-btn.next { + right: -15px; + } +} + +@media (max-width: 768px) { + .testimonial { + padding: 3rem 0; + } + + .testimonial-card { + flex: 0 0 100%; + margin-bottom: 1rem; + } + + .slider-feedback-btn { + display: none; + } + + .heading-feedback { + font-size: 1.8rem; + } + + .para-feedback { + font-size: 1rem; + } +} + +@media (max-width: 576px) { + .avatar-card { + flex-direction: column; + align-items: flex-start; + } + + .student-img { + margin-bottom: 0.5rem; + } } /*-------------- testimonial section end -------*/ @@ -378,7 +728,8 @@ img /*-------------- Footer section start -----------*/ footer { - background-color: var(--blue-color); + background-image: url('./img/bg-handbook.jpg'); + background-position: center; } footer .container @@ -414,6 +765,10 @@ footer .container padding: 6rem 5rem; } + .category-container{ + max-width: none; + } + .container .heading { line-height: 1; @@ -441,6 +796,7 @@ footer .container .hero-content { max-width: 720px; + line-height: 30px; } /*--------------- About section -----------*/ @@ -460,14 +816,19 @@ footer .container border-radius: 2rem; } + .logo-academy{ + width: 35%; + } + /*--------------- Category section -------------*/ .category .container { - padding: 5rem 2rem; + padding: 5rem; text-align: center; - background-image: url(img/category-bg-dark.png); + background-image: url(img/bg-piyatno.png); background-position: center center; + /* background-clip: border-box; */ background-size: cover; } @@ -480,12 +841,18 @@ footer .container .category-row { display: grid; - grid-template-columns: 1fr 1fr 1fr 1fr; + grid-template-columns: repeat(3, 1fr); grid-template-rows: auto; grid-gap: 2rem; padding: 1rem 0; } + .category-col{ + display: flex; + flex-direction: column; + gap: 2rem; + } + .category-card { margin: 0; @@ -541,7 +908,7 @@ footer .container .success-row { display: grid; - grid-template-columns: 1fr 1fr 1fr 1fr; + grid-template-columns: repeat(4, 1fr); grid-template-rows: auto; grid-gap: 1.6rem; } @@ -562,7 +929,7 @@ footer .container .masters-row { margin: 1rem 0; - display: flex; + gap: 20px; } @@ -583,16 +950,13 @@ footer .container .partner-row { margin: 0.5rem; - display: flex; + display: grid; + grid-template-columns: repeat(4, 0.3fr); gap: 1rem; } /*----------- Testimonial section ----------*/ - .testimonial .container - { - padding: 2rem 1rem; - } .testimonial .container .para-line { @@ -603,13 +967,15 @@ footer .container .testimonial-row { margin: 0.5rem; - display: flex; gap: 1rem; } .testimonial-card { border-radius: 22px; + display: flex; + flex-direction: column; + justify-content: space-between; }