/* ~~ This the css file for the Responsive Design of Virtual Deals from Ecommerce Templates.
The first section correponds to the maximum width version of 980 pixels ~~ */

@charset "utf-8";
body {
	font: 100%/1.5 Arial, serif;
	background: #fff;
	margin: 0;
	padding: 0;
	color: #000;
	background:url(images/bg3.jpg) repeat-x;
}



/* ~~ Element/tag selectors ~~ */
ul, ol, dl { /* Due to variations between browsers, it's best practices to zero padding and margin on lists. For consistency, you can either specify the amounts you want here, or on the list items (LI, DT, DD) they contain. Remember that what you do here will cascade to the .nav list unless you write a more specific selector. */
	padding: 0;
	margin: 0;
}
h1, h2, h3, h4, h5, h6, p {
	margin-top: 0;	 /* removing the top margin gets around an issue where margins can escape from their containing div. The remaining bottom margin will hold it away from any elements that follow. */
	padding-right: 15px;
	padding-left: 15px; /* adding the padding to the sides of the elements within the divs, instead of the divs themselves, gets rid of any box model math. A nested div with side padding can also be used as an alternate method. */
}
a img { /* this selector removes the default blue border displayed in some browsers around an image when it is surrounded by a link */
	border: none;
}

/* ~~ Styling for your site's links must remain in this order - including the group of selectors that create the hover effect. ~~ */
a:link {
	color: #42413C;
	text-decoration: underline; /* unless you style your links to look extremely unique, it's best to provide underlines for quick visual identification */
}
a:visited {
	color: #6E6C64;
	text-decoration: underline;
}
a:hover, a:active, a:focus { /* this group of selectors will give a keyboard navigator the same hover experience as the person using a mouse. */
	text-decoration: none;
}


/* ~~this fixed width container surrounds the other divs~~ */
.container {
	width: 960px;
	background: #fff;
	margin: 0 auto; /* the auto value on the sides, coupled with the width, centers the layout */
}

/* ~~ the header  ~~ */
.header {
	background: #fff;
}

.top {
	background: #e0e0e0;
	height:37px;
	width:960px;
}

.topleft{
	width:750px;
	float:left;
	text-align:right;
	color:#8a8a8a; 
	font-size:0.8em; 
	margin-top:9px;
}

.topleft a{  
	color:#8a8a8a; 
	font-size:0.9em; 
	margin:0 7px; 
	text-decoration:none;
}

.topleft a:hover{  
	color:#e06e1d; 
	text-decoration:underline;  
}

.topright{
	width:167px;
	float:right;
	text-align:right;
}

.logo{
	height:120px;
	padding-top:11px;
	float:left;
	width:320px;
	margin-top:3px;
}


.topsocial{
	width:200px;
	float:right;
	height:100px;
	padding-top:1px;
	text-align:center;
	margin-right:20px;
}



.topsocial img{ 
	margin-right:20px; 
}

.topheading{
	width:450px;
	float:left;
	height:88px;
	padding-top:1px;
	text-align:center;
}

/* ~~ the search form  ~~ */

.topsearch{
	width:410px;
	float:right;
	height:50px;
	padding-top:36px;
}

#form-search p	{
	padding: 0;
	margin: 0;
}
	
#form-search label, #input-keywords, #submit-search{
	vertical-align: middle;
	padding: 0;
	margin: 0;
	height:25px;
}
	
#input-keywords	{
	border-width: 1px 0 1px 1px;
	border-style: solid;
	border-color:#ccc;
	height: 23px;
	width: 356px;
	line-height: 20px;
 	padding-left: 2px;
}

/* ~~ Top horizontal navigation bar ~~*/

