body {
	font-family: 'Roboto', Ariel, sans-serif;
	color: white;
	margin: 0; }
/* PAGE INFO style */
.info {
	padding: 1rem 20%;
	background-color: #A1B0B8; }
.info h3 {
	text-align: center; }
.info a {
	color: #242e40; }

/* HEADER style */
header {
	margin-top: 2rem; }
header a, footer a {
	color: #2e2e2e;
	cursor: pointer;
	text-decoration: none; }
header ul, footer ul {
	list-style: none; }
header li, footer li {
	display: inline-block;}
.small_menu {
	display: none; }
.social_media, 
.logo, 
.shop {
	display: inline-block;
	float: left; }
.social_media, 
.shop {
	width: 30%; }
.logo {
	width: 40%;
	text-align: center; }
.shop {
	text-align: right;
	margin: 16px 0; }
.shop .fa {
	margin-right: 30px;}
header .fa, footer .fa {
	font-size: 20px;
    padding: 5px;
    min-width: 20px;
    border: 1px solid #2e2e2e;
    text-align: center; }
header .social_media ul {
	padding-left: 30px }
.social_media li {
	padding-right: 10px; }
a.facebook:hover {
	color: #3b5998; }
a.instagram:hover {
	color: #bc2a8d; }
a.twitter:hover {
	color: #1da1f2; }

.menu, 
.submenu {
	width: 100%;
	text-align: center;
	clear: left; }
.menu {
	padding-top: 1rem; }
.submenu {
	padding-top: 0.5rem;
	padding-bottom: 2rem; }
.menu a,
.submenu a {
	text-decoration: none; }
.menu ul,
.submenu ul {
	padding-left: 0; }
.menu li,
.submenu li {
	text-transform: uppercase;
	margin: 0 45px; }
.menu li {
	font-size: 1.5rem; } 
.submenu li {
	font-size: 1.2rem; }
.menu .active,
.submenu .active {
	text-decoration: underline; }
.menu a:hover,
.submenu a:hover {
	text-decoration: underline; } 

/* FOOTER style */
footer {
	margin: 2rem 0; }
footer .fa {
	border: none; }
footer .social_media {
	width: 100%;
	text-align: center; }
footer .social_media ul {
	padding-left: 0;
	margin: 5px 0; }
footer .contact {
	text-align: center;
	text-decoration: none; }
footer .contact p {
	margin: 5px 0; }
footer .social_media li {
	padding: 0; }

/* Medium screen - tablet */
@media screen and (max-width: 800px) {
	.menu li, .submenu li {
		margin: 0 30px; }
	.menu li {
		font-size: 1.2rem; }
	.submenu li {
		font-size: 1rem;
		margin: 0 30px; }
	.logo img {
		width: 80%; }
	.info {
		padding: 1rem 2%; }
}

/* Small screen - phone */
@media screen and (max-width: 650px) {
	.large_menu {
		display: none; }
	.small_menu {
		display: block;
		padding-bottom: 2rem;	}
	.logo {
		width: 70%; }
	#menu_bar, #menu_close {
		width: 30%;
		text-align: right;
		display: inline-block; }
	#menu_close {
		display: none; }
	#menu_bar .fa, #menu_close .fa {
		margin-right: 15px; }
	.menu_over {
		background-color: rgba(255,255,255,0.9);
		position: absolute;
		margin-top: 2rem;
		padding-top: 0.5rem;
		padding-bottom: 1rem;
		width: 100%; 
		text-align: center;
		display: none; }
	.menu_over ul {
		padding-left: 0;
		margin: 0; }
	.menu_over li {
		display: block; }
	.menu {
		padding-top: 0.5rem; }
	.submenu {
		padding-bottom: 0.5rem; }
	.info p, .info a, .info li {
		font-size: 14px; }
}