@media (min-width: 992px) and (max-width: 1366px) { 
	.section-wrapper {
   		max-width: 100%;
		width: 1200px;
	}
	header nav ul li a {
	  padding: 5px 10px;
	  font-size: 0.76rem;
	}
	.csv-section-wrapper{
		max-width: 100%;
		width: 1200px;
 	}
 	.csv-pc-banner{
		height: 350px !important;
		min-height: 350px !important;
	}
	.csv img{
		height: auto;
		width: 200px;
		
	}
	.weeks-20 .item, .technology-carousel .item {
	    padding: 10px 10px;
	    height: 100%;
	    aspect-ratio: 1/1;
	}
	.weeks-20 span, .technology-carousel span{
		font-size:1.5rem;
	} 
	.weeks-20 .item img, .technology-carousel .item img {
		width:auto;
		height:55%;
		margin-bottom:5%;
		margin-top:5%
	}
	.t-next, .t-prev {
	    margin-left: -15px;
	    margin-right: -15px;
	}	
	.swiper-button-next{
		left: calc(100% - 45px);
		right:unset;
	}
	.swiper-button-prev{
		right: calc(100% - 45px);
		left:unset;
	}
}
@media (max-width: 991px) {
	body{
		width:100%;
		overflow-x: hidden;
		font-size:15px;
	}
	.header-wrapper,.footer-wrapper{
	    width: 100%;
	    padding: 0;
	}
	.section .section-wrapper, .footer-contact-form .section-wrapper ,.section-wrapper{
		max-width:100%;
		width:100%;
	}
	.mobile-menu-btn{
	    display: block;
	    height: 25px;
	    right: 20px;
	    margin: auto;
	    overflow: hidden;
	    position: absolute;
	    top: 18px;
	    width: 25px;
	    z-index: 1000;	
	    cursor:pointer;  
	}
	.mobile-menu-btn div {
	    background:#333;
	    height: 2px;
	    margin: auto;
	    transition: all 0.3s ease 0s;
	    width: 25px;
	}
	.mobile-menu-btn.active div {
		background:#fff;
	}
	.mobile-menu-btn div:nth-of-type(1) {
	    position: absolute;
	    top: 3px;
	}
	.mobile-menu-btn div:nth-of-type(2) {
	    bottom: -50%;
	    opacity: 100;
	    position: absolute;
	    top: -50%;
	}
	.mobile-menu-btn div:nth-of-type(3) {
	    bottom: 3px;
	    position: absolute;
	}
	.mobile-menu-btn.active div:nth-of-type(1) {
	    position: absolute;
	    top: 10px;
	    transform: rotate(45deg);
	}
	.mobile-menu-btn.active div:nth-of-type(2) {
	    opacity: 0;
	}
	.mobile-menu-btn.active div:nth-of-type(3) {
	    bottom: 12px;
	    position: absolute;
	    transform: rotate(-45deg);
	}
	.mobile-menu-btn.active{
		position: fixed;
		top:18px;
		z-index: 11;
	}
	.mask{
		background:rgba(0,0,0,.8);
		position: fixed;
		width:100%;
		height:100%;
		z-index: 10;
		display: none;
	}
	.logo {
		padding-left:0px;
		padding-right:0px;
	}
	.logo img {
	    width: auto;
	    height: 40px;
	    display: block;
	}
	header .logo-slogun {
		display: none;
	}
	.page-title{
		font-size: 1.5em;
	    margin-bottom: 10px;
	    padding: 0 50px;
	}
	h2.title{
	    font-size: 1.25em;
	    margin-bottom: 10px;
	}
	/* css frameworks ended */
	.half-style .section-wrapper{
		padding:0;
	}
	.half-style-img {
	    position: relative;
	    width: 100%;
	    right: unset;
	    top: unset;
	    bottom: unset;
	    margin-top: unset;
	    margin-bottom: unset;
	    height: 300px;
	    margin-left: 0px;
	    margin-right: 0px;
	}
	.half-style-content{
		padding: 30px 15px;
		min-height: 0;
	}
	h1.section-title {
	    margin-bottom: 15px;
	}
	.skill-img{
		height:180px;
	}
	.skill-content-box{
		position: fixed !important;
		left:15px !important;
		top:30px !important;
		right:15px !important;
		bottom:30px !important;
		margin: auto !important;
		width: auto;
		height:auto;
	}
	header nav {
	    font-size: 1.2rem;
	}
	header nav ul {
	    flex-direction: column;
	}
	header nav ul li a{
		padding-top:15px;
		padding-bottom:15px;
	}
	.menu-section {
	    position: fixed;
	    z-index: 10;
	    top: 0;
	    left: 0;
	    height: 100%;
	    background:rgba(83,82,82,1);
	    visibility: hidden;
	    opacity: 0;
	    transition: all .3s ease-in-out;
	    transform:translateX(-100%);
	}
	.menu-section.active{
		visibility: visible;
	    opacity: 1;
	    transform:translateX(0%);
	}
	header nav ul li:after{
		display: none;
	}
	.menu-section .section-wrapper{
		padding:0;
	}
	.social-btn {
	    display: block;
	    float: unset;
	    margin-top: 10px;
	    margin-left: 10px;
	}
	header nav ul li .sub-menu {
	    position: relative;
	    display: flex;
	    visibility: visible !important;
	    opacity: 1 !important;
	    background:rgba(0,0,0,0.2);
	    font-size:.85em;
	}
	header nav .current-menu-ancestor:before, header nav .current-menu-parent:before, header nav>ul>li.current-menu-item:before{
		display: none;
	}
	header nav ul li .sub-menu a:before{
		content:"- ";
	}
	header nav[class^="menu-top-menu-zh"] ul li a{
		padding-left:15px;
		padding-right:15px;
	}
	[class^='menu-sitemap'] ul{
		padding:0;
	}
	.header-slogun{
		display: none;
	}
	.half-style .section-wrapper{
		padding-top:0 !important;
	}
	.section-wrapper h3 {
	    font-size: 1.15rem;
	}
	.article-box .article-excerpt {
	    width: 65%;
	    padding: 15px;
	}
	.small-wrapper{ padding:0; }
	.article-box {
	    height: 185px;
	}
	.article-box .article-excerpt a {
	    bottom: 15px;
	    left: 15px;
	}
	footer .footer-top .section-wrapper {
	    padding: 25px 15px;
	}
	.half-style {
		overflow:hidden;
	}
	.step-box h3 {
	    font-size: 4rem !important;
	}
	.footer-icon{
		margin-bottom:20px !important;
	}
	.langauge-menu {
	    display: none;
	}
	.mobile-lang{
		display: block;
		top: 20px;
	    right: 64px;
	    border-right: 1px solid #999;
	    padding-right: 15px;
	    position: absolute;
	}
	.number-box {
	    padding: 20px 5px;
	}
	.tree-section .section-wrapper>div{
		padding-left:0;
		padding-right:0;
	}
	.weeks-20 .item, .technology-carousel .item {
	    padding: 10px 5px;
	    height: 100%;
	    aspect-ratio: 1/1;
		font-size:1.5rem;
	}
	.weeks-20 span, .technology-carousel span{
		font-size:1.5rem;
	}
	[lang="en-US"] .weeks-20 span,[lang="en-US"] .technology-carousel span{
		font-size:1.15rem;
	}
	.weeks-20 .item img, .technology-carousel .item img {
		width:auto;
		height:55%;
		margin-bottom:5%;
		margin-top:5%
	}
	.t-next, .t-prev {
	    margin-left: -15px;
	    margin-right: -15px;
	}	
	.swiper-button-next{
		left: calc(100% - 45px);
		right:unset;
	}
	.swiper-button-prev{
		right: calc(100% - 45px);
		left:unset;
	}
	.page-template-page-moxo .page-banner-content-box {
		padding-left: 15px;
	    padding-right: 15px;
	    padding-bottom: 30px;
	}
	.page-template-page-moxo .page-banner-content-box h1{
		margin-bottom:30px;
	}
}
@media (max-width: 767px) {
	.section-wrapper h3{
		font-size:1.25rem;
	}
	.number-box h3.number {
		font-size: 2.1rem;
	}
	.number-box .year {
		font-size: 1.85rem;
	}
	.section .section-wrapper {
	    padding-top: 30px;
	    padding-bottom: 30px;
	}
	.section-wrapper h1.title, .page-title,h1.section-title{
		font-size:1.4rem;
	}
	.section-wrapper h2 {
	    font-size: 1.3rem;
	}
	.small-wrapper h1, .small-wrapper h2, .small-wrapper h3, .small-wrapper h4, .small-wrapper h5, .small-wrapper h6{
		text-align: initial;
	}
	#menu-sitemap{
		padding-left:0;
	}
	.mobile-banner{
		display: block;
		background-size: cover;
		background-position: center center ;
		min-height:200px;
	}
	.mobile-banner .section-wrapper{
		padding:0;
		height: 100%;
	}
	.aboutus-banner-800 {
	    height: auto;
	    padding: 15px;
	    padding-top: 320px;
	    background-position: center top;
	}
	.pc-banner{
		display: none;
	}
	/*
    .page-banner .page-title, .testi-banner .page-title {
	    padding-left: 15px;
        padding-right: 15px;
	    padding-top:170px;
	    padding-bottom:30px;
    }
   	*/
	.page-banner .page-title, .testi-banner .page-title {
        padding-left: 15px;
        padding-right: 15px;
        height: 200px;
        padding-top: 0;
        padding-bottom: 0;
        display: flex;
        flex-direction: column;
        justify-content: center;    
	}
	.contact-form-box{
	    padding: 20px;
	    padding-bottom:0;
	}
	.contact-info{
		padding: 20px;
		padding-top:0;
	}
	div[class^="menu-footer"]{
		display: none;
	}
	.copyright {
	    width: 100%;
	    text-align: center;
	}	
	[class^='menu-sitemap']>ul>li {
	    width: calc(50% - 10px);
	}
	.whatsapp_pop {
	    position: fixed;
	    bottom: 20px;
	    right: 20px;
	    z-index: 10;
	}
	.whatsapp_pop img{
	    width: 40px;
	    height: 40px;
	}

	.step-box{
		display: none;
	}
	.step-content {
	    padding: 25px;
	}
	.step-content p img{
		margin-bottom:20px !important;		
	}
	.step-section .row:nth-child(even) > div:nth-child(odd) {
	    order: 0;
	}
	.section-divide {
	    margin-top: 30px;
	    margin-bottom: 30px;
	}
	#grid-info > .elementor-widget-container > * {
	  margin-bottom: 15px; /* Adjust the margin as needed for mobile */
	}
	.article-box2, .article-box3, .article-box4{
		height:350px;
	}
	.floating-menu{
		display: block;
	}
	.csv{
		text-align: right !important;
		/* padding: 90px 30px !important;*/
		padding-left: 65% !important;
		padding-bottom: 5%;
		padding-top: 9%;
		padding-right: 2%;
	}
	.csv-m{
		font-size: 0.75em!important;
	}
	.csv img{
		height: auto;
		width: 100px !important;
	}
	.csv-mobile-banner{
		height: 155px !important;
		min-height: 155px !important;
	}
	.swiper-button-next{
		left:calc(100% - 45px);
		right:unset;
	}
	.swiper-button-prev{
		right:calc(100% - 45px);
		left:unset;
	}
	.coop-logo-group img {
        width: auto;
        margin: auto;
        display: table;
    }
    .coop-logo-group img:nth-child(n+5) {
        width: auto;
        margin: 20px auto 35px !important;
    }
	.swiper{
		margin-left:-20px;
		margin-right:-20px;
	}
	#index-banner .swiper{
		margin-left:0px !important;
		margin-right:0px !important;
		width:100%;
	}
	.lr-section .section-wrapper>div:nth-of-type(2n) div{
		order:1;
	}
	.lr-section .section-wrapper>.row{
		margin-top:10px;
		maring-bottom:10px;
	}
	.step-content .alignright {
	    display: block !important;
	    clear: both !important;
	    margin: auto;
	    margin-bottom: 20px;
	    float: none;
	}
	.program-video iframe {
        max-width: 100%;
        aspect-ratio: 16 / 9;
        height: auto;
    }
    .page-banner-content-box{
    	padding-left:0px;
    	padding-right:0px;
    }
    .page-banner-content-box h1{
    	font-size: 1.4rem;
        padding-top: 170px;
        text-align: center;
    }
    .nav-link{
		font-size: 1rem;
        padding: 10px;
		border-top-left-radius: 20px;
	    border-top-right-radius: 20px;
	}
	.nav.nav-tabs{
		flex-wrap: nowrap;
	    overflow-x: auto;
	    white-space: nowrap;
	    justify-content: left;
	}
	.tab-pane .tab-wrapper{
		padding:0px;
		padding-top:20px;
	}
	.accordion-button, .accordion-body {
	    padding: 10px;
	}
	html {
	    overflow-x: hidden;
	}
	.program-content-box, .news-content-box {
	    height: calc(100% - 190px);
	}
	.tab-wrapper table td{
		flex-direction: column;
		text-align: justify;
	}
	.tab-wrapper table td img{
		margin:0;
		margin-bottom:30px;
		float: unset;
	}
	.weeks-20 .item, .technology-carousel .item {
	    padding: 10px 5px;
	    height: 100%;
	    aspect-ratio: 1/1;
		font-size:1.5rem;
	}
	.weeks-20 span, .technology-carousel span{
		font-size:1.5rem;
	}
	[lang="en-US"] .weeks-20 span,[lang="en-US"] .technology-carousel span{
		font-size:1.15rem;
	}
	.weeks-20 .item img, .technology-carousel .item img {
		width:auto;
		height:55%;
		margin-bottom:5%;
		margin-top:5%
	}
	.section-wrapper h3.services-title{
		font-size:2.25rem !important;
	}
	[lang="en-US"] .section-wrapper h3.services-title{
		font-size:1.6rem !important;
	}
	.school-step{
		min-height: 250px;
	}
	[lang="en-US"] .service-box.no-img.school-step .service-li{
	    padding-left: 10px !important;
	    padding-right:20px;
	}
	.school-step2{
		min-height: 225px;
	}
	[lang="zh-HK"]  .section-wrapper h3.services-title.long-services-title{
		font-size:1.75rem !important;
	}

}