@media(max-width:1340px){
    h1,h2{
        font-size: 40px;
        line-height: 55.2px;
      }
      h3{
        font-size: 20px;
        line-height: 28px;
      }
      h4{
        font-size: 18px;
        line-height: 26px;
      }

      h5{
        font-size: 18px;
        line-height: 30.4px;
      }

      .page-banner-text{
        font-size: 16px;
        line-height: 26px;
      }
      .page-banner-content{
        width: 400px;
      }
      .home-page-banner .page-banner-image,
      .page-banner-image{
        width: calc(100% - 400px);
      }

      .page-banner-logos a img,
      .footer-apps-list a img{
        max-width: 120px;
      }

      .small-banner{
        justify-content: space-between;
      }

      .word-404{
        padding: 0 70px;
      }
}

@media(max-width:1200px){
    .page-banner-content{
        padding-top: 40px;
        row-gap: 24px;
    }
    .page-banner{
        min-height: unset;
    }

    .app-features-section{
        margin-top: 70px;
    }
    .partners-section{
        margin: 80px 0;
    }

    .ht-center{
        width: 400px;
    }
    .ht-left, .ht-right{
        width: calc((100% - 400px) / 2);
    }
    .helpful-tools-section{
        margin-bottom: 80px;
    }
    .feature-card.feature-image-card img{
        width: 300px;
    }
    .feature-desc-card img{
        max-width: 300px;
    }
    .feature-card{
        height: 460px;
    }

    .breed-detailed-image{
        width: 300px;
    }

    .breed-detailed-information{
        width: calc(100% - 300px);
        padding-left: 20px;
    }
    .blog-main-info-container{
        width: 600px;
    }
    .blog-data{
        width: 700px;
    }
    .blog-step-list {
        width: calc((100% - 700px) / 2);
    }
    .word-404 span{
      font-size: 220px;
      line-height: 280px;
    }
    .word-404 svg{
      width: 370px;
    }
}

