body {
	font-family: Helvetica, Arial, sans-serif;
	padding-top: 5em;
}

a {
	color: #5b6e72;
}

h1 ,h2, h3, h4, h5, h6 {
	line-height: 1.25em;
	margin: 0.25em 0;
}


h1 {
	font-family: omnes-pro;
	font-weight: 900;
	font-style: italic;
	font-size: 32pt;
	text-decoration: none;
	text-rendering: optimizeLegibility;
	color: #40c0dF;
	font-size: 42pt;
	line-height: 1em;
	margin-bottom: 1em;
}


h2 {
	font-family: omnes-pro;
	font-weight: 900;
	font-style: italic;
	font-size: 24pt;
	text-decoration: none;
	text-rendering: optimizeLegibility;
}

h3 {
	font-family: omnes-pro;
	font-weight: 900;
	font-style: italic;
	font-size: 18pt;
	text-decoration: none;
}

hr {
margin: 1em 0;
border: 0;
border-top: 1px solid #EEE;
border-bottom: 1px solid white;
}

.right {
text-align: right;
}

.center {
text-align: center;
}

/* ================ */
/* = The 1Kb Grid = */     /* 12 columns, 80 pixels each, with 10 pixel gutter */
/* ================ */

.g1 { width:80px; }
.g2 { width:170px; }
.g3 { width:260px; }
.g4 { width:350px; }
.g5 { width:440px; }
.g6 { width:530px; }
.g7 { width:620px; }
.g8 { width:710px; }
.g9 { width:800px; }
.g10 { width:890px; }
.g11 { width:980px; }
.g12 { width:1070px; }

.gby5 { width: 206px; }

.col {
	margin: 0 5px 10px 5px;
	overflow: hidden;
	float: left;
	display: inline;
}
.row {
	width: 1080px;
	margin: 0 auto;
	overflow: hidden;
}
.row .row {
	margin: 0 -5px;
	width: auto;
	display: inline-block;
}

/* Stuffs */


.content ul {
	margin: 1em;
}
.content li, .list li {
	list-style: disc;
	color: #666666;
	margin: 1em 0 1em 1em;
}

.inline li {
	display: inline-block;
}

p {

	line-height: 1.5em;
}

.hide { display: none; }

.item {
	display: block;
	position: relative;
	height: 206px;
	box-shadow: inset 0px 0px 24px rgba(0,0,0,0.10);
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center bottom;
	cursor: pointer;
}

.item .info {
width: 70%;
color: #404040;
padding: 2.5% 25% 5% 5%;
	position: absolute;
	top:0;
	left:0;
	background: #c0c0c0;
	background: rgba(192,192,192,0.5);
}

.item .info h3 {
	font-style: normal;
	font-weight: normal;

	font-family: Helvetica, Arial, sans-serif;
	font-size: 11pt;
}

.item .info h3 a {
	width: 200px;
	text-decoration: none;
}

.list .item {
	display: block;
	position: relative;
	height: 1.5em;
	width: 100%;
	background-repeat: no-repeat;
	background-size: auto 100%;
	background-position: left center;
	cursor: pointer;
}

.price {
	font-family: omnes-pro;
	font-weight: normal;
	font-size: 18pt;
}

.product-header .price { float: right; }

.item .price {
	position: absolute;
	top: 5%;
	right: 5%;
}

.price sup {
	font-size: 12pt;
	vertical-align: baseline;
	top: -4pt;
	position: relative;
}


.item.hero {
	box-shadow: inset 0px 0px 32px rgba(0,0,0,0.15);
}
.item.hero .info {
	background: transparent;
	color: #404040;
	left: 50%;
	top: 30%;
	width: 30%;
	height: 60%;
}

.item.hero .price {
	left: 10%;
	top: 40%;
	font-size: 32pt;
}

.item.hero h3 {
	font-size: 24pt;
}

.menu.main {
	position: fixed;
	top: 4px;
	left: 0;
	width:100%;
	background: #000000;
	background: rgba(16,8,0,0.75);
	height:40px;
	z-index:99;
}

.menu.sub ul {
	position: fixed;
	top: 48px;
	left: 0;
	width:100%;
	background: #0599dd;
	background: rgba(10,133,221,0.75);
	height:40px;
	z-index:98;
	text-align: center;
}

.main.menu li.logo {
	position: absolute;
	width: 128px;
	height: 57px;
	top: -16px;
	left: 0;
	overflow: visible;
}

.main.menu li.logo a, .main.menu li.logo img {
	height: 57px;
	width: 128px;
	outline: none;
	color: inherit;
}

.menu ul {
	list-style: none;
	height: 48px;
	text-align: right;
	position: relative;
	overflow: visible;
}

.menu.sub ul {
	height: 32px;
}

.menu li {
	display:inline-block;
	font-family: omnes-pro;
	font-weight: 900;
	font-style: italic;
	font-size: 14pt;
	color: white;
	padding: 6px 16px 7px;
	text-rendering: optimizeLegibility;
}

