* {
	box-sizing:border-box;
	margin:0px;
	padding:0px;
	text-decoration:none;
	font-size:auto;
	font-family:Verdana;
}

html {
	height:100%;
}

body {
	background:linear-gradient(180deg, #F3F3F4 0%, rgba(255,255,255,1) 50%) no-repeat white;
	min-height:100%;
	display:flex;
	flex-direction:column;
}

a {
	color:#B0936A;
	text-decoration:none;
}

header {
	position:fixed;
	display:flex;
	flex-direction:row;
	justify-content:space-around;
	align-content:center;
	top:0;
	left:0;
	width:100%;
	border-bottom:1px solid grey;
	box-shadow:0px 2px 5px rgba(0, 0, 0, 0.7);
	background-color:white;
}



header > div.logo > img {
	cursor:pointer;
	height:100px;
	margin:20px;
}

footer {
	background-color:#000528;
	color:white;
	margin:0px;
	padding:10px;
	margin-top:65px
	flex-shrink:0;
	flex-grow:0;
}

footer p {
	text-align:center;
	font-size:90%;
}


nav#mainmenu {
	position:relative;
	display:flex;
	flex-direction:row;
	justify-content:center;
	align-items:center;
}

nav#mainmenu ul {
	display:flex;
	flex-direction:row;
	list-style:none;
}

nav#mainmenu > ul.sections {
	margin:20px;
}

nav#mainmenu > ul.sections li {
	padding:10px;
}

nav#mainmenu > ul.sections > li.close {
	position:absolute;
	display:none;
	top:20px;
	right:30px;
	width:20px;
	height:20px;
	cursor:pointer;
}

nav#mainmenu > ul.sections > li.close img {
	width:20px;
}

nav#mainmenu > ul.sections a {
	color:grey;
}

nav#mainmenu > ul.sections a:hover {
	color:#B0936A;
}

nav#mainmenu > ul.controls {
	width:100px;
}

nav#mainmenu > ul.controls li {
	padding-right:10px;
}

nav#mainmenu > ul.controls li button {
	display:flex;
	flex-grow:0;
	flex-shrink:0;
	flex-direction:row;
	background-color:white;
	padding:5px;
	justify-content:center;
	align-items:center;
	border: 0px solid white;
	border-radius:5px;
	position:relative;
	height:42px;
	width:42px;
	background:linear-gradient(0deg, rgba(255,255,255,0.7) 0%,rgba(247,247,247,1) 100%);
	cursor:pointer;
	box-shadow:0px 0px 3px grey;
}


#menu {
	display:none;
}


nav#mainmenu > ul.controls .item-count {
	display:flex;
	position:absolute;
	top:-10px;
	left:-10px;
	color:white;
	background-color:#B0936A;
	border-radius:10px;
	width:22px;
	height:22px;
	justify-content:center;
	align-items:center;
	font-size:12px;
}

#menu span {
    display:block;
    padding-bottom:3px;
	font-size:25px;
}

#menu:hover {
    color:#B0936A;
}

#shoppingCart > span {
	color:white;
}

#shoppingCart {

}

#shoppingCart img {
	width:30px;
	margin:0px;
	padding:0px;
}


#contentWrapper {
	display:flex;
	justify-content:center;
	flex-grow:1;
}


main {
	margin-top:200px;
	width:1000px;
}



main h1 {
	font-family:serif;
	font-size:35px;
	font-weight:normal;
	text-transform:uppercase;
	color:#B0936A;
}

main h2 {
	color:#444444;
	font-size:22px;
	margin-top:30px;
	font-weight:normal;
}

main h3 {
	font-size:14px;
	text-transform:uppercase;
	color:black;
	margin-top:25px;
}

main p {
	text-align:justify;
	font-size:14px;
	margin-right:28px;
	color:gray;
	margin-bottom:15px;
	margin-top:10px;
}

.product-list {
}

.product-list .item {
	margin-top:20px;
	margin-bottom:45px;
}

.product-list img {
	max-width:400px;
}

.product-list .item > div {
	margin-top:20px;
	display:flex;
	flex-direction:row;
	justify-content:space-around;
	align-items:center;
}

.product-list .info > a {
	width:400px;
	text-align:center;
}

.product-list .controls {
	margin:20px;
	width:40%;
	display:flex;
	flex-direction:column;
	align-items:center;
}

.product-list .price {
	font-weight:bold;
}


/* Forms */

.form-section {
	margin-top:10px;
}

.form-section .group {
	display:flex;
	flex-direction:row;
	margin:0px;
	padding-bottom:10px;
}

.form-section .field {
	box-sizing:border-box;
	display:flex;
	flex-direction:column-reverse;
	align-content:flex-start;
	padding-right:10px;
	
}

.form-section .checkbox {
	display:flex;
	flex-direction:row;
	align-items:center;
	margin-left:20px;
}

.form-section .checkbox input {
	width:auto;
	margin:5px;
	margin-right:10px;
}

main input, main select, main textarea {
	box-sizing:border-box;
	border:1px solid grey;
	border-radius:3px;
	padding:7px;
	background-color:white;
	font-size:100%;
}