#cssmenu {
  position: relative;
  height: 44px;
  background: #2b2f3a;
  width: auto;
}
#cssmenu ul {
  list-style: none;
  padding: 0;
  margin: 0;
  line-height: 1;
}
#cssmenu > ul {
  position: relative;
  display: block;
  background: #2b2f3a;
  width: 100%;
  z-index: 500;
}
#cssmenu:after,
#cssmenu > ul:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}
#cssmenu.align-right > ul > li {
  float: right;
}
#cssmenu.align-center ul {
  text-align: center;
}
#cssmenu.align-center ul ul {
  text-align: left;
}
#cssmenu > ul > li {
  display: inline-block;
  position: relative;
  margin: 0;
  padding: 0;
}
#cssmenu > ul > #menu-button {
  display: none;
}
#cssmenu ul li a {
  display: block;
  font-family: Helvetica, sans-serif;
  text-decoration: none;
}
#cssmenu > ul > li > a {
  font-size: 14px;
  font-weight: bold;
  padding: 15px 20px;
  color: #7a8189;
  text-transform: uppercase;
  -webkit-transition: color 0.25s ease-out;
  -moz-transition: color 0.25s ease-out;
  -ms-transition: color 0.25s ease-out;
  -o-transition: color 0.25s ease-out;
  transition: color 0.25s ease-out;
}
#cssmenu > ul > li.has-sub > a {
  padding-right: 32px;
}
#cssmenu > ul > li:hover > a {
  color: #ffffff;
}
#cssmenu li.has-sub::after {
  display: block;
  content: "";
  position: absolute;
  width: 0;
  height: 0;
}
#cssmenu > ul > li.has-sub::after {
  right: 10px;
  top: 20px;
  border: 5px solid transparent;
  border-top-color: #7a8189;
}
#cssmenu > ul > li:hover::after {
  border-top-color: #ffffff;
}
#indicatorContainer {
  position: absolute;
  height: 12px;
  width: 100%;
  bottom: 0px;
  overflow: hidden;
  z-index: -1;
}
#pIndicator {
  position: absolute;
  height: 0;
  width: 100%;
  border: 12px solid transparent;
  border-top-color: #2b2f3a;
  z-index: -2;
  -webkit-transition: left .25s ease;
  -moz-transition: left .25s ease;
  -ms-transition: left .25s ease;
  -o-transition: left .25s ease;
  transition: left .25s ease;
}
#cIndicator {
  position: absolute;
  height: 0;
  width: 100%;
  border: 12px solid transparent;
  border-top-color: #2b2f3a;
  top: -12px;
  right: 100%;
  z-index: -2;
}
#cssmenu ul ul {
  position: absolute;
  left: -9999px;
  top: 70px;
  opacity: 0;
  -webkit-transition: opacity .3s ease, top .25s ease;
  -moz-transition: opacity .3s ease, top .25s ease;
  -ms-transition: opacity .3s ease, top .25s ease;
  -o-transition: opacity .3s ease, top .25s ease;
  transition: opacity .3s ease, top .25s ease;
  z-index: 1000;
}
#cssmenu ul ul ul {
  top: 37px;
  padding-left: 5px;
}
#cssmenu ul ul li {
  position: relative;
}
#cssmenu > ul > li:hover > ul {
  left: auto;
  top: 44px;
  opacity: 1;
}
#cssmenu.align-right > ul > li:hover > ul {
  left: auto;
  right: 0;
  opacity: 1;
}
#cssmenu ul ul li:hover > ul {
  left: 170px;
  top: 0;
  opacity: 1;
}
#cssmenu.align-right ul ul li:hover > ul {
  left: auto;
  right: 170px;
  top: 0;
  opacity: 1;
  padding-right: 5px;
}
#cssmenu ul ul li a {
  width: 130px;
  border-bottom: 1px solid #eeeeee;
  padding: 10px 20px;
  font-size: 12px;
  color: #9ea2a5;
  background: #ffffff;
  -webkit-transition: all .35s ease;
  -moz-transition: all .35s ease;
  -ms-transition: all .35s ease;
  -o-transition: all .35s ease;
  transition: all .35s ease;
}
#cssmenu.align-right ul ul li a {
  text-align: right;
}
#cssmenu ul ul li:hover > a {
  background: #f2f2f2;
  color: #8c9195;
}
#cssmenu ul ul li:last-child > a,
#cssmenu ul ul li.last > a {
  border-bottom: 0;
}
#cssmenu > ul > li > ul::after {
  content: '';
  border: 6px solid transparent;
  width: 0;
  height: 0;
  border-bottom-color: #ffffff;
  position: absolute;
  top: -12px;
  left: 30px;
}
#cssmenu.align-right > ul > li > ul::after {
  left: auto;
  right: 30px;
}
#cssmenu ul ul li.has-sub::after {
  border: 4px solid transparent;
  border-left-color: #9ea2a5;
  right: 10px;
  top: 12px;
  -moz-transition: all .2s ease;
  -ms-transition: all .2s ease;
  -o-transition: all .2s ease;
  transition: all .2s ease;
  -webkit-transition: -webkit-transform 0.2s ease, right 0.2s ease;
}
#cssmenu.align-right ul ul li.has-sub::after {
  border-left-color: transparent;
  border-right-color: #9ea2a5;
  right: auto;
  left: 10px;
}
#cssmenu ul ul li.has-sub:hover::after {
  border-left-color: #ffffff;
  right: -5px;
  -webkit-transform: rotateY(180deg);
  -ms-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
  transform: rotateY(180deg);
}
#cssmenu.align-right ul ul li.has-sub:hover::after {
  border-right-color: #ffffff;
  border-left-color: transparent;
  left: -5px;
  -webkit-transform: rotateY(180deg);
  -ms-transform: rotateY(180deg);
  -moz-transform: rotateY(180deg);
  -o-transform: rotateY(180deg);
  transform: rotateY(180deg);
}
@media all and (max-width: 800px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) {
  #cssmenu {
    width: auto;
  }
  #cssmenu.align-center ul {
    text-align: left;
  }
  #cssmenu.align-right > ul > li {
    float: none;
  }
  #cssmenu ul {
    width: auto;
  }
  #cssmenu .submenuArrow,
  #cssmenu #indicatorContainer {
    display: none;
  }
  #cssmenu > ul {
    height: auto;
    display: block;
  }
  #cssmenu > ul > li {
    float: none;
  }
  #cssmenu li,
  #cssmenu > ul > li {
    display: none;
  }
  #cssmenu ul ul,
  #cssmenu ul ul ul,
  #cssmenu ul > li:hover > ul,
  #cssmenu ul ul > li:hover > ul,
  #cssmenu.align-right ul ul,
  #cssmenu.align-right ul ul ul,
  #cssmenu.align-right ul > li:hover > ul,
  #cssmenu.align-right ul ul > li:hover > ul {
    position: relative;
    left: auto;
    top: auto;
    opacity: 1;
    padding-left: 0;
    padding-right: 0;
    right: auto;
  }
  #cssmenu ul .has-sub::after {
    display: none;
  }
  #cssmenu ul li a {
    padding: 12px 20px;
  }
  #cssmenu ul ul li a {
    border: 0;
    background: none;
    width: auto;
    padding: 8px 35px;
  }
  #cssmenu.align-right ul ul li a {
    text-align: left;
  }
  #cssmenu ul ul li:hover > a {
    background: none;
    color: #8c9195;
  }
  #cssmenu ul ul ul a {
    padding: 8px 50px;
  }
  #cssmenu ul ul ul ul a {
    padding: 8px 65px;
  }
  #cssmenu ul ul ul ul ul a {
    padding: 8px 80px;
  }
  #cssmenu ul ul ul ul ul ul a {
    padding: 8px 95px;
  }
  #cssmenu > ul > #menu-button {
    display: block;
    cursor: pointer;
  }
  #cssmenu #menu-button > a {
    padding: 14px 20px;
  }
  #cssmenu ul.open li,
  #cssmenu > ul.open > li {
    display: block;
  }
  #cssmenu > ul.open > li#menu-button > a {
    color: #fff;
    border-bottom: 1px solid rgba(150, 150, 150, 0.1);
  }
  #cssmenu ul ul::after {
    display: none;
  }
  #cssmenu #menu-button::after {
    display: block;
    content: '';
    position: absolute;
    height: 3px;
    width: 22px;
    border-top: 2px solid #7a8189;
    border-bottom: 2px solid #7a8189;
    right: 20px;
    top: 15px;
  }
  #cssmenu #menu-button::before {
    display: block;
    content: '';
    position: absolute;
    height: 3px;
    width: 22px;
    border-top: 2px solid #7a8189;
    right: 20px;
    top: 25px;
  }
  #cssmenu ul.open #menu-button::after,
  #cssmenu ul.open #menu-button::before {
    border-color: #fff;
  }
}


