/* Файл: stl/general.css */
/* CSS Document */



.downloadBtn { 
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 8px 16px !important;

    background: #fff !important;
    color: #111 !important;

    border: 1px solid #e5e5e5 !important;
    border-radius: 12px !important;

    font-size: 15px;
    font-weight: 700;
    line-height: 1;

    text-decoration: none !important;

    box-shadow:
        0 2px 4px rgba(0,0,0,.04),
        0 4px 10px rgba(0,0,0,.06) !important;

    transition:
        background-color .15s ease,
        border-color .15s ease,
        box-shadow .15s ease;
}

.downloadBtn-icon {
    width: 16px;
    height: 16px;
    display: block;
    flex-shrink: 0;
}

.downloadBtn:hover {
    background: #f8f8f8 !important;
    color: #111 !important;
    border-color: #e8e8e8 !important;
    text-decoration: none !important;

    box-shadow:
        0 2px 4px rgba(0,0,0,.03),
        0 4px 8px rgba(0,0,0,.05) !important;
}

.downloadBtn:active {
    background: #f4f4f4 !important;
}

.downloadBtn:focus {
    outline: none !important;
}



/* Кнопка скачивания, которая НЕ сжимается на мобильных */
.downloadBtn-fixed {
    padding: 8px 16px !important;
    gap: 7px !important;
}

.downloadBtn-fixed .downloadBtn-text {
    display: inline-block !important;
}

.downloadBtn-fixed .downloadBtn-icon {
    width: 16px !important;
    height: 16px !important;
}
 


body {
    overflow-y: scroll;  /* всегда горизонтальный скролл */
    
    
  --sb-track-color: #f8f9fa;
  --sb-thumb-color: #c5cdd4;
  --sb-size: 10px;
}

body::-webkit-scrollbar {
  width: var(--sb-size)
}

body::-webkit-scrollbar-track {
  background: var(--sb-track-color);
  border-radius: 6px;
}

body::-webkit-scrollbar-thumb {
  background: var(--sb-thumb-color);
  border-radius: 6px;
  
}

@supports not selector(::-webkit-scrollbar) {
  body {
    scrollbar-color: var(--sb-thumb-color)
                     var(--sb-track-color);
  }
}






* { outline: 0; margin: 0; border: 0;}


html {
  /*position: relative;
  min-height: 100%;*/
}



/* МОБИЛЬНЫЙ  */
.mob_smalltxt {
    font-size: 0.8rem;
    line-height: 1rem;
}


    
.discrMob {
font-size: 0.8rem;
width:100%;
  /* Обрезка текста */
  line-height: 1rem;
  max-height: calc(0.8rem * 3rem);
  -webkit-box-orient: vertical;
  display: block;
  display: -webkit-box;
  overflow: hidden!important;
  text-overflow: ellipsis;
  -webkit-line-clamp: 3;
}

/* title */
.tooltip .tooltip-inner  {font-size: 80%!important; background: #000000!important;  }
.tooltip .arrow::before {top: 1px!important; border-bottom-color: #000000!important; }

    
h4 {font-size: 1.15rem;}
.title_badge {font-size: 0.8rem;}

/* SM после мобильного */
@media (min-width: 576px) {
.discrMob {
    /* Вернуть стандартные значения для font-size, width и line-height */
font-size: initial;
width: initial;
line-height: initial;

/* Вернуть стандартные значения для обрезки текста */
max-height: initial;
-webkit-box-orient: initial;
display: initial;
overflow: initial;
text-overflow: initial;
-webkit-line-clamp: initial;
    }
    
    .mob_smalltxt {
    font-size: initial;
    line-height: initial;
}
    
    h4 {font-size: 1.4rem;}
    .title_badge {font-size: 1rem;}
    }




 /* делаем player js прозрачным*/
pjsdiv[id^='oframeplayer'] {
    background-color: rgba(255,255,255,0.00)!important;
    
    /* Вендорные префиксы для background */
    background: none!important; /* Стандартное свойство */
    -webkit-background: none!important; /* Для Safari и старых версий Chrome */
    -moz-background: none!important; /* Для старых версий Firefox */
    -o-background: none!important; /* Для старых версий Opera */
}



 /* WAVEFORM */
              .player {z-index: 2;}
              .wave {position: relative; width: 100%; height: 80px;}
              .wave2 {position: absolute; width: calc(100% - 93px); height: 80px; top: 0; right: 0; z-index: 1;}
              .wave2 img {
              width: calc(100% - 24px); height: 100%; 
              margin-top: -3px;
              opacity: 0.040; /* Уровень прозрачности по умолчанию */
              image-rendering: pixelated; /* или используйте 'crisp-edges' */  
                  transform: scale(1, 1.8);
                  transition: 0.3s ease; /* Плавный переход */
                   z-index: 1;
              }
              .wave:hover .wave2 img {
                
                  transform: scale(1, 2);
                 
              }

           


.titletrack {
     z-index: 3!important;
    position: relative;
}



.no-wrap{
    white-space: nowrap;       /* Запрет переноса текста на новую строку */
  overflow: hidden;          /* Скрытие текста, который не помещается в блоке */
  text-overflow: ellipsis;   /* Добавление многоточия (...) в конце текста, который не умещается */
}

.alert-light{border: 1px solid #E3E3E3;}

.img-fluid {max-width: 100%; height: auto; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px;}

@keyframes eggShake {
  0%, 100% {
    transform: rotate(0deg);
  }
  25%, 75% {
    transform: rotate(-10deg);
  }
  50% {
    transform: rotate(10deg);
  }
}

.egg-animation {
  animation: eggShake 2s ease-in-out infinite;
  transform-origin: center bottom;
  display: inline-block; /* Для правильной работы transform-origin */
}



#downloadButton {
    background: #FFFFFF;
}
#downloadButton:hover {
    background: #F8F8F8;
}

#downloadButton:active {
    background: #ECECEC;
}






