@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');
.edit-nav-landingpage ul li a{
   font-size: 16px;
   font-weight: bold;
   line-height: 1.6;
   color: #fff !important;
}
.logo-invideos {
 position: absolute;
 top: 0;
 left: 10px;
 width: 100px;
 height: 50px;
 max-width: 100px;
 -o-object-fit: contain;
 object-fit: contain;
}
@-webkit-keyframes pulsate-bck {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  50% {
    -webkit-transform: scale(0.9);
            transform: scale(0.9);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@keyframes pulsate-bck {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  50% {
    -webkit-transform: scale(0.9);
            transform: scale(0.9);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
.pulsate-bck {
   -webkit-animation: pulsate-bck 0.5s ease-in-out infinite both;
           animation: pulsate-bck 0.5s ease-in-out infinite both;
}
.slide-phuhuynh-danhgia .item .content span.text-black {
  margin-top: 24px;
}
.time-videos {
 position: absolute;
 background: grey;
 bottom: 10px;
 right: 10px;
 border-radius: 6px;
 padding: 0px 10px;
 color: #fff;
 opacity: 50%
}
.table-giaotrinh a{
   width: 100%;
   height: 100%;
   display: block;   
}
.table-giaotrinh tr:hover th, .table-giaotrinh tr:hover td{
   background-color: var(--second);
}
.table-giaotrinh tr:hover th a, .table-giaotrinh tr:hover td a{
   color: #fff;  
}
.fs_font {
   font-size: calc(0.25rem + 3.3vw);
}
.fs_font_2 {
   font-size: calc(0.41rem + 2.3vw);
}
.fs_font_4 {
   font-size: calc(0.55rem + 2.3vw);
}
.fs_font_5 {
   font-size: calc(0.35rem + 1.3vw);
}
.fs_font_6 {
   font-size: calc(0.70rem + 0.1vw);
}
.img-1-home {
   height: calc(5.25rem + 4.3vw);
   border-color: #e39b31 !important;
}
.img-2-home {
   height: calc(5.5rem + 4.3vw);
   border-color: #e39b31 !important;
}
.img-3-home {
   height: calc(5.35rem + 4.3vw);
   border-color: #e39b31 !important;
}
.size_register {
   width: calc(0.85rem + 1.5vw);
}
.size_register_color {
   font-size: calc(0.85rem + 1.2vw);
}
.grid_lay_out_home {
   grid-template-columns: 1fr 1fr;
}
.fs_6_font {
   font-size: calc(0.25rem + 1.2vw);
}
.height_120 {
   height: calc(8rem + 0.5vh);
}
.height_203 {
   height: calc(15rem + 0.5vh);
}
.height_320 {
   height: calc(20rem + 0.5vh);
}
.height_360 {
   height: calc(25rem + 0.5vh);
}
.height_65 {
   height: calc(8rem + 0.2vh);
   width: calc(8rem + 0.5vw) !important;
}
.bottom_50 {
   bottom: calc(2rem + 0.5vh);
}
.mr-5 {
   margin-right: 5px !important;
}
.text_1_dong {
   display: -webkit-box !important;
   -webkit-line-clamp: 1;
   -webkit-box-orient: vertical;
   overflow: hidden;
}
.text_2_dong {
   display: -webkit-box !important;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
   overflow: hidden;
}
.text_3_dong {
   display: -webkit-box !important;
   -webkit-line-clamp: 3;
   -webkit-box-orient: vertical;
   overflow: hidden;
}
.text_4_dong {
   display: -webkit-box !important;
   -webkit-line-clamp: 4;
   -webkit-box-orient: vertical;
   overflow: hidden;
}
.border-red {
   border-color: #bf0006 !important;
}
.opacity-95 {
   opacity: 95% !important;
}
.btn-orange {
   background-color: #e39b31;
}
.btn-orange:hover {
   background-color: #bf0006 !important;
}
.navbar-nav li:hover > ul.dropdown-menu {
   display: block;
   position: absolute !important;
   top: 100% !important;
   padding: 8px 16px 8px 16px;
   border-radius: 8px 0px 0px 0px;
   width: -moz-max-content;
   width: max-content;
}
.navbar-nav > li:hover > .nav-link {
   color: #e39b31 !important;
}
.navbar-nav > ul.dropdown-menu > li:hover > .nav-link {
   color: #fff !important;
}
ul.dropdown-menu > li:hover > .nav-link {
   color: #fff !important;
}
ul.dropdown-menu > li:hover > svg {
   filter: brightness(0) invert(1);
}
.navbar-nav .nav-link.active {
   color: #e39b31;
}
.background_image {
   background-repeat: no-repeat;
   background-size: cover;
   height: 565px;
}
.font-family-roboto-3 {
   font-family: 'Roboto';
   font-weight: 400;
}
.border-orange {
   border-color: #e39b31 !important;
   cursor: pointer;
   color: #e39b31 !important;
   overflow: hidden;
}
.bg-light {
   background-color: #f5f5f5;
}
.text-red-home {
   color: #800004;
}
.nav_dau_trang {
   width: calc(12rem + 5vw);
   left: calc(-0.1vw);
   height: calc(3rem);
   margin-top: calc(-1.7rem) !important;
   margin-left: calc(0.1rem) !important;
   border-radius: 24px 24px 24px 0px;
}
.background_orange {
   background-color: #f2d1a1;
}
.background_pink {
   background-color: #f3cdce;
}
.khoa_hoc_online {
   margin-left: calc(2rem);
   margin-top: calc(2rem);
}
.mt-10-percent {
   margin-top: 10% !important;
}
.text-black {
   color: #3d3d3d !important;
}
.text-orange {
   color: #e39b31 !important;
}
.nav_dau_trang2 {
   margin-top: calc(1rem);
}
.text-shadow-orange {
   text-shadow: 0 1px 3px #000, 0 4px 8px #000;
}
.text-red-variant {
   color: #800004;
}
.text_hover_a {
   text-decoration: none !important;
}
.bg-red {
   background: #cc2e33;
}
.btn:hover {
   background: #e39b31;
   color: #fff !important;
}
.width_height_img_tuyen_sinh {
   width: 100%;
   height: 100%;
   -o-object-fit: cover;
   object-fit: cover;
}
.flex_basic_content {
   flex-basis: content;
}
.button_1 {
   width: 100px;
}
.button2 {
   width: 70px;
   height: 70px;
   top: 0px;
   left: 2px;
}
.fs_hover:hover {
   color: #e39b31 !important;
}
.radius_news {
   border-radius: 0px 0px 24px 24px;
}
.background_light {
   background-color: #f5f5f5;
}
.background_drark {
   background-color: #d6d6d6 !important;
}
.bg-orange {
   width: 32px;
   height: 32px;
   padding: 20px 0px 0px 0px;
   gap: 20px;
   border-radius: 16px 0px 0px 0px;
   opacity: 0px;
   background: #e39b31;
}
.bg-orange a {
   color: #fff;
   text-decoration: none;
}
.bg-white a {
   text-decoration: none;
}
.cusor_pointer {
   cursor: pointer;
}
.height_max_content {
   height: -moz-max-content;
   height: max-content;
}
.nav_khoa_hoc.active {
   border-color: #e39b31 !important;
}
.nav_khoa_hoc.active p {
   color: #e39b31 !important;
}
.nav_khoa_hoc p {
   color: #000 !important;
}
.nav_tab_khoa_hoc {
   border-bottom: none !important;
}
.phuong_phap_giang_day ol {
   padding: 0px !important;
}
.dropdown-menu li {
   position: relative;
}
.dropdown-visible {
   position: absolute !important;
   left: 100% !important;
   top: 0% !important;
   padding: 8px 16px 8px 16px;
   border-radius: 8px 0px 0px 0px;
   background-color: #000;
   width: 186px;
}
.modal_boostrap_hoc_thu_div {
   width: 100%;
   max-width: 770px;
   padding: 24px 32px 24px 32px;
   border-radius: 32px 0px 0px 0px;
   opacity: 0px;
}
/*Code của Hoàng Lộc*/
:root {
   --pink: #da6b6f;
   --yellow: #e39b31;
   --blue: #203d6b;
   --red: #bf0006;
   --primary: #bf0006;
   --second: #e39b31;
   --black: #000;
}
.font-coiny {
   font-family: 'Coiny';
   color: var(--primary);
}
* {
   transition: all 0.25s linear !important;
}
.with-tab-chuongtrinh {
   width: -moz-max-content;
   width: max-content;
   box-shadow: 0px 4px 8px 3px #000 26;
   height: 40px;
}
.with-tab-chuongtrinh:hover {
   border: 0;
   color: var(--yellow);
}
.frame-chuongtrinh {
   background-color: #f5f5f5;
   border-radius: 32px;
   padding: 20px 0;
}
.frame-tong-process {
   display: flex !important;
   align-items: center !important;
   justify-content: space-between !important;
   gap: 24px;
}
.gap-tab {
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 20px;
}
.radius-banner {
   border-radius: 150px !important;
}
.img-khoahoctuyensinh {
   height: 200px;
   border-radius: 16px;
}
.h-thongtintuvan {
   height: 490px;
   border-radius: 50px !important;
}
.h-thongtintuvan:hover {
   border-color: var(--yellow) !important;
}
.h-thongtintuvan:hover .btn-pink-inline {
   background-color: transparent;
   color: var(--yellow);
   border-color: var(--yellow) !important;
}
.h-thongtintuvan:hover .title-hover {
   color: var(--yellow) !important;
}
.frame-img-tuvan {
   width: 267px;
   height: 267px;
}
.btn-pink-inline {
   background-color: var(--pink);
   color: #fff;
}
.box-shadow-btn {
   box-shadow: 0px 4px 8px 3px #000 26;
}
.img-post-lon {
   height: 420px;
   border-radius: 24px;
}
.img-post-nho {
   height: 120px;
   border-radius: 16px;
}
.img-videos {
   height: 200px;
}
.btn-yellow-inline {
   background-color: var(--yellow) !important;
}
.btn-yellow-inline:hover {
   background-color: var(--pink) !important;
}
.p-12px-24px {
   padding: 12px 24px !important;
}
.textarea-h-200px {
   min-height: 200px !important;
}
.frame-dangkytuvan {
   border-radius: 50px;
   padding: 32px;
}
#menusite .navbar-nav > li > a, #menusite li a {
   color: #3d3d3d;
   font-weight: 700;
}
#menusite .navbar-nav > li > a.active {
   color: var(--yellow);
   font-weight: bold;
}
#menusite .navbar-nav ul {
   border-radius: 12px;
}
#menusite .navbar-nav li ul li:hover ul {
   left: 100%;
   top: 0 !important;
}
.text-blue {
   color: var(--blue) !important;
}
.btn-blue-outline {
   border: 3px solid var(--blue);
   color: var(--blue) !important;
   border-radius: 24px;
}
.p-12px {
   padding: 12px !important;
}
.h-70px {
   height: 70px !important;
}
.copyright {
   text-align: left;
}
.btn-red-inline {
   background-color: var(--red);
   padding: 6px 24px !important;
   box-shadow: 0px 4px 8px 3px #000 26 !important;
   font-family: Coiny;
   font-size: 1rem;
}
.text-1-row {
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 1;
   overflow: hidden;
}
.text-2-row {
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 2;
   overflow: hidden;
}
.text-3-row {
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 3;
   overflow: hidden;
}
.text-4-row {
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 4;
   overflow: hidden;
}
.text-5-row {
   display: -webkit-box;
   -webkit-box-orient: vertical;
   -webkit-line-clamp: 5;
   overflow: hidden;
}
.frame-post {
   padding: 0;
   background-color: #f6f6f6;
   border-radius: 24px;
   overflow: hidden;
}
.frame-post img {
   border-radius: 0 !important;
}
.frame-post span {
   padding: 0px 10px;
}
.frame-post div {
   padding: 0px 10px;
}
.gap-24px {
   gap: 24px;
}
.w-avt-gvtb {
   width: 176px;
   height: 176px;
}
.frame-text-banner {
   width: 60%;
}
.w-content-banner-home {
   width: 80%;
   text-align: left !important;
   font-size: 60px !important;
   z-index: 99;
}
.opacity-edit-banner {
   position: relative;
}
.opacity-edit-banner:after {
   content: '';
   position: absolute;
   top: 0;
   right: 0;
   left: 0;
   bottom: 0;
   width: 100%;
   height: 100%;
   background-color: #fff;
   opacity: 50%;
}
.z-99 {
   z-index: 99 !important;
}
.frame-csvc-gt {
   display: grid;
   grid-template-columns: 1fr 2fr;
   gap: 20px;
}
.frame-img-csvc {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   gap: 20px;
}
.edit-frame-detail {
   display: flex !important;
   flex-direction: row !important;
}
.width_height_thong_tin {
   width: 100%;
   height: 468px;
   max-width: 350px;
}
.container-fluid {
   max-width: 1216px !important;
}
.fz-16 {
   font-size: 16px !important;
}
.input-group-text {
   background: #fff;
}
.grid-form-dktv {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   gap: 24px;
   padding: 0;
   margin: 0;
}
.p-0px-24px {
   padding: 0px 24px !important;
}
.p-0px-36px {
   padding: 0px 36px !important;
}
.p-8px-36px {
   padding: 8px 36px !important;
}
.p-0 {
   padding: 0 !important;
}
.text-banner-nho {
   position: absolute;
   left: 10%;
   width: 50%;
   font-size: 60px;
   line-height: 64px;
   color: #000;
   font-family: 'Mark Pro';
   top: 50%;
   transform: translateY(-50%);
}
.grid-videos {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 32px;
   width: 100%;
}
.h-fit-content-videos {
   height: -moz-fit-content;
   height: fit-content;
}
.h-img-videos img {
   height: 170px;
}
.sreach-post-edit {
   border-radius: 24px;
   min-width: 300px;
   height: 45px;
   margin-bottom: 24px;
   position: relative;
   padding-left: 45px;
   padding-right: 5px;
}
.frame-sreach-post {
   display: flex;
   align-items: center;
   justify-content: center;
}
.search-input-icon i {
   position: absolute;
   z-index: 9;
   left: 20px;
   top: 33%;
   transform: translateY(-50%);
}
.search-input-icon {
   position: relative;
}
.edit-post-item {
   border: 1px solid var(--yellow);
   padding: 0;
   border-radius: 24px;
   overflow: hidden;
   background: #f6f6f6;
}
.italic {
   font-style: italic;
}
.padding-post {
   padding: 16px;
}
.edit-post-item:hover .text-1-row {
   color: var(--yellow) !important;
}
.grid-gioithieu {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   gap: 20px;
   width: 92%;
}
.grid-hinhthuc {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   gap: 20px;
   width: 100%;
}
.w-max-content {
   width: -moz-max-content;
   width: max-content;
}
.radius-50 {
   border-radius: 50%;
}
.radius-32px {
   border-radius: 32px;
}
.hotline-header {
   font-size: 1rem;
   font-weight: 400;
   line-height: 20.8px;
   color: #fff !important;
   font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
}
.hotline-header:visited {
   color: #fff !important;
}
.font-nav {
   font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
   height: 88px;
}
.bg-text-gray {
   background-color: #f5f5f5 !important;
}
.topbar-header {
   height: 80px;
}
.icon-regis-login {
   width: 32px;
   height: 32px;
   -o-object-fit: contain;
   object-fit: contain;
}
footer a.fs-5 {
   font-size: 16px !important;
}
footer p.fs-5 {
   font-size: 26px !important;
}
.container {
   width: 100% !important;
   max-width: 1200px;
}
.banner-home img {
   width: 100%;
   height: 100%;
}
.modal-dk-tuvan h5 {
   font-size: 30px;
   font-weight: 400;
   color: #000;
}
.modal-dk-tuvan .modal-body form {
   display: flex;
   flex-direction: column;
   gap: 12px;
}
.modal-dk-tuvan .modal-body form div {
   position: relative;
}
.modal-dk-tuvan .modal-body form div input, .modal-dk-tuvan .modal-body form div select {
   height: 45px;
   border-radius: 8px;
   border: 1px solid #3d3d3d;
   padding-left: 16px;
   padding-right: 50px;
}
.modal-dk-tuvan .modal-body form div a img {
   position: absolute;
   top: 50%;
   transform: translateY(-50%);
   right: 20px;
   font-size: 24px;
   color: #8c8c8c;
}
.modal-dk-tuvan .modal-body form a.btn {
   background-color: var(--primary);
   width: -moz-max-content;
   width: max-content;
   padding: 0px 16px;
   color: #fff;
   font-family: 'coiny';
   font-size: 20px;
   font-weight: 400;
   border-radius: 24px;
   height: 40px;
   text-align: center;
   align-content: center;
}
.df {
   display: flex;
}
.aic {
   align-items: center;
}
.jcc {
   justify-content: center;
}
.bg-xanhtrang-topbottom {
   background: linear-gradient(0deg, #fff 29%, #d0f2fb 77.96%);
}
.bg-xanhtrang-bottomtop {
   background: linear-gradient(180deg, #fff 0%, #d0f2fb 100%);
}
.padding-site {
   padding: 60px 0;
}
.block-ielts-cambridge {
   display: flex;
   align-items: center;
   justify-content: center;
   flex-direction: column;
   gap: 24px;
}
.block-ielts-cambridge .grid {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 24px;
   align-items: center;
   width: 100%;
}
.block-ielts-cambridge .grid .item {
   display: flex;
   align-items: center;
   justify-content: center;
   flex-direction: column;
   position: relative;
   gap: 16px;
}
.block-ielts-cambridge .grid .item span {
   border: 7px solid #da6b6f;
   position: relative;
   flex-shrink: 0;
   border-radius: 50%;
   z-index: 2;
}
.block-ielts-cambridge .grid .item span img {
   width: 170px;
   height: 170px;
   -o-object-fit: cover;
   object-fit: cover;
   border-radius: 50%;
}
.block-ielts-cambridge .grid .item h2 {
   font-size: 24px;
   font-weight: 700;
   line-height: 36px;
   text-align: center;
   color: #000;
}
.block-ielts-cambridge .grid .item:first-child .item-first {
   position: absolute;
   width: 100px;
   height: 100px;
   background-color: #da6b6f;
   bottom: calc(50% - -2px);
   left: 50%;
   transform: translate(-9px, 50%);
   z-index: 1 !important;
   border-radius: 0;
}
.block-ielts-cambridge .grid .item:last-child .item-last {
   position: absolute;
   width: 100px;
   height: 100px;
   background-color: #da6b6f;
   bottom: calc(66% - -9px);
   right: 50%;
   transform: translate(9px, 100%);
   z-index: 1;
   border-radius: 0;
}
.block-ielts-cambridge .grid .item:hover span {
   border-color: var(--second);
}
.block-ielts-cambridge .grid .item:hover .item-first, .block-ielts-cambridge .grid .item:hover .item-last {
   background-color: var(--second);
}
.block-ielts-cambridge h1 {
   font-family: Coiny;
   font-size: 30px;
   font-weight: 400;
   line-height: 40px;
   text-align: center;
   background-color: #ffc673;
   height: 60px;
   width: 100%;
   max-width: 593px;
   align-content: center;
   border-radius: 24px;
   padding: 0px 24px;
   color: var(--primary);
}
.bg-image {
   width: 100%;
   height: auto;
   background-size: cover;
   background-repeat: no-repeat;
}
.block-khoahoc-tuyensinh {
   display: flex;
   flex-direction: column;
   gap: 42px;
}
.block-khoahoc-tuyensinh h2 {
   font-family: Coiny;
   font-size: 30px;
   font-weight: 400;
   line-height: 40px;
   text-align: left;
   color: var(--primary);
   text-transform: capitalize;
}
.block-khoahoc-tuyensinh .slide-tuyensinh .item {
   position: relative;
   margin-top: 240px;
}
.block-khoahoc-tuyensinh .slide-tuyensinh .item .frame-avt {
   position: absolute;
   top: -175px;
   left: 50%;
   transform: translateX(-50%);
   width: 250px;
   height: 250px;
   border-radius: 50%;
   background-color: #ffae38;
   z-index: 1;
}
.block-khoahoc-tuyensinh .slide-tuyensinh .item .frame-avt-2 {
   position: absolute;
   top: -155px;
   left: 50%;
   transform: translateX(-50%);
   width: 210px;
   height: 210px;
   border-radius: 50%;
   background-color: #e39b31;
   z-index: 3;
}
.block-khoahoc-tuyensinh .slide-tuyensinh .item .frame-avt-2 img {
   width: 210px;
   height: 320px;
   -o-object-fit: contain;
   object-fit: contain;
   -o-object-position: bottom;
   object-position: bottom;
   position: absolute;
   top: 24%;
   transform: translateY(-50%);
}
.block-khoahoc-tuyensinh .slide-tuyensinh .item .sticker-1 {
   width: 60px;
   height: 60px;
   -o-object-fit: contain;
   object-fit: contain;
   position: absolute;
   top: -200px;
   left: 20%;
}
.block-khoahoc-tuyensinh .slide-tuyensinh .item .sticker-2 {
   width: 60px;
   height: 60px;
   -o-object-fit: contain;
   object-fit: contain;
   position: absolute;
   top: -100px;
   right: 5%;
}
.block-khoahoc-tuyensinh .slide-tuyensinh .item .content {
   padding: 16px;
   padding-top: 72px;
   background-color: #ffc673;
   border-radius: 24px;
   display: flex;
   align-items: center;
   justify-content: center;
   flex-direction: column;
   gap: 24px;
   position: relative;
   height: 100%;
   z-index: 2;
}
.block-khoahoc-tuyensinh .slide-tuyensinh .item .content h3 {
   font-size: 24px;
   font-weight: 700;
   line-height: 36px;
   text-align: center;
   color: #000;
}
.block-khoahoc-tuyensinh .slide-tuyensinh .item .content p {
   font-size: 1rem;
   font-weight: 400;
   line-height: 20.8px;
   color: #000;
}
.block-khoahoc-tuyensinh .slide-tuyensinh .item .content p span {
   color: var(--primary);
}
.block-khoahoc-tuyensinh .slide-tuyensinh .item .content a {
   background-color: var(--primary);
   width: -moz-max-content;
   width: max-content;
   height: 32px;
   border-radius: 24px;
   padding: 8px 16px;
   font-size: 1rem;
   font-weight: 700;
   color: #fff;
   text-align: center;
   align-content: center;
   display: flex;
   align-items: center;
   justify-content: center;
}
p {
   margin: 0;
}
.edit-nav-slide .owl-nav {
   display: flex;
   top: 50%;
}
.edit-nav-slide .owl-prev, .edit-nav-slide .owl-next {
   position: absolute;
   top: -64px;
   padding: 25px;
   background-color: var(--second) !important;
   border-radius: 50%;
   width: 44px;
   height: 44px;
   display: flex;
   align-items: center;
   justify-content: center;
   border: 1px solid #ebebeb;
   opacity: 0.5;
}
.edit-nav-slide .owl-prev i, .edit-nav-slide .owl-next i {
   font-size: 1rem;
}
.pre-next-active {
   opacity: 1 !important;
}
.edit-nav-slide .owl-prev {
   right: 12px;
   transform: translate(-100%, -50%);
}
.edit-nav-slide .owl-next {
   right: 0;
   transform: translate(0%, -50%);
}
.block-thongtin-tuvan {
   display: flex;
   flex-direction: column;
   gap: 40px;
   align-items: center;
   justify-content: center;
}
.block-thongtin-tuvan h2 {
   font-family: Coiny;
   font-size: 30px;
   font-weight: 400;
   line-height: 40px;
   text-align: center;
   color: var(--primary);
}
.block-thongtin-tuvan .grid {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   gap: 32px;
   width: 100%;
}
.block-thongtin-tuvan .grid .item {
   background-size: cover;
   background-position: center;
   position: relative;
   height: 490px;
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: space-around;
   gap: 24px;
   border-radius: 24px;
   padding: 40px 0;
}
.block-thongtin-tuvan .grid .item img {
   width: 160px;
   height: 160px;
   -o-object-fit: contain;
   object-fit: contain;
}
.block-thongtin-tuvan .grid .item h3 {
   font-size: 24px;
   font-weight: 700;
   color: #000;
   text-align: center;
   width: 100%;
   height: 100px;
   line-height: 1;
   align-content: center;
   background-color: rgba(255, 255, 255, 0.5);
   padding: 0px 8px;
}
.block-thongtin-tuvan .grid .item a {
   background-color: var(--primary);
   height: 40px;
   width: -moz-max-content;
   width: max-content;
   padding: 8px 24px;
   font-size: 22px;
   color: #fff;
   font-weight: 700;
   border-radius: 24px;
   text-align: center;
   align-content: center;
   display: flex;
   align-items: center;
   justify-content: center;
}
.block-thongtin-tuvan .grid .item a:hover {
   background-color: var(--second);
   color: #000;
}
.block-lydochon {
   display: flex;
   flex-direction: column;
   gap: 40px;
}
.block-lydochon h2 {
   font-family: Coiny;
   font-size: 30px;
   font-weight: 400;
   line-height: 40px;
   text-align: center;
   color: var(--primary);
}
.block-lydochon .grid {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   gap: 32px;
}
.block-lydochon .grid .item {
   display: flex;
   flex-direction: column;
   gap: 24px;
}
.block-lydochon .grid .item span {
   display: flex;
   align-items: center;
   gap: 16px;
}
.block-lydochon .grid .item span img {
   width: 50px;
   height: 50px;
   -o-object-fit: contain;
   object-fit: contain;
}
.block-lydochon .grid .item span p {
   font-family: Roboto;
   font-size: 20px;
   font-weight: 700;
   line-height: 32px;
   text-align: left;
   color: #000;
}
.block-lydochon .grid .img-right {
   width: 100%;
   max-height: 428px;
}
.slide-hocvien-xuatsac .item {
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   gap: 12px;
}
.slide-hocvien-xuatsac .item img {
   width: 280px !important;
   height: 360px;
   border-radius: 32px;
}
.slide-hocvien-xuatsac .item h3 {
   font-size: 20px;
   font-weight: 700;
   line-height: 32px;
   text-align: center;
   color: #3d3d3d;
}
.slide-hocvien-xuatsac .item h4 {
   font-size: 20px;
   font-weight: 700;
   line-height: 32px;
   text-align: center;
   color: var(--primary);
}
.slide-phuhuynh-danhgia .item {
   border: 4px solid var(--primary);
   border-radius: 32px;
   padding: 20px;
   position: relative;
   margin-bottom: 100px;
   background-color: #fff;
   display: block;
}
.slide-phuhuynh-danhgia .item .content {
   display: flex;
   align-items: center;
   justify-content: center;
   flex-direction: column;
   gap: 8px;
   padding-bottom: 80px;
}
.slide-phuhuynh-danhgia .item .content h3 {
   font-size: 20px;
   font-weight: 700;
   line-height: 32px;
   text-align: center;
   color: var(--primary);
}
.slide-phuhuynh-danhgia .item .content span {
   font-size: 1rem;
   font-weight: 400;
   line-height: 20.8px;
   text-align: left;
   color: var(--primary);
}
.slide-phuhuynh-danhgia .item .content p {
   font-size: 1rem;
   font-style: italic;
   font-weight: 400;
   line-height: 22.4px;
   text-align: center;
   color: #3d3d3d;
}
.slide-phuhuynh-danhgia .item .avt {
   position: absolute;
   bottom: 0;
   width: 170px;
   height: 170px;
   border: 3px solid var(--primary);
   border-radius: 50%;
   left: 50%;
   transform: translate(-50%, 50%);
}
.slide-phuhuynh-danhgia .item:hover {
   border-color: var(--second);
}
.slide-phuhuynh-danhgia .item:hover .avt {
   border-color: var(--second);
}
.frame-danhgia-modal {
   border: 4px solid var(--second);
   padding: 20px;
   border-radius: 32px;
}
.frame-danhgia-modal .content {
   display: flex;
   flex-direction: column;
   gap: 8px;
   align-items: center;
   justify-content: center;
   padding-bottom: 70px;
}
.frame-danhgia-modal .content span.text-black {
  margin-top: 24px;
}
.block-kinhnghiem .frame-experiment .item:last-child .line{
   display: none;
}

.frame-danhgia-modal .content h3 {
   font-size: 24px;
   font-weight: 700;
   line-height: 32px;
   text-align: center;
   color: var(--primary);
}
.frame-danhgia-modal .content span {
   font-size: 1rem;
   font-weight: 400;
   line-height: 20.8px;
   text-align: center;
   color: var(--primary);
}
.frame-danhgia-modal .content p {
   font-size: 1rem;
   font-style: italic;
   font-weight: 400;
   line-height: 22.4px;
   text-align: center;
   color: #3d3d3d;
}
.frame-danhgia-modal .avt {
   width: 170px;
   height: 170px;
   border: 3px solid var(--second);
   border-radius: 50%;
   position: absolute;
   bottom: 0;
   left: 50%;
   transform: translate(-50%, 50%);
}
.slide-video-hocvien .item {
   display: flex;
   flex-direction: column;
   gap: 12px;
}
.slide-video-hocvien .item .frame-img {
   width: 100%;
   height: auto;
   border-radius: 16px;
   position: relative;
   flex-shrink: 0;
   overflow: hidden;
}
.slide-video-hocvien .item .frame-img .img-video {
   width: 100%;
   height: 194px;
   -o-object-fit: cover;
   object-fit: cover;
}
.slide-video-hocvien .item .frame-img span {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   width: 70px;
   height: 70px;
   background: rgba(230, 178, 102, 0.7);
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 50%;
}
.slide-video-hocvien .item .frame-img span .img-play {
   width: 40px;
   height: 40px;
   -o-object-fit: contain;
   object-fit: contain;
}
.slide-video-hocvien .item .content {
   display: flex;
   flex-direction: column;
   gap: 12px;
}
.slide-video-hocvien .item .content h3 {
   font-size: 24px;
   font-weight: 700;
   line-height: 30px;
   text-align: left;
   color: #000;
}
.slide-video-hocvien .item .content span {
   font-size: 1rem;
   font-style: italic;
   font-weight: 400;
   line-height: 22.4px;
   text-align: left;
   color: #8c8c8c;
}
.slide-video-hocvien .item .content p {
   font-size: 1rem;
   font-weight: 400;
   line-height: 20.8px;
   text-align: left;
   color: #000;
}
.slide-video-hocvien .item:hover .img-video {
   transform: scale(1.2);
}
.slide-video-hocvien .item:hover h3 {
   color: var(--second);
}
.frame-load-video {
   max-height: 500px;
   border-radius: 16px;
   background-color: #333;
   position: relative;
}
.frame-load-video a {
   position: absolute;
   bottom: -10%;
   left: 50%;
   transform: translateX(-50%);
}
.frame-load-video a i {
   font-size: 40px;
   color: var(--primary);
}
.tac {
   text-align: center !important;
}
.block-videos-hocvien .grid {
   display: grid;
   grid-template-columns: 1.5fr 2fr;
   gap: 32px;
   width: 100%;
   /* Độ dài */
   /* Khung ngoài*/
   /* Khung trong*/
   /* hover khung trong */
}
.block-videos-hocvien .grid .img-lon {
   width: 100%;
   border-radius: 24px;
   position: relative;
   overflow: hidden;
   height: -moz-fit-content;
   height: fit-content;
}
.block-videos-hocvien .grid .img-lon img {
   width: 100%;
   height: 420px;
   -o-object-fit: cover;
   object-fit: cover;
}
.block-videos-hocvien .grid .img-lon .content {
   position: absolute;
   bottom: 0;
   width: 100%;
   padding: 16px;
   background: rgba(255, 255, 255, 0.7);
   display: flex;
   flex-direction: column;
   gap: 12px;
}
.block-videos-hocvien .grid .img-lon .content h3 {
   font-size: 26px;
   font-weight: 700;
   line-height: 30px;
   text-align: left;
   color: var(--second);
}
.block-videos-hocvien .grid .img-lon .content p {
   font-size: 1rem;
   font-weight: 400;
   line-height: 20.8px;
   text-align: justified;
   color: #3d3d3d;
}
.block-videos-hocvien .grid .img-lon:hover img {
   transform: scale(1.2);
}
.block-videos-hocvien .grid .list-videos {
   width: 100%;
   max-height: 420px;
   overflow-y: auto;
   display: flex;
   flex-direction: column;
   gap: 18px;
}
.block-videos-hocvien .grid .list-videos .item {
   display: flex;
   align-items: center;
   gap: 12px;
}
.block-videos-hocvien .grid .list-videos .item span {
   width: 180px;
   height: 120px;
   overflow: hidden;
   border-radius: 16px;
   flex-shrink: 0;
}
.block-videos-hocvien .grid .list-videos .item span img {
   width: 100%;
   height: 100%;
   -o-object-fit: cover;
   object-fit: cover;
}
.block-videos-hocvien .grid .list-videos .item .content {
   display: flex;
   flex-direction: column;
   gap: 12px;
}
.block-videos-hocvien .grid .list-videos .item .content h3 {
   font-size: 20px;
   font-weight: 700;
   line-height: 32px;
   text-align: justified;
   color: #000;
}
.block-videos-hocvien .grid .list-videos .item .content p {
   font-size: 1rem;
   font-weight: 400;
   line-height: 20.8px;
   text-align: justified;
   color: #3d3d3d;
}
.block-videos-hocvien .grid .list-videos .item:hover img {
   transform: scale(1.2);
}
.block-videos-hocvien .grid .list-videos .item:hover h3 {
   color: var(--second);
}
.block-videos-hocvien .grid .list-videos::-webkit-scrollbar {
   width: 5px;
}
.block-videos-hocvien .grid .list-videos::-webkit-scrollbar-track {
   background: #f5f5f5;
   border-radius: 10px;
}
.block-videos-hocvien .grid .list-videos::-webkit-scrollbar-thumb {
   background: #8c8c8c;
}
.block-videos-hocvien .grid .list-videos::-webkit-scrollbar-thumb:hover {
   background: #f5f5f5;
}
.dk-tuvan {
   display: flex;
   flex-direction: column;
   gap: 16px;
   align-items: center;
   justify-content: center;
}
.dk-tuvan .frame-row {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   align-items: center;
   gap: 16px;
   width: 100%;
}
.dk-tuvan .frame-row span {
   position: relative;
   width: 100%;
}
.dk-tuvan .frame-row span input {
   height: 50px;
   padding-left: 16px;
   padding-right: 50px;
   border: 1px solid #3d3d3d;
   border-radius: 8px;
}
.dk-tuvan .frame-row span a {
   position: absolute;
   right: 10px;
   top: 50%;
   transform: translateY(-50%);
   width: 24px;
   height: 24px;
}
.dk-tuvan .frame-row select {
   height: 50px;
   padding-left: 16px;
   padding-right: 50px;
   border: 1px solid #3d3d3d;
   border-radius: 8px;
}
.dk-tuvan textarea {
   border-radius: 8px;
   border: 1px solid #3d3d3d;
   min-height: 200px;
   width: 100%;
   resize: vertical;
   padding: 16px;
}
.dk-tuvan .btn {
   width: -moz-max-content;
   width: max-content;
   padding: 0px 16px;
   background-color: var(--primary);
   display: flex;
   align-items: center;
   justify-content: center;
   height: 50px;
   border-radius: 24px;
   color: #fff;
   font-size: 20px;
   font-weight: 400;
   font-family: Coiny;
   text-align: center;
}
.bg-tuvan {
   background: linear-gradient(180deg, #fff 48.84%, #b6d461 100%);
   background-position: bottom;
   background-size: cover;
}
.frame-info-footer {
   display: flex;
   flex-direction: column;
   gap: 12px;
   margin-bottom: 12px;
}
.block-catalog {
   display: flex;
   flex-direction: column;
   gap: 24px;
   align-items: center;
   justify-content: center;
}
.block-catalog h1 {
   font-family: Coiny;
   font-size: 30px;
   font-weight: 400;
   line-height: 35px;
   text-align: center;
   color: var(--primary);
}
.block-catalog p {
   font-size: 1rem;
   font-weight: 400;
   line-height: 19.2px;
   text-align: center;
   color: #000;
}
.block-catalog .frame-tab-catalog {
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   gap: 24px;
   width: 100%;
}
.block-catalog .frame-tab-catalog ul {
   width: 100%;
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   gap: 0;
}
.block-catalog .frame-tab-catalog button {
   width: 100%;
   height: 70px;
   background-color: #f5f5f5;
   font-family: Coiny;
   font-size: 40px;
   font-weight: 400;
   line-height: 40px;
   text-align: center;
   align-content: center;
   display: flex;
   align-items: center;
   justify-content: center;
   color: #3d3d3d;
   border-radius: 0;
   border-top-left-radius: 24px;
   border-top-right-radius: 24px;
}
.block-catalog .frame-tab-catalog button.active {
   background-color: #d6d6d6;
   color: var(--second);
}
.block-catalog .frame-tab-catalog .frame {
   display: flex;
   align-items: center;
   justify-content: center;
   flex-direction: column;
   gap: 24px;
}
.paganation {
   display: flex;
   align-items: center;
   flex-flow: wrap;
   gap: 16px;
}
.paganation span {
   width: 32px;
   height: 32px;
   border: 2px solid #f5f5f5;
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: 1rem;
   font-weight: 400;
   line-height: 19.2px;
   text-align: center;
   color: #3d3d3d;
   background-color: #f5f5f5;
}
.paganation span i {
   color: var(--second);
}
.paganation span.active {
   background-color: var(--second);
   color: #fff;
}
.grid-khoahoc-ielts {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 32px;
   width: 100%;
}
.item-khoahoc-ielts {
   border-radius: 16px;
   box-shadow: 0px 2px 4px 0px #ececec;
   display: flex;
   flex-direction: column;
   gap: 10px;
   overflow: hidden;
   background-color: #fff;
}
.item-khoahoc-ielts img {
   width: 100%;
   height: 288px;
   -o-object-fit: cover;
   object-fit: cover;
   flex-shrink: 0;
}
.item-khoahoc-ielts .content {
   flex: 1;
   display: flex;
   flex-direction: column;
   gap: 12px;
   padding: 16px;
   align-items: center;
   justify-content:space-between;
   font-size: 1rem;
}
.slide-phuhuynh-danhgia .item .content{
 font-size: 1rem !important;
 font-family: 'Roboto';
 font-weight: 400;
 line-height: 20.8px;
 text-align: center;
}
.item-khoahoc-ielts .content h2 {
   font-size: 24px;
   font-weight: 700;
   text-align: left;
   color: var(--primary);
   font-family: unset;
   text-transform: capitalize;
}
.item-khoahoc-ielts .content p {
   font-size: 1rem;
   font-style: italic;
   font-weight: 400;
   line-height: 22.4px;
   text-align: left;
   color: #000;
}
.item-khoahoc-ielts .content .list-info {
   display: flex;
   flex-direction: column;
   gap: 12px;
}
.item-khoahoc-ielts .content .list-info span {
   position: relative;
   padding-left: 24px;
   font-size: 1rem;
   font-weight: 400;
   line-height: 20.8px;
   text-align: left;
   color: #000;
}
.item-khoahoc-ielts .content .list-info span:after {
   content: '';
   position: absolute;
   left: 0;
   top: 50%;
   transform: translateY(-50%);
   width: 16px;
   height: 16px;
   background-color: #da6b6f;
   border-radius: 50%;
}
.item-khoahoc-ielts .content .btn {
   font-size: 1rem;
   font-weight: 700;
   color: #fff;
   background-color: var(--primary);
   border-radius: 24px;
   width: -moz-max-content;
   width: max-content;
   padding: 0px 16px;
   height: 40px;
   display: flex;
   align-items: center;
   justify-content: center;
   flex-shrink: 0;
}
.item-khoahoc-ielts:hover h2 {
   color: var(--second);
}
.item-khoahoc-ielts:hover .list-info span:after {
   background-color: #f2d1a1;
}
.item-khoahoc-ielts:hover .btn {
   background-color: var(--second);
}
.block-gioithieu {
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   gap: 24px;
}
.block-gioithieu h1 {
   font-family: Coiny;
   font-size: 30px;
   font-weight: 400;
   line-height: 40px;
   text-align: center;
   color: var(--primary);
   text-transform: capitalize;
}
.block-gioithieu p {
   font-size: 1rem;
   font-weight: 400;
   line-height: 20.8px;
   text-align: center;
   color: #0c0c0b;
}
.block-gioithieu .grid {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   gap: 32px;
   width: 100%;
}
.block-gioithieu .grid .item-hinhthuc {
   border-radius: 16px;
   padding: 20px;
   min-height: 165px;
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 12px;
   background-color: #fff;
   border: 4px solid var(--primary);
}
.block-gioithieu .grid .item-hinhthuc img {
   width: 100px;
   height: 100px;
   -o-object-fit: contain;
   object-fit: contain;
}
.block-gioithieu .grid .item-hinhthuc h2 {
   font-size: 24px;
   font-weight: 700;
   line-height: 36px;
   color: #3d3d3d;
}
.block-gioithieu .grid .item-hinhthuc span {
   font-size: 20px;
   font-weight: 700;
   line-height: 32px;
   color: var(--primary);
}
.block-gioithieu .grid .item-hocphi {
   display: flex;
   flex-direction: column;
   gap: 24px;
   min-height: 165px;
   background-color: #f2d1a1;
   border-radius: 16px;
   padding: 20px;
}
.block-gioithieu .grid .item-hocphi h2 {
   font-size: 24px;
   font-weight: 700;
   line-height: 36px;
   text-align: left;
   color: #000;
}
.block-gioithieu .grid .item-hocphi h2 span {
   margin-left: 16px;
   font-size: 20px;
   font-weight: 700;
   line-height: 32px;
   color: var(--primary);
}
.block-gioithieu .grid .item-hocphi p {
   font-size: 1rem;
   font-weight: 400;
   line-height: 20.8px;
   text-align: left;
   color: #000;
}
.block-muctieu-khoahoc {
   display: flex;
   flex-direction: column;
   align-items: center;
   justify-content: center;
   gap: 24px;
}
.block-muctieu-khoahoc h2 {
   font-family: Coiny;
   font-size: 30px;
   font-weight: 400;
   line-height: 40px;
   text-align: center;
   color: var(--primary);
   text-transform: capitalize;
}
.block-muctieu-khoahoc .grid {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   gap: 32px;
   width: 100%;
   align-items: center;
}
.block-muctieu-khoahoc .grid .item {
   display: flex;
   flex-direction: column;
   gap: 24px;
}
.block-muctieu-khoahoc .grid .item span {
   display: flex;
   align-items: flex-start;
   gap: 12px;
}
.block-muctieu-khoahoc .grid .item span img {
   width: 50px;
   height: 50px;
   -o-object-fit: contain;
   object-fit: contain;
   flex-shrink: 0;
}
.block-muctieu-khoahoc .grid .item span .content {
   flex: 1;
   display: flex;
   flex-direction: column;
   gap: 6px;
}
.block-muctieu-khoahoc .grid .item span .content h3 {
   font-size: 18px;
   font-weight: 700;
   line-height: 32px;
   text-align: left;
   color: #000;
}
.block-muctieu-khoahoc .grid .item span .content p {
   font-size: 1rem;
   font-weight: 400;
   line-height: 20.8px;
   text-align: left;
}
.block-muctieu-khoahoc .grid .item-img {
   width: 100%;
   max-height: 428px;
   height: 100%;
   border-radius: 16px;
   -o-object-fit: contain;
   object-fit: contain;
}
.width-frame-noidungkh {
   width: 80%;
}
.block-noidung-khoahoc {
   display: flex;
   flex-direction: column;
   gap: 24px;
}
.block-noidung-khoahoc h2 {
   font-family: Coiny;
   font-size: 30px;
   font-weight: 400;
   line-height: 40px;
   text-align: left;
   color: var(--primary);
   text-transform: capitalize;
}
.block-noidung-khoahoc ul {
   width: 100%;
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   gap: 24px;
}
.block-noidung-khoahoc ul li button {
   width: 100%;
   background-color: #d6d6d6;
   height: 60px;
   border-radius: 30px !important;
   display: flex;
   align-items: center;
   justify-content: center;
   font-family: Coiny;
   font-size: 24px;
   font-weight: 400;
   line-height: 28px;
   text-align: center;
   color: #3d3d3d;
   border: 4px solid #d6d6d6;
}
.block-noidung-khoahoc ul li button.active {
   background-color: transparent !important;
   border-color: var(--second);
   color: var(--second) !important;
}
.block-noidung-khoahoc .frame-content-khoahoc {
   background-color: #fff;
   border-radius: 32px;
   padding: 20px;
   display: flex;
   flex-direction: column;
   gap: 12px;
   position: relative;
}
.block-noidung-khoahoc .frame-content-khoahoc p {
   font-size: 1rem;
   font-weight: 400;
   line-height: 24px;
   text-align: left;
   color: #000;
   width: 80%;
}
.block-noidung-khoahoc .frame-content-khoahoc a {
   font-size: 20px;
   font-family: Coiny;
   font-weight: 400;
   line-height: 28px;
   text-align: center;
   height: 40px;
   display: flex;
   align-items: center;
   justify-content: center;
   background-color: var(--primary);
   border-radius: 30px;
   width: -moz-max-content;
   width: max-content;
   padding: 0px 16px;
}
.block-noidung-khoahoc .frame-content-khoahoc img {
   position: absolute;
   bottom: 0;
   right: 0;
   width: 250px;
   height: 100%;
   -o-object-fit: contain;
   object-fit: contain;
}
.blog-phuongphap-giangday .grid .item-img {
   max-height: 331px;
   height: 100%;
   border-radius: 16px;
}
.block-grid-thongtin .grid {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   gap: 32px;
}
.block-grid-thongtin .grid .item {
   display: flex;
   flex-direction: column;
   gap: 16px;
   border: 3px solid #e39b31;
   border-radius: 32px;
   padding: 20px;
   background-color: #fff;
}
.block-grid-thongtin .grid .item span {
   display: flex;
   align-items: center;
   gap: 12px;
}
.block-grid-thongtin .grid .item span img {
   width: 40px;
   height: 40px;
   -o-object-fit: contain;
   object-fit: contain;
   flex-shrink: 0;
}
.block-grid-thongtin .grid .item span h3 {
   font-size: 20px;
   font-weight: 700;
   line-height: 24px;
   text-align: left;
   color: #000;
}
.flex-column-block {
   display: flex;
   flex-direction: column;
   gap: 100px;
}
.bg-po-bottom {
   background-position: bottom;
}
.thongbao-form {
   text-align: center;
   font-size: 1rem;
   font-weight: 400;
   line-height: 20.8px;
   text-align: center;
   color: #3d3d3d;
}
.block-videos-catalog {
   display: flex;
   flex-direction: column;
   gap: 32px;
   align-items: center;
   justify-content: center;
}
.block-videos-catalog h1 {
   font-family: Coiny;
   font-size: 30px;
   font-weight: 400;
   line-height: 40px;
   text-align: center;
   color: var(--primary);
}
.block-videos-catalog .grid {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 32px;
}
.block-videos-catalog .grid .item {
   display: flex;
   flex-direction: column;
   gap: 12px;
}
.block-videos-catalog .grid .item .frame-img {
   width: 100%;
   height: auto;
   border-radius: 16px;
   position: relative;
   flex-shrink: 0;
   overflow: hidden;
}
.block-videos-catalog .grid .item .frame-img .img-video {
   width: 100%;
   height: 194px;
   -o-object-fit: cover;
   object-fit: cover;
}
.block-videos-catalog .grid .item .frame-img span {
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   width: 70px;
   height: 70px;
   background: rgba(230, 178, 102, 0.7);
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 50%;
}
.block-videos-catalog .grid .item .frame-img span .img-play {
   width: 40px;
   height: 40px;
   -o-object-fit: contain;
   object-fit: contain;
}
.block-videos-catalog .grid .item .content {
   display: flex;
   flex-direction: column;
   gap: 12px;
}
.block-videos-catalog .grid .item .content h3 {
   font-size: 24px;
   font-weight: 700;
   line-height: 30px;
   text-align: left;
   color: #000;
}
.block-videos-catalog .grid .item .content span {
   font-size: 1rem;
   font-style: italic;
   font-weight: 400;
   line-height: 22.4px;
   text-align: left;
   color: #8c8c8c;
}
.block-videos-catalog .grid .item .content p {
   font-size: 1rem;
   font-weight: 400;
   line-height: 20.8px;
   text-align: left;
   color: #000;
}
.block-videos-catalog .grid .item:hover .img-video {
   transform: scale(1.2);
}
.block-videos-catalog .grid .item:hover h3 {
   color: var(--second);
}
.block-blogs-catalog {
   display: flex;
   flex-direction: column;
   gap: 32px;
   align-items: center;
   justify-content: center;
}
.block-blogs-catalog h1 {
   font-family: Coiny;
   font-size: 30px;
   font-weight: 400;
   line-height: 40px;
   text-align: center;
   color: var(--primary);
}
.block-blogs-catalog p {
   font-size: 1rem;
   font-weight: 400;
   line-height: 20.8px;
   text-align: center;
   color: #3d3d3d;
}
.block-blogs-catalog .frame-search {
   position: relative;
   max-width: 384px;
   width: 100%;
}
.block-blogs-catalog .frame-search input {
   width: 100%;
   height: 50px;
   border-radius: 30px;
   padding-left: 40px;
   padding-right: 12px;
}
.block-blogs-catalog .frame-search a {
   position: absolute;
   left: 16px;
   top: 50%;
   transform: translateY(-50%);
}
.block-blogs-catalog .grid {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 32px;
}
.block-blogs-catalog .grid .item {
   border: 1px solid var(--second);
   border-radius: 24px;
   display: flex;
   flex-direction: column;
   overflow: hidden;
   gap: 0;
}
.block-blogs-catalog .grid .item img {
   width: 100%;
   height: 297px;
   -o-object-fit: cover;
   object-fit: cover;
   flex-shrink: 0;
}
.block-blogs-catalog .grid .item .content {
   background-color: #f5f5f5;
   padding: 20px;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   flex: 1;
   justify-content: space-between;
   gap: 12px;
}
.block-blogs-catalog .grid .item .content h2 {
   font-size: 20px;
   font-weight: 700;
   line-height: 32px;
   color: #000;
}
.block-blogs-catalog .grid .item .content p {
   font-size: 1rem;
   font-weight: 400;
   line-height: 20.8px;
   color: #3d3d3d;
}
.block-blogs-catalog .grid .item .content p span {
   font-style: italic;
}
.block-blogs-catalog .grid .item .content span {
   font-size: 1rem;
   font-style: italic;
   font-weight: 400;
   line-height: 22.4px;
   color: #3d3d3d;
}
.block-blogs-catalog .grid .item:hover h2 {
   color: var(--second);
}
.flex-column-12px {
   display: flex;
   flex-direction: column;
   gap: 12px;
}
.block-detail-new {
   display: flex;
   flex-direction: column;
   gap: 32px;
   align-items: center;
   justify-content: center;
}
.block-detail-new h1 {
   font-family: Coiny;
   font-size: 30px;
   font-weight: 400;
   line-height: 40px;
   text-align: center;
   color: var(--primary);
   width: 80%;
}
.block-detail-new .content img {
    max-width: 100%;
    height: auto;
    margin-top: 16px;
}
b, strong {
    font-weight: bold;
}
.block-detail-new .frame-share-post {
   display: flex;
   align-items: center;
   justify-content: flex-end;
   gap: 12px;
   width: 100%;
}
.block-detail-new .frame-share-post p {
   font-size: 1rem;
   font-weight: 400;
   line-height: 20.8px;
   color: #3d3d3d;
}
.block-detail-new .frame-share-post img {
   width: 32px;
   height: 32px;
   -o-object-fit: contain;
   object-fit: contain;
}
.block-detail-new .frame-share-post img:hover {
   transform: translateY(-5px);
}
.block-binhluan {
   display: flex;
   flex-direction: column;
   gap: 32px;
}
.block-binhluan h3 {
   font-family: Coiny;
   font-size: 30px;
   font-weight: 400;
   line-height: 40px;
   color: var(--primary);
}
.block-binhluan .frame-binhluan {
   border-radius: 32px;
   overflow: hidden;
   background-color: #f5f5f5;
}
.block-binhluan .frame-binhluan .list-comment {
   padding: 20px;
   max-height: 500px;
   overflow-y: auto;
   display: flex;
   flex-direction: column;
   gap: 24px;
}
.block-binhluan .frame-binhluan .list-comment .item {
   display: flex;
   align-items: flex-start;
   gap: 24px;
}
.block-binhluan .frame-binhluan .list-comment .item img {
   width: 50px;
   height: 50px;
   border-radius: 50%;
   -o-object-fit: cover;
   object-fit: cover;
   flex-shrink: 0;
}
.block-binhluan .frame-binhluan .list-comment .item .content {
   background-color: #fff;
   border-radius: 16px;
   padding: 10px;
   display: flex;
   flex-direction: column;
   gap: 12px;
   width: 100%;
   flex: 1;
}
.block-binhluan .frame-binhluan .list-comment .item .content h4 {
   font-size: 20px;
   font-weight: 700;
   line-height: 32px;
   text-align: left;
   color: #3d3d3d;
}
.block-binhluan .frame-binhluan .list-comment .item .content p {
   font-size: 1rem;
   font-weight: 400;
   line-height: 20.8px;
   text-align: left;
   color: #3d3d3d;
}
.block-binhluan .frame-binhluan .list-comment .item .content .frame-info-comment {
   display: flex;
   align-items: center;
   gap: 36px;
}
.block-binhluan .frame-binhluan .list-comment .item .content .frame-info-comment span {
   font-size: 1rem;
   font-style: italic;
   font-weight: 400;
   line-height: 22.4px;
   text-align: left;
   color: #8c8c8c;
}
.block-binhluan .frame-binhluan .list-comment .item .content .frame-info-comment .like {
   display: flex;
   align-items: center;
   gap: 6px;
   font-size: 1rem;
   font-weight: 400;
   line-height: 22.4px;
   text-align: left;
   color: #8c8c8c;
}
.block-binhluan .frame-binhluan .list-comment .item .content .frame-info-comment .like img {
   width: 24px;
   height: 24px;
   -o-object-fit: contain;
   object-fit: contain;
   border-radius: 0;
}
.block-binhluan .frame-binhluan .list-comment .item .content a {
   font-size: 1rem;
   font-weight: 700;
   line-height: 16px;
   text-align: left;
   color: #3d3d3d;
}
.block-binhluan .frame-binhluan .list-comment .coment-large {
   margin-left: 5%;
}
.block-binhluan .frame-binhluan .list-comment .coment-medium {
   margin-left: 10%;
}
.block-binhluan .frame-binhluan .list-comment .coment-small {
   margin-left: 15%;
}
.block-binhluan .frame-binhluan .list-comment::-webkit-scrollbar {
   width: 10px;
}
.block-binhluan .frame-binhluan .list-comment::-webkit-scrollbar-track {
   background: #f5f5f5;
   border-radius: 10px;
}
.block-binhluan .frame-binhluan .list-comment::-webkit-scrollbar-thumb {
   background: #8c8c8c;
}
.block-binhluan .frame-binhluan .list-comment::-webkit-scrollbar-thumb:hover {
   background: #f5f5f5;
}
.block-binhluan .frame-binhluan .write-comment {
   padding: 20px;
   display: flex;
   align-items: flex-start;
   gap: 24px;
   border-top: 1px solid #8c8c8c;
}
.block-binhluan .frame-binhluan .write-comment img {
   width: 72px;
   height: 72px;
   -o-object-fit: cover;
   object-fit: cover;
   border-radius: 50%;
}
.block-binhluan .frame-binhluan .write-comment .content {
   position: relative;
   width: 100%;
}
.block-binhluan .frame-binhluan .write-comment .content textarea {
   min-height: 130px;
   width: 100%;
   border-radius: 16px;
   padding: 16px;
   padding-right: 60px;
}
.block-binhluan .frame-binhluan .write-comment .content a {
   position: absolute;
   top: 50%;
   right: 20px;
   transform: translateY(-50%);
}
.block-binhluan .frame-binhluan .write-comment .content a img {
   width: 40px;
   height: 40px;
   -o-object-fit: contain;
   object-fit: contain;
}
.slide-tintuc-khac .item {
   border: 1px solid var(--second);
   border-radius: 24px;
   display: flex;
   flex-direction: column;
   overflow: hidden;
   gap: 0;
}
.slide-tintuc-khac .item img {
   width: 100%;
   height: 297px;
   -o-object-fit: cover;
   object-fit: cover;
   flex-shrink: 0;
}
.slide-tintuc-khac .item .content {
   background-color: #f5f5f5;
   padding: 20px;
   display: flex;
   flex-direction: column;
   align-items: flex-start;
   flex: 1;
   justify-content: space-between;
   gap: 12px;
}
.slide-tintuc-khac .item .content h3 {
   font-size: 20px;
   font-weight: 700;
   line-height: 32px;
   color: #000;
}
.slide-tintuc-khac .item .content p {
   font-size: 1rem;
   font-weight: 400;
   line-height: 20.8px;
   color: #3d3d3d;
}
.slide-tintuc-khac .item .content p span {
   font-style: italic;
}
.slide-tintuc-khac .item .content span {
   font-size: 1rem;
   font-style: italic;
   font-weight: 400;
   line-height: 22.4px;
   color: #3d3d3d;
}
.slide-tintuc-khac .item:hover h2 {
   color: var(--second);
}
.block-tamnhin-sumenh {
   display: flex;
   flex-direction: column;
   gap: 32px;
}
.block-tamnhin-sumenh h1 {
   font-family: Coiny;
   font-size: 30px;
   font-weight: 400;
   line-height: 40px;
   color: var(--primary);
}
.block-tamnhin-sumenh .grid {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   gap: 32px;
}
.block-tamnhin-sumenh .grid .item {
   background-color: #f5f5f5;
   border-radius: 32px;
   padding: 20px;
   display: flex;
   flex-direction: column;
   gap: 12px;
}
.block-tamnhin-sumenh .grid .item span {
   display: flex;
   align-items: center;
   gap: 24px;
}
.block-tamnhin-sumenh .grid .item span img {
   width: 50px;
   height: 50px;
   -o-object-fit: contain;
   object-fit: contain;
}
.block-tamnhin-sumenh .grid .item span h3 {
   font-size: 24px;
   font-weight: 700;
   line-height: 36px;
   text-align: left;
   color: #000;
}
.block-tamnhin-sumenh .grid .item p {
   font-size: 1rem;
   font-weight: 400;
   line-height: 20.8px;
   text-align: left;
   color: #3d3d3d;
}
.block-tamnhin-sumenh .grid .item-img {
   display: flex;
   align-items: center;
   justify-content: center;
}
.block-tamnhin-sumenh .grid .item-img img {
   width: 100%;
   height: 100px;
   -o-object-fit: contain;
   object-fit: contain;
}
.block-doingu-giangvien {
   display: flex;
   flex-direction: column;
   gap: 32px;
}
.block-doingu-giangvien h2 {
   font-family: Coiny;
   font-size: 30px;
   font-weight: 400;
   line-height: 40px;
   color: var(--primary);
}
.block-doingu-giangvien span {
   font-size: 1rem;
   font-style: italic;
   font-weight: 400;
   line-height: 22.4px;
   text-align: left;
   color: #3d3d3d;
}
.block-doingu-giangvien .grid {
   display: grid;
   grid-template-columns: 1fr 2fr;
   gap: 32px;
}
.block-doingu-giangvien .grid .avatar-teach {
   display: grid;
   grid-template-columns: repeat(2, 1fr);
   gap: 32px;
}
.block-doingu-giangvien .grid .avatar-teach img {
   width: 170px;
   height: 170px;
   border-radius: 50%;
   border: 1px solid var(--primary);
   -o-object-fit: cover;
   object-fit: cover;
   margin: auto;
}
.block-doingu-giangvien .grid .text-teach {
   font-size: 1rem;
   font-weight: 400;
   line-height: 24px;
   text-align: left;
   color: #3d3d3d;
}
.frame-infomation {
   padding: 24px;
   border: 2px solid #8f8f8f;
   border-radius: 50px;
   display: grid;
   grid-template-columns: 1.5fr 3fr;
   gap: 24px;
}
.frame-infomation img {
   width: 100%;
   max-height: 468px;
   height: 100%;
   border-radius: 32px;
   flex-shrink: 0;
}
.frame-infomation .content {
   display: flex;
   flex-direction: column;
   gap: 12px;
}
.frame-infomation .content h1 {
   font-size: 31px;
   font-weight: 700;
   line-height: 37.2px;
   color: var(--primary);
}
.frame-infomation .content h2 {
   font-size: 25px;
   font-style: italic;
   font-weight: 300;
   line-height: 30px;
   color: var(--primary);
}
.frame-infomation .content h3 {
   font-size: 1rem;
   font-weight: 400;
   line-height: 32px;
   color: #3d3d3d;
}
.frame-infomation .content span {
   display: flex;
   align-items: center;
   gap: 24px;
}
.frame-infomation .content span img {
   width: 30px;
   height: 30px;
   -o-object-fit: contain;
   object-fit: contain;
   border-radius: 0;
}
.frame-infomation .content span p {
   font-size: 1rem;
   font-weight: 400;
   line-height: 19.2px;
   color: #3d3d3d;
}
.block-kinhnghiem {
   display: flex;
   flex-direction: column;
   gap: 32px;
}
.block-kinhnghiem h2 {
   font-family: Coiny;
   font-size: 30px;
   font-weight: 400;
   line-height: 40px;
   text-align: center;
   color: var(--primary);
}
.block-kinhnghiem .frame-experiment {
   display: flex;
   flex-direction: column;
   gap: 24px;
}
.block-kinhnghiem .frame-experiment .item {
   position: relative;
   display: flex;
   gap: 24px;
   margin-bottom: 70px;
   align-items: center;
}
.block-kinhnghiem .frame-experiment .item .number {
   font-family: Coiny;
   font-size: 24px;
   font-weight: 400;
   line-height: 28.8px;
   color: #fff;
   width: 50px;
   height: 50px;
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 50%;
   background-color: var(--second);
   flex-shrink: 0;
}
.block-kinhnghiem .frame-experiment .item p {
   font-size: 1rem;
   font-weight: 400;
   line-height: 20.8px;
   color: #3d3d3d;
}
.block-kinhnghiem .frame-experiment .item .line {
   position: absolute;
   left: 25px;
   top: 60px;
   width: 4px;
   height: 100%;
   background-size: cover;
}
.block-kinhnghiem h3 {
   font-size: 26px;
   font-style: italic;
   font-weight: 400;
   line-height: 37.2px;
   text-align: center;
   color: #3d3d3d;
}
.block-bangcap {
   display: flex;
   flex-direction: column;
   gap: 32px;
}
.block-bangcap h2 {
   font-family: Coiny;
   font-size: 30px;
   font-weight: 400;
   line-height: 40px;
   text-align: center;
   color: var(--primary);
}
.block-bangcap .grid {
   display: grid;
   grid-template-columns: repeat(3, 1fr);
   gap: 32px;
}
.block-bangcap .grid .item {
   border: 3px solid #3d3d3d;
   border-radius: 50px;
   padding: 32px;
   display: flex;
   align-items: center;
   justify-content: center;
   flex-direction: column;
   gap: 20px;
}
.block-bangcap .grid .item img {
   max-width: 250px;
   width: 100%;
   max-height: 336px;
   height: 100%;
}
.block-bangcap .grid .item h3 {
   font-size: 24px;
   font-weight: 700;
   line-height: 80px;
   text-align: center;
   color: #3d3d3d;
}
.block-bangcap .grid .item:hover h3 {
   color: var(--second);
}
.block-contact {
   display: flex;
   flex-direction: column;
   gap: 80px;
}
.block-contact h1 {
   font-family: Coiny;
   font-size: 30px;
   font-weight: 400;
   line-height: 40px;
   text-align: center;
   color: var(--primary);
}
.block-contact .frame-contact {
   display: flex;
   flex-direction: column;
   gap: 32px;
}
.block-contact .frame-contact h2 {
   font-size: 26px;
   font-weight: 700;
   line-height: 36px;
   text-align: center;
   color: #3d3d3d;
}
.block-contact .frame-contact .content {
   display: flex;
   flex-direction: column;
   gap: 12px;
}
.block-contact .frame-contact .content p {
   font-size: 1rem;
   font-weight: 400;
   line-height: 20.8px;
   color: #3d3d3d;
}
.block-contact .frame-contact .content p span {
   font-size: 22px;
   font-weight: 700;
   line-height: 32px;
}
.block-form-contact {
   display: flex;
   flex-direction: column;
   gap: 32px;
   background-color: #ffc673;
   border: 4px solid #e39b31;
   border-radius: 32px;
   padding: 24px;
}
.block-form-contact h2 {
   font-family: Coiny;
   font-size: 30px;
   font-weight: 400;
   line-height: 40px;
   color: var(--primary);
}
.block-form-contact .frame-input {
   display: flex;
   flex-direction: column;
   gap: 24px;
}
.block-form-contact .frame-input span {
   position: relative;
}
.block-form-contact .frame-input span input {
   width: 100%;
   height: 55px;
   border-radius: 8px;
   padding: 12px;
   padding-right: 50px;
   border: 1px solid #000;
}
.block-form-contact .frame-input span a {
   position: absolute;
   top: 50%;
   right: 12px;
   transform: translateY(-50%);
}
.block-form-contact .frame-input span a img {
   width: 24px;
   height: 24px;
   -o-object-fit: contain;
   object-fit: contain;
}
.block-form-contact .frame-input textarea {
   width: 100%;
   min-height: 200px;
   border-radius: 8px;
   padding: 16px;
   border: 1px solid #000;
   resize: vertical;
}
.block-form-contact .btn {
   font-family: Coiny;
   font-size: 24px;
   font-weight: 400;
   line-height: 28px;
   text-align: center;
   color: #fff;
   background-color: var(--primary);
   height: 50px;
   border-radius: 30px;
   padding: 0px 24px;
   display: flex;
   align-items: center;
   justify-content: center;
   width: -moz-max-content;
   width: max-content;
   margin: auto;
}
.accordion-button::after, .accordion-button:not(.collapsed)::after {
   background-position: center;
}
.block-cauhoithuonggap {
   display: flex;
   flex-direction: column;
   gap: 32px;
   background-color: #d6d6d6;
   border: 1px solid #3d3d3d;
   border-radius: 32px;
   padding: 24px;
}
.block-cauhoithuonggap h2 {
   font-family: Coiny;
   font-size: 30px;
   font-weight: 400;
   line-height: 40px;
   text-align: center;
   color: var(--primary);
}
.block-cauhoithuonggap .accordion-header button {
   font-size: 24px;
   font-weight: 700;
   line-height: 36px;
   color: #3d3d3d;
}
.block-cauhoithuonggap .accordion-header button span {
   margin-right: 24px;
}
.block-cauhoithuonggap .text-content {
   font-size: 1rem;
   font-weight: 400;
   line-height: 20.8px;
   color: #3c3c43;
}

#admintoolbar{
  top: 50% !important;
}

.banner-home {
  position: relative;
}

.banner-homemain .banner-home a {
  position: absolute;
  width: -moz-max-content;
  width: max-content;
  height: auto;
  top: 80%;
  left: 5%;
  color: #fff;
  background-color: var(--primary);
  text-align: center;
  vertical-align: middle;
  padding: 8px 80px;
  border-radius: 50px;
  font-size: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Coiny';
}

.title-landingpage h1{
  font-family: Coiny;
  font-size: 30px;
  font-weight: 400;
  line-height: 40px;
  text-align: center;
  color: var(--primary);
  text-transform: capitalize;
}

.title-landingpage h2{
  font-size: 24px;
  font-weight: 400;
  line-height: 40px;
  text-align: center;
  color: var(--black);
}

.banner-landingpage img{
   width: 100%;
   height: 100%;
   max-height: 300px;
   -o-object-fit: cover;
   object-fit: cover;
   border-radius: 6px;
}

.title-thongtin h2{
  font-family: Coiny;
  font-size: 24px;
  font-weight: 400;
  line-height: 40px;
  text-align: center;
  color: var(--primary);
  text-transform: capitalize;
}

.iconbox-khoahoc{
   display: flex;
   align-items: center;
   flex-direction: column;
   gap: 12px;
}

.iconbox-khoahoc img{
   width: 60px !important;
   height: 60px !important;
   max-width: 60px !important;
   max-height: 60px !important;
   flex-shrink: 0;
}

.iconbox-khoahoc h3{
   font-size: 20px;
   font-weight: 600;
   line-height: 40px;
   text-align: center;
   color: var(--black);
}

.iconbox-khoahoc p{
   text-align: center;
}

.noidung-khoahoc-landingpage img{
   width: 100%;
   height: 100%;
   max-height: 300px;
   border-radius: 6px;
   -o-object-fit: cover;
   object-fit: cover;
}

.noidung-khoahoc-landingpage h4{
   font-size: 20px;
   font-weight: 600;
   line-height: 40px;
   color: var(--black);
}

.frame-bg-cta{
   width: 100%;
   height: 100%;
   max-height: 450px;
   position: relative;
   overflow: hidden;
   border-radius: 8px;
}

.frame-bg-cta img{
   width: 100%;
   height: 450px;
   -o-object-fit: cover;
   object-fit: cover;
   position: relative;
   z-index: 1;
   -o-object-position: 61% 78%;
   object-position: 61% 78%;
   filter: brightness(.5);
}

.frame-bg-cta .text-box{
   position: absolute;
   z-index: 2;
   top: 50%;
   left: 50%;
   transform: translate(-50%,-50%);
   display: flex;
   flex-direction: column;
   gap: 12px;
   align-items: center;
   justify-content: center;
   width: 98%;
}

.frame-bg-cta .text-box *{
   text-align: center;
   color: #fff;
}

.frame-bg-cta .text-box h2{
   text-transform: uppercase;
}

.frame-bg-cta .text-box .hour-min-sec{
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 6px;
   margin-top: 10px;
}

.frame-bg-cta .text-box .hour-min-sec .item{
   background-color: rgba(255,255,255,.7);
   border-radius: 6px;
   width: 200px;
   height: 67px;
}

.frame-bg-cta .text-box .hour-min-sec .item *{
   color: #000;
}
.edit-nav-landingpage .navbar-nav {
  width: 100%;
  justify-content: space-evenly;
}
.edit-nav-landingpage{
   padding: 0;
}
.btn{
   white-space: nowrap;
}
.btn-inline-primary, .btn-inline-primary:hover{
   background-color: var(--primary) !important;
   color: #fff;
   font-weight: bold;
}
.btn-inline-second, .btn-inline-second:hover{
   background-color: var(--second) !important;
   color: #fff;
   font-weight: bold;
}
.bg-second{
   background-color: var(--second);
}
.edit-nav-landingpage .logo img{
   width: 100px;
   height: 50px;
   -o-object-fit: contain;
   object-fit: contain;
}
.edit-nav-landingpage .logo{
   font-size: 30px;
   font-weight: bold;
   line-height: 1.6;
   color: #fff;
}
.edit-nav-landingpage .navbar-nav > li:hover > .nav-link{
   color: #fff !important;
}
.frame-lotrinh-banner{
   width: 100%;
   max-width: 100%;
   height: 430px;
   background-size: cover;
   background-position: center;
   background-repeat: no-repeat;
   text-align: center;
   padding: 20px;
   display: flex;
   flex-direction: column;
   gap: 4px;
   align-items: center;
   justify-content: center;
   padding-right: 0;
}
.frame-lotrinh-banner h2 {
 width: 290px;
 background-size: cover;
 background-repeat: no-repeat;
 background-position: center;
 padding: 10px;
 text-transform: uppercase;
 color: #000;
}
.frame-lotrinh-banner h1{
   text-transform: uppercase;
   font-weight: bold;
   font-size: 49px;
   line-height: 50px;
   color: #000;
   font-family: coiny;
}
.frame-lotrinh-banner h3{
   font-size: 19px;
   font-weight: bold;
   line-height: 1.6;
   color: #000;
}
.frame-lotrinh-banner span{
   width: 250px;
   border-radius: 24px;
   background-color: var(--primary);
   color: #fff;
   font-weight: bold;
   font-size: 16px;
   margin-top: 24px;
   padding: 4px 0;
}
.frame-lotrinh-banner .frame-pice-left-banner {
 display: flex;
 gap: 4px;
 align-items: center;
 justify-content: center;
}
.frame-lotrinh-banner .frame-pice-left-banner h5 {
 width: 50px;
 font-size: 14px;
 font-weight: bold;
}
.font-montserrat *{
   font-family: "Montserrat", system-ui;
}
.frame-lotrinh-banner .frame-pice-left-banner h4.price-2{
   font-size: 34px;
   font-weight: bold;
   line-height: 1.6;
   color: rgb(255, 255, 255);
   z-index: 1;
}
.frame-lotrinh-banner .frame-pice-left-banner h4.price-1{
   font-size: 34px;
   font-weight: bold;
   line-height: 1.6;
   color: rgb(255, 255, 255);
   position: absolute;
   -webkit-text-stroke: 6px rgb(204, 48, 48);
   transform: translateX(6px);
}
.frame-lotrinh-banner .frame-pice-left-banner h6.price-dv-2{
   font-size: 17px;
   font-weight: bold;
   line-height: 1.6;
   color: rgb(255, 255, 255);
   z-index: 1;
   transform: translate(5px, 5px);
}
.frame-lotrinh-banner .frame-pice-left-banner h6.price-dv-1{
   font-size: 17px;
   font-weight: bold;
   line-height: 1.6;
   position: absolute;
   color: rgb(204, 48, 48);
   -webkit-text-stroke-width: 3px;
   transform: translate(123px, 5px);
}
.frame-voucher-banner {
  display: flex;
  align-items: center;
  justify-content: space-around;
  padding: 10px 30px;
  background-color: #fff;
  border-radius: 16px;
  border: 2px solid var(--second);
  gap: 4px;
}
.item-voucher{
   position: relative;
   width: 20%;
}
.item-voucher .cirle-voucher{
   width: 80px;
   height: 80px;
   border-radius: 50%;
   background-color: var(--second);
   position: relative;
}
.frame-voucher-banner h3 {
  text-transform: uppercase;
  font-size: 22px;
  text-align: center;
  color: var(--second);
  width: 170px;
  font-family: coiny;
}
.item-voucher .cirle-voucher .border-voucher{
   position: absolute;
   width: 100%;
   height: 100%;
   border-radius: 50%;
   left: -5px;
   border: 1px solid var(--primary);
}
.item-voucher .item-img-content-voucher {
  position: absolute;
  display: flex;
  align-items: center;
  top: 50%;
  transform: translate(20%, -50%);
  left: 0%;
  gap: 4px;
}
.item-voucher .item-img-content-voucher img{
   width: 70px;
   height: 70px;
   -o-object-fit: contain;
   object-fit: contain;
}
.item-voucher .item-img-content-voucher h4{
   position: relative;
   font-size: 14px;
   font-weight: bold;
   line-height: 1.4;
   color: #000;
   width: 85px;
}
.item-voucher .item-img-content-voucher h4 span {
  position: absolute;
  -webkit-text-stroke: 3px rgb(255, 255, 255);
  top: 0;
  left: 0;
  z-index: -1;
}
.frame-cta-banner {
 display: flex;
 flex-direction: column;
 align-items: center;
 margin-top: 12px;
}
.frame-cta-banner h5 {
 font-size: 14px;
}
.frame-cta-banner .frame-timeline {
 display: flex;
 align-items: center;
 justify-content: center;
 gap: 12px;
 margin-top: 24px;
}
.frame-cta-banner .frame-timeline .item {
 text-align: center;
}
.frame-cta-banner .frame-timeline .item .item-number {
 width: 40px;
 height: 40px;
 background-color: #000;
 padding: 2px;
 color: #fff;
 font-size: 25px;
 font-weight: bold;
 align-content: center;
 margin-bottom: 6px;
}
.frame-cta-banner .frame-timeline .item .item-text{
   font-size: 12px;
}

.frame-right-banner-landingpage{
   text-align: center;
}
.frame-right-banner-landingpage .bg{
   width: 100%;
   height: auto;
   max-height: 560px;
   border-radius: 50%;
   background-color: rgb(255, 241, 221);
   position: relative;
}
.frame-right-banner-landingpage .bg img{
   width: 100%;
   height: 100%;
   -o-object-fit: cover;
   object-fit: cover;
}
.frame-right-banner-landingpage a {
  margin-top: 70px;
  padding: 10px 30px;
  text-transform: capitalize   ;
  font-size: 20px;
  font-family: coiny;
}
.frame-right-banner-landingpage .border-bg{
   width: 100%;
   height: 100%;
   border: 1px solid var(--primary);
   margin-left: 10px;
   border-radius: 50%;
   position: absolute;
   left: 0;
}
.ss2 .frame-title-ss2 h2{
   position: relative;
   font-size: 50px;
   color: #fff;
   font-weight: bold;
   z-index: 1;
   width: -moz-fit-content;
   width: fit-content;
   margin: auto;
   font-family: coiny;
}
.ss2 .frame-title-ss2 h2 span{
   font-size: 50px;
   font-weight: bold;
   position: absolute;
   color: rgb(255, 150, 51);
   text-shadow: rgb(151, 42, 9) 4px 6px 0px;
   -webkit-text-stroke: 7px rgb(255, 150, 51);
   left: 0;
   z-index: -1;
   top: 0;
   font-family: coiny;

}
.frame-title-ss2 h3 {
  color: #fff;
  font-size: 18px;
  font-weight: normal;
}
.bg-primary{
   background-color: var(--primary) !important;
}
.frame-sales-price{
   background-color: rgb(255, 212, 184);
   border: 1px solid #fff;
   border-radius: 9px;
   position: relative;
   max-width: 500px;
   width: 100%;
   height: 55px;
   display: flex;
   align-items: center;
   padding: 0px 20px;
   margin: 100px auto;
   gap: 4px;
}
.frame-sales-price h3 {
  color: var(--primary);
  text-shadow: rgb(232, 170, 128) 2px 2px 1px;
  font-size: 39px;
}
.frame-sales-price h4 {
  color: var(--primary);
  font-weight: 500;
  font-size: 29px;
  text-shadow: rgb(232, 170, 128) 2px 2px 1px;

}
.frame-sales-price h5 {
  color: var(--primary);
  font-size: 18px;
  text-shadow: rgb(232, 170, 128) 2px 2px 1px;
  
}
.frame-chicon {
 position: absolute;
 left: -14px;
 top: -33px;
 width: 165px;
 height: 45px;
 color: #fff;
 font-size: 17px;
 font-weight: bold;
 text-align: center;
 background-size: contain;
 background-position: center;
 align-content: center;
 text-transform: uppercase;
 background-repeat: no-repeat;
}
.frame-giagoc {
  font-weight: bold;
  line-height: 1.6;
  color: #fff;
  text-decoration-line: line-through;
  text-align: center;
  font-size: 20px;
  position: absolute;
  left: 13px;
  bottom: 0;
  transform: translateY(100%);
}
.frame-gift-box{
   width: 250px;
   height: 200px;
   background-size: contain;
   background-repeat: no-repeat;
   background-position: center;
   position: absolute;
   right: 0;
}
.frame-gift-box {
  width: 250px;
  height: 200px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translate(50%, -50%);
}
.frame-gift-box h4 {
  font-size: 12px;
  text-align: center;
  position: absolute;
  left: 50%;
  top: 53%;
  transform: translate(-50%, -100%);
  width: 50px;
  color: var(--primary);
}
.frame-gift-box h4 span {
  font-size: 20px;
  font-weight: 700;
}
.frame-4-lotrinh{
   margin: auto;
}
.frame-4-lotrinh .item{
   background-color: #fff;
   border-radius: 14px;
   overflow: hidden;
   position: relative;
   padding: 20px;
   box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
   display: flex;
   align-items: center;
   gap: 24px;
   height: 100%;
}
.font-montserrat i:before{
   font-family: 'FontAwesome';
}
.frame-4-lotrinh .item img {
  width: 50px;
  -o-object-fit: contain;
  object-fit: contain;
}
.frame-4-lotrinh .item h2 {
  font-size: 25px;
  color: var(--primary);
  margin-top: 10px;
  font-family: coiny;
}
.frame-4-lotrinh .item h3 {
  font-size: 20px;
  color: #000;
  margin-bottom: 10px;
}
.frame-4-lotrinh .item p {
  color: #000;
  font-size: 15px;
  margin-bottom: 6px;
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin-left: 5px;
}
.frame-4-lotrinh .item p i{
  color: var(--second);
}
.row>* {
 padding-bottom: calc(var(--bs-gutter-x)* .5);
 padding-top: calc(var(--bs-gutter-x)* .5);
}
.btn-register-landingpage {
 padding: 10px 30px;
 text-transform: capitalize;
 font-size: 20px;
 font-family: coiny;
}
.frame-title-ss3 h2{
   font-size: 39px;
   color: #000;
   text-transform: uppercase;
}
.frame-title-ss3 h3{
   font-size: 39px;
   color: var(--primary);
   text-transform: uppercase;
   font-family: coiny;
}
.frame-title-ss3 h4{
   font-size: 31px;
   color: #000;
   text-transform: uppercase;
   margin-top: 24px;
}
.frame-title-ss3 h5{
   font-size: 26px;
   color: #000;
}
.ss3 .edit-frame-ytb{
   background-color: var(--second);
   padding: 10px;
   border-radius: 8px;
}
.frame-title-uudai-ss3 h3{
   text-shadow: rgb(255, 177, 167) 2px 2px 1px;
   color: var(--primary);
   font-size: 49px;
   font-weight: bold;
   text-transform: uppercase;
   font-family: coiny;
}
.frame-title-uudai-ss3 h4{
   font-size: 34px;
   color: #000;
}
.frame-voucher-banner-2 {
 height: 180px;
 padding: 20px;
 justify-content: space-between;
}
.frame-voucher-banner-2 h3{
   text-shadow: rgb(255, 177, 167) 2px 2px 1px;
   color: var(--primary);
   font-size: 34px;
   width: 320px;
   font-family: coiny;

}
.frame-voucher-banner-2 .item-voucher .cirle-voucher {
 width: 110px;
 height: 110px;
}
.frame-voucher-banner-2 .item-voucher .item-img-content-voucher h4{
   font-size: 17px;
}
.frame-voucher-banner-2 .item-voucher .item-img-content-voucher h4 span{
   font-size: 17px;
}
.frame-voucher-banner-2 .item-voucher .item-img-content-voucher img{
   width: 90px;
   height: 90px;
}
.frame-voucher-banner-2 .item-img img {
 width: 500px;
 -o-object-fit: contain;
 object-fit: contain;
 margin-bottom: 134px;
}
.frame-title-ss4 h2{
   font-size: 39px;
   font-weight: bold;
   color: #000;
   text-transform: uppercase;
   line-height: 1.3;
   font-family: coiny;
}
.frame-title-ss4 h3{
   font-size: 29px;
   font-weight: 400;
   color: var(--primary);
   text-transform: uppercase;
   line-height: 1;
   margin-top: 12px;
}
.frame-voucher-banner-2 .link-register {
 position: absolute;
 bottom: 0;
 left: 27%;
 transform: translateY(-115%);
}
.image-box-course .item{
   display: flex;
   flex-direction: column;
   position: relative;
   height: 450px;
   z-index: 1;
   margin-bottom: 12px;
}

@keyframes opcity_item_imgbox{
   0%{
      opacity: 50%;
   }
   100%{
      opacity: 100%;
   }
}
@keyframes opcity_item_imgbox_out{
   0%{
      opacity: 100%;
   }
   100%{
      opacity: 50%;
   }
}
.image-box-course .item:after{
   content: '';
   position: absolute;
   width: 100%;
   height: 100%;
   background: linear-gradient(96deg, rgb(245, 34, 0), rgb(253, 96, 0));
   opacity: 30%;
   z-index: -1;
   transform: translate(5px,5px);
   border-radius: 10px;
   animation: opcity_item_imgbox_out .25s ease;

}
.image-box-course .item:hover:after{
   opacity: 100%;
   animation: opcity_item_imgbox .25s ease;
}
.image-box-course .item img{
   width: 100%;
   height: 245px;
   -o-object-fit: cover;
   object-fit: cover;
   border-top-left-radius: 10px;
   border-top-right-radius: 10px;   
}
.image-box-course .content{
   padding: 30px;
   background: var(--second);
   border-bottom-left-radius: 10px;
   border-bottom-right-radius: 10px;
   height: 100% !important; 
}
.image-box-course .content h3{
  color: #000;
  font-size: 20px;
  font-weight: 700;
  text-align: center;
}
.image-box-course .content h4{
   color: #fff;
   font-size: 18px;
   font-weight: normal;
   text-align: center;
}
.bg-color-doingu{
   background-color: rgb(252, 241, 210);
   box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 20px -15px;
   position: relative;
   margin-bottom: 50px;
}
.frame-left-ss5 h2{
   color: var(--primary);
   font-size: 21px;
   text-transform: uppercase;
   line-height: 1.3;
   font-family: coiny;
}
.frame-left-ss5 h3{
   color: #000;
   font-size: 28px;
   text-transform: uppercase;
}
.icon-box-ss5{
   display: flex;
   align-items: center;
   gap: 24px; 
   margin: 24px 0;
}
.icon-box-ss5 .border-icon{
   width: 50px;
   height: 50px;
   border-radius: 10px;
   background: linear-gradient(261deg, rgb(255, 149, 6), rgb(245, 34, 0));
   position: relative;
   text-align: center;
   align-content: center;
   flex-shrink: 0;
}
.icon-box-ss5 .border-icon:after {
 content: '';
 position: absolute;
 width: 65px;
 height: 65px;
 border: 1px solid var(--primary);
 left: 50%;
 top: 50%;
 border-radius: 10px;
 transform: translate(-50%, -50%);
}
.justify-content-right{
   justify-content: flex-end;
}
.justify-content-right.icon-box-ss5 h4 {
  text-align: right;
}
.info-course-lp>* {
  padding: 6px !important;
  height: 90px;
}
.ml-auto{
   margin-left: auto;
}
.info-course-lp {
  margin: auto;
}
.icon-box-ss5 .border-icon img{
   width: 30px;
   height: 30px;
   -o-object-fit: contain;
   object-fit: contain;
   filter: brightness(0) invert(1);
}
.icon-box-ss5 h4{
   font-size: 18px;
   font-weight: normal;
   color: #000;
}
.icon-box-ss5 h4 span{
   font-weight: bold;
}
.frame-image-right-ss5 img{
   width: 100%;
   height: 500px;
   border-radius: 24px;
   -o-object-fit: cover;
   object-fit: cover;
   position: relative;
   z-index: 1;
}
.frame-image-right-ss5{
   position: relative;
}
.frame-image-right-ss5:after{
   content: '';
   position: absolute;
   width: 100%;
   height: 100%;
   right: -15px;
   bottom: -15px;
   border-radius: 24px;
   border: 3px solid var(--second);
}
.frame-camket-doingu{
   position: absolute;
   bottom: 0;
   left: 50%;
   width: 70%;
   background-color: var(--primary);
   padding: 20px;
   transform: translate(-50%, 85%);
   display: flex;
   gap: 24px;
   align-items: center;
   justify-content: center;
   border-radius: 8px;
}
.frame-camket-doingu h3{
   color: #fff;
   font-weight: bold;
   font-size: 25px;
   text-transform: uppercase;
   font-family: coiny;
}
.frame-camket-doingu img{
   width: 80px;
   height: 80px;
   -o-object-fit: contain;
   object-fit: contain;
}
.frame-title-ss6 h2{
   font-size: 39px;
   font-weight: bold;
   color: #fff;
}
.slide-hoatdongngoaikhoa img{
   width: 100%;
   height: 280px;
   -o-object-fit: cover;
   object-fit: cover;
}
.slide-hoatdongngoaikhoa-copy2 img{
   height: 400px;
}
.slide-hoatdongngoaikhoa .owl-nav{
  display: flex;
  top: 50%;
}
.slide-hoatdongngoaikhoa .owl-prev,.slide-hoatdongngoaikhoa .owl-next{
  position: absolute;
  top: 50%;
  background-color: #fff !important;
  border-radius: 50%;
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  i{
   font-size: 16px;
}
}
.slide-hoatdongngoaikhoa:hover .owl-prev,.slide-hoatdongngoaikhoa:hover .owl-next{
   opacity: 1;
}
.slide-hoatdongngoaikhoa .owl-prev{
  left: 0;
  transform: translate(-50%,-50%);
}
.slide-hoatdongngoaikhoa .owl-next{
  right: 0;
  transform: translate(50%,-50%);
}
.frame-title-ss8 h2{
   font-size: 54px;
   line-height: 1.3;
   color: #000;
   text-transform: uppercase;
   font-family: coiny;
}
.frame-title-ss8 h3{
   font-size: 50px;
   color: var(--primary);
   line-height: 1.3;
}
.frame-title-ss8 h3 span{
   font-size: 26px;
   text-decoration: underline;
   font-size: 26px;
   color: #000;
}
.frame-voucher-banner-3 h3{
   position: absolute;
}
.frame-voucher-banner-3 .item-img img {
  margin: 0;
  width: 380px;
  transform: translateY(70px);
}
.frame-voucher-banner-3 {
  height: 210px;
  padding-top: 75px;
  position: relative;
  margin-bottom: 103px;
}
.frame-voucher-banner-3 .item-voucher {
  width: 25%;
}
.frame-voucher-banner-3 h3 {
  position: absolute;
  font-size: 25px;
  right: 50px;
  top: 25px;
}
.frame-cta-banner-position {
  position: absolute;
  right: 5%;
  bottom: -75%;
}
.form-landingpage {
 padding: 30px;
 background-color: var(--second);
 border-radius: 24px;
}
.form-landingpage h2 {
 font-size: 24px;
 text-transform: uppercase;
 text-align: center;
 color: #fff;
 margin-bottom: 24px;
 font-family: coiny;
}
.form-landingpage input {
 margin-bottom: 6px;
 height: 40px;
}
.form-landingpage a {
 margin: 24px 0;
}
.form-landingpage p{
   font-size: 14px;
   color: #fff;
}
.footer-landingpage h2{
   font-size: 27px;
   font-weight: bold;
   color: #fff;
}
.bgfooter-overlay {
 position: absolute;
 width: 100%;
 height: 100%;
 background-color: #000;
 opacity: 90%;
}
.por{
   position: relative;
}
.footer-landingpage .item{
   color: #fff;
   font-size: 14px;
   display: flex;
   align-items: baseline;
   gap: 12px;
   margin-bottom: 24px;
   margin-left: 10%;
   text-align: left;
}
.line-white-footer{
   border-bottom: 2px solid #fff;
   width: 100%;
   margin-bottom: 12px;
}
.footer-landingpage .item a{
   color: #fff;
}
.footer-landingpage .item a:hover{
   color: var(--second);
}
.height-nav{
   height: 58px;
}
.font-montserrat{
   overflow: hidden;
}
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  text-decoration: none;
}

header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  background-color: #fff;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
  padding: 5px 5%;
  z-index: 1000;
}