div#topnav{
	width:960px;
	height:32px;
	background:#080808;
	text-align:center;
	margin-bottom:1px;
}
div#topnav ul{
	font-size: 0.9em;
	color: #999;
	text-align: center;
	margin: 0;
	padding-top:6px;
	height:21px;
	padding-left: 0px;
}
div#topnav ul li{
	display: inline;
}
div#topnav ul li a{
	padding: 5px 10px 5px 10px;
	color: #fff;
	text-decoration: none;
	border-left: 1px solid #A19D9A;
	border-right: 1px solid #A19D9A;
	margin-right: -1px;
}
div#topnav ul li a:hover{
	background-color: #115592;
	color: #EDEFF2;
}

.freebar{
	width:960px;
	height:55px;
	background:#4D4D4D;
	margin-bottom:32px;
	background:url(images/topbg2.jpg) repeat-x;
	text-align:center;
}

.freebar img{ 
	margin:0px 54px 0px 30px;
}

/* ~~ These are the columns for the layout. ~~ */
.sidebar1 {
	float: right;
	width: 180px;
	background: #fff;
	padding-bottom: 10px;
}
.content {
	padding: 0px;
	width: 768px;
	float: left;
	margin-left:12px;
}

.content-home {
	padding: 0px;
	width: 968px;
	float: left;
	margin-left:0px;
}

/* ~~ This grouped selector gives the lists in the .content area space ~~ */
.content ul, .content ol { 
	padding: 0 15px 15px 40px;
}

/* ~~ the menu titles  ~~ */
p.menuhead{
  	width:131px;  border-top: 1px solid #ccc;
   	border-right: 1px solid #ccc;
   	border-left: 1px solid #ccc;
  	margin-bottom:0px;
  	padding:2px 4px 4px 44px;
  	font-size:0.9em;
  	background:url(images/menudown.gif) repeat-y;
}

ul.nav {
	list-style: none;
	border-top: 1px solid #EF965A;
	margin-bottom: 15px;
}
ul.nav li {
	border-bottom: 1px solid #EF965A; 
}
ul.nav a, ul.nav a:visited {
	padding: 2px 2px 2px 15px;
	display: block; 
	width: 160px;
	text-decoration: none;
	background: #fff;
  	font-size:0.8em;
}
ul.nav a:hover, ul.nav a:active, ul.nav a:focus { 
	background: #EF965A;
	color: #FFF;
}

div.minicartoneline{
background:#fff;
}
div.minicartoneline1{
padding:2px;
font: normal 12px Arial, sans-serif;
float:left;
color:#333;
}
div.minicartoneline2{
padding:2px;
font: normal 12px Arial, sans-serif;
float:left;
color:#333;
}
div.minicartoneline3{
padding:2px;
font: normal 12px Arial, sans-serif;
color:#333;
}



/* ~~ The footer ~~ */
.footer {
	padding: 10px 0;
	background: #FCEFE6;
	background:url(images/foobg1.jpg) repeat-x;
	position: relative;
	clear: both; 
	height:180px;/* ~~ If you add extra content to the footer you will need to increase the height here. ~~ */
}

div.footer1{
	width:960px;
	margin: 0 auto;
}

div.foobar{
	width:960px;
	margin: 0 auto;
	height:24px;
	background:#E3C8B4;
}

div.cards{
	width:480px;
	float:left;
}

.cards img{margin:0px 10px 0px 10px; cursor:pointer;  vertical-align:top; }

div.ftrsocial{
	width:480px;
	float:right;
	text-align:right;
}

.ftrsocial img{margin-right:25px;}

div.foo1{
	font: 0.8em Arial, Helvetica, sans-serif;
	float:left;
	width:220px;
	padding: 0 0 0 10px;
	line-height:1.7em;
}

