/*#panneau-pocket{
	width: 145px;
    height: 52px;
    display: block;
    transition: right 0.3s ease 0s;
    position: fixed;
    top: 130px;
    right: -100px;
    box-shadow: #2a4753 0px 0px 2px;
    border-radius: 2px;
    overflow: hidden;
    z-index: 900;
}

#panneau-pocket img{height:52px;}
*/

#panneau-pocket:hover{
	right:0px;
}


#panneau-pocket {
    width: 256px;
    height: 80px;
    display: block;
    transition: right 0.3s ease 0s;
    position: fixed;
    top: 180px;
    right: -180px;
    box-shadow: #2a4753 0px 0px 2px;
    border-radius: 2px;
    overflow: hidden;
}


/* WIDGET */
 #panneaupocket {
        height: 90px;
        left: 0px;
        position: fixed;
        bottom: 0px;
        width: 270px;
        z-index: 998;
        transition: height ease-out 0.5s;
    }

    #panneaupocket.open {
        height: 560px;
        transition: height ease-in 0.5s;
    }

    #cityWidget {
        width: 100%;
        height: 100%;
    }

    #pptoggle {
        position: absolute;
        width: 100%;
        height: 90px;
        top: 0;
        left: 0;
        cursor: pointer;
        z-index: 999
    }

    #ppclose {
        position: absolute;
        width: 20px;
        height: 20px;
        top: 0px;
        right: 0px;
        cursor: pointer;
        background-color: var(--top-button-background-color, var(--paletteColor3));
        z-index: 999;
        opacity: 0;
        transition: opacity ease-out 0.5s
    }

    #panneaupocket.open #ppclose {
        opacity: 1;
        transition: opacity ease-in 0.5s
    }

    @media (max-width: 999.98px) {
        #panneaupocket {
            display: none
        }
    }