*{background:none repeat scroll 0 0 transparent;border:0 none;font-size:100%;margin:0;padding:0;outline:0;
   font-family: 'Roboto', sans-serif;}
html{overflow-y:scroll;}

img {margin: 0; displday: block;}

#wrapper {width: 1240px; margin: auto; bordfer: 1px solid red; overfslow: hidden;}
.fluid-rightmargin { margin-right: 9px; }

.home_banners > div {float: left; margin-right:10px; margin-bottom:10px; width: 240px;}
.home_banners .last {margin-right: 0;}

.autosize img {max-width: 100%;}

body { background: #333 url('[[site.background]]') fixed; background-color: #333; !important; background-repeat: no-repeat !important; background-position: center 146px !important; }
.home_banners img {max-width: 100%;}
.fluid-rightmargin img {max-width: 100%;}

b { font-weight: bold; }
strong {font-weight: bold}


.prettyinput
{
    background: white;
    margin: auto;
    width: 500px;

    border: 1px rgba(0,0,0,0.2) solid;
    border-radius: 10px;
    padding: 18px;
}

.prettyinput input
{
    background: white;
    border: 1px solid #dddddd;
    wiudth: 100%;
    border: 1px solid #CCCCCC;
    border-radius: 3px 3px 3px 3px;
    color: #808080;
    display: inline-block;
    font-size: 13px;
    height: 16px;
    width: 320px;
    line-height: 16px;
    padding: 8px 8px 8px 8px;
    margin-bottom: 6px;
}

.prettyinput select
{
    background: white;
    border: 1px solid #dddddd;

    border: 1px solid #CCCCCC;
    border-radius: 3px 3px 3px 3px;
    color: #000000;
    display: inline-block;
    font-size: 13px;
    height: 32px;
    width: 320px;
    line-height: 16px;
    padding: 8px 8px 8px 8px;
    margin-bottom: 6px;

}
.prettyinput input:after{
    clear: both;
}
.prettyinput label
{
    float: left;
    width: 120px;
    margin-top: 8px;
}

.prettyinput  input[type=checkbox] {
  width: 13px;
  height: 13px;
  padding: 0;
  margin:0;
  vertical-align: bottom;
  position: relative;
  top: -1px;
  *overflow: hidden;
}



.prettyinput button
{
        box-shadow: 0px 1px 0px 0px rgb(245, 151, 142) inset;
        background: red;
    background: rgb(242, 69, 55) linear-gradient(to bottom, rgb(242, 69, 55) 5%, rgb(198, 45, 31) 100%) repeat scroll 0% 0%;
    border-radius: 6px;
    border: 1px solid rgb(208, 39, 24);
    display: block;
    cursor: pointer;
    color: rgb(255, 255, 255);
    font-family: Arial;
    font-size: 24px;
    font-weight: bold;
    padding: 9px 32px;
    text-decoration: none;
    text-shadow: 0px 1px 0px rgb(129, 14, 5);
    margin: auto;
    margin-top: 10px;

}

.fielderror {
    display: block;
    position: static;
    margin-top: 0.35rem;
    font-size: 0.85em;
    line-height: 1.4;
    color: #c4334e;
    font-weight: 500;
}

.prettyinput .fielderror {
    position: absolute;
    background:url("/theme/falcon/images/errorarrow.png") no-repeat;
    margin-left: 120px;
    padding-left: 16px;
    color: #AA0000;
    display: block;
}

cell { width : 240px; display: inline-block; padding: 2px;}

#left-side {
    position: absolute;
	width: 200px;
    top: 0px;
    margin-left:-200px;
    height: 1000px;
	border: 0px solid white;
}

#right-side {
	position: absolute;
	top: 0px;
    margin-left:1000px;
    height: 1000px;
}

.skin-mainbanner {
    width: 100%;
    max-width: 1240px;
    margin: 0 auto;
}

.skin-mainbanner div {
    width: 100%;
    height: min(400px, calc(100vw * 0.3226));
    max-height: 400px;
    background-size: cover;
    background-position: center;
    overflow: hidden;
}

