/*****************************************************************************************************************************/
#notif-show0,
#notif-show,
#notif-show2,
#notif-show3{
position: fixed;
top: 0;
left: 0;
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100%;
background: rgba(15, 15, 15, 0.897);
z-index: 15;}
/*---------------------------------------------------------------------------------------------------------------------------*/
#notif-hidden0,
#notif-hidden,
#notif-hidden2,
#notif-hidden3{
display: none;}
/*****************************************************************************************************************************/
#notif-content,
#notif-content2{
width: 420px;
height: 200px;
max-width: calc(100vw-20px);
max-height: calc(100vh-20px);
border-radius: 10px;
margin-bottom: 70px;
filter: drop-shadow(0 0 6px rgba(0, 0, 0, 0.308));
border-style: solid;
border-width: 7px;
border-color: #1a1a1a;
background: #292929;
background: -webkit-linear-gradient(to bottom, #292929, #242424);
background: linear-gradient(to bottom, #292929, #242424);}
/*---------------------------------------------------------------------------------------------------------------------------*/
#notif-close0,
#notif-close,
#notif-close2{
float: right;
padding-top: 4px;
padding-right: 4px;
font-size: 19px;
font-family: Arial, Helvetica, sans-serif; 
cursor: pointer;}
/*****************************************************************************************************************************/
.centre{
width: 100%;
height: 50%;
text-align: center;}
/*---------------------------------------------------------------------------------------------------------------------------*/
#notif-text,
#notif-text2{
margin-top: 25px;
padding-top: 55px;
padding-bottom: 55px;
font-size: 15px;
letter-spacing: 1.6;
font-family: 'Times New Roman', Times, serif;}
/*---------------------------------------------------------------------------------------------------------------------------*/
#error{
position: absolute;
margin-top: 68px;
margin-left: 30px;
opacity: 0.8;}
/*---------------------------------------------------------------------------------------------------------------------------*/
.decale{
padding-left: 42px;}
/*---------------------------------------------------------------------------------------------------------------------------*/
.notif-close-bleu:hover{
color: #4cb1ff;
font-weight: bolder;
transform: scale(1.2);}
/*---------------------------------------------------------------------------------------------------------------------------*/
.notif-close-vert0:hover,
.notif-close-vert:hover{
color: #2faf5a;
font-weight: bolder;
transform: scale(1.2);}
/*---------------------------------------------------------------------------------------------------------------------------*/
.notif-close-rouge0:hover,
.notif-close-rouge:hover{
color: #e92f2f;
font-weight: bolder;
transform: scale(1.2);}
/*---------------------------------------------------------------------------------------------------------------------------*/
.notif-close-gradient1:hover{
color: #4f94cc;
font-weight: bolder;
transform: scale(1.2);}
/*---------------------------------------------------------------------------------------------------------------------------*/
#ok-bleu0,
#ok-vert0,
#ok-rouge0,
#ok-bleu,
#ok-vert,
#ok-rouge,
#ok-gradient1,
#ok-gradient2{
width: 92%;
margin-right: 4%;
margin-left: 4%;
background-color: #181818; 
color: white;
border: none;
border-radius: 8px;
padding-top: 6px;
padding-bottom: 8px;
cursor: pointer;
line-height: 18px;}
/*---------------------------------------------------------------------------------------------------------------------------*/
#ok-bleu0:hover,
#ok-bleu:hover{
background-color: #4cb1ff85;}
#ok-vert0:hover,
#ok-vert:hover{
background-color: #2faf5a91;}
#ok-rouge0:hover,
#ok-rouge:hover{
background-color: #e92f2f8c;}
#ok-gradient1:hover,
#ok-gradient2:hover{
background: linear-gradient(to bottom, #3f75a1, #193144);}

/*///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
@media screen and (min-width: 2560px) and (min-height: 1440px) /* 2560 x 1440 */
{
    #notif-content,
    #notif-content2{
    width: 570px;
    height: 270px;}

    #notif-text,
    #notif-text2{
    margin-top: 55px;
    padding-top: 50px;
    padding-bottom: 60px;
    font-size: 20px;}
    
    #notif-close,
    #notif-close2{
    font-size: 30px;}

    #error{
    width: 40px;
    margin-top: 88px;
    margin-left: 34px;
    opacity: 0.8;}

    #ok-bleu,
    #ok-vert,
    #ok-rouge,
    #ok-gradient1{
    height: 30px;
    font-size: 20px;
    /*width: 87%;*/
    border-radius: 10px;}
}
/*///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
@media screen and (max-width: 414px) and (max-height: 896px) /* iphone 11 FRONT */
{
    #notif-content,
    #notif-content2{
    width: 370px;}
}
/*---------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 896px) and (max-height: 414px) /* iphone 11 SIDE */
{
    #notif-content,
    #notif-content2{
    margin-bottom: 0px;}
}
/*///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
@media screen and (max-width: 375px) and (max-height: 667px) /* iphone 6-7-8 FRONT */
{
    #notif-content,
    #notif-content2{
    width: 310px;
    height: 170px;}

    #notif-text,
    #notif-text2{
    margin-top: 13px;
    padding-bottom: 22px;}
}
/*---------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width: 667px) and (max-height: 375px) /* iphone 6-7-8 SIDE */
{
}
/*///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/
/*
@media screen and (max-width: 375px) and (max-height: 812px) // iphone 10 FRONT
{
}
@media screen and (max-width: 812px) and (max-height: 375px) // iphone 10 SIDE
{
}
*/
/*///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/