﻿@media (min-width: 1450px) {
    .panel-quadruple-small {
        align-items: center;
        display: flex;
        flex-direction: column;
        padding: 15px;
        width: var(--with_72);
        margin-left: 30px;
    }
    .panel-double-small {
        padding: 15px;
        width: 50%;
    }

    .panel-double-small-right {
        padding: 15px;
        width: 50%;
        margin-left: 30px;
    }
    .panel-triple-small-start {
        align-items: center;
        display: flex;
        flex-direction: column;
        padding: 15px;
        width: 21%;
    }

    .panel-triple-small {
        align-items: center;
        display: flex;
        flex-direction: column;
        padding: 15px;
        width: 21%;
        margin-left: 30px;
    }

    .panel-content-sinistro-space {
        display: flex;
        flex-direction: column;
        /*width: var(--with_70);*/
        width: 75%;
        line-height: 30px;
        gap: 15px;
        justify-content: center;
    }

    .panel-content-destro-green {
        display: flex;
        line-height: 30px;
        flex-direction: column;
        padding: 30px 60px;
        background-color: #1db954;
        border-radius: 10px;
        box-shadow: 0px 6px 12px #0000002e;
        /* width: var(--with_71);*/
        width: 23%;
        text-align: center;
    }

    .tariffe-all-letter {
        height: 30px;
        left: 18px;
        letter-spacing: 9px;
        line-height: 30px;
        white-space: nowrap;
        width: 100%;
        position: relative;
        top: 8px;
        display: flex;
    }
    .frame-risultato-sinistra {
        height: 55px;
        left: 85px;
        position: absolute;
        color: var(--white);
    }

    .frame-risultato-destra {
        height: 55px;
        left: 400px;
        position: absolute;
        top: 0;
        color: var(--white);
    }
    .testo-titolo-right {
        color: var(--text);
        font-weight: 700;
        height: 35px;
        left: 400px;
        line-height: 32.7px;
        position: absolute;
        top: 0;
        white-space: nowrap;
        width: var(--with_83);
    }
}

@media only screen and (min-width: 970px) and (max-width: 1450px) {
    .panel-quadruple-small {
        align-items: center;
        display: flex;
        flex-direction: column;
        padding: 15px;
        width: var(--with_72);
        margin-left: 15px;
    }
    .panel-double-small {
        padding: 15px;
        /* width: var(--with_68);*/
        width: 50%;
    }

    .panel-double-small-right {
        padding: 15px;
        /* width: var(--with_68);*/
        width: 50%;
        margin-left: 15px;
    }
    .panel-triple-small-start {
        align-items: center;
        display: flex;
        flex-direction: column;
        padding: 15px;
        width: 21%;
    }

    .panel-triple-small {
        align-items: center;
        display: flex;
        flex-direction: column;
        padding: 15px;
        width: 21%;
        margin-left: 15px;
    }

    .panel-content-sinistro-space {
        display: flex;
        flex-direction: column;
        /*width: var(--with_70);*/
        width: 70%;
        line-height: 30px;
        gap: 15px;
        justify-content: center;
    }

    .panel-content-destro-green {
        display: flex;
        line-height: 30px;
        flex-direction: column;
        padding: 30px 60px;
        background-color: #1db954;
        border-radius: 10px;
        box-shadow: 0px 6px 12px #0000002e;
        /* width: var(--with_71);*/
        width: 30%;
        text-align: center;
    }

    .tariffe-all-letter {
        height: 30px;
        left: 18px;
        letter-spacing: 3.5px;
        line-height: 30px;
        white-space: nowrap;
        width: 100%;
        position: relative;
        top: 8px;
        display: flex;
    }
    .frame-risultato-sinistra {
        height: 55px;
        left: 85px;
        position: absolute;
        color: var(--white);
    }

    .frame-risultato-destra {
        height: 55px;
        left: 400px;
        position: absolute;
        top: 0;
        color: var(--white);
    }
    .testo-titolo-right {
        color: var(--text);
        font-weight: 700;
        height: 35px;
        left: 400px;
        line-height: 32.7px;
        position: absolute;
        top: 0;
        white-space: nowrap;
        width: var(--with_83);
    }
}

