html, body {
	background-color: #42454a;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	font-family: Arial, Verdana, Helvetica, Sans-Serif;
	font-size: 12px;
}
/*------ HEADER -----------------------------------------------*/
#header {
	width: 100%; 
	background-color: #161331;
	position: fixed;
	overflow: hidden;
	z-index: 9999;
}
	#header .container {
		width: 1280px;
		height: 100px;
		margin: 0 auto;
		padding: 0;
		overflow: hidden;
	}
		#header .container .logo {
			width: 500px;
			height: 100%;
			float: left;
			padding: 0;
			margin: 0 0 0 20px;
		}
			#header .container .logo img {
				height: 100%;
			}
		#header .container .menu {
			width: 600px;
			height: 100%;
			float: right;
			margin: 0 20px 0 0;
		}
			#header .container .menu ul {
				overflow: hidden;
				margin: 32px 0 32px auto;
				padding: 0;
				font-size: 1.4em;
				list-style-type: none;
				float: right;
			}
				#header .container .menu ul li {
					float: left;
					padding: 5px 10px;
					border-radius: 0 0 8px 0;
					border-right: 1px solid #ddd;
					border-bottom: 1px solid #ddd;
					width: 120px;
					text-align: center;
					margin: 0 0 auto 10px;
				}
					#header .container .menu ul li a {
						text-decoration: none;
						color: #bbbbbb;
					}
					#header .container .menu ul li a:hover {
						color: #fff;
						font-weight: bold;
					}
/*------ CONTAINER --------------------------------------------*/
#content {
	width: 100%;
	background-color: #fff;
	overflow: hidden;
	display: block;
	padding: 100px 0 0 0;
	margin: 0;
}
    #content.admin {
        padding: 140px 0 0 0;
    }
	#content .container {
		width: 1280px;
		margin:  0 auto;
		padding: 0;
		overflow: hidden;
	}
		#content .container .pagenotfound {
			text-align: center;
			overflow: hidden;
			padding: 0;
			margin: 100px auto;
		}
			#content .container .pagenotfound a {
				text-decoration: none;
			}
		#content .container .pdterror {
			width: 860px;
			margin: 100px auto;
			padding: 0;
			overflow: hidden;
			background-color: #fafafa;
			border: 2px solid #ddd;
			border-radius: 8px;
			text-align: center;
		}

/*----- HOME -----------------------------*/
#content .banner {
	background-color: #c9e0ee;
}
	#content .banner .home img {
		width: 100%;
		height: auto;
		overflow: hidden;
		margin: 0;
		padding: 0;
	}
	#content .home {
		text-align: center;
	}
		#content .home .textbox {
			width: 392px;
			overflow: hidden;
			border-radius: 8px;
			border: 1px solid #ddd;
			padding: 0;
			display: inline-block;
			margin: 40px 15px;
			vertical-align: top;
		}
			#content .home .textbox h1 {
				overflow: hidden;
				padding: 10px 20px; 
				margin: 0;
			}
			#content .home .textbox p {
				overflow: hidden;
				padding: 10px 20px;
				margin: 0;
				text-align: justify;
			}




