@media screen and (min-width: 1700px) {
    .banner-container, .banner-slide img { height: 550px; }
}

@media screen and (max-width: 1340px) {
    .nav-container {
        padding: 0 20px;
    }
}

@media screen and (max-width: 1305px) {
    .menu-item > a {
        font-size: 12px;
        line-height: 16px;
    }

    .menu { gap: 10px; }
}

@media screen and (max-width: 1260px) {
    .prev-prod, .prev-pod, .prev-last-prod, .prev-lost,
    .prev-prod:hover, .prev-pod:hover, .prev-brand, .prev-brand:hover  { left: -10px; }
    .next-prod, .next-pod, .next-last-prod, .next-lost,
    .next-prod:hover, .next-pod:hover, .next-brand, .next-brand:hover { right: -10px; }

    .new-products .product-card,
    .last-products .product-card, .lostfound-swiper .lost-found-item {
        width: 224px;
    }

    .brand-slide { width: 167px !important; }
    .podcast-card { width: 280px !important; }
    .pop-prod-grid {
        grid-template-columns: repeat(4, 224px);
        justify-content: center;
    }

    .prod-description { padding: 30px 20px 35px; }
    .cart-form-actions > .add-to-fave { margin-right: 10px; }
    .add-to-cart1 { width: 160px; }
    .buy { width: 100px; }

    .upload-animal-images {
        flex-direction: column;
        align-items: unset;
    }
}

@media screen and (max-width: 1140px) {
    .menu-item > a {
        font-size: 10px;
        line-height: 13px;
    }

    .locations-preview {
        height: 430px;
    }

    .location-left > img:first-child {
        top: 21px;
        width: 200px;
        left: 50%;
        transform: translateX(-50%);
        object-fit: contain;
    }

    .location-left div {
        left: 40px;
    }

    .location-left a {
        left: 50%;
        transform: translateX(-50%);
    }

    .shop-grid {
        grid-template-columns: repeat(3, 224px);
        justify-content: center;
    }

    .order-next, .order-prev { display: none; }

    .edit-animal-form > div:nth-child(2) { grid-template-columns: repeat(1, 1fr); }
    .edit-image { flex-direction: column; }
    .edit-image > div { width: 100%; }

    .added-animal .animal-card { 
        width: 210px;
        padding: 16px 10px; 
    }
    .animal-notifications,
    .notification-categories, .notification-form { width: calc(100% - 230px); }
    .notification-categories, .notification-form { left: 230px; }
}

@media screen and (max-width: 1023px) {
    .mobile-menu {
        display: flex;
        position: fixed;
        bottom: 0;
        z-index: 1001;
    }
     
    .menu, .utility-bar button:nth-child(3),
    .nav-container {
        display: none !important;
    }

    .wishlist {
        background: var(--tertiary-color) !important;
    }

    .cart {
        background: white !important;
    }

    header .language-change {
        display: flex;
        margin-left: auto;
    }
 
    .prev-banner, .prev-banner:hover { left: 20px; background: var(--primary-color); }
    .next-banner, .next-banner:hover { right: 20px; background: var(--primary-color); }

    .banner-container, .banner-slide, .banner-slide img {
        height: 300px;
    }

    .location-left div > img:first-child, .description-content,
    .cart-form-actions > .add-to-fave, .add-to-cart1 span  {
        display: none;
    }

    .loupe {
        display: none !important;
    }

    .location-left div > img:nth-child(2), .category-swiper-cont,
    .add-to-cart1 svg {
        display: flex;
    }

    .location-left div {
        left: 50%;
        transform: translateX(-50%);
    }

    .location-left p {
        left: 19px;
        top: 14px;
        font-size: 14px;
        line-height: 20px;
    }

    .product-page-container .content {
        flex-direction: column;
        align-items: center;
    }

    .product-images {
        margin: 0
    }

    .prod-description-cont {
        width: 628px;
    }

    .add-to-cart1 {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 50px;
        height: 50px;
    }

    .buy { width: 245px; }

    .product {
        position: relative;
        z-index: 2;
    }

    .product-swiper .add-to-fave {
        display: flex;
        width: 40px;
        height: 40px;
    }

    .mobile-description-content {
        display: flex;
        flex-direction: column;
        gap: 10px;
    } 

    .cart-container, .delivery-container {
        padding-top: 25px;
    }

    .cart-heading {
        margin-bottom: 20px;
    }

    .cart-heading > span:first-child {
        font-size: 16px;
        line-height: 22px;
    }

    .products-in-cart, .personal-info, .delivery-form,
    .pay-content {
        width: 55%;
    }

    .bill-rules {
        width: 42.6%;
    }

    .delivery-heading { display: none; }

    .mobile-delivery-heading { display: flex; }

    .select-new-address {
        padding-left: 0;
    }

    .select-new-address hr {
        margin: 30px 0;
    }
    
    .info-blocks {
        grid-template-columns: 1fr;
        grid-template-rows: repeat(3, 1fr);
        row-gap: 10px;
        margin: 0 0 40px 15px;
    }

    .info-blocks .info-block {
        padding: 23px 35px;
    }

    .info-blocks .info-block > div:first-child {
        left: -15px;
        top: 50%;
        transform: translateY(-50%);
    }

    .blogs-grid { grid-template-columns: repeat(3, 1fr); }
    .blogs { gap: 20px; }
    .current-blog { width: 65%; }
    .other-blogs { width: 32%; }
    .gallery-slide img { height: 250px; }
    .curr-blog-preview { padding: 30px 20px 0; }

    .order-details, .order-card a:last-child span { display: none; }
    .order-swiper-cont { width: 55%; }
    .order-slide { width: 70px !important; height: 70px !important; }
    .order-swiper { height: unset !important; }
    .order-slide img { width: 50px; height: 50px; }

    .order-card { 
        flex-direction: column; 
        align-items: unset; 
        gap: 16px; 
        padding: 16px 20px;
        width: 100%;
    }

    .mob-order-details, .mob-order-details1, .order-card a:last-child i { display: flex; }

    .order-card a:last-child {
        background: var(--primary-color);
        border: none;
        border-radius: 50%;
        font-size: 10px;
        width: 30px;
        height: 30px;
        right: 20px;
    }

    .order-overview { padding: 33px 23px; }

    .wishlist-actions { margin-left: unset; }
    .wishlist-actions button { width: 90px; }
    .wishlist-desc { width: calc(100% - 227px); }
    .add-card-form { padding-left: 0; }

    .form-group1 {
        flex-direction: column;
        margin-bottom: 10px;
    }

    .form-group1 > div { width: 100%; }

    .no-animals {
        margin: 40px 0 0 0;
    }

    .lost-found-grid, .lost-found-filter.found > div {grid-template-columns: repeat(4, 1fr);}
    .lostfound-details .details { grid-template-columns: repeat(1, 1fr); gap: 5px;}
    .lostfound-share {
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
    }

    .lost-found-animal { 
        flex-direction: column;
        align-items: center;
    }

    .lost-inner-heading { margin-bottom: 30px; }

    .lostfound-details { width: 600px; }
    .lostfound-animal-swiper {
        width: 462px;
        height: 462px;
    }

    .location-item { padding: 18px 10px; }
    .location-filter-head, .locations-body { padding: 20px; }
    .location-filter-head { grid-template-columns: repeat(1, 1fr); row-gap: 10px; }
    .location-filter-head > div:last-of-type { grid-column: unset; }
    .location-item p:first-child { 
        font-size: 10px; 
        line-height: 13px; 
        margin-bottom: 2px;
    }

    .edit-animal { flex-direction: column; }
    .edit-animal-form { width: 100%; }

    .added-animal {
        flex-direction: column;
    }

    .added-animal .animal-card {
        width: 280px;
        padding: 16px 20px;
    }

    .animal-notifications {
        background: white;
        border-radius: 10px;
        filter: drop-shadow(0px 3px 5px rgba(0, 0, 0, 0.16));
        padding: 20px 20px 45px;
        width: 100%;
        max-height: 315px;
    }
    .add-notification { background: var(--tertiary-color); }
    .notification-categories, .notification-form {
        left: 0;
        top: 277px;
        width: 100%;
        min-height: 307px;
    }
}

