/* all */
@media screen and (min-width: 240px) and (max-width: 1024px),
screen and (min-width: 820px) and (max-width: 1180px) {
    .styled-combo {
        font-size: 22px;
        color: #FFFFFF;
        font-weight: 300;
        margin-left: 11px;
        padding-right: 40px;
        background-image: url('../images/menu-down-white.svg');
    }
    .styled-combo .drop-down {
        top: 40px;
    }
    .styled-combo .drop-down .item {
        border-bottom: 1px solid var(--light-menu-color);
    }
    .styled-combo .drop-down a:last-of-type .item {
        border-bottom: none;
    }
    .lang-menu {
        background-color: #417475;
        font-size: 17px;
        margin-left: 20px;
        color: white;
        padding: 5px 8px;
    }
    body {
        width: 100%;
    }
    .band.above-the-fold.memory-page {
        padding-top: 68px;
    }
    .memory-page .photo > div {
        width: 120px;
        height: 120px;
    }
    .only-desktop {
        display: none!important;
    }
    .only-tablet {
        display: inline-block!important;
    }
    .user-menu.only-mobile {
        display: inline-block!important;
        width: 100%;
        font-weight: 700;
        color: white;
        padding-left: 18px;
    }
    .user-menu.only-mobile a:last-of-type {
        margin-left: 10px;
    }
    .light .navbar {
        height: 70px;
        /*background-color: #F7F5F5;*/
        padding-left: 5px;
        padding-right: 5px;
    }
    .contracted-details .dropdown-menu {
        width: 200px;
    }
    .navbar .navbar-brand img,
    .navbar.contract .navbar-brand img {
        margin-bottom: 0;
        height: 24px;
        width: auto;
    }
    .navbar-brand {
        margin-right: 0;
    }
    .navbar > .container.default {
        padding-left: 10px;
        padding-right: 10px;
    }
    .light.homepage .navbar {
        background-color: #F7F5F5;
    }
    .navbar.contract {
        height: 70px;
    }
    .navbar>.container, .navbar>.container-fluid, .navbar>.container-lg, .navbar>.container-md, .navbar>.container-sm, .navbar>.container-xl, .navbar>.container-xxl {
        height: 100%;
    }
    .dim-button.tools.circle {
        width: 40px;
        height: 40px;
        display: flex!important;
    }
    .sub-hero .content {
        display: inline-block;
        height: fit-content;
    }
    .sub-hero .content div:last-of-type {
        /*max-width: 540px;*/
        width: 100%;
        text-align: center;
        padding-top: 20px;
        max-width: unset;
    }
    .sub-hero .content div:last-of-type > img {
        margin-top: 40px;
    }
    .cite br.only-mobile {
        display: none;
    }
    .home-page .home-citation {
        text-align: left;
        padding-left: 90px;
        padding-top: 50px;
    }
    .home-page cite {
        font-size: 32px;
        line-height: 34px;
    }
    .home-page .home-citation .sign {
        font-size: 15px;
    }
   .container.no-padding.hero {
        padding-left: 0;
       padding-right: 0;
       margin-left: 0;
       margin-right: 0;
       width: 100%;
       max-width: unset;

    }
    .band.above-the-fold.home-page {
        background: #F7F5F5;
    }
    .band.above-the-fold.home-page .row .col-12:first-of-type {
        /*background: url('../images/mobile-hero-2.svg') no-repeat center 80%;*/
        background: url('../images/home-hero.svg') no-repeat center 80%;
        background-size: 100%;
        height: 360px;
        padding-bottom: 50px;
        margin-bottom: 60px;
    }
    .band.above-the-fold.home-page .row .col-sm-3 {
        background: url('../images/home-hero.svg') no-repeat center 80%;
    }
    .band.above-the-fold,
    .band.above-the-fold.internal,
    .band.above-the-fold.donazioni {
        padding-top: 140px;
    }
    .band.above-the-fold.crea-pagina-ricordo {
        padding-top: 70px;
        padding-bottom: 0;
    }
    img.mobile-hero {
        width: 100%;
        margin: 0 auto;
    }
    .home-page .home-citation .buttons {
        margin-bottom: 30px;
        margin-top: 12px;
    }
    .sub-hero {
        background: #ffffff;
    }
    .band {
        padding: 70px 0;
    }
    .home-page h1 {
        padding-top: 60px;
    }
    h1, h2 {
        line-height: 34px;
        padding-top: 0;
        margin-top: 0;
        margin-bottom: 45px;
    }
    .container,
    .container.no-padding .content {
        padding-left: 20px;
        padding-right: 20px;
    }
    .container.default {
        padding-left: 12px;
        padding-right: 12px;
    }
    .container.no-padding {
        padding-left: 0;
        padding-right: 0;
    }
    .sub-hero .buttons {
        text-align: center;
    }
    .band.home-page {
        padding-bottom: 0;
    }
    .container.sub-hero.no-padding {
        padding-bottom: 80px;
    }
    .ricordi .card-body .epitaffio {
        height: 162px;
        padding: 20px 0 30px 0;
    }
    p {
        font-weight: 200;
    }
    .sub-hero .visual {
        padding-top: 60px;
        display: inline-block;
        text-align: center;
    }

    .donazioni .content {
        display: unset;
        height: fit-content;
    }
    .donazioni .content .text {
        width: 100%;
        padding-top: 0;
    }
    .donazioni .visual {
        padding-top: 60px;
        text-align: center;
    }
    .donazioni .buttons {
        text-align: center;
    }
    .hero .row {
        margin-left: 0;
        margin-right: 0;
    }

    .blog .buttons {
        padding-top: 60px;
    }
    footer.page .menu {
        padding-left: 0;
    }
    footer.page .logo {
        margin-bottom: 100px;
    }
    footer.page .social .icons {
        padding-top: 70px;
    }
    footer.page .social .col-12 {
        /*padding-top: 15px;*/
    }
    footer.page .social .col-12:first-of-type {
        padding-top: 0;
    }

    .podcast-intro img {
        width: 100%;
    }
    .band.above-the-fold .hero {
        padding-top: 70px;
    }
    .container.sub-hero.no-padding {
        margin-left: 0;
        margin-right: 0;
        width: 100%;
        max-width: unset;
    }
    .container.sub-hero.no-padding .content {
        width: 100%;
    }
    blog-card .body {
        height: 236px;
    }
    .pagine-ricordo.ctas img {
        height: 200px;
        width: auto;
    }
    .navbar-collapse {
        position: fixed;
        top: 0;
        left: 100vw;
        width: 100%;
        height: 100vh;
        background-color: #417475;
        transition: all .2s ease-in-out;
        padding: 25px;
        opacity: 0;
    }
    .navbar-collapse.show {
        left: 0;
        opacity: 1;
    }
    .navbar-collapse .menu-head {
        height: 28px;
        width: auto;
        justify-content: space-between;
        display: flex;
        margin-bottom: 60px;
    }
    .navbar-collapse .menu-head .logo-menu {
        height: 28px;
        width: auto;
        margin-top: 5px;
    }
    .collapse:not(.show) {
        height: 100%;
    }
    .navbar .navbar-nav .nav-link,
    .navbar .navbar-nav .nav-item.floating .nav-link {
        font-size: 25px;
        color: #FFFFFF;
        font-weight: 300;
        padding-left: 19px;
    }
    .navbar .navbar-nav .nav-link.login-register,
    .navbar .navbar-nav .nav-item.floating .nav-link.login-register {
        font-size: 16px;
        font-weight: 700;
    }
    .navbar .navbar-nav .floating {
        position: unset;
    }
    .navbar .navbar-nav .floating img {
        display: none;
    }
    .navbar .navbar-nav .floating button {
        margin: 18px 0;
    }
    .navbar .navbar-nav .active .nav-link {
        color: #ffffff;
    }
    .user-menu > a,
    .nav-link.login-register{
        color: #ffffff;
        font-weight: 700;
        font-size: 16px;
    }

    .xx-item {
        width: 100%
    }

    .memory-tab-strip {
        justify-content: center;
    }

    .register-pane .intro svg {
        display: none;
    }



}