.foo1 a, .foo2 a, .foo3 a, .foo4 a{color:#36302C; text-decoration:none;}
.foo1 a:hover, .foo2 a:hover, .foo3 a:hover, .foo4 a:hover{text-decoration:underline;}

.foo2{
	font: 0.8em Arial, Helvetica, sans-serif;
	float:left;
	padding:0 10px 10px 10px;
	width:220px;
	color: #666;
	line-height:1.7em;
}

.foo3{
	font: 0.8em Arial, Helvetica, sans-serif;
	color: #666;
	float:left;
	width:220px;
	padding:0 10px 10px 10px;
	line-height:1.7em;
}

.foo4{
	font: 0.8em Arial, Helvetica, sans-serif;
	float:right;
	line-height:1.7em;
	width:220px;
}

p.foothead{
	font-weight:bold; 
	text-align:left;  
	margin: 20px 0px 10px 0px;
	font-size:0.9em;
	color:#232323;
	line-height:25px;
	padding-left:0px;
}

.ftrbtm{
	width:480px;
	float:left;
	font-size:0.7em;
	color: #666;
  	margin-top:6px;
}

.ftrbtm1{
	width:480px;
	float:right;
	text-align:right;
	font-size:0.7em;
	color:#666;
	margin-top:6px;
}

/* ~~ Horizontal rule ~~*/
HR {
	height: 0;
	border-width: 1px 0 0 0;
	border-style: solid;
	border-color: #DA6B1D;
}

/* ~~ Table backgrounds for cart, search etc ~~*/
table.cobtbl{
	background-color: #CAE5AE;
  	width:98%;
  	margin-left:10px;
} 

td.cobhl{
	background-color:#fff;
	font-weight: normal;
	color:#333;
  	font-size:0.9em;
}

td.cobll{
	background-color: #fff;
	color : #333;
  	font-weight:normal;
  	font-size:0.8em;
}

/* ~~ Mini cart ~~*/
td.mincart {
	font-size: 0.7em;
	background-color: #fff;
	padding:1px;
}

p.mincart {
	font-size: 0.7em;
}

table.mincart{
	background-color: #fff;
	width: 200px;
	border-radius: 4px;
	padding:1px;
}


/* ~~ miscellaneous float/clear classes ~~ */
.fltrt {  /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page. The floated element must precede the element it should be next to on the page. */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* this class can be placed on a <br /> or empty div as the final element following the last floated div (within the #container) if the #footer is removed or taken out of the #container */
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}

/* ~~ the home page layout  ~~ */
.slider-left{ 
	width:1px; 
	float:left; 
	
}

.slider-left img{ 
	margin-top:0px;
}

.slider-left-bottom{ 
  	width:1px; 
  	height:99px; 
  	background:#E8E4E3; 
  	padding-left:1px; 
  	padding-top:18px; 
  	color:#0f0f0f; 
  	font-size:0.9em; 
}

.slider-left-bottom a{
	color:#0f0f0f; 
	font-size:1.1em;
	text-decoration:none;
}

.slider-left-bottom a:hover{ 
	text-decoration:underline;
}

.slider-right{ 
	width:960px; 
	height:auto; 
	float:center;
	
}

.slider-right-home{ 
	width:960px; 
	height:auto; 
	float:center;
	
}

.middle-logo{
	width:760px; 
	height:61px; 
	margin-top:1px;
}

.middle-logo img{ 
	float:center; 
	margin-right:1px;
	border:1px solid #D6D4D2;
}

.middle-logo-home{
	width:960px; 
	height:81px; 
	margin-top:20px;
}


.middle-logo-home img{ 
	float:center; 
	margin-right:50px;
	border:1px solid #D6D4D2;
}

.gaming-computers-main{ 
	width:975px; 
	height:800px;  
	margin-top:30px;
}

.gaming-computers-main2{ 
	width:975px; 
	height:680px;  
	margin-top:20px;
}

.gaming-computers-main3{ 
	width:975px; 
	height:420px;  
	margin-top:20px;
}

.gaming-computers-main4{ 
	width:975px; 
	height:990px;  
	margin-top:20px;
}

.desktop-computers-main1{ 
	width:975px; 
	height:300px;  
	margin-top:20px;
}


.gaming-computers-left{ 
	width:250px; 
	height:370px; 
	margin-left:45px; 
	border:1px solid #303030;
	float:left;
	margin-top:20px;
	padding:5px;
	
}

.gaming-pcs-1{ 
	width:250px; 
	height:100px; 
	margin-left:45px; 
	border:1px solid #303030;
	float:left;
	margin-top:20px;
	padding:5px;
	
}

.gaming-computers-left2{ 
	width:230px; 
	height:550px; 
	margin-left:45px;
	padding: 10px; 
	padding-top: 0px; 
	
	float:left;
	margin-top:20px;
}
.gaming-computers-left3{ 
	width:230px; 
	height:340px; 
	margin-left:45px;
	padding: 10px; 
	padding-top: 0px; 
	
	float:left;
	margin-top:20px;
}

.gaming-computers-inner{ 
	width:190px; 
	height:250px; 

	margin-left:19px; 
	color:#fff;
	font-size:1.4em;
	
}

.gaming-computers-left-inner5{ 
	width:250px; 
	height:575px; 
	
}

.gaming-computers-left5{ 
	width:250px; 
	height:550px; 
	margin-left:40px;
	padding: 10px; 
	padding-top: 0px; 	
	float:left;
	margin-top:20px;
}

.prodcenter{ width:210px; 
	height:25px; 
	margin-top:165px; 
	margin-left:90px; 
	font-size:1.4em; 
}

.white{ 
	color:#fff;
}


.gaming-computers3{  
	width:250px; 
	height:370px; 
	background: url(prodimages/sys3_ico.jpg) no-repeat; 
	float:left; 
	color:#fff; 
	font-size:1.2em;
	margin-left:16px; 
	
}

.heading-main{ 
	width:439px; 
	margin-top:20px; 
	color:#535159; 
	font-size:1.1em;
	float:left;
}


.heading-main-home{ 
	width:639px; 
	margin-top:20px; 
	color:#535159; 
	font-size:1.1em;
	float:left;
}

.heading-main h1, .heading-main-home h1{ 
	color:#e06e1d; 
	font-size:30px; 
	font-weight:normal; 
	margin:0px; 
	padding:0px; 
	margin-bottom:14px; 
	font-weight:bold;
}

.heading-main2{ 
	width:960px; 
	font-size:20px;
	color:#535159; 
	font-size:1.1em;
	float:center;
}

.heading-main2 h1, .heading-main-home2 h1{ 
	color:#e06e1d; 
	font-size:20px; 
	font-weight:normal; 
	margin:40px; 
	padding:0px; 
	margin-bottom:14px; 
	font-weight:bold;
	float:center;
}

.heading-main h2, .heading-main-home h2{ 
	color:#e06e1d; 
	font-size:20px; 
	font-weight:normal; 
	margin:0px; 
	padding:0px; 
	margin-bottom:14px; 
	font-weight:bold;
}

p.homeblurb{
	font-size:0.9em;
}
p.blurb{
	font-size:0.7em;
}

p.blurb2{
	font-size:0.6em;
}

.bullet-point{ 
	width:276px; 
	float:right; 
	margin-top:20px; 
	margin-right:9px;
}

.bullet-point-home{ 
	width:276px; 
	float:left; 
	margin:20px 30px 0px 18px;
}

.bullet-point h1, .bullet-point-home h1{ 
	color:#9db86f; 
	font-size:2em;
	margin:0px; 
	padding:0px; 
	font-weight:normal; 
	margin-bottom:23px; 
	font-weight:bold;
}

ul.bullet { 
	list-style:none; 
	margin:0px; 
	padding: 0px 0 5px 0px ; 
}

ul.bullet li { 
	background: url(images/bullet.jpg) no-repeat; 
	background-position:0px 1px; 
	background-repeat:no-repeat; 
	padding-left:20px; 
	padding-bottom:18px; 
	color:#dc6e1d;
}

ul.bullet2 { 
	list-style:none; 
	margin:1px;
	font-size:.8em;
	padding: 0px 0 5px 0px ; 
}

ul.bullet2 li { 
	background: url(images/bullet.jpg) no-repeat; 
	background-position:0px 1px; 
	background-repeat:no-repeat; 
	padding-left:20px; 
	padding-bottom:7px; 
	color:#dc6e1d;
}


/* The product page - view all the available classes at http://www.ecommercetemplates.com/help/css-layouts.asp
-------------------------------------*/
div.prodfilter{
	float:left;
	background-color:#F9F9F4;
	border: 1px dotted #D7D1C9;
	padding:6px;
	font-weight:bold;
	color: #42619a;
	margin-bottom:10px;
	margin-top:10px;
}

div.prodfilterbar{
	float:left;
	width:640px;
}

select.prodfilter{
	padding:0px;
	margin:0px;
}

div.product{
	padding:2px;
	width:240px;
	float:left;
	height:486px;
	margin:2px;
	border:1px solid #D3EDA4;
	background-color:#FeFeF6;
}

div.prodnavigation{
	padding:10px;
	float:left;
	width:560px;
}

div.checkoutbutton{
	width:180px;
	float:right;
}

div.allproddiscounts{
	color:#DA6A1E;
	width:768px;
	margin-bottom:2px;
	float:left;
}

.proddiscounts, .discountsapply{
	color:#DA6A1E;
	padding:4px;
}

div.prodmanufacturer{
	color:#666;
	padding:6px;
}

div.prodsku{
	color:#666;
	padding:6px;
}

div.prodimage{
	padding-top: 6px;
	text-align:center;
}

img.prodimage{
	border: 1px solid #ccc;
}

div.prodname{
	padding:10px;
	font-size: 0.9em;
	text-align:center;
}

div.prodrating{
	padding-left:4px;
}

div.prodinstock{
	padding:4px;
	color:#666;
}

div.proddescription{
	padding:6px;
	float:left;
  	font-size: 0.9em;
}

/* ~~ product options ~~ */
div.prodoptions{
	padding:6px;
	width:226px;
	float:left;
	border: 1px solid #ccc;
	background:#fff;
}

select.prodoption{
	font-size: 0.9em;
	width:130px;
	float:right;
	margin:6px;
}

span.prodoption{
	font-size: 1em;
	padding: 2px;
}

div.optiontext{
	padding: 2px;
	font-size: 0.8em;
	width: 70px;
	float:left;
	margin:2px;
}

div.option{
	padding: 0px;
	float:left;
}


div.listprice{
	padding: 2px;
	text-align:center;
	width:256px;
	float:left;
  	font-size: 0.9em;
}

div.prodprice{
	padding: 4px;
	font-size: 1.3em;
	font-weight:bold;
	text-align:center;
	float:left;
	width:256px;
	color:#DA6A1E;
}

div.prodcurrency{
	padding: 2px;
	text-align:center;
	float:left;
	width:256px;
	font-size: 0.7em;
	color:#666;
}

div.addtocart{
	text-align:center;
	padding-top:6px;
	float:left;
	width:256px;
}

.notifystock{
	text-align:center;
	padding-top:6px;
	float:left;
	width:256px;
}

.configbutton{
	text-align:center;
	margin-top:6px;
}

div.outofstock{
	text-align:center;
	padding-top:6px;
	font-weight:bold;
}

.prodid {
	background: #D7D1C9;
	color:#333;
	padding:6px;
	text-align:center;
	font-size: 1.1em;
}

div.multioptiontext{
	width:180px;
}

div.pagenums{
	text-align:center;
	float:left;
	padding:10px;
}


/* The product detail page 
-------------------------------------*/

div.detailimage{
	width:400px;
	padding:10px;
	float:center;
	height:300px;
}

.detailid {
	color:#000;
	width:460px;
	padding-bottom:10px;
	font-size: 1em;
}

.detailmanufacturer{
	float:right;
	width:340px;
}

.detailsku{
	float:right;
	width:346px;
}

.detailinstock{
	float:right;
	width:342px;
	border-bottom:1px #ccc dotted;
}

.detailname {
	color:#000;
	padding:6px;
	width:530px;
	float:right;
	font-size: 1.1em;
}

.detaildiscounts{
	color:#DA6B1D;
	font-weight:bold;
	font-size: 0.8em;
	float:right;
	width:536px
}

span.detaildiscountsapply{
	color:#DA6B1D;
	font-weight:bold;
	font-size: 0.9em;
}


div.detaildescription{
	font-size: 0.8em;
	margin-top:5px;
	float:left;
	padding-top:4px;
	width:600px;
}


.detaillistprice{
	text-align:center;
	float:left;
	width:530px;
}

div.detailprice{
	font-size: 1.2em;
	font-weight:bold;
	text-align:center;
	float:left;
	width:530px;
	padding-top:2px;
	color:#DA6A1E;
}

div.detailcurrency{
	padding-top: 6px;
	font-size: 0.7em;
	text-align:center;
	float:left;
	width:530px;
	color:#666;
}

.detailoptions{
	padding: 6px;
	float:left;
	width:600px;
	padding-left:26px;
}

select.detailprodoption{
	font-size: 0.9em;
	float:right;
	width:400px;
	margin:6px;
}

.detailoptiontext{
	padding: 1px;
	min-width:120px;
	float:left;
}

div.review{
	width:560px;
}

.previousnext{
	padding-top:10px;
	padding-bottom:6px;
	float:right;
	width:530px;
	text-align:center;
	font-size:0.8em;
}

div.emailfriend{
	padding-top: 10px;
	text-align:center;
	float:right;
	width:530px;
    font-size:0.8em;
}

div.detailquantity{
	padding-top:20px;
	float:right;
	width:400px;
}

div.detailquantitytext{
	margin:4px;
	float:left;
	width:174px;
	text-align:right;
}

div.detailquantityinput{
	margin:4px;
	float:right;
	width:210px;
	text-align:left;
}

div.detailaddtocart,.detailoutofstock{
	margin:4px;
	float:right;
	width:530px;
	text-align:center;
	border-bottom:1px #ccc dotted;
	padding-bottom:10px;
}

.detailnotifystock{
	text-align:center;
	padding-top:6px;
	float:left;
	width:570px;
}

div.review{
	float:left;
}

div.navdesc{
	padding-top:10px;
}

p.cstitle{
	float:left;
	width:530px;
}

.csproduct{
	float:left;
	width:530px;
}


/* The category page 
-------------------------------------*/
div.category{
	width:280px;
	float:left;
}


div.catimage{
	width:130px;
	float:left;
}

div.catdesc{
	padding:0px 0px 4px 12px;
}

div.catname{
	margin-top:16px;
	padding-left:12px;
}

.catdiscounts, .allcatdiscounts{
	padding-left:5px;
	font-weight:bold;
	color:#DA6B1D;

}

.categorymessage{
	padding-left:5px;
	padding-top:6px;
	font-size: 1.1em;
}


/* This is the first breakpoint and is for screen sizes between 772 and 980 pixels. 
If there is no difference in the classes above, you would use the classes above or if you need to make changes at this resolution, add them below
-------------------------------------*/
@media screen and (max-width: 980px) {
  
.container {
	width: 772px;
}
  
.top {
	width:772px;
}

.topleft{
	width:550px;
}
  
  .logo{
	width:230px;
}

.topsocial{
	width:150px;
}


/* ~~ the search form  ~~ */

.topsearch{
	width:380px;
}

#input-keywords	{
	width: 326px;
}
  
div#topnav{
	width:772px;
}

.freebar{
	width:772px;
}

.freebar img{ 
	margin:0px 4px 0px 3px;
}

.content{
	width:568px;
}
  
.content-home {
	width: 772px;
}
  
.slider-right{ 
	width:568px; 
}
  
.slider-right-home{ 
	width:760px; 
}
  
.slider-left-bottom{
    display:none;
}
  
.middle-logo{
	width:468px; 
	margin-left:90px;
}
  
.middle-logo-home{
	width:740px; 
	margin-left:0px;
}
  
span.logo4{
    display:none;
}
  
span.logos772{
    display:none;
}
  
.heading-main{
    width:568px;
}
  
.bullet-point{ 
	float:left; 
    width:568px;
}
  
.gaming-computers-main{ 
	width:772px; 
}

.gaming-computers-main2{ 
	width:772px; 
}

.gaming-computers-main3{ 
	width:772px; 
}

.gaming-computers-main4{ 
	width:772px; 
}

.desktop-computers-main1{ 
	width:772px; 
}
  
.gaming-computers-left{ 
	margin-left:60px; 
}

.gaming-computers-left2{ 
	margin-left:60px; 
}
.gaming-computers-left3{ 
	margin-left:60px; 
}
  
.gaming-computers3{
	float:left; 
	margin-top:18px;
  	margin-left:60px; 
}
  
.heading-main-home{
    float:left;
    width:770px;
}
  
div.footer1{
	width:768px;
}

div.foobar{
	width:768px;
}

div.cards{
	width:360px;
	float:left;
}

div.ftrsocial{
	width:360px;
  	padding-right:6px;
}
  
div.foo1, .foo2, .foo3, .foo4{
	width:178px;
}

.ftrbtm{
	width:380px;
  	padding-left:2px;
}

.ftrbtm1{
	width:380px;
  	padding-right:2px;
}
/* The products page 
-------------------------------------*/
div.prodnavigation{
    width:360px;
}
  
div.allproddiscounts{
	width:568px;
}
  /* The product detail page 
-------------------------------------*/
.detailid {
	width:330px;
}

.detailmanufacturer{
	width:330px;
}

.detailsku{
	width:330px;
}

.detailinstock{
	width:330px;
}

.detailname {
	width:330px;
	font-size: 1em;
}

.detaildiscounts{
	width:338px
}

div.detaildescription{
	width:330px;
}

.detaillistprice{
	width:330px;
}

div.detailprice{
	width:330px;
}

div.detailcurrency{
	width:330px;
}



.detailoptions{
	padding: 6px;
	float:left;
	width:400px;
	padding-left:126px;
}

select.detailprodoption{
	font-size: 0.9em;
	float:right;
	width:220px;
	margin:6px;
}

.detailoptiontext{
	padding: px;
	min-width:110px;
	float:left;
}


.previousnext{
	width:330px;
}

div.emailfriend{
	width:330px;
 }

div.detailquantity{
	width:300px;
}

div.detailquantitytext{
	margin:4px;
	float:left;
	width:114px;
	text-align:right;
}

div.detailquantityinput{
	width:170px;
}

div.detailaddtocart,.detailoutofstock{
	width:330px;
}

.detailnotifystock{
	width:330px;
}

}
  
