@media (max-width: 1920px) {
	.inner_header{
		height: 300px;
	}
	.inner_header .message h1{
		font-size: 3rem;
	}
	.course_all{
		padding: 60px 0;
	}
	.course_filters > h2{
		font-size: 2rem;
	}
	.course_detail .right > h3{
		font-size: 1.8rem;
	}
	.course_detail .price_info .btt .btnPayment{
		padding: 10px 30px;
	}
	.course_detail .price_info .btt a{
		font-size: 1.8rem;
	}
	ul.course_lesson .name{
		font-size: 1.2rem;
	}
	ul.course_lesson .descs{
		font-size: 1rem;
	}
}
@media (max-width: 1899px) {
	.m_inner .m_dasboard .L{
		width: 250px;
	}
	.m_inner .m_dasboard .R {
	    padding: 30px 40px;
	    width: calc(100% - 250px);
	}
	.m_inner .m_box .m_right{
		padding-left: 50px;
		padding-top: 50px;
	}
	.m_inner .m_box .m_right > h1{
		font-size: 2rem;
	}
	.m_inner .m_box .m_left .m_fixmenu{
		padding: 60px 27px;
		padding-bottom: 130px;
		clip-path: polygon(100% 100%, 100% 0%,0% 0%, 0% 80%);
	}
	.m_inner .m_dasboard .sec1 .birthday .date{
		font-size: 3.5rem;
	}
	.m_inner .m_dasboard .sec1 .birthday .month {
	    line-height: 1.5rem;
	}
	#main_menu{
		padding-top: 15px;
	}
	#main_menu > .container{
		min-width: 100%;
		max-width: 100%;
		padding-left: 30px;
		padding-right: 30px;
	}
	footer .col_menu a.f_title{

	}
	footer .f_menu .col{
		min-width: 25%;
		max-width: 25%;
		padding-bottom: 30px;
	}
	.inner_header{
		height: 300px;
	}
	.inner_header .message h1{
		font-size: 3rem;
		margin-top: 1rem;
	}
	.inner_header .message p{
		font-size: 1.2rem;
	}
	.inner_header .message{
		right: 100px;
	}
	.course_detail .right > h3{
		font-size: 1.5rem;
	}.course_detail .teacher_info .info{
		font-size: 1rem;
	}
	.course_detail .teacher_info .info .ms2{
		font-size: 1.1rem;
	}
	.course_detail .teacher_info .info .ms1{
		font-size: 1.2rem;
	}
	.course_detail .price_info .btt .btnPayment{
		font-size: 1.3rem;
		border-radius: 15px;
	}
	.course_detail .left{
		max-width: 350px;
		min-width: 350px;
	}
	.course_detail .right{
		padding-left: 30px;
		min-width: calc(100% - 350px);
    	max-width: calc(100% - 350px);
	}
	.course_detail .right .course_infos .nav-tabs .nav-link{
		font-size: 1.2rem;
	}
	.review_box .suminfo .infos .r_left .totals{
		font-size: 4rem;
	}
	.course_relate > ul > li{
		flex-wrap: wrap;
	}
	.course_relate > ul > li > .desc,
	.course_relate > ul > li > .img{
		min-width: 100%;
		max-width: 100%;
	}
	.media_box .img{
		height: 350px;
	}
	#media_slide .media_box .img{
		height: 260px;
	}
	#media_slide .media_box .count_box::before{
		width: 60px;
		height: 60px;
	}
	#media_slide .slick-prev, #media_slide .slick-next{
		top: 160px;
	}
	.media_box .subject{
		font-size: 1.6rem;
	}
	#media_slide{
		padding-bottom: 30px;
	}
	.news_layout > .hiner > h2{
		font-size: 2.5rem;
		padding-left: 0;
	}
	.news_layout .allnews > .container > .row > .col{
		padding-left: 15px;
		padding-right: 15px;
	}
	.news_layout .newsinfo .img{
		height: 280px;
	}
	.news_layout .newsinfo .name{
		font-size: 1.2rem;
	}
	.news_layout .newsinfo .ft .btn{
		font-size: 1rem;
	}
	.view_details .colRight{
		padding: 0;
		padding-left: 15px;
	}
	.hview h2{
		font-size: 1.5rem;
		min-width: 100%;
		padding-left: 0;
		padding-bottom: 15px;
	}
	.hview{
		flex-wrap: wrap;
		flex-direction: column-reverse;
	}
	.view_details .viewhtml{
		padding-top: 30px;
	}
	.relate_content > ul{
		padding: 15px;
	}
	.relate_content h3{
		margin-bottom: 0;
		font-size: 1.2rem;
	}
	.about_sec1 .container .ms h2{
		font-size: 2rem;
	}
	.about_sec1 .container .ms{
		padding-right: 30%;
	}
	.m_contact .info .col{
		padding-left: 30px;
	}
	.m_contact .info .col1{
		min-width: 450px;
		max-width: 450px;
	}
	.m_contact .info .col1 h2{
		font-size: 1.8rem;
	}
	.m_contact .info .col1 address{
		font-size: 1.1rem;
	}
	.m_contact .form_contact h2{
		font-size: 2rem;
	}
}
@media (max-width: 1600px) {
	#MainNav a{
		font-size: 1rem;
	}
	#MainNav a.nav-link{

	}
	.main_search .form-control, .main_search .btn, .main_membrer .btn{
		font-size: 1rem;
	}
	.course_detail .right .video_present video, .course_detail .right .video_present iframe{
		height: 500px;
	}
	.service_info2 h2, .service_lists h2, .service_info h2{
		font-size: 3rem;
	}
	.service_info .sbg .img{
		margin-left: -50px;
	}
	.service_info .sbg .ms{
		padding-left: 50px;
	}
	.service_info2 .ms{
		padding-left: 30%;
	}
}
@media (max-width: 1440px) {
	.m_inner .m_dasboard .L{
		width: 200px;
	}
	.m_inner .m_dasboard .R {
	    padding: 30px 40px;
	    width: calc(100% - 200px);
	}
	.m_inner .m_dasboard .sec3 .col,
	.m_inner .m_dasboard .sec1 .info .col{
		min-width: 50%;
		max-width: 50%;
		margin-bottom: 15px;
		text-align: left;
	}
	.m_inner .m_box .m_right{
		padding-left: 30px;
		padding-top: 30px;
	}
	.m_inner .m_dasboard .sec3{
		padding-bottom: 0;
	}
	.m_inner .m_box .m_left .m_fixmenu {
	    padding: 30px 20px;
	    padding-bottom: 100px;
	    clip-path: polygon(100% 100%, 100% 0%,0% 0%, 0% 75%);
	    min-height: 250px;
	}
	.m_inner .m_box .m_left .m_fixmenu img{
		width: 20px;
	}
	.m_inner .m_right .card table th{
		font-size: 1rem;
		white-space: nowrap
	}
	.m_inner .m_right .card table.table>:not(caption)>*>*{
		font-size: 0.9rem;
	}
	.m_inner .m_right .card table .badge{
		font-size: 0.85rem;
	}
	.m_inner .m_right > .card table h5{
		font-size: 1rem;
	}
	.m_inner .m_right .card .card-title{
		font-size: 1.3rem;
		text-align: center;
		margin-bottom: 30px;
		padding-top: 5px;
	}
	.m_inner .m_box .m_left{
		padding-left: 40px;
		padding-right: 40px;
	}
	.m_inner .m_right > .card .card-body{
	    padding: 0;
	}
	.view_course .sec1 .right h3{
		font-size: 22px;
	}
	.view_course .sec2,
	.view_course .sec1{
		padding: 20px 0;
		font-size: 16px;
	}
	.view_course .sec2 .c_cert{
		padding-left: 0;
	}
	.view_course .sec2 .ctitle{
		padding-bottom: 20px;
		font-size: 20px;
	}
	.view_course .sec2 .ctitle .btn{
		font-size: 18px;
	}
	.m_inner .m_right > .card{
		padding-bottom: 20px;
	}
	.main_membrer{
	    display: none!important;
	}
	.main_membrer.mobile{
		display: block!important;
	}
	.main_membrer.mobile a.btnLang{
		padding-left: 0px;
		padding-right: 10px;
	}
	.navbar-brand img{
		height: 40px;
	}
	.main_search{
		display: none;
		position: fixed;
		left: 0;
		bottom: 0;
		right: 0;
		top: 0;
		z-index: 9;
		background: rgba(0, 0, 0, 0.5);
	}
	#btnPopSearch{
	    display: block;
	}
	.main_search form{
		position: absolute;
		max-width: 400px;
		height: 60px;
		left: 30px;
		bottom: 0;
		right: 30px;
		top: 0;
		margin: auto;
	}
	.main_search .popupclose{
	    display: block;
	}
	.inner_header{
		height: 200px;
	}
	.inner_header .message h1{
		font-size: 2rem;
		margin-top: 1rem;
	}
	.inner_header .message p{
		font-size: 1rem;
	}
	.inner_header .img {
	    -webkit-clip-path: polygon(calc(100% - 130px) 100%, 100% 0%,0% 0%, 0% 100%);
	    clip-path: polygon(calc(100% - 130px) 100%, 100% 0%,0% 0%, 0% 100%);
	}
	.inner_header .message{
		right : 50px;
		max-width: calc(60% - 50px);
	}
	.inner_header .img{
		width: 40%;
	}
	.media_box .img{
		height: 310px;
	}
	.media_box .count_box::before{
		font-size: 1rem;
	}
	.media_layout{
		padding: 50px 0;
	}
	.media_box .subject{
		font-size: 1.5rem;
	}
	.service_info2 h2, .service_lists h2, .service_info h2{
		padding: 60px 0;
	}
	.service_info2 .ms,
	.service_info2 .col{
		font-size: 1.2rem;
	}
	.service_lists ul.all_services > li .sbox .ms .subject{
		font-size: 2.3rem;
	}
	.service_lists ul.all_services > li .sbox .ms{
		font-size: 1rem;
	}
	.service_info .sbg{
		font-size: 1.4rem;
	}
	.service_lists ul.all_services > li .sbox .ms p{
		width: 80%;
	}
}
@media (max-width: 1399px) {
	.search_box button{
		font-size: 35px;
	}
	.search_box input{
		font-size: 18px;
	}
	.course_filters{
		flex-wrap: wrap;
	}
	.course_filters .form-select,
	.course_filters .keyword{
		max-width: 240px;
	}
	.course_filters > h2{
		min-width: 100%;
	}
	.courses > .img{
		height: 180px;
	}
	.courses > .info{
		padding-left: 15px;
		padding-right: 15px;
		padding-top: 40px;
		padding-bottom: 20px;
	}
	.courses > .info .subjec{
		font-size: 1.1rem;
	}
	.courses > .info p{
		font-size: 0.9rem;
	}
	.courses > .user .img{
		width: 60px;
		height: 60px;
	}
	.course_filters .form-select, .course_filters .form-control, .course_filters .btn, .course_filters .keyword{
		height: 45px;
		font-size: 1rem;
	}
	.popup_filter .box_filter{
		max-width: 500px;
	}
	.popup_filter .box_filter .price_rang input{
		max-width: 190px;
	}
	.popup_filter .course_filters{
		padding: 20px 0;
	}
	.popup_filter .course_filters .keyword{
		min-width: 100%;
		max-width: 100%;
	}
	.course_detail .price_info .price{
		font-size: 1.5rem;
	}
	.course_relate > ul > li{
		flex-wrap: wrap;
	}
	ul.course_lesson .name{
		font-size: 1.1rem;
	}
	.course_lesson .descs .icon{
		font-size: 1.2rem;
		width: 30px;
		height: 30px;
		min-width: 30px;
		max-width: 30px;
	}
	.course_lesson .descs .ms{
		padding-left: 0;
		font-size: 1rem;
	}
	.course_detail .right .course_infos .tab-content{
		padding: 20px;
	}
	.media_box .subject{
		font-size: 1.2rem;
	}
	#media_slide .media_box .img{
		height: 200px;
	}
	#media_slide .slick-prev, #media_slide .slick-next{
		top: 130px;
	}
	.viewmedia_layout .view_info h2{
		font-size: 2.5rem;
	}
	.viewmedia_layout .view_info{
		padding-top: 50px;
	}
	.inner_service .sbox .ms .subject{
		font-size: 2.2rem;
	}
	.inner_service .sbox .ms{
		font-size: 1.2rem;
	}
	.news_layout > .hiner > h2{
		font-size: 2.2rem;
		margin-bottom: 20px;
	}
	.news_layout .newsinfo .img{
		height: 240px;
	}
	.news_layout .newsinfo .img::before{
		padding: 5px 15px;
		font-size: 0.9rem;
	}
	.news_layout .newsinfo .name{
		font-size: 1rem;
	}
	.news_layout .allnews{
		padding-bottom: 50px;
	}
	.view_details .colLeft{
		min-width: 350px;
    	max-width: 350px;
	}
	.view_details .colRight {
	    min-width: calc(100% - 350px);
	    max-width: calc(100% - 350px);
	}
	.hview h2{
		font-size: 1.3rem;
	}
	.relate_content > ul > li{
		flex-wrap: wrap;
	}
	.relate_content > ul > li .img {
	    min-width: 100%;
	    max-width: 100%;
	}
	.relate_content > ul > li .desc{
		padding: 15px;
		min-width: 100%;
		max-width: 100%;
	}
	.news_layout .relate_content > ul > li .img{
		height: 200px;
	}
	.news_layout .relate_content > ul > li .img > img{
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	.about_sec1{
		padding: 50px 0;
	}
	.about_sec1 .container .ms p{
		font-size: 1.2rem;
	}
	.about_sec2 h2{
		font-size: 2.5rem;
	}
	.about_sec2 .info h3{
		font-size: 2.2rem;
	}
	.m_contact .info .col2, .m_contact .info .col3{
		font-size: 1.2rem;
	}
	.m_inner .form-check-label, .m_inner .m_right .card label.form-label{
		font-size: 1rem;
	}
	.form-select.form-select-lg, .form-control.form-control-lg{
		font-size: 1rem;
		min-height: calc(1.5em + 1rem + 2px);
	}
}
@media (max-width: 1199px) {
	.m_inner .m_dasboard .sec2 .name{
		font-size: 1.4rem;
	}
	.m_inner .m_dasboard .sec2 .desc{
		font-size: 1rem;
	}
	footer .f_menu .col{
		min-width: 33.33%;
		max-width: 33.33%;
		padding-bottom: 30px;
	}
	footer .container{
		max-width: calc(100% - 30px);
		min-width: calc(100% - 30px);
	}
	footer .f_info{
		padding-left: 30px;
	}
	ul.course_lists > li{
		width: 33.33%;
	}
	.course_filters{
		margin-bottom: 20px;
	}
	.course_all{
		padding: 40px 0;
	}
	.course_detail{
		flex-direction: column-reverse;
		padding-top: 15px;
		flex-wrap: wrap;
	}
	.course_detail .left{
		padding-top: 40px;
	}
	.course_detail .right{
		padding-left: 0;
	}
	.course_detail .left,
	.course_detail .right{
		min-width: 100%;
		max-width: 100%;
	}
	.course_relate > ul > li{
		flex-wrap: nowrap;
	}
	.course_relate > ul > li > .img{
		max-width: 300px;
		min-width: 300px;
	}
	.course_relate > ul > li > .desc {
	    min-width: calc(100% - 300px);
	    max-width: calc(100% - 300px);
	}
	.media_box .img{
		height: 230px;
	}
	.media_box .count_box::before{
		width: 50px;
		height: 50px;
	}
	#media_slide .media_box .img{
		height: 170px;
	}
	#media_slide .media_box .count_box::before{
		width: 40px;
		height: 40px;
		bottom: -10px;
		right: -15px;
		font-size: 1rem;
	}
	#media_slide .slick-prev, #media_slide .slick-next{
		width: 40px;
		height: 40px;
		background-size: contain;
	}
	#media_slide .slick-prev{
		left: 0;
	}
	#media_slide .slick-next{
		right: 0;
	}
	#media_slide{
		padding-left: 50px;
		padding-right: 50px;
	}
	#media_slide .media_box{
		padding: 15px;
	}
	.media_box .img{
		box-shadow: 0 0 15px rgba(0, 0, 0, 0.4);
	}
	#media_slide .slick-prev, #media_slide .slick-next{
		top: 100px;
	}
	.viewmedia_layout ul.video_lists > li{
		width: 33.33%;
	}
	.service_lists ul.all_services > li .sbox .ms p{
		width: 100%;
	}
	.service_info2 .ms, .service_info2 .col{
		font-size: 1rem;
	}
	.service_slide .slide-item{
		height: 35vw;
	}
	.service_slide .sinfo .ms{
		font-size: 2vw;
		padding: 4vw;
	}
	.service_slide .slick-next, .service_slide .slick-prev{
		width: 60px;
		height: 60px;
		background-size: contain;
	}
	.news_layout > .hiner > h2{
		font-size: 1.8rem;
		padding-top: 50px;
	}
	.news_layout .newsinfo .img{
		height: 180px;
	}
	.news_layout .newsinfo .ft .btn{
		padding: 5px 15px;
		font-size: 0.9rem;
	}
	.view_details .colLeft,
	.view_details .colRight{
		min-width: 100%;
		max-width: 100%;
		padding: 0;
	}
	.news_layout .view_details > .container > .row{
		display: flex;
		flex-direction: column-reverse;
	}
	.news_layout .view_details .viewhtml{
		padding-bottom: 30px;
		margin-bottom: 20px;
	}
	.news_layout .relate_content > ul{
		display: flex;
		flex-wrap: wrap;
		margin-bottom: 0;
	}
	.news_layout .relate_content > ul > li{
		max-width: 33.33%;
		min-width: 33.33%;
		padding: 15px 10px;
		margin-bottom: 10px;
	}
	.about_sec1{
		padding-bottom: 0;
	}
	.about_sec1 .container .ms{
		padding-top: 50px;
		padding-right: 0;
	}
	.about_sec1 .container{
		padding-bottom: 450px;
		background-position: bottom center;
		background-size: 80%;
	}
	.m_contact .info{
		padding: 50px 0;
	}
	.m_contact .info .col1 {
	    min-width: 100%;
	    max-width: 100%;;
	    margin-bottom: 20px;
	}
	.m_contact .info > .container > .row{
		flex-wrap: wrap;
	}
	.m_contact .info .col2{
		border-left: none;
	}
	.m_contact .info .col2, .m_contact .info .col3{
		padding-top: 20px;
		padding-bottom: 20px;
	}
	.m_contact .googlemap iframe{
		height: 50vw;
	}
	.m_inner .m_dasboard{
		flex-wrap: wrap;
	}
	.m_inner .m_dasboard .L,
	.m_inner .m_dasboard .R{
		min-width: 100%;
		max-width: 100%;
	}
	.m_inner .m_dasboard .L .img{
		width: 300px;
		height: 300px;
	}
	.m_inner .m_box .m_right a.h5{
		font-size: 1rem;
	}
	.m_inner .m_box .m_right #table_course .img{
		width: 80px;
	}
}
@media (max-width: 991px) {
	.m_nav{
		background: rgb(87 172 207);
    	box-shadow: 0 0 15px rgba(0,0,0,0.2);
	}
	.inner_header{
		height: auto;
		margin-top: 80px;
	}
	.m_nav,
	#main_menu{
		padding-top: 0;
		height: 80px;
	}
	.m_nav .navbar-brand > img{
		height: 40px;
	}
	.navbar-toggler:focus{
		box-shadow: none;
	}
	#m_box{
	    position: absolute;
	    right: 15px;
	    display: flex;
	    align-items: center;
	    top: 15px;
	}
	#m_box .navbar-toggler{
		margin-left: 15px;
		padding-left: 10px;
		padding-right: 10px;
	}
	.m_notify{
		margin-left: 10px;
	}
	.m_notify > span{
		width: 20px;
		height: 20px;
		font-size: 11px;
	}
	#m_box .m_cicle{
		width: 42px;
		height: 42px;
	}
	.m_inner .m_box .m_left .m_fixmenu{
		display: none;
	}
	.m_nav .container,
	.m_inner .container{
		min-width: 100%;
	}
	.m_inner .m_dasboard{
		flex-direction: column;
	}
	.m_inner .m_dasboard .L{
		align-self: center;
		margin-top: 30px;
	}
	.m_inner .m_dasboard .R{
		width: 100%;
	}
	.m_inner .m_box .m_left{
		position: absolute;
		top: 15px;
		bottom: 0;
		right: 100%;
		z-index: 10;
		-webkit-transition: all .25s ease;
		   -moz-transition: all .25s ease;
		    -ms-transition: all .25s ease;
		     -o-transition: all .25s ease;
		        transition: all .25s ease;
	}
	.m_inner .m_box.open .m_left{
		box-shadow: 0px 10px 20px rgb(0 0 0 / 35%);
	}
	.m_inner .m_box.open .m_left{
		right: calc(100% - 262px);
		border-right: 1px solid #eee;
	}
	.m_inner .m_box .m_right{
		padding: 0;
		width: 100%;
		margin-top: 15px;
	}
	.m_inner .m_dasboard{
		margin-bottom: 15px;
	}
	.m_inner .m_box{
		position: relative;
		overflow: hidden;
	}
	#nav_function{
		display: flex;
		position: absolute;
		right: 20px;
		top: 22px;
	}
	.navbar-toggler{
		border: 0;
		padding: 0 10px;
		display: flex;
	    flex-wrap: wrap;
	    flex-direction: column;
	    justify-content: center;
	    align-items: flex-end;
	    width: 45px;
	}
	.navbar-toggler span{
		display: block;
		height: 3px;
		width: 25px;
		background: #fff;
		margin-bottom: 5px;
		-webkit-transition: all ease 0.3s;
		-moz-transition: all ease 0.3s;
		-ms-transition: all ease 0.3s;
		-o-transition: all ease 0.3s;
		transition: all ease 0.3s;
	}
	.navbar-toggler span:nth-child(2){
		background: #69d1fa;
		width: 20px;
	}
	.navbar-toggler:hover span{
		width: 20px;
	}
	.navbar-toggler:hover span:nth-child(2){
		width: 25px;
	}
	#main_menu > .container{
		gap: 15px;
	}
	#MainNav{
		background: rgba(255, 255, 255, 1);
		padding-right: 0;
		padding-top: 0px;
		padding-bottom: 0px;
		border-radius: 20px;
		box-shadow: 0 0 15px rgba(0,0,0,0.2);
	}
	#MainNav.show{
		margin-bottom: 10px;
	}
	#MainNav > ul{
		padding: 15px 0;
	}
	#MainNav a.nav-link{
		font-size: 0.9rem;
		padding-left: 10px;
		padding-right: 10px;
		text-align: center;
		color: #3881ae;
		font-size: 18px;
	}
	#main_menu{
		background: rgb(87 172 207);
		box-shadow: 0 0 15px rgba(0,0,0,0.2);
	}
	footer .f_info,
	footer .f_menu{
		min-width: 100%;
		max-width: 100%;
	}
	footer .f_menu .col{
		min-width: 25%;
		max-width: 25%;
	}
	footer .f_info{
		border-left: none;
		padding-left: 0;
		text-align: center;
		padding-top: 40px;
		border-top: 1px solid #58acd0;
	}
	.footer_soial{
		justify-content: center;
	}
	footer{
		padding-bottom: 30px;
		padding-top: 40px;
	}
	footer .f_info .footer_logo{
		margin-top: 0;
	}
	.copyright{
		padding: 25px;
		padding-bottom: 30px;
	}
	.copyright span{
		display: block;
		padding-bottom: 10px;
	}
	#MainNav a.nav-link{
		font-weight: 400;
	}
	.m_nav{
		padding: 0;
	}
	.inner_header .img,
	.inner_header{
		height: 200px;
	}
	.inner_header .img img{
		height: 100%;
	}
	.inner_header .img{
		width: 50%;
	}
	#btnPopSearch,
	.main_membrer.mobile .btn{
		color: #fff;
	}
	.navbar-brand{
		background: url('/public/assets_front/img/home/logo.png') no-repeat center center;
		background-size: contain;
	}
	.navbar-brand img{
		opacity: 0;
	}
	.courses > .img{
		height: 150px;
	}
	ul.course_lists{
		margin-left: -10px;
		margin-right: -10px;
	}
	ul.course_lists > li{
		padding: 10px;
	}
	.course_filters > h2{
		font-size: 1.8rem;
	}
	.course_all{
		padding: 30px 0;
	}
	.course_detail .right .video_present video, .course_detail .right .video_present iframe{
		height: 400px;
	}
	.review_box .suminfo .infos{
		flex-wrap: wrap;
	}
	.review_box .suminfo .infos .r_right,
	.review_box .suminfo .infos .r_left{
		padding: 0;
		min-width: 100%;
		max-width: 100%;
		padding-top: 20px;
	}
	ul.media_lists > li{
		padding: 15px;
	}
	.media_layout{
		padding: 30px 0;
	}
	.media_box .img{
		height: 180px;
	}
	.media_box .count_box::before{
		height: 40px;
		width: 40px;
		bottom: -15px;
		right: -15px;
	}
	.clients_box{
		padding: 0;
	}
	.viewmedia_layout{
		padding: 30px 0;
	}
	.viewmedia_layout .view_info h2{
		font-size: 2rem;
	}
	.viewmedia_layout .media_subs h3{
		font-size: 1.5rem;
	}
	.viewmedia_layout ul.video_lists > li{
		width: 50%;
	}
	.service_info2 .ms{
		padding-left: 10%;
		padding-right: 10%;
	}
	.service_info2 h2, .service_lists h2, .service_info h2{
		font-size: 2rem;
	}
	.service_lists ul.all_services > li .sbox .ms .subject{
		font-size: 1.8rem;
	}
	.service_info2{
		padding-bottom: 50px;
	}
	.service_info .sbg .img{
		display: none;
	}
	.service_info .sbg .ms{
		padding: 0;
	}
	.service_info .sbg{
		min-height: auto;
		max-height: auto;
	}
	.service_info{
		padding-bottom: 30px;
	}
	.service_info .sbg{
		font-size: 1.2rem;
	}
	.service_lists ul.all_services > li .sbox{
		padding: 5vw 5vw;
	}
	.news_layout .allnews > .container > .row > .col {
		min-width: calc(50%);
    	max-width: calc(50%);
	}
	.news_layout .newsinfo .img{
		height: 220px;
	}
	.news_layout > .hiner > h2 {
	    font-size: 1.5rem;
	    padding-top: 40px;
	}
	.news_layout .relate_content > ul > li{
		max-width: 50%;
		min-width: 50%;
	}
	.about_sec2{
		padding: 50px 0;
	}
	.about_sec2 h2{
		font-size: 2rem;
	}
	.about_sec2 .info h3{
		font-size: 1.8rem;
	}
	.about_sec2 .info ul.md_lists > li .ms .name{
		font-size: 1.2rem;
	}
	.about_sec2 .info ul.md_lists > li .ms .position{
		font-size: 1rem;
	}
	.about_sec2 .info{
		padding: 50px 0;
	}
	.about_sec1 .container{
		padding-bottom: 330px;
	}
	.about_sec1 .container .ms h2{
		font-size: 1.8rem;
	}
	.about_sec1 .container .ms{
		padding-top: 30px;
	}
	.m_contact .info .col1{
		margin-bottom: 0;
	}
	.m_contact .form_contact{
		padding: 50px 0;
	}
	.m_contact .form_contact h2{
		margin-bottom: 2rem;
		font-size: 1.8rem;
	}
	.m_inner .m_dasboard .L{
		padding-top: 50px;
	}
}
@media (max-width: 767px) {
	.m_login{
		padding: 0 15px;
	}
	.btnRegis,
	.btnLogin{
		font-size: 1.3rem;
	}
	.m_login .boxlayout .logo{
		padding-top: 2rem;
		padding-bottom: 2rem;
	}
	.m_inner .m_right > .card table h5{
		min-width: 300px;
	}
	.view_course .sec1{
		flex-direction: column;
	}
	.view_course .sec1 .left{
		padding-right: 0;
		padding-bottom: 15px;
		text-align: center;
	}
	.view_course .sec1 .left .img{
		margin: auto;
	}
	#main_menu > .container{
		padding-left: 20px;
		padding-right: 20px;
	}
	.clients_box{
		padding-top: 20px;
		padding-bottom: 20px;
	}
	footer .f_menu .col{
		min-width: 33.33%;
		max-width: 33.33%;
	}
	footer{
		padding-top: 30px;
	}
	footer .col_menu a.f_title{
		font-size: 1.1rem;
		margin-bottom: 10px;
	}
	footer .col_menu ul > li > a{
		font-size: 0.9rem;
	}
	.search_layout{
		padding: 60px 20px;
	}
	.inner_header .message h1{
		font-size: 1.6rem;
	}
	.inner_header .img,
	.inner_header{
		height: 150px;
	}
	ul.course_lists > li{
		min-width: 50%;
		max-width: 50%;
	}
	.clients_box .img{
		height: 30vw;
	}
	.course_all{
		padding-top: 25px;
	}
	.inner_header .message p{
		font-size: 0.9rem;
	}
	.course_relate > ul > li > .img{
		max-width: 150px;
		min-width: 150px;
	}
	.course_relate > ul > li > .desc {
	    min-width: calc(100% - 150px);
	    max-width: calc(100% - 150px);
	}
	.course_detail .right .course_infos .nav-tabs .nav-link{
		font-size: 1.1rem;
	}
	.course_detail .right .video_present video, .course_detail .right .video_present iframe{
		height: 50vw;
	}
	ul.media_lists > li{
		max-width: 50%;
		min-width: 50%;
	}
	.viewmedia_layout ul.video_lists > li{
		width: 50%;
	}
	.viewmedia_layout .media_subs{
		padding: 30px 0;
	}
	.service_lists ul.all_services > li{
		max-width: 100%;
		min-width: 100%;
	}
	.service_lists ul.all_services > li .sbox{
		padding: 20vw 5vw;
	}
	.service_info2 h2, .service_lists h2, .service_info h2{
		padding: 30px 0;
		font-size: 1.8rem;
	}
	.service_info2 .col{
		min-width: 100%;
		max-width: 100%;
	}
	.service_info2 .ms{
		margin-top: 30px;
		padding: 40px;
	}
	.service_info .sbg{
		font-size: 1rem;
	}
	.service_info{
		padding-bottom: 0;
	}
	.news_layout .newsinfo .img{
		height: 170px;
	}
	.news_layout .newsinfo .img::before{
		font-size: 0.8rem;
	}
	.news_layout .allnews > .container > .row > .col{
		padding-bottom: 25px;
	}
	.pagination .page-link,
	.pagination .page-item{
		font-size: 0.8rem;
	}
	.news_layout .relate_content > ul > li .img{
		height: 150px;
	}
	.hview h2{
		font-size: 1.2rem;
	}
	.hview .subinfo .date{
		padding: 10px 15px;
		font-size: 0.9rem;
	}
	.hview .subinfo .btn{
		font-size: 1rem;
	}
	.news_layout .view_details{
		padding: 30px 0;
	}
	.inner_slide .slider-nav .img{
		height: 80px;
	}
	.about_sec1 .container .ms{
		padding-top: 0;
		padding-bottom: 0px;
	}
	.about_sec1 .container .ms h2{
		font-size: 1.5rem;
	}
	.about_sec1 .container .ms p{
		font-size: 1rem;
	}
	.about_sec1 .container{
		padding-bottom: 300px;
	}
	.about_sec2 .info ul.md_lists > li .num{
		min-width: 40px;
		max-width: 40px;
		height: 40px;
		font-size: 1rem;
	}
	.about_sec2 .info ul.md_lists{
		gap: 20px 0;
	}
	.m_contact .info .col2, .m_contact .info .col3{
		border-left: none;
		min-width: 100%;
		max-width: 100%;
	}
	.m_contact .info{
		padding: 40px 0;
	}
	.m_contact .info .col2 i, .m_contact .info .col3 i{
		font-size: 2rem;
	}
	.m_inner .m_box .m_right a.h5{
		min-width: 300px;
		display: block;
	}
	#table_course a.btn{
		white-space: nowrap;
		font-size: 0.9rem;
	}
	.m_inner .m_box .m_right .btnRegis{
		font-size: 0.9rem;
	}
	.m_inner .m_right .card .card-subtitle{
		font-size: 18px;
		line-height: 20px;
	}
	.pdf_preview{
		padding: 0;
	}
	.btn-big{
		font-size: 1.2rem;
		padding: 10px 40px;
	}
}
@media (max-width: 600px) {
	.viewmedia_layout ul.video_lists > li .img{
		width: 100%;
	}
	.viewmedia_layout ul.video_lists > li .name{
		font-size: 1rem;
	}
	.viewmedia_layout ul.video_lists > li .desc{
		font-size: 0.9rem;
	}
	.service_slide .slide-item{
		height: 80vw;
	}
	.service_slide .sinfo .ms {
	    font-size: 3vw;
	    padding: 8vw;
	}
	.inner_service .sbox .ms .subject{
		font-size: 2rem;
	}
	.inner_service .sbox .ms p{
		font-size: 1rem;
	}
	.clients_box .img{
		height: 35vw;
	}
	.service_info2{
		padding-bottom: 30px;
	}
	.service_info2 h2, .service_lists h2, .service_info h2{
		padding-bottom: 15px;
	}
	.inner_header .message{
		right: 30px;
	}
	.m_inner{
		padding-bottom: 30px;
	}
}
@media (max-width: 550px) {
	footer .f_menu .col{
		min-width: 50%;
		max-width: 50%;
	}
	.copyright{
		font-size: 0.9rem;
	}
	.m_login .boxlayout .logo img{
		max-width: 40%;
	}
	.m_login .boxlayout{
		font-size: 1rem;
	}
	.m_login .boxlayout .logo{
		
	}
	ul.course_lists > li{
		min-width: 100%;
		max-width: 100%;
	}
	.courses > .img{
		height: 70vw;
	}
	.courses > .user .img{
		height: 20vw;
		width: 20vw;
	}
	.courses > .info{
		padding-top: 50px;
	}
	.course_all{
		padding-bottom: 0;
	}
	.course_filters .form-select, .course_filters .keyword{
		min-width: 100%;
		max-width: 100%;
	}
	#media_slide .media_box .img{
		height: 50vw;
	}
	.viewmedia_layout .view_info h2{
		font-size: 1.5rem;
	}
	.viewmedia_layout,
	.viewmedia_layout .view_info{
		padding-bottom: 0;
	}
	.viewmedia_layout .view_info{
		padding-bottom: 15px;
	}
	.news_layout .allnews > .container > .row > .col {
	    min-width: calc(100%);
	    max-width: calc(100%);
	}
	.news_layout .newsinfo .img{
		height: 60vw;
	}
	.news_layout > .hiner > h2{
		padding-top: 30px;
	}
	.news_layout .relate_content > ul > li {
	    max-width: 100%;
	    min-width: 100%;
	}
	.news_layout .relate_content > ul > li .img{
		height: 50vw;
	}
	.news_layout .view_details{
		padding-bottom: 0;
	}
	.inner_slide .slider-nav .img{
		height: 15vw;
	}
	.about_sec2 .img img{
		width: 80%;
	}
	.about_sec2 .info ul.md_lists{
		padding-left: 15vw;
	}
	.about_sec2 .info ul.md_lists > li{
		min-width: 100%;
		max-width: 100%;
	}
	.about_sec2 h2{
		font-size: 1.5rem;
	}
	.about_sec1 .container{
		padding-bottom: 50vw;
	}
	.about_sec1 .container .ms .img{
		flex-wrap: wrap;
	}
	.about_sec1{
		padding-top: 25px;
	}
	.about_sec1 .container .ms h2{
		font-size: 1.3rem;
	}
	.about_sec2{
		padding-bottom: 0;
	}
	.m_contact .info .col1 h2{
		font-size: 1.5rem;
	}
	.m_contact .info .col1 address{
		font-size: 1rem;
	}
	.m_contact .info .col2, .m_contact .info .col3{
		font-size: 1rem;
		padding-top: 10px;
		padding-bottom: 10px;
	}
	.m_contact .form_contact{
		padding: 30px 0;
	}
	.m_contact .form_contact form .btnBlack{
		font-size: 1rem;
	}
	.m_notify .dropdown-menu .dropdown-item .info{
		max-width: 230px;
	}
	.m_inner .m_dasboard .sec1 .info .col:nth-child(2){
		min-width: 100%;
		max-width: 100%;
	}
	.m_inner .m_dasboard .sec3 strong{
		font-size: 1.2rem;
	}
	.auth_footer{
		font-size: 0.9rem;
	}
	.m_notify .dropdown-menu .dropdown-item .info{
		max-width: 250px;
	}
}