/* smartphone */
@media screen and (max-width: 767px) {
    .swiper-fh {
        display: none;
    }
    .swiper-fh .fh-card > img {
        width: 100%;
        height: auto;
    }
    .swiper-fh .fh-card {
        min-height: 1150px;
    }
    .swiper.swiper-fh .swiper-slide {
        padding-right: 0;
    }
    .band-grey .band1-image {
        height: 220px; width: 100%;
        background-repeat: no-repeat;
        background-position: 25% center;
    }
    .overlay { padding: 10px; }
    .overlay .wizard {
        width: 100%;
        padding: 24px;
    }
    .add-comment .step .form-group {
        margin-bottom: 0;
    }
    .add-comment .step .check-row {
        padding-top: 10px;
        /*padding-bottom: 10px;*/
    }
    .add-comment .footer {
        padding-top: 20px;
    }
    .ricordi-buttons {
        flex-wrap: wrap;
        gap: 30px;
    }
    .light .navbar {
        z-index: 1032;
    }
    .only-tablet {
        display: none!important;
    }
    .memory-page .photo > div {
        width: 196px;
        height: 196px;
    }
    .dates-and-donation .first-col.splitted.full {
        flex-direction: column;
    }
    .dates-and-donation .first-col.splitted .rounded-box.full {
        width: 100%;
    }
    .overlay.add-comment .wizard .footer .button-pane button {
        width: auto;
    }
    .overlay.add-comment .wizard .footer .button-pane {
        width: 120px;
    }
    .band.sticky-top.cta {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 28px;
        background-color: #F7D4C8;
        color: #6A6766;
        font-size: 13px;
        font-weight: 600;
        letter-spacing: 0.39px;
        padding: 0;
        top: 70px;
        opacity: 0;
        right: -100%;
        width: 100%;
        position: fixed;
        z-index: 1030;
        cursor: pointer;
        transition: all .3s ease-in-out;
    }
    .band.sticky-top.cta.shown {
        opacity: 1;
        right: 0;
    }
    footer.page .social .col-12 {
        padding-top: 15px;
    }
    .band.above-the-fold .hero {
        padding-top: 120px;
    }
    .home-page .home-citation {
        text-align: center;
        padding-left: 0;
        padding-top: 0;
    }
    .component-page .container, .component-page .container.no-padding .content {
        padding-left: 5vw;
        padding-right: 5vw;
    }
    .only-mobile {
        display: unset!important;
    }
    .only-mobile.inline-block {
        display: inline-block!important;
    }
    .band.above-the-fold.home-page .row .col-12:first-of-type {
        background: url('../images/mobile-hero-2.svg') no-repeat center 80%;
        /*background: url('../images/home-hero-giulia-mobile.svg') no-repeat center 80%;*/
        background-size: 100%;
        height: 760px;
        padding-bottom: 50px;
    }

    .band.above-the-fold .cover {
        height: 260px;
        background-position: bottom center;
    }
    .xx-item {
    width: 100%;
    }
    .memory-page .cover .author {
        bottom: unset;
        width: 100%;
        text-align: center;
        padding: 5px 0;
    }
    .memory-page.by-agency .cover .author {
        background: #484848;
    }
    .memory-page .photo > div {
        top: -95px;
    }
    .memory-page .dead-name {
    margin-top: 95px;
    }
    .memory-page .margin-none-mob {
        margin: 0;
    }
    .dates-and-donation .first-col {
        gap: 20px;
    }
    .memory-page .dead-name > div {
        width: 100%;
    }
    .memory-page .dead-name .name {
        width: 100%;
        gap: unset;
        justify-content: space-between;
    }
    .dates-and-donation .second-col {
        margin-top: 20px;
    }
    .dates-and-donation .row {
        height: unset;
    }
    .rounded-box.donazione .only-mobile {
        padding-top: 20px;
        display: inline-block;
    }

    section.masonry .container {
        padding-left: 5px;
        padding-right: 5px;
    }

    .memory-tab-content .album {
        display: block;
    }
    .memory-tab-content .album div {
        width: 100%;
        max-height: 100%;
        max-width: 100%;
        margin-bottom: 20px;
    }
    .memory-tab-content .album div:last-of-type {
        margin-bottom: 0;
    }
    .guestbook-grid .card {
        width: 100%;
    }
    .dead-name .name .dropdown-menu .callout {
        transform: rotate(90deg);
        left: unset;
        right: -14px;
    }
    .dead-name .name .dropdown-menu {
        margin-right: 12px !important;
    }

    .builder .container-b {
        width: 100%;
        padding: 45px;
        background-color: #FFFFFF;
        margin: 0 auto;
    }
    .builder .band.above-the-fold {
        margin-top: 0;
    }
    .donazioni .search-control {
        height: auto;
        width: 100%;
        display: inline-block;
        border-radius: 0;
        border: none;
        background-color: #E6DCEF;
        padding: 24px;
    }
    .donazioni .search-control input {
        width: 100%;
        border-radius: 52px;
        height: 52px;
        margin-top: 24px;
        background-position: 94% center;
    }
    .donazioni .search-control .dropdown > ul {
        position: static;
        text-align: left;
        background-color: white;
        margin: 0;
    }
    .donazioni .search-control .dropdown {
        display: inline-block;
        width: 100%;
        text-align: left;
        background-color: white;
        height: 52px;
    }
    .donazioni .search-control .dropdown > ul > li {
        padding-left: 0;
    }
    .donazioni .search-control .dropdown > div {
        width: 100%;
    }
    .donazioni .search-control .dropdown.show > ul {
        display: block;
        width: 100%;
    }
    div.band.donazioni {
        padding-bottom: 0;
        padding-top: 0;
    }
    .introduction .visual {
        width: 100%;
        height: auto;
    }
    .container.pagine-ricordo.bullets {
        margin-bottom: 30px;
    }
    .pagine-ricordo.ctas img {
        width: 70%;
        height: auto;
        margin-bottom: 20px;
    }
    .pagine-ricordo.ctas .second-column {
        margin-top: 60px;
    }
    .container.pagine-ricordo.search-pane {
        padding-top: 40px;
    }
    .pagine-ricordo.search-pane .search-field {
        width: 100%;
    }
    .ricordi.grid .card {
        width: 100%;
    }
    .podcast-intro img {
        width: 80%;
        margin-top: 50px;
    }
    .podcast .article .author .heading {
        margin-top: 11px;
        gap: 20px;
        justify-content: center;
        align-items: center;
    }
    .podcast .article .author .heading .data {
        justify-content: center;
    }
    .podcast .article .author h2 {
        margin-bottom: 11px;
    }
    .podcast .article .author .heading img {
        height: 110px;
    }
    .podcast .article .author .data > span {
        font-size: 18px;
    }
    .podcast .article .author {
        border-radius: 12px;
        border: 1px solid #EBEBEB;
        background: #FFF;
        padding: 30px 32px;
    }
    .podcast .article .author .bio {
        font-size: 18px;
        padding-top: 20px;
    }
    .podcast .article h1 {
        margin-bottom: 60px;
    }
    .podcast .article .sharing {
        display: block;
    }
    .podcast .article .sharing svg {
        margin: 5px 13px 0 0;
    }
    .podcast .episode {
        height: fit-content;
        flex-wrap: wrap;
        margin-bottom: 70px;
    }
    .band.above-the-fold .cover {
        height: 230px;
    }
    .about-us .visual img {
        width: 100%;
        height: auto;
    }

    .contact-us .visual img {
        width: 100%;
        height: auto;
    }
    .contact-us .buttons {
        text-align: center;
    }
    .contact-us .contact-form {
        margin-top: 100px;
    }
    .contact-us .contact-ref .contact-item {
        justify-content: center;
    }
    .band.above-the-fold {
        padding-top: 140px;
    }
    .band.above-the-fold.internal {
        padding-top: 140px;
    }
    .blog-listing .filter {
        display: inline-block;
        height: auto;
        width: 100%;
        text-align: center;
    }
    .blog-listing .filter span {
        text-align: center;
        width: 100%;
        display: inline-block;
        margin-bottom: 13px;
    }
    .blog-listing .filter select.css-select {
        width: 90%;
        padding-left: 12px;
        padding-right: 12px;
    }
    blog-card .body {
        height: fit-content;
    }
    .blog-listing .other-podcast h2 {
        text-align: center;
        margin-top: 120px;
    }
    .blog-listing .other-podcast .episode,
    .blog-listing .other-podcast h3 {
        text-align: center;
    }
    .other-posts h2 {
        text-align: center;
    }
    .suggest-org .container-b {
        width: 100%;
        padding: 25px;
    }
    .small-frame {
        width: 100%;
    }
    .nav-item.floating {
        display: block;
    }
    .nav-item.floating .dim-button.pink.tiny {
        margin: 20px 0;
    }
    .dim-button {
        height: 44px;
        width: auto;
        padding-left: 20px;
        padding-right: 20px;
        border-radius: 22px;
        border: 1.5px solid #6A6766;
        appearance: none;
        font-size: 16px;
        cursor: pointer;
        text-decoration: none;
        line-height: 41px;
    }

    footer .buttons button {
        /*width: 60%;*/
    }
    footer.page .menu {
        padding-left: 20px;
    }
    footer.page .social .icons,
    footer.page .social .mail,
    footer.page .social .no-profit {
        padding-left: 18px;
    }
    .user-area .flex-left-top {
        display: block;
    }
    .user-area .left-column {
        width: 100%;
    }
    .card.my-page {
        align-items: start;
        gap: 10px;
    }
    .card.my-page .buttons {
        gap: 10px;
    }
    .content-output .output {
        background-color: transparent;
        padding-left: 0;
        padding-right: 0;
    }
    .card.my-page .dim-button.circle {
        height: 34px;
        width: 34px;
    }
    .card.my-page h3 {
        margin-bottom: 0;
    }
    .card.my-page .summary {
        padding-top: 10px;
    }
    .user-area .user-avatar.left-column {
        text-align: left;
        margin-bottom: 23px;
    }
    .band.funeral-house h1 {
        font-size: 28px;
    }
    .band.funeral-house .services-block .items {
        display: inline-block;
        width: 100%;
        height: auto;
    }
    .band.funeral-house .services-block .item {
        width: 100%;
    }
    .band.funeral-house-pages .card {
        width: 100%;
    }
    .user-area .right-column .buttons {
        flex-wrap: wrap;
    }
    .band.above-the-fold.funeral-house-reg {
        padding-top: 60px;
        margin-top: 70px;
    }
    .swiper-fh .fh-card {
        height: 1410px;
    }
    .swiper-pagination-bullet {
        border: 1px solid white;
        width: 10px;
        height: 10px;
        opacity: 1;
        background-color: transparent;
    }
    .swiper-pagination-bullet.swiper-pagination-bullet-active {
        background-color: white;
    }
    .band.funeral-house .heading {
        display: block;
    }
    .band.funeral-house .heading > h1 {
        margin-bottom: 10px;
    }
    .fh-mobile-cards {
        display: block;
        width: 100%;
        border: 1px solid white;
        border-radius: 12px;
        padding: 30px 15px 15px 15px;
        margin-bottom: 30px;
    }
    .fh-mobile-cards .heading img {
        width: 90%;
        text-align: center;
    }
    .fh-mobile-cards .fh-bullet {
        position: relative;
        text-align: left;
        padding: 40px 15px 0 15px;
    }
    .fh-mobile-cards .fh-bullet h4 {
        text-align: left;
    }
    .fh-mobile-cards .fh-bullet img {
        position: absolute;
        left: 5px;
        top: 38px;
        height: 30px;
        z-index: -1;
    }
}
/* tablet */
@media screen and (min-width: 768px) and (max-width: 1024px) {
    .fh-mobile-cards {
        display: none;
    }
}