@charset "UTF-8";


/* MAIN */



/* MEDIA QUERY PER IMMAGINI DESKTOP + MOBILE MA NON SI ADATTANO PERCHE' IN COVER E SE HANNO SCRITTE MALE MALE */
/* .viewport-lg .img-copertina-home-container,
.viewport-xl .img-copertina-home-container,
.viewport-xxl .img-copertina-home-container
{
    background: url(../../res/img/hero-home-desktop.png) lightgray 0px / cover no-repeat;
}
.viewport-xs .img-copertina-home-container,
.viewport-sm .img-copertina-home-container,
.viewport-md .img-copertina-home-container
{
    background: url(../../res/img/hero-home-mobile.png) lightgray 0px / cover no-repeat;
} */



.img-copertina-home-container
{
    background: url(../../res/img/dgv_boooks-homepage.jpg) lightgray 0px / cover no-repeat;
    height: 550px;
    padding: 61px 96px;
    display: flex;
    flex-direction: row;
    justify-content: start;
    align-items: center;
    border-radius: 5px;
}


/*-----*/


/*

.img-copertina-home-container
{
    background-color: #fff;
}


.img-copertina-home-container img
{
    width: 100%;
    height: auto;
    border-radius: 5px;
}

.img-copertina-home-container img.img-desktop,
.img-copertina-home-container img.img-mobile
{
    width: 100%;
    height: auto;
}



.viewport-xs .img-copertina-home-container img.img-desktop,
.viewport-sm .img-copertina-home-container img.img-desktop,
.viewport-md .img-copertina-home-container img.img-mobile,
.viewport-lg .img-copertina-home-container img.img-mobile,
.viewport-xl .img-copertina-home-container img.img-mobile,
.viewport-xxl .img-copertina-home-container img.img-mobile
{
    display: none;
}

.viewport-lg .img-copertina-home-container img.img-desktop,
.viewport-xl .img-copertina-home-container img.img-desktop,
.viewport-xxl .img-copertina-home-container img.img-desktop,
.viewport-xs .img-copertina-home-container img.img-mobile,
.viewport-sm .img-copertina-home-container img.img-mobile,
.viewport-md .img-copertina-home-container img.img-desktop
{
    display: block;
}

*/




.img-copertina-home-container .contenuto-main
{
    background: transparent;
    max-width: 522px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
}



.img-copertina-home-container .contenuto-main .logo
{
    width: 120px;
}



.img-copertina-home-container .contenuto-main .frase-big
{
    color: #ffffff;
    font-family: "Noto Sans";
    font-size: 43px;
    font-style: normal;
    font-weight: 600;
    line-height: 45px;
    width: 100%;
    margin: 0px;
}


.img-copertina-home-container .contenuto-main .frase-small
{
    color: #ffffff;
    font-family: "Noto Sans";
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    max-width: 493px;
    margin: 0px;
}

.img-copertina-home-container .contenuto-main .frase-small .bold-part
{
    font-weight: 500;
}




/* .img-copertina-home-container .newsletter-blocco
{
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: 8px;
}


.img-copertina-home-container .newsletter-blocco .newsletter-email
{
    display: flex;
    width: 360px;
    height: 48px;
    padding: 10px 16px;
    align-items: center;
    gap: 4px;
}



.img-copertina-home-container .newsletter-blocco .newsletter-button
{
    background: var(--pls-button-primary-background);
    border: var(--pls-button-primary-border);
    color: var(--pls-button-primary-color);
    display: flex;
    border-radius: 5px;
    height: 48px;
    padding: 16px 32px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4px;
    font-weight: 500;
}


.img-copertina-home-container .newsletter-blocco .newsletter-button:hover
{
    background: var(--pls-button-primary-hover-background);
    border: var(--pls-button-primary-hover-border);
    color: var(--pls-button-primary-hover-color);
}


.img-copertina-home-container .newsletter-blocco .newsletter-button:active
{
    background: var(--pls-button-primary-active-background);
    border: var(--pls-button-primary-active-border);
    color: var(--pls-button-primary-active-color);
}


.img-copertina-home-container .newsletter-blocco .newsletter-button:focus
{
    background: var(--pls-button-primary-focus-background);
    border: var(--pls-button-primary-focus-border);
    color: var(--pls-button-primary-focus-color);
} */



.img-copertina-home-container .esplora-blocco,
.img-copertina-home-container .accedi-blocco
{
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: 8px;
}


