.product-card {
  position: relative;
  display: block;
  /*box-shadow: rgba(0, 0, 0, 0.3) 5px 5px 20px;*/
  border-radius: 3px;
  height: 150px;
  overflow: hidden;
  margin-bottom: 10px; }
  .product-card > div:nth-child(1), .product-card > div:nth-child(2) {
    position: absolute;
    width: 100%;
    height: 100%;
    background-size: 100% 100%; }
  .product-card > div:nth-child(1) {
    background-size: 100% 100%; }
  .product-card > div:nth-child(2) {
    background: rgba(0, 0, 0, 0.3); }
    .product-card > div:nth-child(2) > span:nth-child(1), .product-card > div:nth-child(2) > span:nth-child(2) {
      line-height: 23px;
      padding: 3px 10px;
      color: #FFF;
      border-radius: 2px;
      position: absolute;
      right: 10px; }
    .product-card > div:nth-child(2) > span:nth-child(1) {
      background: #3fb358;
      top: 10px; }
    .product-card > div:nth-child(2) > span:nth-child(2) {
      background: #4196da;
      top: 45px; }
    .product-card > div:nth-child(2) p {
      position: absolute;
      bottom: 0;
      width: 100%;
      display: block;
      line-height: 20px;
      padding: 5px 10px;
      color: #FFF;
      background: rgba(0, 0, 0, 0.67);
      text-overflow: ellipsis;
      overflow: hidden;
      white-space: nowrap; }
  .product-card:hover > div:nth-child(2) {
    background: rgba(0, 0, 0, 0); }
    .product-card:hover > div:nth-child(2) p {
      overflow: visible;
      white-space: normal; }

.product-content h2{
  color: #fff;
  margin-bottom: 20px;
}
button.btn.btn-writeauth{
  margin-bottom: 0;
}
.btn-writeauth{
    background: #6c97d4;
    padding: 8px 40px;
    transition: .2s linear;
  }
  .btn-writeauth:hover{
    background: #7cb1fb;
    box-shadow: 0 5px 7px 0px #5678a9;
  }
  .btn-writeauth a{
      color: #fff;
    }

    .block-card {
      position: relative;
    }

    .block-card:after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      border-radius: 4px;
      background: linear-gradient(120deg, #dc3545, #0575E6, #f2004e);
      background-size: 300% 300%;
      clip-path: polygon(0% 100%, 3px 100%, 3px 3px, calc(100% - 3px) 3px, calc(100% - 3px) calc(100% - 3px), 3px calc(100% - 3px), 3px 100%, 100% 100%, 100% 0%, 0% 0%);
    }

    .block-card:after {
      animation: gradient-animation 3s ease-in-out infinite;
    }

    /* motion */
    @keyframes gradient-animation {
     0% {
    		background-position: 0% 50%;
    	}
    	50% {
    		background-position: 100% 50%;
    	}
    	100% {
    		background-position: 0% 50%;
    	}
    }

    .infos-product{
      display: flex;
      align-items: center;
    }
    .price{
      color: #6c97d4;
    }
    .price-product{
      background: #36353e;
      margin-right: 20px;
      padding: 10px 20px;
      color: #fff;
      border-radius: 6px;
    }
    .linebr{
      border-bottom: 2px solid #36353e;
      margin: 15px auto;
    }
    .informproduct h2{
      text-align: left;
      color: #fff;
      margin-bottom: 20px;
      font-size: 22px;
    }
    details{
      display:block;
      border-radius: 8px;
      overflow:hidden;
      margin-bottom: 1.5rem;
    }
    summary::-webkit-details-marker{display:none;}
    summary::-moz-list-bullet{list-style-type:none;}
    summary::marker{display:none;}
    summary {
       display:block;
       font-size: 16px;
       cursor: pointer;
       position: relative;
       padding: 7px 30px 7px 30px;
       color: #fff;
       background: #36353e;
       font-weight: bold;
    }
    summary:before {
      left: 5px;
      color: transparent;
      background: url("data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjM0IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIzNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNOC41OSAxNi4zNGw0LjU4LTQuNTktNC41OC00LjU5TDEwIDUuNzVsNiA2LTYgNnoiLz48L3N2Zz4=") no-repeat 50% 50% / 11em 2em;
      width: 20px;
      height: 20px;
      content: "";
      position: absolute;
      transition: transform .5s;
    }
    details[open] > summary:before {
      transform: rotateZ(90deg);
    }
    summary ~ * {
       padding: 0 2em 10px 2em;
    }
    details[open] summary ~ *{
      animation: sweep .5s ease-in-out;
    }
    @keyframes sweep {
      0%    {opacity: 0;}
      100%  {opacity: 1;}
    }
    summary:focus {
      outline:0;
      box-shadow: inset 0 0 1px rgba(0,0,0,0.3), inset 0 0 2px rgba(0,0,0,0.3);
    }
    details p{
      padding-top: 10px;
    }

    @media (max-width: 320px) {
      .price-product{
        margin-right: 7px;
        padding: 10px 5px;
      }
      .btn-writeauth{
        padding: 8px 15px;
        }
      .infos-product{
        margin-bottom: 30px;
      }
  }
  @media (min-width: 480px) {
    .infos-product{
      margin-bottom: 30px;
    }
}
  @media (min-width: 321px) and (max-width: 480px) {
    .price-product{
      margin-right: 15px;
      padding: 10px 5px;
    }
    .btn-writeauth{
      padding: 8px 15px;
      }
    .infos-product{
      margin-bottom: 30px;
    }
  }
  @media (min-width: 576px) {
    .price-product{
      margin-right: 7px;
      padding: 10px 5px;
    }
    .btn-writeauth{
      padding: 8px 15px;
      }
   }


  @media (min-width: 768px) {
    .price-product{
      margin-right: 7px;
      padding: 10px 5px;
    }
    .btn-writeauth{
      padding: 8px 25px;
      }
      .infos-product{
        margin-bottom: 0;
      }
   }
  @media (min-width: 992px) {
    .price-product{
      background: #36353e;
      margin-right: 20px;
      padding: 10px 20px;
      color: #fff;
      border-radius: 6px;
    }
    .btn-writeauth{
        background: #6c97d4;
        padding: 8px 40px;
        transition: .2s linear;
      }
      .infos-product{
        margin-bottom: 0px;
      }
   }
  @media (min-width: 1200px) {
    .price-product{
      background: #36353e;
      margin-right: 20px;
      padding: 10px 20px;
      color: #fff;
      border-radius: 6px;
    }
    .btn-writeauth{
        background: #6c97d4;
        padding: 8px 40px;
        transition: .2s linear;
      }
      .infos-product{
        margin-bottom: 0px;
      }
   }