/* This is the second breakpoint and is for screen sizes between 468 and 758 pixels. 
If there is no difference in the classes above, you would use the classes above or if you need to make changes at this resolution, add them below
*/
@media screen and (max-width:758px) {
	
.container {
	width: 468px;
}
  
.top {
	width:468px;
}
  
.topleft{
	width:280px;
}
  
.topsocial{
	display:none;
}

  
  .topsearch{
	width:236px;
}

#input-keywords	{
	width: 182px;
}
  
div#topnav{
	width:468px;
}

.freebar{
	width:468px;
}
  
.topnav1{
    display:none;
}
  
span.day{
    display:none;
}
  
.slider-left{
    display:none;
}
  
.content, .content-home{
    width:468px;
    margin:0px;
}

.slider-right-home, .slider-right{ 
	width:468px; 
}
  
.logos468{
    display:none;
}
  
.middle-logo, .middle-logo-home{
	width:448px; 
	margin-left:10px;
}
  
div.sidebar1{
	display:none;
}
  
.gaming-computers-main{ 
	width:314px; 
}

.gaming-computers-main2{ 
	width:314px; 
}

.gaming-computers-main3{ 
	width:314px; 
}  

.gaming-computers-main4{ 
	width:314px; 
}

.desktop-computers-main1{ 
	width:314px; 
}  

  
  
