@media screen and (max-width: 1920px) {
  .cd-hero__slide_frame {width: 60%!important}
  .img-desktop img{ width: 560px!important}
}
@media screen and (max-width: 1480px) {
  .cd-hero__slide_frame {width: 70%!important}
}
@media screen and (max-width: 1400px) {
  .cd-hero__slide_frame {width: 80%!important}
}

@media screen and (max-width: 1224px) {
	.container{width:85%; margin: 0 auto}
	#logo{ width:20%; height: 62px; float: left; background-image:url(../images/logo.png); background-size: 160px; background-position: left top; background-repeat: no-repeat; transition: 0.8s}
	#menu{ width:52%}
	.topnav a {padding: 8px 20px; font-size: 16px}
	.btn-schedule{ width: 20%; float: left}
	.hm-client-logo img{ width: 120px; margin: 0 0 30px; padding: 0 20px}
	.cd-hero__slide_frame {width: 85%!important}
	.dropdown .dropbtn {padding: 9px 20px}
	.img-desktop img{ width: 100%!important}
}
@media screen and (max-width: 1028px) {
   .cd-hero__slide_frame {width: 90%!important}
	#menu{ width:72%}
   .btn-schedule a{ font-size: 13px; margin-top: 0px}
   .mdemo{ display:none}
}
@media screen and (max-width: 768px) {
  .cd-hero__slider {
    height: 630px!important;
  }
}

