.dialog-success-sign{font-family: Arial;font-weight: bolder;}
/* The dark background behind the dialogs */

.dialog-overlay{display:none;position:fixed;top:0;left:0;right:0;bottom:0;width:100%;height:100%;background-color:rgba(0,0,0,0.3);z-index:10000;}

/* The dialogs themselves */

.dialog-card{box-sizing:border-box;width:570px;position:absolute;left:50%;margin-left:-285px;top:50%;margin-top:-150px;font:bold 14px sans-serif;border-radius:3px;background-color:#ffffff;box-shadow:1px 2px 4px 0 rgba(0, 0, 0, 0.12);padding:45px 50px;z-index: 100005}
.dialog-card .dialog-success-sign,
.dialog-card .dialog-question-sign,
.dialog-card .dialog-error-sign   {float:left;width:68px;height:68px;border-radius:50%;color:#ffffff;text-align:center;line-height:68px;font-size:40px;margin-right:50px;}
.dialog-card .dialog-success-sign {background-color:#bbda9c;}
.dialog-card .dialog-error-sign   {background-color:#f59087;}
.dialog-card .dialog-question-sign{background-color:#b4d8f3;}
.dialog-card .dialog-info{float:left;max-width:350px;}
.dialog-card p{		/* Dialog text */  line-height:21px; margin:30px 0;}
.dialog-card h5{	/* Dialog title */ color:#383c3e;font-size:24px;margin:5px 0 30px;}
.dialog-card .user-data{ color:#595d60;font-weight:normal;line-height:21px;margin: 0;}
.dialog-card .dialog-confirm-invitation-button,
.dialog-card .dialog-confirm-button{font-weight:inherit;background-color:#87bae1;box-sizing:border-box;color:#ffffff;box-shadow:0 1px 1px 0 rgba(0, 0, 0, 0.12);padding:12px 32px;border:0;cursor:pointer;outline:0;}
.dialog-card button:hover{opacity:0.96;}
.dialog-card button:active{position:relative;bottom:-1px;}
.dialog-card input{	/* The text box */ box-sizing:border-box;width:285px;padding:12px 15px;box-shadow:1px 2px 1px 0 rgba(0, 0, 0, 0.1);border:1px solid #cbcbcb;color:#555;font-weight: normal;}

/* If you don't want the dialogs to be responsive, remove these media queries */

@media (max-width:600px) {
    .dialog-card{width:350px; margin-left:-175px; text-align:center;padding:45px 50px;}
    .dialog-card .dialog-question-sign,
    .dialog-card .dialog-success-sign,
    .dialog-card .dialog-error-sign{float:none;margin:0 auto 25px;}
    .dialog-card .dialog-question-sign,
    .dialog-card .dialog-info{float:none; }
    .dialog-card p{text-align:left; }
    .dialog-card input{width: 100%;}
}

@media (max-width:400px) { .dialog-card{width:250px;margin-left:-125px; padding:25px 30px;} }

.conditions-button,
.dialog-show-button{cursor:pointer;}
.conditions-button:hover,
.dialog-show-button:hover{color:red !important;}


/***************************************/



.dialog-info-card{box-sizing:border-box;display:block;position:absolute;width:1024px;/*margin:0 auto;*/ top:40px;  bottom:40px; border-radius:3px;background-color:#ffffff;box-shadow:1px 2px 4px 0 rgba(0, 0, 0, 0.12);padding:45px 50px;overflow-y: scroll;}
.dialog-info-card .dialog-success-sign,
.dialog-info-card .dialog-question-sign,
.dialog-info-card .dialog-error-sign   {float:left;width:68px;height:68px;border-radius:50%;color:#ffffff;text-align:center;line-height:68px;font-size:40px;margin-right:50px;}
.dialog-info-card .dialog-success-sign {background-color:#bbda9c;}
.dialog-info-card .dialog-error-sign   {background-color:#f59087;}
.dialog-info-card .dialog-question-sign{background-color:#b4d8f3;}
.dialog-info-card .dialog-info{/*float:left;*//*max-width:350px;*/}
.dialog-info-card p{		/* Dialog text */ display:block;  }
.dialog-info-card .dialog-info{max-width:1024px;margin:0 auto;}
.dialog-info-card .dialog-info>*{padding-left:120px;/*line-height:1em;*/}
.dialog-info-card h5{	/* Dialog title */ color:#383c3e;font-size:24px;margin:5px 0 30px;}
.dialog-info-card .user-data{ color:#595d60;font-weight:normal;line-height:21px;margin: 0;}
.dialog-info-card .dialog-confirm-button{font-weight:inherit;background-color:#87bae1;box-sizing:border-box;color:#ffffff;box-shadow:0 1px 1px 0 rgba(0, 0, 0, 0.12);padding:12px 100px;border:0;cursor:pointer;outline:0;float:right;}
.dialog-info-card button:hover{opacity:0.96;}
.dialog-info-card button:active{position:relative;bottom:-1px;}
.dialog-info-card .dialog-info ul {list-style-type:none;}

/* If you don't want the dialogs to be responsive, remove these media queries */

@media (max-width:600px) {
    .dialog-info-card{width:350px; margin-left:-175px; text-align:center;padding:45px 50px;}
    .dialog-info-card .dialog-question-sign,
    .dialog-info-card .dialog-success-sign,
    .dialog-info-card .dialog-error-sign{float:none;margin:0 auto 25px;}
    .dialog-info-card .dialog-question-sign,
    .dialog-info-card .dialog-info{float:none; }
    .dialog-info-card p{text-align:left; }
    .dialog-info-card input{width: 100%;}
}

@media (max-width:400px) { .dialog-info-card{width:250px;margin-left:-125px; padding:25px 30px;} }