/*----- SHOP -----------------------------*/
/*----- SINGLE PRODUCT VIEW -------------*/
form#productview {
	width: 100%;
	margin: 20px 0;
	padding: 0;
	overflow: hidden;
}
	form#productview .left {
		width: 460px;
		margin: 0 20px 0 0;
		border: 2px solid #ddd;
		border-radius: 8px 3px 3px 8px;
		background: #fafafa;
	}
	form#productview .right {
		width: 780px;
		margin: 0;
		border-radius: 3px 8px 8px 3px;
	}
	form#productview .info {
		padding: 0;
		overflow: hidden;
		float: left;
	}
		form#productview .info img {
			height: 500px;
			width: 780px;
			margin: 0 auto;
			padding: 0;
			text-align: center;
			overflow: hidden;
			display: block;
		}
		form#productview .info span.title, form#productview .info span.price {
			display: inline-block;
			padding: 0;
			margin: 10px;
			font-size: 1.4em;
			height: 20px;
			overflow: hidden;
		}
		form#productview .info span.blurb {
			display: block;
			padding: 0;
			height: 375px;
			margin: 10px;
			overflow: hidden;
		}
		form#productview .info span.title {
			width: 300px;
			font-weight: bold;
		}
		form#productview .info span.price {
			width: 100px;
			float: right;
			text-align: right;
		}
		form#productview .info select, form#productview .info input {
			display: inline-block;
			height: 40px;
			padding: 0;
			margin: 10px;
			border: 1px solid #bbb;
			background #ddd;
		}
		form#productview .info select {
			width: 120px;
			border: 1px solid #bbb;
			background: #ddd;
		}
			form#productview .info select:hover {
				background-color: #161331; 
				color: #fff;
			}
		form#productview .info input {
			width: 155px;
			float: right;
			border: 1pz solid #bbb;
		}
			form#productview input:hover {
				background-color: #161331; 
				color: #fff;
			}