.img-copertina-home-container .esplora-blocco .esplora-button,
.img-copertina-home-container .accedi-blocco .accedi-registrati-button
{
    background: var(--pls-button-primary-background);
    border: var(--pls-button-primary-border);
    color: var(--pls-button-primary-color);
    /* display: flex; */
    border-radius: 5px;
    /* height: 48px; */
    padding: 16px 32px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 4px;
    font-weight: 500;
    font-size: 16px;
}


.img-copertina-home-container .esplora-blocco .esplora-button:hover,
.img-copertina-home-container .accedi-blocco .accedi-registrati-button:hover
{
    background: var(--pls-button-primary-hover-background);
    border: var(--pls-button-primary-hover-border);
    color: var(--pls-button-primary-hover-color);
}


.img-copertina-home-container .esplora-blocco .esplora-button:active,
.img-copertina-home-container .accedi-blocco .accedi-registrati-button:active
{
    background: var(--pls-button-primary-active-background);
    border: var(--pls-button-primary-active-border);
    color: var(--pls-button-primary-active-color);
}


.img-copertina-home-container .esplora-blocco .esplora-button:focus,
.img-copertina-home-container .accedi-blocco .accedi-registrati-button:focus
{
    background: var(--pls-button-primary-focus-background);
    border: var(--pls-button-primary-focus-border);
    color: var(--pls-button-primary-focus-color);
}



/* SEZIONI */


.card-libro
{
    width: 220px;
}


.contenuto-sezioni .titolo-sezione-container
{
    display: flex;
    /* height: 33px; */ /* COMMENTATO PER FARLO "TORNARE" CON AUTORI E EDITORI IN EVIDENZA MESSI A RAZZO ACCANTO AGLI ALTRI LIBRI CHE SCORRONO */
    justify-content: space-between;
    align-items: center;
    align-self: stretch;
    margin-top: 54px;
}


.contenuto-sezioni .titolo-sezione-container:first-child
{
    margin-top: 66px;
}


.contenuto-sezioni .titolo-sezione-container .titolo-sezione
{
    color: #020202;
    font-size: 24px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    margin: 0;
}


.contenuto-sezioni .titolo-sezione-container a
{
    color: #7A7A7A;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    text-decoration: none;
}

.titolo-sezione-editori-evidenza,
.titolo-sezione-autori-evidenza
{
    padding-left: 20px;
}



.macroaree-container
{
    display: flex;
    justify-content: flex-start;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 24px;
}


.macroaree-container .macroaree-item
{
    display: flex;
    min-width: 281px;
    width: 281px;
    height: 100px;
    padding: 34px 66px;
    justify-content: center;
    align-items: center;
    gap: 10px;
    text-align: center;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 28px;
}

.macroaree-container a
{
    text-decoration: none;
    color: #020202;
    border-radius: 5px;
}

.macroaree-container a.categoria-FR
{
    background: #CDD9DE;
}

.macroaree-container a.categoria-FM
{
    background: #FAF0CA;
}

.macroaree-container a.categoria-FL
{
    background: #EAEED4;
}

.macroaree-container a.categoria-FFFH
{
    background: #D1E7DD;
}

.macroaree-container a.categoria-F
{
    background: #0D3B66;
}

.macroaree-container a.categoria-X
{
    background: #EE964B;
}

.macroaree-container a.categoria-A
{
    background: #F6EB8C;
}

.macroaree-container a.categoria-Y
{
    background: #577D76;
}

.macroaree-container a.categoria-F,
.macroaree-container a.categoria-Y
{
    color: #ffffff;
}


.novita-container,
.novita-generi-container,
.libri-affini-container,
.libri-visualizzati,
.ultime-uscite
{
    margin-top: 24px;
    overflow-x: scroll;
    display: flex;
    align-items: stretch;
    gap: 20px;
    align-self: stretch;
    min-width: 100%;
}





.titolo-sezione-container.librai .posizione
{
    display: inline-flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 4px;
    cursor: pointer;
}


.titolo-sezione-container.librai .posizione-link
{
    display: flex;
    align-items: center;
    gap: 16px;
}





.persone-lista-container
{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    overflow-y: scroll;
    max-height: 400px;
}

.persone-lista-container a
{
    cursor: pointer;
    text-decoration: none;
    width: 90%;
}


.persona
{
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    gap: 24px;
    border-bottom: 1px solid #E3E3E3;
    padding: 8px 0px;
    /*width: 90%;*/
}


