html {
	height:100%;
}
body {
	background: #ececec;
	margin:0;
	padding:0;
	font: 13px/1.5 helvetica, arial, san-serif;
	height: 100%;
}
h1, h2, h3 { text-align:center; }
h2 {
	position:absolute;
	bottom: 20px;
	color:#fff;
	text-shadow:0 0 10px rgba(0, 0, 0, 0.75);
	display:none;
}
input[type='checkbox'] {
    /* Double-sized Checkboxes */
  -ms-transform: scale(2); /* IE */
  -moz-transform: scale(2); /* FF */
  -webkit-transform: scale(2); /* Safari and Chrome */
  -o-transform: scale(2); /* Opera */
  margin: 8px 5px auto;
  border:#060636 1px solid;
  padding: 10px;
}
input[type='checkbox']:checked {
    background: #abd;
}
input[type=text], input[type=password] {
	border:#060636 1px solid; 
	color: #060636;
}
p { margin:0; }

[draggable=true] {
	cursor: move;
}
a { color: rgb(6, 6, 54); }

/* OVERLAY CODE STARTS HERE */
.loder li {
  list-style-type: none;
  margin: 0;
  padding: 0;
  display: block;
}

@keyframes bounceAround {
  35%,
  55% {
    transform: translateY(0px) rotateX(90deg);
    zoom: 1;
    filter: alpha(opacity=50);
    -webkit-opacity: 0.5;
    -moz-opacity: 0.5;
    opacity: 0.5;
  }
}

.canvas {
	background: #ececec;
	position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 105%;
   	z-index: 1000;
  -webkit-box-shadow: inset 0 0px 100px 30px rgba(0, 0, 0, 0.3);
  -moz-box-shadow: inset 0 0px 100px 30px rgba(0, 0, 0, 0.3);
  box-shadow: inset 0 0px 100px 30px rgba(0, 0, 0, 0.3);
}

.loder ul {
  position: absolute;
  top: 50%;
  right: 50px;
  bottom: 50px;
  left: 20%;
  z-index: 1001;
}

.loder ul li {
  width: 8%;
  height: 10%;
  float: left;
  position: relative;
}

.loder ul li b {
  position: absolute;
  top: 30%;
  right: 2%;
  bottom: 30%;
  left: 2%;
  color: #060636;
  font-size: 18px; 
  width: 96%;
  -webkit-animation: bounceAround 3s 1600ms infinite alternate;
  -moz-animation: bounceAround 3s 1600ms infinite alternate;
  -o-animation: bounceAround 3s 1600ms infinite alternate;
  animation: bounceAround 3s 1600ms infinite alternate;
}

.loder ul li:nth-child(1) b {
  -webkit-animation-delay: 100ms;
  -moz-animation-delay: 100ms;
  -o-animation-delay: 100ms;
  animation-delay: 100ms;
}

.loder ul li:nth-child(2) b {
  -webkit-animation-delay: 200ms;
  -moz-animation-delay: 200ms;
  -o-animation-delay: 200ms;
  animation-delay: 200ms;
}
ul li:nth-child(3) b {
  -webkit-animation-delay: 300ms;
  -moz-animation-delay: 300ms;
  -o-animation-delay: 300ms;
  animation-delay: 300ms;
}

.loder ul li:nth-child(4) b {
  -webkit-animation-delay: 400ms;
  -moz-animation-delay: 400ms;
  -o-animation-delay: 400ms;
  animation-delay: 400ms;
}

.loder ul li:nth-child(5) b {
  -webkit-animation-delay: 500ms;
  -moz-animation-delay: 500ms;
  -o-animation-delay: 500ms;
  animation-delay: 500ms;
}

.loder ul li:nth-child(6) b {
  -webkit-animation-delay: 600ms;
  -moz-animation-delay: 600ms;
  -o-animation-delay: 600ms;
  animation-delay: 600ms;
}

.loder ul li:nth-child(7) b {
  -webkit-animation-delay: 700ms;
  -moz-animation-delay: 700ms;
  -o-animation-delay: 700ms;
  animation-delay: 700ms;
}

.loder ul li:nth-child(8) b {
  -webkit-animation-delay: 800ms;
  -moz-animation-delay: 800ms;
  -o-animation-delay: 800ms;
  animation-delay: 800ms;
}

.loder ul li:nth-child(9) b {
  -webkit-animation-delay: 900ms;
  -moz-animation-delay: 900ms;
  -o-animation-delay: 900ms;
  animation-delay: 900ms;
}

.loder ul li:nth-child(10) b {
  -webkit-animation-delay: 1000ms;
  -moz-animation-delay: 1000ms;
  -o-animation-delay: 1000ms;
  animation-delay: 1000ms;
}

/* Loaded */
.loaded .canvas {
    visibility: hidden;

    -webkit-transform: translateY(-100%);  /* Chrome, Opera 15+, Safari 3.1+ */
    -ms-transform: translateY(-100%);  /* IE 9 */
    transform: translateY(-100%);  /* Firefox 16+, IE 10+, Opera */
	  
	-webkit-transition: all 0.3s 2s ease-out;  
    transition: all 0.3s 2s ease-out;
}

/* OVERLAY CODE ENDS HERE */

.wrapper {
	min-width: 750px;
	overflow: hidden;
	width: 100%;
}

.input {
  margin: 8px 0 0 0;
  background: white;
  float: left;
  width: 98.5%;
}

.input span {
  position: absolute;
  padding: 5px;
  margin-left: 3px;
  color: #999;
}