main .form-section input, main .form-section select, main .form-section textarea {
	width:100%;
}

.form-section input:focus, select:focus, textarea:focus {
	border:1px solid #B0936A;
}

.form-section label {
	font-size:auto;
	padding:4px;
	padding-left:1px;
	color:#595959;
}

.form-section label.required:after
{
	content:' *';
}

.form-section .small {
	width:calc(100% / 4);
}

.form-section .medium {
	width:calc(100% / 2);
}

.form-section .large {
	width:calc(100%);
}


main button, a.button {
	cursor:pointer;
	display:inline-block;
	border:none;
	padding:8px;
	padding-left:12px;
	padding-right:12px;
	border-radius:2px;
	/*background-color:#595959;*/
	background-color:#B0936A;
	color:white;
	bottom:5px;
	left:5px;
	text-align:center;
	margin:10px;
	font-size:15px;
}

.account-access {
	display:flex;
	flex-direction:row;
	margin-top:20px;
}

.account-access > div {
	width:calc(50% - 20px);
	padding:20px;
	background-color:white;
	border-radius:5px;
	box-shadow:0px 0px 3px grey;
	margin-right:20px;
}

.account-access > div:last-child {
	margin-right:0px;
}

.validation_summary {
	color:red;
	margin:10px;
	margin-bottom:20px;
}
.validation_summary ul {
	margin-left:20px;
	list-style:square;
}

.validation_summary li {
	padding-left:5px;
}

table.shopping-cart {
	margin-top:20px;
	border-collapse:collapse;
}

table.shopping-cart th {
	padding:5px;
	text-align:center;
	font-weight:bold;
}

table.shopping-cart td {
	padding:7px;
	text-align:center;
}

table.shopping-cart td:nth-child(2) {
	text-align:left;
}

table.shopping-cart tr.total td {
	border-top:2px solid grey;
	text-align:right;
	vertical-align:top;
}

table.shopping-cart tr.total td:last-child {
	text-align:center;
}

.inline-rest-action {
    display:inline-block;
	padding:0px;
	margin:0px;
}

.inline-rest-action button {
	margin:0px;
}


#invoice {
	margin-top:20px;
	border-radius:3px;
	overflow:hidden;
	width:800px;
	margin-left:auto;
	margin-right:auto;
	box-shadow:0px 0px 3px grey;
}

#invoice table#confirmation {
	width:100%;
	background-color:white;
}

#invoice table#confirmation th {
	text-align:left;
	background-color:#B0936A;
	color:white;
	padding:7px;
	padding-left:15px;
}

#invoice table#confirmation td {
	vertical-align:top;
	padding:15px;
	font-size:100%;
}

#invoice table#confirmation h2 {
	font-size:100%;
	margin:0px;
}


#invoice table#cart {
	width:100%;
	background-color:white;
}

#invoice table#cart th {
	background-color:#B0936A;
	color:white;
	padding:7px;
	font-size:100%;
}

#invoice table#cart td {
	padding:7px;
	text-align:center;
	font-size:100%;
}

.controls {
	margin:10px;
	text-align:center;
}


.controls .rest-inline-action {
	
}


@media only screen and (max-width: 700px) {
	.form-section p {
		display:flex;
		flex-direction:row;
		flex-wrap:wrap;
	}
	.form-section .small, .form-section .medium, .form-section .large {
		width:calc(100%);
	}
	
	#contentWrapper {
		
	}
	
	main {
		max-width:100%;
		padding:20px;
		overflow-x:scroll;
	}
	
	main h1 {
		font-size:4.5vh;
	}
	
	main h2 {
		font-size:2.9vh;
	}
	
	main p {
		font-size:2.5vh;
	}
	
	.product-list .item > div {
		display:flex;
		flex-direction:column;
		
		
	}
	
	.product-list img {
		max-width:calc(100%-40px);
	}
	
	.product-list .controls {
		width:100%;
	}
	
	nav#mainmenu > ul.sections {
		display:none;
	}
	
	.account-access {
		flex-direction:column;
	}
	
	.account-access > div {
		width:100%;
		margin-bottom:20px;
	}
	
	header > div.logo > img {
		height:70px;
		margin:20px;
	}
	
	#menu {
		display:block;
	}
	
	nav#mainmenu > ul.sections {
		display:none;
		position:fixed;
		top:0px;
		left:0px;
		width:280px;
		bottom:0px;
		background-color:white;
		flex-direction:column;
		flex-wrap:nowrap;
		align-items:center;
		z-index:100;
		margin:0px;
		overflow-x:hidden;
		overflow-y:auto;
		border-right:1px solid #595959;
		box-shadow:0px 0px 3px #595959;
		padding-top:30px;
	}
	
	nav#mainmenu > ul.sections > li {
		padding:10px;
		width:100%;
		padding:5px;
	}
	
	nav#mainmenu > ul.sections > li a {
		display:block;
		margin:0px;
		padding:7px;
		padding-left:10px;
	}
	
	nav#mainmenu > ul.sections > li.close {
		display:block;
	}
}