/* RESETTER */
* {
	padding: 0;
	margin: 0;
	
	box-sizing: border-box;
}
/*
*, ::before, ::after { 
	box-sizing: inherit;
}
*/

.clear {
	clear: both;
}
.hidden {
	display: none;
}

/* MAIN ELEMENTS */
HTML {
	width: 100%;
	
	font-size: 14px;
	line-height: 16px;
}
BODY {
	width: 100%;

	background-color: #404040;
	
	font-family: "Roboto", sans-serif;
	font-weight: 200;
	color: #FFFFFF;
}

/* HEADER */
header {
	width: 100%;
}

/* MAIN */
main {
	width: 100%;
	height: 100%;
}

/* MODAL */
.modal {
	position: absolute;
	
	top: 0px;
	left: 0px;
	
	width: 100%;
	height: 100%;
}
.modal .background {
	position: absolute;
	
	top: 0px;
	left: 0px;
	
	width: 100%;
	height: 100%;
	
	z-index: 10;
	
	opacity: 0.7;
	background-color: #000000;
}
.modal .content {
	position: absolute;
	
	top: 0px;
	left: 0px;
	
	width: 100%;
	height: 100%;
	
	z-index: 20;
}
.modal .content .flex-row {
	height: 100%;

	justify-content: center;
	align-items: center;
}
.modal .content .flex-row .flex-item span {
	color: #ffffff;
	font-size: 15rem;
}