header .edit-nav-lp{
   display: flex !important;
   align-items: center;
   justify-content: space-between;
}

header .logo {
  font-weight: bold;
  font-size: 30px;
  color: #333;
}

header .navbar ul {
  list-style-type: none;
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
  gap: 23px;
  width: 100%;
  justify-content: space-around;
}

header .navbar ul li {
  position: relative;
  float: left;
}
nav.navbar {
  width: 90%;
}
header .navbar ul li a {
  font-size: 16px;
  font-weight: bold;
  color: #333;
  display: block;
}

header .navbar ul li a:hover {
  color: var(--second);
}
header .navbar ul li a.btn:hover {
  color: #fff;
}

header .navbar ul li ul {
  position: absolute;
  float: left;
  width: 200px;
  background-color: #999;
  display: none;
}

header .navbar ul li ul li {
  width: 100%;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}

header .navbar ul li:hover > ul {
  display: initial;
}

#menu-bar {
  display: none;
}

header label {
  display: none;
}

.header-dashboard {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  background-color: #fff;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
  padding: 16px;
  display: flex;
  z-index: 1000;
  flex-direction: column;
  width: 280px;
  height: 100%;
  align-items: flex-start;
  justify-content: unset;
  border-right: 1px solid #e6e6e6;
  gap: 20px;
}

