#ss-top {
  position: relative;
  height: 275px;
  overflow: hidden;
}

@-webkit-keyframes beacon-loop {
  0% { opacity: 0; }
  1% { opacity: 1; }
  3% { opacity: 1; }
  10% { opacity: 0; }
  100% { opacity: 0; }
}
@keyframes beacon-loop {
  0% { opacity: 0; }
  1% { opacity: 1; }
  3% { opacity: 1; }
  10% { opacity: 0; }
  100% { opacity: 0; }
}

#cap1-loop {
  opacity: 0;
  -webkit-animation: beacon-loop 2s 3s infinite;
  animation: beacon-loop 2s 3s infinite;
}
#cap2-loop {
  opacity: 0;
  -webkit-animation: beacon-loop 1.99s 3.1s infinite;
  animation: beacon-loop 1.99s 3.1s infinite;
}
#cap3-loop {
  opacity: 0;
  -webkit-animation: beacon-loop 1.98s 3.2s infinite;
  animation: beacon-loop 1.98s 3.2s infinite;
}
#cap4-loop {
  opacity: 0;
  -webkit-animation: beacon-loop 1.97s 3.3s infinite;
  animation: beacon-loop 1.97s 3.3s infinite;
}
#cap5-loop {
  opacity: 0;
  -webkit-animation: beacon-loop 1.96s 3.4s infinite;
  animation: beacon-loop 1.96s 3.4s infinite;
}
#cap6-loop {
  opacity: 0;
  -webkit-animation: beacon-loop 1.95s 3.5s infinite;
  animation: beacon-loop 1.95s 3.5s infinite;
}
#cap7-loop {
  opacity: 0;
  -webkit-animation: beacon-loop 1.94s 3.6s infinite;
  animation: beacon-loop 1.94s 3.6s infinite;
}

#ss-top a.magic-popup {
  position: absolute;
  right: 4px;
  bottom: 4px;
  font: 8pt/20px Tahoma;
  height: 20px;
  text-decoration: none;
  background: #45578b url(/images/pic.png) no-repeat 5px 3px;
  color: #eee;
  text-shadow: 0 -1px 0 #336;
  padding: 0 6px 0 23px;
  -moz-border-radius: 2px;
  border-radius: 2px;
  border-color: #779 #4c4c70 #4c4c70 #727594;
  -moz-box-shadow: 1px 1px 1px rgba(0,0,0,.2);
  -webkit-box-shadow: 1px 1px 1px rgba(0,0,0,.2);
  box-shadow: 1px 1px 1px rgba(0,0,0,.2);
}

.ss-gal {
  background: #222;
  background-image:-moz-linear-gradient(90deg, #222, #333);
  background-image:-webkit-linear-gradient(90deg, #222, #333);
  background-image:-o-linear-gradient(90deg, #222, #333);
  background-image:-ms-linear-gradient(90deg, #222, #333);
  background-image:linear-gradient(0deg, #222, #333);
}

.ss-gal a img {
  -moz-border-radius: 2px;
  border-radius: 2px;
}

.ss-gal .ss-up {
  position: absolute;
  right: 5px;
  bottom: 10px;
  width: 60px;
  margin: 0;
  font: 8pt/9pt Tahoma;
  color: #bbb;
  color: rgba(255,255,255,.8);
  text-shadow: 0 1px 2px rgba(0,0,0,.5);
  text-decoration: none;
}

.ss-gal .ss-up:after {
  content: '';
  position: absolute;
  width: 26px;
  height: 35px;
  background: url(/images/up.png) no-repeat 0 0;
  left: -34px;
  bottom: -1px;
  opacity: 0.75;
}

.ss-gal .ss-up:hover:after {
  opacity: 1;
}

#ss-spec {
  display: block;
  clear: both;
  position: relative;
  height: 420px;
  background: #e7e7e7;
  border-top: 1px solid #eee;
  border-top: 1px solid rgba(255,255,255,.6);
  border-bottom: 1px solid #ddd;
  border-bottom: 1px solid rgba(0,0,0,.02);
}

#ss-2400 {
  -webkit-animation: stamp-showup 3s;
  animation: stamp-showup 3s;
}

#ss-nxs {
  position: absolute;
  top: 15px;
  left: 20px;
  font: 8pt/9pt Arial;
  color: #444;
  text-decoration: none;
  background: rgba(255,255,255,.5) url(/images/nxs.png) no-repeat 3px 3px;
  padding: 20px 3px 2px 3px;
  opacity: 0.8;
  border: 1px solid #777;
  -moz-border-radius: 3px;
  border-radius: 3px;
}

#ss-nxs:hover {
  opacity: 1;
}

#ss-manual {
  position: absolute;
  right: 550px;
  top: 13px;
  margin: 0;
  padding: 0 5px 0 27px;
  font: 12px/20px Arial;
  height: 20px;
  text-transform: none;
}