/*----- SHOP -----------------------------*/
/*----- VIEW ALL PRODUCTS ---------------*/
form#product {
	overflow: hidden;
	float: left;
	width: 300px;
	margin: 10px;
	padding: 0;
}
	form#product img {
		width: 300px; 
		height: 193px;
		border-radius: 8px 8px 5px 5px;
	}
	form#product .info {
		background: #fafafa;
		height: 90px;
		overflow: hidden;
		display: block;
		border-radius: 3px 3px 8px 8px;
		border: 2px solid #ddd;
	}
	form#product .added, form#productview .added {
		animation-name: colourChangeAdded;
		animation-duration: 3s;
	}
		@keyframes colourChangeAdded {
			0% {background-color: #39e63f;}
			25% {background-color: #39e63f;}
			50% {background-color: #39e63f;}
			75% {background-color: #39e63f;}
			100% {background-color: #ddd;}
		}
	form#product .removed, form#productview .removed {
		animation-name: colourChangeRemoved;
		animation-duration: 3s;
	}
		@keyframes colourChangeRemoved {
			0% {background-color: #f55849;}
			25% {background-color: #f55849;}
			50% {background-color: #f55849;}
			75% {background-color: #f55849;}
			100% {background-color: #ddd;}
		}
		form#product .info span.title, form#product .info span.price {
			display: inline-block;
			padding: 0;
			margin: 10px 5px 5px 5px;
			font-size: 1.2em;
			height: 20px;
			overflow: hidden;
		}
		form#product .info span.title {
			width: 205px;
			font-weight: bold;
		}
		form#product .info span.price {
			width: 70px;
			float: right;
			text-align: right;
		}
		form#product .info select, form#product .info input {
			display: inline-block;
			height: 40px;
			padding: 0;
			margin: 5px 5px 10px 5px;
			background: #ddd;
			border: 1px solid #bbb;
		}
		form#product .info select {
			width: 120px;
			border: 2px solid #bbb;
			background: #ddd;
		}
			form#product .info select:hover {
				background-color: #161331; 
				color: #fff;
			}
		form#product .info input {
			width: 155px;
			float: right;
		}
			form#product input:hover {
				background-color: #161331; 
				color: #fff;
			}
/*----- SHOP -----------------------------*/
/*----- BREADCRUMBS | PAGINATION --------*/
.breadcrumbs {
	width: 100%;
	margin: 20px 0;
	padding: 0;
	text-align: center;
}
	.breadcrumbs a {
		border: 2px solid #000;
		border-radius: 5px;
		margin: 0 5px;
		padding: 10px;
		color: #000;
		text-decoration: none;
	}
		.breadcrumbs a.active {
			background-color: #ddd;
			color: #000;
		}
			.breadcrumbs a:hover {
				background-color: #161331;
				color: #fff;
			}




/*----- DISPLAY CART ---------------------*/
/*----- HEADINGS ------------------------*/
.cartheadings {
	width: 860px;
	height: 40px;
	display: block;
	font-weight: bold;
	font-size: 1.2em;
	padding: 0;
	margin: 20px auto 0 auto;
	background-color: #161331;
	color: #fff;
	line-height: 40px;
	border-radius: 8px 8px 0 0;
}
	.cartheadings .title {
		width: 360px;
		height: 100%;
		margin: 0;
		padding: 0 10px;
		display: inline-block;
		overflow: hidden;
	}
	.cartheadings .price, .cartheadings .qty, .cartheadings .net {
		width: 150px;
		height: 100%;
		margin: 0;
		padding: 0 10px 0 0;
		display: inline-block;
		overflow: hidden;
		text-align: right;
	}
/*----- DISPLAY CART ---------------------*/
/*----- PRODUCTS ------------------------*/
form.updated {
	animation-name: colourChangeAdded;
	animation-duration: 3s;
}
	@keyframes colourChangeAdded {
		0% {background-color: #39e63f;}
		25% {background-color: #39e63f;}
		50% {background-color: #39e63f;}
		75% {background-color: #39e63f;}
		100% {background-color: #ddd;}
	}
form.productincart {
	width: 860px;
	height: 30px;
	display: block;
	font-weight: bold;
	padding: 0;
	margin: 0 auto;
	color: #000;
	line-height: 30px;
}
	form.productincart:nth-child(even) {
		background-color: #ccc;
	}
	form.productincart:nth-child(odd) {
		background-color: #eee;
	}
	form.productincart .title {
		width: 360px;
		height: 100%;
		margin: 0;
		padding: 0 10px;
		display: inline-block;
		overflow: hidden;
	}
	form.productincart .price, form.productincart .qty, form.productincart .net {
		width: 150px;
		height: 100%;
		margin: 0;
		padding: 0 10px 0 0;
		display: inline-block;
		overflow: hidden;
		text-align: right;
	}
	form.productincart .qty select {
		height: 28px; 
		width: 40px;
		margin: 1px;
		padding: 0;
	}
	form.productincart .qty input {
		height: 28px; 
		width: 60px;
		margin: 1px;
		padding: 0;
	}
/*----- DISPLAY CART ---------------------*/
/*----- TOTALS --------------------------*/
.shoppingtotals, .shippingtotals {
	width: 860px;
	height: 34px;
	display: block;
	font-weight: bold;
	padding: 0;
	margin: 0 auto;
	line-height: 30px;
	text-align: right;
}
.shoppingtotals {
	background-color: #161331;
	color: #fff;
}
.shippingtotals {
	background-color: #eee;
	color: #000;
}
	.shoppingtotals .title, .shippingtotals .title {
		width: 150px;
		height: 100%;
		margin: 0;
		padding: 0 10px 0 0;
		display: inline-block;
		overflow: hidden;
		text-align: right;
	}
	.shoppingtotals .total, .shippingtotals .total {
		width: 150px;
		height: 100%;
		margin: 0;
		padding: 0 10px 0 0;
		display: inline-block;
		overflow: hidden;
		text-align: right;
	}


/*----- DISPLAY CART ----------------------------------------------------------------------*/
/*----- DELIVERY DETAILS -----------------------------------------------------------------*/
form#deliverydetails {
	width: 860px;
	margin: 20px auto;
	padding: 0;
	overflow: hidden;
	background-color: #fafafa;
	text-align: left;
	border: 2px solid #ddd;
	border-radius: 0 0 8px 8px;
}
	form#deliverydetails:has(.success) {
		border-radius: 8px;
		margin: 100px auto;
	}
	form#deliverydetails span {
		padding: 0;
		display: block;
		width: 830px;
		margin: 5px auto;
		overflow: hidden;
	}
		form#deliverydetails span label {
			padding: 0 5px;
			display: block;
			margin: 5px 0;
		}
		form#deliverydetails span input {
			padding: 10px;
			display: block;
			width: 803px;
			margin: 5px 0;
			overflow: hidden;
		}
			form#deliverydetails span input.smallbox {
				display: inline-block;
				padding: 10px;
				width: 385px;
				overflow: hidden;
			}
				form#deliverydetails span input.smallbox:nth-child(even) {
					margin: 5px 5px 5px 0;
				}
				form#deliverydetails span input.smallbox:nth-child(odd) {
					margin: 5px 0 5px 5px;
				}
		form#deliverydetails span textarea {
			padding: 10px;
			display: block;
			width: 805px;
			margin: 5px 0;
			resize: none;
			height: 150px;
		}
	form#deliverydetails span.radioselect {
		padding: 10px 0 5px 0;
		display: inline-block;
		width: 390px;
		margin: 5px 15px;
		overflow: hidden;
	}
		form#deliverydetails span.radioselect input {
			padding: 0;
			margin: 0;
			height: 30px;
			width: 30px;
			float: left;
			overflow: hidden;
		}
		form#deliverydetails span.radioselect label {
			padding: 0;
			height: 30px;
			line-height: 30px;
			margin: 0 0 0 10px;
			overflow: hidden;
			float: left;
		}
	form#deliverydetails span.submit {
		padding: 0;
		display: block;
		width: 830px;
		margin: 5px auto;
		overflow: hidden;
	}
		form#deliverydetails span.submit label {
			padding: 0;
			height: 40px;
			line-height: 40px;
			margin: 5px 10px;
			overflow: hidden;
			float: left;
		}
		form#deliverydetails span.submit input {
			height: 40px;
			width: 410px;
			border-radius: 0 0 0 8px;
			padding: 0;
			margin: 5px 0;
			font-size: 1.2em;
			background-color: #ddd;
			border: 1px solid #bbb;
			float: left;
		}
			form#deliverydetails span.submit input[type=submit]:hover {
				background-color: #161331; 
				color: #fff;
				border: 1px solid #161331;
			}
	form#deliverydetails .error {
		background: #F54242;
		text-align: center;
		color: #fff;
		overflow: hidden;
	}
	form#deliverydetails .success {
		border-radius: 8px;
		background: #39a62d;
		text-align: center;
		color: #fff;
		overflow: hidden;
	}
	