.cards-container{
  background: #222127;
  border-radius: 5px;
  border: 2px solid #262836;
  -webkit-box-shadow: 0px 0px 20px 0px #00000061;
  box-shadow: 0px 0px 20px 0px #00000061;
  margin-bottom: 30px;
}
.card-block h3{
  padding: 0 8px;
}
.contets-card h3{
  font-size: 18px;
  color: #fff;
  margin-bottom: 20px;
}
.contets-card a{
  color: #fff;
}
.data-product{
    background: #2a2931;
    padding: 20px 8px;
}
.prices-pr{
  background: #464e58;
  padding: 5px 15px;
  border-radius: 5px;
  font-weight: 500;
  color: #fff;
  margin-right: 10px;
}
.types-pr{
  background: #18917a;
  padding: 5px 15px;
  border-radius: 5px;
  font-weight: 500;
  color: #fff;
}
.footer-card{
  background: #2a2931;
  padding: 20px 8px;
}
.footer-card a{
  background: #6c97d4;
  padding: 10px 15px;
  color: #fff;
  font-weight: 400;
  border-radius: 6px;
}
.visit-product{
  float: right;
}
.title-addproducts{
  margin-bottom: 15px;
    font-size: 20px;
    color: #fff;
    font-weight: 600;
}
@media (max-width: 991.99px) {
  .product-card {
    height: 150px; } }
.product-block {
  position: relative;
  margin: -30px;
  margin-bottom: 30px;
  border-bottom: 1px solid RGB(227, 228, 232);
  background: linear-gradient(to bottom, #6a9bb1 0%, #60acae 44%, #8ba7c3 100%);
  border-radius: 1px;
  color: #FFF;
  overflow: hidden; }
  .product-block .product-bg {
    position: absolute;
    height: calc( 100% + 20px );
    width: calc( 100% + 20px );
    background-size: 100% auto;
    left: -10px;
    top: -10px;
    filter: blur(4px); }
  .product-block .product-content {
    position: relative;
    background: rgba(0, 0, 0, 0.45);
    padding: 40px 15px; }
    .product-block .product-content h2 {
      font-size: 30px;
      display: block;
      width: calc( 100% - 200px );
      text-overflow: ellipsis;
      overflow: hidden;
      white-space: nowrap; }
    .product-block .product-content span b {
      line-height: 23px;
      padding: 3px 10px;
      color: RGB(255, 255, 255);
      border-radius: 2px; }
    .product-block .product-content span .price {
      background: #3fb358;
      margin-right: 10px; }
    .product-block .product-content span .count {
      background: #4196da; }
    .product-block .product-content button {
      position: absolute;
      right: 15px;
      top: 40px;
      height: 65px;
      width: 190px;
      font-size: 18px;
      background: rgba(65, 150, 218, 0.58); }

.buy-product-key-info {
  margin: 15px 0 0 0;
  padding: 15px;
  background: #fbfbfb;
  border: 1px solid #DDD;
  border-radius: 2px; }

.buy-product-key-info p:last-child {
    margin: 0;
  }

.imageproduct {
  display: inline-block;
}
.imageproduct img {
  display: block;
  width: 100%;
  margin-bottom: 1em;
}
.full {
  display: none;
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  padding: 8%;
  background: #CCC center no-repeat;
  background: rgba(0, 0, 0, 0.5) center no-repeat;
  background-size: contain;
  background-origin: content-box;
  z-index: 9999;
}
.imageproduct:focus + .full {
  display: block;
}

/*# sourceMappingURL=primary.css.map */