#ss-qrochka {
  position: absolute;
  left: 15px;
  bottom: 6px;
  margin: 0;
  padding: 0;
  font: 12px/20px Arial;
  text-transform: none;
  color: #666;
  color: rgba(30,20,0,.5);
  text-decoration: none;
  text-shadow: 0 1px 2px rgba(0,0,0,.12);
}

#ss-qrochka:before {
  content: '';
  position: absolute;
  left: 0px;
  bottom: 17px;
  background: url(qrochka.png) no-repeat;
  width: 84px;
  height: 39px;
}

#ss-specdat {
  position: absolute;
  top: 0;
  left: 370px;
  right: 0;
  bottom: 0;
}

#ss-specdat:before {
  content: '';
  position: absolute;
  right: -135px;
  top: 130px;
  opacity: 1;
  width: 150px;
  height: 150px;
  background: url(/images/hm.png) no-repeat 0 0;
}

#ss-spec h1, #ss-spec h2 {
  padding: 15px 0 5px 0;
  margin: 0;
  font: bold 23pt/23pt Arial;
  color: #933;
  text-shadow: 0 1px 2px rgba(0,0,0,.1);
}

#ss-spec h2 {
  padding: 15px 0 0 0;
  font: bold 14pt/14pt Arial;
}

#ss-spec h2 .button {
  position: relative;
  top: -2px;
  padding: 0 5px 0 25px;
  font: 12px/20px Arial;
  height: 20px;
  text-transform: none;
  background: url(/images/yt.png) no-repeat 3px 2px;
  color: #722;
  text-decoration: none;
}

#ss-spec p {
  padding: 5px 10px 0 0;
  margin: 0;
  font: 9pt/11pt Arial;
  display: block;
  color: #444;
  text-shadow: 0 1px 1px rgba(0,0,0,.07);
}

.ss-speccol {
  width: 260px;
  position: absolute;
  padding: 0;
}

#ss-spec .ss-speccol p {
  position: relative;
  padding: 0;
  margin: 3px 10px 0 10px;
  font: 8pt/9pt Arial;
  display: block;
  color: #777;
}

#ss-spec .ss-speccol p a {
  color: #777;
  text-decoration: none;
  display: inline-block;
  border-bottom: 1px dashed #888;
}

#ss-spec .ss-speccol p:after {
  content: '';
  position: absolute;
  width: 6px;
  height: 6px;
  top: 3px;
  left: -10px;
  background: #844;
  border-radius: 1px;
  -moz-box-shadow: 0 1px 1px rgba(0,0,0,.2);
  -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.2);
  box-shadow: 0 1px 1px rgba(0,0,0,.2);
}

#cms-content {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.list-item {
  padding: 0;
  margin: 0;
  position: relative;
  height: 250px;
  background: #000;
  overflow: hidden;
}

.list-item .white-bg {
  background-color: #fff;
}

.list-dat {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.list-dat:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: rgba(255,255,255,.1);
  z-index: 1; 
}

.list-dat:after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 7px;
  z-index: 1; 
  -moz-box-shadow: 0 -8px 6px -9px rgba(0,0,0,.4) inset;
  -webkit-box-shadow: 0 -8px 6px -9px rgba(0,0,0,.4) inset;
  box-shadow: 0 -8px 6px -9px rgba(0,0,0,.4) inset;
}

.list-sn {
  position: absolute;
  top: 10px;
  left: 10px;
  margin: 0;
  padding: 0 5px;
  font: 10px/21px Arial;
  height: 21px;
  color: #556;
  text-transform: none;
}

.list-sn b {
  font: 14px/21px Arial;
}

