.elementor-2 .elementor-element.elementor-element-0a4d069{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-2 .elementor-element.elementor-element-237c33b img{width:100%;max-width:100%;}.elementor-2 .elementor-element.elementor-element-6c4720c{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:50px;--padding-bottom:50px;--padding-left:0px;--padding-right:0px;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-2 .elementor-element.elementor-element-4c0bfdc{text-align:center;}.elementor-2 .elementor-element.elementor-element-4c0bfdc .elementor-heading-title{font-family:"Roboto", Sans-serif;font-size:35px;font-weight:800;text-transform:uppercase;line-height:46px;}.elementor-2 .elementor-element.elementor-element-5631826{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2 .elementor-element.elementor-element-043b653{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2 .elementor-element.elementor-element-02628b5{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:50px;--padding-bottom:50px;--padding-left:0px;--padding-right:0px;}.elementor-2 .elementor-element.elementor-element-c1ba84f{text-align:center;}.elementor-2 .elementor-element.elementor-element-c1ba84f .elementor-heading-title{font-family:"Roboto", Sans-serif;font-size:55px;font-weight:900;text-transform:uppercase;line-height:75px;}.elementor-widget-posts .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-posts .elementor-post__title, .elementor-widget-posts .elementor-post__title a{color:var( --e-global-color-secondary );font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-posts .elementor-post__meta-data{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-posts .elementor-post__excerpt p{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-posts .elementor-post__read-more{color:var( --e-global-color-accent );}.elementor-widget-posts a.elementor-post__read-more{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-posts .elementor-post__card .elementor-post__badge{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-posts .elementor-pagination{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-posts .e-load-more-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-2 .elementor-element.elementor-element-7450909{--grid-row-gap:35px;--grid-column-gap:40px;}.elementor-2 .elementor-element.elementor-element-7450909 .elementor-posts-container .elementor-post__thumbnail{padding-bottom:calc( 0.66 * 100% );}.elementor-2 .elementor-element.elementor-element-7450909:after{content:"0.66";}.elementor-2 .elementor-element.elementor-element-7450909 .elementor-post__thumbnail__link{width:100%;}.elementor-2 .elementor-element.elementor-element-7450909 .elementor-post__meta-data span + span:before{content:"///";}.elementor-2 .elementor-element.elementor-element-7450909 .elementor-post__thumbnail{border-radius:18px 18px 18px 18px;}.elementor-2 .elementor-element.elementor-element-7450909.elementor-posts--thumbnail-left .elementor-post__thumbnail__link{margin-right:20px;}.elementor-2 .elementor-element.elementor-element-7450909.elementor-posts--thumbnail-right .elementor-post__thumbnail__link{margin-left:20px;}.elementor-2 .elementor-element.elementor-element-7450909.elementor-posts--thumbnail-top .elementor-post__thumbnail__link{margin-bottom:20px;}.elementor-2 .elementor-element.elementor-element-7450909 .elementor-post__title, .elementor-2 .elementor-element.elementor-element-7450909 .elementor-post__title a{font-family:"Roboto", Sans-serif;font-size:20px;font-weight:800;line-height:30px;}.elementor-2 .elementor-element.elementor-element-7450909 .elementor-post__title{margin-bottom:12px;}.elementor-2 .elementor-element.elementor-element-7450909 .elementor-post__meta-data{font-family:"Roboto", Sans-serif;font-size:13px;font-weight:400;margin-bottom:12px;}.elementor-2 .elementor-element.elementor-element-7450909 .elementor-post__excerpt p{font-family:"Roboto", Sans-serif;font-size:13px;font-weight:400;line-height:26px;}.elementor-2 .elementor-element.elementor-element-7450909 .elementor-post__excerpt{margin-bottom:12px;}:root{--page-title-display:none;}@media(max-width:767px){.elementor-2 .elementor-element.elementor-element-7450909 .elementor-posts-container .elementor-post__thumbnail{padding-bottom:calc( 0.5 * 100% );}.elementor-2 .elementor-element.elementor-element-7450909:after{content:"0.5";}.elementor-2 .elementor-element.elementor-element-7450909 .elementor-post__thumbnail__link{width:100%;}}/* Start custom CSS for html, class: .elementor-element-3cc5795 */.aac-features-section * { box-sizing: border-box; margin: 0; padding: 0; } .aac-features-section { font-family: 'Roboto', sans-serif; padding: 40px 20px; /* Khoảng cách cho toàn section */ background-color: #f9f9f9; /* Màu nền nhẹ cho section, có thể bỏ nếu muốn trong suốt */ } .aac-features-grid { display: grid; /* Responsive: tự động điều chỉnh số cột dựa trên chiều rộng */ grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 30px; /* Khoảng cách giữa các item */ max-width: 800px; /* Giới hạn chiều rộng tối đa của grid */ margin: 0 auto; /* Căn giữa grid */ } .aac-feature-item { background-color: #ffffff; border-radius: 12px; /* Bo góc mềm mại cho item */ box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08); /* Đổ bóng nhẹ nhàng */ overflow: hidden; /* Đảm bảo ảnh không tràn ra ngoài khi bo góc */ transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out; display: flex; /* Cho phép nội dung bên trong co dãn linh hoạt */ flex-direction: column; /* Sắp xếp các phần tử con theo chiều dọc */ } .aac-feature-item:hover { transform: translateY(-8px); /* Hiệu ứng nhấc lên khi hover */ box-shadow: 0 12px 25px rgba(0, 0, 0, 0.12); /* Bóng đổ rõ hơn khi hover */ } .aac-feature-image { width: 100%; height: 200px; /* Chiều cao cố định cho ảnh, điều chỉnh nếu cần */ overflow: hidden; } .aac-feature-image img { width: 100%; height: 100%; object-fit: cover; /* Đảm bảo ảnh lấp đầy, không bị méo */ display: block; } .aac-feature-content { padding: 0; /* Bỏ padding ở đây, đưa vào từng phần tử con */ flex-grow: 1; /* Cho phép phần content này mở rộng để chiếm không gian còn lại */ display: flex; flex-direction: column; } .aac-feature-title { background: linear-gradient(135deg, #BC2131, #d13041); /* Màu chủ đạo với gradient */ color: #ffffff; padding: 18px 20px; font-size: 15px; /* Cỡ chữ tiêu đề, có thể điều chỉnh */ font-weight: bold; text-align: left; /* Canh lề trái cho tiêu đề */ } .aac-feature-description { padding: 20px; font-size: 14px; line-height: 1.6; color: #555555; flex-grow: 1; /* Cho phép mô tả mở rộng */ } /* Responsive adjustments for smaller screens */ @media (max-width: 768px) { .aac-feature-title { font-size: 17px; padding: 15px; } .aac-feature-description { font-size: 14px; padding: 15px; } .aac-feature-image { height: 180px; /* Giảm chiều cao ảnh trên màn hình nhỏ hơn */ } }
Giáo viên bản ngữ AAC Education
01. Giáo Viên Bản Ngữ & Chất Lượng Cao
100% giảng viên bản xứ, chuyên môn cao, cùng chương trình học chuẩn quốc tế giúp bạn tự tin chinh phục tiếng Anh và sẵn sàng cho các cơ hội du học.
Phương pháp đào tạo AAC Education
02. Phương Pháp Đào Tạo Hiện Đại
AAC Education áp dụng phương pháp lấy học viên làm trung tâm, chú trọng tương tác và ứng dụng thực tế, tối ưu hóa hiệu quả học tập và thời gian.
Phát triển kỹ năng AAC Education
03. Phát Triển Kỹ Năng Toàn Diện
Không chỉ giỏi ngoại ngữ, học viên còn được rèn luyện kỹ năng mềm như thuyết trình, giao tiếp, tư duy phản biện để tự tin hội nhập môi trường quốc tế.
Môi trường học tập AAC Education
04. Môi Trường Học Tập Truyền Cảm Hứng
Cơ sở vật chất hiện đại, phòng học tiện nghi và không gian thân thiện, tạo điều kiện tốt nhất cho việc học tập, sáng tạo và phát triển bản thân.
Use code with caution. Html Những điểm chính trong code: Layout Grid: Sử dụng display: grid và grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); giúp các cột tự động điều chỉnh kích thước và số lượng trên các thiết bị khác nhau. Màu sắc và Gradient: Phần tiêu đề (aac-feature-title) sử dụng linear-gradient(135deg, #BC2131, #d13041); để tạo hiệu ứng chuyển màu tinh tế cho màu đỏ chủ đạo của bạn. Mềm mại hơn: Các aac-feature-item có border-radius: 12px; và box-shadow nhẹ. Hình ảnh được chứa trong aac-feature-image đảm bảo object-fit: cover; để không bị méo và lấp đầy khung. Animation: Khi bạn di chuột (hover) lên mỗi aac-feature-item, nó sẽ hơi nhô lên (transform: translateY(-8px);) và bóng đổ sẽ rõ hơn một chút (box-shadow: 0 12px 25px rgba(0, 0, 0, 0.12);), tạo cảm giác tương tác. Nội dung: Tiêu đề và mô tả đã được điều chỉnh để phản ánh các điểm mạnh của AAC Education dựa trên thông tin bạn cung cấp. Các thuộc tính alt cho hình ảnh cũng đã được thêm vào vì mục đích SEO và khả năng truy cập. Responsive: Code đã bao gồm các media query cơ bản để điều chỉnh font chữ, padding và chiều cao ảnh trên các màn hình nhỏ hơn, đảm bảo hiển thị tốt trên nhiều thiết bị. Cấu trúc Flexbox bên trong item: Mỗi aac-feature-item và aac-feature-content sử dụng display: flex; flex-direction: column; để đảm bảo các phần tử con (ảnh, tiêu đề, mô tả) sắp xếp đúng vị trí và phần mô tả có thể co dãn để lấp đầy không gian còn lại, giúp các box có chiều cao đồng đều nếu lượng text khác nhau (phần mô tả có flex-grow: 1;). Lưu ý khi sử dụng trong Elementor Pro: Đường dẫn hình ảnh: Tôi đã sử dụng các URL bạn cung cấp. Hãy đảm bảo chúng chính xác và hoạt động. Font chữ: font-family: Arial, sans-serif; là một font cơ bản. Bạn nên thay đổi thành font chữ chính của website AAC Education để đồng bộ hơn. Tùy chỉnh thêm: Bạn hoàn toàn có thể điều chỉnh các giá trị padding, font-size, height của ảnh, màu sắc, độ mạnh của bóng đổ, v.v. để phù hợp hoàn hảo với thiết kế website của mình. Animation khi cuộn: Code này hiện tại chỉ có animation khi hover. Nếu bạn muốn animation khi người dùng cuộn trang đến phần này, Elementor Pro có các cài đặt "Motion Effects" (Hiệu ứng chuyển động) cho Section hoặc Column mà bạn có thể tận dụng mà không cần code JavaScript phức tạp. Chúc bạn thành công với block nội dung này trên website AAC Education!/* End custom CSS */ /* Start custom CSS for html, class: .elementor-element-e38f04e */.aac-risk-section * { box-sizing: border-box; margin: 0; padding: 0; } .aac-risk-section { font-family: 'Roboto', sans-serif; padding: 50px 20px; /* Khoảng cách cho toàn section */ background-color: #f9f9f9; /* Màu nền nhẹ cho section, có thể bỏ nếu muốn nền trắng/trong suốt */ overflow-x: hidden; /* Tránh thanh cuộn ngang do animation ban đầu */ } .aac-risk-grid { display: grid; grid-template-columns: 1fr 1fr; /* 2 cột bằng nhau ban đầu */ gap: 40px; /* Khoảng cách giữa 2 cột */ align-items: center; /* Canh giữa các item theo chiều dọc */ max-width: 1100px; margin: 0 auto; } /* Cột nội dung bên trái */ .aac-risk-content { opacity: 0; /* Bắt đầu ẩn để animation */ animation: contentSlideIn 0.8s 0.2s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards; } @keyframes contentSlideIn { from { opacity: 0; transform: translateX(-30px); } to { opacity: 1; transform: translateX(0); } } .aac-risk-title-wrapper { position: relative; padding-left: 25px; /* Khoảng trống cho đường gạch dọc */ margin-bottom: 35px; } .aac-risk-title-wrapper::before { content: ""; position: absolute; left: 0; top: 5px; /* Điều chỉnh vị trí gạch dọc */ bottom: 5px; width: 6px; /* Độ dày gạch */ background-color: #BC2131; /* Màu chủ đạo */ border-radius: 3px; } .aac-risk-title { font-size: 32px; /* Cỡ chữ tiêu đề */ font-weight: bold; color: #2c3e50; /* Màu chữ tiêu đề đậm hơn một chút */ line-height: 1.3; text-transform: uppercase; } .aac-risk-list { list-style: none; padding: 0; } .aac-risk-item { display: flex; /* Sắp xếp icon và text trên một hàng */ align-items: flex-start; /* Canh text và icon ở đầu */ margin-bottom: 20px; font-size: 16px; line-height: 1.7; color: #555; /* Animation cho từng item */ opacity: 0; transform: translateY(15px); animation: listItemFadeInUp 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards; } /* Animation delay cho các item */ .aac-risk-item:nth-child(1) { animation-delay: 0.5s; } .aac-risk-item:nth-child(2) { animation-delay: 0.7s; } .aac-risk-item:nth-child(3) { animation-delay: 0.9s; } @keyframes listItemFadeInUp { to { opacity: 1; transform: translateY(0); } } .aac-risk-icon { display: inline-flex; align-items: center; justify-content: center; width: 22px; height: 22px; background-color: #BC2131; /* Màu chủ đạo cho icon */ color: white; font-size: 14px; font-weight: bold; border-radius: 4px; /* Bo góc nhẹ cho icon */ margin-right: 15px; flex-shrink: 0; /* Đảm bảo icon không bị co lại */ margin-top: 2px; /* Điều chỉnh vị trí icon cho thẳng hàng với dòng text đầu tiên */ } .aac-risk-text strong { color: #333; /* Làm nổi bật phần text in đậm */ } /* Cột hình ảnh bên phải */ .aac-risk-image { text-align: center; /* Căn giữa ảnh nếu cột rộng hơn ảnh */ opacity: 0; /* Bắt đầu ẩn để animation */ animation: imageZoomIn 0.8s 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards; } @keyframes imageZoomIn { from { opacity: 0; transform: scale(0.9) translateX(20px); } to { opacity: 1; transform: scale(1) translateX(0); } } .aac-risk-image img { max-width: 100%; height: auto; border-radius: 8px; /* Bo góc nhẹ cho ảnh */ box-shadow: 0 8px 25px rgba(0, 0, 0, 0.1); } /* Responsive adjustments */ @media (max-width: 991px) { /* Tablet và nhỏ hơn */ .aac-risk-grid { grid-template-columns: 1fr; /* Chuyển thành 1 cột */ gap: 30px; } .aac-risk-title { font-size: 28px; } .aac-risk-item { font-size: 15px; } /* Có thể điều chỉnh thứ tự hiển thị trên mobile nếu muốn hình ảnh lên trước */ .aac-risk-image { order: -1; /* Đưa hình ảnh lên đầu trên mobile nếu grid-template-columns là 1fr */ margin-bottom: 30px; /* Tạo khoảng cách khi ảnh lên trên */ } } @media (max-width: 767px) { .aac-risk-section { padding: 40px 15px; } .aac-risk-title-wrapper::before { top: 3px; bottom: 3px; width: 5px; } .aac-risk-title { font-size: 24px; } }/* End custom CSS */ /* Start custom CSS for html, class: .elementor-element-8a43df2 */@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700;900&display=swap'); .aac-why-choose-us-section * { font-family: 'Roboto', sans-serif; box-sizing: border-box; margin: 0; padding: 0; font-family: 'Roboto', sans-serif; } .aac-why-choose-us-section { padding: 60px 20px; background-color: #ffffff; text-align: center; overflow-x: hidden; } .aac-why-choose-us-title-container { margin-bottom: 50px; opacity: 0; animation: sectionTitleFadeIn 0.8s 0.1s ease-out forwards; } @keyframes sectionTitleFadeIn { from { opacity: 0; transform: translateY(-20px); } to { opacity: 1; transform: translateY(0); } } .aac-why-choose-us-section-title { font-size: 32px; font-weight: 700; color: #2c3e50; margin-bottom: 12px; text-transform: uppercase; } .aac-why-choose-us-title-underline { width: 80px; height: 4px; background-color: #BC2131; margin: 0 auto; border-radius: 2px; } .aac-why-choose-us-grid { display: grid; /* THAY ĐỔI TẠI ĐÂY: Luôn hiển thị 2 cột */ grid-template-columns: repeat(2, 1fr); gap: 30px; /* THAY ĐỔI TẠI ĐÂY: Giới hạn chiều rộng tối đa của grid để nó được căn giữa đẹp hơn */ max-width: 800px; /* Điều chỉnh giá trị này nếu cần, ví dụ 700px hoặc 750px */ margin: 0 auto; /* Căn giữa toàn bộ grid */ } .aac-why-choose-us-item { background-color: #BC2131; color: #ffffff; padding: 40px 25px 35px 25px; border-radius: 12px; text-align: center; box-shadow: 0 5px 15px rgba(188, 33, 49, 0.25); transition: transform 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.35s cubic-bezier(0.25, 0.46, 0.45, 0.94); cursor: default; opacity: 0; transform: translateY(30px); animation: itemSlideUpFadeIn 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94) forwards; } .aac-why-choose-us-item:nth-child(1) { animation-delay: 0.3s; } .aac-why-choose-us-item:nth-child(2) { animation-delay: 0.5s; } .aac-why-choose-us-item:nth-child(3) { animation-delay: 0.7s; } .aac-why-choose-us-item:nth-child(4) { animation-delay: 0.9s; } @keyframes itemSlideUpFadeIn { to { opacity: 1; transform: translateY(0); } } .aac-why-choose-us-item:hover { transform: translateY(-10px) scale(1.02); box-shadow: 0 12px 28px rgba(188, 33, 49, 0.35); } .aac-why-choose-us-item-title { font-size: 20px; font-weight: 700; margin-bottom: 15px; line-height: 1.3; text-transform: uppercase; min-height: 52px; display: flex; align-items: center; justify-content: center; } .aac-why-choose-us-item-description { font-size: 15px; font-weight: 400; line-height: 1.7; color: rgba(255, 255, 255, 0.9); } /* Responsive adjustments */ @media (max-width: 991px) { /* Tablet */ /* Vẫn giữ 2 cột cho tablet nếu max-width của grid cho phép */ /* Nếu muốn 1 cột trên tablet, bạn có thể thêm: */ /* .aac-why-choose-us-grid { grid-template-columns: 1fr; max-width: 450px; // Hoặc một giá trị phù hợp } */ .aac-why-choose-us-item-title { min-height: auto; } } @media (max-width: 767px) { /* Mobile */ .aac-why-choose-us-section-title { font-size: 26px; } .aac-why-choose-us-grid { /* THAY ĐỔI TẠI ĐÂY: Chuyển về 1 cột trên mobile */ grid-template-columns: 1fr; gap: 20px; /* Điều chỉnh max-width cho mobile để item không quá rộng và căn giữa */ max-width: 400px; /* Hoặc 100% tùy vào cách bạn muốn item full width hay không */ } .aac-why-choose-us-item { padding: 30px 20px 25px 20px; } .aac-why-choose-us-item-title { font-size: 18px; min-height: auto; } .aac-why-choose-us-item-description { font-size: 14px; } }/* End custom CSS */