@media(max-width:991px){
    .header-navbar{
        display: none;
    }
    .blog-step-list{
        display: none;
    }
    .bloh-inner-section{
        border-top: 1px solid #E7E1D7;
    }
    .header-lang{
        display: none;
    }
    .mobile-menu-opener{
        display: block;
        background-color: transparent;
    }

    .header-logo{
        width: 116px;
    }
    .page-banner{
        display: flex;
        flex-direction: column;
        row-gap: 32px;
    }

    .feature-card.feature-desc-card h3,
    .feature-image-card img,
    .feature-desc-card-text,
    .feature-desc-card img{
        transform: none;
        filter: none;
        opacity: 1;
    }
    .feature-card.feature-image-card img{
        width: 240px;
    }
    .feature-desc-card{
        padding: 32px;
    }
    .feature-card.feature-desc-card h3{
        font-size: 24px;
        line-height: 33.6px;
    }
    .feature-desc-card-text{
        font-size: 16px;
        line-height: 22.4px;
    }
    .feature-desc-card img{
        max-width: 238px;
    }
    .feature-card{
        height: 353px;
    }

    .fgc-container{
        padding-bottom: 40px !important;
    }

    .page-banner-content{
        align-items: center;
        justify-content: center;
        text-align: center;
        padding-bottom: 0;
    }
    .page-banner-content *{
        text-align: center;
    }
    .page-banner{
        padding-left: 32px;
        padding-right: 32px;
    }

    .page-banner-image{
        padding-left: 0 !important;
        width: 100% !important;
        display: flex;
        justify-content: center;
    }

    .breed-detailed-info-container{
        flex-direction: column;
        row-gap: 35px;

    }

    .breed-detailed-image{
        width: 100%;
    }
    .breed-detailed-information{
        padding-left: 0;
        width: 100%;
    }


    .page-banner-content{
        width: 100%;
    }

    .ht-left, .ht-right{
        display: none;
    }
    .ht-center{
        width: 100%;
    }

    .helpful-tools-mobile{
        display: flex;
        align-items: center;
        column-gap: 16px;
        width: 100%;
        overflow-y: auto;
        padding-bottom: 10px;
        margin-top: 16px;
    }

    .wdp-card{
        width: calc(50% - 8px);
    }

    .helpful-tools-mobile .ht-card{
        width: 288px;
        flex: none;
    }

    .footer-top{
        column-gap: 80px;
    }

    .footer-top{
        flex-wrap: wrap;
        row-gap: 40px;
    }
    .why-use-dosty-section{
        margin-bottom: 60px;
    }

    .footer-apps{
        width: 100%;
    }

    .page-banner-image img{
        max-width: 400px;
    }
    .app-feature-card-box{

    }

    .mobile-pattern{
        display: block;
        width: 100%;
        left: 0;
    }

    .pattern1,
    .pattern2,
    .pattern3{
        display: none;
    }
    .breed-search-dropdowns{
      flex-wrap: wrap;
      gap: 10px;
    }
    .calculator-banner .pattern1,
    .calculator-banner .pattern2,
    .calculator-banner .pattern3{
      display: block;
      transition: unset;
    }

    .calculator-banner .pattern2{
      bottom: 0;
      top: unset;
      transform: translate(0) rotate(180deg) scaleX(-1) !important;
    }
    .calculator-container{
      flex-direction: column-reverse;
      row-gap: 56px;
    }

    .calculator-text-side{
      width: 100%;
      padding-right: 0;
    }
    .calculator-text-side h3{
      font-size: 24px;
      line-height: 32px;
      margin-bottom: 20px;
    }
    .calculator-form-side{
      width: 100%;
    }
    .small-banner .page-banner-image{
        transform: translateX(32px);
      }

      .video-banner.page-banner{
        flex-direction: column-reverse;
      }
      .video-banner.page-banner .page-banner-image{
        padding-bottom: 20px;
      }

    .video-banner.page-banner .page-banner-content{
        padding-top: 0;
        z-index: 10;
        padding-bottom: 42px;
    }
    .mobile-pattern{
        z-index: 9;
    }
    .blog-steps-mobile-nav{
        display: block;
    }

    .page-banner.small-banner{
      padding-left: 32px;
    }
    .dog-handler-inner-container{
      display: flex;
      flex-direction: column;
    }

    .dog-handler-inner-left{
      width: 100%;
      margin-bottom: 56px;
    }

    .dh-profile-infos{
      display: flex;
      align-items: flex-start;
    }
    .dog-handler-inner-left{
      padding-left: 0;
      padding-right: 0;
    }
    .handlers-swiper .swiper-wrapper{
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      row-gap: 24px;
    }

    .handlers-swiper .swiper-wrapper .swiper-slide{
      width: calc(50% - 5px);
    }
    .handlers-slide-card h5,
    .handlers-slide-subtitle{
      text-align: center;
      width: 100%;
      display: block;
    }



    .dog-handler-inner-right{
      width: 100%;
      padding-left: 0;
    }

    .dh-text-block h4, .dh-cards-container h4,.handle-details-search-title h4{
      font-size: 32px;
      line-height: 36px;
    }
    .handlers-slider{
      margin-bottom: 80px;
    }
    .handlers-swiper{
      padding-bottom: 0 !important;
    }
    .dh-text-conent,
    .handle-details-seacrh-title-content{
      font-size: 16px;
      line-height: 24px;
    }

    .dh-text-block{
      margin-bottom: 30px;
    }

    .dh-tags{
      padding-right: 0;
      justify-content: flex-start;
    }

    .form-popup{
      width: calc(100% - 40px);
      max-width: 487px;
    }
    .app-dowload-content{
      padding: 0 16px;
    }

    .app-dowload-content{
      font-size: 16px;
      line-height: 19px;
    }
    .dog-handler-inner-container{
      margin-bottom: 80px;
    }
    .dh-cards-container .custom-pagination{
      margin-bottom: 56px;
    }

    .container-404{
      background-color: #F8F9FB;
    }

    .container-404 .pattern1,
    .container-404 .pattern2{
      display: block;
    }

    .body-bg:has(.container-404){
      background-color: #fff;
    }

    .word-404 span{
      font-size: 125px;
      line-height: 147px;
    }
    .word-404 svg{
      width: 170px;
      height: 170px;
    }

    .word-404{
      justify-content: center;
      column-gap: 12px;
      margin-bottom: 44px;
    }

    .container-404{
      min-height: unset;
      height: auto;
    }

    .container-404 .pattern1{
      width: 150px;
    }

    .container-404 .pattern2{
      width: 150px;
      height: 150px;
    }
}

