@charset "utf-8";

/*
.message-box-container,
.message-box {
	height: 100px;
	position: relative;
	width: 100px;
	border-radius: 100%;
}
*/
.message-box-container
{
	padding: 12px 12px;
	background: #535353;
	/*
	height: 100px;
	position: relative;
	width: 100px;
	border-radius: 100%;
	*/
}


.message-box-container {
	/*margin: 0 auto;*/
}

.message-box-mask {
	position: absolute;
	left: 0;
	top: 0;
	
	width: 100%;
	height: 100%;
	
	background-color: rgba(0,0,0,0.50);
	
	display: flex;
	flex-direction:column;
	justify-content: center;
 	align-items: center;

	z-index: 999999;
}

.message-box-wrap {
	/*border: 1px solid #000000;*/
	padding: 1px;
	background: #000000;
	
	/*
	box-shadow: 0 1px 12px #2d2d2d;
	*/
	/*
	box-shadow: 0 1px 2px 0 rgb(60 64 67 / 30%), 0 1px 3px 1px rgb(60 64 67 / 15%);
	*/
	
	box-shadow: 0 1px 2px 0 rgba(60,64,67,0.70), 0 1px 3px 1px rgba(60,64,67,0.60);
}

.message-box-caption {

	position: relative;
	
	/*padding: 5px;*/
	
	height: 30px;
	
	min-width: 300px;
	
	font-size: 13px;
	/*font-weight: bold;*/
	/*color: #ffffff;*/
	color: #000000;
	background: #ffffff;
	
	white-space: nowrap;

	/*margin-bottom: 10px;*/
}

.message-box-caption div {
	position: absolute;
	left: 6px;
    top: 50%;
    
    transform: translateY(-50%);
    /*transform: translateY(calc(-50% + 1px));*/
    /*transform: translate(0%, -50%);*/
    
    /*bottom: 0;*/
}

.message-icon-box {
	/*width: 48px;*/
	/*height: 46px;*/
	width: 43.2px;
	height: 41.4px;
}


.message-box-text {
	display: inline-block;
	margin-left: 17px;
	margin-right: 17px;
	
	font-size: 13px;
	font-weight: 200;
	color: #ffffff;
	vertical-align: top;
}

.message-box-button-box {
	margin-top: 5px;
	text-align: right;
}

.message-box-button-box button {
	
	position: relative;
	
	margin-left: 12px;
	
	/*padding: 1px;*/
	
	width: 80px;
	height: 23px;
	
	font-size: 13px;
	font-weight: 300;
	
	color: #ffffff;

	border: 1px solid #ffffff;
	border-radius: 11.5px;
}

.message-box-button-box button div {
	
	position: absolute;
	left: 0;
    top: 2px;
    right: 0;
    bottom: 0;
    
    pointer-events: none;
}


.message-box-button-box button:hover {

	color: #535353;
	
	background: #ffffff;
}

.message-box-button-box button:active {
	
	color: #535353;
	
	background: #bdbdbd;

	border-color: #bdbdbd;
}

.message-box-button-box button._selected {
	
	color: #ffffff;
	
	background: #42a5f5;

	border-color: #2196f3;
}

.message-box-button-box button._selected:active {
	
	color: #535353;
	
	background: #bdbdbd;

	border-color: #bdbdbd;
}



.message-box-string {
	/*
	-moz-animation: loading-text-opacity 2s linear 0s infinite normal;
	-o-animation: loading-text-opacity 2s linear 0s infinite normal;
	-webkit-animation: loading-text-opacity 2s linear 0s infinite normal;
	animation: loading-text-opacity 2s linear 0s infinite normal;
	*/

	color: #ffffff;
	font-family: "Helvetica Neue, "Helvetica", ""arial";
	font-size: 10px;
	font-weight: bold;
	margin-top: 45px;
	opacity: 0;
	position: absolute;
	text-align: center;
	text-transform: uppercase;
	top: 0;
	width: 100px;
}


/*
.message-box-text {
	-moz-animation: loading-text-opacity 2s linear 0s infinite normal;
	-o-animation: loading-text-opacity 2s linear 0s infinite normal;
	-webkit-animation: loading-text-opacity 2s linear 0s infinite normal;
	animation: loading-text-opacity 2s linear 0s infinite normal;
	color: #ffffff;
	font-family: "Helvetica Neue, "Helvetica", ""arial";
	font-size: 10px;
	font-weight: bold;
	margin-top: 45px;
	opacity: 0;
	position: absolute;
	text-align: center;
	text-transform: uppercase;
	top: 0;
	width: 100px;
}
*/