.input input, .input textarea, .input select {
  position: relative;
  margin: 0;
  border-width: 1px;
  padding: 7px 0px 6px 6px;
  background: transparent;
  font: inherit;
}

.button {
	cursor: pointer;
}

@-moz-document url-prefix() { 
	.input input {
		height: 20px;
	}
}

.input select {
	padding: 7px;
}

#main {
	float:left;
	list-style:none;
	width:60%;
	padding:0;
}

#search {
	float: left;
	margin: 10px;
	min-width: 690px; 
	overflow: hidden;
	width: 26%;
}

#findbtn:hover {
	filter: alpha(opacity=50);
    -webkit-opacity: 0.5;
    -moz-opacity: 0.5;
    opacity: 0.5;
}

#products {
	float:left;
	list-style:none;
	width:99%;
	padding:0;
}
#products li {
	display:inline;
}
.item {
	display:block;
	float:left;
	width:180px;
	height:180px;
	margin:10px;
	border:1px solid #060636; /* Rahmies Blue */
	text-align:center;
	text-decoration:none;
	color: #000;
	overflow:hidden;
}
.item img {
	border:0;
	margin:10px auto;
	width:160px;
	height:160px;
}
.item div {
	background:rgb(0, 0, 0);
	background: rgba(0, 0, 0, 0.5);
	position:relative;
	bottom:99px;
	color:#f3f3f3;
	padding:5px 0;
	display:block;
	text-align:left;
}

#info {
	background: url(../img/info.png) no-repeat center;
	background-size: contain;
	float:right;
	margin-right: 5px;
	color:#f3f3f3;
	overflow:hidden;
	text-decoration:none;
	min-height:20px;
	height:20px;
	width:20px;
}

#content {
	float:left;
	list-style:none;
	width:60%;
	padding:0;
}
#find {
	width: 98%;
}
#logo img {
	border:none;
	cursor:pointer;
	text-decoration:none;
}
#cart {
	float:right;
	background:rgb(6, 6, 54);
	background: rgba(6, 6, 54 0.7);
	/*border-left: 2px solid rgba(0, 0, 0, 0.5);
	border-radius: 0 0 50px 0;*/
	height:100%;
	min-width: 300px;
	text-align:center;
	width:30%;
}
#foot {
	background: #ececec;
	overflow:hidden;
	text-align:center;
	width:100%;
}
#uli li {
	cursor:pointer;
	list-style:none;
	padding:5px;
}
#uli a {
	color:rgb(6, 6, 54);
	text-decoration: none;
}
#notice {
	display:none;
	margin:10px;
}
@media screen and (max-width: 500px){
    .wrapper {
		overflow: hidden;
		width: 50%;
	}
	
	#main {
		float:left;
		list-style:none;
		width:60%;
		padding:0;
	}
	
	#cart {
		float:left;
		background-color:red;
		/*border-left: 2px solid rgba(0, 0, 0, 0.5);*/
		min-height:400px;
		text-align:center;
		width:54%;
	}
	
	#myDrawing {
		height:50px;
	}
	
	#notice {
		display:block;
	}
	
	#notice2 span {
	  display: none;
	}
	
	#notice2:after {
	font-weight: bold;
	  content: 'below.';
	}
}

#cart ul {
	padding:0;
}
#cart li {
	list-style:none;
	border-bottom:1px solid #494949;
	padding:5px;
}
#cart .quantity {
	font-weight:bold;
	padding-right:10px;
	margin-right:10px;
	border-right:1px solid #494949;
	display:inline-block;
	width:15px;
	text-align:right;
}
#cart .price {
	float:right;
}
#total {
	float:right;
}
#jcart {
	background: #ececec;
	width:100%;
}
div#preload { display: none; }
.wrap {
	margin-left:10px;
}
.loading {
	margin-left:10px;
	display:inline-block;
	background-image: url("../img/loading.gif");
}

#lounge {
	background: #ececec;
	margin-top: 5px;
	width:100%;
}

/* SQUARED TWO */
.squaredTwo {
	width: 28px;
	height: 28px;
	background: #fcfff4;

	background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -moz-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -o-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: -ms-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	background: linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcfff4', endColorstr='#b3bead',GradientType=0 );
	margin: 0px;

	-webkit-box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
	-moz-box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
	box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
	position: relative;
}

.squaredTwo label {
	cursor: pointer;
	position: absolute;
	width: 20px;
	height: 20px;
	left: 4px;
	top: 4px;

	-webkit-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,1);
	-moz-box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,1);
	box-shadow: inset 0px 1px 1px rgba(0,0,0,0.5), 0px 1px 0px rgba(255,255,255,1);

	background: -webkit-linear-gradient(top, #222 0%, #45484d 100%);
	background: -moz-linear-gradient(top, #222 0%, #45484d 100%);
	background: -o-linear-gradient(top, #222 0%, #45484d 100%);
	background: -ms-linear-gradient(top, #222 0%, #45484d 100%);
	background: linear-gradient(top, #222 0%, #45484d 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#222', endColorstr='#45484d',GradientType=0 );
}

.squaredTwo label:after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	filter: alpha(opacity=0);
	opacity: 0;
	content: '';
	position: absolute;
	width: 9px;
	height: 5px;
	background: transparent;
	top: 4px;
	left: 4px;
	border: 3px solid #fcfff4;
	border-top: none;
	border-right: none;

	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

.squaredTwo label:hover::after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
	filter: alpha(opacity=30);
	opacity: 0.3;
}

.squaredTwo input[type=checkbox]:checked + label:after {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	filter: alpha(opacity=100);
	opacity: 1;
}