/* ОБЛОЖКИ при download */

 .mp3_obl {
    display: inline-block; /* чтобы span имел ширину и высоту */
    background-image: url('/img/obl.gif');
    background-size: 100% 100%;
                  
   overflow: hidden; /* Обрезать текст, выходящий за пределы блока */
   width: 85px;
   height: 85px;
    border: 1px solid #3333CC;
     
         }
                 .mp3_fx {
                     width: 100%; height: 100%;
                     backdrop-filter: blur(0px);
                     transition: 0.2s;
                     background-color: rgba(255, 255, 255, 0.1);
                 }
                 
                 .mp3_fx:hover {
                     backdrop-filter: blur(5px);
                     background-color: rgba(255, 255, 255, 0.4);
                 }
                 
                  
   .mp3_title {
    padding: 3px;
       display: -webkit-box;
    -webkit-line-clamp: 5;/* обрезать до строк */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    overflow-wrap: break-word; /* Переносить длинные слова на новую строку */
       
    font-size: 60%;
    line-height: 0.9;
    font-weight: 600; color: #4c26e5;
        
}


.echo_d {
  opacity: 1; /* Изначально установите непрозрачность на 1 */
 animation: fadeIn 0.3s ease-in-out forwards;
}

@keyframes fadeIn {
  from {
    opacity: 0; /* Начальное значение анимации */
  }
  to {
    opacity: 1; /* Конечное значение анимации */
  }
}






.sec{font-size: 65%; text-align: left; 
position: relative; top: -70px; 
margin-left: 95px;
z-index: 2;
font-weight: 400;
color: #4c4c4c;
letter-spacing: 1px;
}