.header-dashboard .navbar {
  width: 100%;
}

.header-dashboard .navbar ul {
  list-style-type: none;
  display: flex;
  gap: 10px;
  justify-content: space-between;
  flex-direction: column;
  width: 100%;
  align-items: flex-start;
}

.header-dashboard .navbar ul li {
  width: 100%;
}

.avt-50px {
  width: 50px;
  height: 50px;
  background-size: contain;
  background-repeat: no-repeat;
  flex-shrink: 0;
  border-radius: 50%;
}
.logo img {
 width: 142px;
}
.logo-footer-lp {
 width: 100%;
 max-width: 400px;
}
footer p.fs-5 {
 font-weight: bold !important;
 font-family: coiny;
}
/*aniamtion*/
.hide-scroll-effect{
   opacity: 0;
   filter: blur(5px);
   transition: all 1s !important;
}
.show-scrol-effect{
   opacity: 1;
   filter: blur(0px);
}
@-webkit-keyframes slide-in-left {
  0% {
    -webkit-transform: translateX(-1000px);
            transform: translateX(-1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}
@keyframes slide-in-left {
  0% {
    -webkit-transform: translateX(-1000px);
            transform: translateX(-1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}
@-webkit-keyframes slide-in-right {
  0% {
    -webkit-transform: translateX(1000px);
            transform: translateX(1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}
@keyframes slide-in-right {
  0% {
    -webkit-transform: translateX(1000px);
            transform: translateX(1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}
@-webkit-keyframes slide-in-top {
  0% {
    -webkit-transform: translateY(-1000px);
            transform: translateY(-1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@keyframes slide-in-top {
  0% {
    -webkit-transform: translateY(-1000px);
            transform: translateY(-1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@-webkit-keyframes slide-in-bottom {
  0% {
    -webkit-transform: translateY(1000px);
            transform: translateY(1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@keyframes slide-in-bottom {
  0% {
    -webkit-transform: translateY(1000px);
            transform: translateY(1000px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
/*slide in left*/
.show-scrol-effect .slide-in-left {
   -webkit-animation: slide-in-left 1s ease both;
           animation: slide-in-left 1s ease both;
}
/*slide in right*/
.show-scrol-effect .slide-in-right {
   -webkit-animation: slide-in-right 1s ease both;
           animation: slide-in-right 1s ease both;
}
/*slide in top*/
.show-scrol-effect .slide-in-top {
   -webkit-animation: slide-in-top 1s ease both;
           animation: slide-in-top 1s ease both;
}
.show-scrol-effect .slide-in-bottom {
   -webkit-animation: slide-in-bottom 1s ease both;
           animation: slide-in-bottom 1s ease both;
}
.duration-1000{
   animation-duration: 1s !important;
}
.duration-1500{
   animation-duration: 1.5s !important;
}
.duration-2000{
   animation-duration: 2s !important;
}
.duration-2500{
   animation-duration: 2.5s !important;
}
.duration-3000{
   animation-duration: 3s !important;
}
.duration-3500{
   animation-duration: 3.5s !important;
}
.content h2 {
    font-size: 26px;
}
.content h3 {
    font-size: 22px;
}
.content h4 {
    font-size: 18px;
}
.content h5 {
    font-size: 14px;
}
.content h6 {
    font-size: 10px;
}
@media (max-width: 468px) {

  .post-policy a{
    width: 100%;
 }

 .banner-homemain .banner-home a{
    display: none;
 }
 .frame-load-video a {
  bottom: -25%;
}
.block-cauhoithuonggap .accordion-header button {
  font-size: 18px;
  font-weight: 700;
  line-height: 36px;
  color: #3d3d3d;
}
.block-bangcap .grid {
  grid-template-columns: 1fr;
}
.block-kinhnghiem .frame-experiment .item .line {
  height: 90%;
}
.frame-infomation {
  grid-template-columns: 1fr;
}
.block-doingu-giangvien .grid .avatar-teach img {
  width: 120px;
  height: 120px;
}
.block-tamnhin-sumenh .grid {
  grid-template-columns: 1fr;
}
.block-binhluan .frame-binhluan .list-comment .item {
  gap: 12px;
}
.block-binhluan .frame-binhluan .list-comment .item .content .frame-info-comment {
  gap: 16px;
}
.block-binhluan .frame-binhluan .write-comment {
  gap: 12px;
  flex-direction: column;
}
.block-blogs-catalog .grid {
  grid-template-columns: 1fr;
}
.block-videos-catalog .grid {
  grid-template-columns: 1fr;
}
.grid-khoahoc-ielts {
  grid-template-columns: 1fr;
}
.block-noidung-khoahoc ul li button {
  height: 40px;
  font-size: 20px;
}
.block-grid-thongtin .grid {
  grid-template-columns: 1fr;
}
.block-noidung-khoahoc .frame-content-khoahoc p {
  width: 100% !important;
}
.block-noidung-khoahoc ul {
  grid-template-columns: 1fr;
}
.block-gioithieu .grid .item-hinhthuc {
  padding: 10px;
}
.block-gioithieu .grid .item-hinhthuc img {
  width: 50px;
  height: 50px;
}
.block-gioithieu .grid .item-hinhthuc h2 {
  font-size: 20px;
}
.block-gioithieu .grid .item-hinhthuc span {
  font-size: 18px;
}
.block-gioithieu .grid .item-hocphi h2 {
  font-size: 20px;
}
.block-gioithieu .grid .item-hocphi h2 span {
  font-size: 18px;
  margin-left: 0;
}
.block-catalog .frame-tab-catalog button {
  height: 40px;
  font-size: 24px;
}
.block-catalog .frame-tab-catalog .grid {
  grid-template-columns: 1fr;
  gap: 24px;
}
.padding-site {
  padding: 20px 0;
}
.dk-tuvan .frame-row {
  grid-template-columns: 1fr;
}
.block-thongtin-tuvan .grid {
  grid-template-columns: 1fr;
  gap: 24px;
}
.block-thongtin-tuvan .grid .item {
  height: 350px;
}
.block-thongtin-tuvan .grid .item img {
  width: 100px;
  height: 100px;
}
.block-khoahoc-tuyensinh {
  gap: 62px;
}
.block-ielts-cambridge .grid {
  grid-template-columns: 1fr;
  gap: 16px;
}
.img-post-nho {
  height: auto;
}
.frame-text-banner {
  width: 100%;
}
.text-banner-nho {
  left: 0%;
}
.grid-gioithieu {
  grid-template-columns: 1fr;
  width: 100%;
}
   .block-detail-new h1{
      width: 100%;
   }
}
@media (min-width: 469px) and (max-width: 768px) {
   .block-blogs-catalog .grid {
     grid-template-columns: repeat(2, 1fr);
  }
  .block-videos-catalog .grid {
     grid-template-columns: repeat(2, 1fr);
  }
  .grid-khoahoc-ielts {
     grid-template-columns: repeat(2, 1fr);
  }
  .block-noidung-khoahoc ul {
     grid-template-columns: repeat(2, 1fr);
  }
  .block-catalog .frame-tab-catalog button {
     height: 50px;
     font-size: 30px;
  }
  .block-catalog .frame-tab-catalog .grid {
     grid-template-columns: repeat(2, 1fr);
     gap: 24px;
  }
  .padding-site {
     padding: 40px 0;
  }
}
@media (max-width: 768px) {

  .edit-nav-slide .owl-prev, .edit-nav-slide .owl-next {
    top: -42px;
 }

 .block-detail-new img {
  height: 100%;
}
.navbar-nav li:hover > ul.dropdown-menu{
  position: relative !important;
  width: 100%;
}
.navbar-nav>li{
  flex-direction: column !important;
  align-items: flex-start !important;
}
.width-frame-noidungkh {
   width: 100%;
}
.block-noidung-khoahoc .frame-content-khoahoc img {
   display: none;
}
h1 {
   font-size: 26px !important;
}
h2 {
   font-size: 24px !important;
}
h3 {
   font-size: 20px !important;
}
.slide-video-hocvien .item .content h3 {
   font-size: 20px;
}
.block-kinhnghiem .frame-experiment .item {
   margin-bottom: 40px;
}
.block-kinhnghiem h3 {
   font-size: 20px;
}
.block-bangcap .grid .item h3 {
   font-size: 20px;
}
.block-doingu-giangvien .grid {
   grid-template-columns: 1fr;
}
.block-noidung-khoahoc .frame-content-khoahoc p {
   width: 70%;
}
.block-muctieu-khoahoc .grid {
   grid-template-columns: 1fr;
}
.block-gioithieu .grid {
   grid-template-columns: 1fr;
}
.block-videos-hocvien .grid {
   grid-template-columns: 1fr;
   gap: 32px;
}
.block-lydochon .grid {
   grid-template-columns: 1fr;
   gap: 24px;
}
.grid-form-dktv {
   grid-template-columns: 1fr;
   gap: 0;
}
.grid-hinhthuc {
   grid-template-columns: 1fr;
   gap: 0;
}
}
@media (max-width: 1023px) {
  header {
    padding: 20px;
 }

 header label {
    font-size: 20px;
    width: 40px;
    height: 40px;
    background-color: #fff;
    color: #000;
    padding: 10px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    border: 1px solid black;
 }

 header .navbar {
    position: absolute;
    top: 100%;
    right: 0;
    left: 0;
    background-color: var(--primary);
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    transform: translateY(-150%);
    opacity: 50%;
    transition: all 1s ease;
    overflow-y: auto;
    height: 350px;
    width: calc(100% + 40px);
    margin-left: -20px;
 }

 header .navbar ul{
   flex-direction: column;
   margin: 0px 20px;
}

header .navbar ul li {
 width: 100%;
}

header .navbar ul li ul {
 position: relative;
 width: 100%;
}

header .navbar ul li a{
   color: #fff;
}

header .navbar ul li ul li {
 background-color: #eee;
}
header .navbar ul li ul li {
   color: #fff;
}

#menu-bar:checked ~ .navbar {
 transform: translateY(0);
 opacity: 100%;
}

.header-dashboard .navbar {
 position: absolute;
 background-color: #fff;
 border-top: 1px solid rgba(0, 0, 0, 0.1);
 transform: translateX(-150%);
 opacity: 50%;
 transition: all 1s ease;
 overflow-y: auto;
 height: unset;
}

.header-dashboard {
 position: fixed;
 top: 0;
 left: 0;
 right: 0;
 background-color: #fff;
 box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
 padding: 16px;
 display: flex;
 z-index: 1000;
 gap: 0;
 flex-direction: unset;
 width: 100%;
 height: unset;
 align-items: flex-start;
 justify-content: space-between;
 border-right: 1px solid #e6e6e6;
 gap: 20px;
}
}
@media (max-width: 1024px) {
   .text-banner-nho {
     font-size: 1rem;
     width: 100%;
  }
  .edit-frame-detail {
     flex-direction: column !important;
  }
  .frame-csvc-gt {
     grid-template-columns: 1fr;
     gap: 20px;
  }
  .w-avt-gvtb {
     width: 100px;
     height: 100px;
  }
  .w-content-banner-home {
     width: 100%;
     text-align: left !important;
     font-size: 26px !important;
     z-index: 99;
  }
  .only-pc {
     display: none !important;
  }
  .frame-tong-process {
     justify-content: inherit !important;
  }
  .frame-img-tuvan, .h-thongtintuvan {
     height: 400px;
  }
  .mb-24px-respon {
     margin-bottom: 24px;
  }
}
@media (min-width: 1200px) {
   .fs_6_font {
     font-size: 1rem;
  }
  .fs_6_font:last-child {
     font-size: 0.8rem;
  }
  .fs_full {
     font-size: 2rem;
  }
  .fs_font {
     font-size: 2rem;
  }
  .fs_font_2 {
     font-size: 1.75rem;
  }
  .fs_font_5 {
     font-size: 1.25rem;
  }
  .fs_font_6 {
     font-size: 1.25rem;
  }
  .img-1-home {
     height: 320px !important;
  }
  .img-2-home {
     height: 501px !important;
  }
  .img-3-home {
     height: 423px !important;
  }
}
@media (max-width: 490px) {
   .svg_home_data svg {
     min-width: 90px;
     margin-left: 37px;
  }
  .svg_home_data:last-child svg {
     min-width: 110px;
     margin-left: 40px;
  }
}
@media (max-width: 540px){
   .bg-color-doingu{
      margin-bottom: 100px;
   }
   .frame-voucher-banner-2 {
     height: 400px;
  }
  .frame-title-uudai-ss3 h4 {
    font-size: 20px;
 }
 .edit-frame-ytb iframe {
  height: 300px;
}
.frame-title-ss3 h5 {
 font-size: 20px;
}
.frame-title-ss3 h4 {
  font-size: 24px;
  margin-top: 12px;
}
.frame-sales-price h5 {
  font-size: 14px;
}
.frame-gift-box {
  width: 200px;
  height: 200px;
  right: 22%;
  top: 3%;
}
.ss2 .frame-title-ss2 h2, .ss2 .frame-title-ss2 h2 span{
   font-size: 20px !important;
   margin-bottom: 12px;
}
.frame-lotrinh-banner h2{
   padding: 15px;
}
.item-voucher .item-img-content-voucher img{
   width: 50px;
   height: 50px;
}
.item-voucher {
 width: 24%;
}
.frame-voucher-banner h3 {
  font-size: 16px !important;
  width: 110px;
}
.font-montserrat .padding-site{
   padding: 20px 10px;
}
.frame-voucher-banner{
   padding: 10px;
}
.column-reverse-mobile{
   flex-direction: column-reverse;
}

.iconbox-khoahoc h3{
   font-size: 16px !important;
}

.iconbox-khoahoc{
   gap: 4px;
}
.frame-voucher-banner-2 {
 position: relative;
}
.frame-voucher-banner-2 h3 {
 position: absolute;
 top: 5%;
 left: 50%;
 transform: translate(-50%, -10%);
 font-size: 24px !important;
 width: 90%;
}
.frame-voucher-banner-2 .link-register {
 left: 50%;
 transform: translate(-50%, 26px);
}
.frame-voucher-banner-2 .item-img img {
 width: 300px;
 -o-object-fit: contain;
 object-fit: contain;
 position: absolute;
 left: 50%;
 bottom: 0;
 margin: 0;
 transform: translate(-50%);
}
.frame-voucher-banner-2 .item-voucher {
  position: absolute;
  top: 20%;
  left: 10%;
}
.frame-voucher-banner-2 .item-voucher.second {
  right: 20%;
  left: unset;
}
.frame-voucher-banner-2 .item-voucher .item-img-content-voucher img{
   width: 70px;
   height: 70px;
}

.frame-right-banner-landingpage .bg{
   width: 90%;
   margin: auto;
}
.btn-register-landingpage{
   font-size: 16px;
}
.icon-box-ss5 h4{
   font-size: 16px;
}
.frame-camket-doingu {
  width: 90%;
  padding: 10px 20px;
  gap: 12px;
}
.frame-camket-doingu h3 {
 font-size: 14px !important;
}
.frame-camket-doingu img{
   width: 50px;
}
.frame-title-ss8 h3 {
 font-size: 26px !important;
}
.frame-voucher-banner-3 .item-img img {
  width: 300px;
  -o-object-fit: contain;
  object-fit: contain;
  position: absolute;
  left: -50px;
  bottom: 0;
  margin: 0;
  transform: translateY(0%);
}
.frame-voucher-banner-2 .item-voucher.three {
 left: unset;
 right: 60px;
}
.frame-voucher-banner-2 .item-voucher.four {
 left: unset;
 bottom: 60px;
 right: 60px;
 top: unset;
}
.frame-voucher-banner-3 .frame-cta-banner-position {
 position: absolute;
 right: 50%;
 bottom: -37%;
 transform: translateX(50%);
 width: 100%;
}
.frame-voucher-banner-3{
   margin-bottom: 140px;
}
.footer-landingpage .item{
   margin-left: 5px;
}
}
@media (max-width: 768px){

   .frame-bg-cta .text-box .hour-min-sec .item{
      width: 100px;
      height: 50px;
   }

   .column-reverse-tablet{
      flex-direction: column-reverse;
   }
}