@font-face {
  font-family: 'iname';
  font-style: normal;
  font-weight: 400;  
  src: url(indie.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215;
}

.list-dat h4 {
  position: absolute;
  top: 12px;
  right: 20px;
  padding: 0;
  margin: 0;
  font: 14pt/19px iname;
  color: #eee;
  text-shadow: 0 0 2px #eee;
  text-align: right;
}

.list-dat.white-bg h4 {
  color: #555;
  text-shadow: 0 1px 2px rgba(0,0,0,.15);
}

.list-spec {
  position: absolute;
  bottom: 57px;
  right: 20px;
  width: 265px;
  background-color: rgba(0,0,0,.5);
}

.white-bg .list-spec {
  background-color: rgba(0,0,0,.04);
  -moz-box-shadow: 0 2px 3px rgba(0,0,0,.15);
  -webkit-box-shadow: 0 2px 3px rgba(0,0,0,.15);
  box-shadow: 0 2px 3px rgba(0,0,0,.15);
}

.list-spec p {
  position: relative;
  display: block;
  padding: 1px 4px;
  margin: 0 0 -1px 0;
  font: 9pt/10pt Arial;
  color: #888;
  color: rgba(255,250,245,.6);
  text-shadow: 0 0 2px rgba(255,255,255,.1);
  border: 1px solid;
  border-color: #444 #444 transparent #444;
  border-color: rgba(255,250,245,.3) rgba(255,250,245,.3) transparent rgba(255,250,245,.3);
}

.white-bg .list-spec p {
  color: #888;
  color: rgba(0,5,10,.6);
  text-shadow: 0 1px 2px rgba(0,0,0,.1);
  border-color: #ccc #ccc transparent #ccc;
  border-color: rgba(0,5,10,.3) rgba(0,5,10,.3) transparent rgba(0,5,10,.3);
}

.list-spec p.h {
  float: left;
  width: 50px;
  border-color: transparent #444 transparent transparent;
  border-color: transparent rgba(255,250,245,.3) transparent transparent;
  margin-right: 4px;
}

.white-bg .list-spec p.h {
  border-color: transparent #ccc transparent transparent;
  border-color: transparent rgba(0,5,10,.3) transparent transparent;
}

.list-spec p.l {
  border-bottom-color: #444;
  border-bottom-color: rgba(255,250,245,.3);
}

.white-bg .list-spec p.l {
  border-bottom-color: #ccc;
  border-bottom-color: rgba(0,5,10,.3);
}

.list-price {
  position: absolute;
  bottom: 10px;
  right: 210px;
  font: 14px/20px Arial;
  text-align: right;
  color: #777;
  text-shadow: none;
}

.list-price small {
  font: 10px Arial;
}

.list-price:first-letter {
  font: 11px/20px Arial;
  vertical-align: top;
  padding-right: 2px;
}

.list-price:before {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  width: 22px;
  height: 22px;
  background: #484;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.list-price i {
  display: block;
  position: relative;
  font: 8pt/9pt Arial;
  color: #777;
  text-shadow: none;  
  background: url('/images/thup.png') no-repeat 100% 100%;
  padding: 0 27px 0 0;
  text-align: right;
}

.list-price.warn i {
  margin-right: -15px;
  font: bold 8pt/9pt Arial;
  color: #700;
  text-shadow: 1px 1px 1px rgba(0,0,0,0.1);
  -webkit-animation: flash2 .7s 30;
  animation: flash2 .7s 30;
}

.list-price.warn:before {
  display: none;
}

.list-price.warn i {
  background: url('/images/warn.png') no-repeat 100% 50%;
  padding-right: 32px;
}

.list-open .button,
.list-mine .button {
  position: absolute;
  right: 20px;
  bottom: 15px;
  pointer-events: auto;
  text-transform: none;
  letter-spacing: normal;
}

.list-open .button.magic-popup,
.list-mine .button.magic-popup {
  padding: 3px 5px;
  font: 10pt/11pt Arial;
  height: auto;
}

.list-sold, .list-mine {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  text-align: center;
  pointer-events: none;
  z-index: 100;
}

.list-sold {
  background: url('/images/sold.png') no-repeat 700px 180px;
}

.list-mine i {
  position: absolute;
  width: 50px;
  bottom: 10px;
  right: 235px;
  text-align: center;
  font: 8pt/10pt Arial;
  color: #777;
  padding: 15px 0 0 0;
  background: url('/images/g.png') no-repeat 18px 0;
  text-shadow: 0 1px 1px rgba(0,0,0,0.15);
  -webkit-animation: stamp-showup 2s;
  animation: stamp-showup 2s;
}

i.new {
  display: inline-block;
  width: 29px;
  height: 10px;
  background: url(/images/new.png) no-repeat 1px 0;
  vertical-align: baseline;
}

i.amb {
  display: inline-block;
  width: 13px;
  height: 13px;
  margin-top: -4px;
  -moz-border-radius: 7px;
  border-radius: 7px;
  background: #f50;
  vertical-align: bottom;
}

i.red {
  display: inline-block;
  width: 13px;
  height: 13px;
  margin-top: -4px;
  -moz-border-radius: 7px;
  border-radius: 7px;
  background: #f00;
  vertical-align: bottom;
}

a.legacy {
  position: absolute;
  left: 10px;
  top: 10px;
  padding: 0 20px 0 4px;
  font: 12px/20px Arial;
  height: 20px;
  text-transform: none;
  background: #fff url(/images/f.png) no-repeat 97% 4px;
  color: #555;
  text-decoration: none;
}
