html{
	width: 100%;
	height: 100%;
}

body{
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #111;
	margin: 0;
}
/* SURRENDER POPUP */
.surrwindow{
	height: 200px;
	width: 600px;
	background-color: #263335;
}

.surrwindow_wrapper{
	height: 250px;
	width: 650px;
	background-color: #263335;
	display: flex;
	justify-content: center;
	align-items: center;
}

.surrwindow_indidcators{
	display: flex;
	justify-content: space-around;
}

.surrwindow_indidcators_item{
	width: 115px;
	height: 30px;
}

.agreed {
	background-color: #008000;
}

.declined {
	background-color: #ff0000;
}

.empty {
	background-color: #666963;	
}

.surrwindow_timeline {
	margin-top: 10px;
	width: 100%;
	height: 10px;
	background-color: black;
}

.surrwindow_timeline_time {
	width: 100%;
	height: 100%;
	background-color: #b0fbfc;
}

.surrwindow_buttons {
	display: flex;
	justify-content: space-between;
	margin-top: 15px;
}

.surrwindow_buttons_item{
	width: 49%;
	height: 50px;
	background-color: #3c7e7a;
	text-align: center;
	vertical-align: center;
	color: #fbfcda;
	line-height: 50px;
}

.button_choosed{
	background-color: #234947;
}

.surrwindow_buttons_item:hover{
	background-color: #295552;
}

.surrwindow_header{
	width: 100%;
	text-align: center;
	color: #d6f6ee;
	font-size:  30px;
	vertical-align: center;
	padding: 10px;
}


/* DEFEAT POPUP */

.defeat {
	height: 250px;
	width: 650px;
	background-color: red;
	color: yellow;;
	display: flex;
	justify-content: center;
	align-items: center;
	display: none;
}


.defeat_text{
	font-size: 50px;
}