
alert #overlay, alert #overlay-confirm{
    position:fixed;
    z-index:9998;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    background-color:#000;
    opacity:0.7;
    display: none;
}
alert #alertPanel, alert #confirmPanel{
    position:absolute;
    top: 30vh;
    min-height: 170px;
    width: 50vw;
    margin-left: 25vw;
    z-index:9999;
    color:#000;
    border:1px solid #303030;
    border-radius: 5px;
    background-color:#eaeaea;
    display: none;
    text-align: center;
    font-size: 14px;
    font-weight:100%;
    margin-bottom: 20px;

}
alert #alertPanel h2, alert #confirmPanel h2{
    font-weight:100%;
    font-size:22px;
    padding:15px 0px 15px 15px;
    text-align:center;
    text-shadow:1px 1px 1px #000;
    margin:0px;
    background-color: #323232;
    background-image: url('../img/polygone-auto-mooving-sts.png');
    background-size: cover ;
    border:2px solid #fff;
    -moz-box-shadow:0px 0px 8px #000;
    -webkit-box-shadow:0px 0px 8px #000;
    box-shadow:0px 0px 8px #000;
    color: #FFFFFF;
}
alert div.texte{
    width: 540px;
    display:inline-block;
    padding:20px 0px 10px 0px;
    word-wrap: break-word;
    text-align: center;

}
alert div.texte strong{
    color: #ff0000;
}
alert div.texte hr{
    color: var(--greenLogo);
    height: 3px;
}
alert span.close{
    background: url('../img/btnClose.png') no-repeat center center;
    background-size: contain;
    cursor:pointer;
    height:32px;
    width:32px;
    position:absolute;
    right:12px;
    top:12px;
    cursor:pointer;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    opacity:1.0;
}


@media (max-width: 768px){

    alert #alertPanel, alert #confirmPanel{
        margin-left: 0;
        width: 100%;
    }
    alert #alertPanel h2, alert #confirmPanel{
        font-size: 18px;
    }
    alert div.texte{
        width: 100%;
    }
}