.img img
{
    width: 75px;
    height: 75px;
    object-fit: cover;
    border-radius: 50%;
    max-width: 75px;
    max-height: 75px;
    overflow: hidden;
    border: 1px solid #eaeaea;
}


.info-stats
{
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    align-self: center
}


.info-stats span
{
    color: #020202;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
}


.info-stats span:first-child
{
    font-weight: 600;
}


.info-stats span:nth-child(2)
{
    color: #3D3D3D;
}








.testo-librerie-mappa
{
    color: #3D3D3D;
    font-family: "Noto Sans";
    font-size: 18px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    padding: 5px 15px;
    margin-top: -10px;
    margin-bottom: -10px;
}


.mappa-info-container
{
    display: inline-flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    align-self: stretch;
    gap: 24px;
    margin-top: 24px;
    margin-bottom: 94px;
    flex-wrap: wrap;
}

.mappa
{
    width: 640px;
    height: 430px;
    background: grey;
}


.lista
{
    width: 509px;
    height: 434px;
    padding: 11px 8px;
    background: #F4F4F4;
    overflow: hidden;
    overflow-y: scroll;
    display: flex;
    flex-direction: column-reverse;
}




.mappa-info-container .lista .voce-lista .dati .spedizione
{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 4px;
    background: #adebad;
    width: auto;
    padding: 0px 5px;
    border-radius: 5px;
    border: 2px solid #28A745;
}

.mappa-info-container .lista .voce-lista .dati .spedizione span
{
    color: #020202;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
}

.mappa-info-container .lista .voce-lista .dati .spedizione img
{
    width: 14px;
    height: 14px;
}


.mappa-info-container .lista .voce-lista
{
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 4px 8px;
    gap: 8px;
    border-radius: 5px;
    transition: 0.2s;
    border: 1px solid #E3E3E3;
    background: #ffffff;
}

.mappa-info-container .lista .voce-lista:hover
{
    background: #eaeaea;
    cursor: pointer;
}




.mappa-info-container .lista .voce-lista .dati {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 4px;
    flex-grow: 1;
}



.mappa-info-container .lista .voce-lista span:first-child{
    color: #020202;
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
}

.mappa-info-container .lista .voce-lista span:nth-child(2){
    color: #3D3D3D;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
}


.mappa-info-container .lista .voce-lista img.libreria-icona{
    width: 54px;
    height: 54px;
    background: #eaeaea;
    object-fit: cover;
    border-radius: 50%;
    border: 1px solid #eaeaea;
}


.mappa-info-container .lista .voce-lista .segui-libreria
{
    cursor: pointer;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    padding:2px;
}

.mappa-info-container .lista .voce-lista .segui-libreria:hover
{
    background: rgba(244, 211, 94, 1);
}


.mappa-info-container .lista .voce-lista.focus
{
    background: rgba(244, 211, 94, 0.83);
}











@media screen and (max-width: 1400px) {

    .macroaree-container
    {
        overflow-x: scroll;
        flex-wrap: nowrap;
    }

    .macroaree-container .macroaree-item
    {
        height: 150px;
    }

}


@media screen and (max-width: 992px) {

    .mappa-info-container
    {
        width: 100%;
    }

    .mappa
    {
        width: 100%
    }


    .lista
    {
        width: 100%;
    }


    .persone-lista-container
    {
        max-height: 420px;
    }

}


@media screen and (max-width: 768px) {


    .img-copertina-home-container
    {
        background: url(../../res/img/dgv_boooks-homepage.jpg) lightgray 50% / cover no-repeat;
        height: auto;
        border-radius: 0px;
        padding: 96px 16px;
    }

    /*.img-copertina-home-container .newsletter-blocco
    {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        gap: 10px;
        width: 100%;
    }

    .img-copertina-home-container .newsletter-blocco .newsletter-email,
    .img-copertina-home-container .newsletter-blocco .newsletter-button
    {
        width: 100%;
    }*/

}


.mappa-info-container  .input-group
{
    border-radius: 25px;
    overflow: hidden;
    border: 1px solid #dee2e6;
}


.mappa-info-container .input-group input
{
    border: none;
}

.mappa-info-container .input-group button:active
{
    color: var(--pls-button-secondary-active-background);
    background: white;
    border-color: transparent;
}

.mappa-info-container .input-group .form-control:focus{
    box-shadow: none;
}
