#loading {
  display: none;
}

.SystemCategory {
  margin: 0 auto;
  margin-bottom: 0px;
  width: 1280px;
}

.pageHeading {
  background-color: #000000;
}

.pageHeading h1 {
  color: #fff;
  font-family: "uni_sansbold", sans-serif;
  font-size: 2em;
  padding: 30px 20px;
  margin: 0;
  font-weight: normal;
}

.systemGroup {
  background-color: #3a3a3c;
  padding: 0 20px;
}

.catDesc {
  padding: 20px 5px 15px 5px;
}

.catDesc h2 {
  margin: 0;
  font-family: "uni_sanssemibold", sans-serif;
  color: #ffffff;
  padding: 10px 0;
  font-weight: normal;
}

.catDesc p {
  font-family: "open_sans", sans-serif;
  color: #ffffff;
  font-size: 0.8em;
  line-height: 1.4em;
}

.systems {
  display: flex;
  flex-wrap: wrap;
}

.systemContainer {
  width: 50%;
  margin: 5px 0;
}

.systemCont-Inner {
  background-color: #ffffff;
  margin: 0 5px;
  height: 100%;
}

.systemCont-Inner.hotseller h3 {
  padding-left: 45px;
}

.systemCont-Inner h3 {
  font-family: "uni_sans_regular", sans-serif;
  margin: 0;
  display: inline-block;
  padding: 15px 10px 20px 200px;
}

.systemCont-Inner a {
  text-decoration: none;
  color: #000000;
  font-size: 1.1em;
}

.system-overview.overview, .system-overview.benchmarks {
  display: none;
}

.systemCont-Inner .number {
  display: none;
}

.system-overview.benchmarks table {
  margin: 8px 0;
  width: 100%;
}

.system-overview.benchmarks td, .system-overview.benchmarks th {
  text-align: left;
  padding: 4px 10px;
}

.system-overview.benchmarks th {
  font-family: "open_sans-bold", sans-serif;
  font-weight: normal;
}

.system-overview.specification ul {
  margin: 0 0 8px 0;
  padding: 10px 15px 10px 15px;
}

.system-overview.specification ul li {
  padding: 2px 0;
}

.system-overview.overview p {
  margin: 0;
  padding: 10px 15px 10px 0;
}

.systemContainer .systemInfo {
  display: flex;
  font-family: "open_sans", sans-serif;
  font-size: 0.85em;
}

/* .systemContainer .systemInfo .thumbnails { display:none; }  */
.systemContainer .systemInfo .thumbnails {
  position: absolute;
  bottom: 20px;
  border-radius: 3px;
  width: 40px;
  height: 40px;
  display: block;
  background: rgba(212, 213, 215, 0.8) url("../../images/3xs-sprite-2018-686da2e872.svg") no-repeat;
  background-position: -2048px -30px;
  background-size: 2500px 2500px;
}

.systemContainer .systemInfo .thumbnails ul {
  padding: 0;
  margin: 0;
}

.systemContainer .systemInfo .thumbnails ul li {
  position: absolute;
  list-style: none;
  display: none;
}

.systemContainer .systemInfo .thumbnails ul li:first-child {
  display: block;
}

.systemContainer .systemInfo .thumbnails ul li a {
  display: block;
  width: 40px;
  height: 40px;
}

.systemContainer .systemInfo .thumbnails ul li img {
  display: none;
}

.systemContainer .systemInfo .mainImg {
  padding: 0 20px 0 15px;
  position: relative;
}

.systemDesc .system-overview {
  height: 215px;
}

/* .SysBadge { background-image: url("../../images/Sprite-SysBadges-b6aca30e0f.jpg"); background-repeat: no-repeat; }  */
.systemContainer .poweredBy {
  background-color: #f3f3f5;
}

.systemContainer .poweredBy .heading {
  background-color: #f3f3f5;
  padding: 24px 0;
  float: left;
  text-align: center;
  font-family: "open_sans", sans-serif;
  font-size: 0.9em;
  width: 200px;
}

.systemContainer .poweredBy .powered-logos {
  background-color: #f3f3f5;
  padding: 10px 0;
  display: flex;
}

.systemContainer .poweredBy .powered-logos span {
  width: 50px;
  height: 48px;
  display: inline-block;
  margin-right: 5px;
  overflow: hidden;
  text-indent: 50px;
  line-height: 3em;
  vertical-align: top;
}

.systemDesc .tabs button {
  border: 0;
  background: none;
  font-family: "uni_sanssemibold", sans-serif;
  font-size: 1em;
  padding: 5px 10px;
  border-radius: 4px;
  letter-spacing: 0.025em;
}

