@charset "ISO-8859-1";


body {
	margin: 0;
	background-color: #333;
	padding: 20px 0;
}

input {
	background-color: #333;
}

p, a, ul, div, input, button {
	font-family: 'Montserrat', sans-serif;
	font-size: 1.05em;
	color: #fff;
}

button {
	
	padding: 10px 20px; 
	background-color: #03a9f4; 
	border: 0px solid #333; 
	border-radius: 3px; 
	
}

button:hover { 
	background-color: #0095d8; 
} 

#chronotime {
	border: none;
    width: 100px;
}

.bottom {
	display: flex;
	justify-content: space-between;
}

.container {
	width: 650px;
	margin: auto;
}

.flex {
	display: flex;
	justify-content: space-evenly;
	flex-wrap: wrap;
}



.inner {
	position: relative;
	height: 100%;
	transition: transform 0.4s;
}

.inner p {
	font-size: 3em;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0;
}




.modal {
	display: none; 
	position: fixed; 
	padding-top: 100px; 
	top: 0;
	width: 100%; 
}

.modal-content {
	background-color: #111111;
	margin: auto;
	padding: 20px;
	border: 1px solid #333;
	width: 40%;
	text-align: center;
	
}

.close {
	color: #aaaaaa;
	float: right;
	font-size: 28px;
	font-weight: bold;
}

.close:hover,
.close:focus {
	color: #000;
	text-decoration: none;
	cursor: pointer;
}