* {
	margin: 0;
	padding: 0;
}

@font-face {
  font-family: 'digital-7';
  src: url('./digital-7.regular.ttf');
}

#body {
	background-color: #f5f5f5;
}

.main_body {

	position: fixed;
  	top: 48%;
  	left: 50%;
  	/* bring your own prefixes */
  	transform: translate(-50%, -50%);
  	background-color: #e6e6e6;
  	height: 42%;
  	width: 60%;
  	color: #3d3d3d;
  	border-radius: 9px;
  	padding: 3% 0;
  	box-shadow: inset 0 0 5px #c5c5c5;
}

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

.main_body .days h4 {
	font-size: 1.1rem;
	color: #c5c5c5;
}

.main_body .time {
	text-align: center;
	font-family: 'digital-7', sans-serif;
}

.main_body .time h1 {
	font-size: 8rem;
	margin: 2.6% 0;
}


.main_body .time .time_sub {
	transform: translate(205px, -108px);
	display: flex;
	flex-direction: column;
	color: #c5c5c5;
}

.switchs p {
	cursor: pointer;
}


@media (max-width: 600px) {
	.main_body {
	  	top: 50%;
	  	left: 50%;
	  	height: 25%;
	  	width: 90%;
	}

	.main_body .time h1 {
		font-size: 4.8rem;
		margin-top: -7.5%;
	}

	.main_body .time .time_sub {
		transform: translate(5px, -18px);
		display: block;
	}

}