@media screen and (max-width: 990px) {
    .pop-prod-grid { grid-template-columns: repeat(3, 224px); }
    .footer-content { flex-wrap: wrap; }
    footer { padding: 70px 35px 200px !important; }
    .shop-grid { grid-template-columns: repeat(2, 224px); }

    .status-heading { 
        flex-direction: column; 
        gap: 10px;
    }
    .order-status-heading { flex-direction: row; }

    .status-heading #rangeDate, .status-heading .datepicker { width: 350px; }

    .info-blocks1 { 
        grid-template-columns: repeat(1, 1fr); 
        row-gap: 10px;
    }
}

@media screen and (max-width: 900px) {
    .register-bg { height: 550px; }
    .content-decor { padding: 25px 30px; }

    .content-decor img:nth-child(2) {
        width: 250px;
        height: 250px;
    }

    .content-decor p {
        font-size: 25px;
        line-height: 30px;
    }

    .wishlist-item {
        align-items: unset;
        min-height: 195px;
    }

    .wishlist-actions {
        flex-direction: row;
        position: absolute;
        bottom: 20px;
    }

    .wishlist-desc {
        width: calc(100% - 117px);
    }   

    .lost-found-grid { grid-template-columns: repeat(3, 224px); justify-content: center; }
    .lost-found-filter.found > div, .lost-found-filter > div{ grid-template-columns: repeat(3, 1fr); }

    .image-placeholders img {
        width: 75px;
        height: 75px;
    }

    .cart-modal-content .btn-close { display: none }
    .form-fields { flex-direction: column; }
    .form-fields textarea { width: 100%; height: 100px; }
    .choose-time { width: 100%; }
    .date-time, .date-day { width: 130px; }
    .notification-card { padding: 0 10px; gap: 6px; }

    .search-form { height: 250px; }
    .search-form-cont { 
        gap: 40px;
        padding: 0 20px; 
    }
}