/*----- ADMIN -----------------------------------------------------------------------------*/
/*----- MENU -----------------------------------------------------------------------------*/
#admin_header {
	width: 100%; 
	margin-top: 100px;
	background-color: #1296c9;
	position: fixed;
	overflow: hidden;
	z-index: 9999;
}
	#admin_header .container {
		width: 1280px;
		height: 40px;
		margin: 0 auto;
		padding: 0;
		overflow: hidden;
		text-align: center;
	}
		#admin_header .container .admin_menu {
			width: 1280px;
			height: 100%;
			margin: 0;
		}
			#admin_header .container .admin_menu ul {
				overflow: hidden;
				margin: 0;
				padding: 0;
				font-size: 1.2em;
				list-style-type: none;
			}
				#admin_header .container .admin_menu ul li {
					padding: 5px 10px;
					margin: 0 0 auto 10px;
					display: inline-block;
					line-height: 30px;
				}
					#admin_header .container .admin_menu ul li a {
						text-decoration: none;
						color: #bbbbbb;
					}
					#admin_header .container .admin_menu ul li a:hover {
						color: #fff;
						text-decoration: underline;
					}
					#admin_header .container .admin_menu ul li a.active {
						color: #fff;
					}
					


/*----- LOGIN SECURITY -------------------------------------------------------------------*/
#admin_security {
	width: 860px;
	margin: 20px auto;
	padding: 0;
	background-color: #fafafa;
	text-align: left;
	border: 2px solid #ddd;
	border-radius: 8px;
}
	#admin_security span {
		padding: 0;
		display: block;
		width: 830px;
		margin: 5px auto;
		overflow: hidden;
	}
		#admin_security span label {
			padding: 0 5px;
			display: block;
			margin: 5px 0;
		}
		#admin_security span input {
			padding: 10px;
			display: block;
			width: 803px;
			margin: 5px 0;
			overflow: hidden;
		}
			#admin_security span input[type=submit] {
				height: 40px;
				width: 410px;
				border-radius: 8px;
				padding: 0;
				margin: 5px auto;
				font-size: 1.2em;
				background-color: #ddd;
				border: 1px solid #bbb;
			}
				#admin_security span input[type=submit]:hover {
					background-color: #161331; 
					color: #fff;
					border: 1px solid #161331;
				}
	#admin_security .error {
		border-radius: 8px 8px 0 0;
		background: #F54242;
		text-align: center;
		color: #fff;
		overflow: hidden;
	}
	#admin_security .success {
		border-radius: 8px 8px 0 0;
		background: #39a62d;
		text-align: center;
		color: #fff;
		overflow: hidden;
	}