.heading-main-home, .heading-main{
    width:468px;
}

.sale{
	display:none;
}


.bullet-point{ 
	width:468px;
}

div.nosearchresults{
	width:460px;
}
  
div.footer1{
	width:468px;
}

div.foobar{
	width:468px;
}

div.cards{
	display:none;
}

div.ftrsocial{
	width:460px;
    text-align:center;
}
  
div.foo1, .foo2, .foo3{
	width:130px;
}
  
.foo4{
	display:none;
}

.ftrbtm{
	width:260px;
}

.ftrbtm1{
	width:200px;
}

/*tables for cart and search*/
table.cobtbl{
	font-size: 0.8em;
    margin-left:8px;
    margin-bottom:12px;
} 

/*the product page*/
div.prodfilter{
	display:none;
}
  
div.prodfilterbar{
	display:none;
}

div.product{
	width:428px;
	height:auto;
	margin-left:14px;
}

div.prodnavigation{
	width:428px;
	padding-left:14px;
}

div.checkoutbutton{
	width:428px;
	float:left;
	padding-left:12px;
}

div.allproddiscounts{
	width:428px;
	padding-left:14px;
}

div.prodoptions{
	width:412px;
}

select.prodoption{
	width:200px;
}

div.optiontext{
	min-width: 175px;
}

