.app_grid {
	display: grid;
}
.app_feature>div {
	padding: 10px 10px;
	cursor: pointer;
}
.app_feature>div:hover { 
	background-color: #DDD;
}
.c1 { grid-column: 1; }
.c3 { grid-column: 3; }
.c1>div { border-top-left-radius: 10px;  border-bottom-left-radius: 10px;  padding-right: 20px; }
.c3>div { border-top-right-radius: 10px; border-bottom-right-radius: 10px; padding-left: 20px; }
.r1 { grid-row: 1; margin-top: 45px; }
.r2 { grid-row: 2; }
.r3 { grid-row: 3; }

h1,h2,h3 { font-family: Aleo; }
h2 { text-align: center; margin-top: 30px; margin-bottom: 20px; }

#app_buttons { font-family: Aleo; font-size: large; text-align: center; margin-top:40px; }
#app_buttons .gapped { margin-left: 40px; }
#app_buttons .app_store_logo { width: 150px; }
#app_buttons .play_store_logo { width: 180px; }

.phone_centre { grid-column: 2; grid-row: 1/span 3; }
#phone_frame { width: 300px; }
#app_image { width:265px;margin-top:18px;margin-left:18px; }

@media screen and (max-width: 48.9999em) {
	.r1 { margin-top: 0; }
	#phone_frame { width: 200px; }
	#app_image { width:178px;margin-top:10px;margin-left:10px; }
}

@media screen and (max-width: 38.9999em) {
	.app_feature { font-size: smaller; }
	.app_feature>div:hover { background-color: white; }
	#app_buttons .gapped { margin-left: 20px; }
}

@media screen and (max-width: 28.9999em) {
	.phone_centre { align-self: center; }
	.c3.r1 { grid-column: 1; grid-row: 4; }
	.c3.r2 { grid-column: 1; grid-row: 5; }
	.c3.r3 { grid-column: 1; grid-row: 6; }
	.c3>div { padding-left: 10px; padding-right: 20px; }
}

@media screen and (max-width: 24.9999em) {
	#app_buttons .app_store_logo { width: 125px; }
	#app_buttons .play_store_logo { width: 150px; }
}