body { margin: 0 auto; padding: 0; max-width: 100%; color: #111111; }

body,
h2,
p,
a { font-family: 'Open Sans', sans-serif;  }

h3 { font-family: 'Roboto', sans-serif; } 

.content,
.footer-container { margin: 0px auto; max-width: 1075px; }

header {  }
.nav { height: 80px; }

.logo { width: 570px; height: 300px; margin: 0 auto; }
img { max-width: 100%; }

.container { float: left; width: 100%; }
.contact { float: left; width: 100%; margin-top: 65px; }
.left,
.middle,
.right { float: left; }

.left, 
.right { width: 23%; }
.left { margin-left: 2%; }
.right { margin-right: 2%; }
.middle { text-align: center; width: 50%; }

h2 { font-size: 1.875rem; font-weight: 400; }
h3 { font-size: 1.25rem; font-weight: 400; line-height: 1.2; }
p { font-size: 1rem; line-height: 1.6; margin: 0; padding: 0; }
p.small { font-size: 0.75rem; margin-top: 10px; }

.store { float: left; width: 100%; margin-top: 100px; }
.store-list { text-align: center; width: 50%; margin: 0px auto;}
.store-list img { object-fit: cover; width: 100%; max-height: 377px; margin-bottom: 20px; }
.store-content { text-align: left; }
.store-list a { float: left; color: #ffffff; background-color: #e68387; border-radius: 4px; 
	text-decoration: none; padding: 12px 30px; margin-top: 45px; }
.store-list a:hover { background: #e0656a; }

footer { background: #333333; float: left; width: 100%; color: #ffffff; margin-top: 130px; }
.footer-container { padding: 40px 0; text-align: center; }
.footer-container p { font-size: 0.875rem; }


@media only screen and (min-width: 280px) and (max-width: 1050px) { 
	.logo { width: 100%; height: auto; }
	.left, 
	.right,
	.middle { width: calc(100% - 40px); margin: 20px; text-align: center; }	
	h2 { margin: 0; }
	.store-list { width: 90%; }
}