div.listprice{
	width:428px;
}

div.prodprice{
	width:428px;
}

div.prodcurrency{
	width:428px;
}

div.addtocart{
	width:428px;
}

div.pagenums{
	width:428px;
}

.notifystock{
	width:428px;
}

/*the detail page*/
div.detailimage{
	width:428px;
	margin-left:6px;
    height:auto;
}

.detaillistprice{
	width:420px;
    float:left;
}

.detailid {
	width:428px;
 	margin-left:16px;
    float:left;
}

.detailmanufacturer{
	width:442px;
    float:left;
}
  
  .detailsku{
	width:446px;
    float:left
}

.detailinstock{
	width:440px;
    float:left;
}

.detailname {
	width:440px;
    float:left;
}

.detaildiscounts{
	width:450px;
    float:left;
}

div.detailprice{
	width:440px;
    float:left;
}

div.detailcurrency{
	width:440px;
    float:left;
}

.detailprodoption{
	width:220px;
	float:right;
}

div.detailoptiontext{
    min-width:240px;
	float:left;
}

div.detailoptions{
	width:460px;
	padding-left:10px;
	float:left;
}

div.review{
	width:400px;
	margin-left:16px;
}

div.detaildescription{
	width:420px;
    float:left;
}

.previousnext{
	width:440px;
}

