@media screen and (max-width: 1199px) {
  header .navbar .navbar-collapse .navbar-nav .nav-item .nav-link { font-size: 15px; padding-right: 7px; padding-left: 7px;}
  header .navbar .navbar-collapse .navbar-nav .member-link { padding: 0 15px; font-size: 15px;}
  h1 { font-size: 40px; line-height: 40px;}
  .feature-section .fs-box { height: auto;}
  .feature-banner .fb-txt h4 { font-size: 40px;}
  .feature-banner .fb-txt h4 strong { font-size: 50px;}
  h2 { font-size: 40px;}
  .app-promotion-section .app-download-btn a { margin-right: 10px;}
  .feature-section .fs-box { max-width: 170px; height: 130px; padding: 10px;}
  .feature-section .col-md-7 .fs-box { min-height: 130px;}
  .feature-section .fs-box::before { opacity: 0.2;}
}
@media screen and (max-width: 991px) {
  h1 { font-size: 30px; line-height: 40px; margin-top: 40px !important; margin-bottom: 20px !important;}
  .style-01 { font-size: 16px; line-height: 25px;}
  .watch-banner { background-position: -430px 0;}
  .watch-banner .why-vital .why-heading strong { font-size: 50px;}
  .watch-banner .why-vital ul li { font-size: 16px; margin: 22px 0;}
  .feature-banner .fb-txt { top: 20px; left: 20px; right: 20px;}
  .feature-banner .fb-txt h4 { font-size: 30px;}
  .feature-banner .fb-txt h4 strong { font-size: 40px;}
  .feature-section .fs-box { max-width: 170px; height: 130px;}
  .display-section .fs-box .feature-img-right::before, .display-section .fs-box .feature-img-right::after, .display-section .fs-box .feature-img-left::before, .display-section .fs-box .feature-img-left::after { display: none;}
  h3 { font-size: 22px; line-height: 30px; margin-bottom: 10px !important; margin-top: 22px;}
  .style-02, .how-work-box .how-txt p { font-size: 14px; line-height: 22px;}
  h2 { font-size: 30px;}
  .blog-box .bb-txt { font-size: 15px;}
  .app-promotion-section .app-download-btn { margin-top: 0;}
  .app-promotion-section .app-download-btn a img { height: 35px;}
  .header--clone .navbar-brand img { height: 40px;}
  header .navbar .navbar-collapse .navbar-nav .nav-item .nav-link { padding: 4px 7px;}
  header .navbar .navbar-collapse .navbar-nav .member-link { text-align: center;}
  header .navbar .navbar-collapse .navbar-nav .member-link a { padding: 5px 0;}
  .page-heading h1 { padding: 20px 0 90px;}
}
@media screen and (max-width: 767px) {
  .banner { text-align: center;}
  header { padding: 10px 0;}
  .banner .style-01 { margin-bottom: 30px;}
  .watch-banner { background-position: -830px 0;}
  .watch-banner .why-vital .why-heading strong { font-size: 40px;}
  .how-work { padding-top: 40px;}
  .how-work .mt-150 { margin-top: 0 !important;}
  .how-work .how-work-box { margin-bottom: 30px;}
  .feature-banner { max-width: none; height: 380px; margin-bottom: 30px; overflow: hidden;}
  .feature-banner img { height: 100%; object-fit: cover; object-position: center 30%;}
  .feature-section .col-md-7 > .row { margin-left: -8px; margin-right: -8px;}
  .feature-section .col-md-7 > .row > div { padding-left: 8px; padding-right: 8px;}
  .feature-section .fs-box { max-width: none; margin: 0 0 16px;}
  .product-section { padding: 100px 0 80px;}
  .specification-section { padding-bottom: 60px;}
  .specification-section ul li { display: block; padding: 15px 0; text-align: center;}
  .specification-section ul li span { width: 100%; display: block; margin-bottom: 10px;}
  .specification-section ul li p { width: 100%;}
  .app-promotion-section { padding-top: 40px;}
  h2 { font-size: 22px;}
  .app-promotion-section .mb-60 { margin-bottom: 20px;}
  .app-promotion-section .app-row { text-align: center;}
  .app-promotion-section .img-670 { margin-bottom: 30px;}
  .app-promotion-section .app-download-btn a { margin: 0 5px 10px; display: inline-block;}
  /* .page-heading h1 { font-size: 30px;} */
  .blog-listing-section { padding: 40px 0 40px;}
  .blog-banner-img { margin-bottom: 40px;}
  .blog-banner-txt { padding-bottom: 20px;}
  .blog-detail-section { padding: 20px 0 30px;}
  .blog-detail-section blockquote { line-height: 20px; font-size: 16px; font-weight: 500;}
  .member-pop .modal-body { padding: 0 30px;}
  .use-section .us-left::before { width: calc(50% + 30px); left: -130px;}
  .use-section .us-right::before { width: calc(50% + 30px); right: -130px;}
  .use-section .us-left, .use-section .us-right { padding-top: 140px; text-align: center;}
  .use-section .us-left .usl-mobile { margin: 0 auto 30px;}
  .use-section .us-right .usl-mobile { margin: 30px auto 0px;}
  .pr-100 { padding-right: 0px;}
  .pl-100 { padding-left: 0px;}
  .use-section { padding: 20px 0 30px;}
  .pt-80 { padding-top: 0px;}
  .mb-80 { margin-bottom: 30px;}
  .feature-section .fs-box strong {line-height: 15px; font-size: 13px;}
}
@media screen and (max-width: 575px) {
  .blog-detail-section blockquote { padding-left: 60px;}
  .blog-detail-section blockquote::after { left: 45px;}
  .blog-detail-section blockquote::before { left: 5px; font-size: 30px;}
  .member-pop .modal-body { padding: 0 20px;}
  .use-section .us-left .left-step-no, .use-section .us-right .right-step-no { font-size: 24px; padding: 10px 20px;}
  .contact-info-box { padding: 20px 10px; margin-bottom: 20px;}
  .contact-info-box .cib-icon { width: 40px; height: 40px; font-size: 20px; line-height: 40px;}
  .style-03 { font-size: 16px;}
  .contact-social-box { padding: 20px 10px; margin-bottom: 20px;}
  .contact-form { padding: 5px 15px 0px;}
  .contact-form .form-row input[type="text"] { padding: 20px 15px;}
  .contact-form .form-row { margin-bottom: 10px;}
  .feature-section .fs-box { height: 120px;}
  .feature-section .col-md-7 .fs-box { min-height: 120px;}
}