@media screen and (max-width: 640px) {
	h1{font-size: 42px; line-height: 56px; font-weight: 600; margin: 0 0 20px}
	h2{font-size: 24px; font-weight: 500; margin: 0 0 15px}
	h3{font-size: 18px; line-height: 28px; font-weight: 200; margin: 0 0 15px}
	h4{ font-size:14px; line-height: 24px}
	.container{width:90%; margin: 0 auto}
	#logo{ width:48%; height: 62px; background-size: 120px}
	#menu{ width:52%}
	.topnav a {padding: 8px 20px; font-size: 16px}
	.btn-schedule{ width: 30%}
	.btn-schedule a{ font-size: 13px; margin-top: 0px}
	#introduce{ margin: 130px 0 0px}
	#introduce-info{ width: 100%; margin-top: 30px; text-align: center}
	#introduce-info h3{ margin-bottom: 50px}
	#introduce-img{ width: 100%; height: 610px}
	.hm-solution-list li{ margin: 0 0 30px}
	#hm-solution{ padding-bottom: 10px; margin-bottom: 90px; border-bottom: 1px solid #e3e3e3}
	.btn-video-yt{float: none; margin: 0 auto}
	.img-desktop{ width: 85%; top: 30px}
	.img-mobile{ width: 50%; top: 180px}
	.mschedule{ display:block}
	
	.hm-solution-list ul{ width: 100%}
	.hm-solution-list li{ width: 30%; min-height: 200px; margin: 0 0 40px}
	.hm-solution-list p{ line-height: 18px}
	.hm-solution-list h4{ margin-bottom: 10px!important}
	.hm-client-logo img{ width: 130px; margin: 0 0 30px; padding: 0 30px}
	#introduce-solution h5{ width: 90%}
	.content{ width: 100%; float: left; margin-bottom: 0px}
	.content-info-left{ width: 100%; margin-right: 0%; margin-bottom: 30px; float: left}
	.content-info-right{ width: 100%; margin-left: 0%; margin-bottom: 30px; float: left}
	.content-img-right{ width: 100%; margin-bottom: 30px; float: left}
	.content-img-left{ width: 100%; margin-bottom: 30px; float: left}
	#introduce-about-left{ width: 100%; margin-right: 0%; margin-bottom: 30px}
	#introduce-about-right{ width: 100%; }
	#introduce-about h4{ width: 90%; margin: 0 auto; color: #71B6D7; font-weight: 400}
	.introduce-about-left{ width: 100%; margin-right: 0%; text-align: center}
	.introduce-about-right{ width:100%; float: left}
	.wwdo ul{ margin: 0 auto 10px}
	.wwdo ul li{ margin: 0 0 40px; width: 100%}
	.wwdo-row1{ width:100%}
	.wwdo p{ width: 90%}
	.team-management{ width:94%; float: left; padding: 0 3%; margin-bottom: 30px}
	.team-row2 ul li{ width: 45%; margin-bottom: 30px}
	.team-row2 ul li img{ width: 100%}
	.partnetship-col1{ width: 80%; margin-right:10%; margin-left: 10%; margin-bottom: 30px}
	.partnetship-col2{ width: 80%; margin-left:10%; margin-right:10%}
	.career-list ul li{ width: 80%;  margin: 0 10% 30px; padding: 0}
	.bg-solution{background-position: center -130px}
	#introduce-solution{ min-height: 140px; margin-bottom: 30px;}
	#introduce-solution-img{ height: 250px}
	#introduce-solution-img img{ width: 100%}
	#introduce-ci-img{ width: 100%; height: 330px; margin-left: -120px}
	#introduce-ci-img img{ width: 640px}
	.bg-solution2{ background-position: center -70px}
	.content-img-right img{width: 90%}
	
	.cd-hero__slider {
    height: 365px!important;
  	}
	
	.pdtop80m{ padding-top:80px!important}
	.pdtop80{ padding-top:0px}
	.pdbot60m{ padding-bottom:60px!important}
	.pdtop30-m{ padding-top:80px}
	.pdtop-solution{ padding-top:0px}
	.contact-form{ width:100%; margin-right: 0%; margin-bottom: 60px}
	.contact-address{ width:100%}
	.contact-form h3{ font-weight: 600}
	.footer-row{ margin-bottom: 30px}
	.footer-row1{ width: 100%; margin-right: 0; margin-bottom: 15px}
	.footer-row1 img{ width: 25%}
	.footer-row1 p{ line-height: 21px}
	.footer-row2{ width: 100%; margin-bottom: 15px}
	.footer-row2 ul{ width: 45%; float: left}
	.footer-row2 ul li{ width: 100%; margin: 0 0 8px; float: left}
	.footer-row3{ width: 100%; font-size: 32px}
	.footer-row3 ul{ padding-left: 0}
	.icon-scroll{ display: none}
}
@media screen and (max-width: 480px) {
	h1{font-size: 36px; line-height: 42px}
	#logo{ width:48%; height: 62px}
	#menu{ width:52%}
	#introduce-info{ margin-top: 0px}
	#introduce-info h3{ margin-bottom: 30px}
	#introduce-img{ width: 100%; height: 480px}
	.hm-client-logo img{ width: 110px; margin: 0 0 30px; padding: 0 30px}
	.footer-row1 img{ width: 35%}
	.team-row2 ul li{ width: 100%; margin-bottom: 0; min-height: 500px}
	
	.team-row2 ul li img{ width: 62%}
	.bg-solution{background-position: center -150px}
	#introduce-solution-img{ height: 200px}
	.wwdo ul{width: 90%}
	.wwdo-row2{ height: 130px}
	
	.cd-hero__slider {
    height: 330px!important;
  	}
}
@media screen and (max-width: 480px) {
	.hm-client-logo img{ width: 100px; margin: 0 0 20px; padding: 0 20px}
	.bg-solution{background-position: center -180px}
	#introduce-solution-img{ height: 150px}
}
@media (max-width: 768px) {
  #introduce-download {
    width: 100%; /* Occupy full width */
    float: none; /* Remove float */
    margin: 0 auto; /* Center horizontally */
  }

  .download-container {
    width: 100%; /* Occupy full width */
    margin-top: 100px; /* Adjusted margin top */
  }

  .button-download-app-new {
    margin: 30px auto 20px auto; /* Centering horizontally */
    width: 80%; /* Adjusted width */
  }
}