/*----- ADD PRODUCT ----------------------------------------------------------------------*/
.admin_addproduct {
	width: 860px;
	margin: 20px auto;
	padding: 0;
	background-color: #fafafa;
	text-align: left;
	border: 2px solid #ddd;
	border-radius: 8px;
}
	.admin_addproduct span {
		padding: 0;
		display: block;
		width: 830px;
		margin: 5px auto;
		overflow: hidden;
	}
		.admin_addproduct span.uploadedimage, .admin_addproduct span.saveuploadedimage {
			display: block;
			text-align: center;
		}
		.admin_addproduct span label {
			padding: 0 5px;
			display: block;
			margin: 5px 0;
		}
		.admin_addproduct span input {
			padding: 10px;
			display: block;
			width: 803px;
			margin: 5px 0;
			overflow: hidden;
		}
		.admin_addproduct span input[type=file] {
			padding: 0 10px;
			background: #fff;
			border: 1px solid #000;
			line-height: 30px;
		}
			.admin_addproduct span input[type=submit], .admin_addproduct span button {
				height: 40px;
				width: 410px;
				border-radius: 8px;
				padding: 0;
				margin: 5px auto;
				font-size: 1.2em;
				background-color: #ddd;
				border: 1px solid #bbb;
			}
				.admin_addproduct span input[type=submit]:hover, .admin_addproduct span button:hover {
					background-color: #161331; 
					color: #fff;
					border: 1px solid #161331;
				}
		.admin_addproduct span textarea {
			padding: 10px;
			display: block;
			width: 805px;
			margin: 5px 0 5px -5px;
			resize: none;
			height: 150px;
		}
	.admin_addproduct .error {
		border-radius: 8px 8px 0 0;
		background: #F54242;
		text-align: center;
		color: #fff;
		height: 50px;
		overflow: hidden;
	}