@media(max-width:768px){
    .page-banner-image img{
        max-width: 302px;
        width: 302px;
    }
    .bdi-breed-details-right, .bdi-breed-details-left{
        width: 100%;
    }

    .fgc-container .swiper-slide .col-md-6:has(.feature-image-card){
        order: 1;
    }
    .fgc-container .swiper-slide .col-md-6:has(.feature-desc-card){
        order: 2;
    }

    .text-section-title{
        font-size: 32px;
        line-height: 44px;
    }
    .app_download-section{
        margin-bottom: 32px;
    }
    .text-section-text{
        font-size: 16px;
        line-height: 19.2px;
    }
    .bordered-btn{
        padding: 12px 46px;
        font-size: 18px
    }
    .app-download-container h4{
        font-size: 28px;
        max-width: 100%;
        padding-left: 24px;
        padding-right: 24px;
        line-height: 36.4px;
    }

    .bdi-breed-details{
        flex-direction: column;
        row-gap: 30px;
    }
    .breed-detailed-info,
    .breed-innder-blogs-section{
        margin-bottom: 86px;
    }
    .bdi-title{
        font-size: 32px;
        line-height: 40px;
    }
    .about-the-breed-container h2{
        font-size: 32px;
        line-height: 51.2px;
        text-align: center;
    }
    .page-banner{
        border-radius: 24px;
        position: relative;
    }
    .banner-logos-mobile{
        position: absolute;
        display: flex;
        flex-direction: column;
        width: 100%;
        row-gap: 8px;
        border-radius: 24px;
        bottom: 0;
        left: 0;
        background: rgba( 255, 255, 255, 0.3 );
        box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.37 );
        backdrop-filter: blur( 5px );
        -webkit-backdrop-filter: blur( 5px );
        z-index: 5;
        padding: 31px 0;
        transform: none !important;
        opacity: 1 !important;
    }
    .banner-logos-mobile a img{
        width: 190px;
        max-width: 190px;
    }
    .banner-logos-desktop{
        display: none;
    }
    .page-banner-text{
        font-size: 16px;
        line-height: 28.8px;
    }

    .breed-card a{
        flex-direction: row;
        align-items: center;
        row-gap: unset;
        column-gap: 24px;
        padding: 10px 30px;
    }
    .breed-card a p{
        font-size: 18px;
    }
    .custom-pagination{
        margin-bottom: 80px;
    }
    .breed-card-img{
        flex: none;
        height: 102px;
    }
    .breed-card-img img{
      width: 102px;
      height: 102px;
  }
    .breed-card{
        height: auto;
    }
    .expert-card{
        padding: 24px;
        border-radius: 15px;
    }
    .expert-card-img{
        width: 108px;
        height: 108px;
        margin-bottom: 16px;
    }
    .expert-heading{
        padding-bottom: 16px;
        margin-bottom: 16px;
    }
    .expert-heading h4{
        font-size: 20px;
        line-height: 22px;
    }
    .expert-card-position{
        font-size: 14px;
        line-height: 15.12px;
    }
    .expert-card{
        min-height: unset;
    }
    .experts-section{
        margin-bottom: 32px;
    }
    .expert-content{
        font-size: 14px;
        line-height: 25.2px;
    }
    h1,h2{
        font-size: 32px;
        line-height: 38.4px;
      }
      h3{
        font-size: 20px;
        line-height: 28.4px;
      }
      h4{
        font-size: 18px;
        line-height: 26px;
      }

      h5{
        font-size: 24px;
        line-height: 38.4px;
      }
      .af-icon{
        margin-bottom: 16px;
      }

      .app-features-section{
        margin-top: 86px;
      }
      .section-title h3{
        margin-bottom: 32px;
      }

      .partners-section{
        margin: 86px 0;
      }

      .helpful-tools-section{
        margin-bottom: 86px;
      }

      .wdp-card{
        width: 100%;
        padding: 24px;
      }
      .wdp-card-image{
        margin-bottom: 16px;
        height: auto;
      }
      .footer-block h5{
        font-size: 20px;
        line-height: 24px;
        margin-bottom: 16px;
      }

      .footer-apps-list{
        margin-top: 0;
      }

      .footer-apps-list{
        flex-wrap: wrap;
        row-gap: 16px;
      }

      .footer-apps-list a img{
        width: 190px;
        max-width: unset;
      }
      .footer-bottom{
        padding-bottom: 24px;
      }

      .footer-bottom-links{
        justify-content: center;
      }
      .partners-grid img{
        max-height: 24px;
      }

      .helpful-tools-mobile{
        width: calc(100% + 40px);
        margin-left: -20px;
        padding-left: 20px;
        padding-right: 20px;
      }
      .partners-grid{
        column-gap: 40px;
      }

      .container, .container-fluid, .container-lg, .container-md, .container-sm, .container-xl, .container-xxl{
        padding-right: 20px;
        padding-left: 20px;
      }

      .page-banner{
        padding-left: 12px;
        padding-right: 12px;
      }

      .search-bar{
        padding: 20px;
        margin-bottom: 36px;
      }
      .blog-card{
        padding: 24px;
      }
      .blog-card-image{
        height: auto;
      }
      .blog-card a{
        row-gap: 16px;
      }

      .blog-created-time,
      .blog-author{
        display: none;
      }
      .blog-inner-banner{
        background-image: unset !important;
      }
      .blog-inner-title{
        font-size: 32px;
        line-height: 40px;
        margin-bottom: 30px;
      }
      .blog-step h2{
        font-size: 24px;
        line-height: 30px;
        margin-bottom: 16px;
      }
      .blog-step{
        margin-bottom: 40px;
      }
      .share-buttons a{
        width: 32px;
        height: 32px;
      }
      .share-buttons{
        width: 32px;
      }
      .share-buttons a svg{
        width: 14px;
        height: 14px;
      }
      .blog-step-text{
        font-size: 16px;
        line-height: 20px;
      }
      .blog-inner-banner{
        padding-top: 40px;
      }
      .blog-main-info-container,
      .blog-data {
        width: 100%;
        padding-left: 0;
        padding-right: 0;
    }
    .faq-section-title{
        font-size: 32px;
        line-height: 38.4px;
    }
    .blog-inner-container{
        margin-bottom: 30px;
    }
    .accordion-btn{
        font-size: 20px;
        line-height: 32px;
    }
    .blog-faq-section{
        margin-bottom: 40px;
    }
    .accordion{
        padding: 16px 0;
    }
    .page-banner.small-banner{
      padding-left: 12px;
    }
}