@media only screen and (min-width: 769px) and (max-width: 970px) {

    .panel-quadruple-small {
        align-items: center;
        display: flex;
        flex-direction: column;
        padding: 15px;
        width: var(--with_72);
        margin-left: 5px;
    }
    .panel-double-small {
        padding: 15px;
        /* width: var(--with_68);*/
        width: 50%;
    }

    .panel-double-small-right {
        padding: 15px;
        /* width: var(--with_68);*/
        width: 50%;
        margin-left: 5px;
    }
    .panel-triple-small-start {
        align-items: center;
        display: flex;
        flex-direction: column;
        padding: 15px;
        width: 26%;
    }

    .panel-triple-small {
        align-items: center;
        display: flex;
        flex-direction: column;
        padding: 15px;
        width: 26%;
        margin-left: 10px;
    }

    .panel-content-sinistro-space {
        display: flex;
        flex-direction: column;
        /*width: var(--with_70);*/
        width: 60%;
        line-height: 30px;
        gap: 15px;
        justify-content: center;
    }

    .panel-content-destro-green {
        display: flex;
        line-height: 30px;
        flex-direction: column;
        background-color: #1db954;
        border-radius: 10px;
        box-shadow: 0px 6px 12px #0000002e;
        /* width: var(--with_71);*/
        width: 40%;
        text-align: center;
    }
    .tariffe-all-letter {
        height: 30px;
        left: 18px;
        letter-spacing: 2px;
        line-height: 30px;
        white-space: nowrap;
        width: 100%;
        position: relative;
        top: 8px;
        display: flex;
    }
    .frame-risultato-sinistra {
        height: 55px;
        left: 85px;
        position: absolute;
        color: var(--white);
    }

    .frame-risultato-destra {
        height: 55px;
        left: 265px;
        position: absolute;
        top: -1px;
        color: var(--white);
    }
    .testo-titolo-right {
        color: var(--text);
        font-weight: 700;
        height: 35px;
        left: 265px;
        line-height: 32.7px;
        position: absolute;
        top: 0;
        white-space: nowrap;
        width: var(--with_83);
    }
}