.systemDesc .tabs .on {
  background-color: #e7e8ea;
  color: #000000;
}

.systemContainer .system-tags {
  display: flex;
  flex-wrap: wrap;
  padding: 5px 0 10px 5px;
}

.hotsellerTag {
  margin: 15px 0 0 20px;
  color: #ffffff;
  background: #f7941d;
  text-transform: uppercase;
  font-family: "open_sans-bold", sans-serif;
  font-size: 0.85em;
  border-radius: 2.5px;
  padding: 2px 15px 2px 10px;
  display: inline-block;
}

.hotsellerTag span {
  float: left;
  height: 20px;
  width: 20px;
  background: url("../../images/3xs-sprite-2018-686da2e872.svg") no-repeat;
  background-position: -1410px -28px;
  background-size: 2000px 2000px;
  margin-right: 5px;
}

.configButton {
  text-align: center;
  padding-bottom: 15px;
}

.configButton a {
  display: inline-block;
  background: linear-gradient(to top, #212123, #414143);
  padding: 15px 100px;
  border-radius: 4px;
  color: #ffffff;
  font-family: "open_sans-bold", sans-serif;
  text-transform: uppercase;
  font-size: 1em;
}

.configButton.hasTrial {
  padding: 0 10px 15px 10px;
}

.configButton.hasTrial a {
  padding: 15px 75px;
  margin: 0 3px 6px 3px;
}

.configButton.hasTrial .infoButton {
  background: none;
  border: 3px solid #000000;
  color: #000000;
  padding: 12px 50px;
  transition: all 0.8s ease-in-out 0s;
}

.configButton.hasTrial .infoButton:hover {
  background-color: #e7e8ea;
}

.configButton.hasTrial span {
  display: block;
  font-size: 0.8em;
  padding: 10px 0;
}

.configButton.hasTrial span:before {
  display: inline-block;
  content: "";
  width: 15px;
  height: 15px;
  background: url("../../images/3xs-sprite-2018-686da2e872.svg") no-repeat;
  background-position: -1021px -24px;
  background-size: 1800px 1800px;
}

.systemContainer .system-reviews {
  font-family: "open_sans", sans-serif;
  font-size: 0.8em;
  width: 200px;
  text-align: center;
}

.systemContainer .star-rating {
  background-color: #f3f3f5;
}

.star-rating {
  background: url("../../images/3xs-sprite-2018-686da2e872.svg");
  background-repeat: no-repeat;
  background-position: -1311px -39px;
  height: 20px;
  width: 110px;
  display: block;
  border-radius: 3px;
  background-size: 1800px 1800px;
  margin: 3px auto;
}

.star-rating > span {
  background: url("../../images/3xs-sprite-2018-686da2e872.svg");
  background-repeat: no-repeat;
  background-position: -1311px -15px;
  display: block;
  height: 20px;
  margin: 0;
  background-size: 1800px 1800px;
}

.star-rating.rating-5-0 > span {
  width: 110px;
}

.star-rating.rating-4-5 > span {
  width: 89px;
}

.star-rating.rating-4-6 > span {
  width: 90px;
}

.star-rating.rating-4-7 > span {
  width: 90px;
}

.star-rating.rating-4-8 > span {
  width: 91px;
}

.star-rating.rating-4-9 > span {
  width: 92px;
}

.system-flags {
  display: flex;
  flex-wrap: wrap;
  width: 400px;
}

.system-flags .flagItem {
  width: 50%;
  padding: 4px 0;
  font-size: 0.85em;
}

.system-flags .flagItem p {
  color: #cccccc;
  text-transform: uppercase;
  font-family: "open_sans-bold", sans-serif;
  font-size: 0.85em;
  padding: 0 0 0 18px;
  letter-spacing: 0.025em;
}

.system-flags .flagItem.on p {
  color: #1e1f20;
}

.system-flags .flagItem i {
  width: 13px;
  height: 12px;
  float: left;
  background: url("../../images/3xs-sprite-2018-686da2e872.svg") no-repeat;
  background-position: -1053px -27px;
  background-size: 1800px 1800px;
}

.system-flags .flagItem.on i {
  background-position: -1021px -27px;
}

.systemDelivery {
  text-align: center;
  padding: 10px;
  clear: both;
  background-color: #ffffff;
}

.systemDelivery .estTitle {
  font-family: "open_sans", sans-serif;
  font-size: 0.8em;
}

.systemDelivery .estDate {
  font-family: "uni_sanssemibold", sans-serif;
}

.system-price .price-Right {
  clear: both;
}

.system-price .price {
  text-align: center;
  padding: 10px 0;
}

.system-price .price .title {
  font-family: "open_sans", sans-serif;
}

.system-price .price .incVAT {
  font-family: "uni_sans_regular", sans-serif;
  font-size: 2.2em;
}

.system-price .price .incVAT span {
  display: none;
}

.system-price .price .exVAT {
  display: none;
}

.sideBar {
  display: none;
}

@media screen and (max-width: 1280px) {
  .SystemCategory {
    width: auto;
  }
  .systemContainer .system-reviews {
    width: 250px;
  }
  .systemContainer .system-tags {
    display: block;
  }
  .system-flags {
    margin: 10px 15px 5px 15px;
    width: auto;
  }
  .system-flags .flagItem {
    width: 100px;
    font-size: 0.75em;
    margin-right: 15px;
  }
  .systemContainer .star-rating {
    display: table-cell;
    margin: 0;
  }
  .systemContainer .review-title {
    display: table-cell;
    vertical-align: middle;
    padding: 0 10px 0 15px;
  }
  .systemContainer .poweredBy .heading {
    float: none;
    width: auto;
    padding: 10px 0;
  }
  .systemContainer .poweredBy .powered-logos {
    display: block;
    text-align: center;
  }
}
@media screen and (max-width: 1100px) {
  .systemGroup {
    padding: 0 10px;
  }
  .systemDelivery .estTitle, .systemDelivery .estDate {
    display: block;
  }
  .systemDelivery .estDate {
    padding-top: 5px;
  }
  .systemDelivery {
    padding: 10px 10px 5px 10px;
  }
  .systemContainer .systemInfo ul li {
    font-size: 0.9em;
  }
  .systemContainer .system-overview p {
    font-size: 0.95em;
  }
  .systemDesc .system-overview {
    height: auto;
  }
  .systemCont-Inner a {
    font-size: 1em;
  }
  .pageHeading h1 {
    font-size: 1.6em;
  }
  .system-flags .flagItem {
    width: 50%;
    margin-right: 0;
  }
  .systemContainer .poweredBy .powered-logos {
    float: none;
    display: block;
    text-align: center;
  }
}
@media screen and (max-width: 850px) {
  .systemDesc .system-overview {
    height: auto;
  }
  .systemContainer {
    width: 100%;
  }
  .pageHeading h1 {
    font-size: 1.5em;
  }
  .catDesc p {
    display: none;
  }
  .systemDesc .system-overview {
    height: auto;
  }
  .systemDelivery .estTitle, .systemDelivery .estDate {
    display: inline;
  }
  .systemContainer .system-reviews {
    width: 200px;
  }
  .systemContainer .system-tags {
    display: flex;
  }
  .system-flags {
    margin: 0;
    width: 400px;
  }
  .system-flags .flagItem {
    width: 50%;
    font-size: 0.75em;
    margin-right: 0;
    padding: 4px 0;
  }
  .systemContainer .star-rating {
    display: block;
    margin: 3px auto;
  }
  .systemContainer .review-title {
    display: block;
    padding: 0;
  }
  .systemContainer .poweredBy .heading {
    float: left;
    width: 200px;
    padding: 24px 0;
  }
  .systemContainer .poweredBy .powered-logos {
    display: flex;
    text-align: center;
  }
}
@media screen and (max-width: 700px) {
  .systemContainer .system-reviews {
    width: 250px;
  }
  .systemContainer .star-rating {
    display: table-cell;
    margin: 0;
  }
  .systemContainer .review-title {
    display: table-cell;
    padding: 0 10px 0 15px;
  }
  .system-flags {
    margin: 10px 15px 5px 15px;
    width: auto;
  }
  .systemCont-Inner.hotseller h3 {
    display: block;
    padding-left: 20px;
  }
  .systemCont-Inner h3 {
    padding-left: 20px;
  }
}
@media screen and (max-width: 500px) {
  .systemImages {
    width: 40%;
  }
  .systemImages img {
    width: 100%;
    height: auto;
  }
  .systemContainer .systemDesc {
    width: 60%;
  }
  .systemDelivery .estTitle, .systemDelivery .estDate {
    display: block;
  }
  .catDesc h2 {
    padding: 0;
  }
  .pageHeading h1 {
    padding: 30px 10px;
  }
  .systemContainer .poweredBy .heading {
    float: none;
    width: auto;
    padding: 10px 0;
  }
  .systemContainer .poweredBy .powered-logos {
    float: none;
    display: block;
    text-align: center;
  }
}
/*
.systemContainer {
    .poweredBy {
        .powered-logos {
            .SysBadge {
                &.intel-i7 { background-position:left -35px; }
                &.intel-i5 { background-position:-52px -35px; }
                &.intel-i3, &.haswell-i3 { background-position:-105px -35px; }
                &.intel { background-position:-157px -35px; }
                &.intel-xeon { background-position:-263px -35px; }
                &.amd { background-position:-210px -35px; }
                &.amd-fx { background-position:-210px -35px;  }
                &.amda4 { background-position:-1464px -35px; }
                &.amda8 { background-position:-1340px -35px; }
                &.amda6 { background-position:-1402px -35px;}
                &.amda10 { background-position:-1275px -35px; }
                &.tesla { background-position:-474px -35px; width:50px; }
                &.celeron { background-position:-368px -35px; width:49px; }
                &.pentium { background-position:-315px -35px; width:49px; }
                &.nvidia-sli { background-position:-420px -35px; width:50px; }
                &.readyship { background-position:-529px -35px; width:66px; text-indent:66px; }
                &.i5vpro-3rd { background-position:-602px -35px; width:55px; text-indent:55px; }
                &.i3-3rd { background-position:-661px -35px; width:56px; text-indent:56px; }
                &.i5-3rd { background-position:-721px -35px; width:56px; text-indent:56px; }
                &.i7-3rd { background-position:-781px -35px; width:56px; text-indent:56px; }
                &.i5vpro-4th { background-position:-841px -35px; }
                &.nextday { background-position:-947px -35px; width:50px; text-indent:50px; }
                &.crossfire { background-position:-894px -35px; width:49px; text-indent:49px; }
                &.geforce { background-position:-1002px -35px; width:47px; text-indent:47px; }
                &.radeon { background-position:-1054px -35px; }
                &.quadro { background-position:-1108px -35px; width:51px; text-indent:51px; }
                &.z97 { background-position:-1165px -35px; width:50px; text-indent:50px; }
                &.grid { background-position:-1219px -34px; width:50px; text-indent:50px; }
                &.gsync { background-position:-1522px -35px; width:50px; text-indent:50px; }
                &.skylakei7 { background-position:-1639px -35px; width:50px; text-indent:50px; }
                &.skylakei5 { background-position:-1581px -35px; width:50px; text-indent:50px; }
                &.skylakei3 { background-position:-1696px -35px; width:50px; text-indent:50px; }
                &.vrready { background-position:-1864px -35px; width:106px; text-indent:110px;  }
                &.amd-vr { background-position:-1750px -35px; width:50px; text-indent:85px; } 
                &.quadro-vr { background-position:-150px -240px; width:82px; text-indent:85px; }
                &.amd-athlon { background-position:-1801px -35px; width:57px; text-indent:85px;  }
                &.qnap { background-position:-335px -174px; width:76px; text-indent:85px; height:40px;  }
                &.synology { background-position:-421px -174px; width:90px; text-indent:90px; height:40px;  }
                &.amd-ryzen { background-position:-1975px -35px; width:55px; text-indent:90px;  }
                &.corex9 { background-position:-263px -233px; width:49px; text-indent:90px;  }
                &.corex7 { background-position:-315px -233px; width:49px; text-indent:90px;  }
                &.corex5 { background-position:-368px -233px; width:49px; text-indent:90px;  }
                &.tdripper { background-position:-427px -233px; width:63px; height:50px; text-indent:90px;  }
                &.amdepyc { background-position:-499px -233px; width:60px; height:50px; text-indent:90px;  }
                &.geforcertx { background-position:-515px -174px; width:150px; text-indent:170px; height:49px;  }
                &.coffeei9 { background-position:-566px -233px; width:49px; height:49px; text-indent:90px;  }
                &.corei3gen { background-position:-628px -233px; width:50px; height:49px; text-indent:90px; }
                &.corei5gen { background-position:-689px -233px; width:52px; height:49px; text-indent:90px; }
                &.corei7gen { background-position:-752px -233px; width:52px; height:49px; text-indent:90px; }
                &.corei9gen { background-position:-814px -233px; width:52px; height:49px; text-indent:90px; }
                &.Userful { background-position:-720px -168px; width:63px; height:49px; text-indent:90px; } 
                &.Philips { background-position:-676px -168px; width:38px; height:49px; text-indent:90px; }
                &.beabloo { background-position:-191px -165px; width:89px; height:49px; text-indent:90px; }
                &.corsairicu { background-position:-794px -168px; width:72px; height:49px; text-indent:90px; }
            }
        }
    }
}
*/