@media screen and (max-width: 600px) {
  * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
  }
  :root {
    /* COLORS */
    --pink-dark: rgba(129, 18, 77, 1) 0%;
    --pink-normal: rgba(215, 41, 124, 1) 34.55%;
    --pink-light: rgba(243, 111, 175, 1) 70.61%;
    --pink-lighter: rgba(249, 137, 189, 1) 100%;
    --color-white: #fff;
    --color-black: #000;
    --blue-dark: rgba(8, 33, 134, 1) 70%;
    --blue-normal: #082186;
    --blue-light: #5461ad;
    --blue-translucent: #0821861e;
    --color-pink: #81124d;

    /* FONTS */
    --font-regular: "avenir_next_lt_proregular";
    --font-bold: "avenir_next_lt_probold";
  }
  html,
  body {
    overscroll-behavior: unset;
  }

  body {
    margin: 0;
  }
  .mobile_layout {
    display: block;
    min-width: 300px;
  }
  .desktop_layout {
    display: none;
  }

  .background {
    background: linear-gradient(
      45deg,
      rgba(129, 18, 77, 1) 0%,
      rgba(215, 41, 124, 1) 34.55%,
      rgba(243, 111, 175, 1) 70.61%,
      rgba(249, 137, 189, 1) 100%
    );
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: -1;
    border: none;
    margin: 0;
    left: 0;
    top: 0;
    display: block;
  }
  .container_mobile .adv_all {
    position: relative;
    display: block;
    width: 100%;
    left: 0;
    top: 0;
    color: var(--color-black);
    text-align: center;
  }
  /* .logo_mobile {
    box-sizing: border-box;
    background: linear-gradient(
      0deg,
      rgba(84, 98, 173, 1) 22%,
      rgba(8, 33, 134, 1) 70%
    );
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    margin: 0;
    display: block;
    padding: 15px;
    -webkit-box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.5);
    z-index: 99;
  } */
  .logo_mobile img {
    width: 42px;
    position: relative;
    vertical-align: middle;
  }
  .logo_mobile .container_logo {
    display: inline-block;
    vertical-align: middle;
  }
  .logo_mobile .container_logo img {
    width: 160px;
  }
  .subtitle_mobile {
    color: var(--color-white);
    font-size: 12px;
    letter-spacing: 5px;
    font-family: var(--font-regular);
    font-weight: 100;
  }
  .toggle {
    position: absolute;
    width: 30px;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
  }
  .toggle span {
    display: block;
    width: 100%;
    height: 2px;
    border-radius: 3px;
    background: var(--color-white);
    margin: 8px 0;
  }
  .container_mobile.superiore {
    position: relative;
    top: 100px;
    z-index: 3;
  }
  .adv_city_mobile .list a img {
    width: 100%;
  }
  .adv_city_mobile .list {
    text-align: center;
    padding-block: 5px 10px;
    margin-bottom: 10px;
    background-color: rgba(255, 255, 255, 0.3);
  }
  .adv_city_mobile .list a {
    text-decoration: none;
    transition: 0.5s all;
  }
  .adv_city_mobile .list a:hover {
    opacity: 0.5;
  }
  .adv_city_mobile .list h3.title {
    color: var(--color-black);
    font-family: var(--font-bold);
    font-weight: 100;
    letter-spacing: 3px;
    margin: 5px 0;
  }
  .adv_city_mobile .list .categories a {
    font-family: var(--font-regular);
    border-left: solid 1px var(--color-black);
    padding: 0 2%;
    color: inherit;
  }
  .adv_city_mobile .list .categories a:first-child {
    border: none;
  }
  .adv_city_mobile .list .categories {
    margin: 0;
  }
  .adv_city_mobile {
    position: relative;
    margin-top: 49px;
  }
  .adv_all > .title > a {
    font-family: var(--font-bold);
    font-weight: 100;
    font-size: 18px;
    letter-spacing: 3px;
    color: inherit;
    text-decoration: none;
  }
  .adv_all > .categories a {
    font-family: var(--font-regular);
    color: inherit;
    text-decoration: none;
  }
  .adv_all h2.title {
    margin: 5px 0;
  }

  .logo_mobile {
    box-sizing: border-box;
    background: linear-gradient(
      0deg,
      rgba(84, 98, 173, 1) 22%,
      rgba(8, 33, 134, 1) 70%
    );
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    margin: 0;
    display: block;
    padding: 15px;
    height: 81px;
    -webkit-box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.5);
    z-index: 99999;
  }
  .logo_mobile img {
    width: 42px;
    position: relative;
    vertical-align: middle;
  }
  .logo_mobile .container_logo img {
    width: 160px;
  }

  .logo_mobile .container_logo {
    display: inline-block;
    vertical-align: middle;
  }

  .subtitle_mobile {
    color: var(--color-white);
    font-size: 12px;
    letter-spacing: 5px;
    font-family: var(--font-regular);
    font-weight: 100;
  }
  .container_mobile.superiore {
    position: relative;
    top: 19px;
    z-index: 3;
  }
  .toggle {
    position: absolute;
    width: 30px;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
  }
  .toggle span {
    display: block;
    width: 100%;
    height: 2px;
    border-radius: 3px;
    background: var(--color-white);
    margin: 8px 0;
  }
  nav {
    color: var(--color-white);
    position: fixed;
    z-index: 999;
    width: 100%;
    height: calc(100dvh - 81px);
    top: 81px;
    background: #3e51a3;
    transform: translateX(100%);
    transition: transform 0.5s ease;
    background: linear-gradient(
      0deg,
      rgba(84, 98, 173, 1) 22%,
      rgba(8, 33, 134, 1) 70%
    );
  }
  .nav_page_1 {
    height: 100%;
    position: relative;
    display: flex;
    flex-direction: column;
  }

  nav.open {
    transform: translateX(0);
  }
  .nav_content {
    margin-bottom: auto;
    padding: 10px 30px 20px 30px;
  }
  .nav_page_1 .region {
    position: relative;
    cursor: pointer;
  }

  .nav_page_1 .region svg {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
    transition: transform 0.3s cubic-bezier(0, 1, 0, 1);
    transform: rotate(90deg);
  }
  .nav_page_1 .region h3 {
    padding: 5px 0;
    margin: 5px 0;
  }

  .nav_page_1 .nav_content {
    max-height: calc(100% - 64.5px);
    overflow-y: auto;
    overflow-x: hidden;
  }

  .nav_page_1 .nav_footer {
    border-top: 0.01px solid rgba(255, 255, 255, 0.3);
    padding: 15px 25px;
    font-family: var(--font-regular);
    text-align: center;
    background: rgba(10, 10, 255, 0.1);
  }

  .nav_page_1 .nav_footer h3 {
    font-family: var(--font-bold);
    font-size: 15px;
    margin-bottom: 10px;
  }
  .nav_page_1 .nav_footer p,
  .nav_page_1 .nav_footer span {
    font-size: 12px;
    margin-bottom: 5px;
  }

  .nav_page_1 .nav_footer span {
    padding: 0 10px;
    display: block;
  }
  .nav_page_1 .nav_footer span a {
    text-decoration: none;
    color: var(--color-white);
  }
  .nav_page_1 .nav_footer span:last-child {
    border: none;
  }
  .nav_page_1 .nav_content .accordion_region h3 {
    font-family: var(--font-regular);
    font-size: 16px;
  }

  .nav_page_1 .nav_content .accordion_region.active > .city {
    max-height: 500px;
    transition: max-height 1s ease;
  }

  .nav_page_1 .nav_content .accordion_region.active .region svg {
    transform: rotate(-90deg);
  }

  .nav_page_1 .nav_content .accordion_region > .city {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.5s cubic-bezier(0, 1, 0, 1);
    background-color: transparent;
  }

  .accordion_region {
    border-bottom: 0.01px solid rgba(255, 255, 255, 0.3);
  }

  .nav_page_1 .nav_content .accordion_region > .city ul > li {
    padding-block: 10px 10px;
    padding-left: 30px;
  }
  .nav_page_1 .nav_content .accordion_region > .city ul > li > a {
    font-family: var(--font-regular);
    font-size: 14px;
    cursor: pointer;
    text-decoration: none;
    color: var(--color-white);
    transition: 0.5s all;
  }
  .nav_page_1 .nav_content .accordion_region > .city ul > li > a:hover {
    opacity: 0.5;
  }
  .nav_page_1 .nav_content .accordion_region > .city ul > li:last-child {
    border: none;
  }

  .toggle span {
    transition: transform 0.3s ease;
  }

  .toggle.active span:nth-child(2) {
    display: none;
  }

  .toggle.active span:first-child {
    transform: rotate(45deg) translateY(5px) translateX(2px);
  }

  .toggle.active span:last-child {
    transform: rotate(-45deg) translateY(-5px) translateX(2px);
  }
  .showNav,
  .showNav * {
    font-family: var(--font-bold);
    cursor: pointer;
  }
  .scroll_container {
    height: calc(100% - 81px);
    bottom: 0;
    position: fixed;
    left: 0;
    width: 100%;
    overflow-y: scroll;
  }
  .adv_all > .title > a,
  .adv_all > .categories a {
    transition: opacity 0.5s;
  }
  .adv_all > .title > a:hover,
  .adv_all > .categories a:hover {
    color: rgba(0, 0, 0, 0.5);
  }
  .adv_city .line > .tile > a {
    transition: opacity 0.5s;
  }
  .adv_city .line > .tile > a:hover {
    opacity: 0.5;
  }

  /* ----comparativa css---- */
  .filters_mobile {
    background-color: #e4e4e4;
    color: var(--color-black);
    display: flex;
    justify-content: space-between;
    padding: 6px;
    position: fixed;
    width: 100%;
    top: 81px;
    left: 0;
    transition: transform 0.3s ease;
    /* backdrop-filter: blur(19px) saturate(1); */
    -webkit-box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.5);
    z-index: 9;
  }

  .filters_mobile > div {
    margin: 0px 2px;
    /* display: inline-block; */
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30%;
    text-align: center;
    padding: 5px;
    cursor: pointer;
    border-radius: 8px;
    /* border: 0.1px solid rgb(90, 90, 90); */
    /* box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.6);
    transition: box-shadow 0.3s ease; */
    user-select: none;
    font-family: var(--font-regular);
    font-size: 14px;
  }

  .filters_mobile > div:nth-child(n + 3) {
    width: 20%;
  }

  .filter.toggle_view,
  .filters_mobile > div:active {
    transition: background 0.2s ease, box-shadow 0.3s ease;
    font-size: calc(100% - 15%);
  }

  .filter.toggle_preferiti a {
    display: block;
    width: 100%;
    height: 100%;
  }

  .filters_mobile > div:active {
    box-shadow: inset 0px 2px 3px rgba(0, 0, 0, 0.6);
  }

  .filter.active,
  .filter.active path {
    background-color: var(--color-pink);
    color: var(--color-white);
    box-shadow: inset 0px 2px 3px rgba(0, 0, 0, 0.6);
    fill: var(--color-white);
  }

  .container_mobile_content {
    position: relative;
    top: 120px;
  }

  ::-webkit-scrollbar {
    width: unset;
  }

  ::-webkit-scrollbar-thumb {
    background-color: unset;
    border: unset;
    border-radius: unset;
  }

  ::-webkit-scrollbar-track {
    background-color: unset;
  }

  .tile_mobile,
  .grid_mobile {
    position: relative;
    margin: 7px;
  }

  .container_mobile_inserzioni {
    position: relative;
    height: 100%;
  }

  .mobile_inserzione {
    position: relative;
    height: 100%;
    width: 100%;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 10px;
    transition: filter 0.3s ease;
  }

  .mobile_inserzione:active {
    filter: brightness(0.9);
  }
  .mobile_inserzione .inserzione_name {
    font-family: var(--font-regular);
    font-size: 22px;
    font-weight: 600;
  }

  .mobile_inserzione .inserzione_city,
  .mobile_inserzione .inserzione_age,
  .mobile_inserzione .inserzione_cat {
    font-family: var(--font-regular);
  }

  .mobile_inserzione .inserzione_age,
  .mobile_inserzione .inserzione_city,
  .mobile_inserzione .inserzione_cat {
    opacity: 0.8;
  }
  /* BEGIN MODIFICHE ALBE */
  /*.favorites_toggle {
    position: absolute;
    bottom: 6px;
    left: 50%;
    transform: translateX(-50%);
  }*/
  .mobile_inserzione .favorites-btn {
    position: absolute;
    bottom: 6px;
    left: 50%;
    transform: translateX(-50%);
  }
  .mobile_inserzione .favorites-btn.active {
    background-color: transparent;
  }
  .mobile_inserzione .favorites-btn .heartEmpty {
    width: 70px;
    height: 70px;
  }
  .mobile_inserzione .favorites-btn .heartFilled {
    width: 70px;
    height: 70px;
  }
  .mobile_inserzione .favorites-btn.active .heartEmpty {
    width: 70px;
    height: 70px;
  }
  .mobile_inserzione .favorites-btn.active .heartFilled {
    width: 70px;
    height: 70px;
  }
  /* END MODIFICHE ALBE */

  .favorites_toggle .heartEmpty {
    cursor: pointer;
    width: 70px;
    height: 70px;
  }
  .favorites_toggle .heartEmpty path {
    fill: var(--color-white);
  }

  .info_inserzione {
    color: var(--color-white);
    text-shadow: 0px 0px 4px var(--color-black);
    position: absolute;
    top: 0;
    width: 100%;
    padding: 15px;
    text-transform: capitalize;
  }

  .container_btns_mobile_inserzione {
    position: absolute;
    z-index: 999;
    width: 100%;
    bottom: 0;
  }

  .mobile_inserzione img {
    display: block;
    height: 100%;
    width: 100%;
  }

  .mobile_inserzione::before {
    pointer-events: none;
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0.7;
    background-image: linear-gradient(
      190deg,
      transparent,
      transparent 75%,
      rgba(0, 0, 0, 0.95)
    );
  }

  .btns_tile {
    text-align: center;
    margin-bottom: 10px;
  }

  .btns_tile button {
    border: none;
    background-color: var(--color-white);
    height: 42px;
    opacity: 0.85;
    border-radius: 50%;
    margin: 0 10px;
    box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.3);
    width: 42px;
  }

  .btns_tile button svg {
    width: 25px;
    height: 25px;
  }

  /* .inserzione_logo_mobile {
    position: absolute;
    bottom: 10px;
    right: 5px;
    background-color: #ffffffb6;
    border-radius: 8px;
  }

  .inserzione_logo_mobile img {
    max-width: 100px;
    width: 100%;
    padding: 0 8px;
  } */

  .inserzione_logo_mobile {
    position: absolute;
    bottom: 6px;
    right: 5px;
    background-color: #ffffffb6;
    border-radius: 6px;
    max-width: 130px;
    width: 100%;
    opacity: 0.7;
  }

  .inserzione_logo_mobile img {
    width: 100%;
    /* max-height: 17px; */
    padding: 2px 8px;
  }

  .grid_mobile .container_mobile_inserzioni .mobile_inserzione {
    position: relative;
    min-height: 259px;
    max-height: 260px;
    width: calc(50% - 3px);
    display: inline-block;
    margin-bottom: 0;
  }

  .grid_mobile
    .container_mobile_inserzioni
    .mobile_inserzione
    .inserzione_logo_mobile {
    max-width: 70px;
    bottom: 5px;
  }

  .grid_mobile
    .container_mobile_inserzioni
    .mobile_inserzione
    .favorites_toggle {
    bottom: 0;
  }

  .grid_mobile
    .container_mobile_inserzioni
    .mobile_inserzione
    .info_inserzione {
    padding: 5px;
  }

  .grid_mobile
    .container_mobile_inserzioni
    .mobile_inserzione
    .inserzione_name {
    font-size: 13px;
  }

  .grid_mobile
    .container_mobile_inserzioni
    .mobile_inserzione
    .info_inserzione
    .inserzione_cat,
  .grid_mobile
    .container_mobile_inserzioni
    .mobile_inserzione
    .info_inserzione
    .inserzione_city {
    font-size: 12px;
  }

  /* .grid_mobile .mobile_inserzione .favorites_toggle {
    top: 5px;
    right: 5px;
  } */
  .grid_mobile .mobile_inserzione .favorites_toggle .heartEmpty {
    cursor: pointer;
    height: 20px;
    width: 20px;
  }

  .cat_filters,
  .site_filters {
    padding: 5px;
    /* position: fixed;
    height: 100vh;
    width: 100%;
    z-index: 999999;
    backdrop-filter: brightness(0.2); */
    font-family: var(--font-regular);
    /* display: none; */
    position: fixed;
    z-index: 8;
    width: 100%;
    top: -230px;
    background: linear-gradient(-200deg, #5461ad, rgba(8, 33, 134, 1) 70%);
    -webkit-box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.5);
    box-shadow: 0px 5px 15px 0px rgba(0, 0, 0, 0.5);
    transition: top 0.5s;
  }

  .category-dropdown-option {
    padding: 0 10px;
    display: block;
    width: 100%;
    text-align: center;
  }

  .cat_filters ul,
  .site_filters ul {
    list-style: none;
    padding: 10px;
    border-radius: 8px;
    background-color: #e4e4e4;
    /* background-color: #00000045;
    backdrop-filter: blur(30px) saturate(0.5); */
  }

  .cat_filters ul li,
  .site_filters ul li {
    color: var(--color-black);
    border-radius: 2px;
    /* padding-block: 2px 5px;
    padding-left: 3px; */
    margin-bottom: 2px;
    font-size: 14px;
    border-bottom: 0.1px solid rgb(186, 186, 186);
    font-family: var(--font-regular);
    user-select: none;
  }

  .cat_filters ul li a,
  .site_filters ul li a {
    display: block;
    padding-block: 2px 5px;
    padding-left: 3px;
  }

  /* ---tmp adjustment to category filters--- */
  .site_filters ul li {
    display: flex;
    align-items: center;
    gap: 8px;
  }

  .site_filters ul li:active {
    background-color: unset !important;
    color: var(--color-black) !important;
  }
  .site_filters ul li label {
    display: block;
    width: 100%;
    padding-block: 5px;
  }

  .site_filters ul li input[type="checkbox"] {
    width: 15px;
    height: 15px;
    accent-color: #e667a4;
  }
  /* ---end tmp adjustment to category filters--- */

  .cat_filters ul li:active,
  .site_filters ul li:active {
    background-color: #f577b3;
    color: var(--color-white);
  }

  .cat_filters ul li:last-child,
  .site_filters ul li:last-child {
    padding-bottom: 0;
    border-bottom: none;
  }

  .content-mobile .btns-container {
    padding: 0;
    margin: 10px;
    width: auto;
  }

  .category-dropdown-option img {
    display: inline-block;
    left: 0;
    top: 0;
    position: relative;
    width: auto;
    padding: 12px;
    height: 45px;
  }

  .remove_adv {
    margin-top: 20px;
  }
}
@media screen and (max-width: 480px) {
  .grid_mobile .container_mobile_inserzioni .mobile_inserzione {
    min-height: 235px;
    max-height: 236px;
  }
}