@media (min-width:769px) {
    .img-small {
        width: 8%;
        align-self: flex-start;
    }

    .home-page {
        align-items: center;
        display: flex;
        flex-direction: column;
        padding: 30px 0px 0px 0px;
        background-color: #eff4fc;
    }

    .panel-row-first-toogle {
        display: none;
    }

    .panel-row-horizzontal {
        display: flex;
        flex-direction: row;
        margin-top: 90px;
        width: var(--with_13);
    }

    .panel-row, .panel-row-particular, .panel-row-notoggle {
        display: flex;
        flex-direction: column;
        margin-top: 90px;
        width: var(--with_13);
    }

    .panel-row-embed {
        display: flex;
        flex-direction: column;
        margin-top: 90px;
        width: 90%;
        height:200px;
    }

    .panel-row-toggle {
        display: none;
    }


    .panel-row-near {
        display: flex;
        flex-direction: column;
        margin-top: var(--margin-dimension);
        width: var(--with_13);
    }

    .panel-row-center {
        display: flex;
        flex-direction: column;
        margin-top: 90px;
        width: var(--with_13);
        align-content: center;
        align-items: center;
    }


    .panel-row-center-small {
        display: flex;
        flex-direction: column;
        margin-top: 90px;
        width: var(--with_14);
        align-content: center;
        align-items: center;
    }

    .panel-internal-big {
        display: flex;
        width: 75%;
        flex-direction: column;
    }

    .panel-internal-center-big {
        display: flex;
        text-align: center;
        align-items: center;
        flex-direction: column;
    }

    .panel-internal-small {
        display: flex;
        width: var(--with_63);
    }
    .panel-internal-elenco {
        display: flex;
        margin-top:10px;
    }
    .panel-internal-near {
        margin-top: 10px;
    }

    .panel-double, .panel-double-special {
        display: flex;
        flex-direction: column;
        width: var(--with_64);
        line-height: 30px;
    }

    .panel-double-special-toggle {
        display: none;
    }

    .panel-double-horizzontal {
        display: flex;
        flex-direction: row;
        margin-top: 45px;
        width: var(--with_65);
    }

    .panel-double-form {
        display: flex;
        flex-direction: row;
        margin-top: 45px;
        width: 75%;
    }

    .panel-double-sistra-big {
        display: flex;
        flex-direction: column;
        width: var(--with_66);
        line-height: 30px;
        padding: 30px;
    }

    .panel-double-destra-small {
        display: flex;
        flex-direction: column;
        width: var(--with_67);
        line-height: 30px;
        margin-left: 30px;
    }

    .panel-double-center {
        display: flex;
        flex-direction: column;
        width: var(--with_64);
        line-height: 30px;
        align-self: center;
    }

    .line-for-double {
        height: 3px;
        margin-top: 14px;
        width: 100%;
    }

    .panel-title {
        line-height: 50px !important;
    }

    .panel-content-left {
        margin-top: var(--margin-dimension);
        line-height: 30px;
        align-items: center;
        align-self: flex-start;
        margin-left: 10px;
    }

    .panel-content-first {
        align-items: center;
        display: flex;
    }

    .panel-content-first-register {
        display: flex;
        width: 50%;
    }

    .panel-content {
        margin-top: var(--margin-dimension);
        line-height: 30px;
        align-items: center;
    }

    .panel-content-title {
        margin-top: var(--margin-dimension);
        line-height: 30px;
        align-items: center;
    }

    .panel-inserisci {
        display: flex;
        flex-direction: row;
        gap: 10px;
    }

    .panel-content-padding {
        margin-top: var(--margin-dimension);
        line-height: 30px;
        align-items: center;
        padding: 30px;
    }

    .panel-near {
        gap: 10px;
    }

    .panel-stretto {
        line-height: 18px;
    }

    .panel-stretto-center {
        line-height: 18px;
        text-align: center;
    }

    .panel-center, .panel-center-particular {
        text-align: center;
        line-height: 35px;
        align-self: center;
        padding: 25px 0px;
    }

    .panel-center-text, .panel-center-text-particular {
        /* padding: 0px 100px; */
        text-align: center;
        line-height: 25px;
        align-self: center
    }

    .internal-p {
        padding: 0px 100px;
    }




    .panel-internal {
        margin-top: var(--margin-dimension);
        line-height: 30px;
        display: flex;
        align-self: center;
        justify-content: center;
        width: 100%;
    }

    .panel-internal-extended {
        margin-top: var(--margin-dimension);
        line-height: 30px;
        display: flex;
        align-self: center;
        width: 100%
    }

    .img-panel-hover {
        /*height:350px;
    width:525px;
        */
    }
    .panel-green-big {
        display: flex;
        flex-direction: row;
        margin-top: 90px;
        width: var(--with_13);
        padding: 40px;
        font-family: var(--font-family-karla);
        font-size: var(--font-size-xxl);
        font-style: normal;
        font-weight: 400;
        background-color: #1db954;
        border-radius: 10px;
        box-shadow: 0px 6px 12px #0000002e;
        color: white;
    }

    .panel-green-hover {
        display: flex;
        flex-direction: row;
        margin-top: 90px;
        width: var(--with_13);
        padding: 15px;
        color: var(--text);
        font-family: var(--font-family-karla);
        font-size: var(--font-size-xxl);
        font-style: normal;
        font-weight: 400;
    }

    .panel-green-hover:hover {
        background-color: #1db954;
        border-radius: 10px;
        box-shadow: 0px 6px 12px #0000002e;
        color: white;
    }

    .panel-triple-start {
        align-items: center;
        display: flex;
        flex-direction: column;
        padding: 15px;
        width: 33%;
    }

    .panel-triple {
        align-items: center;
        display: flex;
        flex-direction: column;
        padding: 15px;
        width: 33%;
        margin-left: 30px;
    }

    .panel-triple-left-start {
        display: flex;
        flex-direction: column;
        padding: 15px;
        width: 33%;
    }

    .panel-left-triple {
        display: flex;
        flex-direction: column;
        padding: 15px;
        width: 33%;
        margin-left: 30px;
    }


    .testo-for-image {
        line-height: 30px;
        margin-top: 10px;
    }

    .panel-internal-bottom {
        display: flex;
        margin-top: var(--margin-dimension);
    }

    .panel-quadruple-small-start {
        align-items: center;
        display: flex;
        flex-direction: column;
        padding: 15px;
        width: var(--with_72);
    }

    .linea-quadruple {
        height: 3px;
        width: var(--with_25);
    }


    .panel-small-blue {
        display: flex;
        flex-direction: row;
        padding: 15px;
        gap: 50px;
        /* width: var(--with_73);*/
        width: 82%;
    }

    .panel-space {
        gap: 15px;
        display: flex;
        flex-direction: row;
        margin-top: 15px;
    }

    .spanMax {
        letter-spacing: 0.50px;
        line-height: 21px;
        margin-left: 20px;
        max-width: var(--with_56);
        align-self: center;
    }

    .title-white {
        color: var(--white);
        line-height: 30px;
    }

    .panel-big-green {
        align-items: center;
        background-color: #1db954;
        display: flex;
        flex-direction: column;
        margin-top: 90px;
        padding: 17px 119px;
        width: 100%;
    }

    .panel-big-blue {
        align-items: center;
        background-color: var(--blue-ribbon);
        display: flex;
        flex-direction: column;
        margin-top: 90px;
        padding: 17px 119px;
        width: 100%;
    }


    .image-and-title {
        align-items: center;
        display: flex;
    }

    .title-for-image {
        margin-left: 20px;
    }

    .panel-white {
        background-color: var(--white);
        border-radius: 10px;
        box-shadow: 0px 6px 12px #00000033;
    }

    .panel-white-rounded-left {
        background-color: var(--white);
        border-radius: 10px 0 0 10px;
        box-shadow: 0px 6px 12px #00000033;
        padding: 30px;
        width: 50%;
    }

    .panel-doppia-colonna {
        display: flex;
        margin-top: var(--margin-dimension);
        width: 100%;
        gap: 15px;
    }

    .panel-doppia-colonna-near {
        display: flex;
        margin-top: 15px;
        width: 100%;
        gap: 15px;
    }

    .panel-green {
        background-color: var(--brand-color);
        padding: 30px 15px;
    }

    .panel-green-round {
        background-color: var(--brand-color);
        padding: 30px 15px;
        border-radius: 10px;
        box-shadow: 0px 6px 12px #00000033;
    }

    .panel-blue {
        background-color: var(--blue-ribbon);
        border-radius: 10px;
        box-shadow: 0px 6px 12px #00000033;
    }

    .panel-blue-space {
        background-color: var(--blue-ribbon);
        border-radius: 10px;
        box-shadow: 0px 6px 12px #00000033;
        padding: 30px 45px
    }

    .testo-box-triplo {
        margin-top: var(--margin-dimension);
    }

    .line-double {
        height: 3px;
        margin-top: 14px;
        width: var(--with_43);
    }

    .panel-triple-no-padding-start {
        align-items: center;
        display: flex;
        flex-direction: column;
        width: 33%;
    }

    .panel-triple-no-padding {
        align-items: center;
        display: flex;
        flex-direction: column;
        margin-left: 90px;
        width: 33%;
    }


    .panel-white-left-center {
        background-color: var(--white);
        border-radius: 10px;
        box-shadow: 0px 6px 12px #00000040;
        padding: 15px;
        width: 50%;
        text-align: center;
    }

    .panel-white-right-center {
        background-color: var(--white);
        border-radius: 10px;
        box-shadow: 0px 6px 12px #00000040;
        padding: 15px;
        width: 50%;
        margin-left: 30px;
        text-align: center;
    }

    .tabella-scrollable {
        align-items: center;
        display: flex;
        flex-direction: column;
        padding: 30px 0;
        overflow-y: scroll;
        height: 400px;
        line-height: 60px;
    }

    .tabella-bianca-scrollable {
        align-items: center;
        background-color: var(--white);
        border-radius: 10px;
        box-shadow: 0px 6px 12px #00000040;
        display: flex;
        flex-direction: column;
        margin-top: var(--margin-dimension);
        padding: 30px 0;
        overflow-y: scroll;
        height: 400px;
    }

    .tabella-head {
        align-items: center;
        display: flex;
        width: 95%;
    }

    .tabella-column {
        width: 18%;
        margin-left: 30px;
    }

    .tabella-column-big {
        width: 46%;
    }

    .tabella-contenuti {
        margin-top: var(--margin-dimension);
        width: 95%;
    }

    .tabella-riga {
        align-items: center;
        display: flex;
        margin-top: 10px;
        margin-bottom: 5px;
        width: 100%;
    }

    .tabella-line-double {
        height: 1px;
        width: 95%;
        opacity: 0.2;
    }

    .panel-buttons-faq {
        margin-top: var(--margin-dimension);
        line-height: 30px;
        display: flex;
        gap: 50px;
    }



    .panel-quadruplo-start {
        align-items: center;
        display: flex;
        flex-direction: column;
        padding: 15px;
        width: var(--with_38);
        gap: 10px;
        background-color: var(--brand-color);
        padding: 30px 15px;
        border-radius: 10px;
        box-shadow: 0px 6px 12px #00000033;
    }

    .panel-quadruplo {
        align-items: center;
        display: flex;
        flex-direction: column;
        margin-left: 30px;
        padding: 15px;
        width: var(--with_39);
        gap: 10px;
        background-color: var(--brand-color);
        padding: 30px 15px;
        border-radius: 10px;
        box-shadow: 0px 6px 12px #00000033;
    }



    .linea-quadruplo {
        height: 3px;
        width: var(--with_47);
    }

    .panel-stretto {
        line-height: 16px;
    }

    .panel-interno-left {
        display: flex;
        flex-direction: column;
        width: 100%;
    }


    .panel-quadruplo-start-selected {
        align-items: center;
        display: flex;
        flex-direction: column;
        padding: 15px;
        width: var(--with_38);
        gap: 10px;
        background-color: var(--brand-color);
        padding: 30px 15px;
        border-radius: 10px;
        box-shadow: 0px 6px 12px #00000033;
        opacity: 0.5;
    }

    .panel-quadruplo-selected {
        align-items: center;
        display: flex;
        flex-direction: column;
        margin-left: 30px;
        padding: 15px;
        width: var(--with_39);
        gap: 10px;
        background-color: var(--brand-color);
        padding: 30px 15px;
        border-radius: 10px;
        box-shadow: 0px 6px 12px #00000033;
        opacity: 0.5;
    }

 


    .panel-content ul {
        list-style-type: disc;
    }

    .panel-white-tariffe {
        background-color: var(--white);
        border-radius: 10px;
        box-shadow: 0px 6px 12px #00000033;
        padding: 30px;
        width: 75%;
    }

    .panel-button {
        gap: 15px;
        display: flex;
        align-items: baseline;
    }

    .tabella-tariffe-scollable {
        align-items: center;
        padding: 30px 0;
        overflow-y: scroll;
        height: 400px;
        overflow-x: hidden;
        width: 100%
        margin-top: 15px;
    }


    .tariffe-frame-iniziale {
        height: 340px;
        margin-top: 60px;
        padding: 0 15px;
        position: relative;
        width: var(--with_79);
    }

    .tariffe-title {
        color: var(--text);
        font-weight: 900;
        left: 0;
        position: absolute;
        top: 0;
        width: var(--with_80);
    }

    .tariffe-sottotitle {
        color: var(--text);
        font-weight: 700;
        left: 0;
        line-height: 32.7px;
        position: absolute;
        top: 97px;
        white-space: nowrap;
        width: var(--with_80);
    }

    .tariffe-testo {
        left: 0;
        letter-spacing: 0;
        line-height: 30px;
        position: absolute;
        top: 160px;
        width: var(--with_80);
    }

    .tariffe-frame-risultato {
        border-radius: 10px;
        margin-top: 40px;
        width: var(--with_79);
        position: relative;
        background-color: var(--white);
        box-shadow: 0px 6px 12px #0000002e;
    }

    .tariffe-ricerca-frame {
        /* height: 220px;*/
        left: 30px;
        width: 100%;
        padding: 15px 15px;
    }


    .text-box-ricerca {
        background-color: var(--gray-nurse);
        border-radius: 10px;
        height: 45px;
        margin-top: 32px;
        width: var(--with_82);
        font-size: x-large;
    }

    .tariffe-button {
        margin-left: 55px;
    }

    .tariffe-letter-frame {
        background-color: var(--green);
        border-radius: 10px;
        height: 45px;
        margin-top: var(--margin-dimension);
        width: 100%;
    }
   
    .tariffe-letter-frame a {
        color: white;
    }

    .tariffe-destinazione-frame {
        min-height: 100px;
        margin-top: 25px;
        width: 100%;
        position: relative;
        margin-bottom: 90px;
    }

    .tariffe-destinazione-titoli {
        height: 47px;
        left: 10px;
        position: relative;
        top: 10px
    }

    .testo-titolo-left {
        color: var(--text);
        font-weight: 700;
        height: 35px;
        left: 0;
        line-height: 32.7px;
        position: absolute;
        top: 0;
        white-space: nowrap;
        width: var(--with_83);
    }

 

    .line-tariffe {
        height: 2px;
        left: 0;
        position: absolute;
        top: 46px;
        width: 100%;
    }


    .frame-singolo-risultato {
        border-radius: 10px;
        box-shadow: 0px 6px 12px #0000002e;
        left: 0;
        position: relative;
        margin-top: -35px;
        width: 100%;
    }


    .frame-risultato-nazione-first {
        background-color: var(--brand-color);
        border-radius: 10px;
        height: 61px;
        left: 0;
        position: relative;
        margin-top: var(--margin-dimension);
        width: 100%;
    }

    .frame-risultato-nazione {
        background-color: var(--brand-color);
        border-radius: 10px;
        height: 61px;
        left: 0;
        position: relative;
        margin-top: 70px;
        width: 100%;
    }

    .frame-bandiera-sinistra {
        height: 55px;
        left: 10px;
        position: absolute;
        top: 0;
        width: var(--with_84);
        color: var(--white);
    }





    .frame-sottorisultato {
        /*height: 72px;*/
        left: 22px;
        position: relative;
        margin-top: 20px;
        width: var(--with_85);
    }

    .frame-sottorisultato-destra {
        height: 55px;
        left: 400px;
        position: absolute;
        top: 0;
        width: var(--with_84);
    }


    .tariffe-prefisso {
        color: var(--blue-ribbon);
        position: relative;
        left: 10px;
        line-height: 30px;
        top: 20px;
        white-space: nowrap;
        width: 100%;
        margin-bottom: var(--margin-dimension);
        /*overflow: auto*/
    }

    .linea-sottorisultato {
        left: 22px;
        width: var(--with_86);
    }

    .frame-risultato-globale {
        /*min-height:200px;*/
    }

    .panel-faq-response {
        margin-top: 10px;
        color: var(--text);
        font-family: var(--font-family-karla);
        font-size: var(--font-size-l);
        font-style: normal;
        font-weight: 400;
        line-height: 25px;
    }

    .img-login {
        width: 100%;
        height: auto;
    }

    .img-register {
        width: 100%;
        height: auto;
    }

    .panel-register
    {
        width:100%;
    }

    .panel-mezzo {
        width: 50%;
    }
}