a {text-decoration: none; color: #096bf2;}
a:hover {text-decoration: none; color: ##599bf2;}
.clear {clear: both;}
.left {float :left  !important;}
.right {float: right !important;}
.hidden {display: none;}

indut {border: 1px solid #aaaaaa; background-color: #ffffff; height: 20px;}
img {margin: 0px;}
h1 {font-size: 200%;}
h2 {font-size: 140%;}
h2 strong {font-size: 140%;}
h3 {font-size: 165%; margin-block-start: 19.8px; margin-block-end: 19.8px;}
h4 {font-size: 150%;}
p {margin-bottom: 10px;}
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
    background: transparent;
    border: 3px dashed #dd0000;
     min-height: 30px;
    color: #363636;
}
.ui-state-highlight a, .ui-widget-content .ui-state-highlight a, .ui-widget-header .ui-state-highlight a {
    color: #ff0000;

    height: 10px;
}

.livecolumn {min-height: 10px;}
#headerlogo a
{background: url("/theme/falcon/images/falcon-logo.png?3") no-repeat transparent; }


.black-center{background-color: #000000; height: 100%; width:100%; text-align:center; color: #77b900; }

.black-center span {color: #77b900;}
.black-center td {vertical-align: top;}
.black-center table {margin: auto;}
.builderpage {background: url("/content/systembuilder/builder-bg.jpg") no-repeat #000000; width:100%;  height: 100%}


#logobottom a {background: url("/theme/falcon/images/falcon-logo.png?3") no-repeat transparent; background-position:-0px -74px; top: 80px; width: 110px; height: 46px; text-indent: -2000px; position: absolute; z-index: 9999; }

#ProductCode span {margin-left: 16px;}
/*** Sprite Handlers ***/
.checkoutbutton,  .footer_cards,.searchbutton,
.systemscarousel .coda-nav-left a,.systemscarousel .coda-nav-right a,
.productcarousel .coda-nav-left a,.productcarousel .coda-nav-right a,
.systemscarousel-button, .systemscarousel-button i
{background: url("/theme/falcon/images/sprites.png") no-repeat transparent; }

.splitbox { background-color: white; border: 1px solid #999999; margin-top: 10px; width: 100%;
-moz-box-shadow: 2px 2px 3px #ccc;
-webkit-box-shadow: 2px 2px 3px #ccc;
box-shadow: 2px 2px 3px #ccc;}

.rightsplitbox { background-color: white; border: 1px solid #999999; float: right; width: 100%; margin-top: 10px;
-moz-box-shadow: 2px 2px 3px #ccc;
-webkit-box-shadow: 2px 2px 3px #ccc;
box-shadow: 2px 2px 3px #ccc;
}

.vertline {  }

.large {font-size: 18px !important;}

/*** Site Header ***/
#top-container {position: relative; width: 1024px; margin: auto; clear: both; height: 29px}

#header { background-color: black; width: 100%;  margin: auto; position: relative; z-inddex: 2; height: 80px; position: relative;}

#headerlogo {float: left;}
#headerlogo a { background-position: 0px 0px; display: block; width:360px; height:74px; top: 6px;  ldeft: -6px; position: absolute; z-index: 3001; text-indent: -2000px }

#front-left-panel {background-color: transparent; width: 192px; min-height: 600px; float: left;}
#front-right-panel {background-color: transparent; width: 192px; min-height: 600px; float: left;}

#front-main {float: left; width: 630px; min-height: 100px; bordder: 1px solid #444444; margin-l6eft: 10px; margin-ri6ght: 0px; margin-top: 10px; margin-bottom:10px; border-bottom-left-radius: 4px; border-bottom-right-radius: 4px;}
.front-advert {background-color: transparent; bordder: 1px solid grey; paddidng:5px; margin-top: 10px; margin-bottom: 0px;  width: 192px; min-height: 40px;  overflow: hidden; box-sdhadow: 0 0 2px #1A1A1A;}
.front-advert img {margin-bottom: 10px; vertical-align: bottom}

.front-panel {background-color: #ffffff; width: 618px; min-height: 598px; border: 1px solid grey; marsgin-left: 10px; mardgin-right: 10px; margin-top: 10px; box-shadow: 0 0 2px #1A1A1A;}

#searchbar {width: 290px; float: left; background-color: #2e2e2e; border: 1px solid #4b4848; height: 32px; margin-top: 50px; margin-left: 420px; margin-top: 32px;}
#searchbar input{ width: 208px; margin: 0px; height: 32px; float: left; vertical-align: center; padding: 0px 2px 0px 2px; color: #a0a0a0; font-size: 16px}

.searchbutton {background-position: 0px -108px; margin-top: 5px; margin-right: 4px; float: right;
    height: 20px;
    width: 25px;vertical-align: top;}

#topbar { backgroudnd: url("/theme/falcon/images/top-bar-back.png?1");  widtdh: 500px; bordder-left: 1px solid #77b900; bordedr-right: 1px solid #77b900; bordder-bottom: 1px solid #77b900; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;
           margin-right: 32px; height: 23px; padding-left: 0px; padding-top: 0px; margin-bottom: 20px; right: 10px; position: absolute;}

#topbar ul {list-stylse: none;}
#topbar ul li {display: block; height: 18px; float: left; padding: 2px 10px 2px 10px; display: block; margin-top: 0px; color: white; font-size: 12px; font-weight: bold; color: #ffffff;}
#topbar ul li a { text-decoration: none; color: #ffffff; font-size: 12px;}



.editable {background-color: #999999;}

/*** Site ***/
#site-container{backgrosnd-color: white;width: 1020px; min-height:650px;
                  bacdkground-color: #0;
    borders: 1px solid #2C2E33;
    borderd-left: 1px solid #2C2E33;
    border-radius: 0 0 6px 6px;
    border-rigsht: 1px solid #2C2E33;
    padding: 0px; margin:0 auto;text-align:left; clear:both; z-index: 0; }

#page-content {  background-color: #ffffff; max-width: 100%;
                 padding: 0px 0px 0px 0px; margin-left: 0px;min-height: 400px;
                 flsoat: left; overfdlow:hidden;
               }

.jcarousel-skin-mainbanner {background-color: white; width: 929px; height: 275px !important; paddding: 5px; bordder: 1px solid grey; box-shdadow: 0 0 2px #1A1A1A; margin-bottsom: 10px;}
.jcarousel-skin-mainbanner div {width: 929px !important; height: 275px !important; overflow: hidden; }
.jcarousel-skin-mainbanner:hover { box-shadow: 0 0 4px #000000; }


/* Page Navigation */
.page_navigation{margin-top: 4px; margin-bottom: 5px; font-size: 11px; float:right; }
.page_navigation a{font-size: 12px; color: #660066; font-weight: bold; text-decoration: none; color: #000000;  }
.page_navigation span{border:0px solid #999999; padding:2px 5px 2px 5px; margin-left: 1px;}
.page_navigation .current {font-weight: bold; font-size:14px; padding:2px 3px 2px 3px; color: #008800; }

/*** Mini Cart ***/
#minicart li {height: auto !important;}
.popdownbox { background: none repeat scroll 0 0 #000000; color: #eeeeee; border: 1px solid #77b900; border-radius: 5px; box-shadow: 2px 2px 20px 0px #77b900; display: none; margin: 0 0 0 0px; padding: 8px; position: absolute; top: 81px; width: 280px; z-index: 2500;}
#shoppingcart-drop { top: 22px; right: -8px; width: 400px; z-index: 5000px; color: #aeaeae !important;
background: rgb(28,28,28);
background: -moz-linear-gradient(top, rgba(28,28,28,1) 0%, rgba(63,63,63,1) 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(28,28,28,1)), color-stop(100%,rgba(63,63,63,1)));
background: -webkit-linear-gradient(top, rgba(28,28,28,1) 0%,rgba(63,63,63,1) 100%);
background: -o-linear-gradient(top, rgba(28,28,28,1) 0%,rgba(63,63,63,1) 100%);
background: -ms-linear-gradient(top, rgba(28,28,28,1) 0%,rgba(63,63,63,1) 100%);
background: linear-gradient(to bottom, rgba(28,28,28,1) 0%,rgba(63,63,63,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1c1c1c', endColorstr='#3f3f3f',GradientType=0 );}

#shoppingcart-drop h4 {color: #77b900; margin-left: 10px; font-weight: bold;}
#shoppingcart-drop ul {list-style: none; padding: 10px;}
#shoppingcart-drop li  {color: #aeaeae !important; clear: both; overflow: hidden; border-bottom: 1px dotted #77b900; padding-bottom: 6px; width: 360px;}
#shoppingcart-drop li img {float: left; border: 1px solid black; margin-right: 5px; border-radius: 5px;}
#shoppingcart-drop .inc_tax {font-size: 15px; color: #77b900;text-align: right; }
#shoppingcart-drop .ex_tax { float: right; }
#shoppingcart-drop .price {float: right;}
#shoppingcart-drop .summary {clear:both; padding:10px;  font-size: 15px; text-align: right; font-size: 18px; overflow: hidden; }
#shoppingcart-drop .summary span {flosat: right; font-size: 18px;}
#shoppingcart-drop .summary .price {float: right;width: 120px;}
#shoppingcart-drop .summary .inc_tax {font-size: 18px !important;}

/*** Buttons ***/
.checkoutbutton { font-size: 13px; margin-top: 4px; margin-bottom: 4px; margin-right: 10px; float: right; width: 98px; height: 30px;  border: 1px solid #000000; color: #efefef; border-radius: 6px; }
.checkoutbutton:hover {}

.checkouttxt {font-weight: bold; color: #e0e0ff !important;}

/*** Hover Sprite ***/
.hoverSprite:hover{background-position: 150px 0px }
.hoverSprite{width:150px; height:150px; display: block;}


/*** ***/
 .tick, .cross {background: url('/theme/falcon/images/sprites.png?3') #ffffff}
.tick { background-position: -20px -88px; display: inline-block; width:  18px; height: 18px; line-height: 12px; margin-right: 4px; }
.cross { background-position: -0px -88px; display: inline-block; width:  18px; height: 18px; line-height: 12px; margin-right: 4px; }

.available-collect strong, .available-homedelivery strong {
    line-height: 18px; margin: 0px; padding: 0px; padding-bottom:2px; font-size: 11px; vertical-align: middle;
}


.instock { color: #009900}
.outofstock { color: #99000;}



/*** Footer ***/

#footer-wrapper {background-color: black; /* Old browsers */
 width: 100%;}
#footer {margin: auto; wixdth: 108px; height:180px; background-color: black; padding: 10px; position: relative;}
#footer dd {font-size: 12px; color: #5F5F5F; margin-bottom: 2px;}
#footer dd a {font-size: 12px; color: #5F5F5F;}
#footer dd a:hover {color: #ffffff;}
#footer dt {color: #096bf2; font-size: 18px; margin-bottom: 6px;}
#footer dl {float: left; width: 170px; position: relative; padding-right: 0px; texdt-align: center; border-ridght: 1px solid #333333; margin-right: 10px;  height: 170px;}
#footer dl.first { width: 210px; margin-left: 40px; }
#footer dl.last { border-right: 0px; }

.footer_cards {background-position: -0px -132px; width:140; height: 150px;}

.arrowDown {
    border-left: 5px solid rgba(0, 0, 0, 0);
    border-right: 5px solid rgba(0, 0, 0, 0);
    border-top: 5px solid #626262;
    float: left;
    margin-left: 5px;
    margin-top: 5px;
    font-size: 1px;
}

/*** CMS ***/
.cmspage {color: #2f2f2f; padding: 20px; min-height: 650px; font-family: times, Times New Roman, times-roman, georgia, serif; font-size: 16px;  background-color: #ffffff;}
.cmspage p {  font-family: times, Times New Roman, times-roman, georgia, serif; font-size: 16px; color: #222222;}
.cmspage h2 {  font-family: times, Times New Roman, times-roman, georgia, serif; font-size: 26px; color: #222266; font-style: italic; line-height: 40px; margin-top:10px;}
.cmspage h1 { font-family: times, Times New Roman, times-roman, georgia, serif; font-size: 36px;line-height: 44px; margin-bottom:6px; color: #222266;}
.cmspage strong {font-weight: bold;}
.cmspage img {margin: auto;}
.cmspage td {color: #2f2f2f; padding-right: 14px;}
.cmspage a {color: #2f2f2f; font-size: 16px;}
.cmspage ol {margin-left: 20px;}
.cmspage ul {margin-left: 20px;}

.cmsblack {background-color: #000000; color: #cccccc;}
.cmsblack p {color: #cccccc;}
.cmsblack a {color: #cccccc;}
/*** Carousel ***/
.jcarousel-skin-mainbanner {height:929px; overflow: hidden;}
.jcarousel-skin-mainbanner li {list-style: none;}
.jcarousel-skin-mainbanner .jcarousel-container-horizontal {width:929px; padding: 0px 0px;}
.jcarousel-skin-mainbanner .jcarousel-clip-horizontal {width: 929px; height: 100%;}
.jcarousel-skin-mainbanner .jcarousel-item {width: 929px; height: 100%;}
.jcarousel-skin-mainbanner .jcarousel-item-horizontal {margin-left: 0;margin-right: 0px;}


/* Most common stuff you'll need to change */
.coda-slider-wrapper { padding: 0px 0 }
.coda-slider { background: #000000 }
.coda-slider-no-js .coda-slider { height: 300px; overflow: auto !important; padding-right: 20px }
.coda-slider, .coda-slider .panel { width: 1024px }
.coda-slider-wrapper.arrows .coda-slider, .coda-slider-wrapper.arrows .coda-slider .panel { width: 1024px }
.coda-slider-wrapper.arrows .coda-slider { margin: 0 10px }
.coda-nav-left a, .coda-nav-right a { background: #000; color: #fff; padding: 5px; width: 100px }
.coda-nav ul li a.current { background: #39c }
.coda-slider .panel-wrapper { padding: 20px }
.coda-slider p.loading { padding: 20px; text-align: center }
.coda-nav ul { clear: both; display: block; margin: auto; overflow: hidden }
.coda-nav ul li { display: inline }
.coda-nav ul li a { background: #555555; color: #fff; display: block; float: left; margin-right: 1px; padding: 3px 6px; text-decoration: none }
.coda-slider-wrapper { clear: both; overflow: hidden }
.coda-slider { float: left; overdflow: hidden; position: relative }
.coda-slider .panel { display: block; float: left }
.coda-slider .panel-container { position: relative; overflow: hidden;}
.coda-nav-left, .coda-nav-right { float: left }
.coda-nav-left a, .coda-nav-right a { display: block; text-align: center; text-decoration: none }



/*** System Advert Panels ***/
.systemscarousel { position: relative;
    width: 1024px;
    overdflow: hidden;}

.systemscarousel-panel { width: 1024px; height: 555px;float: left; display: none;}
.systemscarousel-column{ bordser: 1px solid #096bf2;  background-color: #000000;  position: relative; width: 325px; height: 525px;  margin-left: 8px; margin-right: 4px; float:left; }


.systemscarousel .coda-nav {
    right: 0;
    position: absolute;
    top: 0;
}

.systemscarousel .coda-nav ul {
    z-index: 1000;
    margin: auto;
    margin-top: 5px;
    flodat: right;
    position: absolute;
    right: 20px;
    width: 100px;
}

.systemscarousel .coda-nav ul li {
    width: 10px;
}

.systemscarousel .header h2{
    font-size: 24px;
    width: 980px;
    background-color: #2e2e2e;
}

.systemscarousel .coda-nav-left a {
    height: 56px;
    opacity: 1;
    position: absolute;
    text-align: center;
    text-decoration: none;
    text-indent: -9999em;
    top: 250px;
    width: 28px;
    background-position: -424px -0px;
    left: -20px;
    z-index: 10;

}
.systemscarousel .coda-nav-left a:hover {
       opacity: 0.4;
}

.systemscarousel ul li a {
    width:2px;
    height: 10px;
    border-radius: 4px;
    text-indent: -3000px;
    color: #efefef;
         margin-left: 2px;
}

.systemscarousel .coda-nav-right a {
    height: 56px;
    opacity: 1;
    position: absolute;
    text-align: center;
    text-decoration: none;
    text-indent: -9999em;
    top: 250px;

    width: 28px;
    background-position: -461px -0px;
    right: -20px;
    z-index: 10;
}
.systemscarousel .coda-nav-right a:hover {
    opacity: 0.4;
}

.systemscarousel .title {
    height: 24px;
    backgrdound-color: #2e2e2e;
    border-bdottom: 1px solid #cccccc;
    font-size: 22px;
    padding-left: 10px;
    padding-top: 0px;
    padding-bottom: 2px;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
    color: #9f9f9f;

}

.systemscarousel-column .price   { position: absolute; top: 458px; left: 100px; width: 130px; text-align: center; font-size: 48px; color: #efefef; font-family: Impact, Charcoal, sans-serif}
.systemscarousel-column .buttons { position: absolute; top: 452px; left: 230px;  padding-top: 6px;}
.systemscarousel-button  { font-size: 13px; padding: 6px 2px 6px 6px; width: 90px; height: 28px; text-align: center; margin-top: 0px; margin-bottom: 2px; margin-right: 8px; float: right;  background-position: -145px -54px; border: 1px solid #000000; color: #efefef; border-radius: 6px;  }
.systemscarousel-button i { background-position: -26px -110px; margin-left: 6px; width: 12px; height: 16px; float: right; display: block;}


.systemadvert-name {color: #efefef; font-weight: bold; font-size: 15px; line-height: 20px;}

/*** Customer Panel ***/
#customer-loginregister {background-color: #ffffff; margdin-top:20px; margdin-left: 150px; padding: 40px 0px 40px 180px; overfslow: hidden; border: 0px solid black;}
#customer-loginregister .login-section {position: relative; width: 278px; height:220px;border: 1px solid #e0e0e0; background-color: #F6F6F6; padding: 10px; float: left; margin-left: 10px; margin-right: 10px; box-shadow: 2px 2px 10px 2px}
#customer-loginregister .register-section {position: relative; width: 278px; height:320px;border: 1px solid #e0e0e0; background-color: #F6F6F6; padding: 10px; float: left; margin-left: 10px; margin-right: 10px; box-shadow: 2px 2px 10px 2px}
#customer-loginregister h4 { font-size: 12px; color: #000000; margin-top:4px; margin-bottom: 2px; font-weight: normal;}
#customer-loginregister p { font-size: 12px; color: #000000; margin-bottom: 8px;}
#customer-loginregister ul { margin-left: 16px; font-size: 12px; color: black;}
#customer-loginregister li { font-size: 12px; color: black;}
#customer-loginregister .header { border-bdottom: 1px solid #e0e0e0; height: 30px; font-size: 14px; font-weight: bold; backgroudnd-color: #dacaf4; color: #440044; font-family: "Adobe Caslon Pro", "Hoefler Text", Georgia, Garamond, Times, serif; font-size: 20px; text-align: center;}
#customer-loginregister input{border:1px solid gray; background-color: #ffffff; height: 20px; width: 276px; font: 12px/15px Arial,Helvetica,sans-serif;}
#customer-loginregister .bottominput {position: absolute; bottom: 103px; height: 50px;}
#customer-loginregister button { background-color: #880000; position: absolute; overflow: visible; cursor: pointer; bottom: 10px; right: 10px;  border: 0px;  color: #000000; display: block;font-family: "Adobe Caslon Pro", "Hoefler Text", Georgia, Garamond, Times, serif; font-size: 24px; text-align: center; padding: 2px 6px 2px 6px; outline: none   ;}

#customer-loginregister .fielderror { background:url("/theme/falcon/images/errorarrow.png") no-repeat; padding-left: 16px; color: #AA0000; display: block;}

#customer-loginregister button {width: 140px; height: 30px; font-size: 20px; color: #ffffff;}


/*** Color Box ***/
#colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
#cboxOverlay{position:fixed; width:100%; height:100%;}
#cboxMiddleLeft, #cboxBottomLeft{clear:left;}
#cboxContent{position:relative;}
#cboxLoadedContent{overflow:auto;}
#cboxTitle{margin:0;}
#cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
#cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
.cboxPhoto{float:left; margin:auto; border:0; display:block;}
.cboxIframe{width:100%; height:100%; display:block; border:0;}
#cboxOverlay{background:url(/theme/falcon/images/colorbox/overlay.png) repeat 0 0;}
#colorbox{}
#cboxTopLeft{width:21px; height:21px; background:url(/theme/falcon/images/colorbox/controls.png) no-repeat -101px 0;}
#cboxTopRight{width:21px; height:21px; background:url(/theme/falcon/images/colorbox/controls.png) no-repeat -130px 0;}
#cboxBottomLeft{width:21px; height:21px; background:url(/theme/falcon/images/colorbox/controls.png) no-repeat -101px -29px;}
#cboxBottomRight{width:21px; height:21px; background:url(/theme/falcon/images/colorbox/controls.png) no-repeat -130px -29px;}
#cboxMiddleLeft{width:21px; background:url(/theme/falcon/images/colorbox/controls.png) left top repeat-y;}
#cboxMiddleRight{width:21px; background:url(/theme/falcon/images/colorbox/controls.png) right top repeat-y;}
#cboxTopCenter{height:21px; background:url(/theme/falcon/images/colorbox/border.png) 0 0 repeat-x;}
#cboxBottomCenter{height:21px; background:url(/theme/falcon/images/colorbox/border.png) 0 -29px repeat-x;}
#cboxContent{background:#fff; overflow:hidden;}
.cboxIframe{background:#fff;}
#cboxError{padding:50px; border:1px solid #ccc;}
#cboxLoadedContent{margin-bottom:28px;}
#cboxTitle{position:absolute; bottom:4px; left:0; text-align:center; width:100%; color:#949494;}
#cboxCurrent{position:absolute; bottom:4px; left:58px; color:#949494;}
#cboxSlideshow{position:absolute; bottom:4px; right:30px; color:#0092ef;}
#cboxPrevious{position:absolute; bottom:0; left:0; background:url(/theme/falcon/images/colorbox/controls.png) no-repeat -75px 0; width:25px; height:25px; text-indent:-9999px;}
#cboxPrevious:hover{background-position:-75px -25px;}
#cboxNext{position:absolute; bottom:0; left:27px; background:url(/theme/falcon/images/colorbox/controls.png) no-repeat -50px 0; width:25px; height:25px; text-indent:-9999px;}
#cboxNext:hover{background-position:-50px -25px;}
#cboxLoadingOverlay{background:url(/theme/falcon/images/colorbox/loading_background.png) no-repeat center center;}
#cboxLoadingGraphic{background:url(/theme/falcon/images/colorbox/loading.gif) no-repeat center center;}
#cboxClose{position:absolute; top:0; right:0; background:url(/theme/falcon/images/colorbox/controls.png) no-repeat -25px 0; width:25px; height:25px; text-indent:-9999px;}
#cboxClose:hover{background-position:-25px -25px;}
.cboxIE #cboxTopLeft,.cboxIE #cboxTopCenter,.cboxIE #cboxTopRight,.cboxIE #cboxBottomLeft,.cboxIE #cboxBottomCenter,.cboxIE #cboxBottomRight,.cboxIE #cboxMiddleLeft,.cboxIE #cboxMiddleRight { filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);}
.cboxIE6 #cboxTopLeft{background:url(images/ie6/borderTopLeft.png);}
.cboxIE6 #cboxTopCenter{background:url(images/ie6/borderTopCenter.png);}
.cboxIE6 #cboxTopRight{background:url(images/ie6/borderTopRight.png);}
.cboxIE6 #cboxBottomLeft{background:url(images/ie6/borderBottomLeft.png);}
.cboxIE6 #cboxBottomCenter{background:url(images/ie6/borderBottomCenter.png);}
.cboxIE6 #cboxBottomRight{background:url(images/ie6/borderBottomRight.png);}
.cboxIE6 #cboxMiddleLeft{background:url(images/ie6/borderMiddleLeft.png);}
.cboxIE6 #cboxMiddleRight{background:url(images/ie6/borderMiddleRight.png);}
.cboxIE6 #cboxTopLeft,.cboxIE6 #cboxTopCenter,.cboxIE6 #cboxTopRight,.cboxIE6 #cboxBottomLeft,.cboxIE6 #cboxBottomCenter,.cboxIE6 #cboxBottomRight,.cboxIE6 #cboxMiddleLeft,.cboxIE6 #cboxMiddleRight { _behavior: expression(this.src = this.src ? this.src : this.currentStyle.backgroundImage.split('"')[1], this.style.background = "none", this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src=" + this.src + ", sizingMethod='scale')");}


.errorpage {margin: 0px; background: url('/theme/falcon/images/404.jpg?1'); min-height: 500px; color: #efefef; padding: 30px; font-size: 12px;}
.errorpage h1 {color: #efefef; font-size: 50px; font-family: impact; text-align: center;}
.errorpage dt {font-size: 16px; color: #999999;}
.errorpage dl {float: left; margin: 12px;}
.errorpage .bar {background: rgba(0,0,0,.7); overflow: hidden; padding: 10px;}





.systembuilder-panel { box-shhadow: 1px 1px 5px #CCCCCC; margin-left: 0px;}

.systembuilder-paneldesc { padding-left: 40px; background-color: #efefef}

.systembuilder-panelheader {  background: #dedede url("/theme/falcon/images/admin/option-header.png"); height: 32px; font-size: 14px; padding-left: 20px; padding-top:10px;
                             margin-top: 10px;border-style: solid; bornder-color: #cccccc; bokrder-width: 1px 1px 0px 1px;}
.systembuilder-listpanel { margdin: 10px;  }
.systembduilder-listpanel input {float: left; margin-left: 10px; margin-top: 8px; }
.systembuilder-listpanel .img {float: left; margin-left:10px; margin-right:10px;}
.systembuilder-listpanel-row {width: 100%; height:80px; float: none; clear: both; border-botltom: 1px solid #aaaaaa;}

#systemtotal_wrap {vertical-align: bottom; position: relative;}
#systemtotal_wrap span {float: left; font-size: 16px;color:#aa0000; height: 20px; bottom: 0px;  position: relative;}
#systemtotal { font-family: impact; font-style: italic; font-size:34px; color:#aa0000; display: block; width: 180px; margin-top: 4px;}

.systembuilder-finaltable { font-size: 11px; line-height: 14px;width: 750px; float: left;}

.systembuilder-finaltable .label { font-size: 11px; width: 100px; display: inline-block;}

#systembuilder_mediapanel {float: left; width: 200px;}

.systembuilder-panel .diff {margin-left: 10px; color:red; font-weight:bold;}

#systembuilder_finaltotal {margin-left: 20px; font-family: impact; font-size: 40px;}

.priceoverview {
    width: 100%;
    float:right;
}
.systembuilder-panel img {wicdth: 190px; heighct: 190px; display: block;}
#systembuilder-tabs {
    margin-top:  10px;
    margin-left: 20px;
    margin-right: 20px;
    borsder-bottom: 1px solid #999999;
    padding: 0px;
    overflow: hidden;
    display: none;

}

#systembuilder-tabs .selected{
     background: #0000AA;
     color: white;
}

.systembuilder-tab {
    background: #aaaaaa url("/theme/falcon/images/admin/option-header.png");
    float: left;
    bdorder: 1px solid #888888;
    margin-right: 1px;
    height: 14px;
    border-top: 1px solid #cccccc;
    border-left: 1px solid #cccccc;
    border-right: 1px solid #cccccc;
    padding: 6px 8px 6px 8px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    font-size: 14px;
     cursor: pointer;
}



.systembuild_groupicon {
    width: 83px;
    height: 88px;
    padding-left: 4px;

    float: left;
    cursor: pointer;

    background: transparent url("/theme/falcon/images/systembuilder/black-icon.png");
}
.systembuild_groupicon span
{
    display: inline-block;
    width: 80px;
    color: white;
    font-size: 12px;
    margin-left: -2px;

}
#systembuilder_icons {
    background-color: transparent;
    pafdding-top:4px;

    height: 80px;
    text-align: center;
    bordedr-bottom: 1px solid #777777;
}


#systembuilder_icons .selected {
    bordesr: 1px solid #aaaaaa;
}

.section_icons .selected span {
    background-color: #0000aa;
    color: white;
    width: 100%;
    display: block;
}
#systembuilder_icons .img{
       background: transparent url("/theme/falcon/images/build-sprite-icons-2.png");
       width:  80px;
       height: 65px;
       position: relative;
}

#systembuilder_icons {
    text-align: center;
}

.systembuild_groupicon:hover .img{
    top: -3px;
    background-possition: -50px 0 !important;
}

#icon_case .img{
        background-position: 0px -0px;
}

#icon_processor .img{
        background-position: 0px -88px;
}

#icon_motherboard .img{
        background-position: 0px -174px;
}

#icon_memory .img{
        background-position: 0px -260px;
}

#icon_video .img{
        background-position: 0px -350px;
}

#icon_psu .img{
        background-position: 0px -442px;
}

#icon_harddrive .img{
        background-position: 0px -1044px;
}

#icon_optical .img{
        background-position: 0px -520px;
}

#icon_sound .img{
        background-position: 0px -610px;
}

#icon_network .img{
        background-position: 0px -610px;
}
#icon_operatingsystem .img{
        background-position: 0px -696px;
}

#icon_monitor .img{
        background-position: 0px -782px;
}

#icon_keyboard .img{
        background-position: 0px -870px;
}


#icon_mouse .img{
        background-position: 0px -960px;
}


#icon_extstorage .img{
        background-position: 0px -1044px;
}

#icon_speakers .img{
        background-position: 0px -1128px;
}

#icon_headset .img{
        background-position: 0px -1220px;
}

#icon_gaminggear .img{
        background-position: 0px -1310px;
}

#icon_mousepad .img{
        background-position: 0px -1394px;
}
#icon_extras .img{
        background-position: 0px -1480px;
}
#icon_software .img{
        background-position: 0px -1566px;
}
.systembuilder-tabpanel {
    display: none;
}

.productcarousel {
    background: transparent;
    ovedrflow: hidden;
    width: 1024px;
    hseight: 500px;
    margin-left: 80px;
}


/*.coda-slider, .coda-slider .panel */


.productcarousel .coda-nav {
    right: 0;
    position: absolute;
    top: -34px;

    display: display;
}

.productcarousel .coda-nav ul {

    z-index: 1000;
    margin: auto;
    margin-top: 5px;
    flodat: right;
    position: absolute;
    right: 20px;
    width: 100px;
}

.productcarousel .coda-nav ul li {
    width: 10px;

}

.productcarousel .coda-nav-left a {
    height: 56px;
    opacity: 1;
    position: absolute;
    text-align: center;
    text-decoration: none;
    text-indent: -9999em;
    top: 80px;
    width: 28px;
    background-position: -424px -0px;
    left: -30px;
    z-index: 10;

}
.productcarousel .coda-nav-left a:hover {
       opacity: 0.4;
}

.productcarousel ul li a {
    width:2px;
    height: 10px;
    border-radius: 4px;
    text-indent: -3000px;
    color: #efefef;
         margin-left: 2px;
}

.productcarousel .coda-nav-right a {
    height: 56px;
    opacity: 1;
    position: absolute;
    text-align: center;
    text-decoration: none;
    text-indent: -9999em;
    top: 80px;

    width: 28px;
    background-position: -461px -0px;
    right: -20px;
    z-index: 10;
}
.productcarousel .coda-nav-right a:hover {
    opacity: 0.4;
}

.coda-slider-wrapper { min-height: 300px;}


#systembuilder-page {background-color: #000000; position: relative; padding-top: 20px;}

.sb-view-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    margin: 0.35rem 0 0.9rem;
    padding: 4px;
    background: #f3f6fb;
    border: 1px solid rgba(78, 195, 255, 0.25);
    border-radius: 999px;
    color: #1f2a3c;
    font-size: 13px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.12);
}

.sb-actions--inline {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.sb-view-toggle label {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    cursor: pointer;
    padding: 0;
    border-radius: 999px;
    transition: background 0.2s ease, color 0.2s ease;
}

.sb-view-toggle input {
    display: none;
}

.sb-view-toggle label span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 12px;
    border-radius: 999px;
    color: #536179;
    font-weight: 600;
    transition: background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}

.sb-view-toggle label span::before {
    display: inline-block;
    font-size: 14px;
    line-height: 1;
}

.sb-view-toggle label span[data-mode="list"]::before {
    content: "\2630";
}

.sb-view-toggle label span[data-mode="carousel"]::before {
    content: "\25A6";
}

.sb-view-toggle input:checked + span {
    background: #fff;
    color: #1b2c3f;
    border-radius: 999px;
    padding: 8px 12px;
    box-shadow: 0 8px 16px rgba(30, 154, 232, 0.18);
    border: 1px solid rgba(78, 195, 255, 0.5);
}

.sb-list-mode .productcarousel,
.sb-list-mode .coda-slider-wrapper,
.sb-list-mode .coda-slider-wrapper .panel-container {
    width: auto !important;
    margin-left: 0 !important;
    overflow: visible !important;
}

.sb-list-mode .panel {
    float: none;
    width: 100% !important;
    display: block;
    padding: 0;
    margin: 0 0 0.5rem 0;
}

.sb-list-mode .systembuilder-item {
    width: 100%;
    height: auto;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px;
}

.sb-list-mode .systembuilder-item input {
    margin: 0;
}

.sb-list-mode .systembuilder-item img {
    width: 60px;
    height: 60px;
    object-fit: contain;
    margin: 0;
}

.sb-list-mode .systembuilder-item .sysproductname {
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.sb-list-mode .coda-slider-wrapper .panel-container {
    height: auto !important;
}

.systembuilder-item {
    opacity: 1;
    padding: 6px;
    width:190px;
    height:280px;
    float: left;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 10px;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.systembuilder-item.selected {
    border: 2px solid #4ec3ff;
    box-shadow: 0 0 0 3px rgba(78, 195, 255, 0.18);
}

.systembuilder-item:hover {
    border-color: rgba(78, 195, 255, 0.4);
}

.systembuilder-item .more-info-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: rgba(78, 195, 255, 0.15);
    color: #0f223d;
    font-weight: 700;
    text-decoration: none;
    margin-left: 6px;
    font-size: 12px;
    border: 1px solid rgba(78, 195, 255, 0.4);
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.systembuilder-item .more-info-icon:hover {
    transform: translateY(-1px);
    border-color: rgba(78, 195, 255, 0.7);
    box-shadow: 0 6px 12px rgba(15, 34, 61, 0.25);
}
.systembuilder-item .sysproductname {
    display: block;
    margin-top: 6px;
    font-size: 12px;
    line-height: 1.25;
    color: #0f141f;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.systembuilder-item .cboxElement.right {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: rgba(78, 195, 255, 0.15);
    border: 1px solid rgba(78, 195, 255, 0.4);
    text-decoration: none;
    font-size: 0;
    margin-left: 6px;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.systembuilder-item .cboxElement.right::after {
    content: 'i';
    font-size: 12px;
    font-weight: 700;
    color: #0f223d;
    line-height: 1;
}

.systembuilder-item .cboxElement.right:hover {
    transform: translateY(-1px);
    border-color: rgba(78, 195, 255, 0.7);
    box-shadow: 0 6px 12px rgba(15, 34, 61, 0.25);
}

.powermeter { position:absolute; left:300px; width: 300px; font-size: 10px;}
#powermeter h3 {color: #9f0000; font-size: 14px; font-weight: bold;}

.gpupowerusage {   background: #000000 url("/theme/falcon/images/systembuilder/battery2.png");width: 35px; height: 75px; margin-top: 6px; margin-right: 8px; float: right;}

.gpupowerusage_low {  background-position: 0px 0px;}
.gpupowerusage_medium {  background-position: -38px 0px;}
.gpupowerusage_ok {  background-position: -75px 0px;}
.gpupowerusage_high {  background-position: -113px 0px;}

#cboxLoadedContent > #ProductContainer {border: none !important; box-shadow: none;}


#newsletter {top: 20px; left: 800px; position: absolute; widdth: 150px; color: #cccccc; overflow:hidden;}

#newsletter div { border-radius: 4px; background-color: white; border: 1px solid #cccccc; padding: 4px;}

#newsletter input {background: #222222; border: 1px solid #111111; padding: 8px; wdidth: 200px; color: white;}

#newsletter button {border: 1px solid #666666; padding: 2px; cursor: pointer; color: #66ff66;}

.container_12 {
	margin-left: auto;
	margin-right: auto;
	width: 1020px;
}

.grid_1,.grid_2,.grid_3,
.grid_4,.grid_5,.grid_6,.grid_7,.grid_8,.grid_9,.grid_10,.grid_11,.grid_12 {
	display:inline;
	float: left;
	position: relative;
	margin: 5px;
}



.push_1, .pull_1, .push_2, .pull_2, .push_3, .pull_3,
.push_4, .pull_4, .push_5, .pull_5, .push_6, .pull_6,
.push_7, .pull_7, .push_8, .pull_8, .push_9, .pull_9,
.push_10, .pull_10, .push_11, .pull_11, .push_12, .pull_12 {
	position:relative;
}

/* Grid >> Children (Alpha ~ First, Omega ~ Last)
----------------------------------------------------------------------------------------------------*/

.alpha {margin-left: 0;}
.omega {margin-right: 0;}

/* Grid >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .grid_1 {width:75px;}
.container_12 .grid_2 {width:160px;}
.container_12 .grid_3 {width:245px;}
.container_12 .grid_4 {width:330px;}
.container_12 .grid_5 {width:415px;}
.container_12 .grid_6 {width:500px;}
.container_12 .grid_7 {width:585px;}
.container_12 .grid_8 {width:670px;}
.container_12 .grid_9 {width:755px;}
.container_12 .grid_10 {width:840px;}
.container_12 .grid_11 {width:925px;}
.container_12 .grid_12 {width:1010px;}

/* Prefix Extra Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/


.container_12 .prefix_1 {padding-left:85px;}
.container_12 .prefix_2 {padding-left:170px;}
.container_12 .prefix_3 {padding-left:255px;}
.container_12 .prefix_4 {padding-left:340px;}
.container_12 .prefix_5 {padding-left:425px;}
.container_12 .prefix_6 {padding-left:510px;}
.container_12 .prefix_7 {padding-left:595px;}
.container_12 .prefix_8 {padding-left:680px;}
.container_12 .prefix_9 {padding-left:765px;}
.container_12 .prefix_10 {padding-left:850px;}
.container_12 .prefix_11 {padding-left:935px;}

/* Suffix Extra Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .suffix_1 {padding-right:85px;}
.container_12 .suffix_2 {padding-right:170px;}
.container_12 .suffix_3 {padding-right:255px;}
.container_12 .suffix_4 {padding-right:340px;}
.container_12 .suffix_5 {padding-right:425px;}
.container_12 .suffix_6 {padding-right:510px;}
.container_12 .suffix_7 {padding-right:595px;}
.container_12 .suffix_8 {padding-right:680px;}
.container_12 .suffix_9 {padding-right:765px;}
.container_12 .suffix_10 {padding-right:850px;}
.container_12 .suffix_11 {padding-right:935px;}

/* Push Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/
.container_12 .push_1 {	left:85px;}
.container_12 .push_2 {left:170px;}
.container_12 .push_3 {left:255px;}
.container_12 .push_4 {left:340px;}
.container_12 .push_5 {left:425px;}
.container_12 .push_6 {left:510px;}
.container_12 .push_7 {left:595px;}
.container_12 .push_8 {left:680px;}
.container_12 .push_9 {left:765px;}
.container_12 .push_10 {left:850px;}
.container_12 .push_11 {left:935px;}
.container_12 .pull_1 {left:-85px;}
.container_12 .pull_2 {left:-170px;}
.container_12 .pull_3 {left:-255px;}
.container_12 .pull_4 {left:-340px;}
.container_12 .pull_5 {left:-425px;}
.container_12 .pull_6 {left:-510px;}
.container_12 .pull_7 {left:-595px;}
.container_12 .pull_8 {left:-680px;}
.container_12 .pull_9 {left:-765px;}
.container_12 .pull_10 {left:-850px;}
.container_12 .pull_11 {left:-935px;}

.clear { clear: both; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0;}

.clearfix:before,
.clearfix:after { content: '\0020'; display: block; overflow: hidden; visibility: hidden; width: 0; height: 0;}

.clearfix:after { clear: both; }
.clearfix { zoom: 1;}

.productlist {width: 100%; overflow: hidden;}

.productlist h2 {text-align: center;}
.productlist > .row {position: relative; clear: both; overfflow:hidden; heigsht: 320px; padding-left: 10px;}
.productlist > .row > .col {width: 300px; float: left;border-top: 1px solid #CCCCCC; padding-top: 4px; padding-bottom: 4px;}
.productlist .productTitle {font-size: 12px; color: #000000; font-weight: bold; }
.productlist .desc {height: 100px; padding: 0px 10px 0px 10px; background-dcolor: #cccccc; position: relative;}
.productlist .price {font-size: 16px; color: #Cb023A; position: absolute; bottom: 0px; height: 32px;}
.productlist .price > span {font-size: 10px; color: #888888;}

 .systembuilder-carouselpanel { paddindg-left: 10px;}


@media all and (max-width: 1240px) {
  #wrapper{ width: 100%; }
  .home_banners > div {float: left; margin-right:0.55%; margin-bottom:9px; width: 19.5%; overflow: hidden;}

  .fluid-rightmargin { margin-right: 6px; margin-bottom: 2px; height: 100%}
  body {background-image: none;}

  .productcarousel {margin-left: 34px; max-width: 100%}

  .systembuilder-carouselpanel { mdargin-left: 10px;}

  .jcarousel-skin-mainbanner ul {max-width: 100%}
  .jcarousel-skin-mainbanner {background-color: white; max-width: 100%; height: 100% !important; paddding: 5px; bordder: 1px solid grey; box-shdadow: 0 0 2px #1A1A1A; margin-bottsom: 10px;}
  .jcarousel-skin-mainbanner div {max-width: 100% !important; height: 100% !important; overflow: hidden; background-size:100% 100%;}
  .jcsarousel-skin-mainbanner:hover { box-shadow: 0 0 4px #000000; }

}

@media all and (max-width: 720px) {
  #wrapper{ width: 100%; }
  .home_banners > div {float: left; margin-right:0.50%; margin-bottom:9px;  width: 32.5%;}

  .fluid-rightmargin { margin-right: 6px; margin-bottom: 2px;}
  body {background-image: none;}

  .productcarousel {margin-left: 34px; max-width: 100%;}

  .systembuilder-carouselpanel { mdargin-left: 10px;}

   .jcarousel-skin-mainbanner {background-color: white; max-width: 100%; height: 100% !important; paddding: 5px; bordder: 1px solid grey; box-shdadow: 0 0 2px #1A1A1A; margin-bottsom: 10px;}
.jcarousel-skin-mainbanner div {width: 720px !important; height: 213px !important; overflow: hidden; background-size:720px 213px;}
.jcarousel-skin-mainbanner:hover { box-shadow: 0 0 4px #000000; }


}


@media all and (max-width: 960px) {




  /*  #wrapper{ width: 560px; }
    body {background-image: none;}
    .home_banners > div {float: left; margin-right:2px; margin-bottom:9px; width: 110.2px;}*/
}


@media all and (max-width: 360px) {

        .autosize .imageblock {max-width: 100%; float: left;}
        .home_banners .imageblock {width: 175px !important;; float: left;}
        .home_banners img {width: 175px !important;; }
        .home_banners > div {float: left; width: 177px !important; margin-right: 0}

        #productlisting-leftcol {display: none;}
        #itemgrid {width: 360px !important;}
        .pc-item {height: 480px;}

        #menu-wrapper {width: 360px !important;}
        #menu {width: 360px !important;}
        #menu ul {width: 360px !important;}

        .dproductcarousel {margin-left: 34px; width: 360px;}
        .systembuilder-carouselpanel { mdargin-left: 10px;}

        .jdcarousel-skin-mainbanner {background-color: white; width: 360px; height: 150px !important; paddding: 5px; bordder: 1px solid grey; box-shdadow: 0 0 2px #1A1A1A; margin-bottsom: 10px;}
        .jcdarousel-skin-mainbanner div {width: 360px !important; height: 150px !important; overflow: hidden; background-size:360px 150px;}
        .jcadrousel-skin-mainbanner:hover { box-shadow: 0 0 4px #000000; }

        #productright {  width: 100% !important; float: none !important; }
        #productleft { width: 100% !important; }
}


.pika-single {
    z-index: 9999;
    display: block;
    position: relative;
    color: #333;
    background: #fff;
    border: 1px solid #ccc;
    border-bottom-color: #bbb;
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/*
clear child float (pika-lendar), using the famous micro clearfix hack
http://nicolasgallagher.com/micro-clearfix-hack/
*/
.pika-single:before,
.pika-single:after {
    content: " ";
    display: table;
}
.pika-single:after { clear: both }
.pika-single { *zoom: 1 }

.pika-single.is-hidden {
    display: none;
}

.pika-single.is-bound {
    position: absolute;
    box-shadow: 0 5px 15px -5px rgba(0,0,0,.5);
}

.pika-lendar {
    float: left;
    width: 240px;
    margin: 8px;
}

.pika-title {
    position: relative;
    text-align: center;
}

.pika-label {
    display: inline-block;
    *display: inline;
    position: relative;
    z-index: 9999;
    overflow: hidden;
    margin: 0;
    padding: 5px 3px;
    font-size: 14px;
    line-height: 20px;
    font-weight: bold;
    background-color: #fff;
}
.pika-title select {
    cursor: pointer;
    position: absolute;
    z-index: 9998;
    margin: 0;
    left: 0;
    top: 5px;
    filter: alpha(opacity=0);
    opacity: 0;
}

.pika-prev,
.pika-next {
    display: block;
    cursor: pointer;
    position: relative;
    outline: none;
    border: 0;
    padding: 0;
    width: 20px;
    height: 30px;
    /* hide text using text-indent trick, using width value (it's enough) */
    text-indent: 20px;
    white-space: nowrap;
    overflow: hidden;
    background-color: transparent;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 75% 75%;
    opacity: .5;
    *position: absolute;
    *top: 0;
}

.pika-prev:hover,
.pika-next:hover {
    opacity: 1;
}

.pika-prev,
.is-rtl .pika-next {
    float: left;
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAUklEQVR42u3VMQoAIBADQf8Pgj+OD9hG2CtONJB2ymQkKe0HbwAP0xucDiQWARITIDEBEnMgMQ8S8+AqBIl6kKgHiXqQqAeJepBo/z38J/U0uAHlaBkBl9I4GwAAAABJRU5ErkJggg==');
    *left: 0;
}

.pika-next,
.is-rtl .pika-prev {
    float: right;
    background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAU0lEQVR42u3VOwoAMAgE0dwfAnNjU26bYkBCFGwfiL9VVWoO+BJ4Gf3gtsEKKoFBNTCoCAYVwaAiGNQGMUHMkjGbgjk2mIONuXo0nC8XnCf1JXgArVIZAQh5TKYAAAAASUVORK5CYII=');
    *right: 0;
}

.pika-prev.is-disabled,
.pika-next.is-disabled {
    cursor: default;
    opacity: .2;
}

.pika-select {
    display: inline-block;
    *display: inline;
}

.pika-table {
    width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    border: 0;
}

.pika-table th,
.pika-table td {
    width: 14.285714285714286%;
    padding: 0;
}

.pika-table th {
    color: #999;
    font-size: 12px;
    line-height: 25px;
    font-weight: bold;
    text-align: center;
}

.pika-button {
    cursor: pointer;
    display: block;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    outline: none;
    border: 0;
    margin: 0;
    width: 100%;
    padding: 5px;
    color: #666;
    font-size: 12px;
    line-height: 15px;
    text-align: right;
    background: #f5f5f5;
}

.pika-week {
    font-size: 11px;
    color: #999;
}

.is-today .pika-button {
    color: #33aaff;
    font-weight: bold;
}

.is-selected .pika-button,
.has-event .pika-button {
    color: #fff;
    font-weight: bold;
    background: #33aaff;
    box-shadow: inset 0 1px 3px #178fe5;
    border-radius: 3px;
}

.has-event .pika-button {
    background: #005da9;
    box-shadow: inset 0 1px 3px #0076c9;
}

.is-disabled .pika-button,
.is-inrange .pika-button {
    background: #D5E9F7;
}

.is-startrange .pika-button {
    color: #fff;
    background: #6CB31D;
    box-shadow: none;
    border-radius: 3px;
}

.is-endrange .pika-button {
    color: #fff;
    background: #33aaff;
    box-shadow: none;
    border-radius: 3px;
}

.is-disabled .pika-button {
    pointer-events: none;
    cursor: default;
    color: #999;
    opacity: .3;
}

.is-outside-current-month .pika-button {
    color: #999;
    opacity: .3;
}

.is-selection-disabled {
    pointer-events: none;
    cursor: default;
}

.pika-button:hover,
.pika-row.pick-whole-week:hover .pika-button {
    color: #fff;
    background: #ff8000;
    box-shadow: none;
    border-radius: 3px;
}

/* styling for abbr */
.pika-table abbr {
    border-bottom: none;
    cursor: help;
}

:root {
    --auth-primary-color: #0066cc;
    --auth-secondary-color: #f5f5f5;
    --auth-text-color: #333;
    --auth-input-height: 45px;
    --auth-border-radius: 4px;
    --cart-bg: #05070f;
    --cart-panel: #111729;
    --cart-border: rgba(255, 255, 255, 0.08);
    --cart-accent: #00a1ff;
    --cart-glow: rgba(0, 161, 255, 0.2);
}

.auth-page body,
.auth-page html {
    margin: 0;
    padding: 0;
    width: 100%;
    background-color: var(--auth-secondary-color);
    color: var(--auth-text-color);
    font-family: 'Roboto', sans-serif;
}
.auth-page .header-banner {
    background: url('images/login-banner.jpg') center/cover no-repeat;
    padding: 60px 20px;
    text-align: center;
    color: black;
}
.auth-page .container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    max-width: 1000px;
    margin: 40px auto;
    padding: 0 20px;
    align-items: stretch;
}
@media (max-width: 768px) {
    .auth-page .container {
        grid-template-columns: 1fr;
    }
}
.auth-page .card {
    background: white;
    padding: 30px;
    border-radius: var(--auth-border-radius);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    display: flex;
    flex-direction: column;
}
.auth-page .card h2 {
    margin: 0 0 10px;
    font-size: 1.5rem;
    color: var(--auth-primary-color);
}
.auth-page .card form {
    display: flex;
    flex-direction: column;
    flex: 1;
}
.auth-page .card label {
    margin-top: 15px;
    font-size: 0.9rem;
}
.auth-page .card input {
    height: var(--auth-input-height);
    padding: 0 10px;
    margin-top: 5px;
    border: 1px solid #ccc;
    border-radius: var(--auth-border-radius);
    font-size: 1rem;
}
.auth-page .card .error-message {
    color: red;
    font-size: 0.8rem;
    visibility: hidden;
    margin-top: 5px;
}
.auth-page .card button {
    margin-top: auto;
    height: var(--auth-input-height);
    border: none;
    border-radius: var(--auth-border-radius);
    background-color: var(--auth-primary-color);
    color: white;
    font-size: 1rem;
    cursor: pointer;
}

.auth-forgotpassword-page .container {
    display: flex;
    grid-template-columns: 1fr !important;
    justify-content: center !important;
    align-items: center !important;
  //  min-height: calc(100vh - 200px);
    padding: 20px;
}

.footer {
    background: #333;
    color: #aaa;
    padding: 40px 20px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.footer .footer-col {
    flex: 1;
    min-width: 200px;
    margin-bottom: 20px;
}

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

.footer a { color: #aaa; text-decoration: none; }
.footer .newsletter input,
.footer .newsletter button {
    height: var(--auth-input-height);
    margin-top: 10px;
    border-radius: var(--auth-border-radius);
    border: 1px solid #ccc;
    padding: 0 10px;
}
.footer .newsletter button {
    background-color: var(--auth-primary-color);
    color: white;
    border: none;
    cursor: pointer;
}
button {
    margin-top: auto;
    height: var(--auth-input-height);
    border: none;
    border-radius: var(--auth-border-radius);
    background-color: var(--auth-primary-color);
    color: white;
    font-size: 1rem;
    cursor: pointer;
}

/* Shopping cart experience */
.shoppingcart-shell {
    background: linear-gradient(135deg, rgba(12, 17, 30, 0.97), rgba(6, 9, 18, 0.98));
    border: 1px solid var(--cart-border);
    border-radius: 32px;
    padding: 2.75rem;
    margin: 3rem auto 4rem;
    max-width: 1150px;
    box-shadow: 0 25px 70px rgba(0, 0, 0, 0.65);
    position: relative;
    color: #f7f7f7;
    overflow: hidden;
}

.shoppingcart-shell::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04), 0 30px 60px var(--cart-glow);
    pointer-events: none;
    opacity: 0.25;
}

.shoppingcart-shell__header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 1.5rem;
    flex-wrap: wrap;
}

.shoppingcart-shell__title {
    max-width: 620px;
}

.shoppingcart-shell__eyebrow {
    margin: 0 0 0.35rem;
    text-transform: uppercase;
    letter-spacing: 0.25em;
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.56);
}

.shoppingcart-shell__title h1 {
    margin: 0;
    font-size: 2.75rem;
    letter-spacing: -0.02em;
    color: #fdfefe;
}

.shoppingcart-shell__subtitle,
.shoppingcart-shell__tagline {
    margin: 0.5rem 0 0;
    color: rgba(255, 255, 255, 0.75);
    line-height: 1.5;
}

.shoppingcart-shell__actions {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.shoppingcart-action-button {
    border-radius: 999px;
    border: none;
    padding: 0.95rem 2.4rem;
    font-size: 0.95rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    background: linear-gradient(135deg, var(--cart-accent), #0069d1);
    color: #fff;
    box-shadow: 0 18px 40px rgba(0, 161, 255, 0.45);
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    min-width: 160px;
    min-height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
}

.shoppingcart-action-button:hover {
    transform: translateY(-1px);
    box-shadow: 0 24px 45px rgba(0, 161, 255, 0.55);
}

.shoppingcart-action-button--ghost {
    background: rgba(255, 255, 255, 0.08);
    box-shadow: none;
    border: 1px solid rgba(255, 255, 255, 0.3);
    color: #fff;
    min-width: 180px;
    min-height: 52px;
    letter-spacing: 0.12em;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
}

.shoppingcart-highlights {
    margin-top: 2rem;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1rem;
}

.shoppingcart-highlight {
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 18px;
    padding: 1.4rem;
    min-height: 140px;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.02);
}

.shoppingcart-highlight__eyebrow {
    display: block;
    font-size: 0.7rem;
    letter-spacing: 0.4em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.5);
    margin-bottom: 0.4rem;
}

.shoppingcart-highlight h3 {
    margin: 0;
    font-size: 1.2rem;
}

.shoppingcart-highlight p {
    color: rgba(255, 255, 255, 0.7);
    font-size: 0.95rem;
    margin-top: 0.35rem;
    line-height: 1.45;
}

.shoppingcart-table {
    margin-top: 2.5rem;
    position: relative;
}

.shoppingcart-table__header {
    display: grid;
    grid-template-columns: minmax(90px, 140px) minmax(210px, 1fr) repeat(2, minmax(110px, 160px));
    font-size: 0.78rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.45);
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    padding-bottom: 0.8rem;
}

.shoppingcart-list {
    list-style: none;
    padding: 0;
    margin: 1.3rem 0 0;
    display: flex;
    flex-direction: column;
    gap: 1.4rem;
}

.shoppingcart-row {
    display: grid;
    grid-template-columns: minmax(90px, 140px) minmax(220px, 1fr) minmax(90px, 125px) minmax(120px, 190px);
    gap: 1rem;
    padding-bottom: 1.2rem;
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
    align-items: center;
}

.shoppingcart-rowimage img {
    width: 100%;
    height: auto;
    border-radius: 12px;
    object-fit: cover;
}

.shoppingcart-rowdescription__brand,
.shoppingcart-rowdescription__name,
.shoppingcart-rowdescription__details {
    margin: 0;
}

.shoppingcart-rowdescription__brand {
    font-size: 0.7rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.45);
}

.shoppingcart-rowdescription__name {
    font-size: 1.05rem;
    font-weight: 600;
    margin-top: 0.15rem;
    color: #fafafa;
}

.shoppingcart-rowdescription__details {
    color: rgba(255, 255, 255, 0.65);
    font-size: 0.95rem;
    margin-top: 0.15rem;
}

.shoppingcart-rowdescription .extras {
    display: inline-block;
    margin-top: 0.45rem;
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.6);
}

.shoppingcart-rowdescription div {
    margin-top: 0.6rem;
}

.shoppingcart-rowquantity input.cart-quantity {
    width: 72px;
    padding: 0.5rem 0.75rem;
    border-radius: 8px;
    border: 1px solid rgba(255, 255, 255, 0.15);
    background: rgba(255, 255, 255, 0.04);
    color: #fff;
    text-align: center;
}

.shoppingcart-rowend {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    align-items: flex-end;
}

.shoppingcart-rowtotal {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.shoppingcart-rowtotal span {
    font-size: 1rem;
    font-weight: 600;
}

.shoppingcart-rowtotal.ex_tax {
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.55);
    font-weight: 400;
}

.shoppingcart-rowactions {
    font-size: 0.8rem;
    letter-spacing: 0.2em;
}

.shoppingcart-remove {
    color: var(--cart-accent);
}

.shoppingcart-empty {
    margin-top: 2rem;
    padding: 1.5rem;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.02);
    border: 1px dashed rgba(255, 255, 255, 0.2);
    color: rgba(255, 255, 255, 0.8);
}

.shoppingcart-empty__hint {
    margin-top: 0.4rem;
    color: rgba(255, 255, 255, 0.65);
}

.shoppingcart-table__divider {
    margin: 2.2rem 0 0.8rem;
    border-top: 1px dashed rgba(255, 255, 255, 0.25);
}

.shoppingcart-summary {
    margin-top: 2.2rem;
    display: grid;
    grid-template-columns: minmax(260px, 1fr) minmax(260px, 1fr);
    gap: 1.4rem;
}

.shoppingcart-total-panel {
    padding: 1.6rem;
    border-radius: 22px;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.03), rgba(255, 255, 255, 0.01));
    border: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.02);
}

.shoppingcart-total-panel__label {
    font-size: 0.8rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.5);
}

.shoppingcart-total-panel__value {
    margin-top: 0.35rem;
    font-size: 2rem;
    font-weight: 700;
}

.shoppingcart-total-panel__note {
    margin-top: 0.15rem;
    font-size: 0.95rem;
    color: rgba(255, 255, 255, 0.65);
}

.shoppingcart-voucher {
    padding: 1.6rem;
    border-radius: 20px;
    background: rgba(255, 255, 255, 0.02);
    border: 1px solid rgba(255, 255, 255, 0.08);
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
}

.shoppingcart-voucher label {
    font-size: 0.95rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.6);
}

.shoppingcart-voucher__form {
    display: flex;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.shoppingcart-voucher__input {
    flex: 1;
    min-width: 180px;
    border-radius: 12px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.04);
    color: #fff;
    padding: 0.7rem 1rem;
    font-size: 0.95rem;
}

.shoppingcart-voucher__button {
    border-radius: 12px;
    border: none;
    background: rgba(0, 161, 255, 0.15);
    color: #fff;
    font-weight: 600;
    padding: 0.75rem 1.4rem;
    letter-spacing: 0.05em;
}

.shoppingcart-footer {
    margin-top: 2.5rem;
    display: flex;
    justify-content: flex-end;
    gap: 0.75rem;
    flex-wrap: wrap;
}

@media (max-width: 960px) {
    .shoppingcart-shell {
        padding: 2rem;
    }

    .shoppingcart-row,
    .shoppingcart-table__header {
        grid-template-columns: 1fr;
    }
    .shoppingcart-row {
        grid-template-rows: auto auto auto auto;
        align-items: flex-start;
    }
    .shoppingcart-rowend {
        flex-direction: row;
        justify-content: space-between;
        width: 100%;
    }
    .shoppingcart-rowactions {
        justify-self: flex-start;
    }
    .shoppingcart-summary {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 640px) {
    .shoppingcart-shell {
        padding: 1.5rem;
        margin: 2rem auto;
    }
    .shoppingcart-shell__header {
        flex-direction: column;
        align-items: flex-start;
    }
    .shoppingcart-shell__actions,
    .shoppingcart-footer {
        width: 100%;
    }
    .shoppingcart-shell__actions .shoppingcart-action-button,
    .shoppingcart-footer .shoppingcart-action-button {
        width: 100%;
        justify-content: center;
    }
    .shoppingcart-summary {
        grid-template-columns: 1fr;
    }
}