#DBRAutoFocus .header {
  width: 100%; }
  #DBRAutoFocus .header h1 {
    margin: 0 0 23px 0; }
  #DBRAutoFocus .header h1, #DBRAutoFocus .header > p {
    text-align: center; }
  #DBRAutoFocus .header > p {
    font-size: 24px; }
    @media (max-width: 1679px) {
      #DBRAutoFocus .header > p {
        font-size: 20px; } }
    @media (max-width: 991px) {
      #DBRAutoFocus .header > p {
        font-size: 18px; } }
  @media (max-width: 572px) {
    #DBRAutoFocus .header {
      padding: 0 15px; } }
  #DBRAutoFocus .header .adv-setting {
    display: flex;
    justify-content: center;
    align-items: center; }
    @media (max-width: 767px) {
      #DBRAutoFocus .header .adv-setting {
        flex-direction: column-reverse; } }
    #DBRAutoFocus .header .adv-setting .img {
      width: 560px;
      height: 320px;
      background: url(../../images/DBR/features/auto-focus-banner.png) no-repeat center;
      background-size: cover; }
      @media (max-width: 991px) {
        #DBRAutoFocus .header .adv-setting .img {
          width: 400px;
          height: 250px;
          background-position: right bottom; } }
      @media (max-width: 767px) {
        #DBRAutoFocus .header .adv-setting .img {
          height: 300px;
          width: 100%;
          margin: 0; } }
    #DBRAutoFocus .header .adv-setting .label {
      width: 500px;
      margin-left: 220px; }
      @media (max-width: 1679px) {
        #DBRAutoFocus .header .adv-setting .label {
          margin-left: 125px; } }
      @media (max-width: 991px) {
        #DBRAutoFocus .header .adv-setting .label {
          margin-left: 30px; } }
      @media (max-width: 767px) {
        #DBRAutoFocus .header .adv-setting .label {
          width: 100%;
          margin: 0 0 20px 0; } }
      #DBRAutoFocus .header .adv-setting .label h3 {
        margin: 0 0 20px 0; }

#DBRAutoFocus .autoZoom {
  width: 100%;
  background-color: #323234; }
  @media (max-width: 572px) {
    #DBRAutoFocus .autoZoom {
      padding: 0 15px; } }
  #DBRAutoFocus .autoZoom .inner {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 480px;
    width: 100%; }
    @media (max-width: 991px) {
      #DBRAutoFocus .autoZoom .inner {
        height: 350px; } }
    @media (max-width: 767px) {
      #DBRAutoFocus .autoZoom .inner {
        height: auto;
        padding: 40px 0; } }
    #DBRAutoFocus .autoZoom .inner .label {
      color: white;
      width: 475px; }
      #DBRAutoFocus .autoZoom .inner .label h3 {
        color: white;
        margin: 0 0 23px 0; }
    #DBRAutoFocus .autoZoom .inner .imgContainer {
      width: 252px;
      height: 505px;
      padding: 18px 12px 12px 12px;
      border-radius: 22px;
      background-color: #000;
      margin: -220px 0 0 150px; }
      @media (max-width: 991px) {
        #DBRAutoFocus .autoZoom .inner .imgContainer {
          margin: -100px 0 0 40px;
          width: 200px;
          height: 400px; } }
      @media (max-width: 767px) {
        #DBRAutoFocus .autoZoom .inner .imgContainer {
          display: none; } }
      #DBRAutoFocus .autoZoom .inner .imgContainer .img {
        width: 100%;
        height: 100%;
        background: url("https://www.dynamsoft.com/barcode-reader/docs/mobile/programming/assets/auto-zoom.gif") no-repeat center;
        background-size: cover; }

#DBRAutoFocus .features {
  width: 100%;
  background-color: #F5F5F5; }
  #DBRAutoFocus .features .inner {
    height: 560px;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center; }
    @media (max-width: 991px) {
      #DBRAutoFocus .features .inner {
        height: auto;
        padding: 40px 0;
        align-items: flex-start; } }
    @media (max-width: 572px) {
      #DBRAutoFocus .features .inner {
        padding: 40px 15px;
        flex-direction: column; } }
    #DBRAutoFocus .features .inner .feature-item {
      width: 360px; }
      #DBRAutoFocus .features .inner .feature-item:not(:last-child) {
        margin-right: 98px; }
        @media (max-width: 1679px) {
          #DBRAutoFocus .features .inner .feature-item:not(:last-child) {
            margin-right: 80px; } }
        @media (max-width: 991px) {
          #DBRAutoFocus .features .inner .feature-item:not(:last-child) {
            margin-right: 20px; } }
      @media (max-width: 1199px) {
        #DBRAutoFocus .features .inner .feature-item {
          width: 270px; } }
      @media (max-width: 991px) {
        #DBRAutoFocus .features .inner .feature-item {
          width: 220px; } }
      @media (max-width: 572px) {
        #DBRAutoFocus .features .inner .feature-item {
          margin: 0 0 20px 0;
          width: 100%; } }
      #DBRAutoFocus .features .inner .feature-item .imgContainer {
        width: 100%;
        height: 200px;
        margin: 0 0 30px 0; }
        #DBRAutoFocus .features .inner .feature-item .imgContainer img {
          width: 100%;
          height: 100%;
          object-fit: cover; }
      #DBRAutoFocus .features .inner .feature-item h4 {
        margin: 0 0 20px 0; }

#DBRAutoFocus .guide {
  display: flex;
  justify-content: center;
  width: 100%;
  margin-bottom: 120px; }
  @media (max-width: 991px) {
    #DBRAutoFocus .guide {
      margin-bottom: 60px;
      height: auto;
      align-items: flex-start; } }
  @media (max-width: 572px) {
    #DBRAutoFocus .guide {
      padding: 0 15px;
      flex-direction: column; } }
  #DBRAutoFocus .guide .guide-box {
    width: 360px; }
    #DBRAutoFocus .guide .guide-box:not(:last-child) {
      margin-right: 98px; }
      @media (max-width: 1679px) {
        #DBRAutoFocus .guide .guide-box:not(:last-child) {
          margin-right: 80px; } }
      @media (max-width: 991px) {
        #DBRAutoFocus .guide .guide-box:not(:last-child) {
          margin-right: 20px; } }
    @media (max-width: 1199px) {
      #DBRAutoFocus .guide .guide-box {
        width: 270px; } }
    @media (max-width: 991px) {
      #DBRAutoFocus .guide .guide-box {
        width: 220px; } }
    @media (max-width: 572px) {
      #DBRAutoFocus .guide .guide-box {
        margin: 0 0 20px 0;
        width: 100%; } }