.menu.sub li {
	padding: 1px 16px 3px;	
}


.menu li:first-child {
	padding-left: 0;
}

.menu li:last-child {
	padding-right: 5px;
}

.menu li a { 
	text-decoration: none;
	color: #f0f0f0;
}

.main.menu li a:hover {
	color: #ffffff;
}

.main.menu li.blog a { color: #fdb73a; } .main.menu li.blog a:hover { color: #ffdc9c; }
.main.menu li.help a { color: #61d4ec; } .main.menu li.help a:hover { color: #bff4ff; }
.main.menu li.shop a { color: #72efad; } .main.menu li.shop a:hover { color: #92f9e5; }


footer {
	width: 100%;
	border-top: 1px dashed gainsboro;
	margin-top: 24pt;
	font-size: 9pt;
	padding: 16pt 0;
	background: #fafafa;
	line-height: 150%;
}

#cart {
	text-align: center;
	color: white;
	position:absolute;
	left: 15%;
	top: -20%;
	width: 3.5em;
	height: 3.5em;
	padding: 0.25em;
	background: url('/img/cart.png');
	background-size: 100% 100%;
	line-height: 0.8em;
	z-index: 1001;
	text-decoration: none;
}

#cart h3 {
	font-family: omnes-pro;
	font-weight: 900;
	margin-bottom: 0;
	text-rendering: optimizeLegibility;
}

#cart .quantity {
	margin-top: 0.5em;
}

#cart .price {
	display: none;
	letter-spacing: -1px;
	font-size: 14pt;
}

#cart .price sup {
	letter-spacing: -1px;
	font-size: 10pt;
	top: -3pt;
}

.addtocart {
	background: #00b3e0 url('/img/icon-cart.png');
	border-radius: 50%;
	width: 3em;
	height: 3em;
	border: 0;
	overflow: hidden;
	text-indent: -9999px;
	background-repeat: no-repeat;
	background-size: 60% 60%;
	background-position: 40% center;
	cursor: pointer;
}

.remove-from-cart {
	display: block;
	background: #dddddd url('/img/icon-cross.png');
	border-radius: 50%;
	width: 1.5em;
	height: 1.5em;
	border: 0;
	overflow: hidden;
	text-indent: -9999px;
	background-repeat: no-repeat;
	background-size: 50% 50%;
	background-position: center center;
	cursor: pointer;
}

.update-cart {
	background: #ffb700 url('/img/icon-refresh.png');
	border-radius: 50%;
	width: 3em;
	height: 3em;
	border: 0;
	overflow: hidden;
	text-indent: -9999px;
	background-repeat: no-repeat;
	background-size: 50% 50%;
	background-position: center center;
	cursor: pointer;
}

.item .addtocart {
	position: absolute;
	right: 4%;
	bottom: 5%;
}


.cart-item {
	border-top: 1px dotted gainsboro;
	padding: 0.5em 0;
}

.cart-summary {
	border-top: 1px solid gainsboro;
	padding: 1em 0;
}


.classicon {
	width:4em;
}

#thumbs li a {
	width: 100%;
}

#thumbs li a img {
	border: 1px dotted gainsboro;
	padding: 0.25em;
	width: 88%;
}

/* SPESHUL */

.item.adafruit .info { background-color: rgba( 59, 159, 181, 0.5 ); }
.item.ninja .info { background-color: rgba( 84, 73, 54, 0.5 ); }
.item.toxic .info { background-color: rgba( 240, 248, 76, 0.75 ); color: #758900; }
.item.red .info { background-color:  rgba( 241, 128, 128, 0.75 ); color: #9e0000;} .item.red .info a { color: #9e0000;}
.item.blue .info { background-color:  rgba( 91, 168, 212, 0.75 ); color: #085f91;} .item.blue .info a { color: #085f91;}
.item.pink .info { background-color:  rgba( 255, 128, 185, 0.75 ); color: #de0088;} .item.pink .info a { color: #de0088;}
.item.black .info { background-color:  rgba( 32, 32, 32, 0.75 ); color: #cccccc;} .item.black .info a { color: #cccccc;}
.item.yellow .info { background-color:  rgba( 255, 245, 84, 0.75 ); color: #ff9000;} .item.yellow .info a { color: #ff9000;}
.item.green .info { background-color:  rgba( 100, 232, 90, 0.75 ); color: #0e8b01;} .item.green .info a { color: #0e8b01;}
.item.purple .info { background-color:  rgba( 184, 90, 232, 0.75 ); color: #62018b;} .item.purple .info a { color: #62018b;}
.item.orange .info { background-color:  rgba( 251, 188, 53, 0.75 ); color: #ff7e00;} .item.orange .info a { color: #ff7e00;}

.link-pibow { color: #fdb73a }
.link-picade { color: #61d4ec; }
.link-shop { color: #72efad; }