@media screen and (max-width: 767px) {
    .prev-banner, .next-banner,
    .location-left a {
        display: none;
    }

    .banner-container, .banner-slide, .banner-slide img {
        height: 200px;
    }

    .locations-preview {
        height: 300px;
    }

    .locations-preview > img:first-child {
        top: 10px;
        width: 150px;
        height: 50px;
    }

    .location-left > img:first-child {
        width: 150px;
    }

    .location-left div {
        bottom: 30px;
    }

    .footer-content {
        flex-direction: column;
        gap: 50px;
    }

    .footer-content > div:first-child .footer-socials {
        display: flex;
    }

    .footer-content > div:first-child .copyright, .application > p:first-of-type,
    .footer-content > div:first-child .creator, .footer-contact .footer-socials,
    .application > div {
        display: none;
    }

    .footer-content > div:first-child { order: 1; }
    .footer-content > ul { order: 2; border-bottom: 1px solid #C1BEB0; padding-bottom: 50px; }
    .application { order: 3; }
    .footer-contact { order: 4; }

    .application hr {
        margin: 50px 0 0;
    }
    
    .footer-contact-items {
        margin-bottom: 0;
    }

    .mobile-applications {
        display: flex;
        flex-direction: column;
        order: 5;
    }

    .mobile-applications > p:first-of-type {
        color: var(--text-color);
        font: 14px 'BPG Mrgvlovani Caps 2010';
        line-height: 19px;
        margin-bottom: 18px;
    }

    .mobile-applications div {
        display: flex;
        gap: 15px;
    }

    .mobile-applications div a {
        display: flex;
        width: 48.5%;
    }

    .mobile-applications div a img {
        width: 100%;
        object-fit: contain;
    }

    .mobile-copyright {
        display: flex;
        flex-direction: column;
        order: 6;
    }

    .register-form, .shop-grid-cont, .lost-found-form {
        width: 100%;
    }

    .register-bg, .shop-filter-container {
        display: none;
    }

    .shop-grid {
        grid-template-columns: repeat(3, 224px);
    }

    .filter-buttons button {
        display: inline;
    }

    .common-container > img:first-of-type,
    .faq-container > img:first-of-type { width: 50px !important; height: 50px !important; left: -25px !important; }
    .common-container > img:nth-of-type(2),
    .faq-container > img:nth-of-type(2) { width: 45px; height: 45px; right: -22px; top: 300px; }
    .common-container > img:nth-of-type(3),
    .faq-container > img:nth-of-type(3) { width: 40px; height: 40px; left: -20px; top: 150px; }
    .common-container > img:nth-of-type(4),
    .faq-container > img:nth-of-type(4) { width: 40px; height: 40px; right: -20px; }

    .content-container > img:first-of-type, .policy-container > img:first-of-type { width: 45px; height: 45px; right: -22px; top: 300px; }
    .content-container > img:nth-of-type(2), .policy-container > img:nth-of-type(2) { width: 40px; height: 40px; left: -20px; top: 150px; }

    .custom-select-head {
        padding: 0 20px;
        height: 50px;
    }

    .custom-select-head i {
        font-size: 12px;
    }

    .check {
        width: 20px;
        height: 20px;
    }

    .category-item label {
        font-size: 14px;
        line-height: 19px;
    }

    .cart-details, .delivery-content {
        flex-direction: column;
    }

    .products-in-cart, .bill-rules, .personal-info,
    .delivery-form, .pay-content, .content-text, .content-decor {
        width: 100%;
    }

    .order-heading2 {
        margin-top: -28px;
    }

    .faq-content, .policy-content {
        flex-direction: column;
        gap: 40px;
    }
    .faq-container .page-title { margin-bottom: 20px; }
    
    .faq-nav {
        background: transparent;
        padding: 0;
        width: 100%;
    }

    .faq-nav a { background: white; height: 50px; }
    .faq-nav a.active { background: var(--primary-color); }
    .faq, .answer, .policy-text { width: 100%; }

    .content-page { flex-direction: column-reverse; gap: 20px; }
    .content-page1 { flex-direction: column; }
    .content-container { padding-top: 25px; }
    .content-container .page-title { display: none; }
    .mobile-content-title { display: flex; justify-content: center; }

    .content-decor {
        position: relative;
        padding: 0;
        height: 180px;
    }

    .content-decor img:first-child {
        position: absolute;
        top: 27px;
        left: 25px;
        width: 75px;
        height: 30px;
    }

    .content-decor img:nth-child(2) {
        position: absolute;
        top: 34px;
        left: 50%;
        transform: translateX(-50%);
        width: 125px;
        height: 125px;
    }

    .content-decor p {
        text-align: left;
        font-size: 19px;
        line-height: 17px;
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        right: 21px;
        max-width: 121px;
    }

    .content-text, .policy-text { padding: 30px 20px 40px; }
    .blogs-grid { grid-template-columns: repeat(2, 1fr); }
    .blogs { flex-direction: column; gap: 50px; }
    .current-blog, .other-blogs { width: 100%; }
    .other-blogs .blog-card { display: none; }
    .other-podcast-swiper {
        display: block !important;
        width: 100% !important;
    }

    .other-podcast-card .type { background: white; }
    .other-podcast-card .pod-title { color: var(--secondary-color); }
    .other-podcast-card .see-all { border-bottom-color: var(--hover-color); color: var(--hover-color); }
    .other-podcast-title{ display: flex; }

    .account-nav { display: none; }
    .account-content { width: 100%; }
    .ordered-items {
        background: transparent;
        padding: 0;
    }

    .order-card {
        background: white;
        border: none;
    }

    .mobile-account-nav { 
        background: transparent;
        display: flex; 
        gap: 5px;
        padding: 0;
        width: 100%;
    }

    .mobile-account-nav a {
        background: rgba(255, 255, 255, 0.76) !important;
        border-radius: 5px;
        height: 50px;
        padding-left: 20px;
    }

    .mob-acc-heading, .mob-acc-heading1 { display: flex; }
    .order-status-heading, .order-overview .info-blocks,
    .info-blocks1 .info-block1:nth-child(3) { display: none; }

    .order-overview {
        background: transparent;
        padding: 0;
    }

    .mob-info-blocks {
        display: grid !important;
        margin: 20px 0 20px 15px; 
    }

    .mob-info-blocks .info-block, .info-block1, .ordered-item,
    .wishlist-item { background: white; }

    .info-blocks1 {
        grid-template-columns: repeat(2, 1fr);
        margin-bottom: 15px;
    }

    .invoice {
        background: white;
        border-radius: 5px;
        align-items: center;
        justify-content: space-between;
        padding: 0 20px;
        height: 40px;
        margin-bottom: 15px;
    }

    .account-form {
        background: none;
        padding: 0;
    }

    .account-form > p:first-child {
        font-size: 12px;
        line-height: 16px;
        -webkit-text-stroke: 0.5px var(--secondary-color);
    }

    .wishlist-items {
        background: transparent;
        padding: 0;
        gap: 10px;
    }

    .address-card {
        background: transparent;
        padding: 0;
    }

    .address-card > p:first-child { display: none; }

    .address-card-item {
        background: white;
        border: none;
    }

    .new-card-btn, .new-address-btn {
        background: #F9F8F7;
        border-radius: 5px;
        width: 100%;
        height: 50px;
    }

    .mob-card-form, .mob-address-form { 
        margin-top: 40px; 
        height: calc(100% - 110px);
        overflow: auto;
    }

    .add-card-form > div:last-child { margin-top: 50px;}
    .add-card-form > div:last-child button {
        width: 100%;
    }

    .btn-message-container {
        display: flex;
        align-items: center;
        flex-direction: column-reverse;
        gap: 35px;
    }

    .no-animals {
        flex-direction: column-reverse;
        gap: 35px;
        margin-top: 10px;
    }

    .add-animal-btn {
        padding: 0 30px;
        width: 100%;
    }

    .add-step {
        position: fixed;
        width: 100vw;
        height: calc(100% - 175px);
    }

    .add-step.active {
        top: 100px;
        left: 0;
        transform: none;
    }

    .step-form {
        border-radius: 0;
        width: 100%;
        height: 100%;
        overflow: auto;
    }

    #close-step {
        top: 30px;
        right: 20px;
    }

    .lost-found-cont { padding-top: 25px; padding-bottom: 70px; }
    .lost-found-filter { display: none; }
    .lost-found-header { flex-direction: column; gap: 10px; margin-bottom: 20px; }
    .lost-found-options, .add-animal-link { width: 100%; }
    .lost-found-status { width: 50%; }

    .mobile-lost-found-head { 
        color: var(--secondary-color);
        display: flex; 
        font: 16px 'BPG Mrgvlovani Caps 2010';
        line-height: 20px;
        margin-bottom: 20px;
    }

    .locations-container {
        background: linear-gradient(to bottom, var(--tertiary-color) 400px, white 400px);
        padding: 35px 0 0 0;
    }

    .locations-container1 {
        background: linear-gradient(to bottom, #FCF5C5 400px, white 400px);
        padding: 35px 0 0 0;
    }

    .locations-container .page-title { 
        font-size: 16px;
        line-height: 22px;
        text-align: center; 
        margin-bottom: 0; 
    }

    .locations-content {
        flex-direction: column;
        gap: 0;
    }
    .location-filter { width: 100%; }
    .map-container {
        width: 100%;
        height: 500px;
    }
    .locations-container1 .locations-body, .locations-body { height: 280px; border-radius: 0; border: none; }
    .location-item { background: #ECECEC; }
    .location-filter select { border: none; }

    .add-animal-container {
        padding-top: 25px;
        padding-bottom: 100px;
    }

    .password-recovery-cont {
        padding-top: 35px;
        padding-bottom: 100px;
    }

    .recovery-form { width: 100%; }
    .recovery-content > img { display: none; }
    .edit-animal-container { background: white; padding-top: 25px; }
    .edit-animal-container .cabinet-title { display: none; }
    .edit-animal .animal-card { 
        border: 1px solid var(--brand-bg-color);
        filter: none;
        width: 100%;
    }

    .edit-animal-form {
        width: 100%;
        filter: none;
        padding: 0;
    }

    .edit-animal-form > div:first-child { display: none; }
    .cart-modal-body {
        align-items: center;
        flex-direction: column;
    }
    .cart-images {
        width: 400px;
    }
    .cabinet-container { padding-top: 25px; }
}

@media screen and (max-width: 743px) {
    .pop-prod-grid, .shop-grid,
    .lost-found-grid  { grid-template-columns: repeat(2, 224px); }
}

@media screen and (max-width: 668px) {
    .prod-description-cont { width: 440px; }
    .product { width: 100%; }
    .product-images { justify-content: center; }
    .product-img-button { width: 100px; height: 100px; }
    .product-img-button img { width: 79px; height: 79px; }
    .product-swiper, .lostfound-animal-swiper { width: 320px; height: 320px; }
    .product-slide img { width: 197px; height: 197px; }

    .reminder {
        padding: 15px 25px 20px;
        width: 353px;
    }

    .reminder > p {
        -webkit-text-stroke-width: 0.3px;
        font-size: 11px;
        line-height: 15px;
        margin-bottom: 15px;
    }

    .reminder-text {
        font-size: 12px;
        line-height: 16px;
        padding: 19px 30px;
        margin-bottom: 15px;
    }

    .reminder-text > div {width: 24px; height: 24px; }
    .reminder-text > div img { width: 12px; height: 16px; }
    .reminder-text p { max-width: 200px; }
    .close-reminder { top: 8px; }
    .reminder a { font-size: 12px; line-height: 16px; }


    .lostfound-img-buttons { gap: 10px; }
    .lostfound-img-button { height: 100px; width: 100px; }
    .lostfound-details { width: 439px; }
    .lost-inner-heading { justify-content: space-between; }
    .lost-inner-heading > span:first-child { display: flex; }
    .lost-inner-heading div { display: none; }
}

@media screen and (max-width: 600px) {
    .blogs-filter {
        flex-direction: column;
        gap: 10px;
        width: 100%;
    }

    .blogs-filter div:first-child {
        display: flex;
        width: 100%;
    }

    .blogs-filter button {
        background: white !important;
        width: 50% !important;
    }

    .blogs-filter1 { 
        flex-direction: column-reverse; 
        align-items: flex-end;
        gap: 20px;
        margin-top: -70px;
    }
    .go-back1 span { display: none; }
    .go-back1:hover { width: 45px; }
    .go-back1:hover div { right: 0; }
    .curr-blog-preview { padding: 25px 20px; width: 55%; }
    .curr-blog-preview p:first-child {
        font-size: 14px;
        line-height: 18px;
        height: 36px;
    }

    .curr-blog-head img { width: 45%; }

    #rangeDate, .datepicker { width: 100%; }
    .blogs-grid { 
        grid-template-columns: repeat(2, 170px);
        justify-content: center;
        column-gap: 14px;
        row-gap: 20px;
    }
    .blog-img-cont { margin-bottom: 10px; }
    .blog-img-cont img { height: 170px; }

    .blog-card .type {
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 10px;
        line-height: 13px;
        padding: 0;
        width: 91px;
        height: 33px;
    }

    .blog-title {
        font-size: 12px;
        line-height: 18px;
        height: 54px;
        margin-bottom: 10px;
    }
}

@media screen and (max-width: 500px) {
    .go-to-shop {
        border-radius: 25px;
        height: 50px;
        width: 100%;
    }

    .mobile-menu > a span {
        font-size: 8px;
        line-height: 10px;
    }

    .banner-container {
        background: var(--brand-bg-color);
        padding: 20px 20px 0;
    }

    .banner-swiper {
        display: none !important;
    }

    .banner-slide {
        width: 330px !important;
    }

    .banner-slide img {
        border-radius: 5px;
        height: 182px;
    }

    .mobile-banner-swiper {
        display: block !important;
    }

    .new-prod-prev, .pop-prod-prev {
        padding-top: 35px;
    }

    .new-prod-prev, .preview-title,
    .pop-prod-prev, .preview-title {
        margin-bottom: 0;
    }

    .new-products, .pop-products, .last-products {
        padding-top: 20px !important;
    }

    .preview-title {
        font-size: 14px;
        line-height: 19px;
    }

    .category-swiper-cont .preview-title {
        margin-bottom: 10px;
    }

    .new-products-cont, .brand-swiper-cont {
        margin-bottom: 30px;
    }

    .banner-nav {
        display: none;
    }

    .new-products .product-card,
    .pop-products .product-card,
    .last-products .product-card  {
        width: 172px;
    }

    .product-details-cont {
        padding: 0;
    }

    .product-card {
        padding: 11px 11px 16px;
    }

    .product-img-cont {
        height: 135px;
    }

    .prod-img {
        width: 117px;
        height: 117px;
    }

    .brand {
        width: 55px;
        height: 24px;
    }

    .product-details > p:first-child {
        font-size: 8px;
        line-height: 10px;
        height: 20px;
        margin-bottom: 8px;
    }

    .price {
        gap: 5px;
    }

    .original, .discount {
        font-size: 11px;
        line-height: 14px;
    }

    .add-to-fave, .product-actions button {
        width: 24px;
        height: 24px;
    }

    .add-to-fave { top: 16px; right: 19px; }
    .add-to-fave svg { width: 10px; }
    .product-swiper .add-to-fave svg { width: 18px }

    .new-prod-prev::before { width: 35px; height: 35px; left: -16px; }
    .new-prod-prev::after { width: 25px; height: 25px; right: -10px; }

    .locations-preview {
        height: 200px;
    }

    .location-left > img:first-child {
        width: 75px;
    } 

    .locations-preview > img:first-child {
        top: 10px;
        width: 91px;
        height: 38px;
    }

    .pop-prod-grid {
        display: none;
    }   

    .pop-products {
        display: block !important;
        width: 100%;
        z-index: 2 !important;
        margin-bottom: 30px !important;
    }

    .pop-prod-prev::before { width: 35px; height: 35px; left: -10px;}    
    .pop-prod-prev::after { width: 50px; height: 50px; right: -20px; bottom: 20px; top: unset;}

    .brand-swiper-heading span, .prod-description > p:first-child {
        font-size: 14px;
        line-height: 19px;
    }

    .brand-swiper-heading a {
        display: none;
    }

    .brand-swiper-prev > .content1 > a {
        background: var(--brand-bg-color);
        display: flex;
    }

    .brand-slide {
        width: 130px !important;
    }

    .brand-slide > div {
        height: 130px;

        a {
            width: 80px;
            height: 80px;
        }
    }

    .podcast-swiper-prev {
        padding-top: 30px;
        padding-bottom: 40px;
    }

    .podcast-swiper-title {
        text-align: left;
    }

    .podcast-card {
        width: 170px !important;
    }

    .podcast-img-cont {
        margin-bottom: 10px;
    }

    .pod-title {
        font-size: 9px;
        line-height: 12px;
        height: 24px;
        margin-bottom: 5px;
    }

    .see-all {
        font-size: 7px;
        line-height: 10px;
        height: 12px;
    }

    .podcast-img-cont img {
        height: 170px;
    }

    .podcast-img-cont .type {
        font-size: 8px;
        line-height: 10px;
        padding: 9px 12px;
    }

    .podcast-swiper {
        z-index: 2 !important;
    }

    .podcast-swiper-prev::before { width: 50px; height: 50px; left: -20px; }
    .podcast-swiper-prev::after { width: 60px; height: 60px; right: -20px; }
    
    .footer-content > ul, .application {
        width: 100%;
    }

    .category-slide {
        width: 90px !important;
        height: 90px !important;
    }
    
    .category-slide img {
        width: 20px;
        height: 20px;
    }
    
    .category-slide span {
        font-size: 10px;
        line-height: 12px;
    }

    .registartion-container {
        padding-top: 34px;
        padding-bottom: 80px;
    }

    .register-form > p:first-child {
        font-size: 16px;
        line-height: 22px;
    }

    .register-form .data-title {
        font-size: 12px;
        line-height: 16px;
    }

    .fullname-register, .name-inputs {
        flex-direction: column;
    }

    .fullname-register > div, .register-btn,
    .name-inputs > div {
        width: 100%;
    }

    .name-inputs {
        gap: 10px;
    }

    .account-login {
        text-align: center;
    }

    .registartion-container::after, .add-animal-container::after { width: 80px; height: 80px; left: -40px; }
    .registartion-container::before, .add-animal-container::before { width: 90px; height: 90px; bottom: 377px; right: -40px; }

    .shop-grid {
        grid-template-columns: repeat(2, 172px);
    }

    .product-img-button { width: 79px; height: 79px; }
    .product-img-button img { width: 52px; height: 52px; }
    .product-swiper { width: 262px; height: 262px; }

    .prod-description-cont, .mobile-filter-btn {
        width: 100%;
    }

    .similar-products {
        padding-bottom: 80px;
    }

    .cart-message {
        left: 50%;
        transform: translateX(-50%);
        right: unset;
        width: unset;
    }

    #close-message {
        top: 13px;
        right: 12px;
    }

    .product-swiper > img:first-child {
        width: 106px;
        height: 46px;
    }

    .cart-summery {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    .product-in-cart {
        align-items: flex-start;
        padding: 15px;
    }

    .img-container1 { border-radius: 0; width: 108px; height: 108px; }
    .img-container1 img:first-child { width: 76px; height: 76px; }
    .img-container1 img:last-child { top: 0; }

    .product-in-cart-desc {
        position: relative;
        width: calc(100% - 128px);
    }

    .product-in-cart-head {
        font-size: 10px;
        line-height: 13px;
    }

    .product-in-cart-head span {
        height: 39px;
    }

    .cart-sum {
        font-size: 14px;
        line-height: 19px;
    }

    .product-in-cart-head button {
        position: absolute;
        bottom: 0;
        right: 5px;
    }

    .delivery-details {
        padding-left: 0;
    }

    .pay-methods > div {
        flex-direction: column;
        gap: 17px;
    }

    .pay-methods button {
        width: 100%;
    }

    .voucher {
        display: flex;
        align-items: center;
    }

    .voucher span:first-of-type {
        display: inline-block;
        max-width: 77px;
        text-align: start;
    }

    .voucher span:last-child {
        margin-left: auto;
    }

    .partial-pay {
        padding-left: 34px;
    }

    .success-content > p:first-child {
        font-size: 20px;
        line-height: 24px;
    }

    .success-content > p:nth-child(2) {
        font-size: 12px;
        line-height: 16px;
    }

    .delivery-message { font-size: 10px; }
    .delivery-message img { width: 87px; height: 36px; }
    .delivery-message p { width: calc(100% - 102px) }

    .faq-container {
        padding-top: 35px;
        padding-bottom: 70px;
    }

    .faq-container .page-title, .password-recovery-cont .page-title { font-size: 16px; line-height: 20px; }
    .question { font-size: 12px; line-height: 16px; }

    .blog-card .see-all {
        font: 12px 'BPG Mrgvlovani';
        line-height: 16px;
        height: 22px;
        padding-bottom: 8px;
    }

    .order-slide { width: 43px !important; height: 43px !important; }
    .order-slide img { width: 30px; height: 30px; }
    .mob-order-details1 span:first-child { font-size: 12px; line-height: 16px; }
    .mob-order-details1 span:last-child, .mob-order-details { font-size: 10px; line-height: 13px; }
    .order-card a:last-child { top: 65px; }
    .mob-order-details1 { right: 60px; }
    .order-card { padding: 20px 20px 20px 15px; }
    .status-btns { display: flex; }

    .status-btns button { 
        width: 50%;
        height: 50px; 
        padding: 0;
    }

    .status-heading #rangeDate, .status-heading .datepicker { width: 100%; }

    .cabinet-title { 
        font-size: 14px; 
        line-height: 19px; 
        margin-bottom: 25px;
    }

    .mob-acc-heading { margin-bottom: 15px; }

    .ordered-item {
        align-items: flex-start;
        margin-bottom: 10px;
    }

    .ordered-item-head {
        flex-direction: column;
        font-size: 10px;
        line-height: 13px;
        gap: 20px;
        margin-bottom: 10px;
    }

    .ordered-item-head span:first-child { height: 26px; }
    .order-summery { flex-direction: row-reverse; }
    .back { background: var(--primary-color); }
    
    .wishlist-item { min-height: 205px; }
    .wishlist-head button {
        position: absolute;
        top: 100px;
        transform: translateY(-50%);
        right: 20px;
    }

    .wishlist-actions button:first-child { width: 40px; }
    .wishlist-actions button:last-child { width: 240px; }
    .wishlist-head span { 
        font-size: 10px;
        line-height: 13px;
        height: 26px;
    }

    .image-placeholder {
        border: 1px solid var(--brand-bg-color);
        border-radius: 10px;
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 170px;
    }

    .delete-button {
        bottom: 20px;
        right: calc(50% - 50px);
    }

    .image-upload-container {
        border: none;
        flex-direction: column;
        align-items: center;
        gap: 55px;
        padding: 0;
    }
    .edit-image { gap: 20px; }

    .custom-image-upload {
        display: flex;
        gap: 45px;
        padding: 0 30px;
    }

    .custom-image-upload p:first-child {
        font-size: 16px;
        line-height: 22px;
    }

    .custom-image-upload p:last-child {
        font-size: 12px;
        line-height: 16px;
    }

    .custom-image-upload svg {
        width: 50px;
        height: 50px;
        margin-bottom: 0;
    }

    .custom-image-upload svg path:first-child { fill: var(--secondary-color); }
    .custom-image-upload svg path:last-child { fill: var(--primary-color); }

    .custom-image-upload div { width: calc(100% - 50px); }

    .premium { left: 15px; top: 125px; }
    .premium img { width: 15px; height: 15px; }
    .premium p { font-size: 6px; }

    .lost-found-grid { 
        grid-template-columns: repeat(2, 170px); 
        column-gap: 13px;
        row-gap: 10px;
    }

    .lost-found-item { padding: 11px 9px 15px; }
    .lost-found-item > img { height: 133px; margin-bottom: 8px; }
    .lost-found-item .title { margin-bottom: 25px; padding-left: 8px; }
    .lost-found-item > div { padding: 0 8px; }
    .lost-found-item > div span { font-size: 7px; line-height: 8px; }
    .lost-found-item > div a { width: 26px; height: 26px; font-size: 10px; }
    .lostfound-swiper .lost-found-item { width: 170px; } 
    .preview-title1 {
        -webkit-text-stroke: 1px var(--secondary-color);
        font-size: 16px;
        line-height: 22px;
    }

    .upload-animal-images { padding: 20px 20px 25px; gap: 25px; margin-bottom: 20px; }
    .upload-animal-images .custom-image-upload { padding: 0; justify-content: center; }
    .upload-animal-images .custom-image-upload div { max-width: 190px; }
    .image-placeholders {  justify-content: center; gap: 10px; }

    .image-placeholders .delete-button {
        bottom: -14px;
        right: unset;
        top: unset;
        left: 50%;
        transform: translateX(-50%);
    }

    .edit-animal .custom-image-upload {  padding: 0; }
    .edit-animal .custom-image-upload div { max-width: unset; }

    .open-notification-list, .close-notification-list { display: flex; }
    .added-animals { gap: 40px; }
    .added-animal { align-items: center; }
    .animal-notifications { 
        max-height: 0;
        position: relative;
        padding: 0 15px;
        flex-wrap: nowrap;
        overflow: hidden;
        transition: all 0.3s ease;
    }

    .animal-notifications.active { overflow: unset; max-height: 1000px; }

    .notification-card { width: 100%; }
    .animal-notifications .notification-card:first-of-type { margin-top: 20px; }
    .animal-notifications .notification-card:nth-last-child(3) { margin-bottom: 45px; }

    .add-notification {
        position: absolute;
        margin: 0;
        bottom: -20px;
        left: 50%;
        transform: translateX(-50%);
    }
    .added-animal .animal-card { width: 100%; }
    .breed-age-info { flex-direction: row; }
    .breed-age-info div { padding: 10px 14px; }
    .breed-age-info div:first-child { width: 65%; }
    .breed-age-info div:last-child { width: 35%; }
    .animal-actions div:first-child { background: var(--primary-color); }
    .animal-actions div:first-child svg { fill: var(--secondary-color); }

    .notification-categories.active, .notification-form.active {
        border-radius: 0;
        padding: 30px 20px 60px;
        position: fixed;
        left: 0;
        bottom: 0;
        height: calc(100% - 100px);
        width: 100vw;
        top: 100px;
        transition: all 0.3s ease;
        z-index: 1001 !important;
        min-height: unset;
    }

    .form-fields {
        flex-direction: column-reverse;
        justify-content: flex-end;
        align-items: unset;
        height: 100%;
        overflow: auto;
    }

    .choose-category { grid-template-columns: repeat(1, 1fr); }
    .notification-categories-heading { padding: 0 17px; }
    .notification-categories-heading div {
        background: transparent;
        font-size: 15px;
        width: unset;
        height: unset;
    }

    .notification-categories hr, .notification-form-head hr { 
        border-color: var(--brand-bg-color);
        display: flex;
        margin: 0 -20px 30px; 
        opacity: 1;
    }

    .notification-form-head {  
        flex-direction: column-reverse; 
        gap: 0; 
        margin-bottom: 20px;
    }
    .notification-form-head hr { order: 2; width: 100vw; }

    .status-input-cont { 
        flex-direction: column;
        gap: 10px;
        order: 1;
        width: 100%; 
    }
    .status-other-name { width: 100%; height: 50px; }

    .mobile-form-title { 
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 0 17px 25px;
        width: 100%;
        order: 3;
    }
    .mobile-form-title span { display: flex; }

    .status-actions div:first-child { display: none !important; }
    .status-actions .close-form { background: var(--primary-color); color: var(--secondary-color); } 

    .status {
        border-radius: 10px;
        padding-left: 20px;
        width: 100%;
        height: 50px;
    }
    .status div { background: white !important; }
    .status.vaccination { background: var(--tertiary-color); }
    .status.other { background: var(--brand-blue); }
    .status.other .status-other-name { display: flex; }
    .status.grooming { background: var(--primary-color); }
    .status.parasites { background: var(--hover-color); }
    .status.parasites span { color: white; -webkit-text-stroke-color: white; }

    .choose-time > div {
        gap: 44px;
    }

    .choose-time > p:first-child { 
        font-size: 14px; 
        line-height: 19px; 
        margin-bottom: 25px;
    }

    .choose-time > div span {
        font-size: 14px;
        line-height: 19px;
        min-width: 90px;
    }

    .date-day, .date-time, .choose-time select {
        height: 50px;
    }
    .choose-time select { font-size: 12px; line-height: 16px; }
    .date-day { width: 135px; margin: 0;}
    .date-time { width: 76px; }
    .form-fields textarea { min-height: 150px; margin-bottom: 20px;}
    .choose-time .submit-btn { display: none; }

    .mobile-delete-submit {
        display: flex;
    }
}

@media screen and (max-width: 450px) {
    .added-preview, .delivery-offer1, .curr-blog-preview {
        width: 100%;
    }

    .added-preview {
        padding: 28px 13px 25px 24px;
    }

    .cart-message {
        left: 20px;
        right: 20px;
        transform: unset;
    }

    .delivery-offer1 {
        padding: 0 28px;
    }

    .delivery-offer1 p {
        max-width: calc(100% - 42px);
    }

    .order-heading2 {
        display: flex;
        flex-direction: column;
        margin-top: -24px;
    }

    .content-decor img:nth-child(2) { left: 73px; transform: none; }
    .content-bg1 img:first-child { left: 50%; transform: translateX(-50%);}
    .content-bg1 img:nth-child(2) { left: 30px; top: 30px; }
    .content-bg1 p { bottom: 40px; top: unset; transform: none; }

    .policy-container, .blog-container { padding-top: 35px; }
    .policy-container .page-title, 
    .blog-container .page-title { font-size: 16px; line-height: 20px; }

    .curr-blog-head {
        flex-direction: column;
        gap: 10px;
    }

    .curr-blog-head img {
        border-radius: 5px;
        width: 100%;
        height: 353px;
    }

    .blogs-filter1 { margin-top: -63px; }
    .curr-blog-head { margin-bottom: 10px; }
    .blog-info {
        padding: 20px;
        font-size: 12px;
    }
    
    .blog-info * { font-size: 12px !important; }
    .gallery-slide { width: 170px !important; }
    .gallery-slide img {
        width: 170px;
        height: 170px;
    }

    .blog-video iframe { height: 200px; }
    .go-back2:hover span { display: none; }

    .step-form { padding: 25px 20px 30px; }
    .animal-types { padding: 25px; }

    .reminder { width: 320px; padding: 20px 15px; }
    .reminder a { width: 100%; }
    .reminder-text p { max-width: 175px; }
    .reminder.active { top: 280px; }

    .lostfound-images, .lostfound-img-buttons { gap: 12px; }
    .lostfound-img-button { width: 79px; height: 79px; }
    .lostfound-animal-swiper { width: calc(100vw - 131px); height: 262px; }
    .lostfound-details .details span:first-child { min-width: 100px; }
    .lostfound-details {
        background: transparent; 
        border-radius: 0;
        width: 100%;
        padding: 0;
    }

    .lostfound-details .name {
        background: white;
        border-radius: 5px 5px 0 0;
        flex-direction: column-reverse;
        align-items: flex-start;
        padding: 20px;
        margin-bottom: 0;
    }

    .lostfound-details .name > span:first-child {
        color: var(--text-color);
        -webkit-text-stroke: 1px var(--text-color);
    }

    .lostfound-details .name div { 
        flex-direction: row; 
        gap: 10px;
        margin-bottom: 15px;
    }

    .lostfound-details .details {
        background: white;
        border-radius: 0 0 5px 5px;
        padding: 0 20px 20px;
        margin-bottom: 10px;
    }

    .lostfound-details .description {
        background: white;
        border-radius: 5px;
        padding: 20px;
    }

    .lostfound-share { align-items: center; }
    .lost-found-form > p:first-child {
        font-size: 16px;
        line-height: 22px;
        margin-bottom: 20px;
    }
    .lost-found-form > .form-floating { margin-bottom: 10px; }
    .lost-found-form textarea { margin-bottom: 20px; }
    .image-placeholders > div { width: 25%; }
    .image-placeholders img { width: 100%; height: 63px; }
    .cart-modal-body { padding: 20px !important;}
    .cart-images { width: 100%; }
}

@media screen and (max-width: 392px) {
    .brand-swiper-heading span {
        font-size: 12px;
        line-height: 16px;
    }

    .mobile-grandchildren > a {
        width: 100%;
    }
}

@media screen and (max-width: 380px) {
    .shop-grid, .lost-found-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .product-slide img { width: 150px; height: 150px } 
    .buy { width: calc(100% - 60px); }

    .img-container1 { width: 90px; height: 90px; }
    .img-container1 img:first-child { width: 54px; height: 54px; }
    .product-in-cart-desc { width: calc(100% - 110px); }

    .delivery-method label {
        max-width: 250px;
    }

    .content-decor img:nth-child(2) { width: 100px; height: 100px; top: 50px; }
    .blogs-grid { grid-template-columns: repeat(2, 1fr); }
    .blog-img-cont img { height: 150px; }
    .curr-blog-head img { height: 320px; }

    .ordered-item .img-container1, .wishlist-item .img-container1 { border-radius: 0; width: 108px; height: 108px; }
    .ordered-item .img-container1 img:first-child, 
    .wishlist-item .img-container1 img:first-child { width: 76px; height: 76px; }
    .ordered-item .img-container1 img:last-child, .wishlist-item .img-container1 img:last-child { top: 0; }
    
    .mob-info-blocks .info-block { padding-right: 10px; }
    .wishlist-actions button:last-child { width: 200px; }
    .custom-image-upload { padding: 0; }

    .recovery-content .data-title { font-size: 10px; line-height: 13px; }
}