div.emailfriend{
	width:440px;
}

div.detailquantity{
	width:400px;
}

div.detailquantitytext{
	width:180px;
}

div.detailquantityinput{
	width:200px;
}

div.detailaddtocart,.detailoutofstock{
	width:440px;
}

.detailnotifystock{
	width:440px;
}

div.category{
	width:420px;
}

}


/* This is the third breakpoint and is for smartphones. 
If there is no difference in the classes above, you would use the classes above or if you need to make changes at this resolution, add them below
*/
@media screen and (max-width:400px) {
	
	
.container {
	width: 308px;
}

.top {
	width:308px;
}
  
.topleft{
	width:280px;
}
  
.topright{
    display:none;
}

.sale{
	display:none;
}
  
#navlist{
    display:none;
}
.topsearch{
	width:308px;
    float:left;
    height:0px;
    margin:0px;
    padding-top:16px;
}

#input-keywords	{
	width: 252px;
    margin-top:3px;
}
  
#submit-search{
    margin-top:3px
  }
  
div#topnav{
	width:308px;
}

.freebar{
	width:308px;
}
  
  
span.free{
    display:none;
}
  
.content, .content-home{
    width:308px;
    margin:0px;
}
  
.slider-right-home, .slider-right{ 
	width:308px; 
}
  
.middle-logo, .middle-logo-home{
	display:none;
}
.bullet-point-home{
    margin-left:1px;
}
  
.gaming-computers-main{ 
	width:308px; 

}

.gaming-computers-main2{ 
	width:308px; 
	
}

.gaming-computers-main3{ 
	width:308px;

}

.gaming-computers-main4{ 
	width:308px; 
	
}

.desktop-computers-main1{ 
	width:308px;

}

  
.gaming-computers-left, .gaming-computers3, .gaming-pcs-1{
    margin-left:20px;
    margin-right:0px;
    padding:5px;
	
}

.gaming-computers-left2{
    margin-left:20px;
    margin-right:0px;
    padding:5px;
	width:250px; 
	height:370px;
}

.gaming-computers-left3{
    margin-left:20px;
    margin-right:0px;
    padding:5px;
	width:250px; 
	height:370px;
}

   
.heading-main-home, .heading-main{
    width:308px;
}

.heading-main-home h1, .heading-main h1{
    font-size:1.8em;
}

.heading-main2 h1, .heading-main-home2 h1{ 
	
	font-size:16px; 
	
}
  
.bullet-point-home, .bullet-point{
    width:308px;
}
 
div.footer1{
	width:308px;
}

div.foobar{
	width:308px;
}

div.ftrsocial{
	width:308px;
    text-align:center;
}
  
div.foo1, .foo2{
	width:130px;
}
  
.foo3{
	display:none;
}

.ftrbtm{
	width:200px;
}

.ftrbtm1{
	width:96px;
}

div.nosearchresults{
	width:300px;
}


/* ~~ Remove left hand cart column ~~*/
.cobcol1{
	display:none;
}

/* ~~ Modify additional info field on checkout ~~*/
textarea.addinfo{
	width:150px;
}

/*the product page*/
div.prodfilter{
	display:none;
}
  
div.prodfilterbar{
	display:none;
}

div.prodnavigation{
	width:190px;
}

div.checkoutbutton{
	width:280px;
	float:left;
	margin-left:6px;
}

div.allproddiscounts{
	font-size: 1em;
	width:290px;
	margin-left:4px;
}

div.product{
	width:290px;
	height:auto;
	margin-left:4px;
}

div.prodnavigation{
	width:280px;
	padding-left:14px;
}

div.prodoptions{
	width:274px;
}

select.prodoption{
	width:130px;
}

div.optiontext{
	min-width: 142px;
}

div.listprice{
	width:236px;
}

div.prodprice{
	width:292px;
}

div.prodcurrency{
	width:292px;
}

div.addtocart{
	width:292px;
}

.notifystock{
	width:292px;
}

div.pagenums{
	width:292px;
	padding:2px;
}

/*the detail page*/
div.detailimage{
	width:292px;
	padding:6px;
	float:left;
}

.detailid {
	width:100%;
	float:left;
	margin-left:10px;
}

.detailmanufacturer{
	width:292px;
}

.detailinstock{
	width:292px;
}

.detailname {
	width:292px;
}

.detaildiscounts{
	width:292px
}

.detaillistprice{
	width:292px;
}

div.detailprice{
	width:292px;
}

div.detailcurrency{
	width:292px;
}

div.detailoptions{
	width:280px;
	padding-left:6px;
}

.detailoptiontext{
	width:140px;
}

select.detailprodoption{
	width:118px;
}
div.review{
	width:278px;
	margin-left:6px;
}
.previousnext{
	width:292px;
}

div.emailfriend{
	display:none;
}

div.detailquantity{
	width:192px;
}

div.detailquantitytext{
	width:120px;
}

div.detailquantityinput{
	width:40px;
}
div.detaildescription{
	width:292px;
}

div.detailaddtocart,.detailoutofstock{
	width:292px;
}

.detailnotifystock{
	width:292px;
}

p.cstitle{
	float:left;
	width:292px;
}

.csproduct{
	float:left;
	width:292px;
}

/*the category page*/
div.category{
	width:292px;
}

}