/* Section spacing: tablet */
@media screen and (min-width: 768px) and (max-width: 991px) {
  .display-section { padding-bottom: 60px;}
  .display-section .fs-box { padding-bottom: 80px;}
  .product-section { padding: 110px 0 70px;}
  .feature-section { padding: 130px 0 80px;}
  .specification-section { padding-bottom: 60px;}
  .app-promotion-section { padding-top: 40px;}
}

/* Section spacing: mobile */
@media screen and (max-width: 767px) {
  .how-work { padding-top: 30px;}
  .display-section { padding-top: 50px; padding-bottom: 20px;}
  .display-section .fs-box { padding-bottom: 0px;}
  .product-section { padding: 70px 0 50px;}
  .feature-section { padding: 60px 0 60px;}
  .specification-section { padding-bottom: 30px;}
  .app-promotion-section { padding-top: 30px;}
}

/* Features banner: wider phones scale the image more, move focus down to keep the watch in view */
@media screen and (min-width: 576px) and (max-width: 767px) {
  .feature-banner img { object-position: center 43%;}
}

/* Image-text blocks on mobile: image above its text, divider between blocks */
@media screen and (max-width: 767px) {
  .display-section .fs-box + .fs-box { margin-top: 40px; padding-top: 40px; border-top: 1px solid #e3e8ef;}
  .display-section .fs-box .feature-img-left,
  .display-section .fs-box .feature-img-right { margin-bottom: 4px;}
}