/*----- EDIT PRODUCT ---------------------------------------------------------------------*/
form.admin_editproduct {
    width: 860px;
    height: 200px;
	margin: 10px auto;
	padding: 0;
	background-color: #fafafa;
	text-align: left;
	border: 2px solid #ddd;
	border-radius: 8px;
	display: block;
	overflow: hidden;
}
    form.updated {
    	animation-name: colourChangeAdded;
    	animation-duration: 3s;
    }
    	@keyframes colourChangeAdded {
    		0% {background-color: #39e63f;}
    		25% {background-color: #39e63f;}
    		50% {background-color: #39e63f;}
    		75% {background-color: #39e63f;}
    		100% {background-color: #ddd;}
    	}
    form.admin_editproduct span.image {
        height: 180px;
        width: 280px;
        overflow: hidden;
        margin: 10px;
        padding: 0;
        float: left;
    }
        form.admin_editproduct span.image img {
            max-height: 100%;
            display: block;
            overflow: hidden;
            border-radius: 8px 0 0 8px;
        }
    form.admin_editproduct span.info {
        height: 180px;
        width: 420px;
        margin: 10px;
        padding: 0;
        float: left;
        text-align: left;
    }
        form.admin_editproduct span.info input#admin_productname {
            float: left;
            width: 280px;
            line-height: 30px;
        }
        form.admin_editproduct span.info input#admin_productprice {
            float: right;
            width: 100px;
            line-height: 30px;
        }
        form.admin_editproduct span.info textarea {
            resize: none;
            display: inline-block;
            width: 409px;
            height: 125px;
            overflow: auto;
            margin-top: 10px;
            padding: 5px;
        }
    form.admin_editproduct span.controls {
        width: 120px;
        float: left;
    }
        form.admin_editproduct span.controls input[type=submit] {
            background-color: #ddd;
			border: 1px solid #bbb;
			height: 40px;
    		width: 100px;
    		border-radius: 8px;
    		padding: 0;
    		margin: 20px auto;
    		font-size: 1.2em;
    		display: block;
        }
            form.admin_editproduct span.controls input#admin_changestatus {
                font-size: 0.7em;
            }
            form.admin_editproduct span.controls input.instock {
                background: #39a62d;
            }
            form.admin_editproduct span.controls input.nostock {
                background: #F54242;
            }
        form.admin_editproduct span.controls input[type=submit]:hover {
            background-color: #161331; 
			color: #fff;
			border: 1px solid #161331;
        }
form.admin_editsuccess {
    width: 860px;
	margin: 10px auto;
	padding: 0;
	background-color: #39a62d;
	border: 2px solid #ddd;
	border-radius: 8px;
	display: block;
	overflow: hidden;
	text-align: center;
}
    












/*----- CONTACT ME -----------------------*/
form#contactme {
	width: 860px;
	margin: 20px auto;
	padding: 0;
	overflow: hidden;
	background-color: #fafafa;
	text-align: left;
	border: 2px solid #ddd;
	border-radius: 8px;
}
	form#contactme span {
		padding: 0;
		display: block;
		width: 830px;
		margin: 5px auto;
		overflow: hidden;
	}
		form#contactme span label {
			padding: 0 5px;
			display: block;
			margin: 5px 0;
		}
		form#contactme span input {
			padding: 10px;
			display: block;
			width: 803px;
			margin: 5px 0;
			overflow: hidden;
		}
			form#contactme span input[type=submit] {
				height: 40px;
				width: 410px;
				border-radius: 8px;
				padding: 0;
				margin: 5px auto;
				font-size: 1.2em;
				background-color: #ddd;
				border: 1px solid #bbb;
			}
				form#contactme span input[type=submit]:hover {
					background-color: #161331; 
					color: #fff;
					border: 1px solid #161331;
				}
		form#contactme span select {
			padding: 10px;
			display: block;
			width: 826px;
			margin: 5px 0;
			overflow: hidden;
		}
		form#contactme span textarea {
			padding: 10px;
			display: block;
			width: 805px;
			margin: 5px 0;
			resize: none;
			height: 150px;
		}
		form#contactme span.captcha label {
			padding: 0;
			height: 30px;
			line-height: 30px;
			margin: 0 0 0 10px;
			overflow: hidden;
			float: left;
		}
		form#contactme span.captcha input {
			padding: 0;
			margin: 0;
			height: 30px;
			width: 30px;
			float: left;
			overflow: hidden;
		}
	form#contactme .error {
		border-radius: 8px 8px 0 0;
		background: #F54242;
		text-align: center;
		color: #fff;
		height: 50px;
		overflow: hidden;
	}
	form#contactme .success {
		border-radius: 8px 8px 0 0;
		background: #39a62d;
		text-align: center;
		color: #fff;
		height: 50px;
		overflow: hidden;
	}




/*----- FOOTER ---------------------------*/
#footer {
	width: 100%;
	background-color: #161331;
}
	#footer .container {
		width: 1280px;
		height: 40px;
		margin: 0 auto;
		padding: 0;
		overflow: hidden;
	}
		#footer .container .leftbar {
			color: #bbb;
			float: left;
			margin: 0 0 0 20px;
			padding: 0;
			overflow: hidden;
		}
		#footer .container .rightbar {
			color: #bbb;
			float: right;
			margin: 0 20px 0 0;
			padding: 0;
			overflow: hidden;
		}
			#footer .container .leftbar p, #footer .container .rightbar p {
				margin: 10px 0;
				padding: 0;
				overflow: hidden;
				display: block;
			}
				#footer .container .rightbar p a {
					color: #bbb;
					text-decoration: none;
				}