.box_download {background: #f8f9fa; -webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px; border: 1px #dfdfdf solid;}


/* Рекомендации */
 .recom0 {   
-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;
     -webkit-transform: scale(0.95); transform: scale(0.95);
    
}
 .recom1 {
overflow: hidden;      
 margin: 0px; font-weight: 600;
   
}
.recom1 img { 
position: relative;
-webkit-transform: scale(1.3); transform: scale(1.3);  
-webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out;
}       
.recom1:hover img {
-webkit-transform: scale(1); transform: scale(1);

} 
.recom1:active img {
-webkit-transform: scale(1.3); transform: scale(1.3);  
-webkit-transition: 0.1s ease-in-out; transition: 0.1s ease-in-out;
} 








.recom1 figcaption{
  position: absolute;
  background-color: rgba(0,0,0,0.60); color: #FFFFFF; font-size: 70%; padding-left: 4px;
  bottom: 0px;  width: 100%;
  white-space: nowrap; /* Текст не переносится */
  overflow: hidden; /* Обрезаем всё за пределами блока */
   text-overflow: ellipsis; /* Добавляем многоточие */
    
    

    
}
          
    .recom1 div{
    white-space: nowrap; /* Текст не переносится */
    overflow: hidden; /* Обрезаем всё за пределами блока */
    background-color: #3333cc; color: #FFFFFF;
    -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; 
    position: absolute;
    color: #FFFFFF; font-size: 60%; padding: 1px 3px;
    top: 2px; right: 2px;
}
          
          
          
   .recom_gCat figcaption{
    background-color: rgba(51,51,204,0.70)!important;
    }  
          
          

.recomAll {
overflow: hidden; -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; 
 margin: 0px 5px 5px 0px; font-weight: 600;          
}
.recomAll-img {
position: relative; width: 80px; height: 80px;
-webkit-transform: scale(1); transform: scale(1); -webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out;
}       
.recomAll-img:hover { -webkit-transform: scale(1.3);transform: scale(1.3);  
} 
.recomAll-img:active { -webkit-transform: scale(1); transform: scale(1);  -webkit-transition: 0.1s ease-in-out; transition: 0.1s ease-in-out;
} 
.recomAll-figcaption{
  position: absolute; background-color: #000000; color: #FFFFFF; font-size: 70%; padding-left: 4px;
  bottom: 0px;  width: 80px;
 white-space: nowrap; /* Текст не переносится */ overflow: hidden; /* Обрезаем всё за пределами блока */
 text-overflow: ellipsis; /* Добавляем многоточие */
}    
    .recomAll-div{
    white-space: nowrap; /* Текст не переносится */
    overflow: hidden; /* Обрезаем всё за пределами блока */
    background-color: #3333cc; color: #FFFFFF;
    -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; 
    position: absolute;
    color: #FFFFFF; font-size: 60%; padding: 1px 3px;
    top: 2px; right: 2px;
}
/* Рекомендации .end */  















/* Рекомендации */
 .recom {
position: relative;
overflow: hidden;      
-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; 
 margin: 0px 5px 5px 0px; font-weight: 600;          
}
.recom img {
position: relative;
width: 80px; height: 80px;
-webkit-transform: scale(1); transform: scale(1);
-webkit-transition: 0.2s ease-in-out; transition: 0.2s ease-in-out;
}       
.recom:hover img {
-webkit-transform: scale(1.3);
transform: scale(1.3);  
} 
.recom:active img {
-webkit-transform: scale(1); transform: scale(1); 
-webkit-transition: 0.1s ease-in-out; transition: 0.1s ease-in-out;
} 
.recom figcaption{
  position: absolute;
  background-color: #000000; color: #FFFFFF; font-size: 70%; padding-left: 4px;
  bottom: 0px;  width: 80px;
    white-space: nowrap; /* Текст не переносится */
    overflow: hidden; /* Обрезаем всё за пределами блока */
    text-overflow: ellipsis; /* Добавляем многоточие */
    
}
          
    .recom div{
    white-space: nowrap; /* Текст не переносится */
    overflow: hidden; /* Обрезаем всё за пределами блока */
    background-color: #3333cc; color: #FFFFFF;
    -webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px; 
    position: absolute;
    color: #FFFFFF; font-size: 60%; padding: 1px 3px;
    top: 2px; right: 2px;
}
          
.recom_flex {
    display: flex;
    flex-wrap: wrap;
          }



.recom_gCat figcaption{
    background-color: #3333cc!important;
    }
.recom_gCat div{
    background-color: #3333cc!important;
    }




.recom_all figcaption{
    background-color: #b1bfcc!important;
    }
.recom_all div{
    background-color: #b1bfcc!important; color: #FFFFFF;
   
    }




/* анимация */
.recom1 figcaption {
  display: inline-block;
  white-space: nowrap;
  overflow: hidden;
  width: calc(100% + 250px); /* Увеличиваем ширину блока на величину прокрутки */
  transition: transform 2s;
  text-overflow: ellipsis; /* Добавляем многоточие в конце текста */
}

.recom1:hover figcaption {
  transform: translateX(-250px); /* Прокрутка на 250px влево */
  transition: transform 12s linear;
}










/* Рекомендации .end */


.bg_red{background: rgba(255,196,197,1.00)!important;}


/* мини плеер - только кнопка */
.miniPlay {width: 30px; height: 30px; 
    transform: scale(0.95);
    transition: 0.2s ease; /* Добавляем переход */
    overflow: visible;
    
}

.miniPlay:hover  {
    transform: scale(1);
}

.miniPlay:active  {
    transform: scale(0.95);
}

.mini_player{}/* мини плеер - весь контейнер */

.CSS-GcatMarker {background: #ADADD8; cursor: pointer;}
.CSS-GcatMarker:hover {background: #3333CC;}

.overflow-hidden {overflow: hidden;}

.pointer {cursor: pointer;}
.img-circle { border-radius: 50%;}

.opas0 {opacity: 0.6; }

.icon {width: 16px; height: auto; vertical-align: middle; }


.tags {color: #6c757d; 
 overflow-wrap: break-word;  /* не поддерживает IE, Firefox; является копией word-wrap */ 
  word-wrap: break-word;
  word-break: keep-all;  /* не поддерживает Opera12.14, значение keep-all не поддерживается IE, Chrome */ 
  line-break: normal;  /* нет поддержки для русского языка */ 
 -webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto;  /* значение auto не поддерживается Chrome */ 
  width: 50%;   
    
}
a.tags {color: #6c757d!important;}

/* анимация монетки*/

@keyframes coinFlip {
  0%, 100% {
    transform: rotateY(0deg);
    filter: brightness(2);
  }
  10%, 100% {
    transform: rotateY(360deg);
    filter: brightness(1);
  }
}
.coin-animation {
  animation: coinFlip 6s infinite;
}



.ico_cc{width: 16px; height: auto; vertical-align: middle; margin-left: 3px;}

.ico{
	height: 20px;
    width: auto;
    vertical-align: middle;
    margin-top: -3px;
}

.catimg{
    max-width: 100%; 
    height: auto; 
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;}



a:link, a:visited {}
a:hover, a:active {}

a { /* анимация */
-webkit-transition-duration: 0.2s; 
-o-transition-duration: 0.2s; 
-moz-transition-duration: 0.2s; 
transition-duration: 0.2s;  
}







.logo_mobile{width: 50px!important; width: auto; } 

.logo{
    max-width: 150px!important;
    height: auto;
     transition: filter 0.3s ease; /* Добавляем переход */
}

.logo:hover {
    filter: brightness(0.8); /* Изменяем яркость при наведении */
}










.logo_min{margin-left:5px; 
	width: 45px;
	height: 34px;
}

.nowrap {white-space: nowrap!important;;}

.h_nep {font-family:"Blogger Sans Bold"; color:#000;}
.pp_title {font-family:"Blogger Sans Bold"; color:#000; margin-left: 20px; font-size: 120%;}
.pp_login {font-family:"Blogger Sans Bold"; color:#000; font-size: 100%; white-space:nowrap;}
.pp_balans {font-weight: 700; font-size: 90%; white-space:nowrap; }
.ava_min {width: 45px; height: 45px;  border-radius: 50%;-webkit-border-radius: 50%; -moz-border-radius: 50%;}
.cost {color:#000; font-size: 150%; font-weight: bold;}


.green{color: #297B00 !important;}


.rev-img { height: 30px; width: auto;}
.rev-img-big { height: 60px; width: auto;}

.brand_mid{ 
    width: 50px;
    height: auto;
    vertical-align: middle;
    margin-right: 10px;
}

.brand_sm{ 
    width: 16px;
    height: auto;
    vertical-align: middle;
    margin-right: 5px;
}

.brand-card
{ 
	-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
    border: 1px #E7E7E7 solid;
	}
	
	.footer_new {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 100px; /* Set the fixed height of the footer here */

}
	
.p_stat{
    -webkit-border-radius: 25px;
-moz-border-radius: 25px;
border-radius: 25px;
    border: 10px #FFFFFF solid;
    background: #F5F5F5;
    margin: 10px!important;
    font-size: 120%;
    
    
}

.nowrap {white-space: nowrap;}

.tittle_cut {
	white-space: nowrap; 
    overflow: hidden;
    padding: 5px;
    text-overflow: ellipsis;
}

.alert_start_img {color: #FF3400; margin-top: 20px;}
.alert_start_img_ico { width: 20px; height: 20px; vertical-align: middle;}

.embed-responsive .card-img-top {
    object-fit: cover;
}
.w600 {font-weight: 600;}
.cost_old{color: #FF3A00; font-weight: 500; font-size: 80%; text-decoration: line-through; }
.cost_old2{color: #FF3A00; font-weight: 500;}
.cost_new{color: #000; padding:0px 5px 0px 5px; background: #FFCC00;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px; 
}

.bold {font-weight:bold;}

.rtng {
	-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px; 
	font-size: 85%; 
	padding: 0px 5px; 
	width: 30px; 
	display: inline-block; 
	vertical-align: middle; 
	text-align: center;
	color: #FFFFFF; 
	cursor: default;
}

.rtng-1 {background: #f99f47;}
.rtng-2 {background: #f6c001;}
.rtng-3 {background: #c1c712;}
.rtng-4 {background: #359e00;}
.rtng-5 {background: #297B00;}

.display-none  {display: none;} 
.displa-block  {display: block;}


.search {
    width: 100%; height: 40px; color: #393939; font-size: 20px; padding: 0px 10px;
    padding-right: 75px; /* отступ справа под иконки */
     -webkit-box-shadow: 0px 3px 7px -1px rgba(0,0,0,0.18);
-moz-box-shadow: 0px 3px 7px -1px rgba(0,0,0,0.18);
box-shadow: 0px 3px 7px -1px rgba(0,0,0,0.18);
   border-radius: 3px 3px 3px 3px;
-moz-border-radius: 3px 3px 3px 3px;
-webkit-border-radius: 3px 3px 3px 3px; border: 1px solid #F3F3F3; 
}



/* Контейнер для поля поиска и иконки */
.search-container {
    width: 100%;
    position: relative; /* Позволяет позиционировать иконку внутри контейнера */
    display: inline-block; /* Держит контейнер на одной линии с другими элементами */
}

/* Стилизация иконки поиска */
.search-icon {
    width: 30px; height: auto;
    position: absolute; /* Позиционирует иконку относительно контейнера */
    right: 10px; /* Располагает иконку в 10 пикселях от правого края контейнера */
    top: 6px; /* Выравнивает иконку по вертикали на 50% от высоты контейнера */
    transition: 0.2s ease; /* Добавляем переход */
    cursor: pointer;
} 

.search-icon-clear{
    opacity: 0.3;
    right: 45px; /* Располагает иконку в 10 пикселях от правого края контейнера */
}
.search-icon-clear:hover{
    opacity: 1.0;
}



.search-icon-default{
    transform: scale(1.0);
}

.search-icon-default:active {
    transform: scale(0.90);
}








.gray {color: #CCCCCC;}
.nowrap {white-space: nowrap;}



.img325{ width:325px;}

.name {font-family:MetaPro-Bold; color:#562a8c; font-size:18px;}
.name2 {font-family:MetaPro-Bold; color:#562a8c; display:block; padding: 16px 0px 3px 0px;}
.name_prodpp { font-weight:bold; cursor: pointer;}
.name_prodpp:hover {text-decoration: underline;}

.input-1{width: 325px; height:35px; margin-top:13px; margin-bottom:30px; border:1px solid #a9a9a9; 
font-size: 195%; padding: 0px 2px 0px 5px; color:#666; display:block;}

.input-2{width: 300px; height:25px; margin-top:13px; margin-bottom:20px; border:1px solid #D0D0D0; 
font-size: 125%; padding: 0px 2px 0px 5px; color: #666; display:block;}

.input-plus{width: 20px; height:25px; margin-top:13px; margin-bottom:20px; border:1px solid #D0D0D0; 
font-size: 125%; padding: 0px 0px 0px 0px; color: #666; display: inline; border-right:none; text-align:right;}

.img_fade0{opacity:0.5; filter:alpha(opacity=50); -moz-opacity:0.5;}
.img_fade{opacity:1; filter:alpha(opacity=100); -moz-opacity:1;}

.img_icon{ padding-right:5px; vertical-align:middle;}

.stat_big{padding:4px 10px 4px 10px; background:#D44043;color:#FFFFFF; -webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px; cursor:pointer;}

.txt500 {font-weight: 500;}

.rev-date {font-size: 80%; font-weight: 500; color: #6c757d;}
.rev-stat			{padding:2px 5px; font-weight: 500; font-size: 80%; background: #EEEEEE; color:#000; -webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}
.rev-stat-approved	{padding:2px 5px; font-weight: 500; font-size: 80%; background: #FFCC00; color:#000; -webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}
a.rev-num {font-size: 80%; color: #000000;}
a.rev-num:hover {color: #000000;}

a.noa {color: #000000;}
a.noa:hover {color: #000000;}

.rev-username {font-weight: 500;}
.rev-card {border-bottom: 1px solid #E7E7E7;}


.count-tub {font-size: 80%; color: #000000; padding: 2px 5px; vertical-align: middle;  background: #FFFFFF; font-weight: 500; margin: -2px 0px 0px 0px; display: inline-block; -webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}

.promolink{padding:2px 5px 2px 5px; margin:0px 5px 0px 5px;background: #FFF7C2 !important; color: #000 !important; -webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}

.promo_name_prod{padding:2px 5px 2px 5px; margin:0px 5px 0px 5px;background: #F5F5F5;font-size:13px; -webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px; text-decoration: none!important; text-decoration-color: #000000!important; color: #000000!important;}


.check_promocode_no {padding:10px 10px; margin:10px 5px 0px 5px;background: #F5F5F5; font-weight: 600; -webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px; 
animation: check_promocode linear 25s;animation-fill-mode: forwards;}
.check_promocode_yes {padding:10px 10px; margin:10px 5px 0px 5px;background: #FFFCA5; font-weight: 600; -webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;
animation: check_promocode linear 25s;animation-fill-mode: forwards;}

@keyframes check_promocode{
  0% {
    opacity:0.00; display: block;
    transform:  translate(0px,-10px); 
  }
  1%,99% {
    opacity:1.00;
    transform:  translate(0px,0px)  ;
  }
	
	 100% {
    opacity:0.00;
    transform:  translate(0px,-10px);
	
  }
}


.ord_email {white-space: nowrap; font-size: 80%;}
.ord_name {white-space: nowrap; font-size: 80%; font-weight: 600;}
.ord_prod{padding:2px 5px 2px 5px; margin:0px 5px 0px 5px;background: #F5F5F5;font-size:80%; -webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px; text-decoration: none!important; text-decoration-color: #000000!important; color: #000000!important; text-overflow: ellipsis; overflow: hidden; width: 130px;white-space: nowrap;}
.ord_prod a:link {text-decoration: none; }

.ord_ref {font-size:70%; text-decoration: none!important; color: #000000!important; text-overflow: ellipsis; overflow: hidden; width: 130px;white-space: nowrap; opacity: 0.5; transition: opacity 0.3s, visibility 0s linear 0.3s;}
.ord_ref:hover {opacity: 1.0;}
.ord_ref a:link {text-decoration: none; }


.ord_adres {white-space: nowrap; font-size: 80%;}
.ord_iday {white-space: nowrap; font-weight: 600;}
.ord_comment {font-size: 80%; color: #CFCFCF}
.ord_delivery {font-size: 80%; color: #CFCFCF}

.ord_url {font-size: 100%; font-weight: 600; }
.ord_url a:link {text-decoration: none; }

.ord_id {white-space: nowrap; font-size: 80%;  padding:2px 5px 2px 5px; margin:0px 5px 0px 5px;background: #FBFBFB;}


.all_ord {padding:2px 5px 2px 5px; margin:0px 5px 0px 5px;background: #FFE800; color: #000; font-size: 80%; text-shadow: none!important;}

.pr_promo{padding:2px 5px 2px 5px; margin:0px 5px 0px 5px;background: #F65C5C; color: #FFFFFF; font-weight: 600; -webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px; white-space: nowrap;}
.pr_promo_min{padding:2px 5px 2px 5px; margin:0px 5px 0px 5px;background: #F65C5C; color: #FFFFFF; font-weight: 600; font-size: 80%; -webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px; white-space: nowrap; }

.opt_cost{padding:2px 5px 2px 5px; white-space: nowrap; border: none 2px; margin:0px 5px 0px 5px; background: rgba(0,0,0,0.04); font-weight: 600; -webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}
.dil_cost{padding:2px 5px 2px 5px; margin:0px 5px 0px 5px;background: #F5F5F5; font-weight: 600; -webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}
.sales_ot2{padding:2px 5px 2px 5px; margin:0px 5px 0px 5px;background: #FF2F00;color:#FFFFFF;font-size:13px; -webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}

.stat{padding:2px 5px 2px 5px; margin:0px 5px 0px 5px;background:#D44043;color:#FFFFFF;font-size:13px; -webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px; cursor:pointer;}
.stat_gray{padding:2px 5px 2px 5px; margin:0px 5px 0px 5px;background: #F5F5F5;font-size:13px; -webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}
.stat_green{padding:2px 5px 2px 5px; margin:0px 5px 0px 5px;background: #91DD2C; color:#FFFFFF; font-size:13px; -webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}
.stat_yellow{padding:2px 5px 2px 5px; margin:0px 5px 0px 5px;background: #FFD600; color:#FFFFFF; font-size:13px; -webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}
.stat_url{padding:5px 10px 5px 10px; margin:0px 5px 0px 5px;background: #F5F5F5;font-size:13px; -webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}
.stat_num{padding:2px 7px 2px 7px; border:1px solid #EDEDED; background: #F5F5F5; color:#CBCBCB; text-shadow: 1px 1px 0px #FFFFFF; -webkit-border-radius:14px;-moz-border-radius:14px;border-radius:14px;}
.stat_num2{padding:1px 6px; font-size: 80%; border:1px solid #EDEDED; background: #F5F5F5; color:#CBCBCB; text-shadow: 1px 1px 0px #FFFFFF; -webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px;}



.stat_hist{white-space: nowrap; line-height: 25px; padding:2px 5px 2px 5px; margin:0px 3px 0px 3px;background: #F5F5F5;font-size:13px; -webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px; color: #BBBBBB;}

.category{padding:2px 5px 2px 5px; margin:0px 2px 0px 2px;background: #F5F5F5;font-size: 65%; -webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}
.stat2{padding:2px 5px 2px 5px; margin:0px 2px 0px 2px;background: #FF2F00; color: #FFFFFF; font-weight: 600; font-size: 65%; -webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;}

.allRev_red{color: #FF2F00; font-size: 80%; font-weight: 500;}
.allRev_black{color: #000;  font-size: 80%;}


.form_border {border:#D8D8D8 1px solid; height:26px; padding-left:5px; padding-right:2px;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;}
.date{ font-size: 80%; color: #CFCFCF;}
.div_stat{ float:left; width:80px;}


.microupdate {padding:2px 5px 2px 5px; margin:0px 5px 0px 5px;background: #007bff; display: inline-block; color:#FFFFFF; font-size:13px; -webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;
animation: microupdate linear 3s;animation-fill-mode: forwards; 
}
@keyframes microupdate{
  0% {
    opacity:0.00; display: block;
    transform:  translate(0px,-10px); 
  }
  5%,95% {
    opacity:1.00;
    transform:  translate(0px,0px)  ;
  }
	
	 100% {
    opacity:0.00;
    transform:  translate(0px,-10px);
	
  }
}





.input-1{width: 325px; height:35px; margin-top:13px; margin-bottom:30px; border:1px solid #a9a9a9; 
font-size: 195%; padding: 0px 2px 0px 5px; color:#666;}


input:disabled {
opacity:0.6;filter:alpha(opacity=60);-moz-opacity:0.6;
}


.new_add{
  animation: new_add linear 0.3s;
  animation-iteration-count: 1;
  transform-origin: 50% 50%;
  -webkit-animation: new_add linear 0.3s;
  -webkit-animation-iteration-count: 1;
  -webkit-transform-origin: 50% 50%;
  -moz-animation: new_add linear 0.3s;
  -moz-animation-iteration-count: 1;
  -moz-transform-origin: 50% 50%;
  -o-animation: new_add linear 0.3s;
  -o-animation-iteration-count: 1;
  -o-transform-origin: 50% 50%;
  -ms-animation: new_add linear 0.3s;
  -ms-animation-iteration-count: 1;
  -ms-transform-origin: 50% 50%;
}

@keyframes new_add{
  0% {
    opacity:0.07;
    transform:  translate(0px,-42px)  ;
  }
  100% {
    opacity:1.00;
    transform:  translate(0px,0px)  ;
  }
}

@-moz-keyframes new_add{
  0% {
    opacity:0.07;
    -moz-transform:  translate(0px,-42px)  ;
  }
  100% {
    opacity:1.00;
    -moz-transform:  translate(0px,0px)  ;
  }
}

@-webkit-keyframes new_add {
  0% {
    opacity:0.07;
    -webkit-transform:  translate(0px,-42px)  ;
  }
  100% {
    opacity:1.00;
    -webkit-transform:  translate(0px,0px)  ;
  }
}

@-o-keyframes new_add {
  0% {
    opacity:0.07;
    -o-transform:  translate(0px,-42px)  ;
  }
  100% {
    opacity:1.00;
    -o-transform:  translate(0px,0px)  ;
  }
}

@-ms-keyframes new_add {
  0% {
    opacity:0.07;
    -ms-transform:  translate(0px,-42px)  ;
  }
  100% {
    opacity:1.00;
    -ms-transform:  translate(0px,0px)  ;
  }
}










@font-face {
    font-family: MetaPro-Bold; /* Гарнитура шрифта */
    src: url(/img/style/MetaPro_Bold.otf); /* Путь к файлу со шрифтом */
   }
   
   
   #tooltip{
	background: #FAF9F5;
	color: #666;
	font: menu;
	margin: 0px;
	padding: 3px 5px;
	position: absolute;
	visibility: hidden;
	border-radius: 3px;
	border-bottom:1px solid #a9a9a9;
	-moz-border-radius: 3px;
	-khtml-border-radius: 3px;
	text-shadow: 0 1px 0 #fff;
	background-color:  #FAF9F5;
 filter:progid:DXImageTransform.Microsoft.gradient (startColorstr=#000000,endColorstr=#000000);
 z-index:9999;
 }
     
   /* Button alexbruni.ru */
.sbmt {
color: #6e6e6e;
font: bold 12px Helvetica, Arial, sans-serif;
text-decoration: none;
padding: 7px 12px;
position: relative;
outline: none;
display: inline-block;
text-shadow: 0 1px 0 #fff;
-webkit-transition: border-color .218s;
-moz-transition: border .218s;
-o-transition: border-color .218s;
transition: border-color .218s;
background: #f3f3f3;
background: -webkit-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
background: -moz-linear-gradient(linear,0% 40%,0% 70%,from(#F5F5F5),to(#F1F1F1));
border: solid 1px #d8d8d8;
border-radius: 2px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
margin-right: 10px;
}
 
.sbmt:hover{
color: #333;
border-color: #c6c6c6;
-moz-box-shadow: 0 2px 0 rgba(0, 0, 0, 0.2) -webkit-box-shadow:0 2px 5px rgba(0, 0, 0, 0.2);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
}
.sbmt:active{
color: #000;
border: solid 1px #c6c6c6;
background: -webkit-linear-gradient(top,#EEE,#E0E0E0);
background: -moz-linear-gradient(top,#EEE,#E0E0E0);
background: -ms-linear-gradient(top,#EEE,#E0E0E0);
background: -o-linear-gradient(top,#EEE,#E0E0E0);
background: linear-gradient(top,#EEE,#E0E0E0);
-webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
-moz-box-shadow: inset 0 1px 2px rgba(0,0,0,.1);
box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1);
}


.sbmt_color_gray { background:#FFFFFF;}


    .cat { margin-right:0px; margin-bottom:8px; float:left;  background:#ECEBE8; padding:10px 20px 10px 20px; color:#666; cursor:pointer; font-family:MetaPro-Bold;}
	
	.cat_b { background: #F3F3F3;}
	
	.cat_l {-webkit-border-top-left-radius: 3px; -webkit-border-bottom-left-radius: 3px; -moz-border-radius-topleft: 3px; -moz-border-radius-bottomleft: 3px; border-top-left-radius: 3px; border-bottom-left-radius: 3px; }
	.cat_r {-webkit-border-top-right-radius: 3px;-webkit-border-bottom-right-radius: 3px;-moz-border-radius-topright: 3px;-moz-border-radius-bottomright: 3px;border-top-right-radius: 3px;border-bottom-right-radius: 3px;}
   
   
   
   .newsblock {display:table-cell; float:left; margin-right:8px; margin-bottom:15px; width:320px; height:180px; background:#ECEBE8;
   -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; }
   
  .newsblock2 { width:320px; height:100px; margin-top: 80px; padding:10px 10px 0px 20px; color:#FFFFFF; background: url(/img/newsblock_bg.png); background-position:bottom; background-repeat:repeat-x; text-shadow: 0px 1px 0px #000000; font-family:MetaPro-Bold;-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}
   
   
   
   
   
   
   
  .payment { width:50px; height:auto; margin-bottom:0px;}
  .payment2 { width:60px; height: auto; margin-bottom:0px;}
.payment3 { max-width:270px; height: auto; margin-bottom:0px;}
  
  .bodyclass {border-top:#E9E8E0 3px solid; padding-left:10px; padding-top:10px;} 
  .footer {padding-left:20px; background-color: #F3F3F3; margin-top: 50px; padding-top: 50px; padding-bottom: 30px; border-top: 2px solid #E3E3E3;}
   
   
  .slider {
		z-index: 9;
		width: 320px;
		height: 180px;
		overflow: hidden;
		margin: 0 0 7px;
		position: relative;
	}
	.slider ul,
	.slider li {
		padding: 0;
		margin: 0;
		list-style-type: none;
	}
	.slider ul {
		width: 9999px; 
	}
	.slider ul li {
		list-style-type: none;
		float: left;
		width: 320px;
		height: 180px;
	}
	.slider .nav {
		position: absolute;
		left: 10px;
		bottom: 5px; 
	}
	.slider .nav span {
		opacity: 0.9;
		background: #fff;
		margin: 0 5px 0 0;
		width: 16px;
		height: 10px;
		-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
border:#FFFFFF 2px solid;
		
		cursor: pointer;
		overflow: hidden;
		display: block;
		float: left;
	}
	.slider .nav span.on {
		background-image: -webkit-linear-gradient(270deg,rgba(71,138,255,1.00) 0%,rgba(70,131,235,1.00) 100%); background-image: -moz-linear-gradient(270deg,rgba(71,138,255,1.00) 0%,rgba(70,131,235,1.00) 100%); background-image: -o-linear-gradient(270deg,rgba(71,138,255,1.00) 0%,rgba(70,131,235,1.00) 100%); background-image: linear-gradient(180deg,rgba(71,138,255,1.00) 0%,rgba(70,131,235,1.00) 100%);
		
	}
	
	
	
	
	
	
	
	
	
	
	
	
	
.element-animation{
  animation: animationFrames linear 0.3s;
  animation-iteration-count: 1;
  transform-origin: 50% 50%;
  animation-fill-mode:forwards; /*when the spec is finished*/
  -webkit-animation: animationFrames linear 0.3s;
  -webkit-animation-iteration-count: 1;
  -webkit-transform-origin: 50% 50%;
  -webkit-animation-fill-mode:forwards; /*Chrome 16+, Safari 4+*/ 
  -moz-animation: animationFrames linear 0.3s;
  -moz-animation-iteration-count: 1;
  -moz-transform-origin: 50% 50%;
  -moz-animation-fill-mode:forwards; /*FF 5+*/
  -o-animation: animationFrames linear 0.3s;
  -o-animation-iteration-count: 1;
  -o-transform-origin: 50% 50%;
  -o-animation-fill-mode:forwards; /*Not implemented yet*/
  -ms-animation: animationFrames linear 0.3s;
  -ms-animation-iteration-count: 1;
  -ms-transform-origin: 50% 50%;
  -ms-animation-fill-mode:forwards; /*IE 10+*/
}

@keyframes animationFrames{
  0% {
    opacity:1;
    transform:  ;
  }
  100% {
    opacity:0.8;
    transform:  ;
  }
}

@-moz-keyframes animationFrames{
  0% {
    opacity:1;
    -moz-transform:  ;
  }
  100% {
    opacity:0.8;
    -moz-transform:  ;
  }
}

@-webkit-keyframes animationFrames {
  0% {
    opacity:1;
    -webkit-transform:  ;
  }
  100% {
    opacity:0.8;
    -webkit-transform:  ;
  }
}

@-o-keyframes animationFrames {
  0% {
    opacity:1;
    -o-transform:  ;
  }
  100% {
    opacity:0.8;
    -o-transform:  ;
  }
}

@-ms-keyframes animationFrames {
  0% {
    opacity:1;
    -ms-transform:  ;
  }
  100% {
    opacity:0.8;
    -ms-transform:  ;
  }
}