@media(max-width:480px){
    .home-page-banner{
        background-image: url(images/home-banner-mobile-back.svg);
    }
    .page-banner.small-banner{
      padding-left: 12px;
    }
    .page-banner-desktop-image{
        display: none;
      }
      .page-banner-mobile-image{
        display: block;
      }
      .small-banner .page-banner-image{
        transform: none;
      }
      .page-banner-image{
        width: calc(100% + 24px) !important;
        margin-left: -12px;
      }
      .page-banner-mobile-image:not(.home-page-banner .page-banner-mobile-image){
        width: 100% !important;
        max-width: unset !important;
      }

      .blog-main-image,
      .blog-step-img{
        width: calc(100% + 40px);
        margin-left: -20px;
      }

      .video-card{
        width: 100%;
      }

      .word-404 span {
        font-size: 100px;
        line-height: 120px;
    }

    .word-404 svg{
      width: 135px;
      height: 135px;
    }

    .texts-404 h4{
      font-size: 32px;
      line-height: 38px;
      margin-bottom: 16px;
    }
    .text-404-content{
      margin-bottom: 16px;
    }
    .container-404{
      padding: 50px 14px;
      margin-bottom: 86px;
    }
    .breed-search-dropdowns  .custom-dropdown{
      width: 100%;
    }

    .breed-search-dropdowns  .custom-dropdown .cd-open{
      width: 100%;
      justify-content: space-between;
    }
    .cd-drop{
      top: 48px;
    }
}
@media(min-width:991px){
    .handlers-slider{
        width: 100%;
        display: flex;
    }
}

@media(max-width:768px){
  .calculator-page-info-banner{
    padding: 16px;
    border-radius: 10px;
  }
  .calculator-page-info-banner{
    margin: 60px 0;
  }
  .chart-container{
    padding: 8px;
    border-radius: 10px;
  }
  .cpib_btn{
    padding: 14px 20px;
  }
  .cpib-left h3{
    font-size: 22px;
    line-height: 30px;
  }
}

.responsive-content-table{
    overflow-x: auto;
}

.responsive-content-table tr td:first-child{
    position: sticky;
    left: 0;
}